/* v10.3 — make the concrete Project North case visible with the film in section 04. */
#demo .demo-layout{align-items:start}
#demo .demo-copy{align-self:center}
#demo .v103-case-intro{margin:0 0 13px;display:flex;flex-direction:column;gap:4px}
#demo .v103-case-intro>span{font-size:10px;font-weight:800;color:#3773ad;letter-spacing:.13em}
#demo .v103-case-intro>strong{font-size:18px;line-height:1.35;letter-spacing:-.015em;color:#152941}
#demo .v103-case-intro>p{font-size:13px;line-height:1.4;color:#516176;margin:3px 0 0}
#demo .v102-demo-reading{grid-column:auto;margin:14px 0 0;width:100%}
#demo .v102-demo-comparison{gap:10px}
#demo .v102-example-card{min-height:0;padding:14px 16px;border-radius:13px}
#demo .v102-example-card>span{font-size:10px;margin-bottom:7px}
#demo .v102-example-card>strong{font-size:16px;line-height:1.22}
#demo .v102-example-card p{font-size:12.5px;line-height:1.45;margin-top:6px}
#demo .film-note{margin-top:9px;font-size:11px;line-height:1.45}
@media(max-width:720px){
  #demo .demo-layout{gap:21px}
  #demo .demo-copy{align-self:start}
  #demo .v103-case-intro>strong{font-size:16px}
  #demo .v102-demo-comparison{grid-template-columns:1fr;gap:9px}
  #demo .v102-example-card{padding:13px 15px}
}