
/* Architectural editorial rhythm; scoped to selected informational cards. */
:root{--motion-fill:#243c30;--motion-ink:#f8f5ed;--motion-accent:#d1bd83}
.motion-card{position:relative;border-radius:12px;border:1px solid var(--line, #d9dccf);padding:clamp(22px,3vw,38px);overflow:hidden;transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}
.motion-card:focus-within{background:var(--motion-fill);color:var(--motion-ink);border-color:var(--motion-accent);box-shadow:0 14px 36px #0002}
.motion-card:focus-within h3,.motion-card:focus-within p,.motion-card:focus-within a,.motion-card:focus-within span{color:var(--motion-ink)}
.motion-card:focus-within h3,.motion-card:focus-within .service-number{color:var(--motion-accent)}
.motion-title{font:inherit;line-height:inherit;color:inherit;text-align:start;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:7px;transition:text-decoration-color .3s}
.motion-title:hover,.motion-title:focus-visible{text-decoration-color:currentColor}
.motion-stretched-link:after{content:'';position:absolute;inset:0;z-index:1}
.motion-card:focus-within{outline:2px solid var(--motion-accent);outline-offset:3px}
.motion-photo{transform:translate3d(0,var(--motion-y,0px),0) scale(var(--motion-scale,1.025));transform-origin:center;backface-visibility:hidden}
.motion-pending{opacity:0;transform:translate3d(0,22px,0)}
.motion-revealed{animation:motion-enter .7s cubic-bezier(.2,.7,.3,1) var(--motion-delay,0ms) both}
.motion-opening{animation:motion-enter 1s cubic-bezier(.2,.7,.3,1) both}
@keyframes motion-enter{from{opacity:.35;transform:translate3d(0,24px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(hover:hover) and (pointer:fine){
 .motion-card:hover{background:var(--motion-fill);color:var(--motion-ink);border-color:var(--motion-accent);box-shadow:0 14px 36px #0002}
 .motion-card:hover h3,.motion-card:hover p,.motion-card:hover a,.motion-card:hover span{color:var(--motion-ink)}
 .motion-card:hover h3,.motion-card:hover .service-number{color:var(--motion-accent)}
}
@media(prefers-reduced-motion:reduce){.motion-card,.motion-title{transition:none}.motion-photo,.motion-pending{transform:none!important;opacity:1!important}.motion-revealed,.motion-opening{animation:none!important}}
.audience-grid{gap:20px}.audience-grid .motion-card{background-color:#fff}.audience-grid .motion-card:focus-within{background-color:var(--motion-fill)}@media(hover:hover) and (pointer:fine){.audience-grid .motion-card:hover{background-color:var(--motion-fill)}}
