@font-face{font-family:Manrope;src:url('assets/manrope.woff2') format('woff2');font-weight:200 800;font-display:swap}
.christmas-reference{margin:0 6%;padding:64px 0 72px;border-top:1px solid var(--line)}
.christmas-intro{max-width:720px;margin:0 auto;text-align:center}
.christmas-intro h2{font-size:clamp(27px,3.2vw,42px)}
.christmas-intro>p:last-child{max-width:550px;margin:24px auto 0;color:var(--muted);font-size:15px;line-height:1.85}

@font-face{font-family:'DM Sans';src:url('assets/dm-sans.woff2') format('woff2');font-weight:100 1000;font-display:swap}

:root{color-scheme:dark;--bg:#101314;--ivory:#f6f2ea;--orange:#ffa057;--muted:#b9b2ac;--line:#ffffff20}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--ivory);font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible{outline:3px solid var(--ivory);outline-offset:6px}
::selection{background:var(--orange);color:var(--bg)}
.skip{position:fixed;top:12px;left:12px;z-index:10;background:var(--ivory);color:var(--bg);padding:12px;transform:translateY(-160%)}
.skip:focus{transform:none}
.header{position:absolute;z-index:2;top:0;left:0;width:100%;height:108px;display:flex;align-items:center;justify-content:space-between;padding:0 6%}
.brand{display:block}
.brand img{width:132px;height:66px;object-fit:contain}
.header-link{font:600 12px Manrope,Arial,sans-serif;text-decoration:none;border-bottom:1px solid #ffffff50;padding:12px 0}
.header-link span{margin-left:12px;color:var(--orange)}
.hero{min-height:850px;min-height:max(780px,100svh);position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate;overflow:hidden;background:#0c0e0f}
.scene{position:absolute;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 50% 49%,#56291955,transparent 62%)}
.halo{position:absolute;width:700px;height:800px;top:10%;left:50%;transform:translateX(-50%);background:radial-gradient(ellipse,#be57112b,transparent 68%)}
.portal{position:absolute;left:50%;top:17%;bottom:-60px;width:clamp(430px,calc(58vw + 80px),920px);transform:translateX(-50%);border:2px solid #e99051aa;border-bottom:0;border-radius:240px 240px 0 0;background:linear-gradient(90deg,#61361d33,transparent 18%,#06080988 50%,transparent 82%,#61361d33);box-shadow:0 0 12px #f88a4266,inset 0 0 30px #f88a4222,0 0 100px #f88a4222}
.portal:before,.portal:after{content:'';position:absolute;inset:17px;border:1px solid #c6834738;border-bottom:0;border-radius:inherit}
.portal:after{inset:-20px;border-color:#a5744a20}
.floor{position:absolute;inset:76% -30% -50%;background:radial-gradient(ellipse at 50% 0,#ce74383b,transparent 45%),linear-gradient(#10131400,#101314 45%);transform:perspective(350px) rotateX(24deg)}
.mist{position:absolute;inset:45% -25% -5%;background:radial-gradient(ellipse at 30% 70%,#bbc3c512,transparent 48%),radial-gradient(ellipse at 80% 64%,#e0c3a619,transparent 40%);filter:blur(24px)}
.grain{position:absolute;inset:0;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.4' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.hero-content{text-align:center;padding:160px 22px 140px;width:100%}
.eyebrow{font:700 10px/1.6 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.22em;color:var(--orange);margin:0 0 28px}
.hero-reveal{margin:0 0 26px}
.hero-reveal img{display:block;width:100%;max-width:280px;height:auto;margin:0 auto;border-radius:6px;border:1px solid #ffa05755;box-shadow:0 10px 30px #0007,0 0 40px #f88a4222}
.hero-reveal figcaption{margin-top:10px;font:700 10px/1.6 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.16em;color:var(--orange)}
h1,h2,p{margin-top:0}
h1{font-family:Manrope,Arial,sans-serif;margin-bottom:28px}
h1>span{display:block;font-size:clamp(36px,9vw,128px);line-height:1.1;font-weight:800;letter-spacing:-.065em;text-shadow:0 2px 35px #0008}
h1 .subtitle{font-size:clamp(14px,2.7vw,32px);letter-spacing:.25em;font-weight:500;line-height:1.5;margin-top:8px}
.coming{display:inline-flex;gap:10px;align-items:center;font:600 10px Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.18em;border:1px solid #ffa05750;background:#171513cc;padding:10px 16px;border-radius:20px;margin-bottom:25px}
.coming span{width:5px;height:5px;background:var(--orange);border-radius:50%;box-shadow:0 0 10px var(--orange)}
.hero-copy{font-size:16px;line-height:1.7;color:#d4ccc5;margin-bottom:30px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:19px 25px;min-height:58px;background:var(--orange);color:#17120e;text-decoration:none;font:800 13px Manrope,Arial,sans-serif;border:1px solid var(--orange);transition:background .18s,transform .18s}
.button:hover{background:#ffb87f;transform:translateY(-2px)}
.button span{font-size:20px;line-height:1}
.reassurance{font-size:11px!important;color:var(--muted);margin:14px 0 0!important;line-height:1.6!important}
.hero-bottom{position:absolute;bottom:25px;left:6%;right:6%;display:flex;justify-content:space-between;gap:16px;align-items:center;color:var(--muted);font-size:10px}
.hero-bottom>a{text-decoration:none;padding:12px 0}
.hero-bottom>a span{margin-left:16px;color:var(--orange)}
.visual-note{display:none}
.teaser{max-width:1260px;margin:auto;padding:90px 7%;display:grid;gap:30px}
.teaser .eyebrow{margin-bottom:20px}
h2{font:600 clamp(28px,3.6vw,46px)/1.28 Manrope,Arial,sans-serif;letter-spacing:-.045em;margin-bottom:0}
h2 span{color:var(--orange)}
.teaser-copy{font-size:15px;line-height:1.85;color:var(--muted)}
.teaser-copy p{margin-bottom:20px}
.teaser-copy .closing{color:var(--ivory);margin-bottom:0}
.waitlist{text-align:center;margin:0 6%;padding:64px 20px 70px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 50% 100%,#a44c1619,transparent 70%)}
.waitlist .eyebrow{margin-bottom:18px}
.waitlist>p:not(.eyebrow):not(.reassurance){font-size:15px;line-height:1.85;max-width:510px;color:var(--muted);margin:22px auto 28px}
.desktop-break{display:none}
footer{margin:0 6%;padding:36px 0;display:flex;flex-direction:column;gap:24px;text-align:center;font-size:11px;color:var(--muted)}
footer strong{font:800 15px Manrope,Arial,sans-serif;color:var(--ivory)}
footer strong span{font-weight:400;font-size:11px}
footer p{margin:8px 0 0}
footer .signoff{color:var(--orange);font-size:13px}
footer a{text-decoration:none;padding:12px}
footer a span{margin-left:10px}
@media(min-width:760px){.header{height:120px}
.brand img{width:160px;height:80px}
.header-link{font-size:13px}
.hero-content{padding-top:165px}
.eyebrow{font-size:11px}
.hero-copy{font-size:17px}
.hero-reveal img{max-width:340px}
.visual-note{display:block}
.hero-bottom{font-size:11px}
.teaser{grid-template-columns:1.1fr 1fr;align-items:center;gap:70px;padding-top:110px;padding-bottom:110px}
.teaser-copy{font-size:16px}
.waitlist{padding:78px 24px 86px}
.desktop-break{display:block}
footer{flex-direction:row;align-items:center;justify-content:space-between;text-align:left}
footer .signoff{margin:0}
}
@media(max-width:380px){.header{padding:0 6%}
.brand img{width:114px}
.hero-content{padding-left:16px;padding-right:16px}
.eyebrow{font-size:9px;letter-spacing:.16em}
.hero-bottom{font-size:9px}
.button{gap:16px;padding:18px 20px}
.portal{width:330px}
.hero{min-height:760px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.button{transition:none}
.button:hover{transform:none}
}


/* Christmas portfolio: original photographs in code-built wall mockups. */
.mockup-grid{display:grid;gap:28px;margin:44px auto 30px;max-width:1200px}
.mockup{margin:0;min-width:0}
.room{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1.32;overflow:hidden;padding:13%;background:linear-gradient(115deg,#ede5d6 0%,#d6c7b2 65%,#c8b9a5 100%)}
.room:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 28%,#fff4 28.3%,#fff4 40%,transparent 40.3%,transparent 56%,#fff2 56.3%,#fff2 69%,transparent 69.3%)}
.room-cool{background:linear-gradient(120deg,#c8cfcb,#adb8b2 75%,#98a7a0)}
.photo-frame{display:block;position:relative;z-index:1;width:100%;border:7px solid #24211f;padding:6%;background:#f6f2ea;box-shadow:inset 0 0 0 1px #fff,2px 3px 2px #0005,12px 20px 22px #33281e4d;transition:transform .2s}

.photo-frame img{display:block;width:100%;height:auto;box-shadow:0 0 0 1px #0002}
.frame-oak{border-color:#9a714d;border-style:ridge}
.picture-ledge{position:absolute;bottom:9%;left:8%;right:8%;height:9px;background:linear-gradient(#bd9671,#906b48);box-shadow:0 12px 15px #38271944}
.mockup figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:16px 0;font-size:12px;color:var(--ivory)}
.mockup figcaption span:last-child{font-size:10px;color:var(--muted)}
.christmas-gallery{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:14px;max-width:1200px;margin:auto}
.christmas-gallery>div{display:block;background:#1b1d1d;padding:7px;border:1px solid var(--line)}
.christmas-gallery img{display:block;width:100%;height:auto}
.gallery-note{text-align:center;color:var(--muted);font-size:11px;line-height:1.7;margin:24px 0 0}
@media(min-width:760px){.mockup-grid{grid-template-columns:1fr 1fr;gap:30px;margin-top:55px}.christmas-gallery{grid-template-columns:repeat(4,1fr);gap:22px}.christmas-reference{padding-top:85px;padding-bottom:85px}.photo-frame{border-width:10px}}
@media(prefers-reduced-motion:reduce){.photo-frame{transition:none}.photo-frame:hover{transform:none}}
/* Keep the keyboard shortcut outside every scrolled screenshot until focused. */
.skip{top:-100px;transform:none}.skip:focus{top:12px;transform:none}
.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden;padding:0;white-space:nowrap}
.questions{max-width:850px;margin:0 auto;padding:65px 6% 85px}.questions h2{margin-bottom:30px}.questions details{border-bottom:1px solid var(--line);padding:0}.questions summary{cursor:pointer;font:600 15px/1.6 Manrope,Arial,sans-serif;padding:21px 0}.questions summary:focus-visible{outline:3px solid var(--orange);outline-offset:5px}.questions details p{color:var(--muted);font-size:15px;line-height:1.8;margin:0 0 24px}footer div a{padding:0;text-decoration:underline;text-underline-offset:4px}
/* Compact reasons immediately before the first signup action. */
.hero-content{padding-top:135px;padding-bottom:110px}
.hero-copy{margin-bottom:22px}
.hero-reasons{max-width:370px;margin:0 auto 25px;text-align:left;padding:19px 0;border-top:1px solid #ffa05740;border-bottom:1px solid #ffa05740}
.hero-reasons h2{font:700 10px/1.6 Manrope,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);margin:0 0 12px}
.hero-reasons ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.hero-reasons li{display:flex;gap:10px;font-size:13px;line-height:1.6;color:var(--ivory)}
.hero-reasons li>span:first-child{color:var(--orange);flex-shrink:0}
.hero-reasons strong{font-weight:600}
@media(max-width:759px){.hero-content{padding-top:130px;padding-bottom:110px}.hero h1{margin-bottom:20px}.hero .coming{margin-bottom:18px}.hero-reasons{max-width:330px}.hero .eyebrow{margin-bottom:20px}}
@media(max-width:380px){.hero-reasons{max-width:296px}}

.sound-control{position:fixed;z-index:5;right:18px;bottom:16px;max-width:calc(100% - 36px)}
#sound-toggle{display:flex;align-items:center;gap:12px;min-height:44px;padding:12px 16px;border:1px solid #ffa05770;border-radius:4px;background:#171513f5;color:#f6f2ea;font:600 11px/1.5 Manrope,Arial,sans-serif;cursor:pointer;box-shadow:0 4px 20px #0005}
#sound-toggle[hidden]{display:none}#sound-toggle svg{color:#ffa057;flex-shrink:0}#sound-toggle:hover{border-color:#ffa057}#sound-toggle:focus-visible{outline:3px solid #ffa057;outline-offset:4px}
#sound-status{max-width:270px;margin:8px 0 0;background:#171513;color:#f6f2ea;font-size:12px;line-height:1.5}#sound-status:empty{display:none}
footer{padding-bottom:90px}
/* Decorative campaign props stay outside the text column. */
.halloween-props{position:absolute;inset:0;pointer-events:none;background:url('assets/halloween-props.svg') center bottom/100% 100% no-repeat;opacity:.9}
@media(max-width:759px){.halloween-props{background-size:100% auto;opacity:.85}}

.reel{max-width:1260px;margin:auto;padding:30px 7% 90px;display:flex;flex-direction:column;align-items:center;gap:28px}
.reel video{width:100%;max-width:340px;height:auto;aspect-ratio:9/16;background:#000;border:1px solid rgba(255,159,90,.35);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
