/* 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; }
.home-page { --text:var(--navy); --muted:var(--navy); --button-ink:var(--navy); color:var(--navy); }
.camera-home { background:var(--white, #fff); color:var(--navy); position:relative; --camera-top:var(--site-header-height,76px); }
.camera-home-pin { position:relative; height:calc(100svh - var(--camera-top)); min-height:420px; }
.camera-home.is-camera-ready { height:240svh; }
.viewfinder-hero[data-camera-destination] { min-height:var(--camera-pin-height, calc(100svh - var(--site-header-height,76px))); }
.camera-home.is-camera-ready + [data-camera-destination] {
 position:relative;
 z-index:2;
 margin-top:calc(-1 * var(--camera-pin-height, calc(100svh - 76px)));
 opacity:var(--camera-reveal, 0);
}
.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%; visibility:hidden; }
.is-camera-painted .camera-home-stage canvas { visibility:visible; }
.camera-home-stage:focus-visible { outline:3px solid #24766d; outline-offset:-6px; }
.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 #hero-title { font-size: var(--type-display); line-height:1.08; letter-spacing:0; margin:0 0 24px; -webkit-text-stroke:0.3px currentColor; }
.camera-home-intro #hero-title > span { display:block; }
.hero-last-word { white-space:nowrap; }
.hero-typing-dots { display:inline-flex; width:0.66em; vertical-align:baseline; }
.hero-typing-dots > span { display:inline-block; flex:0 0 0.22em; text-align:center; animation:hero-dot-bounce 4.8s ease-in-out infinite; }
.hero-typing-dots > span:nth-child(2) { animation-delay:0.16s; }
.hero-typing-dots > span:nth-child(3) { animation-delay:0.32s; }
.camera-home-intro[inert] .hero-typing-dots > span { animation-play-state:paused; }
@keyframes hero-dot-bounce {
 0%, 16%, 100% { transform:translateY(0); }
 8% { transform:translateY(-0.045em); }
}
@media(prefers-reduced-motion:reduce) {
 .hero-typing-dots > span { animation:none; opacity:1; }
}
.camera-home-intro p { font-size: var(--type-lead); line-height:1.6; max-width:420px; }
.camera-home-intro a { pointer-events:auto; max-width:100%; margin-top:20px; text-decoration:none; }
.camera-home-intro a i { flex-shrink:0; }
.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: var(--type-card); 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; }
html[data-theme="dark"] .camera-home { background:#08111f; color:var(--navy); }
html[data-theme="dark"] .camera-home-intro #hero-title,
html[data-theme="dark"] .camera-home-intro p,
html[data-theme="dark"] .camera-home-controls a { color:var(--navy); }
html[data-theme="dark"] .camera-home-controls button { background:#101b2f; color:#f4f8ff; border-color:#65748c; }
.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 #hero-title { font-size: var(--type-display); margin-bottom:14px; }
 .camera-home-intro p { font-size: var(--type-body); 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: var(--type-card); }
}
@media(max-height:600px) and (min-width:761px) {
 .camera-home-intro { top:12%; }
 .camera-home-intro #hero-title { font-size: var(--type-section); }
}
@media(min-width:761px) and (orientation:portrait) {
 .camera-home-intro { top:8%; left:32px; width:calc(100% - 64px); max-width:620px; }
 .camera-home-intro #hero-title { font-size: var(--type-display); }
 .camera-home-fallback { top:48%; right:15%; width:70%; height:42%; }
}
@media(max-width:760px) and (max-height:700px) and (orientation:portrait) {
 .camera-home-intro { top:5%; }
 .camera-home-intro #hero-title { font-size: var(--type-section); margin-bottom:10px; }
 .camera-home-intro p { font-size: var(--type-body); line-height:1.4; margin:10px 0; }
 .camera-home-intro a { margin-top:6px; }
}
@media(max-height:600px) and (orientation:landscape) {
 .camera-home-pin { min-height:0; }
 .camera-home-intro { left:24px; top:10%; width:43%; }
 .camera-home-intro #hero-title { font-size: var(--type-section); margin-bottom:10px; }
 .camera-home-intro p { font-size: var(--type-body); line-height:1.4; margin:10px 0; }
 .camera-home-intro a { margin-top:4px; font-size:13px; }
 .camera-home-controls { bottom:12px; }
}