/* ===========================================================
   ITURRIETA SAGARDOTEGIA — Sidrería en Aramaio
   Paleta rústica: crema/pergamino + verde bosque + dorado sidra
   Diseño editorial + motor de scroll (GSAP + Lenis)
   =========================================================== */
:root{
  --cream:#F7F5F1;
  --cream-2:#EEEAE3;
  --paper:#FFFFFF;
  --green:#A9663C;
  --green-deep:#8A4F2C;
  --bark:#14161A;
  --green-soft:#F7E7D6;
  --gold:#A8A29A;
  --gold-hi:#D8D2C7;
  --gold-deep:#7E7A72;
  --ink:#16181C;
  --ink-soft:#6A6C70;
  --line:rgba(22,24,28,.14);
  --line-2:rgba(22,24,28,.07);
  --serif:'Bodoni Moda',Georgia,'Times New Roman',serif;
  --sans:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --radius:14px;
  --pad-x:clamp(20px,4vw,42px);
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
body{
  font-family:var(--sans);background:var(--cream);color:var(--ink);
  line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  font-size:clamp(15.5px,1.02vw,17px);
}
::selection{background:var(--green-soft);color:var(--green-deep)}
img{max-width:100%;display:block}
a{color:inherit}
::-webkit-scrollbar{width:9px}
::-webkit-scrollbar-track{background:var(--cream-2)}
::-webkit-scrollbar-thumb{background:#c9b997;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:var(--green)}

.wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad-x)}
.wrap-sm{max-width:880px;margin:0 auto;padding:0 var(--pad-x)}
section{position:relative}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;letter-spacing:-.018em;
  font-variation-settings:'opsz' 110}

/* ---------- GRANO DE PAPEL (encima de todo, sutil) ---------- */
.grain{
  position:fixed;inset:-50%;z-index:9990;pointer-events:none;opacity:.05;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='250'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainmove 800ms steps(2) infinite;
}
@keyframes grainmove{
  0%{transform:translate(0,0)}25%{transform:translate(-1.5%,1%)}
  50%{transform:translate(1%,-1.5%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(0,0)}
}

/* ---------- LOADER ----------
   Oculto por defecto: solo aparece si el JS lo enciende.
   Así, si el JS falla, nunca queda una pantalla tapando la web. */
#load{
  position:fixed;inset:0;z-index:10000;background:var(--bark);
  display:none;place-items:center;
}
html.load-on #load{display:grid}
#load .lw{text-align:center;width:min(300px,64vw)}
#load .lw img{display:block;width:clamp(150px,28vw,190px);height:auto;object-fit:contain;margin:0 auto 26px;opacity:0;transform:translateY(14px)}
#load .lbar{height:2px;background:rgba(255,255,255,.16);overflow:hidden}
#load .lbar i{display:block;height:100%;background:var(--gold-hi);transform:scaleX(0);transform-origin:left}

/* ---------- CORTINA DE TRANSICIÓN ENTRE PÁGINAS ---------- */
.curtain{
  position:fixed;inset:0;z-index:9995;background:var(--bark);pointer-events:none;
  transform:scaleY(0);transform-origin:bottom;will-change:transform;
}
html.nav-in .curtain{transform:scaleY(1);transform-origin:top}

/* ---------- BARRA DE PROGRESO ---------- */
.progress{
  position:fixed;top:0;left:0;height:2px;width:100%;z-index:120;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi));
  transform:scaleX(0);transform-origin:left;pointer-events:none;
}

/* ---------- ETIQUETAS ---------- */
.eyebrow{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--green);font-weight:700;display:inline-flex;align-items:center;gap:13px
}
.eyebrow::before{content:"";width:28px;height:1.5px;background:var(--gold);display:inline-block;flex:none}
.eyebrow.center::after{content:"";width:28px;height:1.5px;background:var(--gold);display:inline-block;flex:none}

/* ---------- NAV ---------- */
nav{
  position:fixed;top:0;left:0;width:100%;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px var(--pad-x);
  transition:padding .5s var(--ease),background .5s var(--ease),box-shadow .5s var(--ease)
}
nav::before{
  content:"";position:absolute;inset:0 0 auto;height:150px;
  background:linear-gradient(180deg,rgba(15,26,17,.62),transparent);
  z-index:-1;transition:opacity .5s;pointer-events:none
}
nav.scrolled::before{opacity:0}
nav.scrolled{
  padding:9px var(--pad-x);background:rgba(252,249,241,.92);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);box-shadow:0 10px 34px -26px rgba(38,34,28,.75)
}
.logo{display:flex;align-items:center;text-decoration:none}
.logo img{height:60px;width:auto;transition:height .5s var(--ease)}
.logo .l-color{display:none}
nav.scrolled .logo img{height:46px}
nav.scrolled .logo .l-white{display:none}
nav.scrolled .logo .l-color{display:block}
.nav-links{display:flex;gap:32px;list-style:none}
.nav-links a{
  text-decoration:none;color:rgba(255,255,255,.94);font-size:.74rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;position:relative;padding:6px 0;
  transition:color .3s;text-shadow:0 1px 10px rgba(0,0,0,.45)
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;
  background:var(--gold-hi);transition:width .45s var(--ease)
}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
nav.scrolled .nav-links a{color:var(--ink);text-shadow:none}
nav.scrolled .nav-links a:hover,nav.scrolled .nav-links a.active{color:var(--green)}
nav.scrolled .nav-links a::after{background:var(--gold)}
.nav-cta{
  padding:12px 26px;border-radius:40px;background:var(--gold);color:#fff;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  font-weight:700;position:relative;overflow:hidden;isolation:isolate;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
  box-shadow:0 12px 26px -14px rgba(185,134,42,.9)
}
.nav-cta::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--green-deep);
  transform:translateY(101%);transition:transform .45s var(--ease)
}
.nav-cta:hover::before{transform:translateY(0)}
.nav-cta:hover{transform:translateY(-2px)}
.nav-actions{display:flex;align-items:center;gap:16px}
.langs{display:flex;gap:2px;align-items:center}
.langs a{
  font-size:.68rem;font-weight:700;letter-spacing:.08em;color:rgba(255,255,255,.6);
  text-decoration:none;padding:5px 6px;border-radius:5px;transition:color .25s
}
.langs a:hover{color:#fff}
.langs a.active{color:var(--gold-hi)}
nav.scrolled .langs a{color:var(--ink-soft)}
nav.scrolled .langs a:hover{color:var(--ink)}
nav.scrolled .langs a.active{color:var(--green)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px}
.burger span{width:24px;height:2px;background:#fff;transition:.35s var(--ease);transform-origin:center}
nav.scrolled .burger span{background:var(--ink)}
.burger.x span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0}
.burger.x span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- BOTONES ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;padding:16px 34px;border-radius:48px;
  text-decoration:none;font-size:.8rem;font-weight:600;letter-spacing:.055em;
  text-transform:none;cursor:pointer;border:0;font-family:var(--sans);
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .45s var(--ease),color .35s var(--ease),border-color .35s var(--ease)
}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateY(101%);
  transition:transform .5s var(--ease)}
