/* =============================================================
   Bodega Latarce — nueva web principal
   Dirección visual calcada de restauranteambivium.com:
   · Tipografía  : Playfair Display (titulares) + Inter (texto)
   · Cuerpo      : 15px / interlineado 1.8 / tracking -0.5px
   · Contenedor  : 1200px, gutter ~30px
   · Aire        : secciones de contenido ~110px vert., bandas de imagen ~220px
   · Color       : negro sobre blanco, dorado #ddaf5f, azul pizarra #212934
   ============================================================= */

:root{
  --f-serif:"Playfair Display", Georgia, "Times New Roman", serif;
  --f-sans:"Inter", -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Paleta EXACTA de restauranteambivium.com */
  --white:#ffffff;
  --paper:#ffffff;
  --paper-alt:#f9f9fb;   /* off-white de secciones */
  --ink:#000000;         /* texto */
  --ink-head:#3a3a3a;    /* titulares */
  --ink-soft:#777777;    /* sublíneas */
  --ink-mute:#919191;    /* texto tenue */
  --rule:#d3d6cd;        /* filetes */
  --gold:#ddaf5f;        /* dorado (único acento) */
  --gold-deep:#ddaf5f;
  --slate:#212934;       /* secciones oscuras y pie */
  --slate-soft:#8b93a0;
  --slate-rule:rgba(255,255,255,.14);
  --overlay:rgba(0,0,0,.5);

  --container:1200px;
  --gutter:clamp(20px, 5vw, 30px);
  --header-h:112px;      /* Ambivium: barra fija ~112–129px */
  --header-h-m:82px;   /* 66 + un respiro debajo del rótulo */
  /* Ambivium mantiene el aire también en móvil: ~110px contenido, ~250px bandas */
  --pad-section:clamp(44px,5.6vw,78px);
  --pad-band:clamp(150px, 40vw, 250px);

  color-scheme:light;
}

