/* Homepage reference-inspired posters. Copy remains in content/home.json and HTML. */
.page-index .home-poster{position:relative;display:flex;flex-direction:column;min-width:0;padding:0;border-radius:22px;overflow:hidden;background:#c7ddcf;border-color:#a9c4b3;isolation:isolate;transition:transform .35s var(--ease)}
.page-index .home-poster:hover,.page-index .home-poster:focus-visible{transform:translateY(-5px)}
.home-poster .poster-artwork{aspect-ratio:320/230;overflow:hidden;margin:0 12px;flex-shrink:0}
.poster-artwork svg{display:block;width:100%;height:100%}
.home-poster .poster-copy{padding:8px 28px 65px;flex:1}
.page-index .home-poster h3{font-size:clamp(1.6rem,2.35vw,2rem);line-height:1.13;margin-bottom:18px;letter-spacing:-.045em}
.home-poster .poster-arrow{position:absolute;bottom:22px;right:26px;font-size:1.7rem;line-height:1;transition:transform .3s var(--ease)}
.home-poster:hover .poster-arrow,.home-poster:focus-visible .poster-arrow{transform:translate(3px,-3px)}
.page-index .poster-google{background:#101d2f;border-color:#23364c;color:#e2ece4}
.page-index .poster-google p{color:#c7d8cc}
.page-index .poster-demo{background:#fcc04e;border-color:#d9a136}
.page-index .poster-demo p{color:#394430}
.poster-object{transform-box:fill-box;transform-origin:center;transition:transform .6s var(--ease)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.home-poster:hover .browser-object{transform:rotate(-3deg) translateY(-3px)}.home-poster:hover .map-object{transform:rotate(3deg) translateY(-3px)}.home-poster:hover .clock-object{transform:rotate(-3deg)}}
@keyframes poster-assemble{from{transform:translateY(12px) scale(.97);opacity:.45}to{transform:none;opacity:1}}
@keyframes poster-hand{from{transform:rotate(-90deg)}to{transform:rotate(0)}}
.clock-hand{transform-origin:154px 111px}
@media(prefers-reduced-motion:no-preference){
html:not(.motion-paused) .home-poster.poster-enter .poster-piece{animation:poster-assemble .8s var(--ease) both}
html:not(.motion-paused) .home-poster.poster-enter .piece-2{animation-delay:.12s}
html:not(.motion-paused) .home-poster.poster-enter .piece-3{animation-delay:.24s}
html:not(.motion-paused) .home-poster.poster-enter .clock-hand{animation:poster-hand 1.2s var(--ease) both}
}
@media(max-width:600px){.home-poster .poster-artwork{max-height:210px}.home-poster .poster-copy{padding:6px 24px 60px}.page-index .home-poster h3{font-size:1.8rem}.home-poster .poster-object{transition:none}}
@media(prefers-reduced-motion:reduce){.page-index .home-poster,.home-poster *{animation:none!important;transition:none!important;transform:none!important}}
html.motion-paused .home-poster,html.motion-paused .home-poster *{animation:none!important;transition:none!important;transform:none!important}