.btn:hover::before{transform:translateY(0)}
.btn:hover{transform:translateY(-3px)}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 16px 34px -16px rgba(44,88,54,.9)}
.btn-primary::before{background:var(--green-deep)}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 16px 34px -16px rgba(185,134,42,.9)}
.btn-gold::before{background:var(--green-deep)}
.btn-ghost{color:var(--ink);border:1px solid var(--line)}
.btn-ghost::before{background:var(--green)}
.btn-ghost:hover{color:#fff;border-color:var(--green)}
.btn-light{background:#fff;color:var(--green-deep)}
.btn-light::before{background:var(--cream)}
.btn-outline-light{color:#fff;border:1px solid rgba(255,255,255,.55)}
.btn-outline-light::before{background:rgba(255,255,255,.16)}
.btn-outline-light:hover{border-color:#fff}
.btn .arrow{transition:transform .4s var(--ease)}
.btn:hover .arrow{transform:translateX(5px)}

/* ---------- REVEAL (fallback sin JS) ---------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .95s var(--ease),transform .95s var(--ease)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
.d4{transition-delay:.4s}.d5{transition-delay:.5s}
/* con GSAP el estado inicial lo pone el JS: nada queda invisible si el JS falla */
html.gsap-on .reveal{opacity:1;transform:none;transition:none}

/* palabras enmascaradas de los titulares (las envuelve el JS) */
.wd{display:inline-block;overflow:hidden;vertical-align:top;
  padding-bottom:.14em;margin-bottom:-.14em}
.wd>span{display:inline-block;will-change:transform}

/* ---------- HERO ---------- */
.hero{
  min-height:min(100svh,880px);display:flex;align-items:center;justify-content:center;
  text-align:center;position:relative;overflow:hidden
}
.hero-bg{position:absolute;inset:-6% 0 0;z-index:0;overflow:hidden;will-change:transform}
.hero-bg img{width:100%;height:112%;object-fit:cover}
.hero-bg::after{
  content:"";position:absolute;inset:0;z-index:3;
  background:
    linear-gradient(100deg,rgba(8,8,8,.82) 0%,rgba(8,8,8,.62) 34%,rgba(8,8,8,.28) 66%,rgba(8,8,8,.15) 100%),
    linear-gradient(180deg,rgba(8,8,8,.5) 0%,transparent 26%,transparent 62%,rgba(8,8,8,.7) 100%)
}
.hero-video{position:absolute;inset:0;z-index:0;overflow:hidden;background:#142112 url('assets/caserio.jpg') center/cover no-repeat}
.hero-video iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-height:100vh;min-width:177.78vh;transform:translate(-50%,-50%);border:0;pointer-events:none}
.hero-video::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,32,20,.55),rgba(16,28,18,.36) 45%,rgba(14,24,16,.84))}
.hero-inner{position:relative;z-index:2;max-width:900px;padding:130px 20px 100px;color:#fff}
.hero-logo{width:230px;max-width:62vw;margin:0 auto 18px;filter:drop-shadow(0 4px 18px rgba(0,0,0,.4))}
.hero .eyebrow{color:#fff;justify-content:center;margin-bottom:26px;letter-spacing:.36em}
.hero .eyebrow::before,.hero .eyebrow::after{background:var(--gold-hi)}
.hero h1{
  font-size:clamp(2.8rem,6.6vw,5.6rem);font-weight:400;color:#fff;margin-bottom:26px;
  line-height:1.02;text-shadow:0 2px 34px rgba(0,0,0,.35);font-variation-settings:'opsz' 96
}
.hero h1 em{font-style:italic;color:var(--gold-hi)}
.hero .lead{
  font-size:clamp(1.05rem,1.55vw,1.28rem);color:rgba(255,255,255,.93);
  max-width:590px;margin:0 auto 40px;font-weight:300
}
.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.scroll-hint{
  position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
  font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.82);
  display:flex;flex-direction:column;align-items:center;gap:12px;z-index:3
}
.scroll-hint .line{width:1px;height:48px;background:linear-gradient(#fff,transparent);animation:drop 2.2s ease-in-out infinite}
@keyframes drop{
  0%{transform:scaleY(0);transform-origin:top}
  50%{transform:scaleY(1);transform-origin:top}
  51%{transform-origin:bottom}
  100%{transform:scaleY(0);transform-origin:bottom}
}

/* ---------- CINTA DESLIZANTE ---------- */
.marquee{
  background:var(--green-deep);color:var(--cream);overflow:hidden;white-space:nowrap;
  padding:15px 0;position:relative;z-index:4;border-top:1px solid rgba(255,255,255,.08)
}
.marquee .mtrack{display:inline-flex;will-change:transform}
.marquee span{
  font-family:var(--serif);font-style:italic;font-size:clamp(1rem,1.7vw,1.32rem);
  padding:0 22px;display:inline-flex;align-items:center;gap:22px;white-space:nowrap
}
.marquee span::after{content:"✦";color:var(--gold-hi);font-style:normal;font-size:.7em}

/* ---------- PAGE HEAD ---------- */
.page-head{
  padding:186px 0 92px;background:linear-gradient(158deg,var(--bark),var(--green) 78%);
  color:#fff;position:relative;overflow:hidden;text-align:center
}
.page-head::before{
  content:"";position:absolute;width:460px;height:460px;border:1px solid rgba(255,255,255,.12);
  border-radius:50%;top:-160px;right:-120px
}
.page-head::after{
  content:"";position:absolute;width:320px;height:320px;border:1px solid rgba(224,180,99,.16);
  border-radius:50%;bottom:-190px;left:-90px
}
.page-head .eyebrow{color:#fff;justify-content:center;margin-bottom:18px}
.page-head .eyebrow::before,.page-head .eyebrow::after{background:var(--gold-hi)}
.page-head h1{font-size:clamp(2.5rem,6.2vw,4.6rem);font-weight:400;position:relative;z-index:2;
  font-variation-settings:'opsz' 96}
.page-head p{color:rgba(255,255,255,.9);max-width:620px;margin:18px auto 0;font-weight:300;font-size:1.1rem;position:relative;z-index:2}
.crumbs{position:relative;z-index:2;margin-top:26px;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.crumbs a{text-decoration:none;transition:color .3s}
.crumbs a:hover{color:var(--gold-hi)}

/* ---------- SECCIONES ---------- */
.pad{padding:clamp(84px,10vw,132px) 0}
.pad-sm{padding:clamp(64px,7.5vw,96px) 0}
.bg-alt{background:var(--cream-2)}
.bg-paper{background:var(--paper)}
.sec-head{text-align:center;max-width:720px;margin:0 auto 62px}
.sec-head .eyebrow{justify-content:center;margin-bottom:18px}
.sec-head h2{font-size:clamp(2.15rem,5.2vw,3.6rem);margin-bottom:16px;font-variation-settings:'opsz' 96}
.sec-head p{color:var(--ink-soft);font-weight:300;font-size:1.1rem}

/* ---------- SPLIT ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(38px,5.4vw,74px);align-items:center}
.split.rev{direction:rtl}.split.rev>*{direction:ltr}
.split h2{font-size:clamp(2rem,4.5vw,3.3rem);margin:16px 0 24px;font-variation-settings:'opsz' 96}
.split p{color:var(--ink-soft);font-size:1.05rem;margin-bottom:18px;font-weight:300}
.split .quote{
  font-family:var(--serif);font-style:italic;font-size:1.45rem;line-height:1.42;
  color:var(--green-deep);border-left:2px solid var(--gold);padding-left:24px;margin:28px 0
}
.visual{
  position:relative;border-radius:var(--radius);overflow:hidden;height:clamp(360px,46vw,540px);
  box-shadow:0 40px 70px -44px rgba(38,34,28,.62)
}
.visual img{width:100%;height:118%;object-fit:cover;will-change:transform}
.visual::after{
  content:"";position:absolute;inset:15px;border:1px solid rgba(255,255,255,.17);
  border-radius:5px;pointer-events:none;z-index:2
}
.visual .tag{
  position:absolute;bottom:0;left:0;right:0;padding:26px 30px;color:#fff;z-index:3;
  background:linear-gradient(transparent,rgba(16,28,18,.86));
  font-family:var(--serif);font-style:italic;font-size:1.2rem
}

/* ---------- STATS ---------- */
.stats{display:flex;gap:clamp(26px,4vw,52px);flex-wrap:wrap;margin-top:38px}
.stat{position:relative;padding-top:16px;border-top:1px solid var(--line)}
.stat::before{content:"";position:absolute;top:-1px;left:0;width:34px;height:2px;background:var(--gold)}
.stat .num{font-family:var(--serif);font-size:clamp(2.4rem,4.2vw,3.1rem);color:var(--green);line-height:1;
  font-variation-settings:'opsz' 96}
.stat .lbl{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:10px}

/* ---------- PILARES ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.pillar{text-align:center;padding:8px}
.pillar .icon{
  width:74px;height:74px;border-radius:50%;background:var(--green-soft);
  display:flex;align-items:center;justify-content:center;margin:0 auto 22px;
  color:var(--green);font-size:1.7rem;position:relative;transition:transform .5s var(--ease)
}
.pillar .icon::after{content:"";position:absolute;inset:-9px;border:1px solid var(--gold);border-radius:50%;opacity:.32}
.pillar:hover .icon{transform:translateY(-5px)}
.pillar h3{font-size:1.42rem;margin-bottom:10px}
.pillar p{color:var(--ink-soft);font-weight:300;font-size:.97rem}

/* ---------- MENÚ ---------- */
.menu-card{
  background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:clamp(34px,4.6vw,58px) clamp(26px,4vw,54px);max-width:790px;margin:0 auto;
  box-shadow:0 46px 90px -56px rgba(38,34,28,.55);position:relative
}
.menu-card::before{
  content:"";position:absolute;inset:11px;border:1px solid var(--line-2);border-radius:12px;pointer-events:none
}
.menu-card .mh{text-align:center;margin-bottom:34px}
.menu-card .mh .eyebrow{justify-content:center;margin-bottom:14px}
.menu-card .mh h3{font-size:2rem}
.menu-card .mh .sub{color:var(--ink-soft);font-weight:300;font-size:.95rem;margin-top:8px}
.dish{padding:17px 0;border-bottom:1px dashed var(--line);text-align:center;position:relative}
.dish:last-of-type{border-bottom:0}
.dish .d-name{font-family:var(--serif);font-size:1.35rem;color:var(--ink)}
.dish .d-es{display:block;font-family:var(--sans);font-size:.87rem;color:var(--ink-soft);font-weight:300;margin-top:4px;font-style:italic}
.menu-price{text-align:center;margin-top:32px}
.menu-price .pr{
  display:inline-flex;align-items:baseline;gap:9px;background:var(--green);color:#fff;
  padding:13px 32px;border-radius:50px;font-weight:700;letter-spacing:.04em;
  box-shadow:0 18px 34px -18px rgba(44,88,54,.85)
}
.menu-price .pr b{font-family:var(--serif);font-size:1.95rem;font-weight:600}
.menu-note{text-align:center;color:var(--ink-soft);font-weight:300;font-size:.92rem;margin-top:20px}

/* ---------- GALERÍA EDITORIAL ----------
   Rejilla firme + desplazamiento óptico en columnas pares
   (con `top`, no con transform, para no pelearse con GSAP). */
.grid-sq{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding-bottom:30px}
.grid-sq figure{
  position:relative;margin:0;border-radius:var(--radius);overflow:hidden;aspect-ratio:1/1;
  box-shadow:0 22px 44px -32px rgba(38,34,28,.7)
}
.grid-sq figure:nth-child(2n){top:30px}
.grid-sq img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.grid-sq figure::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 52%,rgba(16,28,18,.62));
  opacity:0;transition:opacity .55s var(--ease)
}
.grid-sq figcaption{
  position:absolute;left:16px;bottom:14px;z-index:2;color:#fff;font-family:var(--serif);
  font-style:italic;font-size:1rem;opacity:0;transform:translateY(10px);transition:.55s var(--ease)
}
.grid-sq figure:hover img{transform:scale(1.07)}
.grid-sq figure:hover::after{opacity:1}
.grid-sq figure:hover figcaption{opacity:1;transform:none}

/* ---------- BANNER PARALLAX ---------- */
.banner{position:relative;min-height:min(76vh,540px);display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.banner img{position:absolute;inset:-10% 0 0;width:100%;height:120%;object-fit:cover;will-change:transform}
.banner::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(16,28,18,.58),rgba(16,28,18,.68))
}
.banner .bi{position:relative;z-index:2;color:#fff;max-width:700px;padding:90px 24px}
.banner h2{font-size:clamp(2.2rem,5.6vw,3.8rem);color:#fff;font-weight:400;font-variation-settings:'opsz' 96}
.banner h2 em{font-style:italic;color:var(--gold-hi)}
.banner p{color:rgba(255,255,255,.92);font-weight:300;margin:18px 0 30px;font-size:1.1rem}

/* ---------- HORARIO ---------- */
.sched{max-width:640px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:0 34px 70px -50px rgba(38,34,28,.5)}
.sched .row{display:flex;justify-content:space-between;gap:16px;padding:17px 26px;border-bottom:1px solid var(--line);transition:background .35s}
.sched .row:last-child{border-bottom:0}
.sched .row:hover{background:var(--cream)}
.sched .row .day{font-family:var(--serif);font-size:1.2rem;color:var(--green-deep);flex:none;min-width:110px;text-align:left}
.sched .row .hrs{color:var(--ink-soft);font-size:.95rem;text-align:right}
.sched .row .hrs b{color:var(--ink);font-weight:600}

/* ---------- CONTACTO / FORM ---------- */
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(38px,4.6vw,64px)}
.info-row{display:flex;gap:17px;align-items:flex-start;margin-bottom:24px}
.info-row .ic{
  width:48px;height:48px;border-radius:50%;background:var(--green-soft);
  display:flex;align-items:center;justify-content:center;flex:none;
  color:var(--green-deep);font-size:1.1rem;transition:transform .45s var(--ease),background .35s
}
.info-row:hover .ic{transform:translateY(-3px);background:var(--gold);color:#fff}
.info-row .t small{display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
.info-row .t a,.info-row .t span{color:var(--ink);text-decoration:none;font-size:1.04rem;font-weight:500;transition:color .3s}
.info-row .t a:hover{color:var(--green)}
.socials{display:flex;gap:12px;margin-top:30px}
.socials a{
  width:48px;height:48px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink-soft);
  text-decoration:none;font-size:.72rem;font-weight:700;letter-spacing:.06em;
  transition:all .4s var(--ease)
}
.socials a:hover{background:var(--green);color:#fff;border-color:var(--green);transform:translateY(-4px)}
form{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:clamp(26px,3.2vw,42px);
  box-shadow:0 40px 80px -58px rgba(38,34,28,.5)}
.field{margin-bottom:18px}
.field label{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px;font-weight:700}
.field input,.field select,.field textarea{
  width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:10px;
  font-family:var(--sans);font-size:1rem;color:var(--ink);background:#fff;
  transition:border-color .3s,box-shadow .3s
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
form .btn{width:100%;justify-content:center}
.map{border:0;width:100%;height:100%;min-height:220px;border-radius:14px;
  box-shadow:0 26px 50px -40px rgba(38,34,28,.7);filter:grayscale(.22) sepia(.14)}

/* ---------- CTA STRIP ---------- */
.cta-strip{text-align:center;padding:clamp(80px,9vw,112px) 0;background:var(--cream-2);position:relative;overflow:hidden}
.cta-strip::before{
  content:"";position:absolute;top:50%;left:50%;width:min(760px,90vw);aspect-ratio:1;
  transform:translate(-50%,-50%);border:1px solid var(--line-2);border-radius:50%
}
.cta-strip>*{position:relative;z-index:1}
.cta-strip h2{font-size:clamp(2rem,5vw,3.4rem);margin-bottom:18px;font-variation-settings:'opsz' 96}
.cta-strip p{color:var(--ink-soft);font-weight:300;max-width:540px;margin:0 auto 32px;font-size:1.08rem}

/* ---------- FOOTER ---------- */
footer{background:var(--bark);color:rgba(255,255,255,.7);padding:74px 0 34px;position:relative;overflow:hidden}
footer::before{
  content:"";position:absolute;top:0;left:0;width:100%;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.5
}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:44px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.12)}
.foot-grid .logo img{height:66px;margin-bottom:16px}
.foot-tag{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:rgba(255,255,255,.86);max-width:320px}
.foot-col h4{font-family:var(--sans);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi);margin-bottom:16px;font-weight:700}
.foot-col a,.foot-col p{display:block;color:rgba(255,255,255,.7);text-decoration:none;margin-bottom:11px;font-size:.95rem;font-weight:300;transition:color .3s,transform .3s var(--ease)}
.foot-col a:hover{color:#fff;transform:translateX(4px)}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:26px;font-size:.8rem;letter-spacing:.03em}
.foot-bottom a{color:rgba(255,255,255,.7);text-decoration:none}
.foot-bottom a:hover{color:#fff}

.ph{background:#fff4d6;color:#7a5b00;padding:1px 7px;border-radius:4px;font-size:.88em;font-weight:600;white-space:nowrap}

/* ---------- TARJETA DE RESERVA POR TELEFONO ---------- */
.call-card{
  background:linear-gradient(165deg,var(--paper),var(--cream-2));
  border:1px solid var(--line);border-radius:20px;
  padding:clamp(28px,3.4vw,44px);align-self:start;
  box-shadow:0 34px 70px -46px rgba(20,37,26,.55);
  position:relative;overflow:hidden
}
.call-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 100% 0%,rgba(185,134,42,.14),transparent 60%)
}
.call-card>*{position:relative}
.cc-h{font-family:var(--serif);font-size:clamp(1.6rem,2.6vw,2.1rem);color:var(--green-deep);margin:14px 0 10px;line-height:1.15}
.cc-p{color:var(--ink-soft);font-weight:300;margin-bottom:24px}
.call-big{
  display:flex;align-items:center;gap:18px;text-decoration:none;
  background:var(--green);color:#fff;border-radius:16px;
  padding:20px 24px;margin:18px 0 12px;
  box-shadow:0 20px 42px -20px rgba(28,59,35,.85);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .35s
}
.call-big:hover{transform:translateY(-4px);background:var(--green-deep);box-shadow:0 28px 54px -20px rgba(28,59,35,.95)}
.cb-ic{
  flex:none;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.14);
  display:flex;align-items:center;justify-content:center
}
.cb-ic svg{width:26px;height:26px;fill:#fff}
.call-big:hover .cb-ic svg{animation:ring .7s var(--ease)}
@keyframes ring{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}45%{transform:rotate(12deg)}70%{transform:rotate(-6deg)}}
.cb-txt{display:flex;flex-direction:column;line-height:1.2}
.cb-txt small{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;opacity:.75;margin-bottom:5px}
.cb-txt b{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,1.95rem);font-weight:500;letter-spacing:.01em}
.wa-big{
  display:flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;
  background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:14px;
  padding:15px 20px;font-weight:600;font-size:.98rem;
  transition:transform .4s var(--ease),border-color .35s,background .35s,color .35s
}
.wa-big svg{width:21px;height:21px;fill:#25D366;transition:fill .35s}
.wa-big:hover{background:#25D366;color:#fff;border-color:#25D366;transform:translateY(-3px)}
.wa-big:hover svg{fill:#fff}
.call-hours{margin-top:26px;border-top:1px solid var(--line);padding-top:8px}
.chr{display:flex;justify-content:space-between;gap:14px;padding:11px 2px;border-bottom:1px solid var(--line-2)}
.chr:last-child{border-bottom:0}
.chd{font-family:var(--serif);color:var(--green-deep);font-size:1.02rem}
.cht{color:var(--ink-soft);font-size:.92rem;text-align:right}
.cht b{color:var(--ink);font-weight:600}
.call-note{margin-top:16px;font-size:.85rem;color:var(--ink-soft);font-weight:300}
.call-note a{color:var(--green);font-weight:600}
.map-box{border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.map-note{margin-top:14px;font-size:.9rem}
.map-note a{color:var(--green-deep);font-weight:600;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;transition:color .3s}
.map-note a:hover{color:var(--gold-deep)}
@media(max-width:640px){
  .call-big{gap:14px;padding:17px 18px}
  .cb-ic{width:44px;height:44px}
}

/* ---------- BOTONES FLOTANTES: LLAMAR + WHATSAPP ---------- */
.fabs{
  position:fixed;right:24px;bottom:24px;z-index:90;
  display:flex;flex-direction:column;align-items:flex-end;gap:12px;
}
.fab{
  position:relative;display:flex;align-items:center;gap:0;
  height:56px;width:56px;padding:0;border-radius:999px;overflow:hidden;
  text-decoration:none;color:#fff;font-weight:700;font-size:.92rem;letter-spacing:.01em;
  transition:width .5s var(--ease),gap .5s var(--ease),padding .5s var(--ease),transform .4s var(--ease),box-shadow .4s var(--ease);
  will-change:width;
}
.fab svg{width:26px;height:26px;fill:#fff;flex:none;margin:0 15px}
.fab-lbl{white-space:nowrap;opacity:0;transform:translateX(-6px);transition:opacity .35s var(--ease),transform .45s var(--ease);padding-right:22px}
.fab:hover,.fab:focus-visible{width:auto;transform:translateY(-3px)}
.fab:hover .fab-lbl,.fab:focus-visible .fab-lbl{opacity:1;transform:none}
.fab-call{background:var(--green);box-shadow:0 14px 34px -10px rgba(44,88,54,.7)}
.fab-call:hover{box-shadow:0 20px 44px -12px rgba(44,88,54,.85)}
.fab-wa{background:#25D366;box-shadow:0 14px 34px -10px rgba(37,211,102,.6)}
.fab-wa:hover{box-shadow:0 20px 44px -12px rgba(37,211,102,.75)}
.fab-call::after{
  content:"";position:absolute;left:0;top:0;width:56px;height:56px;border-radius:50%;
  border:1px solid var(--green);animation:pulse 2.8s ease-out infinite;pointer-events:none
}
@keyframes pulse{0%{transform:scale(1);opacity:.75}70%{transform:scale(1.55);opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.fab-call::after{animation:none;opacity:0}}

/* En móvil: barra fija abajo, los dos accesos siempre visibles */
@media(max-width:720px){
  .fabs{
    left:0;right:0;bottom:0;flex-direction:row;gap:0;
    background:rgba(20,37,26,.92);backdrop-filter:blur(10px);
    padding:9px 10px calc(9px + env(safe-area-inset-bottom));
    box-shadow:0 -10px 30px -14px rgba(0,0,0,.5)
  }
  .fab{flex:1;width:auto;height:50px;justify-content:center;gap:9px;margin:0 5px}
  .fab svg{margin:0;width:22px;height:22px}
  .fab-lbl{opacity:1;transform:none;padding-right:0}
  .fab-call::after{display:none}
  body{padding-bottom:74px}
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:980px){
  .split,.split.rev,.cgrid{grid-template-columns:1fr;gap:44px}
  .split.rev{direction:ltr}
  .pillars{grid-template-columns:1fr;gap:38px}
  .grid-sq{grid-template-columns:repeat(2,1fr)}
  .visual{height:min(58vh,420px)}
}
@media(max-width:680px){
  nav{padding:12px 20px}nav.scrolled{padding:8px 20px}
  .nav-links,.nav-cta{display:none}.burger{display:flex}
  .nav-links.open{
    display:flex;flex-direction:column;position:absolute;top:100%;left:0;width:100%;
    background:rgba(252,249,241,.98);backdrop-filter:blur(16px);padding:26px 22px;gap:20px;
    border-bottom:1px solid var(--line);box-shadow:0 24px 40px -30px rgba(38,34,28,.7)
  }
  .nav-links.open a{color:var(--ink);text-shadow:none;font-size:.86rem;letter-spacing:.18em}
  .nav-links.open a:hover{color:var(--green)}
  .grid-sq{grid-template-columns:1fr 1fr;gap:12px}
  .grid-sq figure:nth-child(4n+2){margin-top:20px}
  .grid-sq figure:nth-child(4n+3){margin-top:0}
  .grid-sq figure:nth-child(4n+4){margin-top:20px}
  .menu-card{padding:34px 22px}
  .page-head{padding:150px 0 68px}
  .hero-actions{flex-direction:column}.hero-actions .btn{justify-content:center}
  .sched .row{flex-direction:column;gap:4px}.sched .row .hrs{text-align:left}
  .stats{gap:26px}
  .foot-grid{grid-template-columns:1fr;gap:32px}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none;transition:none}
  .wd>span{transform:none!important}
  .grain{display:none}
  #load,.curtain{display:none!important}
}

/* ---------- AFINADO 01-09-2026 ---------- */
/* Menu de temporada: se distingue del de sidreria por el borde dorado */
.menu-card--temp{border-color:rgba(185,134,42,.42);box-shadow:0 40px 80px -56px rgba(148,102,26,.6)}
.menu-card--temp::before{border-color:rgba(185,134,42,.3)}
.menu-card--temp::after{content:"";position:absolute;left:50%;top:0;transform:translate(-50%,-50%);width:64px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--gold),var(--gold-hi),var(--gold))}
.temp-p{color:var(--ink-soft);font-weight:300;text-align:center;max-width:52ch;margin:0 auto 8px;font-size:1.04rem}

/* Galeria: la foto respira al pasar por encima */
.grid-sq figure{overflow:hidden;border-radius:12px;position:relative}
.grid-sq figure img{transition:transform 1.1s var(--ease),filter .8s var(--ease)}
.grid-sq figure::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,37,26,.34));
  opacity:0;transition:opacity .7s var(--ease);pointer-events:none
}
.grid-sq figure:hover img{transform:scale(1.07)}
.grid-sq figure:hover::after{opacity:1}

/* Fotos de seccion: leve acercamiento al pasar por encima */
.visual{overflow:hidden}
.visual img{transition:transform 1.2s var(--ease)}
.visual:hover img{transform:scale(1.035)}

/* El telefono del menu superior se lee como telefono */
.nav-cta{font-variant-numeric:tabular-nums;letter-spacing:.06em}
.nav-cta::after{content:"";display:none}

/* Filas de horario de la tarjeta: entran escalonadas (las mueve app.js) */
.call-card .eyebrow{justify-content:center}

/* Menos salto entre secciones seguidas del mismo color */
.pad-sm + .pad-sm{padding-top:0}
.info-row .ic svg{width:19px;height:19px;fill:currentColor;transition:fill .3s}
.info-row .ic{font-size:0}
.call-card .eyebrow{flex-wrap:nowrap;white-space:nowrap}
.chd{white-space:nowrap}
@media(max-width:520px){
  .call-card .eyebrow{font-size:.6rem;letter-spacing:.16em}
  .call-card .eyebrow::before,.call-card .eyebrow::after{width:16px}
  .chr{gap:10px}
  .cht{font-size:.85rem}
}
.banner-sm{min-height:min(46vh,380px)}

/* ===========================================================
   AFINADO PREMIUM 02-09-2026
   =========================================================== */

/* ---------- BLOQUE OSCURO (la sidra) ---------- */
.dark-block{
  background:var(--bark);color:#f2ede1;position:relative;overflow:hidden;
  padding:clamp(80px,10vw,150px) 0;
}
.dark-block::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 55% at 18% 30%,rgba(185,134,42,.16),transparent 62%)
}
.db-grid{
  position:relative;display:grid;grid-template-columns:.92fr 1fr;
  gap:clamp(44px,6vw,90px);align-items:center
}
.db-img{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:1/1}
.db-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.db-img:hover img{transform:scale(1.04)}
.db-img::after{
  content:"";position:absolute;inset:0;border-radius:18px;
  box-shadow:inset 0 0 90px 30px rgba(20,37,26,.55);pointer-events:none
}
.dark-block h2{
  font-size:clamp(2.2rem,4.6vw,3.5rem);color:#fff;margin:18px 0 22px;
  font-variation-settings:'opsz' 96;letter-spacing:-.012em
}
.dark-block p{color:rgba(242,237,225,.76);font-weight:300;margin-bottom:16px;max-width:52ch}
.eyebrow.light{color:var(--gold-hi)}
.eyebrow.light::before,.eyebrow.light::after{background:var(--gold-hi)}
.db-facts{
  display:flex;flex-wrap:wrap;gap:clamp(26px,4vw,54px);margin-top:38px;
  padding-top:28px;border-top:1px solid rgba(242,237,225,.16)
}
.db-facts .fact{display:flex;flex-direction:column;gap:4px}
.db-facts .fact b{
  font-family:var(--serif);font-size:clamp(1.7rem,3.2vw,2.3rem);font-weight:500;
  color:var(--gold-hi);letter-spacing:.01em
}
.db-facts .fact span{
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(242,237,225,.6)
}

/* ---------- BANNER MÁS ALTO ---------- */
.banner-tall{min-height:min(88vh,700px)}

/* ---------- TIRA DE FOTOS ---------- */
.strip-sec{padding:clamp(72px,9vw,120px) 0 clamp(60px,7vw,100px);background:var(--cream-2);overflow:hidden}
.strip{position:relative}
.strip-track{
  display:flex;gap:clamp(14px,1.6vw,24px);
  padding:0 var(--pad-x);will-change:transform
}
.sfig{
  position:relative;flex:none;width:clamp(240px,26vw,380px);
  border-radius:14px;overflow:hidden;cursor:zoom-in;background:var(--green-deep);
  box-shadow:0 30px 60px -44px rgba(20,37,26,.7)
}
.sfig:nth-child(3n){width:clamp(300px,32vw,470px)}
.sfig img{
  width:100%;height:clamp(300px,38vw,520px);object-fit:cover;
  transition:transform 1.2s var(--ease),filter .7s var(--ease)
}
.sfig figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:44px 20px 18px;
  color:#fff;font-size:.86rem;letter-spacing:.02em;
  background:linear-gradient(180deg,transparent,rgba(20,37,26,.86));
  opacity:0;transform:translateY(10px);
  transition:opacity .55s var(--ease),transform .6s var(--ease)
}
.sfig:hover img{transform:scale(1.06)}
.sfig:hover figcaption,.sfig:focus-visible figcaption{opacity:1;transform:none}
.strip-hint{
  display:flex;align-items:center;gap:12px;justify-content:center;
  margin-top:30px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft)
}
.strip-hint i{display:block;width:44px;height:1px;background:var(--gold)}
/* Sin GSAP o en móvil: se arrastra con el dedo */
.strip{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.strip::-webkit-scrollbar{display:none}
html.strip-pinned .strip{overflow:visible}

/* ---------- VISOR DE FOTOS ---------- */
.lb{
  position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;padding:clamp(16px,4vw,54px);
  background:rgba(12,20,14,.94);backdrop-filter:blur(6px)
}
.lb.open{display:flex}
.lb-fig{max-width:min(1180px,100%);max-height:100%;display:flex;flex-direction:column;gap:14px;align-items:center}
.lb-fig img{max-width:100%;max-height:78vh;object-fit:contain;border-radius:10px;box-shadow:0 40px 90px -40px #000}
.lb-fig figcaption{color:rgba(255,255,255,.78);font-size:.9rem;letter-spacing:.03em;text-align:center}
.lb-x,.lb-nav{
  position:absolute;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);
  color:#fff;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:background .3s,transform .3s var(--ease);font-family:var(--sans);line-height:1
}
.lb-x{top:clamp(14px,3vw,28px);right:clamp(14px,3vw,28px);width:46px;height:46px;font-size:1.7rem}
.lb-nav{top:50%;transform:translateY(-50%);width:52px;height:52px;font-size:2rem}
.lb-prev{left:clamp(10px,2.4vw,30px)}
.lb-next{right:clamp(10px,2.4vw,30px)}
.lb-x:hover,.lb-nav:hover{background:rgba(255,255,255,.2)}
.lb-nav:hover{transform:translateY(-50%) scale(1.07)}
body.lb-on{overflow:hidden}

/* ---------- RESPIRACIÓN Y TIPOGRAFÍA ---------- */
.sec-head{margin-bottom:clamp(46px,5.4vw,72px)}
h1,h2,h3{text-wrap:balance}

@media(max-width:980px){
  .db-grid{grid-template-columns:1fr;gap:40px}
  .db-img{aspect-ratio:4/3;max-height:52vh}
  .banner-tall{min-height:min(70vh,540px)}
}
@media(max-width:620px){
  .sfig,.sfig:nth-child(3n){width:min(78vw,320px)}
  .sfig img{height:min(64vw,340px)}
  .sfig figcaption{opacity:1;transform:none}
  .db-facts{gap:24px}
  .lb-nav{width:44px;height:44px;font-size:1.6rem}
}
/* Cuando la tira se queda fija, todo tiene que caber en la pantalla */
html.strip-pinned .strip-sec{padding:clamp(44px,5vw,72px) 0 clamp(26px,3vw,40px);min-height:100svh;display:flex;flex-direction:column;justify-content:center}
html.strip-pinned .strip-sec .sec-head{margin-bottom:clamp(26px,3vw,40px)}
html.strip-pinned .sfig img{height:min(54vh,520px)}
html.strip-pinned .strip-hint{margin-top:clamp(18px,2.4vw,30px)}
.hint-mob{display:none}
@media(max-width:980px){.hint-desk{display:none}.hint-mob{display:inline}}

/* ---------- VIDEOS ---------- */
.hero-bg .hero-vid,.hero-bg .hero-fallback{
  position:absolute;inset:0;width:100%;height:112%;object-fit:cover
}
.hero-bg .hero-vid{z-index:1}
.hero-bg .hero-fallback{z-index:0}

.banner .banner-vid{
  position:absolute;inset:-10% 0 0;width:100%;height:120%;object-fit:cover;will-change:transform
}
.vband{
  position:relative;overflow:hidden;min-height:min(52vh,420px);
  display:flex;align-items:center;justify-content:center;text-align:center
}
.vband-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vband::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(14,24,16,.72),rgba(14,24,16,.5) 50%,rgba(14,24,16,.8))
}
.vband-in{position:relative;z-index:2;max-width:660px;padding:70px 24px;color:#fff}
.vband-in .eyebrow{justify-content:center;margin-bottom:18px}
.vband-in p{
  font-family:var(--serif);font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.32;
  color:#fff;font-weight:400;font-variation-settings:'opsz' 96
}
/* Reduced motion is handled by media.js: keep the approved posters without autoplay. */

/* ---------- PORTADA DE LAS PAGINAS INTERIORES, CON FOTO ---------- */
.page-head.has-photo{background:var(--bark)}
.page-head.has-photo::before,.page-head.has-photo::after{display:none}
.ph-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.ph-bg img{width:100%;height:118%;object-fit:cover;will-change:transform}
.ph-bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(14,24,16,.82),rgba(14,24,16,.5) 46%,rgba(14,24,16,.9)),
    radial-gradient(90% 70% at 50% 30%,transparent,rgba(14,24,16,.45))
}
.page-head.has-photo .wrap{position:relative;z-index:2}
.page-head.has-photo .eyebrow{color:var(--gold-hi)}