/* ---------- reset-ish ---------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--f-sans);
  font-size:15px;
  line-height:1.8;
  letter-spacing:-.5px;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--f-serif);font-weight:700;color:var(--ink-head);margin:0;line-height:1.14;letter-spacing:normal;text-wrap:balance}
p{margin:15px 0}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;display:block}
[hidden]{display:none!important}
::selection{background:rgba(221,175,95,.28)}
:focus-visible{outline:2px solid var(--ink-head);outline-offset:3px}

/* ---------- layout helpers ---------- */
.container{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:var(--pad-section)}
.section--alt{background:var(--paper-alt)}
.section--slate{background:var(--slate);color:#fff}
.section--slate h1,.section--slate h2,.section--slate h3{color:#fff}
.narrow{max-width:680px;margin-inline:auto}
.center{text-align:center}
.eyebrow{
  font-family:var(--f-sans);font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-head);margin:0 0 22px;
}
.serif-sub{font-family:var(--f-serif);font-weight:500;font-style:italic;color:var(--ink-soft)}
.lead{font-size:16px;line-height:1.85}

/* section heading in the Ambivium white-section style: Playfair 500, centered */
.h-center{
  font-family:var(--f-serif);font-weight:500;color:#111;
  font-size:clamp(1.7rem, 1.15rem + 2.3vw, 2.6rem);line-height:1.2;letter-spacing:.01em;
}
.h-center + .serif-sub{display:block;margin-top:.4rem;font-size:clamp(1.15rem,1rem + 1vw,1.6rem)}

/* ---------- buttons ---------- */
.btn{
  --bc:currentColor;
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--f-sans);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  padding:1.15em 2.1em;border:1px solid var(--bc);color:var(--ink);background:transparent;
  cursor:pointer;transition:background .3s ease,color .3s ease,border-color .3s ease;
}
.btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn--gold{color:var(--ink-head);border-color:var(--gold)}
.btn--gold:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn--light{color:#fff;border-color:rgba(255,255,255,.45)}
.btn--light:hover{background:#fff;border-color:#fff;color:var(--ink)}
.link-underline{border-bottom:1px solid var(--gold);padding-bottom:2px;color:var(--ink-head);
  font-family:var(--f-sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.link-underline:hover{color:var(--ink);border-color:var(--ink)}

/* ---------- header ----------
   Réplica exacta de la cabecera de Ambivium:
   barra BLANCA fija (sticky) en todo momento, sin cambios al hacer scroll.
   Fila 1200px centrada, 3 columnas 2fr / 1fr / 2fr (≈480 / 240 / 480),
   cada grupo de menú centrado en su columna, logo centrado en la del medio. */
.site-header{position:sticky;top:0;z-index:50;background:var(--paper)}
.site-header .bar{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:2fr 1fr 2fr;align-items:center;
  min-height:var(--header-h);padding:0 var(--gutter) 8px;
}

.nav{display:flex;justify-content:center;align-items:center;gap:2px}
.nav a{
  font-family:var(--f-serif);font-weight:600;font-size:14px;letter-spacing:.21px;line-height:1.2;
  text-transform:uppercase;color:var(--ink);padding:10px 14px;white-space:nowrap;position:relative;
}
.nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav .caret{margin-left:.5em;color:var(--gold);font-weight:400}

/* --- WordPress: wp_nav_menu genera <ul><li><a>; lo tratamos igual que .nav > a --- */
.nav > ul{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.nav li{position:relative}
.nav .sub-menu{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--paper);border:1px solid var(--rule);min-width:210px;padding:8px 0;list-style:none;margin:0;
  opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease;box-shadow:0 20px 50px -20px rgba(0,0,0,.25)}
.nav li:hover > .sub-menu,.nav li:focus-within > .sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav .sub-menu a{display:block;padding:9px 20px;font-size:12.5px;letter-spacing:.06em;color:var(--ink);text-transform:none}
.nav .sub-menu a::after{display:none}
.nav .menu-item-has-children > a::before{content:"·";margin-right:.5em;color:var(--gold);font-weight:400}

/* dropdown (sitio estático) */
.nav-item{position:relative}
.nav-item .subnav{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--paper);border:1px solid var(--rule);min-width:210px;padding:8px 0;
  opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease;box-shadow:0 20px 50px -20px rgba(0,0,0,.25)}
.nav-item:hover .subnav,.nav-item:focus-within .subnav{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-item .subnav a{display:block;padding:9px 20px;font-size:12.5px;letter-spacing:.06em;color:var(--ink)}
.nav-item .subnav a::after{display:none}
.nav-item .subnav a:hover{background:var(--paper-alt);color:var(--ink-head)}

.brand{display:flex;flex-direction:column;align-items:center;gap:15px;line-height:1;text-align:center;justify-self:center}
.brand .logo{height:52px;width:auto}
.brand .wordmark{font-family:var(--f-serif);font-weight:700;font-size:22px;letter-spacing:.24em;color:var(--ink-head);text-indent:.24em}
.brand .tagline{font-family:var(--f-sans);font-size:8px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-head);text-indent:.34em}
.brand:has(.logo) .wordmark{display:none}

.burger{display:none;background:none;border:0;cursor:pointer;color:var(--ink);padding:8px;justify-self:end;grid-column:3}
@media (max-width:1000px){
  .nav{display:none}
  /* el aire extra va DEBAJO del rótulo, no repartido arriba y abajo */
  .site-header .bar{grid-template-columns:auto 1fr auto;min-height:var(--header-h-m);
    align-items:start;padding-top:12px;padding-bottom:12px}
  .brand{align-items:flex-start;justify-self:start;gap:9px}
  .brand .logo{height:40px}
  .burger{display:inline-flex}
}

/* ---------- hero slider ---------- */
.hero{position:relative;min-height:100svh;background:var(--slate);overflow:hidden}
.slide{position:absolute;inset:0;opacity:0;z-index:0;display:flex;align-items:center;justify-content:center;
  transition:opacity 1.7s cubic-bezier(.4,0,.2,1);will-change:opacity}
.slide.is-active{opacity:1;z-index:1}
/* travelling lento sobre la foto activa: el corte deja de notarse */
.slide.is-active .slide-media{animation:heroKen 11s cubic-bezier(.25,.1,.25,1) both}
/* la fachada: encuadre alto y rótulo bajado, para que el titular no pise el letrero real */
.hero .slide:first-child .slide-media{background-position:center 22%}
/* hero fijo: una sola imagen, sin flechas ni puntos */
.hero--fijo .hero-nav,.hero--fijo .hero-dots{display:none}
.hero--fijo .slide{position:absolute;inset:0;opacity:1}
/* el rótulo ocupa los dos espacios vacíos de la foto: el titular y su bajada
   en el cielo, los botones abajo sobre la explanada. La fachada, libre. */
.hero--fijo,.hero--fijo .slide{align-items:stretch}
.hero--fijo .slide-cap{display:flex;flex-direction:column;text-align:center;
  max-width:min(92vw,860px);padding:clamp(118px,16vh,196px) 22px clamp(96px,15vh,196px)}
.hero--fijo .slide-cap .sub{text-wrap:balance;margin-bottom:0}
.hero--fijo .hero__cta{margin-top:auto;margin-bottom:0}
/* velo en pinza: oscurece cielo y explanada, deja limpia la fachada del centro */
.hero--fijo .slide-media::after{background:
  linear-gradient(180deg,rgba(10,11,14,.54) 0%,rgba(10,11,14,.24) 30%,rgba(10,11,14,.14) 52%,rgba(10,11,14,.44) 78%,rgba(10,11,14,.62) 100%)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:clamp(22px,3vw,32px)}
.hero__cta .btn{min-width:190px;justify-content:center}
@media (max-width:520px){.hero__cta{gap:10px}.hero__cta .btn{width:min(100%,300px);min-width:0}}
.hero__scroll{position:absolute;left:50%;bottom:26px;z-index:3;width:1px;height:52px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.55));
  transform:translateX(-50%);animation:heroScroll 2.6s ease-in-out infinite}
@keyframes heroScroll{0%,100%{opacity:.25;transform:translateX(-50%) scaleY(.6)}50%{opacity:.9;transform:translateX(-50%) scaleY(1)}}
@media (max-width:760px){
  /* en móvil el texto se centra sobre la foto y respira */
  /* en móvil el texto se reparte en los dos espacios vacíos de la foto:
     el titular en el cielo y los botones sobre la acera. La fachada, libre. */
  .hero--fijo .slide-cap{width:100%;
    padding:clamp(52px,13vh,104px) 20px clamp(78px,15vh,124px)}
  .hero .slide:first-child .slide-media{background-position:center 16%}
  /* el velo ya no necesita apagar el rótulo: solo asienta los extremos */
  .hero--fijo .slide-media::after{background:
    linear-gradient(180deg,rgba(10,11,14,.50) 0%,rgba(10,11,14,.20) 34%,rgba(10,11,14,.16) 58%,rgba(10,11,14,.58) 100%)}
  .hero__scroll{height:38px;bottom:96px}
}
@media (prefers-reduced-motion:reduce){.hero__scroll{animation:none}}
@keyframes heroKen{from{transform:scale(1.001)}to{transform:scale(1.085)}}
/* el rótulo entra escalonado, no de golpe con la foto.
   Con transiciones (y no @keyframes) el texto vuelve a entrar cada vez que
   el slide se reactiva, también al girar el carrusel. */
.slide-cap > *{opacity:0;transform:translateY(20px);
  transition:opacity .95s ease .3s, transform 1.05s cubic-bezier(.16,1,.3,1) .3s}
.slide.is-active .slide-cap > *{opacity:1;transform:none}
.slide.is-active .slide-cap > *:nth-child(2){transition-delay:.44s}
.slide.is-active .slide-cap > *:nth-child(3){transition-delay:.58s}
@media (prefers-reduced-motion:reduce){
  .slide.is-active .slide-media{animation:none}
  .slide-cap > *{opacity:1;transform:none;transition:none}
}
.slide-media{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#212934}
.slide-media.ph{background-image:
  radial-gradient(90% 70% at 50% 28%, rgba(255,255,255,.06), transparent 70%),
  linear-gradient(180deg,#2b333f,#212934 55%,#191f27)}
.slide-media::after{content:"";position:absolute;inset:0;background:var(--overlay)}
.slide-cap{position:relative;text-align:center;color:#fff;padding:32px 22px 0;max-width:1000px}
.slide-cap h1,.slide-cap .h1{
  font-family:var(--f-serif);font-weight:700;color:#fff;text-transform:uppercase;
  font-size:clamp(1.55rem, 0.4rem + 5.4vw, 5rem);line-height:1.08;letter-spacing:.03em;
}
.slide-cap .sub{
  display:block;margin-top:.5rem;font-family:var(--f-serif);font-weight:500;font-style:italic;
  color:rgba(244,239,230,.85);font-size:clamp(1.2rem, 0.95rem + 1.4vw, 1.55rem);letter-spacing:0;
}
.slide-cap .btn{margin-top:2.2rem}
@media (max-width:1000px){
  .hero{min-height:calc(100svh - var(--header-h-m))}
  .vh{min-height:calc(100svh - var(--header-h-m))}
}

.hero-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;background:none;border:0;color:rgba(255,255,255,.6);
  cursor:pointer;padding:18px;transition:color .2s ease}
.hero-nav:hover{color:#fff}
.hero-nav--prev{left:6px}.hero-nav--next{right:6px}
.hero-dots{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:5;display:flex;gap:10px}
.hero-dots button{width:8px;height:8px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:transparent;cursor:pointer;padding:0}
.hero-dots button[aria-current="true"]{background:#fff}
@media (max-width:640px){.hero-nav{display:none}}

/* ---------- info bar under hero ---------- */
.infobar{background:var(--paper);border-bottom:1px solid var(--rule)}
.infobar .container{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 1.6rem;padding-block:.9rem;
  font-size:12.5px;letter-spacing:-.2px;color:var(--ink-mute)}
.infobar b{color:var(--ink);font-weight:600}
.infobar .sep{color:var(--rule)}
.infobar a:hover{color:var(--ink)}

/* ---------- image bands ---------- */
.band{position:relative;min-height:clamp(420px, 72vh, 680px);display:flex;align-items:center;justify-content:center;
  text-align:center;color:#fff;overflow:hidden;background:var(--slate)}
.band-media{position:absolute;inset:0;background-size:cover;background-position:center}
.band-media.ph,
.band-media.ph--wine,
.band-media.ph--table,
.band-media.ph--event{background:linear-gradient(180deg,#2b333f,#212934 55%,#191f27)}
.band-media::after{content:"";position:absolute;inset:0;background:var(--overlay)}
.band-inner{position:relative;padding:var(--pad-band) 22px}
.band-inner h2,.band-inner .h2{
  font-family:var(--f-serif);font-weight:700;color:#fff;text-transform:uppercase;
  font-size:clamp(1.6rem, 1rem + 2.6vw, 3.6rem);line-height:1.1;letter-spacing:.045em;
}
.band-inner .sub{display:block;margin-top:.6rem;font-family:var(--f-serif);font-weight:500;font-style:italic;
  color:rgba(244,239,230,.82);font-size:clamp(1.05rem,.95rem + .6vw,1.4rem)}
.band-inner .btn{margin-top:1.9rem}
.ph-note{position:absolute;left:14px;bottom:10px;font-family:var(--f-sans);font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(244,239,230,.4)}

/* ---------- secciones a pantalla completa (rítmica de Ambivium) ----------
   hero + N secciones de 100vh que alternan:
   · fondo blanco, título centrado (Playfair 500 gris) + filete dorado
   · foto a sangre con parallax, título a la izquierda en dorado             */
.vh{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden}
.vh--light{background:var(--paper);justify-content:center;text-align:center}
.vh--image{background:var(--slate);justify-content:flex-start;color:#fff}
.vh__bg{position:absolute;inset:-14% 0;background-size:cover;background-position:center;will-change:transform}
.vh__bg.ph{background:linear-gradient(180deg,#2b333f,#212934 55%,#191f27)}
.vh__bg::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.42)}
.vh__inner{position:relative;z-index:2;width:100%;max-width:var(--container);margin:0 auto;padding:64px var(--gutter)}
.vh--image .vh__inner{padding-left:clamp(22px,6vw,96px)}
.vh__title{font-family:var(--f-serif);font-weight:500;line-height:1.16;letter-spacing:.01em;
  font-size:clamp(1.55rem,1.1rem + 2vw,2.5rem);text-wrap:balance}
.vh--light .vh__title{color:var(--ink-head)}
.vh--image .vh__title{color:var(--gold)}
.vh__rule{width:88px;height:1px;background:var(--gold);margin:24px auto 0}

/* --- Secciones de la home: numeral editorial, antetítulo y entrada escalonada --- */
.vh--image .vh__title{font-size:clamp(2rem, 1.2rem + 3.4vw, 4rem);line-height:1.06;letter-spacing:-.005em}
.vh__num{position:absolute;right:clamp(-8px,1vw,32px);top:50%;transform:translateY(-52%);z-index:-1;
  font-family:var(--f-serif);font-weight:500;line-height:.8;letter-spacing:-.03em;
  font-size:clamp(11rem, 5rem + 26vw, 30rem);color:rgba(255,255,255,.055);
  pointer-events:none;user-select:none}
.vh--image .vh__inner.reveal{opacity:1;transform:none}
.vh__kicker{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin:0 0 1rem}
.vh--image .vh__rule{margin:26px 0 0;width:0;transition:width 1.2s cubic-bezier(.16,1,.3,1) .45s}
.vh--image .reveal.is-visible .vh__rule,
.vh--image .vh__inner.is-visible .vh__rule{width:88px}
.vh--image .vh__sub{max-width:46ch;font-size:clamp(15px, 14px + .35vw, 18px);line-height:1.7}
/* el texto entra escalonado, no de golpe */
.vh--image .vh__inner > *{opacity:0;transform:translateY(22px);
  transition:opacity .9s ease, transform 1s cubic-bezier(.16,1,.3,1)}
.vh--image .vh__inner.is-visible > *{opacity:1;transform:none}
.vh--image .vh__inner.is-visible > *:nth-child(2){transition-delay:.10s}
.vh--image .vh__inner.is-visible > *:nth-child(3){transition-delay:.20s}
.vh--image .vh__inner.is-visible > *:nth-child(4){transition-delay:.28s}
.vh--image .vh__inner.is-visible > *:nth-child(5){transition-delay:.36s}
.vh--image .vh__inner.is-visible > *:nth-child(6){transition-delay:.46s}
.vh--image .vh__inner .vh__num{opacity:.001;transform:translateY(-52%) scale(.95);
  transition:opacity 1.6s ease, transform 1.8s cubic-bezier(.16,1,.3,1)}
.vh--image .vh__inner.is-visible .vh__num{opacity:1;transform:translateY(-52%) scale(1)}
/* velo con degradado: el texto se lee y la foto respira */
.vh--image .vh__bg::after{background:linear-gradient(100deg,rgba(12,14,18,.74) 0%,rgba(12,14,18,.52) 46%,rgba(12,14,18,.30) 100%)}
@media (max-width:760px){
  .vh--image .vh__bg::after{background:linear-gradient(180deg,rgba(12,14,18,.46) 0%,rgba(12,14,18,.62) 55%,rgba(12,14,18,.76) 100%)}
  .vh__num{font-size:clamp(8rem, 4rem + 30vw, 15rem);right:auto;left:50%;transform:translate(-50%,-50%)}
  .vh--image .vh__inner.is-visible .vh__num{transform:translate(-50%,-50%)}
  .vh--image .vh__title br{content:"";display:inline}
  .vh--image .vh__title br::after{content:" "}
}
@media (prefers-reduced-motion:reduce){
  .vh--image .vh__inner > *,.vh--image .vh__inner .vh__num{opacity:1;transform:none;transition:none}
  .vh--image .vh__rule{width:88px;transition:none}
}
.vh__sub{margin-top:20px;font-family:var(--f-serif);font-style:italic;font-weight:500;
  font-size:clamp(1.05rem,.95rem + .7vw,1.42rem)}
.vh--light .vh__sub{color:var(--ink-soft);max-width:46ch;margin-inline:auto}
.vh--image .vh__sub{color:rgba(244,239,230,.82);max-width:40ch}
.vh__cta{margin-top:32px}
.vh__note{position:absolute;left:14px;bottom:12px;z-index:2;font-family:var(--f-sans);font-size:9.5px;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(244,239,230,.4)}
.home-access{margin-top:36px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px 28px}
.home-access a{font-family:var(--f-sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);border-bottom:1px solid var(--gold);padding-bottom:4px}
.home-access a:hover{color:var(--gold-deep)}

/* ---------- vitrina de vinos ----------
   fondo blanco continuo (igual que el fondo de las fotos de producto) para que
   cada botella parezca puesta sobre la misma mesa, no una tarjeta pegada encima. */
.cellar{position:relative;background:#fff;color:var(--ink);overflow:hidden;
  min-height:clamp(520px, 80svh, 780px);display:flex;flex-direction:column;justify-content:center;
  padding-block:clamp(64px,9vw,104px)}
.cellar__head{position:relative;text-align:center;margin-bottom:clamp(36px,5vw,64px);padding-inline:var(--gutter)}
.cellar__head .lbl{color:var(--gold-deep)}
.cellar__head h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(2.1rem,1.5rem + 2.8vw,3.4rem);margin-top:.6rem;letter-spacing:.004em}
.cellar__head .rule{width:64px;height:1px;background:var(--gold);margin:24px auto 0}

.cellar__track{padding-top:18px;position:relative;display:flex;align-items:flex-start;gap:clamp(26px,6vw,88px);
  overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;
  padding:0 max(var(--gutter), calc((100vw - 1100px)/2)) 8px;
  -ms-overflow-style:none;scrollbar-width:none;cursor:grab}
.cellar__track::-webkit-scrollbar{display:none}
.cellar__track.is-drag{cursor:grabbing;scroll-behavior:auto}
.cellar__track.is-drag *{pointer-events:none}

.bottle-item{flex:0 0 auto;width:clamp(190px,22vw,260px);text-align:center;scroll-snap-align:center;
  display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit}
/* la caja mide igual en todas (bases alineadas); --bscale solo escala la botella */
.bottle-item__vessel{position:relative;width:100%;height:clamp(230px,30vw,320px);
  display:flex;align-items:flex-end;justify-content:center;overflow:visible;
  transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.bottle-item__vessel img{height:calc(100% * var(--bscale,1));width:auto;max-width:100%;flex-shrink:0;
  object-fit:contain;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1);
  -webkit-user-drag:none;user-select:none;pointer-events:none}
.bottle-item:hover .bottle-item__vessel{transform:translateY(-8px)}
.bottle-item:hover .bottle-item__vessel img{transform:scale(1.035)}
.bottle-item__name{transition:color .35s ease}
.bottle-item:hover .bottle-item__name{color:var(--gold-deep)}
.bottle-item__name{font-family:var(--f-serif);font-weight:500;text-transform:uppercase;
  letter-spacing:.09em;font-size:clamp(.92rem,.8rem + .5vw,1.18rem);color:var(--ink-head);
  margin-top:1.4rem;line-height:1.2;text-wrap:balance;max-width:16ch}
.bottle-item__meta{font-family:var(--f-sans);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-mute);margin-top:.5rem}

.cellar__bar{position:relative;width:min(56%,520px);height:1px;background:var(--rule);
  margin:clamp(30px,5vw,54px) auto 0;touch-action:none}
.cellar__bar-fill{position:absolute;top:-1px;height:3px;background:var(--gold);left:0;width:20%;
  transition:left .1s linear,width .1s linear}
.cellar__foot{position:relative;text-align:center;margin-top:clamp(24px,4vw,44px);padding-inline:var(--gutter)}
.cellar__foot a{border-color:var(--ink);color:var(--ink)}
.cellar__foot a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

@media (max-width:640px){
  .cellar{min-height:auto}
  /* móvil: una botella por pantalla, con snap — se pasa deslizando */
  .cellar__track{gap:0;scroll-snap-type:x mandatory;padding-inline:0;
    scroll-padding-inline:0}
  .bottle-item{width:100vw;max-width:100vw;
    padding-inline:12vw;scroll-snap-align:center;scroll-snap-stop:always}
  .bottle-item__vessel{height:46vh}
  .bottle-item__name{font-size:1.15rem;max-width:20ch}
  .bottle-item__meta{font-size:11px}
  .cellar__bar{width:min(70%,320px)}
}

/* silueta de botella de relleno (hasta tener los PNG recortados reales) */
.bottle-svg{--glass:#2a1016}
.bottle-svg .glass{fill:var(--glass)}
.bottle-svg .cap{fill:#0c0a09}
.bottle-svg .label{fill:#e9dec6}
.bottle-svg .rule{fill:#7c1f31}
.bottle-svg .shine{fill:rgba(255,255,255,.07)}
.bottle-svg--blanco{--glass:#33402a}
.bottle-svg--blanco .label{fill:#f0eada}
.bottle-svg--vermut{--glass:#241a10}

/* ---------- ficha del vino (mismo efecto que temposvegasicilia.com/vino/…) ----------
   página real por vino (/gran-seleccion/, /seleccion/, etc.), plantilla page-ficha-vino.php */
.wine-detail__panel{position:relative;z-index:1;max-width:1360px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr}
.wine-detail__media{position:relative;display:flex;align-items:center;justify-content:center;
  padding:56px 40px 64px}
.wine-detail__card{position:relative;width:min(92%,520px);display:flex;align-items:center;justify-content:center}
.wine-detail__card img{width:auto;max-width:100%;display:block;
  height:calc(clamp(300px,54svh,520px) * var(--bscale,1));object-fit:contain;object-position:center bottom;
  animation:fichaImgIn 1s cubic-bezier(.2,.7,.2,1) both}
@keyframes fichaImgIn{from{opacity:0;transform:translateY(26px) scale(.96)}to{opacity:1;transform:none}}
.wine-detail__body{padding:clamp(40px,6vw,72px) clamp(24px,4vw,56px) 56px clamp(24px,5vw,64px);color:var(--ink)}
.wine-detail__kicker{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-deep);margin:0 0 .9rem}
.wine-detail__body h1,.wine-detail__body h3{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(2.1rem, 1.4rem + 2.8vw, 3.4rem);margin:0 0 1.3rem;line-height:1.08}
.wine-detail__text{color:var(--ink-soft);font-size:15.5px;line-height:1.9;margin:0 0 2rem;max-width:52ch}
.wine-detail__spec{display:grid;grid-template-columns:auto 1fr;gap:.75rem 1rem;margin:0 0 2.2rem;padding-top:1.5rem;
  border-top:1px solid var(--rule);font-size:13px;max-width:46ch}
.wine-detail__spec dt{color:var(--ink-mute);font-family:var(--f-sans);letter-spacing:.04em;white-space:nowrap}
.wine-detail__spec dd{margin:0;color:var(--ink-head);text-align:right;font-variant-numeric:tabular-nums}
.wine-detail__back{position:absolute;top:26px;right:clamp(20px,4vw,56px);z-index:2;background:none;border:0;
  color:var(--ink-head);font-family:var(--f-serif);font-style:italic;font-size:1rem;cursor:pointer;padding:6px 0;
  display:inline-flex;align-items:center;gap:.65em;opacity:.72;text-decoration:none;transition:opacity .3s ease,color .3s ease}
.wine-detail__back::before{content:"";width:26px;height:1px;background:currentColor}
.wine-detail__back:hover{opacity:1;color:var(--gold-deep)}
@media (max-width:760px){
  .wine-detail__panel{grid-template-columns:1fr}
  .wine-detail__media{padding:26px 24px 8px}
  .wine-detail__card{width:min(78%,340px)}
  .wine-detail__body{padding-top:8px;text-align:center}
  .wine-detail__text{margin-inline:auto}
  .wine-detail__spec{margin-inline:auto;max-width:340px}
  .wine-detail__back{position:static;margin:18px auto 0;justify-content:center}
}

/* página real /latarce-gran-seleccion/, etc. — fondo BLANCO continuo: la foto de estudio
   (que ya viene sobre blanco) se integra sin que se vea ningún borde de recorte. */
.ficha{position:relative;background:#fff;overflow:hidden;min-height:calc(100svh - var(--header-h))}
.ficha__bg,.ficha__vignette{display:none}
/* sin sombra ni marco: la foto se funde con el blanco de la página */
.wine-detail__card{box-shadow:none;background:transparent}

/* tratamiento editorial (mismo lenguaje que /el-sueno-de-eladio/):
   nombre gigante en gris muy claro detrás de la botella + halo dorado */
.wine-detail__media{position:relative;overflow:hidden}
.ficha__word{position:absolute;left:50%;top:50%;z-index:0;
  font-family:var(--f-serif);font-weight:500;letter-spacing:-.025em;line-height:.82;
  font-size:var(--wfs, clamp(3rem, 8vw, 9rem));white-space:nowrap;
  pointer-events:none;user-select:none;
  /* degradado vertical: da profundidad y evita el gris plano */
  background:linear-gradient(177deg,#e6ddc9 0%,#efe9dc 48%,#f7f4ee 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:fichaWord 1.7s cubic-bezier(.16,1,.3,1) .05s both}
@keyframes fichaWord{from{opacity:0;transform:translate(-50%,-50%) scale(.94)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.wine-detail__card::before{content:"";position:absolute;inset:-14% -18%;z-index:0;pointer-events:none;
  background:radial-gradient(54% 58% at 50% 48%, rgba(191,157,86,.26) 0%, rgba(191,157,86,.10) 42%, rgba(255,255,255,0) 74%);
  animation:fichaHalo 1.8s cubic-bezier(.16,1,.3,1) .12s both}
@keyframes fichaHalo{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}
.wine-detail__card img{position:relative;z-index:1}
@media (max-width:1000px){
  .ficha__word{font-size:calc(var(--wfs, 8vw) * 1.15)}
}
@media (prefers-reduced-motion:reduce){
  .ficha__word,.wine-detail__card::before{animation:none;opacity:1}
  .ficha__word{transform:translate(-50%,-50%)}
}
@media (max-width:1000px){.ficha{min-height:auto}}
@media (prefers-reduced-motion:reduce){.ficha__bg{animation:none}}

/* ---------- contacto: mapa y avisos del formulario ---------- */
.contacto-grid{align-items:start;gap:clamp(28px,5vw,64px)}
.contacto-mapa{position:relative;aspect-ratio:4/3;border:1px solid var(--rule);overflow:hidden;border-radius:2px}
.contacto-mapa iframe{position:absolute;inset:0;width:100%;height:100%;filter:grayscale(1) contrast(1.05);
  transition:filter .6s ease}
.contacto-mapa:hover iframe{filter:none}
.form-aviso{max-width:52ch;margin:0 auto 1.8rem;padding:.95rem 1.2rem;text-align:center;
  font-family:var(--f-sans);font-size:14px;line-height:1.6;border-radius:2px}
.form-aviso--ok{background:rgba(191,157,86,.12);border:1px solid var(--gold);color:var(--ink-head)}
.form-aviso--err{background:rgba(160,60,50,.08);border:1px solid rgba(160,60,50,.35);color:#7c3a33}
.rf__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.rf__nota{margin:1.1rem 0 0;font-size:12px;color:var(--ink-mute)}
.rf__nota a{text-decoration:underline}
.rf label span{font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink-mute)}
@media (max-width:760px){.contacto-mapa{aspect-ratio:3/2}}

/* ---------- en /catas, la vitrina se ve entera en móvil ---------- */
@media (max-width:760px){
  .cellar--grid-movil .cellar__track{display:grid;grid-template-columns:repeat(2,1fr);
    gap:clamp(20px,5vw,30px) clamp(10px,3vw,18px);overflow:visible;
    padding-inline:var(--gutter);scroll-snap-type:none}
  .cellar--grid-movil .bottle-item{width:100%;max-width:none;padding-inline:0;scroll-snap-align:none}
  .cellar--grid-movil .bottle-item__vessel{height:clamp(150px,26vh,210px)}
  .cellar--grid-movil .bottle-item__name{font-size:.92rem;margin-top:.9rem;max-width:100%}
  .cellar--grid-movil .bottle-item__meta{font-size:9.5px}
  .cellar--grid-movil .cellar__nav{display:none}
  .cellar--grid-movil::after{display:none}
}

/* ---------- la ventaja del 10 % ---------- */
.ventaja{background:var(--paper-alt);padding-block:clamp(56px,8vw,100px)}
.ventaja__head{text-align:center;max-width:60ch;margin:0 auto clamp(34px,4.6vw,54px)}
.ventaja__pct{display:block;font-family:var(--f-serif);font-weight:500;color:var(--gold);
  font-size:clamp(3.2rem, 2rem + 5vw, 5.4rem);line-height:1;letter-spacing:-.02em}
.ventaja__label{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-mute);margin:.7rem 0 1.1rem}
.ventaja h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.5rem, 1.1rem + 1.8vw, 2.3rem);margin:0 0 .9rem;line-height:1.16}
.ventaja__sub{color:var(--ink-soft);font-size:15px;line-height:1.75;margin:0}
.ventaja__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.6vw,28px);
  max-width:var(--container);margin-inline:auto}
.ventaja__card{position:relative;background:var(--paper);border:1px solid var(--rule);
  padding:clamp(26px,3.6vw,40px);border-radius:2px;overflow:hidden;
  transition:border-color .4s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.ventaja__card:hover{border-color:var(--gold);transform:translateY(-3px)}
.ventaja__n{position:absolute;top:clamp(12px,2vw,20px);right:clamp(14px,2.4vw,24px);
  font-family:var(--f-serif);font-size:clamp(2.6rem,4.6vw,4.2rem);line-height:1;color:#f4f1ea}
.ventaja__card h3{position:relative;font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.12rem, 1rem + .6vw, 1.4rem);margin:0 0 .7rem}
.ventaja__card p{position:relative;color:var(--ink-soft);font-size:14.5px;line-height:1.75;margin:0 0 1.2rem}
.ventaja__card .link-underline{position:relative}
@media (max-width:700px){.ventaja__grid{grid-template-columns:1fr}}

/* ---------- pie: logotipo real y redes ---------- */
.f-logo{display:inline-block;margin-bottom:clamp(10px,1.4vw,14px)}
.f-logo img{width:clamp(148px,17vw,196px);height:auto;display:block;opacity:.94}
.f-social{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:clamp(10px,1.6vw,16px)}
.f-social a{display:inline-flex;align-items:center;gap:.6rem;color:rgba(244,239,230,.62);
  font-family:var(--f-sans);font-size:12.5px;letter-spacing:.02em;transition:color .3s ease}
.f-social a:hover{color:var(--gold)}
.f-social svg{flex:0 0 auto}




/* el botón de "volver arriba" del tema padre no encaja con el diseño */
#ast-scroll-top,.ast-scroll-top-icon,.ast-scroll-to-top-right,.ast-scroll-to-top-left{display:none!important}


/* ---------- horario integrado en el pie del hero ---------- */
.hero-info{position:absolute;left:0;right:0;bottom:0;z-index:4;
  background:linear-gradient(180deg,rgba(10,11,14,0) 0%,rgba(10,11,14,.55) 46%,rgba(10,11,14,.82) 100%);
  padding:clamp(34px,5vw,54px) var(--gutter) clamp(13px,1.8vw,18px)}
.hero-info__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.35rem .7rem;
  max-width:var(--container);margin-inline:auto;
  font-family:var(--f-sans);font-size:clamp(10.5px,.72vw + 8px,12.5px);letter-spacing:.06em;
  color:rgba(255,255,255,.78);text-align:center}
.hero-info__row b{color:#fff;font-weight:600}
.hero-info__row a{color:rgba(255,255,255,.78);transition:color .3s ease}
.hero-info__row a:hover{color:var(--gold)}
.hero-info__row .sep{opacity:.4}
.hero--fijo .hero__scroll{display:none}
@media (max-width:760px){
  .hero-info{padding-bottom:clamp(12px,2.4vw,16px)}
  .hero-info__row{gap:.2rem .5rem;font-size:10.5px;line-height:1.5}
  .hero-info__row .sep{display:none}
  .hero-info__row > span,.hero-info__row > a{flex:0 0 100%}
  .hero-info__row > a:last-child{display:none}
}

/* ---------- las secciones con foto se funden entre sí ----------
   No hay franja de papel: cada banda solapa un poco a la anterior y su borde
   superior se desvanece, de modo que la foto de una sección se disuelve
   suavemente sobre la foto de la siguiente. Un fundido, no un corte. */
.vh--image{position:relative}
.vh--image + .vh--image{margin-top:calc(clamp(46px,7vw,88px) * -1)}
.vh--image + .vh--image .vh__bg{
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 clamp(46px,7vw,88px));
  mask-image:linear-gradient(180deg,transparent 0,#000 clamp(46px,7vw,88px))}
/* el texto de cada sección se aparta del solape para no caer sobre el fundido */
.vh--image + .vh--image .vh__inner{padding-top:calc(clamp(46px,7vw,88px) + clamp(60px,9vw,96px))}
@media (max-width:760px){
  .vh--image + .vh--image{margin-top:calc(clamp(34px,7vw,54px) * -1)}
  .vh--image + .vh--image .vh__bg{
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 clamp(34px,7vw,54px));
    mask-image:linear-gradient(180deg,transparent 0,#000 clamp(34px,7vw,54px))}
  .vh--image + .vh--image .vh__inner{padding-top:calc(clamp(34px,7vw,54px) + clamp(52px,11vw,78px))}
}

/* ---------- ritmo vertical: separación clara pero sin huecos muertos ---------- */
.showcase{padding-block:clamp(34px,4.2vw,58px)}
.showcase + .showcase,
.relato + .relato{padding-top:0}
.section + .showcase,
.section + .relato{padding-top:clamp(16px,2.2vw,30px)}
.showcase + .section,
.relato + .section{padding-top:clamp(20px,2.6vw,36px)}
.vb-hero + .section,
.page-hero + .section{padding-top:clamp(38px,5vw,72px)}
.showcase:last-of-type,
.relato:last-of-type{padding-bottom:clamp(24px,3.2vw,44px)}

/* ---------- pie compacto en móvil: cabe casi en una pantalla ---------- */
@media (max-width:760px){
  .site-footer{padding-block:clamp(18px,3.6vw,24px) 10px}
  .site-footer .f-top{grid-template-columns:1fr 1fr;gap:.8rem .9rem}
  .site-footer .f-top > div:first-child{grid-column:1 / -1}
  /* la descripción larga sobra en móvil: el pie es para actuar, no para leer */
  .site-footer .f-top > div:first-child > p{display:none}
  .f-logo{margin-bottom:.5rem}
  .f-logo img{width:118px}
  .f-social{flex-direction:row;flex-wrap:wrap;gap:.3rem 1rem;margin-top:.5rem}
  .f-social a span{font-size:11px}
  .f-social svg{width:16px;height:16px}
  .site-footer h4,.site-footer .f-col-titulo{margin:0 0 .4rem;font-size:9px}
  .site-footer ul{gap:.2rem;font-size:11.5px;line-height:1.45}
  /* el índice de la web, a dos columnas: ahorra media pantalla */
  .site-footer .f-top > div:last-child ul{grid-template-columns:1fr 1fr;gap:.2rem .8rem}
  .site-footer .f-top > div:last-child{grid-column:1 / -1}
  .f-awards-band{margin-top:.7rem;padding-top:.7rem}
  .f-awards-band .awards__title{margin-bottom:.4rem;font-size:8px}
  .f-awards-band .award-seal{height:22px}
  .f-awards-band .award-seal[data-seal="tripadvisor"],
  .f-awards-band .award-seal[data-seal="restaurant-guru"]{height:27px}
  .f-awards-band .award-seal[data-seal="gastroranking"],
  .f-awards-band .award-seal[data-seal="pueblos-magicos"]{height:19px}
  .f-awards-band .awards__row{gap:16px}
  .site-footer .f-bot{padding-top:.6rem;gap:.3rem .8rem;font-size:9.5px}
}


/* heros de /catas y /restaurante: tipografía contenida, la foto se ve */
.vb-hero--rest .vb-hero__title,
.vb-hero--catas .vb-hero__title{font-size:clamp(1.9rem, 1.3rem + 2.6vw, 3.4rem);letter-spacing:.005em;line-height:1.08}
.vb-hero--rest .vb-hero__sub,
.vb-hero--catas .vb-hero__sub{font-size:clamp(14px, 13px + .4vw, 17px);max-width:44ch;margin-inline:auto}
.vb-hero--rest .vb-hero__veil,
.vb-hero--catas .vb-hero__veil{background:linear-gradient(180deg,rgba(10,11,14,.30) 0%,rgba(10,11,14,.18) 42%,rgba(10,11,14,.56) 100%)}
/* el hero del restaurante, algo más bajo: es una antesala, no una portada */
.vb-hero--rest{min-height:clamp(420px,66svh,640px)}
.vb-hero--rest .vb-hero__bg{background-position:center 58%}
@media (max-width:640px){
  .vb-hero--rest .vb-hero__title,
  .vb-hero--catas .vb-hero__title{font-size:clamp(1.7rem, 1.2rem + 3.4vw, 2.4rem)}
  .vb-hero--rest .vb-hero__sub,
  .vb-hero--catas .vb-hero__sub{font-size:13.5px}
  .vb-hero--rest{min-height:clamp(360px,56svh,480px)}
}

/* ---------- visor de cartas en PDF (dentro de la propia página) ---------- */
.pdf-modal{position:fixed;inset:0;z-index:200;background:rgba(14,12,10,.94);
  display:flex;flex-direction:column;animation:pdfIn .35s ease both}
@keyframes pdfIn{from{opacity:0}to{opacity:1}}
.pdf-modal[hidden]{display:none}
.pdf-modal__barra{display:flex;align-items:center;gap:1rem;flex:0 0 auto;
  padding:clamp(12px,1.8vw,18px) clamp(14px,3vw,28px);
  border-bottom:1px solid rgba(255,255,255,.12)}
.pdf-modal__titulo{flex:1 1 auto;font-family:var(--f-serif);font-size:clamp(15px,1.4vw,19px);
  color:#fff;letter-spacing:.01em}
.pdf-modal__link{font-family:var(--f-sans);font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.7);transition:color .3s ease}
.pdf-modal__link:hover{color:var(--gold)}
.pdf-modal__cerrar{background:none;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;
  padding:0 .2rem;opacity:.8;transition:opacity .3s ease}
.pdf-modal__cerrar:hover{opacity:1}
.pdf-modal__doc{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
  display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.6vw,18px);
  padding:clamp(12px,2vw,26px) clamp(8px,2vw,20px) clamp(30px,5vw,60px)}
.pdf-modal__hoja{width:min(100%,900px);background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.4);line-height:0}
.pdf-modal__hoja canvas{display:block}
.pdf-modal__cargando{display:flex;align-items:center;gap:.7rem;padding:18vh 0;
  font-family:var(--f-sans);font-size:12.5px;letter-spacing:.06em;color:rgba(255,255,255,.7)}
.pdf-modal__cargando span{width:16px;height:16px;border:2px solid rgba(255,255,255,.25);
  border-top-color:var(--gold);border-radius:50%;animation:pdfGira .9s linear infinite}
@keyframes pdfGira{to{transform:rotate(360deg)}}
.pdf-modal__error{color:rgba(255,255,255,.8);padding:18vh 1rem;text-align:center}
.pdf-modal__error a{color:var(--gold);text-decoration:underline}
@media (prefers-reduced-motion:reduce){.pdf-modal{animation:none}.pdf-modal__cargando span{animation:none}}

/* En /restaurante el texto encabeza el bloque y la foto va debajo,
   también al apilarse en móvil. */
@media (max-width:820px){
  .showcase--texto-antes{display:flex;flex-direction:column}
  .showcase--texto-antes .showcase__body{order:1;margin-bottom:clamp(14px,3vw,22px)}
  .showcase--texto-antes .showcase__media{order:2}
}

/* ---------- fotos ya editadas con el plato saliéndose del recuadro ----------
   Vienen con su propio fondo blanco y el objeto sobresaliendo, así que se
   muestran enteras: nada de recortes ni de proporción forzada. */
.showcase__media--suelta{overflow:visible;aspect-ratio:auto;background:none}
.showcase__media--suelta img,
.showcase--rev .showcase__media--suelta img{width:100%;height:auto;aspect-ratio:auto;
  object-fit:contain;display:block;
  filter:drop-shadow(0 18px 30px rgba(26,22,18,.10));
  transform:translateY(14px) scale(.985);opacity:0;
  transition:opacity 1s cubic-bezier(.16,1,.3,1), transform 1.3s cubic-bezier(.16,1,.3,1)}
.showcase__media--suelta.is-visible img{opacity:1;transform:translateY(0) scale(1)}
@media (prefers-reduced-motion:reduce){
  .showcase__media--suelta img{opacity:1;transform:none;transition:none}
}




/* ---------- medallas de los vinos: una línea, arriba, discretas ---------- */
.medallas-tira{background:var(--paper);padding:clamp(30px,4.4vw,54px) 0 clamp(24px,3.4vw,40px);
  border-bottom:1px solid var(--rule);text-align:center}
.medallas-tira__label{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ink-mute);margin:0 0 clamp(18px,2.4vw,26px)}
.medallas-tira__row{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;
  gap:clamp(16px,3.2vw,46px)}
.medallas-tira__item{height:clamp(52px,6.4vw,82px);width:auto;flex:0 1 auto;min-width:0;object-fit:contain;
  opacity:0;transform:translateY(8px);
  animation:medIn .9s cubic-bezier(.16,1,.3,1) var(--d,0s) forwards;
  transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.medallas-tira__item:hover{transform:translateY(-3px)}
@keyframes medIn{to{opacity:.94;transform:translateY(0)}}
@media (max-width:640px){
  .medallas-tira__row{gap:9px}
  .medallas-tira__item{height:clamp(42px,11.5vw,58px)}
}
@media (prefers-reduced-motion:reduce){.medallas-tira__item{animation:none;opacity:.94;transform:none}}

/* ---------- relato de elaboración: texto primero, foto fundida en el papel ---------- */
.relato{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;
  gap:clamp(10px,2vw,40px);max-width:var(--container);margin-inline:auto;
  padding:clamp(34px,4.6vw,72px) var(--gutter)}
.relato--rev{direction:rtl}
.relato--rev > *{direction:ltr}
.relato__body{position:relative;z-index:2;max-width:52ch}
.relato__body .eyebrow{color:var(--gold-deep);margin-bottom:1rem}
.relato__body h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.1;
  font-size:clamp(1.6rem, 1.15rem + 2.2vw, 2.7rem);margin:0 0 1.2rem;letter-spacing:-.004em}
.relato__body p{color:var(--ink-soft);font-size:clamp(14.5px, 14px + .35vw, 16.5px);line-height:1.85;margin:0}
/* la foto se disuelve en el blanco por el lado del texto: un solo encuadre */
.relato__media{position:relative;z-index:1}
.relato__media img{width:100%;height:auto;display:block;
  -webkit-mask-image:linear-gradient(to left,#000 52%,rgba(0,0,0,.55) 78%,transparent 100%);
  -webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
  mask-image:linear-gradient(to left,#000 52%,rgba(0,0,0,.55) 78%,transparent 100%);
  mask-size:100% 100%;mask-repeat:no-repeat;mask-mode:alpha;
  transform:scale(1.05);transition:transform 1.5s cubic-bezier(.16,1,.3,1)}
.relato__media.is-visible img{transform:scale(1)}
.relato--rev .relato__media img{
  -webkit-mask-image:linear-gradient(to right,#000 52%,rgba(0,0,0,.55) 78%,transparent 100%);
  mask-image:linear-gradient(to right,#000 52%,rgba(0,0,0,.55) 78%,transparent 100%)}
@supports not ((-webkit-mask-image:linear-gradient(#000,#000)) or (mask-image:linear-gradient(#000,#000))){
  .relato__media img,.carta-fila__media img,.menu-slide__img img{opacity:1}
}
@media (max-width:820px){
  /* foto grande arriba y el texto montado sobre su base: un solo bloque,
     ni la imagen pierde protagonismo ni el texto queda descolgado */
  /* en el HTML el texto va primero (por SEO); en móvil la foto sube arriba */
  .relato,.relato--rev{display:flex;flex-direction:column;direction:ltr;gap:0;
    padding:0 0 clamp(26px,5vw,42px)}
  .relato__media{order:1}
  .relato__body{order:2}
  .relato + .relato{padding-top:clamp(22px,4.4vw,34px)}
  .relato__media{position:relative;inset:auto;z-index:0;margin:0;overflow:hidden;background:var(--paper)}
  .relato__media img{width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;object-position:center 34%;
    -webkit-mask-image:none;mask-image:none}
  /* el degradado arranca abajo del todo: la foto se ve casi entera */
  .relato__media::after{content:"";position:absolute;inset:auto 0 -1px;height:26%;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.5) 52%,var(--paper) 88%,var(--paper) 100%)}
  .relato__body,.relato--rev .relato__body{position:relative;z-index:2;width:auto;max-width:none;background:none;
    margin:calc(clamp(30px,8vw,64px) * -1) var(--gutter) 0;padding:0}
  .relato__body .eyebrow{margin-bottom:.5rem}
  .relato__body h2{font-size:clamp(1.5rem, 1.1rem + 2.2vw, 2.05rem);margin-bottom:.8rem}
  .relato__body p{font-size:14px;line-height:1.78}
  .relato__body p + p{margin-top:.7rem}
}
@media (max-width:520px){
  .relato__media img{aspect-ratio:4/3}
  .relato__body{margin-top:calc(clamp(26px,7vw,48px) * -1) !important}
  .relato__body p{font-size:13.5px}
}

/* ---------- /carta: premios sobre blanco y cartas en una línea ---------- */
.premios-claro{background:var(--paper);padding:clamp(34px,5vw,64px) 0 clamp(26px,3.6vw,44px);text-align:center;
  border-bottom:1px solid var(--rule)}
.premios-claro__label{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ink-mute);margin:0 0 clamp(18px,2.4vw,28px)}
.premios-claro__media{max-width:min(82%,470px);margin-inline:auto}
.premios-claro__media img{width:100%;height:auto;display:block;
  filter:drop-shadow(0 12px 26px rgba(26,22,18,.13))}
@media (max-width:640px){.premios-claro__media{max-width:86%}}

.cartas{padding-block:clamp(40px,6vw,80px)}
.carta-fila{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  align-items:center;gap:clamp(26px,4vw,64px);
  padding-block:clamp(26px,3.6vw,44px);border-bottom:1px solid var(--rule)}
.carta-fila:nth-child(even){direction:rtl}
.carta-fila:nth-child(even) > *{direction:ltr}
.carta-fila__aside{grid-column:2}
.carta-fila__media{grid-row:1 / span 2}
.carta-fila:first-child{border-top:1px solid var(--rule)}
.carta-fila__media{overflow:hidden}
.carta-fila__media img{width:100%;height:100%;aspect-ratio:5/4;object-fit:cover;object-position:center 42%;
  display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1);
  -webkit-mask-image:linear-gradient(to right,#000 58%,rgba(0,0,0,.45) 86%,transparent 100%);
  -webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
  mask-image:linear-gradient(to right,#000 58%,rgba(0,0,0,.45) 86%,transparent 100%);
  mask-size:100% 100%;mask-repeat:no-repeat;mask-mode:alpha}
/* filas invertidas (nth-child par -> direction:rtl): la foto va a la derecha y el
   texto a la izquierda, así que el fundido tiene que ir por la IZQUIERDA (hacia el texto) */
.carta-fila:nth-child(even) .carta-fila__media img{
  -webkit-mask-image:linear-gradient(to left,#000 58%,rgba(0,0,0,.45) 86%,transparent 100%);
  mask-image:linear-gradient(to left,#000 58%,rgba(0,0,0,.45) 86%,transparent 100%)}
.carta-fila:hover .carta-fila__media img{transform:scale(1.05)}
.carta-fila__eyebrow{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-deep);margin:0 0 .5rem}
.carta-fila__title{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.24rem, 1.05rem + .9vw, 1.75rem);margin:0 0 .55rem;line-height:1.18}
.carta-fila__copy{color:var(--ink-soft);font-size:14.5px;line-height:1.72;margin:0;max-width:56ch}
.carta-fila__note{margin:.7rem 0 0;font-size:11.5px;color:var(--ink-mute)}
.carta-fila__aside{text-align:left;display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 1.1rem;margin-top:1.1rem}
.carta-fila__price{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.5rem, 1.2rem + 1.3vw, 2.15rem);line-height:1.1;margin:0}
.carta-fila__pnota{margin:0;font-family:var(--f-sans);font-size:11.5px;line-height:1.5;
  color:var(--ink-mute);flex:1 1 auto}
.carta-fila__aside .btn{width:auto;flex:0 0 auto;margin-top:.4rem}
@media (max-width:900px){
  /* La foto ocupa la ficha entera y el texto se apoya en un panel de papel
     que la solapa: la imagen se ve grande y el texto se lee sin pelearse. */
  .cartas .container{padding-inline:0}
  .carta-fila{position:relative;display:block;padding:0 0 clamp(26px,5vw,40px);border-bottom:0}
  .carta-fila:first-child{border-top:0}
  .carta-fila + .carta-fila{margin-top:clamp(26px,5vw,42px)}
  .carta-fila__media{position:relative;inset:auto;z-index:0;margin:0;overflow:hidden}
  .carta-fila__media img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center 44%;
    -webkit-mask-image:none;mask-image:none}
  .carta-fila__media::after{content:"";position:absolute;inset:auto 0 -1px;height:46%;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.42) 44%,var(--paper) 76%,var(--paper) 100%)}
  .carta-fila__body{position:relative;z-index:2;width:auto;background:none;
    margin:calc(clamp(10px,2.4vw,18px) * -1) var(--gutter) 0;padding:0}
  .carta-fila__aside{position:relative;z-index:2;width:auto;background:none;
    display:flex;align-items:baseline;flex-wrap:wrap;gap:.4rem .9rem;
    margin:clamp(14px,3vw,20px) var(--gutter) 0;padding:0}
  .carta-fila__copy{font-size:14px;max-width:44ch}
  .carta-fila__note{display:none}
  .carta-fila__pnota{margin:0;flex:1 1 auto}
  .carta-fila__aside .btn{width:auto;flex:0 0 auto;margin-top:.5rem}
}
@media (max-width:520px){
  .carta-fila__media img{aspect-ratio:4/3}
  .carta-fila__title{font-size:1.24rem}
  .carta-fila__copy{font-size:13px;line-height:1.7}
  .carta-fila__aside .btn{width:100%;margin-top:.6rem}
}

/* ---------- Villablanca: bienvenida con el letrero ---------- */
.vb-bienvenida{position:relative;background:#0d0f13;overflow:hidden}
.vb-bienvenida__media img{width:100%;height:clamp(320px,62svh,620px);object-fit:cover;object-position:center 42%;
  display:block;opacity:.72;transform:scale(1.04);transition:transform 1.6s cubic-bezier(.16,1,.3,1),opacity 1.2s ease}
.vb-bienvenida__media.is-visible img{transform:scale(1);opacity:.86}
.vb-bienvenida__cap{position:absolute;inset:auto 0 0;z-index:2;text-align:center;color:#fff;
  padding:0 var(--gutter) clamp(30px,5vw,60px);
  background:linear-gradient(180deg,rgba(8,9,12,0) 0%,rgba(8,9,12,.62) 58%,rgba(8,9,12,.86) 100%)}
.vb-bienvenida__cap .eyebrow{color:var(--gold);margin-bottom:.7rem}
.vb-bienvenida__cap h2{font-family:var(--f-serif);font-weight:500;line-height:1.08;color:#fff;
  font-size:clamp(1.7rem, 1.2rem + 2.4vw, 3rem);margin:0 0 1rem;text-wrap:balance}
.vb-bienvenida__cap p{max-width:56ch;margin:0 auto;color:rgba(244,239,230,.84);
  font-size:clamp(14.5px, 14px + .3vw, 16.5px);line-height:1.78}
@media (max-width:640px){
  .vb-bienvenida__cap h2 br{content:"";display:inline}
  .vb-bienvenida__cap h2 br::after{content:" "}
  .vb-bienvenida__cap{padding-bottom:clamp(24px,5vw,40px)}
}
/* mosaico de dos piezas (estaciones del cóctel) */
.mosaic--dos{grid-template-columns:repeat(2,1fr)}
.mosaic--dos .mosaic__item{aspect-ratio:4/3}
@media (max-width:640px){.mosaic--dos{grid-template-columns:1fr}}

/* ---------- vitrina: navegación explícita y pista de que hay más ---------- */
.cellar__intro{margin:14px auto 0;max-width:44ch;font-family:var(--f-sans);font-size:13px;
  line-height:1.7;color:var(--ink-mute)}
.cellar__h{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.5rem, 1.1rem + 1.9vw, 2.4rem);margin:.4rem 0 0;line-height:1.16;text-wrap:balance}
.cellar__nav{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2.4vw,26px);
  margin-top:clamp(26px,3.4vw,40px)}
.cellar__arrow{display:flex;align-items:center;justify-content:center;width:44px;height:44px;
  border:1px solid var(--rule);background:transparent;color:var(--ink-head);border-radius:50%;
  cursor:pointer;transition:opacity .3s ease,background .3s ease,color .3s ease,border-color .3s ease}
.cellar__arrow:hover{background:var(--ink-head);border-color:var(--ink-head);color:#fff}
.cellar__arrow.is-off{opacity:.22;pointer-events:none}
/* degradado en el borde derecho: se ve que la fila sigue */
.cellar{position:relative}
.cellar::after{content:"";position:absolute;top:0;right:0;width:clamp(40px,7vw,110px);height:100%;
  pointer-events:none;opacity:0;transition:opacity .4s ease;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--paper) 82%)}
.cellar.has-more::after{opacity:1}

/* ---------- Villablanca: bienvenida con el letrero ---------- */
.vb-bienvenida{position:relative;background:#0d0f13;overflow:hidden}
.vb-bienvenida__media img{width:100%;height:clamp(320px,62svh,620px);object-fit:cover;object-position:center 42%;
  display:block;opacity:.72;transform:scale(1.04);transition:transform 1.6s cubic-bezier(.16,1,.3,1),opacity 1.2s ease}
.vb-bienvenida__media.is-visible img{transform:scale(1);opacity:.86}
.vb-bienvenida__cap{position:absolute;inset:auto 0 0;z-index:2;text-align:center;color:#fff;
  padding:0 var(--gutter) clamp(30px,5vw,60px);
  background:linear-gradient(180deg,rgba(8,9,12,0) 0%,rgba(8,9,12,.62) 58%,rgba(8,9,12,.86) 100%)}
.vb-bienvenida__cap .eyebrow{color:var(--gold);margin-bottom:.7rem}
.vb-bienvenida__cap h2{font-family:var(--f-serif);font-weight:500;line-height:1.08;color:#fff;
  font-size:clamp(1.7rem, 1.2rem + 2.4vw, 3rem);margin:0 0 1rem;text-wrap:balance}
.vb-bienvenida__cap p{max-width:56ch;margin:0 auto;color:rgba(244,239,230,.84);
  font-size:clamp(14.5px, 14px + .3vw, 16.5px);line-height:1.78}
@media (max-width:640px){
  .vb-bienvenida__cap h2 br{content:"";display:inline}
  .vb-bienvenida__cap h2 br::after{content:" "}
  .vb-bienvenida__cap{padding-bottom:clamp(24px,5vw,40px)}
}
/* ---------- vitrina: flechas mas visibles en escritorio ----------
   En tactil el deslizar ya se entiende solo; en raton nadie descubria que la
   fila seguia. Las flechas se despegan del fondo (papel + sombra, mas
   grandes) y se separan del hilo del progreso para leerse como un control,
   no como una regla decorativa. */
@media (min-width:641px){
  .cellar__nav{gap:clamp(28px,4vw,52px)}
  .cellar__arrow{width:54px;height:54px;background:var(--paper);
    border-color:var(--rule);box-shadow:0 16px 34px -22px rgba(26,22,18,.4)}
  .cellar__arrow svg{width:24px;height:24px;stroke-width:1.5}
  .cellar__arrow:hover{transform:translateY(-3px);
    box-shadow:0 20px 38px -18px rgba(26,22,18,.48)}
  .cellar__arrow.is-off{box-shadow:none}
  .cellar__bar{width:min(30%,280px)}
}

/* ---------- medallas de los vinos ---------- */
.medallas{background:var(--paper-alt);padding-block:clamp(54px,8vw,96px);text-align:center}
.medallas__label{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold-deep);margin:0 0 .7rem}
.medallas__title{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.5rem, 1.1rem + 1.8vw, 2.3rem);margin:0 0 clamp(32px,4.5vw,52px)}
.medallas__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;
  gap:clamp(26px,4.5vw,58px)}
.medalla{margin:0;width:clamp(104px,13vw,148px);display:flex;flex-direction:column;align-items:center}
.medalla img{width:100%;height:auto;display:block;
  filter:drop-shadow(0 10px 20px rgba(26,22,18,.16));
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.medalla:hover img{transform:translateY(-5px) scale(1.03)}
.medalla figcaption{margin-top:.9rem;font-family:var(--f-sans);font-size:10.5px;line-height:1.55;
  letter-spacing:.02em;color:var(--ink-mute);max-width:18ch}
@media (max-width:640px){
  .medallas__row{gap:22px 18px}
  .medalla{width:calc(33.333% - 14px)}
  .medalla figcaption{font-size:9.5px;max-width:14ch}
}

/* ---------- menús de la carta: bloques alternos con imagen (ampliable) ---------- */
.menu-slide{padding-block:clamp(56px,9vw,104px);border-bottom:1px solid var(--rule)}
.menu-slide:last-child{border-bottom:0}
.menu-slide .split{align-items:center}
.menu-slide--rev .split{direction:rtl}
.menu-slide--rev .split > *{direction:ltr}
.menu-slide{position:relative;overflow:hidden}
/* numeral editorial detrás del bloque, mismo lenguaje que /el-sueno-de-eladio/ */
.menu-slide__num{position:absolute;top:50%;transform:translateY(-58%);z-index:0;
  font-family:var(--f-serif);font-weight:500;line-height:.78;letter-spacing:-.03em;
  font-size:clamp(6rem, 2.5rem + 12vw, 14rem);color:#f4f1ea;pointer-events:none;user-select:none}
/* el número vive detrás de la columna de texto, nunca fuera de pantalla */
.menu-slide__num{right:max(var(--gutter), calc(50% - var(--container) / 2 + var(--gutter)))}
.menu-slide--rev .menu-slide__num{right:auto;left:max(var(--gutter), calc(50% - var(--container) / 2 + var(--gutter)))}
.menu-slide .container{position:relative;z-index:1}
/* la foto se funde con el papel: sin marco, sin sombra, desvanecida hacia el texto */
.menu-slide__img{position:relative;aspect-ratio:4/5;overflow:hidden;background:transparent;border:0}
.menu-slide__img img{width:100%;height:100%;object-fit:cover;object-position:center 26%;display:block;
  transform:scale(1.06);transition:transform 1.4s cubic-bezier(.16,1,.3,1);
  -webkit-mask-image:linear-gradient(to right,#000 62%,rgba(0,0,0,.35) 88%,transparent 100%);
  -webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
  mask-image:linear-gradient(to right,#000 62%,rgba(0,0,0,.35) 88%,transparent 100%);
  mask-size:100% 100%;mask-repeat:no-repeat;mask-mode:alpha}
.menu-slide--rev .menu-slide__img img{
  -webkit-mask-image:linear-gradient(to left,#000 62%,rgba(0,0,0,.35) 88%,transparent 100%);
  mask-image:linear-gradient(to left,#000 62%,rgba(0,0,0,.35) 88%,transparent 100%)}
.menu-slide__img.is-visible img{transform:scale(1)}
.menu-slide h2{font-size:clamp(1.7rem,1.2rem + 2vw,2.5rem);margin:.5rem 0 1rem}
.menu-slide__copy{color:var(--ink-soft);font-size:15px;line-height:1.75;max-width:52ch}
.menu-slide__price{display:inline-block;margin:1.2rem 0 1.7rem;padding:.55rem 1.1rem .6rem;
  font-family:var(--f-serif);font-style:italic;font-weight:500;color:var(--ink-head);
  font-size:clamp(1.12rem, 1rem + .55vw, 1.42rem);line-height:1.35;
  border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);letter-spacing:.01em}
.menu-slide__actions{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.menu-slide__note{font-size:12px;color:var(--ink-mute);letter-spacing:.02em}
@media (max-width:820px){
  .menu-slide--rev .split{direction:ltr}
  .menu-slide{padding-block:clamp(40px,8vw,64px)}
  .menu-slide .split{gap:clamp(20px,5vw,30px)}
  .menu-slide__img{margin-inline:calc(var(--gutter) * -1);width:calc(100% + var(--gutter) * 2)}
  .menu-slide__num{font-size:clamp(5rem, 2rem + 18vw, 9rem);top:auto;bottom:1%;transform:none;right:var(--gutter);left:auto}
  .menu-slide--rev .menu-slide__num{left:var(--gutter);right:auto}
  .menu-slide__img{aspect-ratio:3/4}
  /* en móvil la foto se funde por abajo, no por el lado */
  .menu-slide__img img,.menu-slide--rev .menu-slide__img img{
    -webkit-mask-image:linear-gradient(to bottom,#000 78%,rgba(0,0,0,.4) 92%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 78%,rgba(0,0,0,.4) 92%,transparent 100%)}
}

/* ---------- catas: tira de valores + tarjeta de precio + pasos + testimonios ---------- */
.marquee{background:var(--slate);color:#efe6d7;overflow:hidden;border-bottom:1px solid var(--rule)}
.marquee__track{display:flex;white-space:nowrap;gap:0;animation:latarce-marquee 32s linear infinite;width:max-content}
.marquee__track span{font-family:var(--f-sans);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:.9rem 1.6rem;display:inline-flex;align-items:center;gap:1.6rem;color:#d9cfc0}
.marquee__track span b{color:var(--gold)}
@keyframes latarce-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none;overflow-x:auto}}

.price-card{background:var(--paper);border:1px solid var(--rule);padding:clamp(26px,4vw,44px);text-align:center;
  max-width:420px;margin-inline:auto}
.price-card__amount{font-family:var(--f-serif);font-weight:600;color:var(--ink-head);font-size:clamp(2.6rem,2rem + 2vw,3.6rem);line-height:1}
.price-card__amount small{font-family:var(--f-sans);font-size:.9rem;font-weight:600;color:var(--ink-mute);vertical-align:top;margin-left:.3em}
.price-card__note{margin-top:.6rem;font-size:12.5px;color:var(--ink-mute);letter-spacing:.02em}
.price-card .btn{margin-top:1.6rem;width:100%;justify-content:center}
.price-card__sub{margin-top:.9rem;font-size:12px;color:var(--ink-mute)}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:2.4rem}
.step{background:var(--paper);padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:.7rem}
.step__n{font-family:var(--f-serif);font-style:italic;color:var(--gold-deep);font-size:1.6rem}
.step h3{font-size:1.05rem;font-weight:600}
.step p{font-size:13px;color:var(--ink-soft);line-height:1.6}
.steps--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:820px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,30px);margin-top:2.4rem}
.testi{border:1px solid var(--rule);padding:clamp(22px,3vw,30px);display:flex;flex-direction:column;gap:1rem}
.testi p{font-family:var(--f-serif);font-style:italic;color:var(--ink-head);font-size:1.02rem;line-height:1.55;flex:1}
.testi cite{font-style:normal;font-size:12px;color:var(--ink-mute)}
.testi cite b{color:var(--ink);display:block;font-size:13px;margin-bottom:.15rem}
@media (max-width:900px){.testi-grid{grid-template-columns:1fr}}

.cross-sell{position:relative;background:var(--slate);color:#efe6d7;overflow:hidden}
.cross-sell .split{position:relative;z-index:1}
.cross-sell .badge-disc{display:inline-block;font-family:var(--f-sans);font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:#0e0c0a;background:var(--gold);padding:.4em .8em;margin-bottom:1rem}
.cross-sell h2{color:#fff}
.cross-sell p{color:#c9c0b0}

/* ---------- reveal ---------- */
.js .reveal{opacity:0;transform:translateY(24px)}
.js .reveal.is-visible{opacity:1;transform:none;transition:opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none}}

/* ---------- actions row ---------- */
.actions{background:var(--paper);border-block:1px solid var(--rule)}
.actions .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.action{padding:clamp(34px,4.5vw,58px) clamp(18px,2.4vw,34px);text-align:center;border-left:1px solid var(--rule);
  display:flex;flex-direction:column;align-items:center;gap:.75rem}
.action:first-child{border-left:0}
.action h3{font-family:var(--f-serif);font-weight:600;font-size:1.5rem;color:#111}
.action p{margin:0;font-size:13px;line-height:1.7;color:var(--ink-soft);flex:1}
@media (max-width:900px){.actions .grid{grid-template-columns:repeat(2,1fr)}
  .action:nth-child(3){border-left:0}.action:nth-child(n+3){border-top:1px solid var(--rule)}}
@media (max-width:540px){.actions .grid{grid-template-columns:1fr}
  .action{border-left:0;border-top:1px solid var(--rule)}.action:first-child{border-top:0}}

/* ---------- menu / carta ---------- */
.carta-grid{display:grid;grid-template-columns:210px 1fr;gap:clamp(30px,6vw,68px);align-items:start;margin-top:2.6rem}
.qr-card{border:1px solid var(--rule);padding:22px;text-align:center;background:var(--paper)}
.qr-card .qr{width:160px;height:160px;margin:0 auto 12px}
.qr-card .qr img,.qr-card .qr canvas{width:100%!important;height:100%!important}
.qr-card small{font-size:11.5px;color:var(--ink-mute);letter-spacing:-.2px}
.menu-group{margin-top:1.8rem}
.menu-group:first-child{margin-top:0}
.menu-group h3{font-family:var(--f-serif);font-weight:500;font-style:italic;font-size:1.2rem;color:#111;
  padding-bottom:.4rem;border-bottom:1px solid var(--rule);margin-bottom:.5rem}
.dish{display:flex;justify-content:space-between;gap:1.2rem;align-items:baseline;padding:.5rem 0}
.dish .d-name{font-weight:500;color:var(--ink)}
.dish .d-desc{color:var(--ink-mute);font-size:12.5px}
.dish .d-price{font-variant-numeric:tabular-nums;color:var(--ink-mute);white-space:nowrap}
.tag-alg{font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-head);
  border:1px solid var(--rule);padding:.1em .45em;margin-left:.5em;white-space:nowrap}
@media (max-width:680px){.carta-grid{grid-template-columns:1fr}.qr-card{justify-self:start;max-width:250px}}

/* ---------- wines table ---------- */
.table-scroll{overflow-x:auto;margin-top:2.4rem}
table.wines{width:100%;border-collapse:collapse;font-size:14px;letter-spacing:-.2px}
table.wines th{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-mute);text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--rule)}
table.wines td{padding:1rem .9rem;border-bottom:1px solid var(--rule);color:var(--ink-soft)}
table.wines td:first-child{font-family:var(--f-serif);font-weight:500;font-size:1.05rem;color:#111}
table.wines tr:hover td{background:rgba(221,175,95,.07)}

/* ---------- wine entries ---------- */
.wine{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(24px,5vw,56px);align-items:center;
  padding-block:clamp(40px,6vw,72px);border-top:1px solid var(--rule)}
.wine:first-child{border-top:0}
/* zigzag: imagen a la izquierda en filas impares, a la derecha en pares */
@media (min-width:761px){
  .wine:nth-child(even){grid-template-columns:1.4fr 1fr}
  .wine:nth-child(even) .wine-img{order:2}
}
.wine .wine-img{aspect-ratio:1/1;background:#fff;display:flex;align-items:flex-end;justify-content:center;padding-bottom:4%}
.wine h3{font-family:var(--f-serif);font-weight:500;font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);color:#111}
.wine .kicker{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-head);margin-bottom:.5rem}
.wine p{color:var(--ink-soft)}
.wine .spec{margin-top:1rem;font-family:var(--f-sans);font-size:12px;letter-spacing:0;color:var(--ink-mute);
  display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;border-top:1px solid var(--rule);padding-top:.9rem}
.wine .spec b{color:var(--ink);font-weight:600}
.wine .wine-img img{height:calc(92% * var(--bscale,1));width:auto;max-width:100%;flex-shrink:0;object-fit:contain;display:block}
@media (max-width:760px){.wine{grid-template-columns:1fr}.wine .wine-img{max-width:260px;order:-1}}

/* ---------- fact list ---------- */
.facts{list-style:none;margin:2rem 0 0;padding:0}
.facts li{display:flex;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--rule);font-size:14px;letter-spacing:-.2px}
.facts b{min-width:108px;font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-head);padding-top:4px}
.facts a{border-bottom:1px solid var(--rule)}
.facts a:hover{border-color:var(--ink)}

/* ---------- two-col split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,64px);align-items:center}
.split .ph-img{aspect-ratio:4/3;background:linear-gradient(160deg,var(--paper-alt),#efefe9);border:1px solid var(--rule);
  display:flex;align-items:flex-end;padding:14px;color:var(--ink-mute);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:820px){.split{grid-template-columns:1fr}}

/* ---------- form ---------- */
form.rf{max-width:560px;margin:2.4rem auto 0;display:grid;gap:1.15rem;text-align:left}
form.rf .row2{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}
form.rf label{display:grid;gap:.4rem;font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-head)}
form.rf input,form.rf select,form.rf textarea{font-family:var(--f-sans);font-size:14px;letter-spacing:-.2px;
  text-transform:none;padding:.85em .95em;border:1px solid var(--rule);background:var(--paper);color:var(--ink);border-radius:0}
form.rf input:focus,form.rf select:focus,form.rf textarea:focus{border-color:var(--gold);outline:none}
form.rf .ok{color:var(--ink-head);font-family:var(--f-sans);font-size:13px;letter-spacing:-.2px;text-transform:none}
@media (max-width:520px){form.rf .row2{grid-template-columns:1fr}}

/* ---------- news grid ---------- */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:2.4rem}
.news-card{background:var(--paper);padding:30px;display:flex;flex-direction:column;gap:.9rem;min-height:230px;transition:background .3s ease}
.news-card:hover{background:var(--paper-alt)}
.news-card .cat{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-head)}
.news-card h3{font-family:var(--f-serif);font-weight:500;font-size:1.35rem;color:#111;flex:1}
.news-card .more{font-size:12px;color:var(--ink-mute);letter-spacing:.06em;text-transform:uppercase}
@media (max-width:820px){.news-grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.site-footer{background:#0e0c0a;color:#fff;padding-block:clamp(32px,4.4vw,52px) 20px}
.site-footer .f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:1.4rem;
  padding-bottom:2.4rem;border-bottom:1px solid var(--slate-rule)}
.site-footer .wordmark{font-family:var(--f-serif);font-weight:700;letter-spacing:.22em;font-size:18px;color:#fff;margin-bottom:.8rem;display:inline-block}
.site-footer p{margin:0;font-size:13px;color:var(--slate-soft);max-width:28ch}
.site-footer h4,.site-footer .f-col-titulo{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--slate-soft);margin:0 0 .6rem}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.34rem;font-size:12.5px;color:var(--slate-soft)}
.site-footer a:hover{color:#fff}
.site-footer .f-awards-label{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin:1.8rem 0 .7rem}
.site-footer .f-awards{display:flex;flex-wrap:wrap;gap:.5rem}
.site-footer .award{font-family:var(--f-sans);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--slate-soft);border:1px solid var(--slate-rule);padding:.4em .7em;transition:border-color .3s ease,color .3s ease}
.site-footer .award:hover{border-color:var(--gold);color:#efe6d7}
.site-footer .f-bot{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;justify-content:space-between;align-items:center;padding-top:1rem;font-size:10.5px;color:var(--slate-soft)}
.langs{display:flex;gap:.1rem}
.langs button{background:none;border:0;color:var(--slate-soft);font-family:var(--f-sans);font-size:11px;letter-spacing:.1em;padding:.2em .5em;cursor:pointer}
.langs button[aria-current="true"]{color:#fff;border-bottom:1px solid var(--gold)}

/* ---------- sellos de reconocimientos ---------- */
.awards__title{font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin:0 0 18px;text-align:center}
/* Logos reales con fondo transparente, integrados directamente — sin caja ni
   pastilla: se comportan como una fila de marcas, no como fotos pegadas. */
.awards__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:clamp(30px,6vw,72px)}
/* franja propia en el pie: los sellos ya no se apelotonan en la columna del logo */
.f-awards-band{margin-top:clamp(20px,2.6vw,30px);padding-top:clamp(16px,2.2vw,24px);
  border-top:1px solid rgba(255,255,255,.10)}
.f-awards-band .awards__row{gap:clamp(26px,4.6vw,58px)}
.f-awards-band .award-seal{height:clamp(34px,3.6vw,44px)}
/* equilibrio óptico: los sellos verticales piden más alto que los apaisados */
.award-seal[data-seal="tripadvisor"],
.award-seal[data-seal="restaurant-guru"]{height:calc(clamp(52px,7vw,76px) * 1.18)}
.f-awards-band .award-seal[data-seal="tripadvisor"],
.f-awards-band .award-seal[data-seal="restaurant-guru"]{height:calc(clamp(44px,5vw,58px) * 1.22)}
.award-seal[data-seal="gastroranking"],
.award-seal[data-seal="pueblos-magicos"]{height:calc(clamp(52px,7vw,76px) * .8)}
.f-awards-band .award-seal[data-seal="gastroranking"],
.f-awards-band .award-seal[data-seal="pueblos-magicos"]{height:calc(clamp(44px,5vw,58px) * .84)}
/* el rótulo se centra sobre la fila, no colgando a un lado */
.f-awards-band .awards{display:block}
.f-awards-band .awards__title{display:block;width:100%;max-width:none;text-align:center;margin-bottom:clamp(18px,2.4vw,26px)}
.award-seal{display:flex;align-items:center;justify-content:center;
  height:clamp(52px,7vw,76px);transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s ease}
.award-seal img{width:auto;height:100%;max-width:none;object-fit:contain;display:block;
  transition:filter .45s ease,opacity .45s ease}
.award-seal__name{font-family:var(--f-serif);font-size:11.5px;font-weight:600;line-height:1.2;
  letter-spacing:.02em;color:var(--ink-head);text-align:center}

/* Los PNG están en tinta oscura: sobre fondo claro van tal cual y en el pie
   negro se invierten a blanco. Antes eran blancos y desaparecían en /reservar. */
.awards--dark .award-seal img{filter:brightness(0) invert(1);opacity:.66}
.awards--dark .award-seal:hover img{opacity:1}
.awards--light .award-seal img{filter:none;opacity:.9}
.awards--light .award-seal:hover img{opacity:1}
.award-seal:hover{transform:translateY(-3px)}
.awards--light .awards__title{color:var(--gold-deep)}

@media (max-width:640px){
  .awards__row{gap:26px 34px}
  .award-seal{height:44px}
  .f-awards-band .award-seal{height:40px}
  .f-awards-band .awards__row{gap:28px 36px}
  .awards--dark .award-seal img{opacity:.85}
}

/* ---------- pluses de UX: revelado, foco y microinteracción ---------- */
.cta-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center;margin-top:2rem}
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:currentColor;opacity:0;
  transform:translateY(101%);transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s ease}
.btn:hover::after{transform:translateY(0);opacity:.06}
.btn--ghost{border-color:var(--rule);color:var(--ink-soft)}
.btn--ghost:hover{background:var(--ink);border-color:var(--ink);color:#fff}
@media (hover:none){.btn::after{display:none}}
/* objetivos táctiles cómodos en móvil */
@media (max-width:640px){
  .btn{padding:1.15em 1.7em;min-height:48px}
  .cta-row .btn{flex:1 1 100%}
}

/* ---------- cronología (historia) ---------- */
.timeline{list-style:none;margin:0;padding:0;position:relative}
.timeline::before{content:"";position:absolute;left:clamp(52px,7vw,86px);top:8px;bottom:8px;width:1px;
  background:linear-gradient(180deg,transparent,var(--rule) 12%,var(--rule) 88%,transparent)}
.timeline__item{position:relative;display:grid;grid-template-columns:clamp(52px,7vw,86px) 1fr;
  gap:clamp(20px,3vw,38px);padding-block:clamp(20px,3vw,30px)}
.timeline__year{font-family:var(--f-serif);font-weight:600;font-size:clamp(1rem, .9rem + .5vw, 1.25rem);
  color:var(--gold-deep);text-align:right;padding-right:2px;line-height:1.5}
.timeline__body{position:relative;padding-left:clamp(18px,2.4vw,30px)}
.timeline__body::before{content:"";position:absolute;left:-4px;top:.62em;width:9px;height:9px;border-radius:50%;
  background:var(--paper);border:1px solid var(--gold)}
.timeline__body h3{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.15rem, 1rem + .7vw, 1.5rem);margin:0 0 .5rem}
.timeline__body p{color:var(--ink-soft);margin:0;max-width:62ch}
@media (max-width:560px){
  .timeline::before{left:8px}
  .timeline__item{grid-template-columns:1fr;gap:6px;padding-left:30px}
  .timeline__year{text-align:left}
  .timeline__body{padding-left:0}
  .timeline__body::before{left:-26px}
}

/* ---------- banner de cookies ---------- */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:80;background:#0e0c0a;color:#efe6d7;
  border-top:1px solid rgba(239,230,215,.14);animation:cookieIn .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes cookieIn{from{transform:translateY(100%)}to{transform:none}}
.cookie-bar__inner{max-width:1100px;margin:0 auto;padding:16px clamp(20px,5vw,30px);
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:space-between}
.cookie-bar__text{margin:0;font-family:var(--f-sans);font-size:13px;line-height:1.65;
  color:rgba(239,230,215,.82);max-width:64ch}
.cookie-bar__text a{color:var(--gold);border-bottom:1px solid rgba(221,175,95,.5)}
.cookie-bar__actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-bar .btn{padding:.85em 1.5em;font-size:11px}
.cookie-bar .btn--ghost{border-color:rgba(239,230,215,.34);color:rgba(239,230,215,.82)}
.cookie-bar .btn--ghost:hover{background:rgba(239,230,215,.12);border-color:rgba(239,230,215,.6);color:#fff}
.cookie-bar .btn--gold{color:#efe6d7;border-color:var(--gold)}
.cookie-bar .btn--gold:hover{background:var(--gold);color:#0e0c0a}
@media (max-width:640px){
  .cookie-bar__inner{flex-direction:column;align-items:stretch;gap:12px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  .cookie-bar__actions{justify-content:stretch}
  .cookie-bar__actions .btn{flex:1}
  body.has-cookie-bar .action-bar{bottom:auto}
}

/* selector de idioma — discreto, arriba a la derecha de la cabecera */
.lang-switch{position:absolute;top:8px;right:var(--gutter);z-index:1;display:flex;gap:.05rem}
.lang--barra{display:flex;gap:.05rem}
.lang--barra a{background:none;border:0;color:var(--ink-mute);font-family:var(--f-sans);
  font-size:9.5px;font-weight:600;letter-spacing:.08em;padding:.3em .4em;cursor:pointer;
  text-decoration:none;transition:color .25s ease}
.lang--barra a:hover{color:var(--ink-head)}
.lang--barra a.is-actual{color:var(--gold-deep);font-weight:700}
.lang--barra a + a{border-left:1px solid var(--rule)}
@media (max-width:640px){.lang-switch{display:none}}
/* selector dentro del menú móvil */
.lang--lista{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin-top:clamp(16px,4vw,24px);
  padding-top:clamp(14px,3.4vw,20px);border-top:1px solid var(--rule)}
.lang--lista a{font-family:var(--f-sans);font-size:12px;letter-spacing:.06em;color:var(--ink-mute);
  text-decoration:none;transition:color .25s ease}
.lang--lista a:hover{color:var(--ink-head)}
.lang--lista a.is-actual{color:var(--gold-deep);font-weight:600}
.f-legal{display:flex;flex-wrap:wrap;gap:.3rem 1rem}
.f-legal a{color:var(--slate-soft);font-family:var(--f-sans);font-size:11px;letter-spacing:.02em;text-decoration:none;transition:color .3s ease}
.f-legal a:hover{color:var(--gold)}
@media (max-width:760px){.site-footer .f-top{grid-template-columns:1fr 1fr}}


/* ---------- mobile menu + action bar ---------- */
.mobile-menu{position:fixed;inset:0;z-index:60;background:var(--paper);transform:translateY(-100%);
  transition:transform .5s cubic-bezier(.7,0,.2,1);padding:76px var(--gutter) 40px;overflow-y:auto}
.mobile-menu.is-open{transform:none}
/* --- Menú móvil con jerarquía: primero lo que convierte, después navegar,
       y al final, separado, lo secundario. --- */
.mobile-menu{display:flex;flex-direction:column}

/* 1. Acciones */
.mm-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:clamp(24px,5vw,34px)}
.mm-actions__row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mm-btn--ghost{min-height:46px;font-size:11px;border-color:var(--rule);color:var(--ink-soft)}
.mm-btn{display:flex;align-items:center;justify-content:center;min-height:54px;
  font-family:var(--f-sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-head);background:transparent;border:1px solid var(--ink-head);border-radius:2px;
  text-align:center;padding:.6rem .8rem;transition:background .3s ease,color .3s ease}
.mm-btn--gold{min-height:62px;font-size:13.5px;letter-spacing:.16em;
  background:var(--gold);border-color:var(--gold);color:#fff}
.mm-btn--gold:active{background:var(--gold-deep);border-color:var(--gold-deep)}
.mm-btn:active{background:var(--ink-head);color:#fff}

/* 2. Navegación principal: grande, serif, la que se usa de verdad */
.mm-main a,
.mm-main .menu li a{display:block;font-family:var(--f-serif);font-weight:600;
  font-size:clamp(1.25rem, 1.05rem + 1.2vw, 1.55rem);letter-spacing:.05em;line-height:1.2;
  text-transform:uppercase;color:var(--ink-head);padding:1rem 0;border-bottom:1px solid var(--rule)}
.mm-main a:first-of-type,.mm-main .menu li:first-child a{border-top:1px solid var(--rule)}
.mm-main ul{list-style:none;margin:0;padding:0}

/* 3. Separador y bloque secundario, claramente en segundo plano */
.mm-sep{position:relative;text-align:center;margin:clamp(26px,5vw,38px) 0 4px}
.mm-sep::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--rule)}
.mm-sep span{position:relative;background:var(--paper);padding:0 14px;
  font-family:var(--f-sans);font-size:9.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-mute)}
.mm-more{display:flex;flex-wrap:wrap;gap:2px 0}
.mm-more a{display:block;width:100%;font-family:var(--f-sans);font-size:14px;font-weight:500;
  letter-spacing:.02em;text-transform:none;color:var(--ink-soft);padding:.62rem 0;border:0}

.mm-foot{margin-top:auto;padding-top:clamp(26px,5vw,36px)}
.mm-foot p{margin:0 0 .5rem;font-family:var(--f-sans);font-size:12px;line-height:1.7;color:var(--ink-mute)}
.mm-foot a{color:var(--ink-soft)}
.mm-foot a b{color:var(--gold-deep)}
.mm-foot b{color:var(--ink-soft)}
.mobile-menu .mm-close{position:absolute;top:20px;right:16px;background:none;border:0;font-size:1.5rem;cursor:pointer;color:var(--ink)}

.action-bar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:none;grid-template-columns:1.3fr 1fr 1fr;
  background:var(--paper);border-top:1px solid var(--rule)}
.action-bar a{padding:.95rem .4rem;text-align:center;font-family:var(--f-sans);font-size:10px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border-left:1px solid var(--rule)}
.action-bar a:first-child{border-left:0;background:var(--gold);color:#fff}
@media (max-width:1000px){.action-bar{display:grid}body{padding-bottom:48px}}

/* ---------- page hero (inner pages) ---------- */
.page-hero{position:relative;min-height:clamp(340px, 52vh, 460px);display:flex;align-items:center;justify-content:center;
  text-align:center;color:#fff;background:var(--slate);overflow:hidden}
.page-hero .band-media{position:absolute;inset:0}
.page-hero-inner{position:relative;padding:120px 22px 40px}
.page-hero-inner h1{font-family:var(--f-serif);font-weight:700;color:#fff;text-transform:uppercase;
  font-size:clamp(2rem,1.4rem + 2.6vw,3.4rem);letter-spacing:.045em}
.page-hero-inner .sub{display:block;margin-top:.5rem;font-style:italic;font-weight:500;color:rgba(244,239,230,.8);font-size:1.15rem}

.prose{max-width:680px;margin-inline:auto}
.prose h2{font-family:var(--f-serif);font-weight:500;color:#111;font-size:1.6rem;margin:2.4rem 0 .6rem}
.prose h2:first-child{margin-top:0}
.prose p{color:var(--ink-soft)}

/* ---------- /reservar — título + teléfono grande + horario, todo junto ---------- */
.reserve-phone{background:#fff;color:var(--ink);padding:clamp(38px,5.6vw,62px) 0 clamp(40px,6vw,60px);
  border-bottom:1px solid var(--rule)}
.reserve-phone__label{font-family:var(--f-serif);font-weight:700;color:var(--ink-head);text-transform:uppercase;
  letter-spacing:.03em;font-size:clamp(2.2rem,1.6rem + 3vw,3.4rem);margin:0 0 20px}
.reserve-phone__copy{max-width:540px;margin:0 auto 34px;font-family:var(--f-sans);font-size:clamp(16px,14px + .6vw,19px);
  font-weight:500;line-height:1.7;color:var(--ink)}
.reserve-phone__num{display:block;font-family:var(--f-serif);font-weight:700;color:var(--gold-deep);
  font-size:clamp(2.9rem,2rem + 4.4vw,5rem);letter-spacing:.02em;line-height:1}
.reserve-phone__num:hover{color:var(--ink-head)}
.reserve-phone__bold{margin-top:24px;font-family:var(--f-sans);font-size:clamp(15px,13px + .5vw,18px);font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-head)}
.reserve-phone__note{margin-top:16px;font-family:var(--f-sans);font-size:14px;color:var(--ink-mute)}
.reserve-phone__copy--slim{max-width:52ch;margin:clamp(18px,2.4vw,26px) auto 0;font-size:14.5px;font-weight:400;
  line-height:1.7;color:var(--ink-soft)}

/* ---------- /reservar — horario, formato lista dt/dd ---------- */
.horario{max-width:420px;margin:2rem auto 0;display:grid;gap:0}
.horario__row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding:16px 0;border-bottom:1px solid var(--rule)}
.horario__row dt{font-family:var(--f-serif);font-weight:500;font-size:1.05rem;color:var(--ink-head)}
.horario__row dd{margin:0;font-family:var(--f-sans);font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--ink-soft)}
.horario__row--closed dt,.horario__row--closed dd{color:var(--ink-mute)}
.horario--simple{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.reserve-awards{margin-top:clamp(40px,6vw,64px);padding-top:clamp(30px,4vw,44px);border-top:1px solid var(--rule)}

/* ---------- /reservar: reconocimientos gastronómicos y enológicos, arriba y separados ---------- */
.recon{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:clamp(20px,3.4vw,46px);max-width:880px;margin:clamp(24px,3.6vw,40px) auto clamp(2px,1vw,8px)}
.recon__col{display:flex;flex-direction:column;align-items:center;gap:clamp(9px,1.4vw,14px);min-width:0}
.recon__rule{width:1px;align-self:stretch;min-height:96px;background:var(--rule)}
.recon__eyebrow{margin:0;font-family:var(--f-serif);font-style:italic;font-weight:500;color:var(--gold-deep);
  font-size:clamp(13px,12px + .3vw,15.5px)}
.recon__lechazo{width:100%;max-width:430px;height:auto;display:block}
.recon__sellos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:clamp(10px,1.6vw,20px);min-height:clamp(52px,7vw,66px)}
.recon__sellos img{height:clamp(46px,6.2vw,64px);width:auto;display:block}
.recon__pie{margin:0;font-family:var(--f-sans);font-size:11px;letter-spacing:.02em;color:var(--ink-mute);
  line-height:1.55;max-width:40ch}
@media (max-width:720px){
  .recon{grid-template-columns:1fr;gap:clamp(20px,6vw,28px)}
  .recon__rule{width:56%;height:1px;min-height:0;align-self:auto;margin-inline:auto}
  .recon__lechazo{max-width:300px}
  .recon__sellos img{height:42px}
  .recon__pie{font-size:10.5px}
}

.reserve-opiniones{margin-top:clamp(40px,6vw,64px);padding-top:clamp(30px,4vw,44px);border-top:1px solid var(--rule)}
.reserve-opiniones__title{display:flex;align-items:center;justify-content:center;gap:.6em;
  margin:0 0 clamp(20px,2.8vw,32px);font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.4rem,1.05rem + 1.1vw,1.95rem);text-wrap:balance}
.reserve-opiniones__g{display:inline-flex;width:1.05em;height:1.05em;flex:0 0 auto;transition:transform .3s ease}
.reserve-opiniones__g svg{width:100%;height:100%;display:block}
.reserve-opiniones__g:hover{transform:translateY(-2px)}
.opiniones--reservar{max-width:840px;margin-inline:auto}


/* ---------- /reservar en móvil: teléfono + las dos medallas en el primer vistazo ---------- */
@media (max-width:720px){
  .page-intro:has(+ .reserve-phone--top){padding-top:clamp(10px,3vw,18px)}
  .reserve-phone--top{padding-top:clamp(16px,4vw,26px);padding-bottom:clamp(28px,6vw,40px)}
  .reserve-phone--top .reserve-phone__num{font-size:clamp(2.4rem,1.7rem + 6vw,3rem);margin-top:clamp(6px,2vw,12px)}
  .reserve-phone--top .reserve-phone__bold{margin-top:14px;font-size:13px;letter-spacing:.06em}
  .reserve-phone--top .recon{margin-top:clamp(16px,4vw,22px);gap:14px}
  .reserve-phone--top .recon__col{gap:7px}
  .reserve-phone--top .recon__rule{margin-block:2px}
  .reserve-phone--top .recon__eyebrow{font-size:12.5px}
  .reserve-phone--top .recon__lechazo{max-width:270px}
  .reserve-phone--top .recon__sellos{min-height:0;gap:10px}
  .reserve-phone--top .recon__sellos img{height:38px}
  .reserve-phone--top .recon__pie{font-size:10px;line-height:1.4;max-width:34ch}
}
@media (max-width:400px){
  .reserve-phone--top .reserve-phone__num{font-size:2.2rem}
  .reserve-phone--top .recon__lechazo{max-width:240px}
  .reserve-phone--top .recon__sellos img{height:34px}
}

/* =========================================================
   Bodas · Villablanca — hero cinematográfico, showcase editorial y mosaico
   ========================================================= */
.vb-hero{position:relative;min-height:clamp(520px,88svh,860px);display:flex;align-items:flex-end;
  overflow:hidden;background:#0e0c0a;isolation:isolate}
.vb-hero__bg{position:absolute;inset:-8% 0;background-size:cover;background-position:center;
  will-change:transform;animation:vbZoom 14s ease-out both}
@keyframes vbZoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.vb-hero__veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,8,7,.42) 0%,rgba(10,8,7,.06) 32%,rgba(10,8,7,.66) 82%,rgba(10,8,7,.86) 100%)}
.vb-hero__inner{position:relative;z-index:1;width:100%;max-width:var(--container);margin:0 auto;
  padding:0 var(--gutter) clamp(60px,9vw,110px);color:#fff}
.vb-hero__eyebrow{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold);margin:0 0 18px;
  opacity:0;animation:vbUp .9s cubic-bezier(.2,.7,.2,1) .25s both}
.vb-hero__title{font-family:var(--f-serif);font-weight:500;color:#fff;line-height:.96;
  font-size:clamp(3.2rem, 2rem + 7vw, 7rem);letter-spacing:-.01em;margin:0;
  opacity:0;animation:vbUp 1.1s cubic-bezier(.2,.7,.2,1) .38s both}
.vb-hero__sub{font-family:var(--f-serif);font-style:italic;font-weight:500;color:rgba(255,255,255,.9);
  font-size:clamp(1.05rem, .95rem + .8vw, 1.6rem);margin:.7rem 0 0;
  opacity:0;animation:vbUp 1.1s cubic-bezier(.2,.7,.2,1) .52s both}
@keyframes vbUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.vb-hero__scroll{position:absolute;left:50%;bottom:26px;z-index:1;width:1px;height:52px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.75));transform:translateX(-50%);
  animation:vbScroll 2.4s ease-in-out infinite}
@keyframes vbScroll{0%,100%{opacity:.25;transform:translateX(-50%) scaleY(.6)}50%{opacity:1;transform:translateX(-50%) scaleY(1)}}
@media (prefers-reduced-motion:reduce){
  .vb-hero__bg,.vb-hero__eyebrow,.vb-hero__title,.vb-hero__sub,.vb-hero__scroll{animation:none;opacity:1}
}

/* --- showcase: foto grande + texto, alternando, con recorte editorial --- */
.showcase{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;
  gap:clamp(28px,5vw,80px);padding-block:clamp(30px,4vw,66px);
  max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.showcase--rev .showcase__media{order:2}
.showcase__media{position:relative;overflow:hidden;border-radius:2px}
.showcase__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;display:block;
  transform:scale(1.001);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.showcase__media:hover img{transform:scale(1.045)}
.showcase__body h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.7rem, 1.2rem + 2.1vw, 2.9rem);line-height:1.12;margin:0 0 1.1rem}
.showcase__body p{color:var(--ink-soft);max-width:52ch;font-size:15.5px;line-height:1.9}

/* --- mosaico de 3 fotos, una alta --- */
.mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.8vw,22px);align-items:stretch}
.mosaic__item{margin:0;overflow:hidden;border-radius:2px}
.mosaic__item img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;display:block;
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.mosaic__item--tall{grid-row:span 1}
.mosaic__item:hover img{transform:scale(1.05)}
/* mismo fundido editorial que el resto de fotos del sitio: se funde en el papel, no se corta en seco */
.mosaic__item img{
  -webkit-mask-image:linear-gradient(to bottom,#000 56%,rgba(0,0,0,.5) 80%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 56%,rgba(0,0,0,.5) 80%,transparent 100%)}

@media (max-width:860px){
  .showcase{grid-template-columns:1fr;gap:clamp(20px,4vw,32px);padding-block:clamp(40px,7vw,64px)}
  .showcase--rev .showcase__media{order:0}
  .showcase__media img{aspect-ratio:3/2}
  .showcase__body h2 br{content:"";display:inline}
  .showcase__body h2 br::after{content:" "}
}
@media (max-width:640px){
  .vb-hero{min-height:clamp(440px,72svh,620px)}
  .vb-hero__inner{padding-bottom:clamp(38px,10vw,64px)}
  .vb-hero__scroll{display:none}
  /* mosaico: carrusel deslizable de una foto por pantalla */
  .mosaic{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
    -ms-overflow-style:none;scrollbar-width:none;
    margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
  .mosaic::-webkit-scrollbar{display:none}
  .mosaic__item{flex:0 0 78%;scroll-snap-align:center}
  .mosaic__item img{aspect-ratio:4/5}
}

/* hero de /catas/ — la foto es vertical y muy rica en detalle: encuadre a la
   derecha para que el bodegón de botellas no quede tapado por el texto */
.vb-hero--catas .vb-hero__bg{background-position:center 42%}
.vb-hero__cta{margin:2rem 0 0;opacity:0;animation:vbUp 1.1s cubic-bezier(.2,.7,.2,1) .66s both}
.vb-hero__title br{display:block}
@media (max-width:640px){
  .vb-hero--catas .vb-hero__bg{background-position:60% 38%}
  .vb-hero__cta .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.vb-hero__cta{animation:none;opacity:1}}

/* ---------- El sueño de Eladio ---------- */
.eladio-hero{position:relative;background:#fff;overflow:hidden;
  display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:clamp(24px,4vw,64px);
  max-width:var(--container);margin-inline:auto;padding:clamp(40px,6vw,84px) var(--gutter) clamp(30px,4vw,60px)}
.eladio-hero--sinfoto{grid-template-columns:1fr;max-width:820px;text-align:center}

/* palabra editorial gigante detrás del retrato */
.eladio-hero__word{position:absolute;right:calc(var(--gutter) * -.6);top:50%;transform:translateY(-56%);
  font-family:var(--f-serif);font-weight:500;letter-spacing:-.02em;line-height:.8;
  font-size:clamp(7rem, 3rem + 13vw, 15.5rem);color:#f4f1ea;pointer-events:none;user-select:none;z-index:0;
  white-space:nowrap}

.eladio-hero__body{position:relative;z-index:2}

/* retrato recortado sobre blanco */
.eladio-hero__media{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:center;
  min-height:clamp(380px,58svh,660px)}
.eladio-hero__halo{position:absolute;inset:auto 0 6%;height:86%;z-index:0;pointer-events:none;
  background:radial-gradient(58% 62% at 50% 46%, rgba(191,157,86,.20) 0%, rgba(191,157,86,.07) 42%, rgba(255,255,255,0) 72%);
  opacity:0;transform:scale(.86);transition:opacity 1.5s ease, transform 1.8s cubic-bezier(.16,1,.3,1)}
.eladio-hero__ground{display:none}
.eladio-hero__cut{position:relative;z-index:1;display:block;width:auto;max-width:100%;
  height:clamp(360px,56svh,640px);object-fit:contain;object-position:bottom center;
  opacity:0;transform:translateY(34px) scale(1.03);
  transition:opacity 1.15s cubic-bezier(.16,1,.3,1), transform 1.35s cubic-bezier(.16,1,.3,1);
  -webkit-mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%);
  -webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;
  mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%);
  mask-size:100% 100%;mask-repeat:no-repeat;mask-mode:alpha}
@keyframes elHalo{to{opacity:1;transform:scale(1)}}
@keyframes elGround{to{opacity:1;transform:translateX(-50%) scaleX(1)}}
@keyframes elCut{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes elWord{from{opacity:0;transform:translateY(-56%) translateX(26px)}to{opacity:1;transform:translateY(-56%) translateX(0)}}
.eladio-hero__halo{animation:elHalo 1.6s cubic-bezier(.16,1,.3,1) .15s both}
.eladio-hero__ground{animation:elGround 1.3s cubic-bezier(.16,1,.3,1) .5s both}
.eladio-hero__cut{animation:elCut 1.3s cubic-bezier(.16,1,.3,1) .28s both}
.eladio-hero__word{animation:elWord 1.6s cubic-bezier(.16,1,.3,1) .05s both}
@media (prefers-reduced-motion:reduce){
  .eladio-hero__halo,.eladio-hero__ground,.eladio-hero__cut,.eladio-hero__word{animation:none;opacity:1;transform:none}
  .eladio-hero__ground{transform:translateX(-50%)}
  .eladio-hero__word{transform:translateY(-56%)}
}

.eladio-hero__firma{display:block;font-family:var(--f-serif);font-style:italic;font-weight:500;
  color:var(--gold-deep);font-size:clamp(1.05rem, .9rem + .6vw, 1.4rem);margin-top:1.8rem}
.eladio-hero__firma small{display:block;font-family:var(--f-sans);font-style:normal;font-size:10.5px;
  font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:.5rem}
.eladio-hero__title{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.02;
  font-size:clamp(2.6rem, 1.7rem + 4.2vw, 5rem);margin:0 0 1.4rem;letter-spacing:-.005em}
.eladio-hero__lede{font-size:clamp(16px, 15px + .4vw, 19px);line-height:1.85;color:var(--ink-soft);max-width:46ch}
.eladio-hero--sinfoto .eladio-hero__lede{margin-inline:auto}
.eladio-cap{padding-block:clamp(26px,3.4vw,42px);border-top:1px solid var(--rule)}
.eladio-cap:first-child{border-top:0;padding-top:0}
.eladio-cap h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.4rem, 1.1rem + 1.3vw, 2.1rem);margin:0 0 .8rem;line-height:1.16}
.eladio-cap p{color:var(--ink-soft);margin:0;font-size:15.5px;line-height:1.9}
.eladio-quote{margin:0 0 2.2rem;padding:0}
.eladio-quote p{font-family:var(--f-serif);font-style:italic;font-weight:500;color:var(--ink-head);
  font-size:clamp(1.3rem, 1.05rem + 1.4vw, 2.05rem);line-height:1.35;margin:0 0 1rem;text-wrap:balance}
.eladio-quote cite{font-family:var(--f-sans);font-style:normal;font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
@media (max-width:860px){
  .eladio-hero{grid-template-columns:1fr;text-align:center;padding-top:clamp(26px,5vw,48px);gap:0}
  .eladio-hero__body{order:1}
  .eladio-hero__media{order:2;min-height:0;margin-top:clamp(18px,4vw,32px)}
  .eladio-hero__cut{height:clamp(330px,52svh,470px)}
  .eladio-hero__word{display:none}
  .eladio-hero__lede{margin-inline:auto}
  .eladio-hero__firma{margin-top:1.2rem}
}

/* ---------- /catas: precio y ventajas en un solo bloque editorial ----------
   Un único momento para el 25 € y el 10 %: panel enmarcado en oro sobre la
   palabra gigante, el mismo lenguaje del recorte de Eladio y las fichas. */
.oferta{position:relative;overflow:hidden;background:var(--paper);
  padding-block:clamp(52px,7vw,100px)}
.oferta__ghost{position:absolute;left:50%;top:clamp(2px,1.4vw,26px);transform:translateX(-50%);
  font-family:var(--f-serif);font-weight:600;color:#f4f1ea;line-height:.76;
  font-size:clamp(7rem,21vw,19rem);letter-spacing:-.03em;text-transform:uppercase;
  white-space:nowrap;pointer-events:none;user-select:none;z-index:0}
.oferta > .container{position:relative;z-index:1}
.oferta__grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(24px,4vw,68px);align-items:center}
.oferta__panel{background:var(--paper);border:1px solid var(--gold);text-align:center;
  padding:clamp(26px,3.2vw,42px) clamp(20px,2.8vw,36px);
  box-shadow:0 28px 64px -36px rgba(26,22,18,.45)}
.oferta__eyebrow{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-deep);margin:0}
.oferta__precio{display:flex;align-items:flex-start;justify-content:center;gap:.1em;margin:.45rem 0 0;
  font-family:var(--f-serif);color:var(--ink-head);line-height:.86}
.oferta__num{font-size:clamp(4.2rem,3rem + 6vw,7rem);font-weight:600;letter-spacing:-.035em}
.oferta__eur{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.3rem);font-weight:500;color:var(--gold-deep);margin-top:.3em}
.oferta__persona{margin:.55rem 0 0;font-family:var(--f-sans);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-mute)}
.oferta__lista{list-style:none;margin:clamp(20px,2.6vw,30px) 0 0;padding:0;
  border-top:1px solid var(--rule);text-align:left}
.oferta__lista li{position:relative;padding:.7rem 0 .7rem 1.55rem;border-bottom:1px solid var(--rule);
  color:var(--ink-soft);font-size:14px;line-height:1.5}
.oferta__lista li::before{content:"";position:absolute;left:.2rem;top:1.15rem;width:6px;height:6px;
  border:1px solid var(--gold);transform:rotate(45deg)}
.oferta__panel .btn{margin-top:clamp(20px,2.6vw,28px);width:100%;justify-content:center}
.oferta__nota{margin:.85rem 0 0;font-size:11.5px;color:var(--ink-mute);line-height:1.6}
.oferta__h2{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.1;
  font-size:clamp(1.6rem,1.15rem + 2.2vw,2.6rem);margin:.55rem 0 1rem;letter-spacing:-.004em}
.oferta__intro{color:var(--ink-soft);font-size:clamp(14.5px,14px + .35vw,16.5px);line-height:1.85;margin:0;max-width:46ch}
.oferta__ventajas{list-style:none;margin:clamp(22px,3vw,34px) 0 0;padding:0;display:grid;gap:clamp(16px,2.2vw,24px)}
.oferta__ventajas li{display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2.4vw,28px);align-items:start;
  border-top:1px solid var(--rule);padding-top:clamp(16px,2.2vw,24px)}
.oferta__pct{font-family:var(--f-serif);font-weight:500;color:var(--gold);line-height:.88;
  font-size:clamp(2.2rem,1.6rem + 2.4vw,3.4rem);letter-spacing:-.025em}
.oferta__pct small{font-size:.42em;vertical-align:top;margin-left:.03em}
.oferta__ventajas h3{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);
  font-size:clamp(1.05rem,1rem + .5vw,1.35rem);margin:0 0 .45rem}
.oferta__ventajas p{color:var(--ink-soft);font-size:14.5px;line-height:1.75;margin:0 0 .65rem}
@media (max-width:900px){
  .oferta__grid{grid-template-columns:1fr;gap:clamp(26px,6vw,44px)}
  .oferta__ghost{font-size:clamp(6rem,33vw,12rem)}
  .oferta__ventajas li{gap:14px}
}
@media (max-width:520px){
  .oferta__lista li{font-size:13.5px}
  .oferta__ventajas p{font-size:13.5px}
}

/* ---------- párrafos y botón dentro de un bloque .relato ---------- */
.relato__body p + p{margin-top:1rem}
.relato__cta{margin-top:clamp(20px,2.6vw,32px)}
@media (max-width:820px){
  .relato__body p + p{margin-top:.7rem}
  .relato__cta{margin-top:clamp(16px,3.4vw,24px)}
  .relato__cta .btn{width:100%;justify-content:center}
}

/* ---------- /eventos ---------- */
.vb-hero--eventos .vb-hero__bg{background-position:center 46%}
.vb-hero--eventos .vb-hero__veil{background:linear-gradient(180deg,rgba(10,11,14,.34) 0%,rgba(10,11,14,.20) 40%,rgba(10,11,14,.62) 100%)}
.vb-hero--eventos .vb-hero__sub{max-width:46ch;margin-inline:auto}
@media (max-width:760px){.vb-hero--eventos .vb-hero__bg{background-position:center 40%}}
/* formulario corto: dos datos y a la calle */
form.rf--corto{max-width:520px}
form.rf--corto textarea{resize:vertical}

/* ---------- apertura de página sin hero: titular junto a la foto ---------- */
.relato--intro{padding-top:clamp(26px,4vw,58px)}
.relato__body h1{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.06;
  font-size:clamp(1.9rem,1.3rem + 2.8vw,3.3rem);margin:0 0 1.2rem;letter-spacing:-.008em}
@media (max-width:820px){
  .relato--intro{padding-top:0}
  .relato__body h1{font-size:clamp(1.7rem,1.2rem + 2.6vw,2.3rem);margin-bottom:.8rem}
}

/* ---------- índice de celebraciones: una tarjeta por tipo de evento ---------- */
.celebra{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.6vw,34px);
  margin-top:clamp(30px,4.2vw,56px)}
.celebra__card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--rule);
  text-decoration:none;color:inherit;overflow:hidden;
  transition:border-color .35s ease,transform .55s cubic-bezier(.16,1,.3,1),box-shadow .45s ease}
