/* =====================================================================
   La Vega · Horchata y Más  —  v2
   Sistema visual: elayadesign/ai-design-skills · landing-page-design
   · Una sola tipografía (Manrope), sin cursivas, peso máximo 700
   · Tamaños solo de la escala Tailwind · Espaciado solo de la tabla B2
   · Radios Tailwind con fórmula de anidado · Fondos planos (sin degradados)
   · Movimiento: cubic-bezier(0.32,0.72,0,1) · Revelado con IntersectionObserver
   ===================================================================== */

@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/manrope-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/manrope-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/manrope-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/manrope-latin-700-normal.woff2") format("woff2")}

:root{
  /* Color — marca (logo y carta física) */
  --bg:#F6E9DF;          /* crema */
  --bg-2:#EFDACB;        /* crema tostada */
  --surface:#FFFDFB;
  --line:#E6CBB6;
  --ink:#2B1B19;
  --ink-2:#6B4E49;
  --red:#CA4645;
  --red-press:#A93836;
  --wine:#7D3033;
  --orange:#F2A063;
  --olive:#A1A65A;
  --sage:#768F6C;
  --dark:#131209;        /* fondo oscuro permitido (B4) */
  --dark-2:#1F1F1F;

  /* Espaciado (B2) */
  --s-25:2px; --s-50:4px; --s-75:8px; --s-100:12px; --s-200:16px; --s-300:24px;
  --s-400:32px; --s-500:40px; --s-600:48px; --s-700:64px; --s-800:80px; --s-900:96px;

  /* Radios (Tailwind) */
  --r-md:6px; --r-lg:8px; --r-xl:12px; --r-2xl:16px; --r-3xl:24px; --r-full:9999px;

  /* Movimiento (B7) */
  --ease:cubic-bezier(0.32,0.72,0,1);
  --dur:700ms;

  --maxw:1152px;
  --gutter:var(--s-200);
}
@media (min-width:768px){:root{--gutter:var(--s-400)}}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Manrope",system-ui,sans-serif;font-size:1rem;line-height:1.5rem;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,canvas{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:600;text-wrap:balance;letter-spacing:-0.01em}
p,li,dd{text-wrap:pretty}
p{margin:0}
:focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:var(--r-lg)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip{position:fixed;left:var(--s-200);top:-64px;z-index:200;background:var(--ink);color:#fff;padding:var(--s-75) var(--s-100);border-radius:var(--r-lg);font-weight:600;transition:top var(--dur) var(--ease)}
.skip:focus{top:var(--s-200)}

/* ---------- Escala tipográfica (B1) ---------- */
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1}
.text-6xl{font-size:3.75rem;line-height:1}
.text-7xl{font-size:4.5rem;line-height:1}
@media (min-width:768px){
  .md-text-xl{font-size:1.25rem;line-height:1.75rem}
  .md-text-4xl{font-size:2.25rem;line-height:2.5rem}
  .md-text-5xl{font-size:3rem;line-height:1}
  .md-text-6xl{font-size:3.75rem;line-height:1}
  .md-text-7xl{font-size:4.5rem;line-height:1}
}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
.muted{color:var(--ink-2)}
.eyebrow{display:inline-flex;align-items:center;gap:var(--s-75);font-size:.875rem;line-height:1.25rem;font-weight:600;color:var(--red)}
.eyebrow::before{content:"";width:var(--s-75);height:var(--s-75);border-radius:var(--r-full);background:currentColor}

