/* R14: semantic imagery and a stable, single-selection principle panel. */
#why-mass .design-split{align-items:start}
#why-mass .design-feature-photo{height:470px;min-height:470px;align-self:start;isolation:isolate}
#why-mass .design-feature-photo>img{object-position:center 42%;transform:none!important;transition:opacity .2s ease}
#why-mass .design-feature-photo:after{background:linear-gradient(180deg,transparent 40%,rgba(26,16,21,.82))}
#why-mass .design-feature-photo figcaption{bottom:28px;left:28px;right:28px}
#why-mass .design-feature-photo h2{font-size:32px;line-height:1.3;margin:10px 0}
#why-mass .design-feature-photo figcaption p{margin:0;max-width:30em;font-size:15px;line-height:1.65}
#why-mass .design-principles{min-width:0}
#why-mass details{transition:background-color .18s ease;border-radius:8px;padding:15px 12px}
#why-mass details[open]{background:rgba(255,255,255,.09)}
#why-mass summary{cursor:pointer;border-radius:4px;line-height:1.5;min-height:38px}
#why-mass summary:hover{color:#f5dbb8}
#why-mass summary:focus-visible{outline:2px solid #f5dbb8;outline-offset:5px}
#why-mass details p{margin:10px 0 0 42px;line-height:1.75}
.card-image>img[data-ai-scene]{object-position:center 42%}
#projects .card-image{height:190px;min-height:190px}
#projects .card-image>img[data-ai-scene]{object-position:center 36%}
.home-paging #projects{height:auto;min-height:100dvh}
.ai-image-note{font-size:12px;line-height:1.7;opacity:.78;margin:16px 0 0}
.design-guide h3{overflow-wrap:anywhere;line-height:1.45}
@media(min-width:1101px){#why-mass .design-feature-photo{height:clamp(430px,55vh,520px);min-height:430px}}
@media(max-width:720px){#why-mass .design-feature-photo{height:320px;min-height:320px}#why-mass .design-feature-photo figcaption{left:22px;right:22px;bottom:22px}#why-mass .design-feature-photo h2{font-size:27px}#why-mass details{padding:15px 8px}#why-mass details p{margin-left:0}}
@media(prefers-reduced-motion:reduce){#why-mass .design-feature-photo>img,#why-mass details{transition:none}}