.celebra__card:hover{border-color:var(--gold);transform:translateY(-4px);
  box-shadow:0 26px 52px -34px rgba(26,22,18,.45)}
.celebra__media{position:relative;display:block;overflow:hidden;aspect-ratio:4/3}
.celebra__media img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.celebra__card:hover .celebra__media img{transform:scale(1.05)}
/* la foto se funde en el papel de la tarjeta, no se corta en seco */
.celebra__media::after{content:"";position:absolute;inset:auto 0 -1px;height:40%;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.38) 42%,rgba(255,255,255,.88) 76%,var(--paper) 96%)}
.celebra__body{display:flex;flex-direction:column;gap:.5rem;flex:1;margin-top:0;
  padding:clamp(10px,1.4vw,18px) clamp(18px,2.2vw,26px) clamp(20px,2.4vw,28px)}
/* el protagonista de la ficha es la PALABRA del evento; el titular y el texto
   viven debajo, con menos peso */
.celebra__nombre{font-family:var(--f-serif);font-weight:600;color:var(--ink-head);
  font-size:clamp(1.7rem,1.25rem + 1.9vw,2.6rem);line-height:1;letter-spacing:-.015em;
  text-transform:uppercase}
.celebra__title{font-family:var(--f-serif);font-style:italic;font-weight:500;color:var(--gold-deep);
  line-height:1.3;font-size:clamp(.95rem,.9rem + .35vw,1.12rem);margin-top:-.1rem}