/* ---------- Layout ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--s-800)}
@media (min-width:768px){.section{padding-block:var(--s-900)}}
.section--surface{background:var(--bg-2)}
.section--dark{background:var(--dark);color:var(--bg)}
.section--dark .muted{color:#BDB3A9}
.head{display:grid;gap:var(--s-200);max-width:680px;margin-bottom:var(--s-600)}
.head--center{margin-inline:auto;text-align:center;justify-items:center}
.stack-300>*+*{margin-top:var(--s-300)}

/* ---------- Botones (B1/B2/B9) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-75);padding:var(--s-75) var(--s-100);border-radius:var(--r-full);border:1px solid transparent;font:600 1rem/1.5rem "Manrope",sans-serif;text-decoration:none;cursor:pointer;transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.btn svg{width:20px;height:20px;flex:none}
.btn:active{transform:scale(.98)}
.btn--primary{background:var(--red);color:#fff;padding-inline:var(--s-200)}
.btn--primary:hover{background:var(--red-press);transform:translateY(-2px)}
.btn--ghost{border-color:var(--line);color:var(--ink);background:var(--surface)}
.btn--ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.btn--light{background:var(--bg);color:var(--ink);padding-inline:var(--s-200)}
.btn--light:hover{background:#fff;transform:translateY(-2px)}
.btn--sm{font-size:.875rem;line-height:1.25rem}
.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;pointer-events:none}
.link{font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;transition:color var(--dur) var(--ease)}
.link:hover{color:var(--red)}
.link-arrow{display:inline-flex;align-items:center;gap:var(--s-50);font-weight:600;text-decoration:none;color:var(--red);transition:gap var(--dur) var(--ease)}
.link-arrow svg{width:18px;height:18px}
.link-arrow:hover{gap:var(--s-75)}

/* ---------- Nav isla fluida (B7) ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:center;pointer-events:none;padding-inline:var(--s-200)}
.nav__pill{pointer-events:auto;margin-top:var(--s-300);display:flex;align-items:center;gap:var(--s-75);width:max-content;max-width:100%;padding:var(--s-50) var(--s-50) var(--s-50) var(--s-200);border-radius:var(--r-full);background:rgba(255,253,251,.72);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 24px -12px rgba(43,27,25,.35);transition:background-color var(--dur) var(--ease)}
.nav__brand{display:flex;align-items:center;text-decoration:none;margin-right:var(--s-75)}
.nav__brand img{height:40px;width:auto}
.nav__links{display:none;gap:var(--s-50)}
.nav__links a{padding:var(--s-75) var(--s-100);border-radius:var(--r-full);text-decoration:none;font-weight:600;font-size:.875rem;line-height:1.25rem;color:var(--ink-2);transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.nav__links a:hover{background:var(--bg-2);color:var(--ink)}
.nav__links a[aria-current="page"]{background:var(--ink);color:var(--bg)}
.nav__cta{display:none}
.burger{position:relative;width:40px;height:40px;border:0;border-radius:var(--r-full);background:var(--ink);color:var(--bg);cursor:pointer;transition:transform var(--dur) var(--ease)}
.burger:active{transform:scale(.98)}
.burger span{position:absolute;left:12px;width:16px;height:2px;border-radius:2px;background:currentColor;transition:transform var(--dur) var(--ease),top var(--dur) var(--ease)}
.burger span:nth-child(1){top:15px}.burger span:nth-child(2){top:23px}
.menu-open .burger span:nth-child(1){top:19px;transform:rotate(45deg)}
.menu-open .burger span:nth-child(2){top:19px;transform:rotate(-45deg)}
.overlay{position:fixed;inset:0;z-index:90;background:rgba(255,253,251,.8);backdrop-filter:blur(64px);-webkit-backdrop-filter:blur(64px);display:flex;flex-direction:column;justify-content:center;padding:var(--s-900) var(--s-300) var(--s-600);opacity:0;visibility:hidden;transition:opacity var(--dur) var(--ease),visibility var(--dur) var(--ease)}
.menu-open .overlay{opacity:1;visibility:visible}
.overlay ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-100)}
.overlay li{overflow:hidden}
.overlay a.big{display:block;font-size:2.25rem;line-height:2.5rem;font-weight:600;text-decoration:none;color:var(--ink);transform:translateY(48px);opacity:0;transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.overlay a.big[aria-current="page"]{color:var(--red)}
.menu-open .overlay a.big{transform:none;opacity:1}
.overlay li:nth-child(1) a{transition-delay:100ms}.overlay li:nth-child(2) a{transition-delay:150ms}
.overlay li:nth-child(3) a{transition-delay:200ms}.overlay li:nth-child(4) a{transition-delay:250ms}
.overlay__foot{margin-top:var(--s-600);display:grid;gap:var(--s-75);color:var(--ink-2);transform:translateY(48px);opacity:0;transition:transform var(--dur) var(--ease) 300ms,opacity var(--dur) var(--ease) 300ms}
.menu-open .overlay__foot{transform:none;opacity:1}
@media (min-width:900px){
  .nav__links{display:flex}
  .nav__cta{display:inline-flex}
  .burger,.overlay{display:none}
}

/* ---------- Hero scroll (scroll-word) ---------- */
.scrolly{position:relative;height:500svh;background:var(--dark)}
.scrolly__stage{position:sticky;top:0;height:100svh;overflow:hidden}
.scrolly canvas{position:absolute;inset:0;width:100%;height:100%}
.scrolly__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scrolly__shade{position:absolute;inset:0;background:rgba(19,18,9,.5)}
.scrolly__skeleton{position:absolute;inset:0;background:var(--dark-2)}
.scrolly__skeleton::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.04);animation:sk 1.6s var(--ease) infinite alternate}
@keyframes sk{from{opacity:.2}to{opacity:1}}
.scrolly.is-ready .scrolly__skeleton{opacity:0;transition:opacity var(--dur) var(--ease)}
.chapters{position:absolute;inset:0;display:flex;align-items:flex-end;padding:0 var(--gutter) var(--s-900)}
@media (min-width:768px){.chapters{align-items:center;padding-bottom:0}}
.chapter{position:absolute;left:var(--gutter);right:var(--gutter);bottom:calc(var(--s-900) + var(--s-700));max-width:680px;color:#fff;opacity:0;transform:translateY(64px);filter:blur(12px);transition:opacity 800ms var(--ease),transform 800ms var(--ease),filter 800ms var(--ease);pointer-events:none}
@media (min-width:768px){.chapter{left:max(var(--gutter),calc((100vw - var(--maxw))/2 + var(--gutter)));bottom:auto;top:50%;margin-top:-120px}}
.chapter.is-active{opacity:1;transform:none;filter:blur(0);pointer-events:auto}
.chapter.is-past{transform:translateY(-64px)}
.chapter__kicker{display:inline-flex;align-items:center;gap:var(--s-75);font-size:.875rem;line-height:1.25rem;font-weight:600;color:#fff;background:rgba(19,18,9,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--s-50) var(--s-100);border-radius:var(--r-full);margin-bottom:var(--s-200)}
.chapter__kicker .dot{width:var(--s-75);height:var(--s-75);border-radius:var(--r-full);background:var(--sage)}
.chapter__kicker .dot.is-closed{background:var(--red)}
.hero-title{font-size:2.25rem;line-height:2.5rem;font-weight:600;letter-spacing:-0.02em;background:linear-gradient(90deg,#FFFFFF,#9B9B9B);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:var(--s-200)}
@media (min-width:768px){.hero-title{font-size:3.75rem;line-height:1}}
.chapter__sub{font-size:1rem;line-height:1.5rem;color:rgba(255,255,255,.86);max-width:680px}
@media (min-width:768px){.chapter__sub{font-size:1.125rem;line-height:1.75rem}}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-75);margin-top:var(--s-300);list-style:none;padding:0}
.chips li{font-size:.875rem;line-height:1.25rem;font-weight:600;padding:var(--s-50) var(--s-100);border-radius:var(--r-full);background:rgba(255,253,251,.14);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff}
.chips li b{font-weight:700;color:var(--orange)}
.chapter .link-arrow{color:#fff;margin-top:var(--s-300)}
.scrolly__bar{position:absolute;left:var(--gutter);right:var(--gutter);bottom:var(--s-300);display:flex;align-items:center;justify-content:space-between;gap:var(--s-200)}
@media (min-width:768px){.scrolly__bar{left:max(var(--gutter),calc((100vw - var(--maxw))/2 + var(--gutter)));right:max(var(--gutter),calc((100vw - var(--maxw))/2 + var(--gutter)));bottom:var(--s-500)}}
.progress{display:flex;gap:var(--s-50);flex:1;max-width:240px}
.progress span{position:relative;flex:1;height:4px;border-radius:var(--r-full);background:rgba(255,255,255,.24);overflow:hidden}
.progress i{position:absolute;inset:0;background:#fff;transform-origin:left;transform:scaleX(0)}
.scroll-hint{display:none;align-items:center;gap:var(--s-75);font-size:.875rem;line-height:1.25rem;color:rgba(255,255,255,.8)}
@media (min-width:768px){.scroll-hint{display:inline-flex}}
.scroll-hint svg{width:18px;height:18px;animation:bob 1.8s var(--ease) infinite}
@keyframes bob{50%{transform:translateY(4px)}}
/* Movimiento reducido / sin JS: capítulos apilados con fotograma fijo */
.scrolly--static{height:auto}
.scrolly--static .scrolly__stage{position:relative;height:auto}
.scrolly--static canvas,.scrolly--static .scrolly__skeleton,.scrolly--static .scrolly__bar,.scrolly--static > .scrolly__stage > .scrolly__poster{display:none}
.scrolly--static .chapters{position:relative;display:block;padding:0}
.scrolly--static .chapter{position:relative;left:auto;right:auto;top:auto;bottom:auto;margin:0;max-width:none;opacity:1;transform:none;filter:none;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s-900) var(--gutter) var(--s-800)}
.scrolly--static .chapter > *{position:relative;max-width:680px}
.scrolly--static .chapter__still{display:block!important;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none}
.scrolly--static .chapter::before{content:"";position:absolute;inset:0;background:rgba(19,18,9,.48);z-index:1}
.scrolly--static .chapter > :not(.chapter__still){z-index:2}
.chapter__still{display:none}
.hero-cta{position:absolute;right:var(--gutter);bottom:var(--s-800);display:flex}
@media (min-width:768px){.hero-cta{position:static}}

/* ---------- Revelado al hacer scroll (B7) ---------- */
.reveal{opacity:0;transform:translateY(64px);filter:blur(12px);transition:opacity 900ms var(--ease),transform 900ms var(--ease),filter 900ms var(--ease)}
.reveal.is-in{opacity:1;transform:none;filter:blur(0)}
.reveal.d1{transition-delay:100ms}.reveal.d2{transition-delay:150ms}.reveal.d3{transition-delay:200ms}.reveal.d4{transition-delay:250ms}.reveal.d5{transition-delay:300ms}
.no-js .reveal{opacity:1;transform:none;filter:none}

/* ---------- Carta (preview) ---------- */
.menu-grid{display:grid;gap:var(--s-200);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.menu-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-300)}}
.mcard{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-3xl);padding:var(--s-75);text-decoration:none;transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.mcard:hover{transform:translateY(-4px);border-color:var(--ink-2)}
.mcard:active{transform:scale(.98)}
/* radio anidado: 24 − 8 = 16 */
.mcard__media{position:relative;aspect-ratio:4/5;border-radius:var(--r-2xl);overflow:hidden;background:var(--bg-2)}
.mcard__media img{width:100%;height:100%;object-fit:cover;transition:transform 1200ms var(--ease)}
.mcard:hover .mcard__media img{transform:scale(1.05)}
.mcard__media--icon{display:grid;place-items:center;background:var(--orange);color:var(--surface)}
.mcard__media--icon svg{width:40%;height:40%}
.mcard__price{position:absolute;top:var(--s-75);left:var(--s-75);font-size:.75rem;line-height:1rem;font-weight:600;background:var(--surface);color:var(--ink);padding:var(--s-50) var(--s-75);border-radius:var(--r-lg)}
.mcard__body{padding:var(--s-100) var(--s-75) var(--s-75);display:grid;gap:var(--s-50)}
.mcard__title{font-size:1rem;line-height:1.5rem;font-weight:600}
.mcard__desc{display:none;font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
@media (min-width:768px){.mcard__title{font-size:1.25rem;line-height:1.75rem}.mcard__desc{display:block}}
.center-cta{display:flex;flex-direction:column;align-items:center;gap:var(--s-100);margin-top:var(--s-600);text-align:center}

/* ---------- Tagline reveal (B11) ---------- */
.tagline{padding-block:var(--s-900)}
@media (min-width:768px){.tagline{padding-block:calc(var(--s-900) + var(--s-700))}}
.tagline p{max-width:680px;font-size:2.25rem;line-height:2.5rem;font-weight:600;letter-spacing:-0.02em;color:var(--ink)}
@media (min-width:768px){.tagline p{font-size:3rem;line-height:1;max-width:820px}}
.tagline .w{color:rgba(43,27,25,.28);transition:color var(--dur) var(--ease)}
.tagline .w.on{color:var(--ink)}
.tagline .w.accent.on{color:var(--red)}

/* ---------- Beneficios / pasos ---------- */
.benefits{display:grid;gap:var(--s-200)}
@media (min-width:768px){.benefits{grid-template-columns:repeat(2,1fr);gap:var(--s-300)}}
@media (min-width:1024px){.benefits{grid-template-columns:repeat(4,1fr)}}
.benefit{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-3xl);padding:var(--s-300);display:grid;gap:var(--s-100);align-content:start}
.benefit .ico{width:48px;height:48px;border-radius:var(--r-full);display:grid;place-items:center;background:var(--bg-2);color:var(--red)}
.benefit .ico svg{width:24px;height:24px}
.benefit h3{font-size:1.125rem;line-height:1.75rem}
.benefit p{font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.steps{display:grid;gap:var(--s-300);counter-reset:s;list-style:none;padding:0;margin:0}
@media (min-width:768px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{border-radius:var(--r-3xl);background:var(--dark-2);padding:var(--s-300);display:grid;gap:var(--s-100);border:1px solid #313131}
.step__n{font-size:3rem;line-height:1;font-weight:600;color:var(--orange)}
.step h3{font-size:1.25rem;line-height:1.75rem;color:var(--bg)}
.step p{color:#BDB3A9;font-size:1rem;line-height:1.5rem}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-300);margin-top:var(--s-700);padding-top:var(--s-500);border-top:1px solid #313131;list-style:none;padding-left:0}
@media (min-width:768px){.facts{grid-template-columns:repeat(4,1fr)}}
.facts strong{display:block;font-size:2.25rem;line-height:2.5rem;font-weight:600;color:var(--bg)}
.facts span{font-size:.875rem;line-height:1.25rem;color:#BDB3A9}

/* ---------- Ubicación + horario ---------- */
.visit{display:grid;gap:var(--s-300)}
@media (min-width:960px){.visit{grid-template-columns:1fr 1fr;gap:var(--s-400)}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-3xl);padding:var(--s-300)}
@media (min-width:768px){.panel{padding:var(--s-400)}}
.panel h3{font-size:1.5rem;line-height:2rem;margin-bottom:var(--s-100)}
.landmarks{list-style:none;padding:0;margin:var(--s-300) 0;display:grid;gap:var(--s-100)}
.landmarks li{display:flex;gap:var(--s-100);align-items:flex-start}
.landmarks .ico{flex:none;width:40px;height:40px;border-radius:var(--r-full);background:var(--bg-2);color:var(--red);display:grid;place-items:center}
.landmarks .ico svg{width:20px;height:20px}
.landmarks b{display:block;font-weight:600}
.landmarks span{font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.map{position:relative;margin-top:var(--s-300);border-radius:var(--r-2xl);overflow:hidden;aspect-ratio:4/3;background:var(--bg-2)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map__consent{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-200);text-align:center;padding:var(--s-300)}
.map__consent > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.map__consent::before{content:"";position:absolute;inset:0;background:rgba(19,18,9,.62);z-index:1}
.map__consent > :not(img){position:relative;z-index:2}
.map__consent > p,.map__consent > svg{color:#fff}
.map__consent p{max-width:320px;font-size:.875rem;line-height:1.25rem}
.hours{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.hours th,.hours td{padding:var(--s-100) 0;border-bottom:1px solid var(--line);text-align:left;font-weight:500}
.hours td{text-align:right;font-weight:600}
.hours tr:last-child th,.hours tr:last-child td{border-bottom:0}
.hours tr.is-today th,.hours tr.is-today td{color:var(--red)}
.hours tr.is-today th::after{content:"Hoy";margin-left:var(--s-75);font-size:.75rem;line-height:1rem;font-weight:600;background:var(--red);color:#fff;padding:var(--s-25) var(--s-75);border-radius:var(--r-full);vertical-align:1px}
.status{display:inline-flex;align-items:center;gap:var(--s-75);font-size:.875rem;line-height:1.25rem;font-weight:600;background:var(--bg-2);padding:var(--s-50) var(--s-100);border-radius:var(--r-full)}
.status::before{content:"";width:var(--s-75);height:var(--s-75);border-radius:var(--r-full);background:var(--sage)}
.status.is-closed::before{background:var(--red)}
.note{display:flex;gap:var(--s-75);align-items:center;margin-top:var(--s-200);font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.note svg{width:18px;height:18px;color:var(--red);flex:none}

/* ---------- FAQ ---------- */
.faq{max-width:760px;margin-inline:auto;display:grid;gap:var(--s-100)}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2xl);transition:border-color var(--dur) var(--ease)}
.faq details[open]{border-color:var(--ink-2)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s-200);padding:var(--s-200) var(--s-300);font-weight:600;font-size:1rem;line-height:1.5rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:20px;height:20px;flex:none;transition:transform var(--dur) var(--ease)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq .a{padding:0 var(--s-300) var(--s-300);color:var(--ink-2)}

/* ---------- Redes + CTA final ---------- */
.social{display:flex;flex-wrap:wrap;gap:var(--s-100);justify-content:center;list-style:none;padding:0;margin:var(--s-300) 0 0}
.social a{display:inline-flex;align-items:center;gap:var(--s-75);padding:var(--s-75) var(--s-200);border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line);text-decoration:none;font-weight:600;transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.social a:hover{transform:translateY(-2px);border-color:var(--ink)}
.social a[aria-disabled="true"]{opacity:.5;pointer-events:none}
.social a small{font-size:.75rem;line-height:1rem;font-weight:500;color:var(--ink-2)}
.social svg{width:20px;height:20px}
.final{background:var(--red);color:#fff;border-radius:var(--r-3xl);padding:var(--s-700) var(--s-300);text-align:center;display:grid;justify-items:center;gap:var(--s-200)}
@media (min-width:768px){.final{padding:var(--s-900) var(--s-700)}}
.final h2{font-size:2.25rem;line-height:2.5rem;max-width:680px}
@media (min-width:768px){.final h2{font-size:3rem;line-height:1}}
.final p{max-width:560px;color:rgba(255,255,255,.88)}
.final .btn--light{margin-top:var(--s-100)}

/* ---------- Footer ---------- */
.footer{background:var(--dark);color:#D9CFC6;font-size:.875rem;line-height:1.25rem}
.footer__grid{display:grid;gap:var(--s-500);padding-block:var(--s-700) var(--s-500)}
@media (min-width:768px){.footer__grid{grid-template-columns:repeat(3,1fr)}}
.footer h2{font-size:.875rem;line-height:1.25rem;font-weight:600;color:var(--bg);margin-bottom:var(--s-200)}
.footer img{width:96px;height:auto;margin-bottom:var(--s-200)}
.footer .tagline-sm{font-size:1rem;line-height:1.5rem;color:var(--bg);font-weight:600;margin-bottom:var(--s-100)}
.footer a{text-decoration:none;transition:color var(--dur) var(--ease)}
.footer a:hover{color:#fff}
.flist{list-style:none;padding:0;margin:0;display:grid;gap:var(--s-100)}
.flist li{display:flex;align-items:center;gap:var(--s-75)}
.flist svg{width:18px;height:18px;color:var(--orange)}
.fhours{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.fhours th,.fhours td{padding:var(--s-50) 0;font-weight:400;text-align:left}
.fhours td{text-align:right}
.fhours tr.is-today{color:var(--orange)}
.fhours tr.is-today th,.fhours tr.is-today td{font-weight:600}
.footer__bottom{border-top:1px solid #313131;padding-block:var(--s-300) var(--s-900);display:flex;flex-wrap:wrap;gap:var(--s-100) var(--s-300);justify-content:space-between;font-size:.75rem;line-height:1rem}
@media (min-width:900px){.footer__bottom{padding-bottom:var(--s-300)}}
.footer__bottom nav{display:flex;flex-wrap:wrap;gap:var(--s-100) var(--s-300)}

/* Barra rápida móvil */
.quickbar{position:fixed;left:var(--s-200);right:var(--s-200);bottom:var(--s-200);z-index:80;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-50);padding:var(--s-50);border-radius:var(--r-full);background:rgba(19,18,9,.86);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transform:translateY(160%);transition:transform var(--dur) var(--ease)}
.quickbar.is-visible{transform:none}
.quickbar a{display:flex;align-items:center;justify-content:center;gap:var(--s-50);padding:var(--s-75) var(--s-100);border-radius:var(--r-full);color:var(--bg);text-decoration:none;font-weight:600;font-size:.875rem;line-height:1.25rem}
.quickbar a:first-child{background:var(--red);color:#fff}
.quickbar a:active{transform:scale(.98)}
.quickbar svg{width:18px;height:18px}
@media (min-width:900px){.quickbar{display:none}}

/* ---------- Páginas interiores ---------- */
.page-head{padding-top:calc(var(--s-900) + var(--s-700));padding-bottom:var(--s-700)}
.page-head h1{font-size:3rem;line-height:1;letter-spacing:-0.02em;margin-block:var(--s-200);max-width:680px}
@media (min-width:768px){.page-head h1{font-size:4.5rem;line-height:1}}
.page-head p{max-width:680px;font-size:1.125rem;line-height:1.75rem;color:var(--ink-2)}
.cover{border-radius:var(--r-3xl);overflow:hidden;aspect-ratio:16/9;background:var(--bg-2)}
@media (max-width:767px){.cover{aspect-ratio:4/3}}
.cover img{width:100%;height:100%;object-fit:cover}

/* Timeline (Nosotros) */
.timeline{position:relative}
.timeline__rail{position:absolute;left:19px;top:0;bottom:0;width:2px;background:var(--line);border-radius:var(--r-full)}
.timeline__fill{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--red);transform-origin:top;transform:scaleY(0)}
.tl{position:relative;padding-left:var(--s-700);padding-bottom:var(--s-800)}
.tl:last-child{padding-bottom:0}
.tl__dot{position:absolute;left:12px;top:var(--s-200);width:16px;height:16px;border-radius:var(--r-full);background:var(--bg);border:2px solid var(--line);transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.tl.is-in .tl__dot{background:var(--red);border-color:var(--red);transform:scale(1.25)}
.tl .tl__year{font-size:3.75rem;line-height:1;font-weight:600;letter-spacing:-0.03em;color:var(--red);margin-bottom:var(--s-200)}
@media (min-width:768px){.tl__year{font-size:4.5rem;line-height:1}}
.tl h3{font-size:1.5rem;line-height:2rem;margin-bottom:var(--s-100)}
.tl p{color:var(--ink-2);max-width:560px}
.tl p+p{margin-top:var(--s-100)}
.tl__fig{margin:var(--s-300) 0 0;position:relative;border-radius:var(--r-3xl);overflow:hidden;aspect-ratio:3/2;background:var(--bg-2);max-width:560px}
.tl__fig img{width:100%;height:100%;object-fit:cover}
.tl__fig--old img{filter:sepia(.8) saturate(.8)}
.tl__fig figcaption{position:absolute;left:var(--s-100);bottom:var(--s-100);font-size:.75rem;line-height:1rem;font-weight:600;background:rgba(19,18,9,.7);color:var(--bg);padding:var(--s-50) var(--s-75);border-radius:var(--r-lg)}
.names{display:flex;flex-wrap:wrap;gap:var(--s-75);align-items:center;margin-top:var(--s-200);list-style:none;padding:0}
.names li{font-weight:600;padding:var(--s-50) var(--s-100);border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line)}
.names li.arr{background:none;border:0;padding:0;color:var(--ink-2)}
.names li:last-child{background:var(--red);border-color:var(--red);color:#fff}
@media (min-width:960px){
  .timeline__rail{left:50%;margin-left:-1px}
  .tl{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-900);align-items:center;padding-left:0}
  .tl__dot{left:50%;top:50%;margin:-8px 0 0 -8px}
  .tl:nth-child(odd) .tl__text{text-align:right;justify-self:end}
  .tl:nth-child(odd) .tl__text p{margin-left:auto}
  .tl:nth-child(odd) .names{justify-content:flex-end}
  .tl:nth-child(even) .tl__text{order:2}
  .tl__fig{margin:0}
  .tl:nth-child(odd) .tl__fig{justify-self:start}
  .tl:nth-child(even) .tl__fig{justify-self:end}
}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:160px;grid-auto-flow:dense;gap:var(--s-100)}
@media (min-width:768px){.gallery{grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:var(--s-200)}}
.gallery a{display:block;border-radius:var(--r-2xl);overflow:hidden;background:var(--bg-2)}
.gallery a.tall{grid-row:span 2}.gallery a.wide{grid-column:span 2}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform 1200ms var(--ease)}
.gallery a:hover img{transform:scale(1.05)}
.lightbox{position:fixed;inset:0;z-index:300;background:rgba(19,18,9,.94);display:flex;align-items:center;justify-content:center;padding:var(--s-200);opacity:0;visibility:hidden;transition:opacity var(--dur) var(--ease),visibility var(--dur) var(--ease)}
.lightbox.is-open{opacity:1;visibility:visible}
.lightbox img{max-height:86vh;border-radius:var(--r-2xl)}
.lightbox button{position:absolute;width:48px;height:48px;border:0;border-radius:var(--r-full);background:var(--bg);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform var(--dur) var(--ease)}
.lightbox button:active{transform:scale(.98)}
.lightbox button svg{width:20px;height:20px}
.lb-close{top:var(--s-200);right:var(--s-200)}.lb-prev{left:var(--s-200);top:50%;margin-top:-24px}.lb-next{right:var(--s-200);top:50%;margin-top:-24px}

/* Carta completa */
.menu-tabs{position:sticky;top:var(--s-800);z-index:50;padding-block:var(--s-75)}
.menu-tabs ul{display:flex;gap:var(--s-75);overflow-x:auto;scrollbar-width:none;list-style:none;margin:0 auto;padding:var(--s-50);max-width:max-content;border-radius:var(--r-full);background:rgba(255,253,251,.72);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 24px -12px rgba(43,27,25,.3)}
@media (max-width:767px){.menu-tabs{padding-inline:var(--s-200)}.menu-tabs ul{max-width:100%}}
.menu-tabs ul::-webkit-scrollbar{display:none}
.menu-tabs a{display:block;white-space:nowrap;padding:var(--s-75) var(--s-100);border-radius:var(--r-full);border:1px solid var(--line);background:var(--surface);text-decoration:none;font-weight:600;font-size:.875rem;line-height:1.25rem;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.menu-tabs a:hover{border-color:var(--ink)}
.menu-tabs a.is-active{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.tools{display:flex;flex-wrap:wrap;gap:var(--s-200) var(--s-300);align-items:center;justify-content:space-between;margin-top:var(--s-300)}
.switch{display:inline-flex;align-items:center;gap:var(--s-100);font-weight:600;cursor:pointer}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch .track{position:relative;width:48px;height:28px;border-radius:var(--r-full);background:var(--line);transition:background-color var(--dur) var(--ease)}
.switch .track::after{content:"";position:absolute;top:4px;left:4px;width:20px;height:20px;border-radius:var(--r-full);background:#fff;transition:transform var(--dur) var(--ease)}
.switch input:checked+.track{background:var(--sage)}
.switch input:checked+.track::after{transform:translateX(20px)}
.switch input:focus-visible+.track{outline:2px solid var(--red);outline-offset:2px}
.legend{display:none;margin-top:var(--s-200);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2xl);padding:var(--s-200);font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.show-al .legend{display:block}
.legend p+p{margin-top:var(--s-75)}
.mgroup{padding-top:var(--s-800);scroll-margin-top:var(--s-900)}
@media (min-width:960px){.mgroup{display:grid;grid-template-columns:320px 1fr;gap:var(--s-700);align-items:start}.mgroup__aside{position:sticky;top:calc(var(--s-900) + var(--s-600))}}
.mgroup__aside h2{font-size:2.25rem;line-height:2.5rem;margin-bottom:var(--s-100)}
.mgroup__aside p{color:var(--ink-2)}
.mgroup__img{margin-top:var(--s-300);border-radius:var(--r-3xl);overflow:hidden;aspect-ratio:16/9;background:var(--bg-2)}
@media (min-width:960px){.mgroup__img{aspect-ratio:4/5}}
.mgroup__img img{width:100%;height:100%;object-fit:cover}
.mgroup__img--icon{display:grid;place-items:center;background:var(--orange);color:var(--surface)}
.mgroup__img--icon svg{width:40%;height:40%}
.msub{font-size:.875rem;line-height:1.25rem;font-weight:600;color:var(--red);margin:var(--s-500) 0 var(--s-75)}
.msub:first-child{margin-top:var(--s-300)}
@media (min-width:960px){.msub:first-child{margin-top:0}}
.items{list-style:none;margin:0;padding:0}
.item{padding:var(--s-200) 0;border-bottom:1px solid var(--line)}
.item__row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-200)}
.item__name{font-weight:600}
.item__price{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.item__desc{margin-top:var(--s-50);font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.callout{margin-top:var(--s-300);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2xl);padding:var(--s-200);display:flex;gap:var(--s-100);align-items:center;font-weight:600}
.callout svg{width:20px;height:20px;color:var(--red);flex:none}
.flavours{display:grid;gap:var(--s-100)}
.flavours div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2xl);padding:var(--s-200)}
.flavours b{display:block;font-size:.875rem;line-height:1.25rem;color:var(--red);font-weight:600;margin-bottom:var(--s-50)}
.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-100);margin-top:var(--s-100)}
.formats div{background:var(--ink);color:var(--bg);border-radius:var(--r-2xl);padding:var(--s-200) var(--s-100);text-align:center;font-size:.875rem;line-height:1.25rem}
.formats b{display:block;font-size:1.25rem;line-height:1.75rem;color:var(--orange);margin-top:var(--s-50)}
.al-list{display:none;flex-wrap:wrap;gap:var(--s-50);margin-top:var(--s-75)}
.show-al .al-list{display:flex}
.al{font-size:.75rem;line-height:1rem;font-weight:600;padding:var(--s-25) var(--s-75);border-radius:var(--r-full);background:var(--wine);color:#fff}
.al--t{background:transparent;color:var(--wine);border:1px solid var(--wine)}
.al--ok{background:var(--sage)}
.al--ask{background:var(--orange);color:var(--ink)}

/* Contacto */
.contact{display:grid;gap:var(--s-300)}
@media (min-width:960px){.contact{grid-template-columns:1.2fr 1fr;gap:var(--s-400);align-items:start}}
.form{display:grid;gap:var(--s-200)}
.field label{display:block;font-weight:600;font-size:.875rem;line-height:1.25rem;margin-bottom:var(--s-75)}
.field input,.field textarea{width:100%;font:inherit;font-size:1rem;line-height:1.5rem;padding:var(--s-100) var(--s-200);border-radius:var(--r-xl);border:1px solid var(--line);background:var(--bg);color:var(--ink);transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}
.field input:hover,.field textarea:hover{border-color:var(--ink-2)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--ink);background:#fff}
.field textarea{min-height:160px;resize:vertical}
.field.has-error input,.field.has-error textarea{border-color:var(--red)}
.err{display:none;margin-top:var(--s-50);font-size:.875rem;line-height:1.25rem;color:var(--red-press);font-weight:500}
.has-error .err{display:block}
.check{display:flex;gap:var(--s-100);align-items:flex-start;font-size:.875rem;line-height:1.25rem;color:var(--ink-2)}
.check input{width:20px;height:20px;accent-color:var(--red);flex:none;margin:0}
.hp{position:absolute;left:-9999px}
.form-msg{display:none;padding:var(--s-100) var(--s-200);border-radius:var(--r-xl);font-weight:500}
.form-msg.ok{display:block;background:#E5EEDF;color:#33502A}
.form-msg.bad{display:block;background:#FBE1DF;color:var(--red-press)}
.btn.is-loading{pointer-events:none;opacity:.7}
.clist{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-100)}
.clist a{display:flex;gap:var(--s-100);align-items:center;padding:var(--s-100);border-radius:var(--r-2xl);border:1px solid var(--line);text-decoration:none;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.clist a:hover{border-color:var(--ink);transform:translateY(-2px)}
.clist .ico{width:40px;height:40px;border-radius:var(--r-full);background:var(--red);color:#fff;display:grid;place-items:center;flex:none}
.clist .ico svg{width:20px;height:20px}
.clist small{display:block;font-size:.75rem;line-height:1rem;color:var(--ink-2)}
.clist b{font-weight:600;word-break:break-word}

/* Legal / 404 */
.prose{max-width:720px}
.prose h2{font-size:1.5rem;line-height:2rem;margin:var(--s-600) 0 var(--s-100)}
.prose p,.prose li{color:var(--ink-2)}
.prose p+p{margin-top:var(--s-100)}
.prose ul{padding-left:var(--s-300);margin:var(--s-100) 0}
.todo{background:#FFF1C2;border-radius:var(--r-md);padding:0 var(--s-50)}
.notfound{min-height:100svh;display:grid;place-items:center;text-align:center;padding:var(--s-900) var(--gutter)}
.notfound img{width:160px;margin:0 auto var(--s-400)}
.notfound h1{font-size:3rem;line-height:1;margin-bottom:var(--s-200)}
.notfound p{color:var(--ink-2);max-width:480px;margin:0 auto var(--s-400)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:1ms!important;animation:none!important}
  .reveal{opacity:1;transform:none;filter:none}
}

/* ---------- Línea discontinua de scroll (assets/js/trail.js) ---------- */
#main{position:relative}
.trail{position:absolute;left:0;top:0;width:100%;height:0;overflow:visible;pointer-events:none;z-index:1}
.trail__line{stroke:var(--red)}
/* el contenido de cada sección queda por encima de la línea */
:where(#main > section:not(.scrolly)) > *{position:relative;z-index:2}
.trail-end{padding-block:var(--s-700) var(--s-800);display:flex;justify-content:center}
.trail-end svg{width:min(280px,64vw);height:auto;fill:var(--red);overflow:visible}
.trail-end .ld{opacity:0;transform:translateY(-6px);transition:opacity 250ms var(--ease) calc(var(--i)*90ms),transform 250ms var(--ease) calc(var(--i)*90ms)}
.trail-end .is-lit .ld{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.trail-end .ld{transition:none}}

/* ---------- Paradas de la línea: iconos que la línea rodea con un círculo ---------- */
.menu-layout{display:grid;gap:var(--s-600)}
.trail-stop{width:120px;margin:var(--s-700) 0 var(--s-400) var(--s-500)}
.trail-stop svg{display:block;width:100%;height:auto;color:var(--red);overflow:visible}
@media (min-width:900px){
  .menu-layout{grid-template-columns:168px minmax(0,1fr);gap:var(--s-700);align-items:start}
  .trail-stop{width:136px;margin-top:340px;margin-left:max(-150px, calc(80px - max(var(--gutter), (100vw - var(--maxw)) / 2 + var(--gutter))))}
}

/* ---------- Iconos propios (assets/icons) en "Por qué venir" ---------- */
.benefit .ico--lv{width:72px;height:72px;margin:calc(-1 * var(--s-75)) 0 var(--s-75) calc(-1 * var(--s-75));background:none;border-radius:0}
.benefit .ico--lv svg{width:72px;height:72px;overflow:visible}

/* ---------- Paso de la línea por las tarjetas de "Por qué venir" ---------- */
.trail-thru > *{position:static}            /* la línea va por encima de las tarjetas */
.benefit.reveal{transition-property:opacity,transform,filter,background-color,border-color;transition-duration:900ms,900ms,900ms,700ms,700ms;transition-timing-function:var(--ease)}
.benefit.is-lit:nth-child(4n+1){background:color-mix(in srgb,var(--orange) 16%,var(--surface));border-color:color-mix(in srgb,var(--orange) 45%,var(--line))}
.benefit.is-lit:nth-child(4n+2){background:color-mix(in srgb,var(--wine) 10%,var(--surface));border-color:color-mix(in srgb,var(--wine) 30%,var(--line))}
.benefit.is-lit:nth-child(4n+3){background:color-mix(in srgb,var(--sage) 18%,var(--surface));border-color:color-mix(in srgb,var(--sage) 45%,var(--line))}
.benefit.is-lit:nth-child(4n+4){background:color-mix(in srgb,var(--red) 12%,var(--surface));border-color:color-mix(in srgb,var(--red) 35%,var(--line))}

/* ---------- Números propios (assets/icons/numero-*.svg) en "Tres pasos" ---------- */
.step__n--ico{display:block;width:84px;height:84px;margin:calc(-1 * var(--s-75)) 0 var(--s-75) calc(-1 * var(--s-75))}
.step__n--ico svg{display:block;width:100%;height:100%;overflow:visible}

/* ---------- Iconos propios en las tarjetas de "Dónde estamos" ---------- */
.panel__ico{display:block;width:72px;height:72px;margin:calc(-1 * var(--s-75)) 0 var(--s-100) calc(-1 * var(--s-75));color:var(--red)}
.panel__ico svg{display:block;width:100%;height:100%;overflow:visible}

/* ---------- Icono propio en "Preguntas frecuentes" ---------- */
.head__ico{display:block;width:72px;height:72px;color:var(--red)}
.head__ico svg{display:block;width:100%;height:100%;overflow:visible}

/* ---------- Scroll suave (assets/js/smooth.js + Lenis) ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:clip}
.lenis.lenis-smooth iframe{pointer-events:none}

/* ---------- Hero: slider de imágenes (assets/js/hero-slider.js) ---------- */
.hslider{position:relative;height:100svh;min-height:560px;overflow:hidden;background:var(--dark);touch-action:pan-y}
.hslider__imgs,.hslider__img{position:absolute;inset:0}
.hslider__imgs{z-index:0}
.hslider__img{opacity:0;transition:opacity 1200ms var(--ease)}
.hslider__img img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 7000ms linear}
.hslider__img.is-active{opacity:1}
.hslider__img.is-active img{transform:scale(1)}
.hslider .scrolly__shade{z-index:1;background:rgba(19,18,9,.56)}
/* las fotos son más claras que el vídeo: título en blanco liso para que se lea */
.hslider .hero-title{background:none;color:#fff;-webkit-text-fill-color:#fff;text-shadow:0 1px 24px rgba(19,18,9,.35)}
.hslider .chapter__sub{color:#fff;text-shadow:0 1px 16px rgba(19,18,9,.4)}
.hslider .chapters{z-index:2;pointer-events:none}
.hslider .chapter.is-active{pointer-events:auto}
.hslider__bar{z-index:3}
.hslider__dots button{position:relative;flex:1;height:20px;padding:0;border:0;background:none;cursor:pointer}
.hslider__dots button::before{content:"";position:absolute;left:0;right:0;top:8px;height:4px;border-radius:var(--r-full);background:rgba(255,255,255,.24)}
.hslider__dots i{position:absolute;left:0;right:0;top:8px;height:4px;border-radius:var(--r-full);background:#fff;transform-origin:left;transform:scaleX(0)}
.hslider__dots button.is-done i{transform:scaleX(1)}
.hslider__dots button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.hslider__nav{display:none;gap:var(--s-75)}
@media (min-width:768px){.hslider__nav{display:flex}}
.hslider__btn{width:44px;height:44px;border-radius:var(--r-full);border:1px solid rgba(255,255,255,.3);background:rgba(19,18,9,.35);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.hslider__btn:hover{background:rgba(19,18,9,.6)}
.hslider__btn:active{transform:scale(.96)}
.hslider__btn svg{width:18px;height:18px}
@media (prefers-reduced-motion:reduce){.hslider__img,.hslider__img img{transition:none;transform:none}}

/* ---------- Header en móvil: barra a lo ancho + menú a pantalla completa ---------- */
@media (max-width:899px){
  .nav{padding-inline:var(--s-100)}
  .nav__pill{width:100%;max-width:560px;justify-content:space-between;margin-top:var(--s-100);padding:var(--s-50) var(--s-50) var(--s-50) var(--s-200);background:rgba(255,253,251,.9);border-color:rgba(230,203,182,.7);box-shadow:0 6px 24px rgba(43,27,25,.10);transition:background-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}
  .nav__brand{margin-right:0}
  .nav__brand img{height:44px}
  .burger{display:inline-flex;align-items:center;width:auto;height:44px;padding:0 44px 0 var(--s-200);font:600 .875rem/1 "Manrope",system-ui,sans-serif;letter-spacing:.01em}
  .burger::before{content:"Menú"}
  .menu-open .burger::before{content:"Cerrar"}
  .burger span{left:auto;right:18px;width:16px}
  .burger span:nth-child(1){top:18px}.burger span:nth-child(2){top:24px}
  .menu-open .burger span:nth-child(1){top:21px;transform:rotate(45deg)}
  .menu-open .burger span:nth-child(2){top:21px;transform:rotate(-45deg)}
  .menu-open .nav__pill{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}

  .overlay{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none;justify-content:flex-start;padding:calc(var(--s-900) + var(--s-200)) var(--s-300) var(--s-400);overflow-y:auto}
  .overlay ul{gap:0;counter-reset:nav}
  .overlay li{border-bottom:1px solid var(--line)}
  .overlay a.big{display:flex;align-items:baseline;justify-content:space-between;padding-block:var(--s-200);font-size:2.5rem;line-height:1;letter-spacing:-0.02em}
  .overlay a.big::after{counter-increment:nav;content:"0" counter(nav);font-size:.875rem;line-height:1.25rem;font-weight:600;letter-spacing:0;color:var(--ink-2)}
  .overlay a.big[aria-current="page"]::after{color:var(--red)}
  .overlay__foot{margin-top:auto;padding-top:var(--s-500);gap:var(--s-100)}
  .overlay__foot .btn{width:100%;padding-block:var(--s-100)}
  .overlay__foot .link{justify-self:start}
  .menu-open .quickbar{opacity:0;pointer-events:none}
}

/* ---------- Ajustes de móvil (assets/js/movil.js) ---------- */
/* header que se oculta al bajar y vuelve al subir */
.nav{transition:transform 450ms var(--ease)}
@media (max-width:899px){
  .nav-hidden .nav{transform:translateY(calc(-100% - var(--s-200)))}
  .menu-tabs{transition:top 450ms var(--ease)}
  .nav-hidden .menu-tabs{top:0}
}
/* flechas de las pestañas deslizables */
.tabs-scroller{position:relative;max-width:max-content;margin-inline:auto}
@media (max-width:767px){.tabs-scroller{max-width:100%}}
.tabs-arrow{position:absolute;top:50%;width:36px;height:36px;margin-top:-18px;border-radius:var(--r-full);border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 14px rgba(43,27,25,.18);opacity:0;visibility:hidden;transition:opacity 250ms var(--ease),visibility 250ms var(--ease),transform 250ms var(--ease);z-index:2}
.tabs-arrow svg{width:16px;height:16px}
.tabs-arrow:active{transform:scale(.94)}
.tabs-arrow--prev{left:-6px}
.tabs-arrow--next{right:-6px}
.tabs-arrow.is-on{opacity:1;visibility:visible}
.tabs-arrow.tabs-arrow--next.is-on{animation:tabs-nudge 1.6s var(--ease) 2}
@keyframes tabs-nudge{50%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.nav,.menu-tabs{transition:none}.tabs-arrow.is-on{animation:none}}

/* ---------- Header siempre por encima del contenido ----------
   El contenido (#main) forma su propio nivel por debajo del header, y el
   header va en su propia capa. Evita que en Safari/iOS las fotos animadas
   o con transform (hero de Nosotros, timeline horizontal) se pinten encima
   del header fijo. */
#main{position:relative;z-index:0;isolation:isolate}
.nav{z-index:1000;will-change:transform;-webkit-transform:translateZ(0);transform:translateZ(0)}
.overlay{z-index:990}
@media (max-width:899px){.nav-hidden .nav{-webkit-transform:translate3d(0,calc(-100% - var(--s-200)),0);transform:translate3d(0,calc(-100% - var(--s-200)),0)}}
.skip{z-index:1100}
/* con el visor de fotos abierto, el header no se muestra encima */
body:has(.lightbox.is-open) .nav{opacity:0;pointer-events:none}

/* ---------- Contacto: datos → horario → formulario, con pastillas de acceso rápido ---------- */
.quick-pills{display:flex;flex-wrap:wrap;gap:var(--s-75);margin-top:var(--s-400)}
.quick-pills a{display:inline-flex;align-items:center;gap:var(--s-75);padding:var(--s-75) var(--s-200) var(--s-75) var(--s-100);border-radius:var(--r-full);border:1px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none;font-weight:600;font-size:.875rem;line-height:1.25rem;transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.quick-pills a svg{width:20px;height:20px;flex:none;color:var(--red)}
.quick-pills a:hover{border-color:var(--ink);transform:translateY(-2px)}
.quick-pills a:active{transform:scale(.98)}
.contact--v2{align-items:stretch}
@media (min-width:960px){.contact--v2{grid-template-columns:1fr 1fr}.contact--v2 .contact__form{grid-column:1 / -1}}
.contact--v2 .contact__form .form{max-width:720px}
#datos,#horario,#mensaje{scroll-margin-top:calc(var(--s-900) + var(--s-200))}
