/* Homepage media mockup only. All following sections retain production styling. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0;align-items:center;gap:32px;width:min(1200px,calc(100% - 96px));margin:32px auto 0;overflow:visible}
.hero .hero-photo{position:relative;inset:auto;grid-column:2;grid-row:1;width:100%;aspect-ratio:1;isolation:isolate}
.hero .hero-photo:after{display:none}
.hero .hero-copy{grid-column:1;grid-row:1;width:100%;margin:0;padding:36px 0;z-index:auto}
.hero .hero-copy h1{font-size:clamp(32px,3.5vw,50px);line-height:1.18;max-width:100%}
.hero .hero-copy>.eyebrow{font-size:10px;letter-spacing:.16em;margin-bottom:18px}
.hero .hero-copy>p:not(.eyebrow){font-size:15px;max-width:390px;margin-top:22px}
.hero .actions{gap:12px;margin-top:26px}
.hero .button{font-size:12px;padding:12px 16px;gap:15px}
.video-preview video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#141413}
.video-preview .video-controls{position:absolute;right:12px;bottom:10px;z-index:4;display:flex;gap:8px}
.video-controls button{border:1px solid #d8b97980;border-radius:8px;background:#141413e8;color:#f3eee5;padding:6px 10px;font-size:11px}
@media(max-width:1000px) and (min-width:761px){.hero{width:calc(100% - 56px);gap:24px}.hero .hero-copy h1{font-size:34px}}
@media(max-width:760px){.hero{display:flex;flex-direction:column;align-items:stretch;width:100%;gap:0;margin:0}.hero .hero-photo{width:100%;aspect-ratio:1;flex:none}.hero .hero-copy{width:calc(100% - 40px);margin:0 auto;padding:27px 0 30px}.hero .hero-copy h1{font-size:32px;line-height:1.16}.hero .hero-copy>.eyebrow{font-size:9px;margin-bottom:12px}.hero .hero-copy>p:not(.eyebrow){font-size:14px;margin-top:16px}.hero .actions{margin-top:20px}.hero .button{padding:12px 13px}}