/* ---------- LISTA TIPOGRAFICA (sustituye a las tarjetas con icono) ---------- */
.tlist{border-top:1px solid var(--line);max-width:960px;margin:0 auto}
.tlist--narrow{max-width:720px}
.trow{
  display:grid;grid-template-columns:minmax(190px,.4fr) 1fr;gap:clamp(20px,4vw,56px);
  padding:clamp(22px,2.8vw,34px) 0;border-bottom:1px solid var(--line);
  align-items:baseline;transition:padding-left .5s var(--ease)
}
.trow h3{
  font-family:var(--serif);font-size:clamp(1.25rem,2vw,1.6rem);font-weight:500;
  color:var(--green-deep);line-height:1.2;margin:0;transition:color .4s
}
.trow .tbody p{color:var(--ink-soft);font-weight:300;margin:0;font-size:1rem;max-width:60ch}
.trow .tbody a{color:var(--green-deep);font-weight:600;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;transition:color .3s}
.trow .tbody a:hover{color:var(--gold-deep)}
.trow:hover{padding-left:12px}
.trow:hover h3{color:var(--gold-deep)}

/* ---------- LISTA CON FILETE (sustituye a los emojis) ---------- */
.rlist{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column}
.rlist li{
  position:relative;padding:13px 0 13px 40px;border-bottom:1px solid var(--line-2);
  color:var(--ink);font-weight:400
}
.rlist li:last-child{border-bottom:0}
.rlist li::before{
  content:"";position:absolute;left:0;top:calc(50% - .5px);width:24px;height:1px;
  background:var(--gold);transition:width .45s var(--ease)
}
.rlist li:hover::before{width:32px}

