/* ============================================================
   FRESH HOUSE — Maison de pâtisserie · design 2026
   Fonts: Gambarino · Boska · Satoshi (Fontshare / ITF, free commercial licence)
   ============================================================ */
@font-face{font-family:'Gambarino';src:url('fonts/Gambarino-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Boska';src:url('fonts/Boska-400i.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Boska';src:url('fonts/Boska-500i.woff2') format('woff2');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Boska';src:url('fonts/Boska-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-900.woff2') format('woff2');font-weight:900;font-display:swap}

:root{
  --noir:#0a0807; --ink:#110d0a; --choc:#1b130e; --choc-2:#25190f;
  --forest:#0f1712; --forest-2:#16221a;
  --gold:#d4ae6a; --gold-hi:#f4e0ad; --gold-lo:#8f6d34;
  --pist:#b4c98a; --rasp:#e0456b;
  --ivory:#efe6d8; --mute:#a2978a; --line:rgba(212,174,106,.28);
  --serif:'Gambarino','Didot',serif; --ital:'Boska','Didot',serif; --sans:'Satoshi',system-ui,sans-serif;
  --gutter:clamp(20px,5.4vw,56px);
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip}
body{background:var(--noir);color:var(--ivory);font-family:var(--sans);font-size:16px;line-height:1.6;overflow-x:hidden;overflow-x:clip;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--gold);color:var(--noir)}
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:12px;font:500 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.eyebrow::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.h-xl{font-family:var(--serif);font-weight:400;font-size:clamp(46px,13vw,148px);line-height:.92;letter-spacing:-.01em}
.h-l{font-family:var(--serif);font-weight:400;font-size:clamp(40px,11vw,104px);line-height:.95}
.it{font-family:var(--ital);font-style:italic;font-weight:400;color:var(--gold)}
.lead{font-size:clamp(16px,4.3vw,19px);color:#d8cfc2;max-width:34ch}
.gold-text{background:linear-gradient(100deg,var(--gold-lo) 0%,var(--gold-hi) 28%,var(--gold) 48%,var(--gold-hi) 62%,var(--gold-lo) 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}
@keyframes shine{to{background-position:-220% 0}}

/* split letters */
.split .ch{display:inline-block;transform-origin:50% 100% -40px;transform:rotateX(-95deg) translateY(.3em);opacity:0;transition:transform 1.3s var(--ease),opacity 1s var(--ease);transition-delay:calc(var(--i)*38ms + var(--d,0ms))}
.split.in .ch{transform:none;opacity:1}
.split .w{display:inline-block;white-space:nowrap;perspective:600px}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:14px;height:60px;padding:0 10px 0 28px;border-radius:999px;font:700 13px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;isolation:isolate;transform-style:preserve-3d;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.btn .ico{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;flex:none;transition:transform .6s var(--ease)}
.btn svg{width:18px;height:18px}
.btn-gold{color:#1a1206;background:linear-gradient(135deg,#fbecc4 0%,#e3c07c 26%,#c99d55 52%,#8f6d34 78%,#e8cb8c 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -2px 6px rgba(80,52,14,.45),0 7px 0 #5d4320,0 18px 40px -10px rgba(212,174,106,.55)}
.btn-gold .ico{background:#120c06;color:var(--gold-hi);box-shadow:inset 0 0 0 1px rgba(244,224,173,.25)}
.btn-gold::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.75) 46%,transparent 60%);background-size:260% 100%;background-position:160% 0;mix-blend-mode:soft-light;animation:sweep 3.6s var(--ease) infinite;z-index:-1}
@keyframes sweep{0%,55%{background-position:160% 0}100%{background-position:-60% 0}}
.btn-gold:active{transform:translateY(5px);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -2px 6px rgba(80,52,14,.45),0 2px 0 #5d4320,0 8px 20px -10px rgba(212,174,106,.5)}
.btn-glass{color:var(--ivory);background:rgba(255,255,255,.04);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.08)}
.btn-glass .ico{background:rgba(212,174,106,.12);color:var(--gold)}
.btn-glass:active{transform:scale(.97)}
@media (hover:hover){.btn:hover .ico{transform:rotate(-45deg)}.btn-gold:hover{transform:translateY(-2px)}}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 14px) var(--gutter) 14px;transition:background .5s,backdrop-filter .5s}
.nav.solid{background:rgba(10,8,7,.62);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(212,174,106,.12)}
.mark{display:flex;align-items:center;gap:12px}
.mark svg{width:42px;height:42px}
.mark .wm{font:400 13px/1 var(--serif);letter-spacing:.26em;margin-right:-.26em}
.mark .wm small{display:block;margin-top:5px;font:500 8px/1 var(--sans);letter-spacing:.42em;color:var(--gold)}
.nav-r{display:flex;align-items:center;gap:10px}
.lang{display:flex;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font:700 11px/1 var(--sans);letter-spacing:.14em}
.lang button{padding:8px 9px;border-radius:999px;color:var(--mute);transition:all .4s var(--ease)}
.lang button.on{background:var(--gold);color:var(--noir)}
.burger{width:46px;height:46px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center}
.burger i{display:block;width:18px;height:1.5px;background:var(--ivory);position:relative;transition:transform .5s var(--ease)}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:100%;height:1.5px;background:inherit;transition:transform .5s var(--ease)}
.burger i::before{top:-6px}.burger i::after{top:6px;width:60%}
body.menu-open .burger i{background:transparent}
body.menu-open .burger i::before{transform:translateY(6px) rotate(45deg);background:var(--ivory)}
body.menu-open .burger i::after{transform:translateY(-6px) rotate(-45deg);width:100%;background:var(--ivory)}

