/* Sunbeam-inspired coffee direction: original Étoile artwork and choreography. */
:root{--espresso:#18110d;--cream:#f4e6ce;--caramel:#d5a271;--coffee-line:#e2c19b26;--motion-reveal:1000ms}
body{background:var(--espresso);color:var(--cream)}
::selection{background:var(--caramel);color:var(--espresso)}
.coffee-atmosphere{position:fixed;inset:-7vh 0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#120c08a8,#120c0826 65%),url('/assets/coffee/atmosphere.webp') center/cover;transform:translateY(var(--atmosphere-y,0px)) scale(1.02);will-change:transform}
[dir=rtl] .coffee-atmosphere{background-image:linear-gradient(270deg,#120c08c9,#120c0826 75%),url('/assets/coffee/atmosphere.webp')}
body:before{content:'';position:fixed;inset:0;z-index:-1;background:#18110d}
.site-header{position:fixed;inset:24px 4.5vw auto;border:1px solid #f5e8d82b;border-radius:60px;background:#261e18a6;backdrop-filter:blur(24px);box-shadow:0 10px 45px #0002;overflow:hidden;transition:background 280ms}
.site-header.is-scrolled{background:#211a15ed}
.header-inner{height:78px;padding-inline:32px;grid-template-columns:auto 1fr auto;gap:40px}
.brand{grid-column:1;grid-row:1;text-align:start}
.brand .wordmark{width:123px;filter:brightness(0) invert(.92) sepia(.15)}
.brand>span{font-size:5px;letter-spacing:.23em;margin-top:4px}
.desktop-nav{grid-column:2;grid-row:1;justify-content:center;gap:34px;font-size:10px}
.desktop-nav a{position:relative;padding-block:11px}
.desktop-nav a:after{content:'';position:absolute;inset-inline:0;bottom:3px;height:1px;background:var(--caramel);transform:scaleX(0);transition:transform 280ms var(--ease)}
.desktop-nav a:hover:after,.desktop-nav a:focus-visible:after{transform:scaleX(1)}
.header-tools{font-size:10px;gap:22px}
.header-contact{font-size:9px}.language-link{border-color:var(--coffee-line);padding-inline-start:22px}
.reading-progress{background:var(--caramel)}
.hero{height:100svh;min-height:760px;max-height:1080px;grid-template-columns:46% 54%;padding-top:125px;overflow:clip}
.hero-watermark{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-family:Modern,Georgia,serif;font-size:clamp(180px,24vw,420px);line-height:.8;letter-spacing:-.06em;color:#f2d7ac08;pointer-events:none;z-index:-1}
.hero-copy{padding-block:35px 125px;transform:translateY(var(--hero-copy-y,0px))}
.hero-copy>.eyebrow{color:var(--caramel);letter-spacing:.18em;margin-bottom:30px}
.hero h1{font-size:clamp(70px,6.9vw,112px);letter-spacing:-.055em;margin-inline-end:-50px;line-height:1.02;color:var(--cream)}
.hero h1 em{color:var(--caramel)}
.hero-copy>p,[dir=rtl] .hero-copy>p{font-size:13px;color:#d4c4b1;max-width:370px;margin-top:28px}
.hero-actions{gap:28px;margin-top:32px}
.hero .button-green,.contact>.button-green{background:var(--cream);color:#34251b;border-radius:40px;padding-inline:27px}
.hero .button-green:hover,.contact>.button-green:hover{background:#e5c69f;box-shadow:0 8px 30px #0003}
.hero .text-link{color:#e0cfb6;border-color:#e0cfb64d}
.hero-foot{color:#b4a18b;font-size:9px;margin-top:40px}
.hero-stage{margin-inline:-17% -9%;align-self:stretch;transform:translateY(var(--hero-stage-y,0px));perspective:1100px;touch-action:pan-y;cursor:grab}
.hero-stage.is-dragging{cursor:grabbing}
.coffee-splash{position:absolute;inset:1% -4% 17%;z-index:2;display:grid;place-items:center;transform-origin:50% 62%;will-change:transform;pointer-events:none}
.coffee-splash img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;filter:drop-shadow(0 30px 24px #0004)}
.splash-shadow{position:absolute;left:50%;bottom:16%;width:45%;height:6%;border-radius:50%;background:radial-gradient(ellipse,#0008,transparent 70%);transform:translateX(-50%);opacity:.55;pointer-events:none}
.scene-replay{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 17px;border:1px solid #e4c39b40;border-radius:30px;background:#251a1280;color:#e3c9a7;font-size:8px;transition:background 280ms,border-color 280ms}
.scene-replay svg{width:16px;height:16px}.scene-replay:hover{background:#553b25c9;border-color:#e4c39b80}
.hero-stage:before{inset:10% 4% 0;background:radial-gradient(ellipse,#e5a95a15,transparent 62%)}
.stage-orbit{display:none}.stage-star{left:12%;top:14%;color:#d5a27180;z-index:0}.stage-star .spark{width:40px;height:40px}
.stage-top{top:10%;right:13%;color:#dac5a4;font-size:7px;letter-spacing:.22em}
.stage-edition{color:#c2a88a;right:5%;font-size:6px;top:44%}
.scene-controls{bottom:12%;color:#c3ad91;font-size:8px;gap:17px}
.scene-turn{width:39px;height:39px;border-color:#e4c39b40;background:#251a1280;color:var(--cream)}
.scene-turn:hover{background:#a5754940}
.scene-fallback{filter:drop-shadow(0 32px 22px #0004)}
.hero-bottom{color:#b9a186;bottom:33px;padding-top:22px;border-top:1px solid var(--coffee-line);font-size:8px}
.hero-bottom>a>span{border:1px solid #d2b28b50;border-radius:50%;width:33px;height:33px;display:grid;place-items:center}
.hero-enter{animation:cinema-in 1200ms var(--ease) both}
.hero-enter:nth-child(2){animation-delay:100ms}.hero-enter:nth-child(3){animation-delay:220ms}.hero-enter:nth-child(4){animation-delay:340ms}
@keyframes cinema-in{from{opacity:0;transform:translate3d(0,60px,0);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
.ribbon{background:#d3ac7d;color:#291b11;border:0;padding-block:18px;overflow:hidden}
.ribbon-track{gap:58px}.ribbon span{font-size:27px}.ribbon .spark{width:18px;height:18px}
.intro{background:linear-gradient(#18110de6,#18110d9c);padding-block:110px}
.intro>.eyebrow{color:var(--caramel)}.intro h2{color:var(--cream)}.intro h2 em{color:var(--caramel)}
.intro>p,[dir=rtl] .intro>p{color:#c0ae98;font-size:13px;max-width:540px}
.intro-signature{color:var(--caramel)}
.coffee-section{background:linear-gradient(#18110dcc,#1b130cd9);padding-block:90px 65px;color:var(--cream)}
.section-heading{align-items:center;margin-bottom:44px}.section-heading .eyebrow{color:var(--caramel)}
.section-heading h2{font-size:clamp(48px,5vw,76px);margin-top:20px}.section-heading h2 em{color:var(--caramel)}
.section-heading>p{color:#c8b7a0;max-width:300px}
.brew-tabs{justify-content:center;gap:12px;border-top:1px solid var(--coffee-line);border-bottom:1px solid var(--coffee-line);padding:14px 0;margin-bottom:25px}
.brew-tab,[dir=rtl] .brew-tab{padding:11px 25px;border-radius:30px;font-size:11px;color:#c5b39b;min-height:44px;transition:color 280ms,background 280ms}
.brew-tab:after{display:none}.brew-tab.is-active{color:#21170f;background:var(--cream)}
.brew-tab:hover{color:var(--cream);background:#e5c69f18}.brew-tab.is-active:hover{color:#21170f;background:#e9cfab}
.brew-stage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:stretch;min-height:540px}
.brew-panel{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:0;animation:none;transform-origin:50% 75%}
.brew-panel:before{content:'';position:absolute;inset:145px 0 0;z-index:-1;border-radius:24px;border:1px solid #d3af7e30;background:linear-gradient(145deg,#513520d9,#26190fdd);box-shadow:0 18px 44px #0002;transition:background 300ms,border-color 300ms}
.brew-picture{aspect-ratio:1;position:relative;margin:0 12px;background:transparent;isolation:isolate;overflow:hidden;transform:translateY(var(--cup-scroll-y,0px));transition:transform 850ms var(--ease)}
.brew-picture>img{position:absolute;top:50%;width:300%;height:auto;max-width:none;transform:translate(calc(var(--drink-index) * -33.333333%),-50%);clip-path:inset(0 calc((2 - var(--drink-index)) * 33.333333%) 0 calc(var(--drink-index) * 33.333333%));filter:drop-shadow(0 22px 12px #0005)}
.drink-caption{display:none}
.brew-copy,[dir=rtl] .brew-copy{padding:26px 30px 35px;justify-content:flex-start;text-align:center;min-height:0;flex:1}
.brew-copy .eyebrow{color:#bfa17c;font-size:7px}.brew-copy h3{font-size:37px;line-height:1.1;margin-block:18px}
[dir=rtl] .brew-copy h3{font-size:26px;line-height:1.5;margin-block:13px}
.brew-copy>p{font-size:12px;color:#d0bda5;max-width:330px;margin-inline:auto;line-height:2}
.tasting-notes{justify-content:center;margin-top:auto;padding-top:23px;gap:5px}.tasting-notes li{color:#d6bc98;border-color:#e2c19b24;padding:4px 10px;font-size:7px}
.brew-spark{display:none}.brew-stage.is-filtered{display:block;min-height:540px}
.brew-stage.is-filtered .brew-panel{display:grid;grid-template-columns:1fr 1fr;align-items:center;max-width:940px;min-height:470px;margin-inline:auto}
.brew-stage.is-filtered .brew-panel:before{inset:45px 0 25px}
.brew-stage.is-filtered .brew-picture{margin:0 10px;aspect-ratio:1}
.brew-stage.is-filtered .brew-copy{padding:65px 45px;text-align:start}
.brew-stage.is-filtered .brew-copy>p{margin-inline:0}.brew-stage.is-filtered .tasting-notes{justify-content:flex-start;margin-top:0}
.brew-stage.is-filtered .brew-copy h3{font-size:48px}[dir=rtl] .brew-stage.is-filtered .brew-copy h3{font-size:34px}
.menu-note{justify-content:center;color:#bca483;margin-top:30px;font-size:9px}
.js .brew-stage.reveal{transform:none!important;opacity:1;transition:none}
.js .brew-stage:not(.is-visible) .brew-panel,.js .brew-panel:not(.card-visible){opacity:0;transform:translateY(85px) rotate(3deg) scale(.94)}
.js .brew-stage.is-visible:not(.is-switching) .brew-panel{transition:opacity 1000ms var(--ease),transform 1000ms var(--ease);transition-delay:calc(var(--card-order) * 130ms)}
.brew-panel:hover:before{border-color:#d5a27170;background:linear-gradient(145deg,#60412add,#302014ef)}
@media(hover:hover) and (pointer:fine){.brew-panel:hover .brew-picture{transform:translateY(-13px) rotate(-3deg)}.brew-panel:nth-child(2):hover .brew-picture{transform:translateY(-13px) rotate(3deg)}}
.takeaway{min-height:710px;position:relative;isolation:isolate;background:linear-gradient(110deg,#e3d1b9,#f0e8dc);border-block:1px solid #d7c0a333;padding-block:85px;color:#35261c}
.takeaway:before{content:'ÉTOILE';position:absolute;bottom:20px;left:-2%;font-family:Modern,Georgia,serif;font-size:22vw;line-height:1;letter-spacing:-.06em;color:#8c70450c;z-index:-1;pointer-events:none}
.takeaway-disc{border-color:#92785530;background:radial-gradient(#fff9e8a0,transparent 65%)}
.takeaway-star{color:#a6814e80}.takeaway-art>img{filter:drop-shadow(0 35px 25px #5c391c22)}
.takeaway-copy>.eyebrow{color:#8f6b44}.takeaway-copy h2 em,.handwritten{color:#6a442b}
.takeaway-copy>p{color:#756451}.takeaway-tags{border-color:#92785530}.takeaway-tags .spark{color:#9d7343}
.art-caption{color:#81633e}.takeaway-copy{padding-inline-start:50px}
.story{margin:75px var(--gutter);min-height:580px;border-radius:30px;overflow:hidden;background:#2c1e14e8;border:1px solid #d3af7e29;grid-template-columns:48% 52%}
.story-photo{min-height:580px}.story-copy,[dir=rtl] .story-copy{padding:60px 55px}
.story-copy .eyebrow{color:var(--caramel)}.story-copy h2{font-size:clamp(50px,5vw,76px)}.story-copy h2 em{color:var(--caramel)}
.story-copy>p{color:#c9b59b}.story-signature{color:#e0c49e}.story-signature>.spark{color:var(--caramel)}
.contact{padding-block:70px 100px;background:linear-gradient(#18110d20,#18110dcc)}
.contact-mark,.contact h2 em{color:var(--caramel)}.contact>.eyebrow{color:#c4a680}.contact>p{color:#c3af95}
.contact-phone{color:#bba78c}.contact-phone a{color:var(--cream);border-color:#d3af7e40}
.footer{background:#120e0b;color:var(--cream);border-top:1px solid #d3af7e26}
.footer-bottom,.footer-top>a>span{color:#b4a28c}.footer-bottom{border-color:#d3af7e26}.back-top>span{border-color:#d3af7e40}
.menu-dialog{background:#211710;color:var(--cream)}.menu-top .wordmark{filter:brightness(0) invert(.92) sepia(.15)}.menu-foot{color:#c1a27c}
/* WhatsApp follows the coffee palette, including open, hover and focus states. */
.whatsapp-widget{z-index:45}
.chat-panel{width:min(352px,calc(100vw - 32px));background:linear-gradient(145deg,#35251b,#21170f);color:var(--cream);border:1px solid #d5a27155;border-radius:24px;box-shadow:0 24px 70px #0006,0 1px 0 #f4e6ce0a inset;scrollbar-color:#a77d55 #21170f}
.chat-header{gap:12px;padding:20px 18px;background:radial-gradient(ellipse at top right,#d5a27118,transparent 75%),#241a13;border-bottom:1px solid var(--coffee-line);color:var(--cream)}
.chat-emblem{width:44px;height:44px;border-color:#d5a27155;background:#d5a2710d}
.chat-emblem .spark{color:var(--caramel)}
.chat-brand{font-size:27px;letter-spacing:.04em}
.chat-subtitle,[dir=rtl] .chat-subtitle{font-size:10px;color:#cdb294;margin-top:4px}
.chat-close{width:44px;height:44px;padding:12px;border:1px solid #e2c19b26;color:#e0c9ac;transition:background var(--ui),border-color var(--ui)}
.chat-close:hover{background:#d5a27118;border-color:#d5a27166}
.chat-body{padding:27px 24px 24px;color:var(--cream)}
.chat-body h2{font-size:31px;line-height:1.2;letter-spacing:-.03em;margin-bottom:13px;color:var(--cream)}
[dir=rtl] .chat-body h2{font-size:23px;line-height:1.6;letter-spacing:0}
.chat-body>p,[dir=rtl] .chat-body>p{font-size:12px;line-height:2;color:#d0bda5;margin-bottom:24px}
.chat-action{min-height:52px;padding:14px 18px;gap:12px;border-radius:32px;background:var(--cream);color:#34251b;font-size:11px}
.chat-action:hover{background:#e5c69f;box-shadow:0 8px 24px #0003}
.chat-number{color:#e4c9a7;font-size:11px;margin-top:20px}
.chat-note{color:#baa58d;font-size:9px;margin-top:6px}
.chat-launcher{background:#302218;color:var(--cream);border-color:#d5a27188;box-shadow:0 8px 28px #0005}
.chat-launcher:hover,.chat-launcher[aria-expanded=true]{background:#493222;border-color:var(--caramel);box-shadow:0 8px 28px #0005}
.whatsapp-widget :focus-visible{outline-color:var(--caramel);outline-offset:4px}
.js .reveal{transform:translateY(55px);transition:opacity var(--motion-reveal) var(--ease),transform var(--motion-reveal) var(--ease)}
.js .reveal.is-visible{transform:none}
.js .takeaway-art.reveal{transform:translateY(60px) rotate(-7deg) scale(.94)}
.js .takeaway-art.reveal.is-visible{transform:none}
[dir=rtl] .hero h1{font-size:clamp(49px,5.4vw,80px);line-height:1.5;letter-spacing:-.065em}
[dir=rtl] .hero-copy>.eyebrow{letter-spacing:0}
[dir=rtl] .hero-stage{margin-inline:-15% -12%}
@media(max-width:1100px){
 .site-header{inset-inline:25px}.header-inner{padding-inline:25px;gap:25px}.desktop-nav{gap:20px}.header-contact{display:none}
 .hero{min-height:740px}.hero h1{font-size:77px}.hero-stage{margin-inline:-20% -13%}
 .brew-stage{gap:18px}.brew-copy,[dir=rtl] .brew-copy{padding-inline:20px}.brew-copy h3{font-size:31px}.brew-copy>p{font-size:11px}
 .story-copy,[dir=rtl] .story-copy{padding-inline:35px}.story{min-height:550px}.story-photo{min-height:550px}
}
@media(max-width:760px){
 html{scroll-padding-top:110px}.site-header{inset:14px 14px auto;border-radius:38px}.header-inner{height:67px;padding-inline:18px;grid-template-columns:1fr auto 1fr;gap:12px}
 .brand{grid-column:2;text-align:center}.brand .wordmark{width:110px}.brand>span{font-size:4px}.menu-open{grid-column:1;grid-row:1;margin-inline-start:-9px}.header-tools{grid-column:3;grid-row:1}.language-link{padding:0;font-size:8px}
 .hero{height:auto;min-height:0;max-height:none;display:flex;padding-top:123px;padding-bottom:60px;overflow:hidden}
 .hero-copy{padding:0;transform:none!important}.hero-copy>.eyebrow{font-size:7px;margin-bottom:19px}
 .hero h1{font-size:clamp(46px,12.5vw,69px);line-height:1.05;margin:0}.hero-copy>p,[dir=rtl] .hero-copy>p{font-size:12px;line-height:2;max-width:335px;margin-top:21px}
 .hero-actions{gap:18px;margin-top:24px}.hero-actions>.button{font-size:9px;padding:14px 19px;min-height:47px}.hero-actions>.text-link{font-size:8px}
 .hero-stage,[dir=rtl] .hero-stage{height:430px;width:calc(100% + 48px);margin:0 -24px -10px;transform:none!important}
 .coffee-splash{inset:-2% -7% 15%}.splash-shadow{bottom:13%}.scene-replay{font-size:7px;min-height:39px;padding:8px 14px}
 .stage-top{top:7%;right:8%;font-size:5px}.stage-star{left:13%;top:12%}.stage-star .spark{width:30px;height:30px}.stage-edition{font-size:5px}
 .scene-controls{bottom:3%;font-size:7px;gap:15px}.scene-turn{width:34px;height:34px}
 .hero-bottom{bottom:16px;padding-top:13px;inset-inline:24px;font-size:5px}.hero-bottom>a{font-size:6px}.hero-bottom>a>span{width:25px;height:25px;font-size:14px}
 .hero-watermark{font-size:36vw;bottom:40px}.coffee-atmosphere{background-position:65% center;opacity:.8}
 [dir=rtl] .hero h1{font-size:clamp(35px,9.8vw,48px);line-height:1.5;letter-spacing:-.065em}
 .ribbon{padding-block:15px}.ribbon-track{gap:30px}.ribbon span{font-size:23px}[dir=rtl] .ribbon span{font-size:15px}
 .intro{padding-block:75px}.intro h2{font-size:43px}.intro>p,[dir=rtl] .intro>p{font-size:12px}.intro-signature>span{font-size:21px}
 .coffee-section{padding-block:60px 40px}.section-heading{margin-bottom:30px}.section-heading h2{font-size:45px}.section-heading>p{font-size:12px;max-width:340px}
 .brew-tabs{gap:5px;justify-content:space-between;padding:10px 0;margin-bottom:14px}.brew-tab,[dir=rtl] .brew-tab{font-size:8px;padding:8px 11px;min-height:42px;white-space:nowrap}
 /* A bounded mobile stack avoids intrinsic grid sizing widening the RTL cards. */
 .brew-stage{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;min-width:0;min-height:0}.brew-panel{flex:none;min-width:0;max-width:100%;width:min(100%,440px);margin-inline:auto}.brew-panel:before{inset:130px 0 0;border-radius:22px}
 .brew-picture{min-width:0;margin-inline:16px;aspect-ratio:1}.brew-copy,[dir=rtl] .brew-copy{min-width:0;max-width:100%;padding:10px 27px 30px!important;min-height:0}.brew-copy h3{font-size:36px;margin-block:17px}.brew-copy>p{font-size:12px;max-width:330px}.brew-copy .eyebrow{font-size:7px}
 [dir=rtl] .brew-copy h3{font-size:25px}.tasting-notes{padding-top:20px;margin-top:0}.tasting-notes li{font-size:7px;padding-inline:11px}
 .brew-stage.is-filtered{min-height:0}.brew-stage.is-filtered .brew-panel{display:flex;min-height:0;max-width:440px}.brew-stage.is-filtered .brew-panel:before{inset:130px 0 0}.brew-stage.is-filtered .brew-picture{margin-inline:16px;aspect-ratio:1}
 .brew-stage.is-filtered .brew-copy{text-align:center}.brew-stage.is-filtered .brew-copy>p{margin-inline:auto}.brew-stage.is-filtered .brew-copy h3{font-size:36px}[dir=rtl] .brew-stage.is-filtered .brew-copy h3{font-size:25px}.brew-stage.is-filtered .tasting-notes{justify-content:center}
 .menu-note{font-size:8px;gap:9px;margin-top:27px;text-align:center}.menu-note .spark{flex-shrink:0}
 .takeaway{padding-block:38px 65px;min-height:0}.takeaway-art{margin-bottom:40px}.takeaway-copy{padding:0}.takeaway-copy>p{font-size:12px}.takeaway-copy h2{font-size:45px}
 .story{margin:40px 14px;min-height:0;border-radius:25px}.story-photo{min-height:380px}.story-copy,[dir=rtl] .story-copy{padding:43px 27px 48px}.story-copy h2{font-size:57px}.story-copy>p{font-size:12px;max-width:340px}
 .contact{padding-block:40px 72px}.contact h2{font-size:54px}.contact>p{font-size:12px}.contact>.button{font-size:9px}.contact-phone{font-size:8px}
 .js .brew-stage.is-visible:not(.is-switching) .brew-panel{transition-delay:0ms}
 .js .brew-stage:not(.is-visible) .brew-panel,.js .brew-panel:not(.card-visible){transform:translateY(38px)}
}
@media(max-width:370px){
 .hero{padding-top:114px}.hero-stage,[dir=rtl] .hero-stage{height:365px}.hero-copy>p,[dir=rtl] .hero-copy>p{font-size:11px}.hero-actions{gap:13px}.hero-actions>.button{font-size:8px;padding-inline:15px}.hero-actions>.text-link{font-size:7px}
 .brew-tab,[dir=rtl] .brew-tab{font-size:7px;padding-inline:8px}.brew-copy,[dir=rtl] .brew-copy{padding-inline:22px!important}.brew-copy>p{font-size:11px}.brew-panel:before,.brew-stage.is-filtered .brew-panel:before{top:110px}
 .story-photo{min-height:320px}.story-copy,[dir=rtl] .story-copy{padding-inline:23px}.contact h2{font-size:46px}
}
@media(prefers-reduced-motion:reduce){
 .coffee-atmosphere,.hero-copy,.hero-stage,.brew-picture,.takeaway-art{transform:none!important}
 .hero-enter{animation:none!important}.js .reveal,.js .brew-stage:not(.is-visible) .brew-panel,.js .brew-panel:not(.card-visible){opacity:1;transform:none!important}
 .coffee-atmosphere{will-change:auto}
 .coffee-splash{transform:none!important;opacity:1!important;will-change:auto}.scene-replay{display:none}
}
