/* First-screen refinement: preserve the current palette, GIF and illustration. */
.header{min-height:88px;padding-inline:clamp(24px,4vw,72px);border-bottom-color:rgba(255,255,255,.16)}
.header__brand{width:220px}
.header__tools{left:clamp(24px,4vw,72px);gap:4px}
.header.is-scrolled{min-height:72px}
.hero{--hero-gutter:clamp(28px,5vw,88px);height:100svh;min-height:600px;padding:0;border-radius:0}
/* Muted espresso and cream grading, applied only to the photographic backdrop. */
.hero{background-color:#171413}
.hero__gif{filter:saturate(.48) sepia(.1) contrast(1.12) brightness(.94)}
.hero__shade{background:linear-gradient(180deg,rgba(17,14,13,.4),rgba(24,20,19,.5) 38%,rgba(17,14,13,.8)),linear-gradient(90deg,rgba(27,22,20,.18),transparent 72%)}
.hero__copy{position:absolute;top:48%;left:var(--hero-gutter);width:min(49%,42rem);max-width:none;padding:0;margin:0;transform:translateY(-50%);text-align:start;text-shadow:0 2px 24px rgba(0,0,0,.18)}
.hero__signature{display:flex;align-items:center;gap:14px;margin:0 0 22px!important;color:rgba(255,255,255,.78)!important;font-size:11px!important;font-weight:500;line-height:1.6;letter-spacing:.04em}
.hero__signature::before{content:"";width:28px;height:1px;background:currentColor;opacity:.7}
.hero h1{font-size:clamp(36px,4.1vw,68px);font-weight:500;line-height:1.35;letter-spacing:0;text-wrap:balance}
.hero-title__line+.hero-title__line{margin-top:.08em}
.hero__actions{justify-content:flex-start;gap:12px;margin-top:32px;max-width:none;width:auto}
.hero__actions .button{position:relative;min-height:50px;min-width:150px;padding:12px 24px;font-size:12px;font-weight:500;border-radius:3px;transition:background .2s,border-color .2s,opacity .2s}
.hero__actions .button:not(.button--outline){background:var(--brand-green);border-color:rgba(255,255,255,.2)}
.hero__actions .button--outline{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.55);backdrop-filter:none}
.hero__actions .button:hover{background:rgba(71,67,41,.92);border-color:rgba(255,255,255,.9)}
.hero__people{z-index:2;right:var(--hero-gutter);bottom:104px;width:min(36vw,66svh);opacity:.91}
.hero__landmarks{position:absolute;z-index:1;left:var(--hero-gutter);right:auto;bottom:98px;width:min(50vw,64svh,900px);pointer-events:none;mix-blend-mode:screen;opacity:.62;transform:translateY(25%);filter:contrast(1.25);mask-image:linear-gradient(#000 0%,#000 74%,transparent 78%);-webkit-mask-image:linear-gradient(#000 0%,#000 74%,transparent 78%)}
.hero__landmarks img{display:block;width:100%;height:auto}
.hero__bottom{position:absolute;z-index:6;left:var(--hero-gutter);right:var(--hero-gutter);bottom:max(18px,env(safe-area-inset-bottom,0px));display:flex;direction:ltr;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding-top:14px;border-top:1px solid rgba(255,255,255,.2);color:#fff}
.hero__quick-links{position:static;display:flex;align-items:center;gap:24px;direction:ltr}
.hero__quick-links .hero__scroll,.hero__whatsapp{display:grid;grid-template-rows:30px auto;align-items:center;justify-items:center;align-content:center;min-height:48px;gap:5px;color:rgba(255,255,255,.9);font-size:10px;line-height:1.6;white-space:nowrap}
.hero__quick-links .hero__scroll i{height:28px;width:23px;animation:none}
.hero__whatsapp svg{width:22px;height:28px;padding:3px 0}
.hero__quick-links .hero__motion-toggle{position:static;flex:0 0 44px;width:44px;height:44px;padding:13px;border-color:rgba(255,255,255,.3);background:transparent;color:rgba(255,255,255,.85);backdrop-filter:none}
.hero__quick-links .hero__motion-toggle svg{width:16px;height:16px}
.hero__location{font-size:11px;font-weight:400;color:rgba(255,255,255,.65);white-space:nowrap}
html[lang="en"] .hero__signature{letter-spacing:.18em;font-size:10px!important}
html[lang="en"] .hero h1{font-weight:400;line-height:1.15;letter-spacing:-.035em}
html[lang="en"] .hero__copy{width:min(48%,42rem)}
@media(min-width:48rem){.header .nav{gap:clamp(18px,2.2vw,36px);align-items:center}.header .nav a{font-size:11px;line-height:1.6}.header.is-scrolled .header__brand{width:184px}}
@media(min-width:90rem){.hero__copy{left:8vw;width:46%}.hero__people{right:5vw;width:min(35vw,70svh)}}
@media(max-width:47.99rem){
 .header{min-height:76px;padding:12px 20px}.header__brand{width:min(40vw,168px)}.header__tools{left:14px;gap:0}.menu-button{right:14px;width:44px;height:44px;border:0}
 .header.is-scrolled{min-height:68px}.header.is-scrolled .header__brand{width:min(42vw,172px)}.nav{top:76px}
 .hero{--hero-gutter:24px;height:100svh;min-height:0;padding:0}
 .hero__copy,html[lang="en"] .hero__copy{top:38%;left:var(--hero-gutter);right:var(--hero-gutter);width:auto;max-width:none;transform:translateY(-50%);text-align:center}
 .hero__signature{justify-content:center;margin-bottom:16px!important;font-size:10px!important;gap:10px}.hero__signature::before{width:22px}
 .hero h1{font-size:clamp(29px,7.8vw,41px);font-weight:500;line-height:1.45}
 .hero__actions{width:100%;justify-content:center;gap:10px;margin-top:24px}
 .hero__actions .button{flex:1 1 0;min-width:0;max-width:176px;min-height:48px;padding:10px 12px;font-size:11px}
 .hero__people{right:12px;bottom:100px;width:min(52vw,31svh,270px);opacity:.9}
 .hero__landmarks{left:12px;right:auto;bottom:96px;width:min(56vw,400px);opacity:.9;filter:contrast(1.25) brightness(1.12)}
 .hero__landmarks img{mask-image:linear-gradient(90deg,#000 0%,#000 60%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 60%,transparent 100%)}
 .hero__bottom{bottom:max(16px,env(safe-area-inset-bottom,0px));min-height:72px;padding-top:12px;gap:12px}
 .hero__quick-links{flex-direction:row;gap:18px;align-items:center}.hero__quick-links .hero__scroll{max-width:none}
 .hero__quick-links .hero__scroll,.hero__whatsapp{font-size:9px;line-height:1.5}.hero__location{font-size:10px}
 html[lang="en"] .hero h1{font-size:clamp(30px,8.5vw,44px);line-height:1.2}
 html[lang="en"] .hero__quick-links{gap:12px}html[lang="en"] .hero__quick-links .hero__scroll{max-width:64px;white-space:normal;text-align:center}
}
@media(max-width:47.99rem) and (max-height:740px){.hero{min-height:0}.hero__copy,html[lang="en"] .hero__copy{top:36%}.hero h1{font-size:clamp(26px,7.4vw,30px)}.hero__signature{margin-bottom:10px!important}.hero__actions{margin-top:16px}.hero__people{bottom:96px;width:min(52vw,28svh)}}
@media(max-width:47.99rem) and (max-height:740px){.hero__landmarks{bottom:94px;opacity:.96}}
@media(max-width:360px){.hero{--hero-gutter:18px}.hero__quick-links{gap:12px}.hero__location{font-size:9px}.hero h1{font-size:clamp(26px,7.4vw,30px)}.header__brand{width:42vw}.header__tools{left:8px}.header__instagram,.language-toggle{width:36px}}
@media(prefers-reduced-motion:no-preference){.hero__copy{animation:hero-refined-entry .65s ease-out both}@keyframes hero-refined-entry{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}}
@media(prefers-reduced-motion:reduce){.hero__copy{animation:none}.hero__actions .button{transition:none}}

@media(min-width:48rem) and (max-height:740px){.hero__copy{top:43%}}
.hero__whatsapp{grid-template-rows:40px auto}
.hero__whatsapp .whatsapp-mark{width:40px;height:40px}
.hero__quick-links .hero__scroll{grid-template-rows:40px auto}

/* Editorial first-screen preview inspired by the supplied reference. */
.hero__shade{background:linear-gradient(180deg,rgba(16,15,13,.46),rgba(16,15,13,.16) 50%,rgba(16,15,13,.58))}
.hero__copy,html[lang="en"] .hero__copy{top:clamp(110px,15vh,180px);left:var(--hero-gutter);right:var(--hero-gutter);width:auto;transform:none;text-align:start}
.hero__signature{margin-bottom:10px!important}
.hero h1{max-width:100%;font-size:clamp(64px,9vw,150px);font-weight:600;line-height:1.2;letter-spacing:-.025em}
.hero-title__line+.hero-title__line{margin-top:0}
.hero__actions{margin-top:24px}
.hero__actions .button{border-radius:999px;min-height:48px}
.hero__people,.hero__landmarks{display:none}
.hero__bottom{bottom:max(16px,env(safe-area-inset-bottom,0px));min-height:70px;padding:10px 20px;border:1px solid rgba(255,255,255,.14);border-radius:6px;background:rgba(32,30,25,.48);backdrop-filter:blur(10px)}
@media(max-width:47.99rem){
 .hero{height:100svh;min-height:0}
 .hero__copy,html[lang="en"] .hero__copy{top:clamp(108px,20svh,180px);left:24px;right:24px;transform:none;text-align:center}
 .hero h1,html[lang="en"] .hero h1{font-size:clamp(38px,10.5vw,60px);line-height:1.35;letter-spacing:0}
 .hero__actions{margin-top:20px}
 .hero__bottom{left:14px;right:14px;bottom:max(12px,env(safe-area-inset-bottom,0px));min-height:64px;padding:8px 12px;gap:8px}
 .hero__quick-links{gap:10px}
}
/* Full-colour still photographs crossfade without GIF colour banding. */
.hero__people,.hero__landmarks{display:block}
.hero__people{right:3vw;bottom:96px;width:min(30vw,46svh,440px)}
.hero__landmarks{left:3vw;bottom:95px;width:min(39vw,55svh,600px)}
@media(max-width:47.99rem){
 .hero__people{right:8px;bottom:85px;width:min(46vw,25svh,220px)}
 .hero__landmarks{left:8px;bottom:83px;width:min(55vw,340px)}
 .hero__landmarks img{mask-image:linear-gradient(90deg,#000 0%,#000 55%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 55%,transparent 100%)}
}
.hero__bottom .hero__motion-toggle,.hero__bottom .hero__location{display:none}
.hero__bottom{justify-content:flex-start}
/* Keep the quick links directly on the image and centre the desktop headline. */
.hero__bottom{background:transparent;border:0;border-radius:0;backdrop-filter:none;padding-inline:0}
@media(min-width:48rem){
 .hero__copy,html[lang="en"] .hero__copy{left:50%;right:auto;width:min(80vw,1100px);transform:translateX(-50%);text-align:center}
 .hero h1{margin-inline:auto}
 .hero__actions{justify-content:center}
}
@media(min-width:48rem){
 .hero h1,html[lang="en"] .hero h1{font-size:clamp(36px,3.5vw,60px);line-height:1.35;letter-spacing:0}
}
@media(min-width:48rem){
 .hero__copy,html[lang="en"] .hero__copy{top:50%;transform:translate(-50%,-50%)}
}
/* Scale the illustrations with both the screen width and available height. */
.hero__people{right:clamp(12px,3vw,56px);bottom:clamp(78px,11svh,110px);width:min(28vw,40svh,420px)}
.hero__landmarks{left:clamp(12px,3vw,56px);bottom:clamp(76px,11svh,108px);width:min(35vw,46svh,570px)}
@media(max-width:47.99rem){
 .hero__people{right:8px;bottom:85px;width:min(44vw,23svh,210px)}
 .hero__landmarks{left:8px;bottom:83px;width:min(51vw,29svh,300px)}
}
@media(max-width:47.99rem) and (max-height:650px){
 .hero__people{width:min(38vw,19svh);bottom:78px}
 .hero__landmarks{width:min(46vw,25svh);bottom:76px}
}

/* Balanced hero layout for the local preview. */
.hero__shade{background:linear-gradient(180deg,rgba(18,17,14,.48) 0%,rgba(18,17,14,.34) 35%,rgba(18,17,14,.48) 68%,rgba(18,17,14,.7) 100%)}
.hero__copy{text-align:center;text-shadow:0 2px 24px rgba(0,0,0,.48)}
.hero__actions .button{min-width:160px;min-height:50px;font-size:14px;font-weight:600}
.hero__actions .button--outline{background:rgba(20,19,16,.2);border-color:rgba(255,255,255,.8)}
.hero__actions .button:focus-visible,.hero__quick-links a:focus-visible{outline:2px solid #fff;outline-offset:4px}
.hero__quick-links .hero__scroll,.hero__whatsapp{font-size:11px;color:#fff}
.hero__people{opacity:.88}
.hero__landmarks{opacity:.8}
@media(min-width:48rem){
 .hero__copy,html[lang="en"] .hero__copy{width:min(62vw,760px)}
 .hero h1,html[lang="en"] .hero h1{font-size:clamp(38px,3.8vw,60px);line-height:1.4}
 .hero__actions{margin-top:26px;gap:12px}
}
@media(max-width:47.99rem){
 .hero__copy,html[lang="en"] .hero__copy{top:41%;left:20px;right:20px;transform:translateY(-50%)}
 .hero h1,html[lang="en"] .hero h1{font-size:clamp(30px,8vw,40px);line-height:1.4}
 .hero__actions{gap:10px;margin-top:20px}
 .hero__actions .button{min-width:0;max-width:180px;font-size:12px}
 .hero__people{width:min(43vw,24svh,205px);bottom:86px}
 .hero__landmarks{width:min(49vw,29svh,290px);bottom:84px}
 .hero__bottom{left:20px;right:20px}
}
@media(max-width:47.99rem) and (max-height:650px){
 .hero__copy,html[lang="en"] .hero__copy{top:40%}
 .hero h1,html[lang="en"] .hero h1{font-size:clamp(26px,7vw,32px)}
 .hero__people{width:min(36vw,19svh);bottom:75px}
 .hero__landmarks{width:min(43vw,23svh);bottom:73px}
}
/* Show the full photograph while extending its colours behind it. */
.hero-slideshow .hero-slide{position:absolute;inset:0;overflow:hidden;opacity:0;animation:maison-photo-crossfade 24s ease-in-out infinite both}
.hero-slideshow .hero-slide::before{content:"";position:absolute;inset:-24px;background:var(--slide-image) center/cover no-repeat;filter:blur(18px) brightness(.52)}
.hero-slide--hot-chocolate{--slide-image:url("assets/hero-photos/hot-chocolate.jpg")}
.hero-slide--mojito{--slide-image:url("assets/hero-photos/mojito.jpg")}
.hero-slide--coffee-desserts{--slide-image:url("assets/hero-photos/coffee-desserts.jpg")}
.hero-slide--cold-drinks{--slide-image:url("assets/hero-photos/cold-drinks.jpg")}
.hero-slideshow .hero-slide img{position:relative;display:block;width:100%;height:100%;object-fit:contain;object-position:center;opacity:1;animation:none}
.hero-slideshow .hero-slide:first-child{opacity:1;animation-delay:-1s}
.hero-slideshow .hero-slide:nth-child(2){animation-delay:5s}
.hero-slideshow .hero-slide:nth-child(3){animation-delay:11s}
.hero-slideshow .hero-slide:nth-child(4){animation-delay:17s}
.hero-slideshow.is-paused .hero-slide{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.hero-slideshow .hero-slide{animation:none!important;opacity:0}.hero-slideshow .hero-slide:first-child{opacity:1}}
@media(max-width:47.99rem){
 .hero__people,.hero__landmarks{display:none}
}

@keyframes maison-photo-crossfade{0%{opacity:0}4%,25%{opacity:1}29%,100%{opacity:0}}
/* Fill the first screen and keep each product in view. */
.hero-slideshow .hero-slide::before{display:none}
.hero-slideshow .hero-slide img{object-fit:cover}
.hero-slide--hot-chocolate img{object-position:68% 62%}
.hero-slide--mojito img{object-position:50% 54%}
.hero-slide--coffee-desserts img{object-position:50% 45%}
.hero-slide--cold-drinks img{object-position:50% 50%}
@media(max-width:47.99rem){
 .hero-slide--hot-chocolate img{object-position:65% center}
 .hero-slide--mojito img,.hero-slide--coffee-desserts img,.hero-slide--cold-drinks img{object-position:center}
}
.hero-slideshow .hero-slide picture{display:block;width:100%;height:100%}
@media(min-width:48rem){.hero-slideshow .hero-slide img{object-position:center}}
@media(max-width:47.99rem){
 .hero-slide--hot-chocolate img,.hero-slide--cold-drinks img{object-position:center}
}
/* Show the guests without the skyline. */
.hero__landmarks{display:none}
@media(max-width:47.99rem){.hero__people{display:block}}
@media(min-width:48rem){
 .hero__people{width:min(35vw,53svh,560px);right:clamp(12px,2vw,40px);bottom:clamp(72px,9svh,100px)}
}
@media(max-width:47.99rem){
 .hero__people{width:min(56vw,29svh,270px);right:5px;bottom:84px}
}
@media(max-width:47.99rem) and (max-height:650px){
 .hero__people{width:min(47vw,23svh,220px);bottom:75px}
}
.hero__people{bottom:0}
@media(max-width:47.99rem){.hero__people{bottom:0}}
@media(max-width:47.99rem) and (max-height:650px){.hero__people{bottom:0}}
.hero__people{opacity:1;filter:drop-shadow(0 0 .65px rgba(255,255,255,.85))}