/* fullscreen menu */
.menu{position:fixed;inset:0;z-index:55;background:radial-gradient(120% 80% at 80% 0%,#2a1c11 0%,var(--noir) 60%);display:flex;flex-direction:column;justify-content:center;padding:110px var(--gutter) 40px;clip-path:circle(0% at calc(100% - 46px) 38px);transition:clip-path 1s var(--ease);perspective:900px}
body.menu-open .menu{clip-path:circle(150% at calc(100% - 46px) 38px)}
.menu a.big{display:block;font:400 clamp(44px,13vw,96px)/1.05 var(--serif);transform:rotateX(-70deg) translateY(40px);transform-origin:50% 100%;opacity:0;transition:transform 1s var(--ease),opacity .8s;transition-delay:calc(var(--i)*70ms + 150ms)}
.menu a.big em{font-family:var(--ital);color:var(--gold);font-size:.42em;vertical-align:super;margin-left:8px}
body.menu-open .menu a.big{transform:none;opacity:1}
.menu .meta{margin-top:40px;color:var(--mute);font-size:14px;opacity:0;transition:opacity 1s .6s}
body.menu-open .menu .meta{opacity:1}

/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden;perspective:1100px;background:radial-gradient(90% 60% at 50% 42%,#2b1d12 0%,#140e0a 45%,var(--noir) 80%)}
.hero canvas{position:absolute;inset:0;width:100%;height:100%}
.scene{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.fruit{position:absolute;left:50%;top:50%;width:var(--w);transform-style:preserve-3d;will-change:transform;filter:drop-shadow(0 30px 30px rgba(0,0,0,.55)) drop-shadow(0 0 30px rgba(212,174,106,.08))}
.fruit img{width:100%;height:auto;transform:translateZ(0)}
.hero-copy{position:absolute;left:0;right:0;bottom:0;padding:0 var(--gutter) calc(env(safe-area-inset-bottom,0px) + 40px);z-index:5;will-change:transform,opacity;transform:translateZ(1px)}
.hero-copy .kick{margin-bottom:18px}
.hero h1{margin-bottom:18px}
.hero h1 .l2{display:block;padding-left:.9em}
.hero .lead{margin-bottom:28px}
.hero-shade{position:absolute;inset:auto 0 0 0;height:62%;transform:translateZ(0);background:linear-gradient(180deg,rgba(10,8,7,0),rgba(10,8,7,.85) 55%,var(--noir));z-index:4;pointer-events:none}
.hero-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 92px);left:0;right:0;text-align:center;z-index:3;font:italic 400 clamp(22px,6.4vw,40px)/1.15 var(--ital);color:var(--gold-hi);opacity:.95;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.gyro{position:absolute;right:var(--gutter);top:calc(env(safe-area-inset-top,0px) + 150px);z-index:6;display:none;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;font:700 10px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi);background:rgba(212,174,106,.1);box-shadow:inset 0 0 0 1px var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.gyro.show{display:inline-flex}
.gyro i{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(212,174,106,.7);animation:ping 1.8s infinite}
@keyframes ping{to{box-shadow:0 0 0 10px rgba(212,174,106,0)}}
.cue{position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 86px);z-index:6;width:1px;height:46px;background:linear-gradient(var(--gold),transparent);transform:translateX(-50%);display:none}

/* marquee */
.marquee{position:relative;overflow:hidden;padding:26px 0;border-block:1px solid rgba(212,174,106,.16);background:var(--ink)}
.marquee .track>div{display:flex}
.marquee .track{display:flex;width:max-content;animation:mq 38s linear infinite}
.marquee span{font:italic 400 clamp(30px,8vw,64px)/1 var(--ital);padding-right:.6em;color:var(--ivory)}
.marquee span b{font:400 .5em/1 var(--sans);color:var(--gold);vertical-align:middle;padding-right:.9em}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{position:relative}
.pad{padding:clamp(96px,22vw,180px) var(--gutter)}
.reveal{opacity:0;transform:perspective(900px) rotateX(18deg) translate3d(0,60px,-80px);transform-origin:50% 0;transition:opacity 1.2s var(--ease),transform 1.4s var(--ease);transition-delay:var(--d,0ms)}
.reveal.in{opacity:1;transform:none}

/* signature / trompe-l'oeil */
.sig{background:linear-gradient(180deg,var(--ink),var(--noir))}
.sig .intro{display:grid;gap:22px;margin-bottom:46px}
.flavors{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.flavors span{padding:9px 14px;border-radius:999px;font:500 12px/1 var(--sans);letter-spacing:.06em;color:var(--ivory);background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(212,174,106,.22)}
.flavors span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:8px;background:var(--c,var(--gold));vertical-align:middle;box-shadow:0 0 10px var(--c,var(--gold))}
.flow{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:30px calc(50% - 36vw) 60px;margin:0 calc(var(--gutter)*-1);perspective:1000px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.flow::-webkit-scrollbar{display:none}
.card3d{flex:none;width:72vw;max-width:420px;aspect-ratio:3/4.1;scroll-snap-align:center;transform-style:preserve-3d;will-change:transform;cursor:pointer}
.card3d .in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1.1s var(--ease)}
.card3d.flip .in{transform:rotateY(180deg)}
.card3d .face{position:absolute;inset:0;border-radius:26px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0 40px 70px -30px rgba(0,0,0,.9),inset 0 0 0 1px rgba(212,174,106,.25)}
.card3d .face img{width:100%;height:100%;object-fit:cover}
.card3d .face::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(10,8,7,.85));pointer-events:none}
.card3d .holo{position:absolute;inset:0;z-index:2;mix-blend-mode:color-dodge;opacity:.35;background:radial-gradient(60% 40% at var(--hx,30%) var(--hy,20%),rgba(244,224,173,.55),transparent 70%);pointer-events:none}
.card3d .cap{position:absolute;left:22px;right:22px;bottom:20px;z-index:3;display:flex;justify-content:space-between;align-items:flex-end}
.card3d .cap h3{font:400 30px/1 var(--serif)}
.card3d .cap small{font:700 10px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.card3d .back{transform:rotateY(180deg);background:radial-gradient(100% 70% at 50% 0%,#33241a,#120d09);display:flex;flex-direction:column;justify-content:center;padding:34px;text-align:center}
.card3d .back::after{display:none}
.card3d .back .q{font:italic 400 30px/1.15 var(--ital);color:var(--gold-hi);margin:18px 0}
.card3d .back p{color:#cfc5b7;font-size:15px}
.card3d .back .pr{margin-top:22px;font:700 13px/1 var(--sans);letter-spacing:.2em;color:var(--gold)}
.hint{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--mute);font:500 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase}
.hint svg{width:16px;height:16px;color:var(--gold)}

/* carta ring */
.carta{background:radial-gradient(120% 70% at 50% 100%,#24180f 0%,var(--noir) 60%);overflow:hidden}
.carta .intro{text-align:center;display:grid;justify-items:center;gap:20px}
.ring-wrap{position:relative;height:380px;margin:30px calc(var(--gutter)*-1) 10px;perspective:900px;perspective-origin:50% 30%;touch-action:pan-y;cursor:grab}
.ring{position:absolute;left:50%;top:60px;width:0;height:0;transform-style:preserve-3d;will-change:transform}
.ring a{position:absolute;left:-80px;top:0;width:160px;height:224px;border-radius:22px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0 30px 50px -20px rgba(0,0,0,.9),inset 0 0 0 1px rgba(212,174,106,.3)}
.ring a img{width:100%;height:100%;object-fit:cover}
.ring a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,7,0) 40%,rgba(10,8,7,.92))}
.ring a span{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;font:400 20px/1.05 var(--serif)}
.ring a span small{display:block;margin-top:6px;font:700 9px/1 var(--sans);letter-spacing:.22em;color:var(--gold)}
.floor{position:absolute;left:50%;top:250px;width:520px;height:120px;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(212,174,106,.22),transparent 70%);filter:blur(10px)}

/* celebraciones */
.cel{background:linear-gradient(180deg,var(--noir),var(--choc) 30%,var(--choc-2));overflow:hidden}
.occ{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 34px}
.occ span{padding:10px 16px;border-radius:999px;font:700 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi);box-shadow:inset 0 0 0 1px rgba(244,224,173,.35)}
.fan{position:relative;height:480px;margin:30px 0 40px;perspective:1100px}
.fan figure{position:absolute;left:50%;top:20px;width:min(64vw,330px);aspect-ratio:3/4;margin-left:calc(min(64vw,330px)/-2);border-radius:24px;overflow:hidden;transform-style:preserve-3d;will-change:transform;box-shadow:0 50px 80px -30px rgba(0,0,0,.95),inset 0 0 0 1px rgba(212,174,106,.3)}
.fan figure img{width:100%;height:100%;object-fit:cover}
.fan figcaption{position:absolute;left:16px;bottom:14px;font:italic 400 22px/1 var(--ital);color:var(--ivory);text-shadow:0 2px 14px rgba(0,0,0,.8)}
.minis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:34px}
.minis div{aspect-ratio:1;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(212,174,106,.2)}
.minis img{width:100%;height:100%;object-fit:cover}