.celebra__copy{color:var(--ink-soft);font-size:14px;line-height:1.7;flex:1}
.celebra__mas{display:inline-flex;align-items:center;gap:.6em;margin-top:.4rem;
  font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-deep)}
.celebra__mas::after{content:"";width:22px;height:1px;background:currentColor;transition:width .35s ease}
.celebra__card:hover .celebra__mas::after{width:36px}
@media (max-width:900px){
  .celebra{grid-template-columns:repeat(2,1fr)}
  /* el titular no puede caer sobre el degradado: el texto arranca ya en papel */
  .celebra__media::after{height:44%;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.34) 40%,rgba(255,255,255,.86) 74%,var(--paper) 96%)}
  .celebra__body{padding-top:clamp(8px,1.8vw,14px)}
}
@media (max-width:560px){
  .celebra{grid-template-columns:1fr;gap:clamp(16px,4vw,24px)}
  .celebra__media{aspect-ratio:16/10}
  .celebra__media::after{height:38%}
  .celebra__copy{font-size:13.5px}
  .celebra__nombre{font-size:clamp(1.8rem,1.2rem + 4.4vw,2.4rem)}
}

/* ---------- encabezado editorial de página (sustituye a los hero de banda) ----------
   Ningún hero a pantalla completa fuera de la portada: la página se presenta
   en un bloque compacto y el contenido real empieza sin hacer scroll. */