@media(max-width:720px){
  .trow{grid-template-columns:1fr;gap:8px}
  .trow:hover{padding-left:0}
}

/* ---------- MENUS: doble pagina editorial ---------- */
.menu-sec{overflow:visible}
.menu-spread{
  display:grid;grid-template-columns:minmax(260px,.68fr) 1fr;
  gap:clamp(38px,6vw,96px);align-items:start
}
.ms-side{position:sticky;top:118px}
.ms-side .eyebrow{margin-bottom:16px}
.ms-title{
  font-family:var(--serif);font-size:clamp(2rem,4.2vw,3.2rem);font-weight:500;
  line-height:1.05;letter-spacing:-.015em;color:var(--green-deep);margin-bottom:10px;
  font-variation-settings:'opsz' 96
}
.ms-sub{color:var(--ink-soft);font-weight:300;font-size:.98rem;font-style:italic}
.ms-price{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
  margin-top:clamp(26px,3.4vw,42px);padding-top:clamp(22px,2.6vw,30px);
  border-top:1px solid var(--line)
}
.ms-price b{
  font-family:var(--serif);font-size:clamp(3.2rem,6.6vw,5rem);font-weight:500;
  line-height:.86;color:var(--ink);letter-spacing:-.02em;font-variation-settings:'opsz' 96
}
.ms-price .cur{
  font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.1rem);color:var(--gold-deep);
  align-self:flex-start;margin-top:.32em
}
.ms-price em{
  flex-basis:100%;font-style:normal;font-size:.68rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-soft);margin-top:10px
}
.ms-note{margin-top:20px;color:var(--ink-soft);font-weight:300;font-size:.92rem;max-width:34ch}