/* B2B */
.b2b{background:radial-gradient(120% 80% at 0% 0%,var(--forest-2),var(--forest) 55%,#0b110d);overflow:hidden}
.b2b .eyebrow{color:var(--pist)}.b2b .eyebrow::before{background:linear-gradient(90deg,transparent,var(--pist))}
.b2b .it{color:var(--pist)}
.b2b-stage{position:relative;height:340px;margin:30px 0 20px;perspective:900px}
.b2b-stage .plate{position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#1f2d23,#0c130e 70%);box-shadow:0 60px 80px -40px rgba(0,0,0,.9),inset 0 0 0 1px rgba(180,201,138,.25);transform:rotateX(62deg);transform-style:preserve-3d}
.b2b-stage .orb{position:absolute;left:50%;top:50%;width:var(--w);will-change:transform;filter:drop-shadow(0 26px 22px rgba(0,0,0,.6))}
.points{display:grid;gap:12px;margin:10px 0 36px}
.points div{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;background:rgba(255,255,255,.025);box-shadow:inset 0 0 0 1px rgba(180,201,138,.2)}
.points b{font:400 34px/1 var(--serif);color:var(--pist);min-width:64px}
.points span{color:#d6dccb;font-size:15px}
.b2b .btn-gold{background:linear-gradient(135deg,#eef6dc 0%,#c6d99c 30%,#93ab5f 60%,#5f7536 82%,#d3e3ad 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 6px rgba(40,60,20,.45),0 7px 0 #3d4d22,0 18px 40px -10px rgba(180,201,138,.45)}
.b2b .btn-gold .ico{color:var(--pist)}

/* visit */
.visit{background:var(--noir)}
.map{position:relative;margin:34px calc(var(--gutter)*-1) 0;height:340px;overflow:hidden;transform:perspective(900px) rotateX(14deg);transform-origin:50% 100%;border-block:1px solid var(--line)}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(1) invert(.92) sepia(.35) hue-rotate(-12deg) contrast(.92) brightness(.9)}
.map .pin{position:absolute;left:50%;top:46%;transform:translate(-50%,-100%);pointer-events:none}
.map .pin i{display:block;width:18px;height:18px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 8px rgba(212,174,106,.25),0 0 40px var(--gold)}
.info{display:grid;gap:0;margin:34px 0}
.info .row{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid rgba(212,174,106,.16)}
.info .row:first-child{border-top:1px solid rgba(212,174,106,.16)}
.info .k{font:700 10px/1.6 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.info .v{text-align:right;font-size:15px}

/* footer */
footer{padding:80px var(--gutter) calc(env(safe-area-inset-bottom,0px) + 130px);background:linear-gradient(180deg,var(--noir),#000);text-align:center;overflow:hidden}
footer .huge{font:400 clamp(70px,24vw,260px)/.85 var(--serif);letter-spacing:-.02em;margin:10px 0 30px}
footer .soc{display:flex;justify-content:center;gap:12px;margin-bottom:30px}
footer .soc a{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line);color:var(--gold)}
footer .soc svg{width:20px;height:20px}
footer p{color:var(--mute);font-size:13px}

/* dock */
.dock{position:fixed;left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);z-index:50;display:grid;grid-template-columns:1fr 1.35fr 1fr;align-items:center;gap:6px;padding:7px;border-radius:999px;background:rgba(18,13,10,.66);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:inset 0 0 0 1px rgba(212,174,106,.22),0 20px 40px -10px rgba(0,0,0,.8);transform:translateY(140%);transition:transform .9s var(--ease)}
.dock.show{transform:none}
.dock a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0;font:700 9.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ivory)}
.dock a svg{width:19px;height:19px;color:var(--gold)}
.dock a.main{flex-direction:row;justify-content:center;gap:10px;height:52px;border-radius:999px;color:#1a1206;font-size:11px;background:linear-gradient(135deg,#fbecc4,#d9b26a 45%,#9c7a3e 80%,#e8cb8c);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 4px 0 #5d4320}
.dock a.main svg{color:#1a1206}
.dock a.main:active{transform:translateY(3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 1px 0 #5d4320}

/* ---------- category page ---------- */
.cat-hero{position:relative;height:88svh;min-height:560px;overflow:hidden;overflow:clip;perspective:1000px;contain:paint}
.cat-hero .bg{position:absolute;inset:-6%;transform-style:preserve-3d;will-change:transform}
.cat-hero .bg img{width:100%;height:100%;object-fit:cover}
.cat-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,7,.55) 0%,rgba(10,8,7,.1) 30%,rgba(10,8,7,.6) 62%,var(--noir) 100%)}
.cat-hero .copy{position:absolute;left:var(--gutter);right:var(--gutter);bottom:60px;z-index:2}
.back-link{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;font:700 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.chips{position:sticky;top:74px;z-index:20;display:flex;gap:8px;overflow-x:auto;padding:14px var(--gutter);background:rgba(10,8,7,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips a{flex:none;padding:10px 16px;border-radius:999px;font:700 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);box-shadow:inset 0 0 0 1px rgba(212,174,106,.2)}
.chips a.on{color:var(--noir);background:var(--gold)}
.items{padding:30px var(--gutter) 60px;display:grid;gap:14px;perspective:1000px}
.item{position:relative;display:grid;grid-template-columns:1fr auto;gap:6px 18px;padding:24px 22px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,.01));box-shadow:inset 0 0 0 1px rgba(212,174,106,.16);transform-style:preserve-3d;overflow:hidden}
.item .n{font:400 12px/1 var(--sans);letter-spacing:.2em;color:var(--gold);grid-column:1/-1}
.item h3{font:400 25px/1.1 var(--serif)}
.item .p{font:700 19px/1 var(--sans);color:var(--gold-hi);white-space:nowrap;align-self:start;padding-top:4px}
.item p{grid-column:1/-1;color:#bfb4a6;font-size:14.5px;line-height:1.55}
.item.photo{grid-template-columns:1fr;padding:0}
.item.photo .pic{height:250px;overflow:hidden}
.item.photo .pic img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.6s var(--ease)}
.item.photo.in .pic img{transform:scale(1)}
.item.photo .body{display:grid;grid-template-columns:1fr auto;gap:6px 18px;padding:22px}
.tag{display:inline-block;margin-left:8px;padding:5px 9px;border-radius:999px;font:700 9px/1 var(--sans);letter-spacing:.18em;color:var(--noir);background:var(--rasp);vertical-align:middle}
.item .more{grid-column:1/-1;margin-top:6px;font:700 10px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}

/* product sheet */
.sheet{position:fixed;inset:0;z-index:70;pointer-events:none}
.sheet .scrim{position:absolute;inset:0;background:rgba(0,0,0,.6);opacity:0;transition:opacity .6s}
.sheet .panel{position:absolute;left:0;right:0;bottom:0;max-height:92svh;overflow:auto;border-radius:30px 30px 0 0;background:var(--ink);box-shadow:0 -1px 0 rgba(212,174,106,.3);transform:translateY(105%) rotateX(-12deg);transform-origin:50% 100%;transition:transform .9s var(--ease)}
.sheet.open{pointer-events:auto}.sheet.open .scrim{opacity:1}.sheet.open .panel{transform:none}
.sheet .grip{width:44px;height:4px;border-radius:4px;background:rgba(212,174,106,.4);margin:12px auto}
.sheet .pic{height:300px;margin:0 12px;border-radius:22px;overflow:hidden}
.sheet .pic img{width:100%;height:100%;object-fit:cover}
.sheet .body{padding:26px var(--gutter) calc(env(safe-area-inset-bottom,0px) + 30px)}
.sheet h2{font:400 40px/1 var(--serif);margin:12px 0 8px}
.sheet .p{font:700 26px/1 var(--sans);color:var(--gold-hi);margin:16px 0 18px}

@media (min-width:900px){
  .hero-copy{padding-bottom:90px;max-width:880px}
  .dock{left:50%;right:auto;width:440px;margin-left:-220px}
  .sig .intro,.cel .wrap,.b2b .wrap,.visit .wrap{max-width:1100px;margin-inline:auto}
  .items{grid-template-columns:repeat(2,1fr);max-width:1100px;margin:0 auto}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal,.split .ch{opacity:1;transform:none}}

@media (max-width:400px){.mark .wm small{display:none}.mark{gap:9px}.mark .wm{font-size:12px;letter-spacing:.2em}}
.hero-copy .kick{font-size:10px;letter-spacing:.26em}

/* trompe-l'oeil trio (cut-outs) */
.trio{position:relative;height:min(100vw,560px);max-width:560px;margin:10px auto 34px;perspective:900px}
.trio .glow{position:absolute;left:10%;right:10%;bottom:4%;height:30%;background:radial-gradient(50% 50% at 50% 50%,rgba(212,174,106,.28),transparent 70%);filter:blur(8px)}
.tri{position:absolute;left:var(--l);top:var(--t);width:var(--w);transform-style:preserve-3d;will-change:transform;cursor:pointer}
.tri img{width:100%;height:auto;filter:drop-shadow(0 34px 26px rgba(0,0,0,.7)) drop-shadow(0 0 40px rgba(212,174,106,.08))}
.tri.spin img{animation:spin3d 1.4s var(--ease)}
@keyframes spin3d{to{transform:rotateY(360deg)}}
.tri figcaption{position:absolute;left:50%;bottom:-22px;transform:translateX(-50%);font:italic 400 19px/1 var(--ital);color:var(--gold-hi);white-space:nowrap;text-shadow:0 2px 12px rgba(0,0,0,.9)}
.sig .intro.after{margin:0}

/* ============ HERO v2 — 3D dish table (restaurant) ============ */
.hero{display:flex;flex-direction:column;height:auto;min-height:100svh;padding-top:calc(env(safe-area-inset-top,0px) + 96px);background:radial-gradient(110% 55% at 50% 58%,#2a1c12 0%,#150f0b 48%,var(--noir) 78%)}
.hero-head{position:relative;z-index:5;padding:0 var(--gutter);text-align:center}
.hero-head .kick{justify-content:center;margin-bottom:16px;font-size:10px;letter-spacing:.28em}
.hero-head .kick::after{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
.hero h1{margin:0}
.table-wrap{position:relative;flex:1;min-height:340px;perspective:1000px;perspective-origin:50% 20%;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.table-wrap .ghost{position:absolute;left:0;right:0;top:4%;text-align:center;font:400 clamp(110px,36vw,420px)/.8 var(--serif);color:transparent;-webkit-text-stroke:1px rgba(212,174,106,.16);pointer-events:none}
.table{position:absolute;left:50%;top:74%;width:0;height:0;will-change:transform}
.disc{--d:min(104vw,760px);z-index:0;position:absolute;left:calc(var(--d)/-2);top:calc(var(--d)/-2);width:var(--d);height:var(--d);border-radius:50%;transform:rotateX(80deg);background:repeating-conic-gradient(from 0deg,rgba(212,174,106,.07) 0 1.2deg,transparent 1.2deg 22.5deg),radial-gradient(circle,#33231a 0%,#1a120d 52%,rgba(10,8,7,0) 71%)}
.disc::before,.disc::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.disc::before{inset:14%;box-shadow:inset 0 0 0 1.5px rgba(212,174,106,.45),0 0 60px rgba(212,174,106,.12)}
.disc::after{inset:24%;border:1px dashed rgba(212,174,106,.25)}
.dish{--dw:min(58vw,420px);transform-origin:50% 0;position:absolute;left:0;top:0;width:var(--dw);margin-left:calc(var(--dw)/-2);will-change:transform,filter;-webkit-tap-highlight-color:transparent}
.dish img{width:100%;height:auto;transform:translateY(-82%);filter:drop-shadow(0 26px 18px rgba(0,0,0,.75))}
.hero-copy{position:relative;left:auto;right:auto;bottom:auto;z-index:5;padding:0 var(--gutter) calc(env(safe-area-inset-bottom,0px) + 34px);text-align:center;transform:none}
.now{display:inline-flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:12px}
.now .eyebrow{font-size:10px}
.now-name{font:400 clamp(30px,8.6vw,54px)/1 var(--serif);display:inline-block;transition:transform .7s var(--ease),opacity .5s}
.now-name.pop{animation:pop .8s var(--ease)}
@keyframes pop{0%{opacity:0;transform:perspective(500px) rotateX(-80deg) translateY(12px)}100%{opacity:1;transform:none}}
.now svg{width:18px;height:18px;color:var(--gold);transform:rotate(90deg)}
.dots{display:flex;justify-content:center;gap:6px;margin:4px 0 18px}
.dots i{width:6px;height:6px;border-radius:6px;background:rgba(212,174,106,.25);transition:all .5s var(--ease)}
.dots i.on{width:22px;background:var(--gold)}
.hero-copy .lead{margin:0 auto 22px;max-width:30ch;font-size:15.5px}
.hero-copy .btn-row{justify-content:center}
.hero-copy .btn{height:56px}
@media (min-width:900px){.hero-copy{max-width:none}.table{top:62%}.dish{--dw:min(30vw,380px)}}
.table-wrap .gyro{top:auto;bottom:4px}

/* ============ carta pages ============ */
html:not([lang="ca"]) .ca, html[lang="ca"] .es{display:none}
.cat-hero.plain{height:60svh;min-height:420px;background:radial-gradient(90% 70% at 50% 30%,#2a1c12,var(--noir) 70%)}
.cat-hero.plain::after{display:none}
.sec{padding:34px var(--gutter) 6px;max-width:1100px;margin:0 auto}
.sec-h{display:grid;gap:10px;margin-bottom:20px}
.sec-h h2{font:400 clamp(32px,9vw,60px)/1 var(--serif)}
.sec-h .note{color:var(--mute);font-size:14px}
.sec-pic{height:min(62vw,420px);border-radius:24px;overflow:hidden;margin-bottom:16px;box-shadow:0 30px 60px -30px rgba(0,0,0,.9),inset 0 0 0 1px rgba(212,174,106,.2)}
.sec-pic img{width:100%;height:100%;object-fit:cover}
.sec .items{padding:0 0 18px;max-width:none}
.item.row{grid-template-columns:1fr auto;align-items:baseline;padding:15px 20px;border-radius:16px}
.item.row h3{font:400 19px/1.25 var(--serif)}
.item.row .p{font-size:16px;padding-top:0}
.next{text-align:center;display:grid;justify-items:center;gap:14px}
.next-link{display:inline-flex;align-items:center;gap:14px;font:400 clamp(40px,12vw,90px)/1 var(--serif)}
.next-link svg{width:30px;height:30px;color:var(--gold)}
@media (min-width:900px){.sec .items{grid-template-columns:repeat(2,1fr)}}
.item .p small{font:500 11px/1 var(--sans);letter-spacing:.06em;color:var(--mute)}
.sheet .p small{font:500 13px/1 var(--sans);color:var(--mute)}

/* reseñas */
.rev{background:radial-gradient(90% 60% at 50% 40%,#22170f,var(--noir) 70%);text-align:center}
.rev .eyebrow{justify-content:center}
.score{display:grid;justify-items:center;gap:12px;margin:36px 0 34px}
.score .big{font:400 clamp(96px,28vw,170px)/.9 var(--serif);background:linear-gradient(100deg,var(--gold-lo),var(--gold-hi) 35%,var(--gold) 60%,var(--gold-hi));-webkit-background-clip:text;background-clip:text;color:transparent}
.stars{display:flex;gap:6px}
.stars i{width:30px;height:30px;background:linear-gradient(90deg,var(--gold) var(--f),rgba(212,174,106,.22) var(--f));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.9 7.5.7-5.7 5 1.7 7.4L12 18.3 5.5 22l1.7-7.4-5.7-5 7.5-.7z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.9 7.5.7-5.7 5 1.7 7.4L12 18.3 5.5 22l1.7-7.4-5.7-5 7.5-.7z'/%3E%3C/svg%3E") center/contain no-repeat}
.score .cnt{color:#d8cfc2;font-size:15px;letter-spacing:.04em}
.score .g{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(212,174,106,.2);font:700 12px/1 var(--sans);letter-spacing:.06em;color:var(--ivory)}
.score .g svg{width:16px;height:16px}

/* favoritos */
.favs{background:linear-gradient(180deg,var(--noir),#120d09);overflow:hidden}
.favs .intro{display:grid;gap:0;margin-bottom:30px}
.fav-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--gutter)*-1);padding:10px var(--gutter) 40px;scrollbar-width:none;perspective:900px}
.fav-row::-webkit-scrollbar{display:none}
.fav{position:relative;flex:none;width:68vw;max-width:340px;aspect-ratio:4/5;border-radius:24px;overflow:hidden;scroll-snap-align:center;box-shadow:0 34px 60px -28px rgba(0,0,0,.95),inset 0 0 0 1px rgba(212,174,106,.25);transition:transform .8s var(--ease)}
.fav img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.2s var(--ease)}
.fav::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(10,8,7,.88))}
.fav>span{position:absolute;left:18px;right:18px;bottom:16px;z-index:2;font:400 26px/1.05 var(--serif)}
.fav:active{transform:scale(.97)}
@media (hover:hover){.fav:hover img{transform:scale(1.1)}}