.page-intro{max-width:var(--container);margin-inline:auto;
  padding:clamp(26px,3.6vw,52px) var(--gutter) 0}
.page-intro__cap{max-width:62ch;margin-inline:auto;text-align:center}
.page-intro__eyebrow{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-deep);margin:0}
.page-intro h1{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.06;
  font-size:clamp(1.95rem,1.35rem + 3.1vw,3.5rem);letter-spacing:-.01em;margin:.7rem 0 0}
.page-intro__sub{font-family:var(--f-serif);font-style:italic;font-weight:500;color:var(--ink-soft);
  font-size:clamp(1.02rem,.94rem + .6vw,1.38rem);line-height:1.5;margin:.85rem 0 0;text-wrap:balance}
.page-intro__rule{display:block;width:88px;height:1px;background:var(--gold);margin:clamp(20px,2.4vw,30px) auto 0}
.page-intro__cta{margin:clamp(20px,2.6vw,30px) 0 0}
.page-intro__media{position:relative;overflow:hidden;margin-top:clamp(24px,3.2vw,44px)}
.page-intro__media img{width:100%;height:auto;display:block;aspect-ratio:21/9;object-fit:cover;
  transform:scale(1.04);transition:transform 1.5s cubic-bezier(.16,1,.3,1)}
.page-intro__media.is-visible img{transform:scale(1)}
/* la foto se funde en el papel por abajo: nunca un rectángulo cortado en seco */
.page-intro__media::after{content:"";position:absolute;inset:auto 0 -1px;height:30%;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.42) 48%,var(--paper) 92%)}
.page-intro + .section,
.page-intro + .relato,
.page-intro + .showcase{padding-top:clamp(22px,3vw,42px)}
@media (max-width:760px){
  .page-intro{padding-top:clamp(18px,4vw,30px)}
  .page-intro__media img{aspect-ratio:16/9}
}