.ms-dishes{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ms-dishes li{
  position:relative;padding:clamp(20px,2.6vw,30px) 0 clamp(20px,2.6vw,30px) 0;
  border-bottom:1px solid var(--line);transition:padding-left .55s var(--ease)
}
.ms-dishes li::before{
  content:"";position:absolute;left:0;top:calc(50% - .5px);width:0;height:1px;
  background:var(--gold);transition:width .55s var(--ease)
}
.ms-dishes li:hover{padding-left:34px}
.ms-dishes li:hover::before{width:22px}
.ms-dishes .dn{
  display:block;font-family:var(--serif);font-size:clamp(1.2rem,2vw,1.6rem);
  color:var(--ink);line-height:1.25;transition:color .4s
}
.ms-dishes li:hover .dn{color:var(--green-deep)}
.ms-dishes .de{
  display:block;margin-top:7px;font-size:.85rem;letter-spacing:.02em;
  color:var(--ink-soft);font-weight:300;font-style:italic
}
.ms-statement{border-top:1px solid var(--line);padding-top:clamp(24px,3vw,36px)}
.ms-statement p{
  font-family:var(--serif);font-size:clamp(1.3rem,2.4vw,1.85rem);line-height:1.4;
  color:var(--ink);font-weight:400;max-width:30ch;margin-bottom:32px
}

@media(max-width:900px){
  .menu-spread{grid-template-columns:1fr;gap:34px}
  .ms-side{position:static}
  .ms-dishes li:hover{padding-left:0}
  .ms-dishes li:hover::before{width:0}
}

/* ---------- AJUSTES DE TIPOGRAFIA ---------- */
body{font-size:clamp(15.5px,1.02vw,17px);letter-spacing:-.003em}
h1,h2,h3,.ms-title,.dn{font-weight:500}
.eyebrow{font-size:.68rem;letter-spacing:.2em;font-weight:600}
.btn{border-radius:6px;padding:15px 30px}
.nav-cta{border-radius:6px}
.nav-links a{letter-spacing:.02em;text-transform:none;font-size:.98rem;font-weight:500}
.sec-head h2,.split h2,.dark-block h2{letter-spacing:-.018em}
.hero h1{letter-spacing:-.022em}
.hero-bg .hero-vid,.hero-bg .hero-fallback{filter:saturate(1.06) contrast(1.03)}
/* grano fino: disimula el poco tamano del video */
.hero-bg::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")
}

