/* Clipping must not create a separate scroll container above the sticky stage. */
html:has([data-camera-home]), body:has([data-camera-home]) { overflow-x:clip; }
.camera-home { background:#f7f8f9; color:#202327; position:relative; --camera-top:76px; }
.camera-home-pin { position:relative; height:calc(100svh - var(--camera-top)); min-height:420px; }
.camera-home.is-camera-ready { height:240svh; }
.is-camera-ready .camera-home-pin { position:sticky; top:var(--camera-top); }
.camera-home-stage { position:absolute; inset:0; touch-action:pan-y; }
.camera-home-stage canvas { display:block; width:100%; height:100%; }
.camera-home-intro { position:absolute; left:max(24px,calc((100% - 1200px)/2)); top:28%; width:43%; max-width:510px; z-index:1; pointer-events:none; }
.camera-home-intro h1 { font-size:56px; line-height:1.08; letter-spacing:0; margin:0 0 24px; }
.camera-home-intro h1 span { display:block; }
.camera-home-intro p { font-size:19px; line-height:1.6; max-width:420px; }
.camera-home-intro a { pointer-events:auto; display:inline-block; margin-top:20px; color:inherit; text-underline-offset:6px; }
.camera-home-fallback { position:absolute; right:6%; top:20%; width:36%; height:55%; object-fit:contain; }
.is-camera-ready .camera-home-fallback { display:none; }
.camera-home-controls { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); width:min(680px,calc(100% - 32px)); display:grid; grid-template-columns:48px minmax(0,1fr) 48px; gap:18px; align-items:center; }
.camera-home-controls[hidden] { display:none; }
.camera-home-controls button { width:48px; height:48px; border:1px solid #ccc; border-radius:50%; background:#fff; color:#181a1c; cursor:pointer; }
.camera-home-controls h2 { text-align:center; font-size:22px; margin:0; line-height:1.3; }
.camera-home-controls a { color:#181a1c; text-decoration:none; }
.camera-home-controls a:hover { text-decoration:underline; text-underline-offset:5px; }
.camera-home a:focus-visible,.camera-home button:focus-visible { outline:3px solid #24766d; outline-offset:5px; }
@media(max-width:760px) {
 .camera-home-intro { top:7%; left:24px; width:calc(100% - 48px); max-width:none; }
 .camera-home-intro h1 { font-size:38px; margin-bottom:14px; }
 .camera-home-intro p { font-size:16px; line-height:1.5; max-width:360px; }
 .camera-home-intro a { margin-top:8px; font-size:14px; }
 .camera-home-fallback { top:48%; right:15%; width:70%; height:42%; }
 .camera-home-controls { bottom:24px; gap:10px; }
 .camera-home-controls h2 { font-size:18px; }
}
@media(max-height:600px) and (min-width:761px) {
 .camera-home-intro { top:12%; }
 .camera-home-intro h1 { font-size:38px; }
}
