@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#0d1b2a;--gold:#efd4af;--muted:#b6aea1}*{box-sizing:border-box}html,body{margin:0;background:var(--navy);color:var(--gold);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:7px}button{background:none;border:0}.story{height:500svh}.stage{height:100svh;position:sticky;top:0;overflow:hidden;isolation:isolate}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 10% 90%,#253341 0,transparent 55%)}.film{position:absolute;overflow:hidden;will-change:transform,width,height;border-radius:0;background:#030404}.film video{width:100%;height:100%;object-fit:cover;display:block}.film-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0d1b2a55,transparent 38%,#09121de0);opacity:var(--shade,1)}header{position:absolute;top:0;left:0;width:100%;height:100px;padding:25px 5%;display:flex;justify-content:space-between;align-items:center;z-index:5}.brand{font-family:Georgia,serif;font-size:33px;letter-spacing:-2px;text-align:left;padding:0}.brand span{display:block;font:8px 'DM Sans',sans-serif;letter-spacing:2.5px;margin-top:5px}nav{display:flex;gap:32px;align-items:center}nav button{font-size:13px;padding:10px 0}.nav-last{border-bottom:1px solid #efd4af77}.nav-last span{margin-left:25px}.copy{position:absolute;opacity:0;pointer-events:none;will-change:opacity,transform}.copy.active{pointer-events:auto}.eyebrow{font-size:10px!important;letter-spacing:2px;font-weight:600;margin:0 0 24px!important}.hero{inset:0;padding:0 7%;display:flex;justify-content:flex-end;flex-direction:column;padding-bottom:8vh}.hero h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(100px,15vw,230px);line-height:.9;letter-spacing:-.065em;margin:0 0 20px}.hero h1 span{font-style:italic}.hero-tag{font-size:clamp(17px,2vw,26px);margin:0;font-weight:400}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;margin-top:36px;font-size:12px;line-height:1.6}.scroll-cue{display:flex;align-items:center;gap:18px;letter-spacing:2px;font-size:9px}.scroll-cue span{display:grid;place-items:center;width:40px;height:40px;border:1px solid #efd4af70;border-radius:50%;font-size:18px}.products,.workshop{width:39%;top:50%;transform:translateY(-50%)}.products{left:56%}.workshop{left:7%}.copy h2{font-family:'Manrope',sans-serif;font-weight:500;font-size:clamp(35px,4.7vw,76px);line-height:1.12;letter-spacing:-.055em;margin:0 0 24px}.copy h2 em{font-family:Georgia,serif;font-weight:400}.copy p:not(.eyebrow,.hero-tag,.detail){font-size:15px;line-height:1.8;max-width:360px;color:#d5cabb}.cta{display:inline-flex;align-items:center;gap:35px;padding:17px 23px;background:var(--gold);color:var(--navy);border-radius:40px;font-size:12px;font-weight:600;margin-top:20px;transition:background .2s,transform .2s}.cta:hover{background:#ffe6c4;transform:translateY(-2px)}.cta span{font-size:19px}.detail{font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:30px}.closing{top:46%;left:15%;width:70%;text-align:center}.closing h2{font-size:clamp(28px,3.6vw,57px);margin-bottom:12px}.closing p:not(.eyebrow){margin:0 auto;max-width:520px;font-size:13px}.closing .eyebrow{margin-bottom:14px!important}.closing .cta{margin-top:16px;padding:13px 23px}footer{position:absolute;bottom:5%;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #efd4af33;padding-top:22px;opacity:0;pointer-events:none;font-size:11px;line-height:1.7}footer.active{pointer-events:auto}footer img{width:140px}footer small{color:var(--muted)}footer div{display:flex;gap:24px}footer button{border:1px solid #efd4af66;border-radius:50%;width:36px;height:36px}.story-rail{position:absolute;right:2%;bottom:4%;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:1px}.story-rail>div{height:1px;width:60px;background:#efd4af44}.story-rail i{display:block;height:1px;background:var(--gold);width:0}.toast{position:absolute;bottom:45%;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--navy);border-radius:16px;padding:18px 24px;font-size:13px;max-width:90%;width:max-content;opacity:0;pointer-events:none;transition:opacity .2s;z-index:10}.toast.visible{opacity:1}
@media(max-width:700px){header{height:78px;padding:20px 6%}.brand{font-size:27px}.brand span{font-size:6px;letter-spacing:1.8px}nav{gap:15px}nav button{font-size:10px}.nav-last{display:none}.hero{padding:0 7% 12svh}.hero h1{font-size:24vw}.hero .eyebrow{font-size:8px!important;letter-spacing:1.8px}.hero-tag{font-size:17px}.hero-bottom{margin-top:30px;font-size:11px}.scroll-cue{font-size:7px;letter-spacing:1px;gap:10px}.products,.workshop{top:54%;left:8%;width:84%;transform:none}.copy h2{font-size:clamp(29px,9.4vw,44px);margin-bottom:14px}.copy p:not(.eyebrow,.hero-tag,.detail){font-size:13px;line-height:1.65;max-width:340px;margin:0}.eyebrow{font-size:8px!important;letter-spacing:1.6px;margin-bottom:14px!important}.cta{font-size:11px;padding:12px 19px;margin-top:18px}.detail{font-size:7px;margin-top:20px}.closing{top:44%;left:6%;width:88%}.closing h2{font-size:clamp(27px,8vw,38px)}.closing p:not(.eyebrow){font-size:11px;max-width:300px}.closing .eyebrow{font-size:7px!important;letter-spacing:1px}.closing .cta{font-size:10px;margin-top:15px}footer{bottom:7%;left:7%;right:7%;padding-top:14px;flex-wrap:wrap;gap:12px;font-size:9px}footer img{width:100px}footer div{gap:16px}footer button{width:28px;height:28px}.story-rail{right:7%;bottom:3%}.hero-bottom span:first-child{max-width:145px}}
@media(max-height:650px) and (max-width:700px){.detail{display:none}.copy h2{font-size:28px}.copy p:not(.eyebrow,.hero-tag,.detail){font-size:11px}.cta{margin-top:10px;padding:9px 17px}.eyebrow{margin-bottom:10px!important}footer{bottom:6%;padding-top:8px;gap:8px}.closing{top:43%}.closing h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.cta{transition:none}}
/* The final scene opens back out into an edge-to-edge cinematic frame. */
header{background:rgba(13,27,42,var(--closing,0))}
.closing{top:48%;left:59%;width:36%;text-align:left;transform:translateY(-50%)}
.closing p:not(.eyebrow){margin-left:0}.closing .eyebrow{line-height:1.7}
footer::before{content:'';position:absolute;inset:-22px -6vw -6svh;background:var(--navy);z-index:-1}footer{isolation:isolate}
.workshop h2{font-size:clamp(32px,4.1vw,64px)}
@media(max-width:700px){.closing{top:49%;left:8%;width:84%;transform:none}.closing h2{font-size:clamp(26px,8vw,36px)}.closing p:not(.eyebrow){font-size:11px}.closing .cta{font-size:10px;gap:20px}.workshop h2{font-size:clamp(27px,8vw,36px)}footer::before{inset:-14px -8vw -8svh}}
@media(max-height:650px) and (max-width:700px){.closing{top:44%}.closing h2{font-size:25px}.closing .cta{margin-top:10px;padding:10px 18px}.closing .eyebrow{margin-bottom:8px!important}.workshop h2{font-size:27px}}

/* A narrow navy surround gives the opening scene a hint of the later frames. */
header{background:rgba(13,27,42,var(--header-navy,1))}