/* ---------- precio a la vista desde el primer impacto (/catas) ---------- */
.precio-flash{display:flex;align-items:center;gap:clamp(14px,2vw,22px);
  margin:0 0 clamp(16px,2.2vw,24px) !important}
.precio-flash__num{flex:0 0 auto;font-family:var(--f-serif);font-weight:600;color:var(--ink-head);
  line-height:.84;font-size:clamp(2.7rem,1.9rem + 3vw,4.1rem);letter-spacing:-.035em}
.precio-flash__num small{font-size:.4em;font-weight:500;color:var(--gold-deep);vertical-align:top;margin-left:.06em}
.precio-flash__txt{display:flex;flex-direction:column;gap:.3rem;
  padding-left:clamp(14px,2vw,22px);border-left:1px solid var(--rule);
  font-family:var(--f-sans);font-size:12.5px;line-height:1.6;color:var(--ink-mute);text-transform:none;letter-spacing:0}
.precio-flash__txt b{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-deep)}
@media (max-width:520px){
  .precio-flash__txt{font-size:12px}
  .precio-flash__num{font-size:clamp(2.4rem,1.6rem + 5vw,3.2rem)}
}

/* ---------- ritmo vertical entre bloques ----------
   El hueco entre dos secciones era la SUMA del padding de las dos (hasta 200 px
   en /catas). Aquí se recorta el de abajo del primero y el de arriba del
   segundo, para que la separación sea una sola respiración. */