/* ===========================================================
   AJUSTES DE LA PALETA NUEVA (blanco, negro y burdeos)
   =========================================================== */
.btn-gold{background:var(--green);color:#fff;box-shadow:0 16px 34px -18px rgba(169,102,60,.8)}
.btn-gold::before{background:var(--green-deep)}
.btn-primary{box-shadow:0 16px 34px -18px rgba(169,102,60,.8)}
.nav-cta{background:var(--green);color:#fff}
.nav-cta::before{background:var(--green-deep)}
.fab-call{background:var(--green);box-shadow:0 14px 34px -10px rgba(169,102,60,.55)}
.fab-call:hover{box-shadow:0 20px 44px -12px rgba(169,102,60,.75)}
.fab-call::after{border-color:var(--green)}
.hero h1 em{color:#F0BE99}
.dark-block .db-facts .fact b{color:#F0BE99}
.ms-price .cur{color:var(--green)}
.call-big{background:var(--green);box-shadow:0 20px 42px -22px rgba(169,102,60,.85)}
.call-big:hover{background:var(--green-deep)}
.trow:hover h3{color:var(--green)}
.trow .tbody a{border-bottom-color:var(--green)}
.map-note a{border-bottom-color:var(--green)}
.info-row:hover .ic{background:var(--green);color:#fff}
.menu-card--temp,.temp-p{border-color:var(--line)}

/* Bodoni pide un poco mas de aire y menos peso */
h1,h2,h3,.ms-title,.dn,.cb-txt b,.ms-price b{font-weight:400;letter-spacing:-.005em}
.hero h1{font-weight:400;letter-spacing:-.01em}
.dark-block h2,.sec-head h2,.split h2{font-weight:400}
.ms-dishes .dn{letter-spacing:0}
body{font-family:var(--sans);letter-spacing:0}
.eyebrow{font-weight:500;letter-spacing:.22em;color:var(--ink-soft)}
.eyebrow::before,.eyebrow.center::after{background:var(--ink-soft);opacity:.5}
.btn{font-weight:600;letter-spacing:.02em}

/* ---------- VIDEO VERTICAL DENTRO DE UN MARCO ---------- */
.visual--tall{aspect-ratio:2/3;height:auto;max-height:none}
.visual-vid{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 72%;
  transition:transform 1.2s var(--ease)
}
.visual--tall:hover .visual-vid{transform:scale(1.03)}
/* la portada encuadra por la terraza, no por el cielo */
.hero-bg .hero-vid,.hero-bg .hero-fallback{object-position:50% 50%}
@media(max-width:900px){
  .visual--tall{aspect-ratio:3/4}
  .hero-bg .hero-vid,.hero-bg .hero-fallback{object-position:50% 50%}
}
/* iconos de marca en los datos de contacto */
/* todos los iconos: circulo blanco con filete; los de marca mantienen su color */
.info-row .ic{background:#fff;border:1px solid var(--line);color:var(--apricot)}
.info-row .ic svg{fill:var(--apricot)}
.info-row .ic-maps svg{fill:#EA4335}
.info-row .ic-ig svg,.info-row .ic-gmail svg{width:22px;height:22px}
.info-row:hover .ic{background:#fff;border-color:var(--apricot);transform:translateY(-3px)}
.info-row:hover .ic svg{fill:var(--apricot)}
.info-row:hover .ic-maps svg{fill:#EA4335}

/* ---------- GALERIA DE PLATOS (pagina de menus) ---------- */
.platos-sec{background:var(--cream-2)}
.platos{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,1.4vw,20px)
}
.pfig{
  position:relative;margin:0;overflow:hidden;border-radius:4px;cursor:zoom-in;
  background:var(--ink);aspect-ratio:4/5
}

.pfig img{
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s var(--ease),filter .8s var(--ease)
}
.pfig figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:46px 18px 16px;
  color:#fff;font-size:.84rem;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.8));
  opacity:0;transform:translateY(10px);
  transition:opacity .55s var(--ease),transform .6s var(--ease)
}
.pfig:hover img{transform:scale(1.06)}
.pfig:hover figcaption,.pfig:focus-visible figcaption{opacity:1;transform:none}
@media(max-width:820px){
  .platos{grid-template-columns:repeat(2,1fr)}
  .pfig figcaption{opacity:1;transform:none;font-size:.78rem}
}
@media(max-width:480px){
  .platos{grid-template-columns:1fr}
  .pfig,
}

/* ===========================================================
   PORTADA A LA IZQUIERDA (estilo editorial)
   =========================================================== */
.hero{align-items:center;justify-content:flex-start;text-align:left}
.hero-inner{
  max-width:min(920px,62vw);padding:150px var(--pad-x) 130px;
  margin:0;text-align:left
}
.hero .eyebrow{justify-content:flex-start;margin-bottom:30px;letter-spacing:.3em;color:rgba(255,255,255,.72)}
.hero .eyebrow::before{background:rgba(255,255,255,.55)}
.hero .eyebrow::after{display:none}
.hero h1{
  font-size:clamp(3rem,7.6vw,6.6rem);line-height:.96;margin-bottom:30px;
  text-shadow:0 2px 40px rgba(0,0,0,.3)
}
.hero h1 em{display:block;font-style:italic;color:var(--hero-em,#F0BE99)}
.hero .lead{margin:0 0 44px;max-width:44ch;font-size:clamp(1rem,1.3vw,1.14rem);color:rgba(255,255,255,.86)}
.hero-actions{justify-content:flex-start;align-items:center;gap:26px}
.hero-actions .btn-outline-light{
  border-radius:999px;padding:15px 30px;display:inline-flex;gap:10px;align-items:baseline;
  border-color:rgba(255,255,255,.6);text-transform:none;letter-spacing:.01em;font-size:.9rem
}
.hero-actions .btn-outline-light b{font-variant-numeric:tabular-nums;letter-spacing:.03em}
.link-rule{
  color:#fff;text-decoration:none;font-size:.9rem;font-weight:500;position:relative;
  padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.42);transition:border-color .4s,opacity .4s
}
.link-rule:hover{border-color:#fff}
.scroll-hint{
  position:absolute;right:calc(var(--pad-x) + 84px);bottom:46px;left:auto;transform:none;
  display:flex;align-items:center;gap:14px;
  font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.72)
}
.scroll-hint .line{
  display:block;width:56px;height:1px;background:rgba(255,255,255,.5);
  animation:slide 2.6s var(--ease) infinite
}
@keyframes slide{0%{transform:scaleX(.3);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}
  51%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(.3);transform-origin:right}}
@media(prefers-reduced-motion:reduce){.scroll-hint .line{animation:none}}

/* el boton del telefono en el menu, como pastilla de contorno */
.nav-cta{
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55);
  border-radius:999px;padding:11px 22px;text-transform:none;letter-spacing:.03em;font-size:.86rem
}
.nav-cta::before{background:#fff}
.nav-cta:hover{color:var(--ink)}
#nav.scrolled .nav-cta{border-color:var(--line);color:var(--ink)}
#nav.scrolled .nav-cta::before{background:var(--ink)}
#nav.scrolled .nav-cta:hover{color:#fff}

@media(max-width:900px){
  .hero-inner{max-width:100%;padding:130px var(--pad-x) 120px}
  .hero-actions{flex-direction:column;align-items:flex-start;gap:18px}
  .scroll-hint{display:none}
}
/* la portada de Nosotros lleva gente: menos velo para que se les vea */
.page-head.has-photo.ph-clear .ph-bg::after{
  background:linear-gradient(180deg,rgba(10,10,10,.62),rgba(10,10,10,.24) 46%,rgba(10,10,10,.72))
}
.page-head.has-photo.ph-clear .ph-bg img{object-position:50% 32%}

/* ---------- ALBARICOQUE: tono claro para detalles ---------- */
:root{--apricot:#D08A5D;--apricot-soft:#F7E7D6}
.trow:hover h3{color:var(--apricot)}
.ms-price .cur{color:var(--apricot)}
.rlist li::before{background:var(--apricot)}
.ms-dishes li::before{background:var(--apricot)}
.eyebrow::before,.eyebrow.center::after{background:var(--apricot);opacity:1}
.nav-links a.active::after,.nav-links a:hover::after{background:var(--apricot)}
.strip-hint i,.sec-head .eyebrow::before{background:var(--apricot)}

/* ---------- CATALOGO DE LA TIENDA ---------- */
.cat-grid{display:grid;grid-template-columns:.95fr 1fr;gap:clamp(36px,6vw,90px);align-items:start}
.cat-media{
  position:sticky;top:120px;aspect-ratio:4/5;border-radius:6px;overflow:hidden;
  background:var(--cream-2);box-shadow:0 40px 80px -56px rgba(22,24,28,.6)
}
.cat-img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.05);
  transition:opacity .8s var(--ease),transform 1.2s var(--ease)
}
.cat-img.is-on{opacity:1;transform:scale(1)}
.cat-list{display:flex;flex-direction:column}
.cat-item{
  padding:clamp(48px,7vw,90px) 0;border-bottom:1px solid var(--line);
  opacity:.32;transition:opacity .6s var(--ease)
}
.cat-item:last-child{border-bottom:0}
.cat-item.is-on{opacity:1}
.cat-num{
  display:block;font-size:.66rem;letter-spacing:.28em;color:var(--apricot);
  margin-bottom:16px;font-variant-numeric:tabular-nums
}
.cat-item h3{
  font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:400;
  line-height:1.12;margin-bottom:14px;color:var(--ink)
}
.cat-item p{color:var(--ink-soft);font-weight:300;max-width:46ch;margin:0}
@media(max-width:900px){
  .cat-grid{grid-template-columns:1fr;gap:26px}
  .cat-media{position:sticky;top:78px;aspect-ratio:16/11;z-index:2}
  .cat-item{padding:34px 0;opacity:1}
}

/* ---------- LA TIRA, TAMBIEN EN EL MOVIL ---------- */
@media(max-width:980px){
  html.strip-pinned .strip-sec{padding:clamp(34px,7vw,56px) 0 clamp(20px,4vw,30px)}
  html.strip-pinned .strip-sec .sec-head{margin-bottom:clamp(18px,4vw,28px)}
  html.strip-pinned .sfig,
  html.strip-pinned .sfig:nth-child(3n){width:min(60vw,300px)}
  html.strip-pinned .sfig img{height:min(44vh,380px)}
  html.strip-pinned .strip-track{gap:12px}
  html.strip-pinned .hint-mob{display:none}
  html.strip-pinned .hint-desk{display:inline}
}
.rec-fecha{margin-top:22px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.foot-cred{color:rgba(255,255,255,.55)}
.foot-bottom{gap:12px 26px}


/* ---------- RUTAS EN COCHE (07-09-2026) ---------- */
.gps-note{color:var(--ink-soft);font-weight:300;font-size:.98rem}
.rutas{list-style:none;margin:26px 0 0;padding:0}
.rutas li{position:relative;padding:16px 0 18px 40px;border-bottom:1px solid var(--line-2)}
.rutas li:last-child{border-bottom:0}
.rutas li::before{
  content:"";position:absolute;left:0;top:27px;width:24px;height:1px;
  background:var(--apricot);transition:width .45s var(--ease)
}
.rutas li:hover::before{width:32px}
.ru-de{display:block;font-family:var(--serif);font-size:1.16rem;line-height:1.2;margin-bottom:6px}
.ru-t{display:block;color:var(--ink-soft);font-weight:300;font-size:1rem;line-height:1.65}
.ru-map{
  display:inline-block;margin-top:10px;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;padding-bottom:3px;border-bottom:1px solid var(--line-2);
  transition:color .35s var(--ease),border-color .35s var(--ease)
}
.ru-map:hover{color:var(--apricot);border-bottom-color:var(--apricot)}
@media(max-width:720px){
  .rutas li{padding-left:32px}
  .rutas li::before{width:18px}
}

/* Background videos never expose a native play overlay or interactive controls. */
.video-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.hero-bg .hero-vid,.visual .visual-vid,.vband .vband-vid{opacity:0;pointer-events:none}
.hero-bg .hero-vid[data-has-played]:not([data-fail]),.visual .visual-vid[data-has-played]:not([data-fail]),.vband .vband-vid[data-has-played]:not([data-fail]){opacity:1}
video::-webkit-media-controls,video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}