:root{--bg:#17120f;--paper:#f2e8d8;--accent:#ee9d68;--muted:#bcb0a3;--line:#ffffff26;--serif:'Playfair Display',Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--bg);color:var(--paper);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}img{display:block;max-width:100%;object-fit:cover}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:500;line-height:1.08}h1,h2{font-family:var(--serif);letter-spacing:-.045em}em{font-weight:500;color:var(--accent)}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.19em}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--paper);color:var(--bg);padding:10px}.skip:focus{top:12px}.progress{position:fixed;top:0;left:0;height:2px;z-index:50;background:var(--accent);width:100%;transform:scaleX(0);transform-origin:left}.header{position:absolute;top:0;width:100%;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:26px 5%;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:700;letter-spacing:.075em;line-height:1.2}.brand small{display:block;font-size:10px;letter-spacing:.28em;margin-bottom:4px}.brand-icon{width:44px;height:44px;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-style:italic;font-size:29px;color:var(--accent);font-weight:500}.header nav{display:flex;gap:34px;font-size:14px}.header nav a:hover,.quiet-link:hover{color:var(--accent)}.nav-cta{border-bottom:1px solid #b5a394;padding:9px 0;font-size:14px}.nav-cta span{margin-left:24px}.nav-toggle{display:none}.mobile-nav[hidden]{display:none}.hero{min-height:820px;height:100svh;max-height:1100px;position:relative;display:flex;align-items:center;isolation:isolate;overflow:hidden}.hero-art{position:absolute;inset:0;z-index:-2;overflow:hidden}.hero-art img{height:100%;width:79%;margin-left:auto;object-position:60% center;animation:hero-drift 16s ease-out both}.hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#17120f 0%,#17120fe8 26%,#17120f55 57%,#17120f05 80%),linear-gradient(0deg,#17120f 0%,transparent 28%,#17120f50 100%)}.hero-copy{padding:90px 5% 30px;width:100%;position:relative}.hero h1{font-size:clamp(64px,6.5vw,112px);max-width:900px;margin:27px 0}.hero-description{color:#d2c6b9;font-size:17px}.hero-actions{display:flex;gap:32px;align-items:center;margin-top:36px}.button{display:inline-flex;gap:42px;align-items:center;padding:17px 25px;background:var(--accent);color:#23150e;font-size:14px;font-weight:600;transition:background .2s,transform .2s}.button:hover{background:#f7b985;transform:translateY(-3px)}.quiet-link{border-bottom:1px solid #aaa;font-size:14px}.hero-bottom{position:absolute;bottom:30px;left:5%;right:5%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.15em;color:var(--muted)}.hero-bottom a{color:var(--paper)}.hero-bottom a span{display:inline-block;margin-left:18px;font-size:19px}.ticker{overflow:hidden;border-block:1px solid #553a2c;background:#251b15;color:var(--accent);padding:20px 0}.ticker div{display:flex;align-items:center;gap:44px;width:max-content;font-size:13px;letter-spacing:.16em;animation:marquee 36s linear infinite}.ticker i{font-size:26px;font-style:normal}.section{padding:120px 7%}.story{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.story h2{font-size:clamp(42px,4.2vw,70px);margin:24px 0}.story-copy>p:not(.eyebrow){max-width:380px;color:var(--muted);margin:25px 0 32px}.line-link{display:inline-flex;justify-content:space-between;gap:40px;border-bottom:1px solid #785b47;padding:0 0 12px;font-size:14px}.story-photo img{width:100%;height:520px;object-position:40%}.story-photo{transform:rotate(2deg)}.story-photo figcaption{display:flex;justify-content:space-between;padding:15px 0;font-size:10px;letter-spacing:.08em;color:var(--accent);gap:15px}.story-photo figcaption span{color:var(--muted);letter-spacing:0}.menu-section{background:var(--paper);color:var(--bg)}.menu-heading{display:flex;justify-content:space-between;gap:35px;align-items:end}.menu-heading h2{font-size:clamp(58px,6vw,92px);margin-top:25px}.menu-heading em{color:#8c4b2b}.menu-heading>p{color:#695a4f;font-size:15px;padding-bottom:8px}.filters{display:flex;border-bottom:1px solid #bdb0a0;margin-top:48px;gap:30px;overflow-x:auto}.filters button{border:0;border-bottom:2px solid transparent;background:none;color:#726557;padding:20px 0;white-space:nowrap;font-size:15px}.filters button[aria-pressed=true]{color:#6f361d;border-color:#8c4b2b}.filters sup{font-size:10px;margin-left:6px}.filters button:hover{color:#6f361d}.menu-count{font-size:12px;color:#726557;padding:20px 0}.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.drink{min-height:355px;display:flex;flex-direction:column;padding:24px;position:relative;overflow:hidden;isolation:isolate;background:#d9bd97;color:#3d261b;transition:transform .5s,box-shadow .5s}.drink[hidden]{display:none!important}.drink:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 75% 20%,#ffffff42,transparent 60%);transition:transform .7s}.drink:hover{transform:translateY(-7px);box-shadow:0 15px 35px #2c1c1820}.drink:hover:before{transform:scale(1.7)}.drink-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.13em}.drink-word{font-family:var(--serif);font-style:italic;font-size:clamp(52px,5.7vw,90px);letter-spacing:-.06em;line-height:1.6;opacity:.65;margin:auto 0;transition:transform .7s}.drink:hover .drink-word{transform:translateX(9px) rotate(-4deg)}.drink h3{font-size:22px;line-height:1.2;max-width:280px}.drink-bottom>p:last-child{font-size:13px;margin-top:10px;opacity:.8}.tag{font-size:9px;letter-spacing:.14em;margin-bottom:12px}.crush{background:#977456;color:#fff1df}.mojito{background:#c6d0aa;color:#293a25}.apple{background:#aeba84}.peach{background:#e6b294;color:#573427}.shake{background:#735347;color:#f8e8d2}.oreo{background:#34312c;color:#efe5d5}.berry{background:#d9b0ab;color:#55303a}.butter{background:#dbb36f;color:#4d321c}.brownie{background:#4a3027}.vanilla{background:#e0d3b9;color:#59412d}.hot{background:#9a523b;color:#ffebd2}.signatures{display:grid;grid-template-columns:1fr 1fr;gap:12%;background:#201712}.signature-intro{position:sticky;top:60px;align-self:start}.signature-intro h2{font-size:clamp(48px,5vw,80px);margin-top:24px}.signature-intro img{width:280px;height:270px;object-fit:contain;margin:25px 0;mix-blend-mode:screen}.signature{display:block;border-top:1px solid #674536;padding:35px 0 48px}.signature>span{font-size:11px;letter-spacing:.14em;color:var(--accent)}.signature h3{font-family:var(--serif);font-size:clamp(35px,4vw,62px);margin:20px 0}.signature i{font-style:normal;float:right;font-family:Arial,sans-serif;font-size:35px;transition:transform .3s}.signature:hover i{transform:translate(5px,-5px);color:var(--accent)}.signature p{color:var(--muted);font-size:14px}.visit{text-align:center;background:radial-gradient(ellipse at bottom,#503121,transparent 70%);padding-block:140px}.visit h2{font-size:clamp(48px,6.4vw,98px);margin:30px auto}.visit>p:not(.eyebrow){color:var(--muted);margin-bottom:32px}footer{padding:35px 5%;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:25px}footer>p,footer>a:not(.brand){font-size:13px}footer>span{font-size:11px;color:var(--muted)}.intro{animation:arrive 1s both}.intro:nth-child(2){animation-delay:.15s}.intro:nth-child(3){animation-delay:.3s}.intro:nth-child(4){animation-delay:.45s}.motion .reveal{opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s}.motion .reveal.visible{opacity:1;transform:translateY(0)}.drink.enter{animation:arrive .5s both;animation-delay:var(--delay,0ms)}@keyframes arrive{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@keyframes hero-drift{from{transform:scale(1.09)}to{transform:scale(1)}}@keyframes marquee{to{transform:translateX(-50%)}}@media(min-width:1000px){.menu-grid .drink:last-child{grid-column:2}}@media(max-width:1000px){.header nav{gap:20px}.nav-cta{display:none}.hero{min-height:740px}.hero h1{font-size:76px}.hero-art img{width:100%;object-position:65%}.section{padding:85px 6%}.story{gap:6%}.story-photo img{height:420px}.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.drink-word{font-size:80px}.chapter{display:none}.menu-heading{align-items:start}.menu-heading>p{max-width:240px;padding-top:30px}.signature-intro img{width:220px;height:220px}}@media(max-width:600px){html{scroll-padding-top:25px}.header{padding:20px 6%}.header nav{display:none}.brand{font-size:12px}.brand-icon{width:37px;height:37px;font-size:25px}.nav-toggle{display:flex;gap:15px;background:none;border:0;color:var(--paper);font-size:14px;padding:8px}.mobile-nav{position:absolute;z-index:30;top:85px;left:0;right:0;background:#241912;padding:22px 6%;border-bottom:1px solid var(--line);display:grid;gap:16px}.hero{min-height:800px;max-height:960px;height:100svh;align-items:flex-start}.hero-copy{padding:151px 6% 0}.hero h1{font-size:clamp(48px,12vw,70px);margin:20px 0}.hero .eyebrow{font-size:10px}.hero-description{font-size:15px}.hero-actions{margin-top:24px;gap:24px}.hero-art img{height:65%;position:absolute;bottom:0;width:100%;object-position:center}.hero-art:after{background:linear-gradient(180deg,#17120f 0%,#17120f 35%,#17120f99 52%,transparent 75%,#17120f 100%)}.hero-bottom{bottom:22px;left:6%;right:6%;font-size:9px}.hero-bottom>span{max-width:130px}.hero-bottom a span{margin-left:5px}.section{padding:70px 6%}.story{grid-template-columns:1fr;gap:42px}.story h2{font-size:46px}.story-photo img{height:350px}.story-photo figcaption{font-size:9px}.menu-heading{display:block}.menu-heading h2{font-size:66px}.menu-heading>p{max-width:none;padding-top:22px;font-size:14px}.filters{gap:25px;margin-top:25px}.filters button{font-size:14px}.menu-grid{grid-template-columns:1fr;gap:15px}.drink{min-height:340px;padding:25px}.drink-word{font-size:86px}.drink h3{font-size:24px}.drink-bottom>p:last-child{font-size:14px}.signatures{grid-template-columns:1fr;gap:20px}.signature-intro{position:relative;top:0}.signature-intro img{display:none}.signature-intro h2{font-size:55px;margin-bottom:25px}.signature h3{font-size:48px}.signature{padding-bottom:30px}.visit h2{font-size:clamp(42px,11vw,65px)}.visit .eyebrow{font-size:10px}footer{display:grid;grid-template-columns:1fr auto;padding:30px 6%}footer>p{grid-row:2}footer>span{grid-column:1/-1}.ticker{padding:14px 0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion .reveal{opacity:1;transform:none}.drink:hover,.drink:hover .drink-word{transform:none}}
/* Cinematic film edition */
:root{--bg:#090909;--paper:#f3e9da;--muted:#b8aea2;--line:#ffffff21}
.header{border-bottom:1px solid #ffffff16}.cinematic-scroll{height:155svh;background:#050505}.hero{position:sticky;top:0;min-height:700px;height:100svh;max-height:none;background:#050505;--scene-progress:0}.hero-art{inset:0 0 0 25%;z-index:0;transform:scale(calc(1 + var(--scene-progress)*.035));transform-origin:65% center}.hero-video{width:100%;height:100%;object-fit:contain;object-position:center;background:#050505}.hero-art:after{background:linear-gradient(90deg,#050505 0%,#05050580 16%,transparent 43%),linear-gradient(0deg,#050505 0%,transparent 18%,transparent 85%,#050505 100%)}.hero-copy{z-index:1;pointer-events:none;transform:translateY(calc(var(--scene-progress)*-28px));opacity:calc(1 - var(--scene-progress)*.2)}.hero-copy a{pointer-events:auto}.hero h1{font-size:clamp(60px,6vw,98px);max-width:750px;text-shadow:0 2px 30px #0009}.hero-bottom{z-index:2}.video-toggle{position:absolute;right:5%;bottom:85px;z-index:3;display:flex;align-items:center;gap:17px;background:#111b;color:var(--paper);border:1px solid #ffffff42;padding:10px 17px;border-radius:30px;font-size:12px;backdrop-filter:blur(10px)}.video-toggle:hover{background:#34261e}.story{background:#0e0d0c}.ticker{background:#17120e;border-color:#3a2b21}.menu-section{background:#11100e;color:var(--paper)}.menu-heading em{color:var(--accent)}.menu-heading>p,.menu-count{color:var(--muted)}.filters{border-color:#ffffff25}.filters button{color:#b8ac9c}.filters button[aria-pressed=true]{color:#f2b17d;border-color:#f2b17d}.filters button:hover{color:#fff}.drink{background:#292018;color:#edd7b9;border:1px solid #ffffff17}.drink:before{background:radial-gradient(ellipse at 80% 10%,#d79d6320,transparent 65%)}.drink-word{color:#d0a275;opacity:.85}.drink:hover{box-shadow:0 15px 35px #0005;border-color:#d0a27570}.crush{background:#32231b}.mojito{background:#1c251c;color:#d9e5c6}.mojito .drink-word{color:#a6bc87}.apple{background:#232b1b}.peach{background:#33241f;color:#eed5c5}.peach .drink-word{color:#dca07e}.shake{background:#261d1a;color:#eedccd}.oreo{background:#212120}.oreo .drink-word{color:#d2cabe}.berry{background:#2f2026;color:#edd5dc}.berry .drink-word{color:#d19aa9}.butter{background:#302717;color:#eddfc2}.butter .drink-word{color:#d0ad70}.brownie{background:#241915}.vanilla{background:#2a2720;color:#ece1cc}.hot{background:#342019;color:#f0d6c6}.hot .drink-word{color:#e4a581}.signatures{background:#0b0908}.visit{background:radial-gradient(ellipse at bottom,#352318,transparent 75%)}.mobile-nav{background:#100e0c}
@media(max-width:1000px){.hero h1{font-size:clamp(60px,8vw,80px)}.hero-art{left:20%}.hero-art:after{background:linear-gradient(90deg,#050505,transparent 65%),linear-gradient(0deg,#050505,transparent 25%)}}
@media(max-width:600px){.cinematic-scroll{height:125svh}.hero{min-height:800px;max-height:1000px}.hero h1{font-size:clamp(46px,11.8vw,68px)}.hero-copy{padding-top:136px}.hero-art{inset:41% -12% 7%;transform:none}.hero-video{object-fit:contain;object-position:center}.hero-art:after{background:linear-gradient(180deg,#050505,transparent 20%,transparent 80%,#050505)}.hero-description{font-size:14px}.hero-actions{margin-top:20px}.video-toggle{bottom:65px;right:6%;font-size:11px;padding:8px 13px}.hero-bottom{font-size:8px}.drink-word{font-size:86px}}
@media(prefers-reduced-motion:reduce){.cinematic-scroll{height:auto}.hero{position:relative}.hero-art,.hero-copy{transform:none;opacity:1}}
/* Scroll-controlled image sequence: the scene stays pinned for the entire film. */
.cinematic-scroll{height:600svh}.coffee-sequence,.sequence-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;background:#050505}.hero-art .sequence-poster{width:100%;height:100%;margin:0;animation:none;transform:none}.sequence-poster[hidden]{display:none}.hero-art:after{pointer-events:none}.sequence-caption{position:absolute;z-index:3;bottom:90px;right:5%;display:flex;gap:15px;align-items:center;font-size:10px;letter-spacing:.13em;color:#d1c3b4}.sequence-track{height:1px;width:110px;background:#ffffff40}.sequence-track i{display:block;width:100%;height:2px;background:var(--accent);transform:scaleX(var(--film-progress,0));transform-origin:left}.sequence-percent{width:35px;font-variant-numeric:tabular-nums}.hero-copy{opacity:calc(1 - var(--scene-progress)*.65);transform:translateY(calc(var(--scene-progress)*-35px))}.hero-art{transform:scale(calc(1 + var(--scene-progress)*.06))}
@media(max-width:600px){.cinematic-scroll{height:500svh}.sequence-caption{bottom:75px;right:6%;font-size:9px;gap:10px}.sequence-track{width:80px}.hero-art .sequence-poster{position:absolute;inset:0;object-position:center}.hero-copy{opacity:calc(1 - var(--scene-progress)*.4)}.hero-art{transform:none}}
@media(prefers-reduced-motion:reduce){.cinematic-scroll{height:auto}.sequence-caption{display:none}.hero-copy,.hero-art{transform:none;opacity:1}}
/* Cup-first choreography: nothing competes with the initial logo reveal. */
.header{position:fixed;background:#090909b8;backdrop-filter:blur(14px);transition:opacity .4s,transform .5s}.intro-pending .header{opacity:0;transform:translateY(-100%);pointer-events:none}.intro-pending .progress{opacity:0}.hero{min-height:0;height:100svh;max-height:none;--reveal:0;--copy-opacity:0;--exit:0}.hero-art{inset:0 0 0 calc(var(--reveal)*25%*(1 - var(--exit)));transform:none;will-change:left}.coffee-sequence{animation:none}.hero-art:after{background:linear-gradient(90deg,#05050599,transparent 24%,transparent 85%,#05050533),linear-gradient(0deg,#050505,transparent 18%,transparent 85%,#050505);opacity:var(--reveal)}.hero-copy{opacity:var(--copy-opacity);transform:translateY(calc((1 - var(--reveal))*45px - var(--exit)*45px));will-change:opacity,transform}.hero-copy .intro{animation:none}.hero-copy a{pointer-events:auto}.hero-copy[inert] a{pointer-events:none}.hero-bottom{opacity:var(--copy-opacity);transform:translateY(calc((1 - var(--reveal))*20px))}.sequence-caption{opacity:var(--copy-opacity)}.cinema-light{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 35%,#f2ca9033,transparent 55%);opacity:var(--light,0);mix-blend-mode:screen}.hero-art .sequence-poster{object-position:center}.hero-copy h1{font-size:clamp(55px,5.8vw,94px)}
@media(max-width:600px){.hero{min-height:0;height:100svh}.hero-art{inset:calc(var(--reveal)*30%*(1 - var(--exit))) -36% calc(var(--reveal)*10%*(1 - var(--exit)));transform:none}.hero-copy{padding:105px 6% 0;opacity:var(--copy-opacity);transform:translateY(calc((1 - var(--reveal))*28px - var(--exit)*25px))}.hero-copy h1{font-size:clamp(37px,10.8vw,56px);margin:14px 0}.hero-description{font-size:13px}.hero-actions{margin-top:17px}.hero-actions .button{padding:12px 18px;font-size:12px;gap:20px}.hero-bottom{bottom:20px}.sequence-caption{bottom:65px}.hero-art:after{background:linear-gradient(0deg,#050505,transparent 20%,transparent 80%,#050505)}.cinema-light{background:radial-gradient(ellipse at 50% 45%,#e6c29233,transparent 55%)}}
@media(max-width:600px) and (max-height:720px){.hero-copy{padding-top:89px}.hero-description{display:none}.hero-copy h1{font-size:40px}.hero-art{inset:calc(var(--reveal)*29%*(1 - var(--exit))) -32% calc(var(--reveal)*6%*(1 - var(--exit)))}}
@media(prefers-reduced-motion:reduce){.intro-pending .header{opacity:1;transform:none;pointer-events:auto}.hero-copy{opacity:1;transform:none}.cinema-light{display:none}.hero-art{left:25%}.hero-bottom{opacity:1}.cinematic-scroll{height:auto}}
/* Premium finish: full-resolution film, restrained light, warmer metal accents. */
:root{--accent:#eeb888;--paper:#f7eee2;--muted:#bfb5a9}.hero-art{will-change:auto}.coffee-sequence{filter:contrast(1.025) saturate(1.035);image-rendering:auto}.cinema-light{background:radial-gradient(ellipse at 47% 22%,#ffe4b530,transparent 48%),radial-gradient(ellipse at 78% 65%,#d48d4920,transparent 38%);mix-blend-mode:screen}.cinema-light:before{content:'';position:absolute;inset:-25%;background:linear-gradient(115deg,transparent 38%,#ffe3af18 48%,transparent 57%);transform:translateX(calc(-12% + var(--film-progress,0)*24%));pointer-events:none}.header{border-color:#edc28f24;background:linear-gradient(180deg,#0b0908ef,#0b0908c9);box-shadow:0 12px 35px #0002}.brand-icon{border-color:#cfa374;color:#efcaa1;box-shadow:inset 0 0 12px #d9a3690c}.hero-copy h1{color:#fff5e8;text-shadow:0 3px 22px #0007}.hero-copy em{color:#efbb8b}.hero-description{color:#d1c5b8}.eyebrow{color:#cdb79d}.button{background:linear-gradient(115deg,#f4c89f,#e5a774);border:1px solid #fce0b16b;box-shadow:0 7px 22px #0003,inset 0 1px 0 #fff6;position:relative;overflow:hidden}.button:after{content:'';position:absolute;inset:-70% -50%;background:linear-gradient(110deg,transparent 42%,#fff5 50%,transparent 58%);transform:translateX(-85%);transition:transform .75s;pointer-events:none}.button:hover:after{transform:translateX(85%)}.button:hover{background:linear-gradient(115deg,#f9d7b8,#edb783);box-shadow:0 9px 30px #c0884820}.story-photo{transform:none!important}.story-photo img{border:1px solid #e1b07825;box-shadow:0 22px 75px #0006;filter:contrast(1.035) saturate(.95)}.story-photo figcaption{font-size:11px}.menu-section{background:radial-gradient(ellipse at 12% 0%,#30211638,transparent 45%),#100f0d}.menu-heading h2 em{color:#e5b284}.filters button{padding:20px 5px}.filters button[aria-pressed=true]{color:#f6cfaa}.drink{border:1px solid #d8b99124;box-shadow:inset 0 1px 0 #ffffff06;border-radius:3px;padding:28px;transition:transform .4s,box-shadow .4s,border-color .4s}.drink:before{background:radial-gradient(ellipse at 90% 0%,#ecc48c21,transparent 58%),linear-gradient(135deg,#ffffff03,transparent 45%,#00000025)}.drink:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 20%,#ffffff06 45%,transparent 65%);transform:translateX(-100%);transition:transform .8s;pointer-events:none}.drink:hover:after{transform:translateX(100%)}.drink:hover{transform:translateY(-5px);border-color:#e1bb8377;box-shadow:0 18px 35px #0004,inset 0 1px 0 #e1bb8322}.drink-word{opacity:1;text-shadow:0 6px 30px #0002;letter-spacing:-.045em}.drink-top{font-size:11px;letter-spacing:.16em;color:inherit;opacity:.85}.tag{font-size:10px;letter-spacing:.16em}.drink h3{font-size:23px;letter-spacing:-.025em}.drink-bottom>p:last-child{font-size:14px;opacity:.85;line-height:1.5}.signature{border-color:#e6bd8238}.signature h3{letter-spacing:-.04em}.signature:hover h3{color:#f3cfa9}.signature-list{padding-top:10px}.visit{background:radial-gradient(ellipse at 50% 110%,#6e452239,transparent 68%),#0b0908}.line-link{border-color:#d0a07077}.hero-art .sequence-poster{filter:contrast(1.025)}
@media(max-width:600px){.drink{padding:25px}.drink h3{font-size:24px}.hero-copy h1{text-shadow:0 2px 16px #0008}.hero-copy .eyebrow{font-size:10px}.cinema-light:before{display:none}}
@media(prefers-reduced-motion:reduce){.button:after,.drink:after{display:none}.drink:hover{transform:none}}
/* Branded opening, feathered scene boundary, and a deliberate shot change. */
.cinematic-scroll{height:510svh}.opening-title{position:absolute;z-index:4;top:7%;left:5%;right:5%;margin:0;text-align:center;font-family:var(--serif);font-size:clamp(27px,3.6vw,56px);font-weight:500;letter-spacing:.12em;line-height:1.3;color:#ffe2bf;text-shadow:0 0 18px #efb77255,0 0 55px #e9a75a22;opacity:var(--title-opacity,1);transform:translateY(calc((1 - var(--title-opacity,1))*-15px));pointer-events:none}.opening-title span{display:block;font-family:'DM Sans',sans-serif;font-size:12px;letter-spacing:.42em;margin-bottom:12px;color:#caaa85}.opening-title:after{content:'';display:block;width:110px;height:1px;margin:23px auto 0;background:linear-gradient(90deg,transparent,#e8b67b,transparent);box-shadow:0 0 16px #e8b67b44}.hero-art{opacity:calc(1 - var(--handoff,0)*.97)}.hero-art:after{opacity:1;background:linear-gradient(0deg,#050505 0%,#05050500 18%,#05050500 92%,#050505 100%)}.cinema-light{opacity:calc(var(--light,0) + var(--handoff,0)*.13)}.hero{background:#050505}.hero-copy{transition:none}.hero-art .sequence-poster{mask-image:linear-gradient(0deg,transparent,black 20%,black 96%,transparent)}
@media(max-width:600px){.cinematic-scroll{height:430svh}.opening-title{top:9%;font-size:clamp(25px,7.5vw,36px);letter-spacing:.09em}.opening-title span{font-size:11px;margin-bottom:10px}.opening-title:after{margin-top:18px;width:85px}}
@media(prefers-reduced-motion:reduce){.cinematic-scroll{height:auto}.opening-title{display:none}.hero-art{opacity:1}}
/* Last frame: keep the coffee centre clear, with the headline above and action below. */
.film-ending{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;padding:125px 6% 65px;opacity:var(--ending,0);pointer-events:none}.film-ending__copy{transform:translateY(calc((1 - var(--ending,0))*25px));max-width:700px}.film-ending h2{font-size:clamp(43px,4.9vw,73px);line-height:1.04;margin-top:17px;color:#fff4e4;text-shadow:0 3px 28px #000,0 0 70px #000}.film-ending .eyebrow{font-size:11px;color:#ecc8a0;letter-spacing:.26em}.film-ending__action{transform:translateY(calc((1 - var(--ending,0))*25px))}.film-ending__action p{font-size:14px;color:#e0d0bb;margin-bottom:16px;text-shadow:0 2px 12px #000}.film-ending:not([inert]) .button{pointer-events:auto}.menu-section{overflow:hidden}.product-photo{height:auto;aspect-ratio:1;position:relative;background-image:url('../assets/coffeecabin/products-atlas-enhanced.png');background-size:400% 400%;background-position:var(--photo-x) var(--photo-y);background-repeat:no-repeat;margin:17px -8px 24px;transition:transform .65s;mask-image:linear-gradient(0deg,transparent,#000 9%,#000 94%,transparent)}.drink{min-height:480px;padding:24px;justify-content:space-between;background:#191510}.drink:hover .product-photo{transform:scale(1.035)}.drink-bottom{margin-top:auto}.motion .drink.reveal{transform:translate3d(var(--entry-x,-55px),25px,0);transition:opacity .75s var(--entry-delay,0ms),transform .85s cubic-bezier(.2,.7,.25,1) var(--entry-delay,0ms),border-color .4s,box-shadow .4s}.motion .drink.reveal.visible{transform:translate3d(0,0,0)}.motion .drink.reveal.visible:hover{transform:translateY(-5px)}
@media(max-width:600px){.film-ending{padding:112px 6% 70px}.film-ending h2{font-size:clamp(37px,10.2vw,49px)}.film-ending__action p{font-size:13px}.film-ending .button{padding:13px 20px}.product-photo{margin:12px -6px 20px}.drink{min-height:460px}.motion .drink.reveal{transform:translate3d(calc(var(--entry-x)*.5),18px,0);transition-delay:0ms}}
@media(max-height:720px){.film-ending{padding-top:105px;padding-bottom:42px}.film-ending h2{font-size:42px}.film-ending__action p{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){.film-ending{display:none}.motion .drink.reveal{opacity:1;transform:none!important}.drink:hover .product-photo{transform:none}}
/* Full-width drink showcases enter from the screen edges, one per scroll beat. */
.menu-grid{display:flex;flex-direction:column;gap:0}.menu-section{overflow:clip}.drink,.motion .drink.reveal,.motion .drink.reveal.visible{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;column-gap:7%;min-height:72svh;padding:50px 0;margin:0;background:none!important;border:0;border-radius:0;box-shadow:none!important;opacity:1;transform:none!important;transition:none;isolation:auto;color:var(--paper)}.drink:before,.drink:after{display:none}.drink-top{position:absolute;top:32px;left:0;right:0;display:flex;justify-content:space-between;color:#baa083;font-size:11px;letter-spacing:.2em}.product-photo{grid-column:1;grid-row:1;aspect-ratio:1;width:100%;max-width:510px;margin:20px 0;justify-self:center;mask-image:radial-gradient(ellipse 55% 57% at center,#000 55%,transparent 94%);background-color:transparent}.drink-bottom{grid-column:2;grid-row:1;align-self:center;margin:0;max-width:420px}.drink[data-side=right] .product-photo{grid-column:2}.drink[data-side=right] .drink-bottom{grid-column:1;justify-self:start}.drink h3{font-family:var(--serif);font-size:clamp(35px,4vw,62px);line-height:1.08;max-width:490px;letter-spacing:-.035em;color:#f7e8d5}.drink .tag{font-size:11px;letter-spacing:.22em;color:#e7b98a;margin-bottom:20px}.drink-bottom>p:last-child{font-size:16px;color:#c8b9a8;line-height:1.65;margin-top:22px}.motion .drink.reveal .product-photo{opacity:0;transform:translate3d(var(--entry-x,-100vw),0,0) rotate(-7deg);transition:transform .62s cubic-bezier(.16,1,.3,1),opacity .2s ease-out}.motion .drink.reveal[data-side=right] .product-photo{transform:translate3d(var(--entry-x,100vw),0,0) rotate(7deg)}.motion .drink.reveal .drink-bottom{opacity:0;transform:translateY(26px);transition:transform .45s ease-out .12s,opacity .4s ease-out .12s}.motion .drink.reveal.visible .product-photo,.motion .drink.reveal.visible[data-side=right] .product-photo{opacity:1;transform:translate3d(0,0,0) rotate(0)}.motion .drink.reveal.visible .drink-bottom{opacity:1;transform:translateY(0)}.drink:hover .product-photo{transform:none}.drink:focus-within .product-photo,.drink:focus-within .drink-bottom{opacity:1!important;transform:none!important}
@media(max-width:600px){.drink,.motion .drink.reveal,.motion .drink.reveal.visible{grid-template-columns:1fr;min-height:82svh;padding:50px 0 35px;gap:0}.product-photo,.drink[data-side=right] .product-photo{grid-column:1;grid-row:1;max-width:390px;width:100%;margin:0 auto;align-self:end}.drink-bottom,.drink[data-side=right] .drink-bottom{grid-column:1;grid-row:2;justify-self:stretch;text-align:center;max-width:none;padding:0 8px;align-self:start}.drink h3{font-size:35px;max-width:340px;margin:auto}.drink .tag{font-size:10px;margin-bottom:13px}.drink-bottom>p:last-child{font-size:14px;margin-top:13px}.drink-top{top:25px}.motion .drink.reveal .product-photo{transition-duration:.52s}.motion .drink.reveal .drink-bottom{transition-delay:.08s}}
@media(prefers-reduced-motion:reduce){.motion .drink.reveal .product-photo,.motion .drink.reveal[data-side=right] .product-photo,.motion .drink.reveal .drink-bottom{opacity:1;transform:none;transition:none}}
.drink,.motion .drink.reveal{overflow:visible}
/* Blend between nearby frames without a black interruption. */
.hero-art{opacity:calc(1 - var(--handoff,0)*.18)}.typed-word{display:inline-block;min-width:7.8ch;text-align:left}.typed-word:after{content:'';display:inline-block;height:.72em;width:1px;margin-left:5px;background:#eeb888;animation:typing-caret 1s steps(1) infinite}@keyframes typing-caret{50%{opacity:0}}.hero-copy h1{font-size:clamp(49px,5.1vw,84px)}@media(max-width:600px){.hero-copy h1{font-size:clamp(34px,9.3vw,43px)}.motion .drink.reveal .product-photo{transition-delay:.08s}.motion .drink.reveal .drink-bottom{transition-delay:.2s}}@media(prefers-reduced-motion:reduce){.typed-word:after{display:none}.typed-word{min-width:0}}
/* Feather the scene boundaries while leaving cups and labels sharp. */
.product-photo{
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 89%,transparent 100%),linear-gradient(to right,transparent 0%,#000 13%,#000 87%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 5%,#000 89%,transparent 100%),linear-gradient(to right,transparent 0%,#000 13%,#000 87%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.signature-intro img{
  -webkit-mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);
  mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);
}
/* The real Coffee Cabin identity and its four local outlets. */
.brand-logo{width:52px;height:52px;object-fit:contain;flex-shrink:0}.brand{gap:13px}.story-photo img{height:580px;object-fit:contain;background:#0b0908;border:0;box-shadow:none}.hero-copy .eyebrow{max-width:440px;line-height:1.7;letter-spacing:.13em}.outlets{background:radial-gradient(ellipse at 50% 0%,#4a2b1928,transparent 50%),#100d0b}.outlets-heading{margin-bottom:60px}.outlets-heading h2{font-size:clamp(45px,5vw,76px);margin:22px 0}.outlets-heading>p:last-child{color:var(--muted)}.outlet-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8%}.outlet{padding:38px 0 44px;border-top:1px solid #d9b48644}.outlet h3{font-family:var(--serif);font-size:clamp(29px,3vw,45px);line-height:1.15;margin:21px 0}.outlet>p:not(.eyebrow){color:#d2c3b3;font-size:15px;line-height:1.8}.outlet .outlet-note{font-size:14px!important;color:var(--muted)!important;margin-top:20px;max-width:430px}.outlet-hours{display:block;font-size:13px;color:#dfb88d;margin:21px 0}.outlet .line-link{font-size:14px;gap:55px}.hours-note{font-size:12px;color:var(--muted);margin-top:12px}.contact-cabin{margin-top:85px;padding-top:60px;border-top:1px solid #d9b48644;display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.contact-cabin h2{font-size:clamp(38px,4vw,64px);margin:18px 0 25px}.contact-cabin p:last-child{color:var(--muted);font-size:14px}.contact-links{display:grid;gap:25px}.contact-links a{font-size:16px;overflow-wrap:anywhere;padding-bottom:14px;border-bottom:1px solid #d9b48633}.contact-links span{float:right;margin-left:12px;color:var(--accent)}.contact-links a:hover{color:var(--accent)}.business-details{margin-top:65px;border-top:1px solid #ffffff1c;padding-top:22px;color:var(--muted);font-size:13px}.business-details summary{cursor:pointer;color:#e4c8a9;padding:12px 0}.business-details dl{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.business-details dt{color:#dfc39f;margin-bottom:7px}.business-details dd{margin:0}footer>p{font-size:11px;letter-spacing:.09em}
@media(max-width:600px){.brand-logo{width:42px;height:42px}.story-photo img{height:auto;max-height:520px;width:100%;object-fit:contain}.outlet-grid,.contact-cabin{grid-template-columns:1fr}.contact-cabin{gap:28px;margin-top:55px;padding-top:35px}.contact-links a{font-size:14px}.outlet{padding:30px 0 34px}.outlet h3{font-size:36px}.business-details dl{grid-template-columns:1fr}.hero-copy .eyebrow{font-size:9px;letter-spacing:.09em}.outlets-heading{margin-bottom:35px}}
/* Follow the photograph's native shape so there are no letterbox edges. */
.story-photo{transform:none}
.story-photo img{
  width:100%;height:auto;max-width:335px;margin-inline:auto;background:transparent;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 13%,#000 82%,transparent),linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);
  mask-image:linear-gradient(to bottom,transparent,#000 13%,#000 82%,transparent),linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
/* Small supporting icons and the enhanced photo's native proportions. */
.ui-icon{width:18px;height:18px;flex:none;display:inline-block;vertical-align:-3px;margin-right:9px;color:var(--accent)}.outlet .line-link{align-items:center;gap:9px}.outlet .line-link span{margin-left:24px}.contact-links .ui-icon{float:none}.story-photo img{max-width:440px;max-height:none}
/* The actual scroll scene lands in place; there is no overlay or loading screen. */
.hero.opening-await .hero-art,.hero.opening-await .opening-title{visibility:hidden}
.hero.hero-arriving .hero-art{animation:hero-cup-land 1.2s both;transform-origin:50% 70%;will-change:transform}
.hero.hero-arriving .opening-title{animation:hero-name-arrive .65s .95s both}
.hero-impact{position:absolute;z-index:2;left:var(--impact-x,50%);top:var(--impact-y,70%);pointer-events:none;display:none}
.hero.hero-arriving .hero-impact{display:block}
.hero-impact i{position:absolute;width:clamp(160px,25vw,360px);height:35px;left:0;top:0;border:1px solid #e8b77f80;border-radius:50%;opacity:0;animation:hero-landing-ring .85s .7s both;box-shadow:0 0 20px #df9c491a}
.hero-impact i+ i{animation-delay:.82s;border-color:#f3d4a547}
@keyframes hero-cup-land{0%{transform:translateY(-110svh) rotate(-8deg)}58%{transform:translateY(0) rotate(1deg) scale(1.025,.98)}73%{transform:translateY(-24px) rotate(-1deg)}88%{transform:translateY(0) scale(1.008,.993)}100%{transform:none}}
@keyframes hero-name-arrive{from{opacity:0;filter:blur(5px);translate:0 15px}to{opacity:var(--title-opacity,1);filter:blur(0);translate:0 0}}
@keyframes hero-landing-ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}18%{opacity:.8}100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}
@media(prefers-reduced-motion:reduce){.hero.hero-arriving .hero-art,.hero.hero-arriving .opening-title{animation:none}.hero-impact{display:none!important}}
/* Opening cue stays clear of the cup, then fades with its reveal. */
.opening-scroll{position:absolute;z-index:6;bottom:max(32px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 22px;color:#dfc5a5;font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:var(--cue-opacity,1);text-align:center;white-space:nowrap}
.opening-scroll svg{width:24px;height:24px;animation:scroll-cue-drift 1.8s ease-in-out infinite}.opening-scroll[inert]{visibility:hidden;pointer-events:none}.hero.opening-await .opening-scroll{visibility:hidden}.hero.hero-arriving .opening-scroll{animation:hero-name-arrive .5s 1.2s both}
@keyframes scroll-cue-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media(max-width:600px){.opening-scroll{bottom:max(25px,env(safe-area-inset-bottom));font-size:10px}}
@media(prefers-reduced-motion:reduce){.opening-scroll{display:none}.opening-scroll svg{animation:none}}