.relato + .cellar,
.showcase + .cellar,
.cellar + .section,
.oferta + .section,
.section + .section{padding-top:clamp(20px,2.7vw,38px)}
.medallas-tira + .cellar,
.cellar + .relato,
.cellar + .showcase{padding-top:clamp(20px,2.7vw,38px)}
.cellar + .oferta,
.relato + .oferta,
.showcase + .oferta,
.section + .oferta,
.section--alt + .section{padding-top:clamp(24px,3.2vw,46px)}
@supports selector(:has(*)){
  .relato:has(+ .cellar),
  .relato:has(+ .oferta),
  .relato:has(+ .section),
  .showcase:has(+ .cellar),
  .showcase:has(+ .oferta),
  .cellar:has(+ .oferta),
  .cellar:has(+ .section),
  .oferta:has(+ .section),
  .section:has(+ .section){padding-bottom:clamp(20px,2.7vw,38px)}
  .section:has(+ .showcase),
  .showcase:has(+ .section),
  .relato:has(+ .showcase),
  .showcase:has(+ .relato),
  .relato:has(+ .section),
  .medallas-tira:has(+ .cellar),
  .cellar:has(+ .relato),
  .cellar:has(+ .showcase){padding-bottom:clamp(20px,2.7vw,40px)}
  /* dos relatos seguidos: la foto del siguiente no necesita 100 px de aire */
  .relato:has(+ .relato){padding-bottom:clamp(26px,3.4vw,58px)}
}

/* ---------- índice de celebraciones: apertura sin foto ----------
   La portada de /eventos/ no puede llevar la foto de un tipo concreto de
   celebración: da paso a todas con un índice de texto. */
.page-intro--indice{padding-bottom:0}
.indice-eventos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:.5rem clamp(14px,2.2vw,26px);margin:clamp(22px,3vw,34px) auto 0;max-width:70ch}
.indice-eventos a{position:relative;font-family:var(--f-sans);font-size:11px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink-mute);padding-bottom:.35rem;
  transition:color .3s ease}
.indice-eventos a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1px;
  background:var(--gold);transform:translateX(-50%);transition:width .35s cubic-bezier(.16,1,.3,1)}
.indice-eventos a:hover{color:var(--ink-head)}
.indice-eventos a:hover::after{width:100%}
.indice-eventos a + a::before{content:"";position:absolute;left:calc(clamp(14px,2.2vw,26px) / -2);
  top:50%;width:3px;height:3px;border-radius:50%;background:var(--gold);opacity:.55;transform:translateY(-50%)}
@media (max-width:520px){
  .indice-eventos{gap:.45rem 14px}
  .indice-eventos a{font-size:10px;letter-spacing:.16em}
  .indice-eventos a + a::before{left:-8px}
}

/* ---------- la boda encabeza la rejilla a lo ancho; debajo, el resto en 2x2 ---------- */
.celebra{grid-template-columns:repeat(2,1fr)}
.celebra__card--principal{grid-column:1 / -1;flex-direction:row;align-items:stretch}
.celebra__card--principal .celebra__media{flex:0 0 54%;aspect-ratio:auto;min-height:clamp(260px,30vw,400px)}
.celebra__card--principal .celebra__media::after{inset:0 -1px 0 auto;width:34%;height:auto;
  background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.4) 46%,var(--paper) 94%)}
.celebra__card--principal .celebra__body{justify-content:center;margin-top:0;
  padding:clamp(24px,3.2vw,44px) clamp(24px,3.2vw,44px) clamp(24px,3.2vw,44px) clamp(6px,1vw,14px)}
.celebra__card--principal .celebra__nombre{font-size:clamp(2.2rem,1.5rem + 2.8vw,3.6rem)}
.celebra__card--principal .celebra__title{font-size:clamp(1.05rem,.95rem + .55vw,1.3rem)}
.celebra__card--principal .celebra__copy{font-size:15px;max-width:48ch}
@media (max-width:760px){
  .celebra__card--principal{flex-direction:column}
  .celebra__card--principal .celebra__media{flex:none;aspect-ratio:16/10;min-height:0}
  .celebra__card--principal .celebra__media::after{inset:auto 0 -1px;width:auto;height:44%;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.34) 40%,rgba(255,255,255,.86) 74%,var(--paper) 96%)}
  .celebra__card--principal .celebra__body{padding:clamp(6px,1.6vw,12px) clamp(18px,2.2vw,26px) clamp(20px,2.4vw,28px)}
  .celebra__card--principal .celebra__copy{font-size:14px}
}
@media (max-width:560px){
  .celebra{grid-template-columns:1fr}
  /* la boda sigue mandando también en móvil */
  .celebra__card--principal .celebra__nombre{font-size:clamp(2.2rem,1.5rem + 5.6vw,3rem)}
}

/* ---------- índice del diario ---------- */
.news-card__fecha{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-deep)}
.news-card__titulo{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.18;
  font-size:clamp(1.1rem,1rem + .6vw,1.35rem);margin:0}
.news-card__extracto{color:var(--ink-soft);font-size:14px;line-height:1.7;flex:1;margin:0}
.news-card__mas{display:inline-flex;align-items:center;gap:.6em;font-family:var(--f-sans);font-size:10.5px;
  font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep)}
.news-card__mas::after{content:"";width:22px;height:1px;background:currentColor;transition:width .35s ease}
.news-card:hover .news-card__mas::after{width:34px}
.paginacion{margin-top:clamp(24px,3.4vw,40px);text-align:center}
.paginacion .page-numbers{font-family:var(--f-sans);font-size:12px;letter-spacing:.06em;color:var(--ink-mute);
  padding:.5em .8em;text-decoration:none}
.paginacion .page-numbers.current{color:var(--gold-deep);font-weight:700}
@media (max-width:900px){.news-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.news-grid{grid-template-columns:1fr}}

/* ---------- fotos en las páginas heredadas del prototipo (equipo, espacios) ---------- */
.equipo-foto{position:relative;overflow:hidden;background:var(--paper)}
.equipo-foto img{width:100%;height:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.equipo-solo-texto{max-width:66ch}
@media (max-width:820px){.equipo-foto img{aspect-ratio:16/10}}

/* =============================================================================
   PORTADA — la fachada, sin comerse la pantalla
   El titular y la bajada viven en el cielo (el espacio negativo de la foto) y
   los dos botones abajo. Alto contenido a propósito: deja ver que hay más.
   ========================================================================== */
.hf{position:relative;overflow:hidden;background:var(--slate);
  height:clamp(430px,72svh,660px)}
@media (min-width:1001px){.hf{height:clamp(480px,76svh,780px)}}
.hf__foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  object-position:center 26%;
  animation:hfRespira 26s ease-in-out infinite alternate}
@keyframes hfRespira{from{transform:scale(1.005)}to{transform:scale(1.055)}}
.hf__velo{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,11,14,.56) 0%,rgba(10,11,14,.26) 26%,
    rgba(10,11,14,.10) 48%,rgba(10,11,14,.34) 74%,rgba(10,11,14,.74) 100%)}

/* el texto, en el cielo */
.hf__cap{position:absolute;left:0;right:0;top:0;z-index:2;text-align:center;color:#fff;
  padding:clamp(30px,7svh,72px) var(--gutter) 0;
  max-width:min(92vw,860px);margin-inline:auto}
.hf__titulo{font-family:var(--f-serif);font-weight:500;color:#fff;text-transform:uppercase;
  font-size:clamp(1.85rem,1rem + 4.4vw,4.2rem);line-height:1.02;letter-spacing:.02em;margin:0;
  text-shadow:0 2px 22px rgba(8,9,12,.5)}
.hf__claim{font-family:var(--f-serif);font-style:italic;font-weight:500;color:rgba(255,255,255,.92);
  font-size:clamp(.98rem,.9rem + .65vw,1.4rem);line-height:1.45;
  margin:clamp(10px,1.8svh,18px) auto 0;max-width:30ch;text-wrap:balance;
  text-shadow:0 1px 16px rgba(8,9,12,.5)}

/* los botones y los datos, abajo */
.hf__pie{position:absolute;left:0;right:0;bottom:0;z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2.2svh,20px);
  padding:0 var(--gutter) clamp(14px,2.6svh,26px)}
.hf__cta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%}
.hf__cta .btn{min-width:186px;justify-content:center;backdrop-filter:blur(2px)}
.hf__datos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.25rem .7rem;
  font-family:var(--f-sans);font-size:clamp(10.5px,.68vw + 8px,12.5px);letter-spacing:.05em;
  color:rgba(255,255,255,.8);text-align:center}
.hf__datos b{color:#fff;font-weight:600}
.hf__datos a{color:rgba(255,255,255,.8);transition:color .3s ease}
.hf__datos a:hover{color:var(--gold)}
.hf__datos .sep{opacity:.4}
.hf__estado.esta-abierto b{color:#a8e0bd}

@media (max-width:760px){
  .hf__cta{flex-direction:column;align-items:center}
  .hf__cta .btn{width:min(100%,300px);min-width:0}
  .hf__datos{gap:.2rem .5rem;font-size:10.5px;line-height:1.5}
  .hf__datos .sep{display:none}
  .hf__datos > span,.hf__datos > a{flex:0 0 100%}
  .hf__datos > a:last-child{display:none}
}
@media (prefers-reduced-motion:reduce){.hf__foto{animation:none}}

/* ---------- pista de que sigue habiendo cosa abajo ----------
   Un filete vertical dorado por el que cae una gota de luz. Sin palabras:
   se entiende solo y no añade texto a una portada que queremos limpia. */
.pista-abajo{display:block;position:relative;width:1px;overflow:hidden;
  height:clamp(34px,5.5vh,58px);margin:clamp(16px,3vh,28px) auto 0;
  background:linear-gradient(180deg,rgba(191,157,86,.42),rgba(191,157,86,0))}
.pista-abajo::after{content:"";position:absolute;left:0;top:0;width:1px;height:42%;
  background:linear-gradient(180deg,rgba(191,157,86,0),var(--gold-deep));
  animation:pistaCae 2.6s cubic-bezier(.45,0,.25,1) infinite}
@keyframes pistaCae{
  0%{transform:translateY(-110%);opacity:0}
  22%{opacity:1}
  70%{opacity:1}
  100%{transform:translateY(255%);opacity:0}
}
@media (prefers-reduced-motion:reduce){.pista-abajo::after{animation:none;opacity:.7}}

/* ---------- preguntas frecuentes ----------
   Texto siempre visible, a dos columnas en pantalla ancha. Sin acordeón: lo
   que va plegado lo extraen peor los buscadores y los asistentes de IA. */
.faq{display:grid;grid-template-columns:1fr;gap:0;
  margin-top:clamp(22px,3vw,36px);max-width:min(100%,980px);margin-inline:auto}
@media (min-width:860px){.faq{grid-template-columns:1fr 1fr;column-gap:clamp(30px,4vw,64px)}}
.faq__item{padding:clamp(16px,2.2vw,22px) 0;border-top:1px solid var(--rule)}
.faq__p{font-family:var(--f-serif);font-weight:500;color:var(--ink-head);line-height:1.3;
  font-size:clamp(1rem,.95rem + .35vw,1.15rem);margin:0 0 .5rem}
.faq__r{color:var(--ink-soft);font-size:clamp(14px,13.6px + .2vw,15px);line-height:1.75;margin:0}
.faq__aviso{max-width:min(100%,980px);margin:clamp(18px,2.6vw,28px) auto 0;
  padding-top:clamp(14px,2vw,18px);border-top:1px solid var(--rule);
  font-family:var(--f-sans);font-size:11.5px;line-height:1.7;color:var(--ink-mute);text-align:center}
.faq__aviso a{color:var(--gold-deep);text-decoration:underline}

/* ---------- panel de datos de la finca (/bodega/) ---------- */
.datos-finca{list-style:none;margin:clamp(20px,3vw,32px) auto 0;padding:0;
  display:grid;grid-template-columns:1fr;gap:1px;background:var(--rule);
  border:1px solid var(--rule);max-width:min(100%,900px)}
@media (min-width:700px){.datos-finca{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.datos-finca{grid-template-columns:repeat(3,1fr)}}
.datos-finca li{background:var(--paper);padding:clamp(18px,2.4vw,26px);
  display:flex;flex-direction:column;gap:.4rem}
.datos-finca b{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-deep)}
.datos-finca span{color:var(--ink-soft);font-size:14px;line-height:1.65}
.aviso-idioma-legal{max-width:var(--container);margin:clamp(14px,2.4vw,22px) auto 0;
  padding:.9rem 1.1rem;background:var(--paper-alt);border:1px solid var(--rule);
  font-family:var(--f-sans);font-size:12.5px;line-height:1.6;color:var(--ink-soft);text-align:center}
.aviso-idioma-legal a{color:var(--gold-deep);text-decoration:underline}

/* ---------- Diario: tarjetas con foto, ficha de entrada y relacionadas ---------- */
.news-card--foto{padding:0;overflow:hidden}
.news-card__foto{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--paper-alt)}
.news-card__foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .6s cubic-bezier(.16,1,.3,1)}
.news-card--foto:hover .news-card__foto img{transform:scale(1.04)}
.news-card--foto .news-card__fecha,
.news-card--foto .news-card__titulo,
.news-card--foto .news-card__extracto,
.news-card--foto .news-card__mas{margin-inline:26px}
.news-card--foto .news-card__fecha{margin-top:22px}
.news-card--foto .news-card__mas{margin-bottom:26px}

.entrada__fechas{font-family:var(--f-sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-mute);margin:0 0 1.8rem;padding-bottom:1.1rem;border-bottom:1px solid var(--rule)}
.prose img{display:block;width:100%;height:auto;margin:2rem 0;border-radius:2px}
.prose ul,.prose ol{color:var(--ink-soft);max-width:680px;padding-left:1.2em;line-height:1.8}
.prose li{margin:.35em 0}
.prose h3{font-family:var(--f-serif);font-weight:500;color:#111;font-size:1.2rem;margin:1.8rem 0 .5rem}
.prose a{color:var(--ink-head);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--gold)}

.relacionadas{max-width:680px;margin:3.4rem auto 0;padding-top:2rem;border-top:1px solid var(--rule)}
.relacionadas__t{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-mute);margin:0 0 1.2rem}
.relacionadas__lista{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.relacionadas__item{display:flex;flex-direction:column;gap:.6rem;text-decoration:none}
.relacionadas__foto{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--paper-alt)}
.relacionadas__foto img{width:100%;height:100%;object-fit:cover;display:block}
.relacionadas__fecha{display:block;font-family:var(--f-sans);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-mute);margin-bottom:.25rem}
.relacionadas__titulo{font-family:var(--f-serif);font-size:.98rem;line-height:1.3;color:var(--ink-head)}
.relacionadas__item:hover .relacionadas__titulo{color:var(--gold-dark,#8a6f2e)}
@media (max-width:600px){
  .relacionadas__lista{grid-template-columns:1fr;gap:14px}
  .relacionadas__item{flex-direction:row;align-items:center;gap:14px}
  .relacionadas__foto{flex:0 0 88px;aspect-ratio:1}
}

/* ================= PIE — tres columnas, al estilo del de Ambivium =================
   Fila 1: marca y redes · datos de contacto (centrados) · sellos de los vinos.
   Fila 2: legal · navegación · sellos de restaurante. Debajo, el copyright.
   En móvil todo se apila centrado, en el mismo orden de lectura.
   Las reglas antiguas (.f-top, .f-logo, .f-social…) ya no encuentran marcado;
   aquí solo hace falta anular las genéricas .site-footer p / ul.            */
.site-footer .pie-fila p{max-width:none}

.pie-fila{display:grid;grid-template-columns:1fr 1.35fr 1fr;
  gap:clamp(22px,3.4vw,44px);align-items:center}
.pie-fila--datos{padding-bottom:clamp(24px,3.6vw,44px)}
.pie-fila--enlaces{padding-top:clamp(4px,1.4vw,14px);align-items:start}

/* --- marca --- */
.pie-logo{display:inline-block}
.pie-logo img{width:clamp(160px,15vw,220px);height:auto;display:block;opacity:.95}
.pie-redes{display:flex;gap:clamp(14px,1.4vw,20px);margin-top:clamp(14px,1.8vw,20px)}
.pie-redes a{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;color:rgba(244,239,230,.6);transition:color .3s ease}
.pie-redes a:hover{color:var(--gold)}
.pie-redes svg{width:18px;height:18px}

/* --- datos --- */
.pie-datos{text-align:center;display:grid;gap:.55rem}
.site-footer .pie-datos p{margin:0;font-size:13.5px;line-height:1.6;color:var(--slate-soft)}
.site-footer .pie-datos__nombre{font-family:var(--f-sans);font-size:12px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.site-footer .pie-datos__contacto{font-weight:600;color:var(--gold);display:flex;
  flex-wrap:wrap;justify-content:center;gap:.4rem .9rem}
.pie-datos__contacto a{color:var(--gold)}
.pie-datos__contacto span{opacity:.45;font-weight:400}
.pie-datos__contacto a:hover,.pie-datos__mapa a:hover{color:#fff}
.pie-datos__mapa a{color:var(--slate-soft);text-decoration:underline;
  text-underline-offset:3px;text-decoration-color:rgba(191,157,86,.5)}

/* --- sellos de vino --- */
.pie-sellos{display:flex;flex-wrap:wrap;justify-content:flex-end;
  gap:clamp(12px,1.4vw,20px);align-items:center}
.pie-sello{height:clamp(46px,4.4vw,60px);width:auto;display:block;
  opacity:.92;transition:opacity .3s ease}
.pie-sello:hover{opacity:1}

/* --- legal --- */
.pie-legal{display:grid;gap:.42rem;justify-items:center;text-align:center}
.pie-legal a{font-family:var(--f-sans);font-size:12px;color:var(--gold);
  text-decoration:none;transition:opacity .3s ease;opacity:.85}
.pie-legal a:hover{opacity:1;color:var(--gold)}

/* --- navegación --- */
.pie-nav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:.5rem 0;text-align:center}
.pie-nav a{font-family:var(--f-sans);font-size:11.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold);text-decoration:none;padding:0 .85rem;
  opacity:.85;transition:opacity .3s ease}
.pie-nav a:hover{opacity:1;color:var(--gold)}
/* El divisor va DETRÁS del enlace, no delante: al partirse la fila queda
   colgando al final de la línea (como en la referencia) y no al principio
   de la siguiente, que es lo que se lee mal. */
.pie-nav a{position:relative}
.pie-nav a:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;
  transform:translateY(-50%);width:1px;height:11px;background:rgba(191,157,86,.32)}

/* --- sellos de restaurante --- */
.pie-listas{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;
  gap:clamp(14px,1.6vw,24px)}
.pie-lista{height:34px;width:auto;display:block;opacity:.72;transition:opacity .3s ease;
  /* logos de color sobre fondo casi negro: se pasan a blanco, como los sellos
     del pie antiguo, o desaparecen contra el fondo */
  filter:brightness(0) invert(1)}
.pie-lista:hover{opacity:1}
.pie-lista[data-sello="tripadvisor"],
.pie-lista[data-sello="restaurant-guru"]{height:42px}
.pie-lista[data-sello="gastroranking"],
.pie-lista[data-sello="pueblos-magicos"]{height:28px}

/* --- copyright --- */
.site-footer .pie-copy{margin:clamp(24px,3.4vw,42px) 0 0;max-width:none;text-align:center;
  font-family:var(--f-sans);font-size:11px;letter-spacing:.1em;color:var(--gold);opacity:.75}

/* --- tableta: los sellos de vino bajan a su propia fila --- */
@media (max-width:1080px){
  .pie-fila--datos{grid-template-columns:1fr 1.2fr;row-gap:clamp(20px,3vw,30px)}
  .pie-sellos{grid-column:1 / -1;justify-content:center}
  .pie-fila--enlaces{grid-template-columns:1fr;row-gap:clamp(18px,2.6vw,26px)}
  .pie-listas{justify-content:center}
  .pie-legal{grid-auto-flow:column;grid-auto-columns:max-content;justify-content:center;
    gap:.4rem 1.4rem;flex-wrap:wrap}
}

/* --- móvil: una sola columna, todo centrado --- */
@media (max-width:720px){
  .site-footer{padding-block:clamp(30px,7vw,40px) 18px}
  .pie-fila{grid-template-columns:1fr;gap:clamp(20px,5vw,26px);justify-items:center}
  .pie-fila--datos{padding-bottom:clamp(20px,5vw,26px)}
  .pie-marca{display:flex;flex-direction:column;align-items:center}
  .pie-logo img{width:170px}
  .pie-redes{margin-top:14px;gap:20px}
  .pie-redes a{width:30px;height:30px}
  .pie-redes svg{width:20px;height:20px}
  .site-footer .pie-datos p{font-size:13px}
  .pie-datos{gap:.5rem}
  .pie-sellos{gap:14px 18px;justify-content:center}
  .pie-sello{height:44px}
  .pie-legal{grid-auto-flow:row;grid-auto-columns:auto;gap:.5rem}
  .pie-legal a{font-size:12.5px}
  .pie-nav{gap:.55rem 0}
  .pie-nav a{font-size:11px;padding:0 .7rem}
  .pie-listas{gap:16px 20px}
  .pie-lista{height:30px}
  .pie-lista[data-sello="tripadvisor"],
  .pie-lista[data-sello="restaurant-guru"]{height:38px}
  .pie-lista[data-sello="gastroranking"],
  .pie-lista[data-sello="pueblos-magicos"]{height:25px}
  .site-footer .pie-copy{margin-top:clamp(20px,5vw,26px);font-size:10.5px}
}

/* ---------- «Del diario»: de la landing a los artículos que la explican ---------- */
.diario-rel__intro{max-width:52ch;margin:.5rem auto 0;color:var(--ink-soft);font-size:14.5px}
.diario-rel__lista{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.diario-rel__item{background:var(--paper);display:flex;flex-direction:column;
  text-decoration:none;transition:background .3s ease}
.diario-rel__item:hover{background:var(--paper-alt)}
.diario-rel__foto{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--paper-alt)}
.diario-rel__foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .6s cubic-bezier(.16,1,.3,1)}
.diario-rel__item:hover .diario-rel__foto img{transform:scale(1.04)}
.diario-rel__txt{display:flex;flex-direction:column;gap:.6rem;padding:22px 24px 24px;flex:1}
.diario-rel__titulo{font-family:var(--f-serif);font-weight:500;font-size:1.12rem;
  line-height:1.25;color:var(--ink-head)}
.diario-rel__extracto{color:var(--ink-soft);font-size:13.5px;line-height:1.65;flex:1}
.diario-rel__mas{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-mute);display:inline-flex;align-items:center;gap:.6em}
.diario-rel__mas::after{content:"";width:22px;height:1px;background:currentColor;transition:width .35s ease}
.diario-rel__item:hover .diario-rel__mas::after{width:34px}
@media (max-width:900px){.diario-rel__lista{grid-template-columns:1fr 1fr}}
@media (max-width:600px){
  .diario-rel__lista{grid-template-columns:1fr}
  .diario-rel__item{flex-direction:row;align-items:stretch}
  .diario-rel__foto{flex:0 0 108px;aspect-ratio:auto}
  .diario-rel__txt{padding:16px 18px;gap:.45rem}
  .diario-rel__titulo{font-size:1rem}
  .diario-rel__extracto{display:none}
}

/* ---------- Opiniones verificables (sustituyen a los testimonios) ---------- */
.opiniones__intro{max-width:56ch;margin:.6rem auto 0;color:var(--ink-soft);font-size:14.5px}
.opiniones{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,24px);margin-top:2.2rem}
.opinion{border:1px solid var(--rule);padding:clamp(22px,3vw,28px);display:flex;flex-direction:column;
  gap:.7rem;text-decoration:none;background:var(--paper);transition:border-color .3s ease,background .3s ease}
.opinion:hover{border-color:var(--gold);background:var(--paper-alt)}
.opinion__sitio{font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-mute)}
.opinion__dato{font-family:var(--f-serif);font-size:1.9rem;line-height:1;color:var(--ink-head)}
.opinion__dato small{display:block;font-family:var(--f-sans);font-size:12px;color:var(--ink-soft);
  margin-top:.45rem;letter-spacing:.01em}
.opinion__mas{margin-top:auto;font-family:var(--f-sans);font-size:10.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-mute);display:inline-flex;align-items:center;gap:.6em}
.opinion__mas::after{content:"";width:20px;height:1px;background:currentColor;transition:width .35s ease}
.opinion:hover .opinion__mas::after{width:32px}
.opiniones__pie{max-width:62ch;margin:1.6rem auto 0;text-align:center;font-size:12px;
  color:var(--ink-mute);line-height:1.6}
@media (max-width:820px){.opiniones{grid-template-columns:1fr}}


/* ---------- /reservar «Qué opinan de nosotros»: logo gris a los lados + estrellas doradas ---------- */
.opiniones--reservar .opinion{position:relative;align-items:center;text-align:center;gap:.5rem;
  padding-block:clamp(24px,3.2vw,30px);padding-inline:clamp(42px,5.2vw,58px)}
.opinion__mark{position:absolute;top:47%;transform:translateY(-50%);
  width:clamp(22px,2.6vw,32px);height:auto;opacity:.24;filter:grayscale(1);pointer-events:none;user-select:none}
.opinion__mark--l{left:clamp(10px,1.4vw,18px)}
.opinion__mark--r{right:clamp(10px,1.4vw,18px)}
.opiniones--reservar .opinion__sitio{margin-bottom:.15rem}
/* estrellas: dos filas idénticas (flex), la dorada recortada por --pct sobre la gris */
.opinion__stars{--pct:100%;position:relative;display:inline-block;line-height:0;margin:.1rem 0}
.opinion__stars-bg,.opinion__stars-fg{display:flex;gap:2px}
.opinion__stars-fg{position:absolute;inset:0;width:var(--pct);overflow:hidden}
.opinion__stars svg{flex:0 0 auto;width:clamp(16px,1.9vw,20px);height:auto;display:block}
.opinion__stars-bg svg{fill:var(--rule)}
.opinion__stars-fg svg{fill:#e8b83e}
.opinion__badge{display:inline-block;font-family:var(--f-sans);font-size:9.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);
  border:1px solid var(--gold);padding:.42em .9em;margin:.2rem 0}
.opiniones--reservar .opinion__dato{font-size:1.75rem}
@media (max-width:400px){
  .opiniones--reservar .opinion{padding-inline:clamp(34px,10vw,44px)}
  .opinion__mark{width:20px}
}

/* fecha de revisión de la carta: lo que cambia, con su fecha */
.menus__actualizado{max-width:62ch;margin:0 auto clamp(28px,4vw,44px);text-align:center;
  font-family:var(--f-sans);font-size:12px;color:var(--ink-mute);line-height:1.7}

/* ---------- Reseñas reales: cita, firma y enlace a la ficha de origen ---------- */
.resenas{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,26px);margin-top:2.2rem}
.resena{margin:0;border:1px solid var(--rule);padding:clamp(22px,3vw,28px);background:var(--paper);
  display:flex;flex-direction:column;gap:1.1rem}
.resena blockquote{margin:0;font-family:var(--f-serif);font-style:italic;color:var(--ink-head);
  font-size:1.02rem;line-height:1.6;flex:1}
.resena blockquote::before{content:"“";display:block;font-family:var(--f-serif);font-style:normal;
  font-size:2.4rem;line-height:.6;color:var(--gold);margin-bottom:.4rem}
.resena figcaption{display:flex;flex-direction:column;gap:.15rem;font-family:var(--f-sans);font-size:12px}
.resena figcaption b{color:var(--ink);font-size:13px;font-weight:600}
.resena figcaption a{color:var(--ink-mute);text-decoration:none;font-size:11.5px;letter-spacing:.04em}
.resena figcaption a:hover{color:var(--gold)}
.opiniones{margin-top:clamp(22px,3vw,30px)}
@media (max-width:900px){.resenas{grid-template-columns:1fr}}

/* ---------- /reservar/: salida a los menús, secundaria al teléfono ---------- */
.reserve-antes{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:.9rem 1.1rem;margin:clamp(22px,3vw,30px) auto 0;padding-top:clamp(20px,2.8vw,28px);
  max-width:540px;border-top:1px solid var(--rule)}
.reserve-antes span{font-family:var(--f-sans);font-size:14.5px;color:var(--ink-soft)}
.reserve-antes .btn{padding:.62em 1.5em;font-size:11px}
@media (max-width:520px){
  .reserve-antes{flex-direction:column;gap:.75rem}
  .reserve-antes span{font-size:14px}
}

/* ---------- Nota de cata en la ficha de vino ---------- */
.wine-detail__nota{margin:clamp(14px,2vw,20px) 0 clamp(16px,2.2vw,22px);
  padding-left:clamp(12px,1.6vw,16px);border-left:2px solid var(--gold)}
.wine-detail__nota-t{margin:0 0 .35rem;font-family:var(--f-sans);font-size:9.5px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep)}
.wine-detail__nota p:last-child{margin:0;font-size:14px;line-height:1.7;color:var(--ink-soft)}
@media (max-width:720px){
  .wine-detail__nota{margin:12px 0 14px;padding-left:11px}
  .wine-detail__nota p:last-child{font-size:13.5px;line-height:1.62}
}

/* ---------- ficha de vino: comprar manda, la etiqueta legal acompaña ----------
   Comprar es la acción; los valores nutricionales son un dato obligatorio que
   nadie viene a buscar. Van en escalones distintos a propósito. */
.wine-detail__acciones{display:flex;flex-wrap:wrap;align-items:center;
  gap:.7rem 1.4rem;margin:0}
/* el de comprar, relleno y con más cuerpo que un botón normal */
.btn--comprar{background:var(--gold);border-color:var(--gold);color:#fff;
  padding:1.18em 2.5em;letter-spacing:.18em;
  box-shadow:0 1px 0 rgba(0,0,0,.04);transition:background .3s ease,border-color .3s ease,
  transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease}
.btn--comprar:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff;
  transform:translateY(-1px);box-shadow:0 6px 18px -8px rgba(0,0,0,.35)}
.btn--comprar:active{transform:none;box-shadow:none}
/* la etiqueta electrónica: un enlace de pie de nota, no un botón */
.wine-detail__elabel{display:inline-flex;align-items:center;gap:.45em;
  font-family:var(--f-sans);font-size:12px;letter-spacing:.01em;text-transform:none;
  font-weight:400;color:var(--ink-mute);text-decoration:none;
  border-bottom:1px solid transparent;padding-bottom:1px;transition:color .25s ease,border-color .25s ease}
.wine-detail__elabel svg{width:13px;height:13px;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:1.3;stroke-linecap:round;opacity:.75}
.wine-detail__elabel:hover{color:var(--ink-head);border-bottom-color:var(--rule)}
.wine-detail__elabel:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media (max-width:640px){
  .wine-detail__acciones{flex-direction:column;align-items:flex-start;gap:.85rem;align-self:stretch}
  .btn--comprar{width:100%;justify-content:center;padding:1.25em 1.6em}
  .wine-detail__elabel{font-size:11.5px}
}

/* la flecha del botón: sale a saludar al pasar por encima */
.btn__flecha{width:20px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .35s cubic-bezier(.22,1,.36,1)}
.btn--comprar:hover .btn__flecha{transform:translateX(4px)}
.btn--agotado{background:transparent;border-color:var(--rule);color:var(--ink-soft)}
.btn--agotado:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:none;box-shadow:none}
.wine-detail__envio{margin:.75rem 0 0;font-family:var(--f-sans);font-size:11.5px;
  letter-spacing:.02em;color:var(--ink-mute);line-height:1.6}
@media (max-width:640px){
  .wine-detail__envio{font-size:11px;margin-top:.6rem}
}

/* ---------- /eventos-empresa ----------
   1) La portada se sale del contenedor por la derecha: la foto de grupo es lo
      primero que se ve y se ve grande, que es de lo que va la página.
   2) El fundido blanco entra solo en el último tercio; con el 52 % de siempre
      media plantilla se disolvía en el papel.
   3) En los tres bloques siguientes manda el texto: la foto se recorta a la
      altura de su propio copy en vez de imponerle la suya. */
.relato--empresa{max-width:none;margin-inline:0;
  padding-left:max(var(--gutter),calc((100% - var(--container)) / 2 + var(--gutter)));
  padding-right:0;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(26px,3.4vw,66px)}
/* el titular necesita la columna entera; los párrafos, no */
.relato--empresa .relato__body{max-width:none}
.relato--empresa .relato__body h1{font-size:clamp(1.85rem,1.15rem + 2.5vw,3.05rem)}
.relato--empresa .relato__body p{max-width:44ch}
/* el zoom de entrada no puede asomar por el borde y sacar barra horizontal */
.relato--empresa .relato__media{overflow:hidden}
.relato--empresa .relato__media img{
  -webkit-mask-image:linear-gradient(to left,#000 66%,rgba(0,0,0,.55) 86%,transparent 100%);
  mask-image:linear-gradient(to left,#000 66%,rgba(0,0,0,.55) 86%,transparent 100%)}

.relato--empresa-foto{align-items:stretch}
.relato--empresa-foto .relato__media{position:relative;min-height:clamp(250px,21vw,330px)}
.relato--empresa-foto .relato__media img{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover}
.relato--empresa-foto .relato__body{align-self:center}
/* cada foto se recorta por donde tiene el peso, no por el centro geométrico */
.relato--empresa-foto .relato__media img[src*="teambuilding-cata"]{object-position:center 34%}
.relato--empresa-foto .relato__media img[src*="comida-salon"]{object-position:center 42%}
.relato--empresa-foto .relato__media img[src*="reunion-sala"]{object-position:34% 50%}

.jornada-claim .serif-sub{display:block;margin-top:.5rem}

@media (max-width:1000px){
  .relato--empresa{grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr)}
}
@media (max-width:820px){
  /* móvil: vuelve al bloque de siempre —foto entera arriba, texto encima de su
     base— y la fila agachada del grupo no se disuelve en el degradado */
  .relato--empresa{padding-left:0;padding-right:0}
  .relato--empresa .relato__body{max-width:none}
  .relato--empresa .relato__media img{-webkit-mask-image:none;mask-image:none}
  .relato--empresa .relato__media::after{height:19%}
  .relato--empresa-foto .relato__media{min-height:0}
  .relato--empresa-foto .relato__media img{position:static;height:auto}
}

/* ---------- /grupos + /menus: tarjeta del menú de grupo (reusa .carta-fila de /menus/) ---------- */
/* dentro de /grupos/ la tarjeta ya va en una <section class="section">: sin doble padding */
.cartas--grupos{padding-block:0}
.carta-fila--grupos .carta-fila__title{margin-bottom:.7rem}
/* el bacalao manda: el encuadre de la foto tira hacia la cazuela en primer plano */
.carta-fila--grupos .carta-fila__media img{object-position:center 46%}
.menu-grupos__lista{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.55rem}
.menu-grupos__lista li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .6rem;
  padding:.55rem .9rem;background:var(--paper-alt);border:1px solid var(--rule)}
.menu-grupos__lista b{font-family:var(--f-sans);font-size:10px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-deep)}
.menu-grupos__lista span{color:var(--ink-soft);font-size:13px}
@media (max-width:900px){
  .menu-grupos__lista{margin-top:.8rem}
}

/* ---------- /bodas: los cuatro espacios de la finca, a lo ancho ---------- */
.celebra--areas{grid-template-columns:repeat(4,1fr)}
/* con cuatro columnas la palabra ya no cabe al tamaño de las tarjetas de dos: se reduce */
.celebra--areas .celebra__nombre{font-size:clamp(1.3rem,1rem + 1.1vw,1.75rem)}
@media (max-width:900px){
  .celebra--areas{grid-template-columns:repeat(2,1fr)}
  .celebra--areas .celebra__nombre{font-size:clamp(1.7rem,1.25rem + 1.9vw,2.6rem)}
}
@media (max-width:560px){
  .celebra--areas{grid-template-columns:1fr}
}
/* franja "también en la finca" dentro de cada sub-landing: tres tarjetas, sin el párrafo largo */
.celebra--tres{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){
  .celebra--tres{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .celebra--tres{grid-template-columns:1fr}
}
.celebra--mini .celebra__nombre{font-size:clamp(1.4rem,1.05rem + 1.3vw,1.9rem)}
.celebra--mini .celebra__title{margin-bottom:.1rem}
.celebra--mini .celebra__body{padding-bottom:clamp(16px,2vw,22px)}