/* Luz y Tierra · mockup · hoja base de la web pública
   Paleta validada en impresos. No añadir colores.
   Recursos de diseño: papel con grano, filetes finos, el sello como marca de agua,
   la hoja del logo como ornamento, tipografía Lora grande. Sin degradados ni sombras. */

:root{
  --papel:#F3EEE5;
  --tinta:#1F1E1C;
  --texto:#3B3A37;
  --etiqueta:#8C867B; /* 3,1:1 sobre papel: no pasa AA en texto; solo para bordes, barras y marcas de agua */
  --linea:#CDC5B6;
  --oscuro:#4A2826;
  --acento:#5B2B28;
  --crema:#EFE9DD;
  --crema-2:#A9A296;

  --serif:"Lora", Georgia, "Times New Roman", serif;
  --sans:"Poppins", "Helvetica Neue", Arial, sans-serif;

  --ancho:1180px;
  --prosa:62ch;
  --lado:20px;
  --salto:64px;
  --s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px;
  --radio:3px;
  --grano:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/></filter><rect width='160' height='160' filter='url(%23g)'/></svg>");
}

/* ---------- Reset mínimo ---------- */
*,*::before,*::after{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(--papel);
  color:var(--texto);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.6;
  font-variant-numeric:tabular-nums;
  position:relative;
}
/* grano de papel: una capa fija, muy leve, detrás de todo */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:var(--grano);opacity:.09}
img,svg,video{display:block;max-width:100%;height:auto}
img{background:var(--papel)}
a{color:var(--tinta);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--linea);transition:text-decoration-color .2s}
a:hover{text-decoration-color:var(--acento)}
:focus-visible{outline:2px solid var(--acento);outline-offset:3px;border-radius:2px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;color:var(--tinta);line-height:1.1;margin:0 0 .5em;letter-spacing:-.012em;text-wrap:balance}
h2{margin-bottom:var(--s3)}
h3{margin-bottom:var(--s2)}
/* módulos apilados dentro de una columna: aire entre ellos */
.sec .dos > div > * + h2,.sec .dos > div > * + h3,.sec .dos > div > * + .foto,.sec .dos > div > * + .cita,.sec .dos > div > * + table,.sec .cont > * + h2{margin-top:var(--s4)}
.sec .dos > div > p + p{margin-top:0}
.sec .dos > div > .nota-pie + .foto{margin-top:var(--s4)}
.sec .dos > div > .foto + .nota-pie{margin-top:var(--s3)}
.sec .dos > div > .semana + .nota-pie,.sec .dos > div > table + .nota-pie{margin-top:var(--s2)}
h1{font-size:42px;line-height:1.05}
h2{font-size:30px}
h3{font-size:22px}
h4{font-size:19px}
p{margin:0 0 1em}
em{font-style:italic}
hr{border:0;border-top:1px solid var(--linea);margin:var(--salto) 0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:14px 0;border-bottom:1px solid var(--linea);vertical-align:baseline}
th{font-weight:400;color:var(--tinta)}
small{font-size:.88em}
ul,ol{padding-left:1.2em}
::selection{background:var(--oscuro);color:var(--crema)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Etiqueta Poppins: solo donde da un dato ---------- */
.et{
  font-family:var(--sans);font-weight:300;font-size:11px;
  letter-spacing:.3em;text-transform:uppercase;color:var(--texto);
  display:block;margin-bottom:.9em;
}
.et--inline{display:inline;margin:0}
.oscuro .et,.reveal .et{color:var(--crema-2)}

/* marcadores de datos pendientes y ejemplos */
.dato,.ej{
  font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--linea);padding:.1em .5em;border-radius:3px;color:var(--texto);
  white-space:normal;vertical-align:middle;line-height:1.9;-webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.ej{border-style:dashed}
.oscuro .dato,.oscuro .ej,.reveal .dato,.reveal .ej{color:var(--crema-2);border-color:var(--crema-2)}

/* ---------- Contenedores ---------- */
.cont{width:100%;max-width:var(--ancho);margin:0 auto;padding:0 var(--lado)}
.prosa{max-width:var(--prosa)}
.sec{padding:var(--salto) 0}
.sec--linea{border-top:1px solid var(--linea)}
.oscuro{background:var(--oscuro);color:var(--crema)}
.oscuro h1,.oscuro h2,.oscuro h3,.oscuro a{color:var(--crema)}
.oscuro .mute{color:var(--crema-2)}
.mute{color:var(--texto)}

/* Cabecera de sección: filete de tinta sobre el título, nota a la derecha */
.sec > .cont > h2:first-child,
.sec > .cont > .dos > div > h2:first-child,
.sec > .cont.dos > div > h2:first-child,
.sec > .cont > .dos > h2:first-child,
.sec-cab{border-top:1px solid var(--tinta);padding-top:16px;margin-top:0}
.sec-cab{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:var(--s3)}
.sec-cab h2{border:0;padding:0;margin:0}
.sec-cab .nota{font-size:15px;color:var(--texto);font-style:italic}

/* Ornamento: filete — hoja — filete */
.orn{display:flex;align-items:center;gap:14px;margin:calc(var(--salto) * .55) auto;max-width:var(--ancho);padding:0 var(--lado);color:var(--etiqueta)}
.orn::before,.orn::after{content:"";flex:1;border-top:1px solid var(--linea)}
.orn svg{width:14px;height:14px;fill:var(--acento);flex:none}

/* ---------- Barra de mockup de la web: acceso visible al panel ---------- */
.mock-web{background:var(--tinta);color:var(--crema-2);display:flex;align-items:center;justify-content:center;gap:18px;min-height:38px;padding:6px var(--lado);font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.25em;text-transform:uppercase;flex-wrap:wrap}
.mock-web a{color:var(--crema);text-decoration:none;display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(239,233,221,.4);border-radius:18px;padding:5px 12px;letter-spacing:.15em;transition:background .2s}
.mock-web a:hover{background:var(--oscuro);border-color:var(--crema)}
.mock-web a .ico{width:16px;height:16px;color:var(--crema)}
.nav-panel{display:inline-flex;align-items:center;gap:7px}
.nav-d .nav-panel{border:1px solid var(--linea);border-radius:18px;padding:6px 12px 6px 9px;margin-left:18px;font-size:14px}
.nav-d .nav-panel::after{content:none}
.nav-d .nav-panel:hover{border-color:var(--tinta)}
.nav-d .nav-panel .ico{width:16px;height:16px}
.nav-m .nav-panel{background:var(--crema);margin-top:6px}
.nav-m .nav-panel .ico{width:18px;height:18px;margin-right:4px}

/* ---------- Barra de utilidad (escritorio) ---------- */
.util{display:none;border-bottom:1px solid var(--linea);font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--texto)}
.util .cont{display:flex;justify-content:space-between;gap:24px;min-height:34px;align-items:center}
.util a{text-decoration:none;color:inherit}
.util a:hover{color:var(--acento)}

/* ---------- Cabecera ---------- */
.top{position:sticky;top:0;z-index:20;background:var(--papel);border-bottom:1px solid var(--linea)}
.top .cont{display:flex;align-items:center;gap:16px;min-height:66px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.marca svg{width:34px;height:34px;flex:none;color:var(--tinta)}
.marca b{font-weight:400;color:var(--tinta);font-size:20px;line-height:1;letter-spacing:.01em}
.marca small{display:block;color:var(--texto);font-size:12px;line-height:1.2;margin-top:4px;font-style:italic}
.nav-d{display:none}
.nav-d a{position:relative;text-decoration:none;color:var(--texto);padding:22px 0;margin-left:26px;font-size:16px}
.nav-d a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--tinta);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.nav-d a:hover::after,.nav-d a[aria-current]::after{transform:scaleX(1)}
.nav-d a[aria-current]{color:var(--tinta)}
.nav-m{position:relative}
.nav-m summary{list-style:none;cursor:pointer;font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;padding:10px 0 10px 10px;display:flex;align-items:center;gap:10px}
.nav-m summary::before{content:"";width:18px;height:9px;border-top:1px solid var(--tinta);border-bottom:1px solid var(--tinta)}
.nav-m[open] summary::before{border-bottom-color:transparent}
.nav-m summary::-webkit-details-marker{display:none}
.nav-m nav{position:absolute;right:-20px;top:100%;margin-top:14px;background:var(--papel);border:1px solid var(--linea);border-right:0;min-width:260px;padding:6px 0 10px}
.nav-m nav a{display:flex;justify-content:space-between;padding:12px 22px;text-decoration:none;color:var(--tinta);border-bottom:1px solid var(--linea);font-size:19px}
.nav-m nav a::after{content:"→";color:var(--acento);opacity:0;transition:opacity .2s}
.nav-m nav a:hover::after,.nav-m nav a[aria-current]::after{opacity:1}
.nav-m nav a:last-child{border-bottom:0}
.nav-m nav a[aria-current]{color:var(--acento)}
.top .btn{display:none}
/* Menú "Más" en escritorio */
.nav-mas{position:relative;display:inline-block;margin-left:26px}
.nav-mas summary{list-style:none;cursor:pointer;color:var(--texto);font-size:16px;padding:22px 0;display:inline-flex;align-items:center;gap:6px;position:relative}
.nav-mas summary::-webkit-details-marker{display:none}
.nav-mas summary::after{content:"";width:6px;height:6px;border-right:1px solid var(--texto);border-bottom:1px solid var(--texto);transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.nav-mas[open] summary::after{transform:rotate(225deg) translateY(-2px)}
.nav-mas summary[aria-current]{color:var(--tinta)}
.nav-mas summary[aria-current]::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--tinta)}
.nav-mas-lista{position:absolute;right:0;top:100%;margin-top:-1px;background:var(--papel);border:1px solid var(--linea);min-width:280px;padding:6px 0;z-index:30;box-shadow:0 12px 30px rgba(31,30,28,.08)}
.nav-mas-lista a{display:flex;flex-direction:column;gap:2px;padding:12px 20px;text-decoration:none;color:var(--tinta);border-bottom:1px solid var(--linea);font-size:17px}
.nav-mas-lista a:last-child{border-bottom:0}
.nav-mas-lista a small{font-size:13px;font-style:italic;color:var(--texto)}
.nav-mas-lista a:hover{background:var(--crema)}
.nav-mas-lista a[aria-current]{color:var(--acento)}
.nav-m .nav-m-sec{font-size:16px;color:var(--texto);padding-top:9px;padding-bottom:9px}
.nav-m nav a.nav-m-sec:first-of-type{border-top:0}

/* ---------- Banda de hoy (debajo de la cabecera) ---------- */
.banda-hoy{border-bottom:1px solid var(--linea);background:var(--papel)}
.banda-hoy .cont{display:flex;align-items:center;gap:12px;min-height:44px;font-size:15px;flex-wrap:nowrap}
.banda-hoy .txt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.banda-hoy .et{margin:0;color:var(--acento)}
.banda-hoy .punto{width:6px;height:6px;border-radius:50%;background:var(--acento);flex:none}
.banda-hoy .plato{color:var(--tinta)}
.banda-hoy a{margin-left:auto;white-space:nowrap}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;background:var(--acento);color:var(--crema);text-decoration:none;
  padding:15px 24px;border-radius:var(--radio);font-size:17px;line-height:1.2;border:1px solid var(--acento);
  transition:background .2s,border-color .2s;
}
.btn::after{content:"→";transition:transform .2s}
.btn:hover{background:var(--oscuro);border-color:var(--oscuro);text-decoration:none}
.btn:hover::after{transform:translateX(3px)}
.btn:active{transform:translateY(1px)}
.btn--claro{background:transparent;color:var(--tinta);border-color:var(--tinta)}
.btn--claro:hover{background:var(--tinta);color:var(--crema)}
.oscuro .btn--claro,.reveal .btn--claro{color:var(--crema);border-color:var(--crema)}
.oscuro .btn--claro:hover,.reveal .btn--claro:hover{background:var(--crema);color:var(--oscuro)}
.btn--peq{padding:9px 14px;font-size:15px}
.btn--sin::after{content:none}
.cta-nota{display:block;margin-top:10px;color:var(--texto);font-size:15px;font-style:italic}
.flecha{text-decoration:none;border-bottom:1px solid var(--linea);transition:border-color .2s}
.flecha::after{content:" \2192";color:var(--acento);display:inline-block;transition:transform .2s}
.flecha:hover{border-color:var(--acento)}
.flecha:hover::after{transform:translateX(3px)}

/* CTA fijo en móvil */
.cta-movil{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--papel);border-top:1px solid var(--linea);padding:10px var(--lado) calc(10px + env(safe-area-inset-bottom))}
.cta-movil .cont{display:flex;align-items:center;gap:12px;padding:0}
.cta-movil .btn{flex:1;justify-content:center;padding:13px 16px}
.cta-movil small{font-size:13px;color:var(--texto);line-height:1.3;max-width:40%}
body.con-cta{padding-bottom:96px}

/* ---------- Hero ---------- */
.hero{padding:44px 0 40px;position:relative;overflow:hidden}
.hero .cont{position:relative}
.hero h1{margin:0 0 .55em}
.hero .lead{font-size:19px;max-width:36ch;margin-bottom:1.5em}
.hero .datos{color:var(--texto);font-size:15px;margin-top:26px;line-height:1.55;border-top:1px solid var(--linea);padding-top:14px;max-width:40ch}
.hero .datos a{color:inherit}
.hero-grid{display:grid;gap:36px}
/* marca de agua: el sello en filete, detrás del titular */
.hero .agua{position:absolute;right:-180px;top:-30px;width:400px;height:400px;color:var(--tinta);opacity:.05;pointer-events:none}
.hero .agua svg{width:100%;height:100%}

/* El menú de hoy como ticket (cabecera del Inicio) */
.ticket{border:1px solid var(--tinta);padding:22px 22px 18px;position:relative;background:var(--papel);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
.ticket .cab{display:flex;flex-direction:column-reverse;gap:6px;border-bottom:1px solid var(--tinta);padding-bottom:12px;margin-bottom:6px;padding-right:84px}
.ticket .cab h3{margin:0;font-size:22px}
.ticket .cab .et{margin:0}
.ticket .fecha{font-style:italic;color:var(--texto);font-size:15px;margin:0 0 4px}
.menu-dia{list-style:none;padding:0;margin:0}
.menu-dia li{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--linea)}
.menu-dia li:last-child{border-bottom:0}
.menu-dia img{width:72px;height:54px;object-fit:cover;border:1px solid var(--linea)}
.menu-dia .et--inline{display:block;margin:0 0 2px;font-size:10px}
.menu-dia .plato-t{color:var(--tinta);line-height:1.3;display:block}
.menu-dia .alt{display:block;font-size:14px;color:var(--texto);font-style:italic;margin-top:2px}
.ticket .pie-t{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--tinta);padding-top:14px;margin-top:6px;flex-wrap:wrap}
.ticket .pie-t .p{font-size:19px;color:var(--tinta)}
.ticket .pie-t .p small{font-size:13px;color:var(--texto);font-style:italic}
.sellos{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.3em;text-transform:uppercase;margin:10px 0 0;color:var(--texto)}
.ticket .cartel-mini{position:absolute;right:18px;top:-18px;width:64px;transform:rotate(3deg);border:1px solid var(--linea);background:var(--papel);padding:3px}
.ticket .cartel-mini img{display:block;width:100%}

/* Franja de foto a todo el ancho */
.franja{margin:0;position:relative}
.franja img{width:100%;aspect-ratio:21/9;object-fit:cover;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.franja figcaption{position:absolute;left:max(var(--lado),calc((100% - var(--ancho)) / 2 + var(--lado)));bottom:16px;background:var(--papel);padding:6px 12px;font-size:13px;border:1px solid var(--linea)}

/* ---------- Fotos (reales o marcador) ---------- */
.foto{margin:0;position:relative}
.foto img{width:100%;height:auto;border:1px solid var(--linea)}
.foto figcaption{font-size:14px;color:var(--texto);margin-top:14px;font-style:italic;line-height:1.5;max-width:52ch}
.foto--4x3 img{aspect-ratio:4/3;object-fit:cover}
.foto--3x4 img{aspect-ratio:3/4;object-fit:cover}
.foto--16x9 img{aspect-ratio:16/9;object-fit:cover}
/* esquinas de registro, como en una prueba de imprenta */
.foto::before,.foto::after{content:"";position:absolute;width:14px;height:14px;border:1px solid var(--tinta);pointer-events:none}
.foto::before{left:-7px;top:-7px;border-right:0;border-bottom:0}
.foto::after{right:-7px;bottom:-7px;border-left:0;border-top:0}
.foto--claro img{border-color:rgba(239,233,221,.4)}
.foto--claro::before,.foto--claro::after{border-color:var(--crema)}
.foto--claro figcaption{color:var(--crema-2)}
.reveal .foto{margin-top:8px}
/* Bodegón: dos fotos solapadas, una grande y una pequeña, con pie */
.bodegon{position:relative;padding:0 0 28px 0;margin-top:8px}
.bodegon .foto{margin:0 36px 0 0}
.bodegon .foto--peq{position:absolute;right:0;bottom:36px;width:42%;background:var(--papel);padding:8px;margin:0}
.bodegon .foto--peq img{border-color:var(--linea)}
.bodegon .foto--peq::before,.bodegon .foto--peq::after{display:none}
.bodegon .bod-pie{font-size:14px;font-style:italic;color:var(--texto);margin:16px 0 0;max-width:52%}
.dos--lista{align-items:start}

/* ---------- Ficha del hero: tres datos en una línea ---------- */
.hero-datos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:28px 0 0;padding:0;border-top:1px solid var(--tinta);max-width:560px}
.hero-datos > div{padding:12px 14px 12px 0;border-bottom:1px solid var(--linea)}
.hero-datos > div + div{border-left:1px solid var(--linea);padding-left:14px}
.hero-datos dt{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto);margin:0 0 4px}
.hero-datos dd{margin:0;font-size:17px;line-height:1.3;color:var(--tinta)}
.hero-datos dd small{display:block;font-size:13px;color:var(--texto);font-style:italic}
.et--icono{display:inline-flex;align-items:center;gap:8px}
.et--icono svg{width:18px;height:18px;color:var(--acento);flex:none}

/* ---------- Pieza: un objeto de papel dentro del bloque oscuro ---------- */
.pieza{position:relative;background:var(--papel);color:var(--tinta);border:1px solid var(--tinta);padding:22px 22px 20px;box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px var(--linea),10px 12px 0 rgba(0,0,0,.18);max-width:420px;margin:0 auto}
.pieza::before{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.18;pointer-events:none}
.pieza > *{position:relative}
.pieza .et{color:var(--texto);display:block;margin-bottom:8px}
.pieza h3{font-size:22px;line-height:1.2;margin:0 0 14px}
.pieza .dato,.pieza .ej{color:var(--texto);border-color:var(--linea)}
.reveal .pieza p{color:var(--tinta);font-size:15px;max-width:none}
.reveal .pieza .mute,.pieza .mute{color:var(--texto)}
.reveal .pieza a:not(.btn){color:var(--tinta)}
.pieza-filas{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.pieza-filas li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--linea);font-size:15px}
.pieza-filas li .n{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--texto);min-width:64px}
.pieza-filas li .s{font-size:13px;color:var(--texto);font-style:italic;display:block}
.pieza-filas li .d{color:var(--texto);font-size:14px;white-space:nowrap}
.pieza-filas li.entre{grid-template-columns:1fr;font-size:13px;color:var(--texto);font-style:italic;padding:6px 0 6px 76px;border-bottom:1px dashed var(--linea)}
.pieza-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--tinta)}
.pieza-total b{font-size:28px;font-weight:400}
.pieza-total small{font-size:13px;color:var(--texto)}
.pieza-sello{position:absolute;right:-14px;top:-18px;width:96px;height:96px;transform:rotate(8deg);color:var(--acento);display:grid;place-items:center;pointer-events:none}
.pieza-sello span{font-family:var(--sans);font-weight:300;font-size:9px;letter-spacing:.18em;text-transform:uppercase;text-align:center;line-height:1.3;border:1px solid var(--acento);border-radius:50%;width:96px;height:96px;display:grid;place-items:center;padding:8px;background:var(--papel);box-shadow:inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--acento)}
/* pieza bono */
.sellos-b{list-style:none;margin:6px 0 0;padding:16px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;border-top:1px solid var(--tinta)}
.sellos-b li{aspect-ratio:1;border:1px dashed var(--linea);border-radius:50%;display:grid;place-items:center;position:relative;color:var(--texto);font-size:12px;font-style:italic}
.sellos-b li.usada{border:1px solid var(--acento);color:var(--acento);box-shadow:inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--acento);transform:rotate(-6deg)}
.sellos-b li.usada svg{width:34%;height:34%;color:var(--acento);position:absolute;top:18%;left:33%}
.sellos-b li.usada span{position:absolute;bottom:14%;font-family:var(--sans);font-weight:300;font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-style:normal}
.sellos-b li:nth-child(2).usada{transform:rotate(5deg)}
.pieza-total b{white-space:nowrap}
/* pieza con QR (tarjeta de mesa) */
.pieza--mesa{text-align:center;max-width:300px}
.pieza--mesa .qr{width:124px;height:124px;margin:12px auto 8px;color:var(--tinta);display:block}
.pieza--mesa h3{font-size:24px;font-style:italic;margin-bottom:4px}
.pieza--mesa .pie-m{font-size:13px;color:var(--texto);margin:10px 0 0;border-top:1px solid var(--linea);padding-top:10px}
/* pieza vídeo */
.pieza--video{padding:10px 10px 18px;max-width:440px}
.pieza--video .marco-v{position:relative;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--tinta);background:var(--tinta)}
.pieza--video .marco-v img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85}
.pieza--video .play{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;border:1px solid var(--crema);background:rgba(31,30,28,.45)}
.pieza--video .play::after{content:"";position:absolute;left:22px;top:17px;border-left:16px solid var(--crema);border-top:11px solid transparent;border-bottom:11px solid transparent}
.pieza--video .tiempo{position:absolute;right:10px;bottom:10px;font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.1em;color:var(--crema);background:rgba(31,30,28,.6);padding:3px 7px}
.pieza--video .barra-v{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(239,233,221,.3)}
.pieza--video .barra-v i{display:block;height:100%;width:34%;background:var(--crema)}
.pieza--video .cuerpo-v{padding:14px 12px 0}
.pieza--video h3{font-size:19px;margin-bottom:4px}
.pieza--video .capit{list-style:none;margin:10px 0 0;padding:0;border-top:1px solid var(--linea)}
.pieza--video .capit li{display:flex;gap:12px;padding:7px 0;border-bottom:1px solid var(--linea);font-size:14px}
.pieza--video .capit .m{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.1em;color:var(--texto);min-width:40px;padding-top:3px}
.pieza--video .capit .ahora{color:var(--acento)}
/* pieza decisión (garantía) */
.pieza--decide{max-width:420px}
.ramas{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.ramas > div{border:1px solid var(--linea);padding:12px 14px;position:relative}
.ramas > div::before{content:"";position:absolute;left:50%;top:-13px;height:12px;border-left:1px solid var(--tinta)}
.ramas b{display:block;font-weight:400;font-size:18px;margin-bottom:4px}
.reveal .ramas p,.ramas p{margin:0;font-size:14px;color:var(--texto)}
.ramas .si{border-color:var(--tinta)}
.reveal .pregunta-p,.pregunta-p{text-align:center;font-style:italic;font-size:19px;color:var(--tinta);margin:16px 0 0;padding-top:14px;border-top:1px solid var(--tinta);position:relative}
.pregunta-p::after{content:"";position:absolute;left:25%;right:25%;bottom:-13px;border-top:1px solid var(--tinta)}
@media (min-width:700px){
  .reveal .dos{grid-template-columns:1.15fr .85fr;align-items:center}
  .pieza{margin:0 0 0 auto}
}

/* ---------- Horario semanal (tabla) ---------- */
.horario-wrap{overflow-x:auto;margin:0 calc(-1 * var(--lado));padding:0 var(--lado)}
.horario-t{min-width:640px;border-top:1px solid var(--tinta)}
.horario-t th,.horario-t td{padding:10px 8px;vertical-align:top;border-bottom:1px solid var(--linea);font-size:15px}
.horario-t .cab td{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto);border-bottom:1px solid var(--tinta);padding-bottom:10px}
.horario-t th{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.12em;color:var(--texto);white-space:nowrap;width:96px;padding-left:0}
.horario-t td b{display:block;font-weight:400;color:var(--tinta);font-size:15px;line-height:1.25}
.horario-t td span{display:block;font-size:13px;font-style:italic;color:var(--texto)}
.horario-t td.c{background:var(--crema);box-shadow:inset 3px 0 0 var(--acento);padding-left:12px}
.horario-t tr.tarde th,.horario-t tr.tarde td{border-top:1px solid var(--tinta)}

/* ---------- Catálogo: pestañas por familia (sin JS, con :target) ---------- */
.tabs-fam{position:sticky;top:66px;z-index:5;background:var(--papel);margin-bottom:var(--s4)}
.tabs-fam ul{list-style:none;margin:0;padding:0;display:flex;gap:0;overflow-x:auto;border-bottom:1px solid var(--tinta);scrollbar-width:none}
.tabs-fam ul::-webkit-scrollbar{display:none}
.tabs-fam li{flex:none}
.tab-fam{display:flex;flex-direction:column;gap:2px;padding:14px 18px 12px 0;margin-right:18px;text-decoration:none;color:var(--texto);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;transition:color .2s,border-color .2s}
.tab-fam .tf-n{font-size:17px;color:var(--tinta)}
.tab-fam .tf-c{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto)}
.tab-fam:hover{border-bottom-color:var(--linea)}
.fam{display:none}
.fam:target{display:block}
.familias:not(:has(.fam:target)) .fam:first-child{display:block}
/* pestaña activa: la primera por defecto, la del :target si lo hay */
.catalogo:not(:has(.fam:target)) .tabs-fam li:first-child .tab-fam,
.catalogo:has(#salud:target) .tabs-fam a[href="#salud"],.catalogo:has(#mundo:target) .tabs-fam a[href="#mundo"],.catalogo:has(#practica:target) .tabs-fam a[href="#practica"],.catalogo:has(#tradicion:target) .tabs-fam a[href="#tradicion"],.catalogo:has(#fermentos:target) .tabs-fam a[href="#fermentos"]{border-bottom-color:var(--acento)}
.catalogo:not(:has(.fam:target)) .tabs-fam li:first-child .tf-c,
.catalogo:has(#salud:target) .tabs-fam a[href="#salud"] .tf-c,.catalogo:has(#mundo:target) .tabs-fam a[href="#mundo"] .tf-c,.catalogo:has(#practica:target) .tabs-fam a[href="#practica"] .tf-c,.catalogo:has(#tradicion:target) .tabs-fam a[href="#tradicion"] .tf-c,.catalogo:has(#fermentos:target) .tabs-fam a[href="#fermentos"] .tf-c{color:var(--acento)}
.fam{scroll-margin-top:190px}
.fam-cab{display:grid;gap:var(--s3);margin-bottom:var(--s3);align-items:end}
.fam-cab h2{margin-bottom:8px;font-size:30px}
.fam-cab h2:first-child,.fam-cab > div > h2{border:0;padding:0;margin-top:0}
.fam-lema{font-size:18px;font-style:italic;color:var(--texto);max-width:44ch;margin:0}
.fam-foto{max-width:300px;justify-self:end}
.talleres{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.taller{border-bottom:1px solid var(--linea)}
.taller > a{display:grid;grid-template-columns:1fr;gap:6px 32px;padding:20px 8px;margin:0 -8px;align-items:baseline;transition:background .2s;text-decoration:none;color:inherit}
.taller > a:hover{background:var(--crema)}
.ta-ir{color:var(--acento);opacity:0;transition:opacity .2s;margin-left:6px}
.taller > a:hover .ta-ir,.taller > a:focus-visible .ta-ir{opacity:1}
.taller h3{margin:0 0 3px;font-size:21px;line-height:1.2}
.ta-desc{margin:0;color:var(--texto);font-style:italic;font-size:15.5px;max-width:58ch}
.ta-fecha{display:flex;gap:10px;align-items:baseline;white-space:nowrap;font-size:14px;color:var(--texto)}
.ta-fecha .et{margin:0}
.fam-pie{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:var(--s3);font-size:15px;color:var(--texto)}
.fam-pie b{font-weight:400;color:var(--tinta)}
@media (min-width:700px){
  .fam-cab{grid-template-columns:1fr 220px;align-items:center}
  .taller > a{grid-template-columns:1fr auto;padding:18px 12px;margin:0 -12px}
}
@media (min-width:1000px){
  .taller > a{grid-template-columns:minmax(0,62ch) 1fr}
  .ta-fecha{justify-self:end}
}
/* sesiones del Transforma dentro de la lista */
.lista li .fila--col{flex-direction:column;align-items:stretch;gap:10px;margin:0;padding-left:0;padding-right:0}
.sesiones{list-style:none;margin:0;padding:0 0 0 2px;display:grid;gap:6px}
.lista .sesiones li{display:flex;gap:12px;align-items:baseline;font-size:16px;color:var(--texto);border:0;padding:0}
.sesiones .n{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.15em;color:var(--acento);min-width:1.6em}

/* ---------- Escalones: los cuatro trimestres ---------- */
.escalones{list-style:none;margin:0 0 28px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);align-items:end;gap:0;height:182px;border-bottom:1px solid var(--tinta)}
.escalones li{position:relative;border:1px solid var(--tinta);border-bottom:0;margin-left:-1px;padding:10px 8px 8px;display:flex;flex-direction:column;gap:2px;background:var(--papel)}
.escalones li:first-child{margin-left:0}
.escalones li:nth-child(1){height:92px}.escalones li:nth-child(2){height:118px}.escalones li:nth-child(3){height:144px}.escalones li:nth-child(4){height:170px}
.escalones li:nth-child(1){background:var(--crema)}
.escalones .e-n{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto)}
.escalones .e-t{font-size:15px;line-height:1.15;color:var(--tinta)}
.escalones .e-s{font-size:11px;font-style:italic;color:var(--texto);margin-top:auto}
@media (max-width:420px){.escalones .e-s{display:none}}
@media (max-width:699px){.ta-ir{opacity:1;font-size:14px}}

/* ---------- Tres pasos: ven, come, llévatela ---------- */
.tres-pasos{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--tinta)}
.tres-pasos li{padding:16px 14px 16px 0;border-bottom:1px solid var(--linea)}
.tres-pasos li+li{border-left:1px solid var(--linea);padding-left:14px}
.tres-pasos svg{width:22px;height:22px;color:var(--acento);margin-bottom:8px;display:block}
.tres-pasos b{display:block;font-weight:400;font-size:19px;color:var(--tinta);margin-bottom:2px}
.tres-pasos span{font-size:14px;font-style:italic;color:var(--texto);line-height:1.4;display:block}
.tres-pasos + .cita{margin-top:var(--s4)}

/* ---------- Cierre de la tarjeta junto a un precio ---------- */
.cierre{display:grid;grid-template-columns:1fr;gap:12px 24px;align-items:center;margin-top:var(--s3);padding:18px 20px;background:var(--crema);border-left:2px solid var(--acento)}
.cierre p{margin:0;font-size:16px;color:var(--tinta)}
.cierre p b{font-weight:400;font-size:22px;display:block;line-height:1.1;margin-bottom:2px}
.cierre p small{display:block;font-size:14px;font-style:italic;color:var(--texto);margin-top:2px}
.cierre .btn{justify-self:start}
@media (min-width:700px){.cierre{grid-template-columns:1fr auto}}
/* ---------- Siguiente paso: cierre de cada página ---------- */
.siguiente{border-top:1px solid var(--tinta);margin-top:var(--salto);padding:56px 0 8px}
.siguiente .cont{display:grid;gap:20px;align-items:center}
.siguiente .et{margin-bottom:10px}
.siguiente h2{font-size:30px;margin-bottom:10px;max-width:22ch}
.siguiente p{max-width:48ch;margin:0 0 18px;color:var(--texto)}
.siguiente .enlace-ej{display:inline-block;margin-top:10px;font-family:var(--sans);font-weight:300;font-size:12px;letter-spacing:.1em;border:1px dashed var(--linea);padding:6px 10px;color:var(--texto)}
@media (min-width:700px){.siguiente .cont{grid-template-columns:1.2fr .8fr}.siguiente h2{font-size:36px}.siguiente .foto{max-width:360px;justify-self:end}}
@media (max-width:699px){body.con-cta main > :last-child{padding-bottom:24px}}

/* ---------- Datos clave (dl) ---------- */
.datos-clave{margin:28px 0 0;border-top:1px solid var(--tinta)}
.datos-clave > div{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--linea)}
.datos-clave dt{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto);padding-top:4px}
.datos-clave dd{margin:0;font-size:16px;color:var(--texto)}

/* ---------- Tira de fotos ---------- */
.tira-fotos{list-style:none;padding:0;margin:24px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tira-fotos li{position:relative;border:1px solid var(--linea);padding:4px;background:var(--papel)}
.tira-fotos li:nth-child(even){transform:translateY(10px)}
.tira-fotos img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.tira-fotos + .nota-pie{margin-top:22px}
@media (prefers-reduced-motion:reduce){.tira-fotos li{transform:none}}

/* ---------- Tarjeta de socio (propuesta) ---------- */
.tarjeta-wrap{position:relative;padding:12px 0}
.tarjeta{position:relative;aspect-ratio:1.586;max-width:440px;margin:0 auto;background:var(--oscuro);color:var(--crema);border:1px solid var(--acento);padding:20px 22px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;overflow:hidden;box-shadow:8px 10px 0 var(--crema),9px 11px 0 var(--linea);transform:rotate(-2deg)}
.tarjeta::before{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.16;mix-blend-mode:screen;pointer-events:none}
.tarjeta::after{content:"";position:absolute;inset:7px;border:1px solid rgba(239,233,221,.22);pointer-events:none}
.tj-sello{position:absolute;top:16px;right:16px;width:72px;height:72px;color:var(--crema);opacity:.95}
.tj-hoja{position:absolute;left:-30px;bottom:-40px;width:220px;height:220px;color:var(--crema);opacity:.07;pointer-events:none}
.tj-et{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--crema-2)}
.tj-nombre{font-size:26px;line-height:1.1;font-style:italic}
.tj-nombre .ej{color:var(--crema-2);border-color:var(--crema-2);font-style:normal}
.tj-num{font-size:13px;color:var(--crema-2)}
.tj-pie{display:flex;justify-content:space-between;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(239,233,221,.28);font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--crema-2)}
.tj-nota{font-size:14px;font-style:italic;color:var(--texto);margin:28px auto 0;max-width:440px}
@media (prefers-reduced-motion:reduce){.tarjeta{transform:none}}

/* ---------- Precios en filas ---------- */
.precios{width:100%;max-width:640px}
.precios th{width:50%;padding-right:16px}
.precios td{white-space:normal;font-size:19px;color:var(--tinta);padding-left:12px;font-variant-numeric:tabular-nums}
.precios td.no{color:var(--texto);font-size:19px}
.precios tr:not(.cab) th,.precios tr:not(.cab) td{padding-top:16px;padding-bottom:16px}
.precios tr:not(.cab):hover th,.precios tr:not(.cab):hover td{background:var(--crema)}
.precios .cab th,.precios .cab td{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--texto);border-bottom:1px solid var(--tinta);padding:0 0 10px;white-space:nowrap}
.precios .cab td{padding-left:12px}
.precios .sub{display:block;font-size:15px;color:var(--texto);font-style:italic;margin-top:5px;line-height:1.45}
.precios td .dato{white-space:normal;font-size:11px}
.precio-grande{font-size:28px;color:var(--tinta);line-height:1.1}
/* comparación con flecha (El Círculo) */
.precios td.de{color:var(--texto);text-decoration:line-through;text-decoration-color:var(--acento);font-size:17px}
@media (min-width:460px){.precios td.de,.precios td.a{white-space:nowrap}}
.precios td.a::before{content:"→ ";color:var(--acento)}
@media (max-width:699px){.precios td{white-space:normal;font-size:17px}.precios th{width:44%}.socio-demo .precio .p-si::after{display:none}}

/* ---------- Listas de catálogo (sin tarjetas) ---------- */
.lista{list-style:none;padding:0;margin:0;border-top:1px solid var(--tinta)}
.lista li{border-bottom:1px solid var(--linea)}
.lista a,.lista .fila{display:flex;gap:16px;align-items:baseline;padding:20px 8px;margin:0 -8px;text-decoration:none;color:var(--tinta);transition:background .2s;border-radius:2px}
.lista a:hover{background:var(--crema)}
.lista .t{flex:1}
.lista .n{color:var(--texto);min-width:2ch;text-align:right;font-size:22px;line-height:1}
.lista a .n{transition:transform .2s;color:var(--acento)}
.lista a:hover .n{transform:translateX(3px)}
.lista .sub{display:block;color:var(--texto);font-size:15px;margin-top:3px;font-style:italic}

/* ---------- El camino 1·2·3 (la única secuencia numerada) ---------- */
.camino{list-style:none;padding:0;margin:0;counter-reset:paso;display:grid;gap:0}
.camino li{counter-increment:paso;position:relative;padding:28px 0 28px 72px;border-top:1px solid var(--linea)}
.camino li:last-child{border-bottom:1px solid var(--linea)}
.camino li::before{
  content:counter(paso);position:absolute;left:0;top:24px;width:52px;height:52px;border:1px solid var(--tinta);
  border-radius:50%;display:grid;place-items:center;font-size:26px;font-style:italic;color:var(--tinta);background:var(--papel);
}
.camino h3{margin:0 0 .3em;display:flex;align-items:center;gap:10px;font-size:26px}
.camino h3 svg{width:28px;height:28px}
.camino p{margin:0;color:var(--texto)}
.camino .p{display:block;color:var(--tinta);margin-top:10px;font-size:19px}
.camino .p .mute{font-size:15px;font-style:italic}
.camino .flecha{display:inline-block;margin-top:10px}

/* ---------- Bloque reveal (uno por pantalla) ---------- */
.reveal{background:var(--oscuro);color:var(--crema);padding:64px 0;position:relative;overflow:hidden}
.reveal::before{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.14;mix-blend-mode:screen;pointer-events:none}
.reveal > .cont{position:relative;border:1px solid rgba(239,233,221,.28);padding-top:40px;padding-bottom:40px}
.reveal > .cont::before{content:"";position:absolute;inset:6px;border:1px solid rgba(239,233,221,.14);pointer-events:none}
.reveal .agua{position:absolute;right:-60px;bottom:-80px;width:360px;height:360px;color:var(--crema);opacity:.09;pointer-events:none}
.reveal .agua svg{width:100%;height:100%}
.reveal h2,.reveal .grande{font-size:36px;line-height:1.12;color:var(--crema);margin:0 0 .5em;max-width:20ch;border:0;padding:0}
.reveal p{color:var(--crema);max-width:48ch;font-size:18px}
.reveal .mute{color:var(--crema-2)}
.reveal a:not(.btn){color:var(--crema)}
.reveal .btn--claro{margin-top:12px}

/* ---------- Iconos a mano ---------- */
.ico{width:40px;height:40px;stroke:currentColor;fill:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
svg use{vector-effect:non-scaling-stroke}
.ico--marca{fill:currentColor;stroke:none}
.sello{width:150px;height:150px}

/* ---------- Pie ---------- */
.pie{background:var(--oscuro);color:var(--crema-2);padding:56px 0 36px;margin-top:var(--salto);font-size:15px;position:relative;overflow:hidden}
.pie::before{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.14;mix-blend-mode:screen;pointer-events:none}
.pie .cont{position:relative}
.pie a{color:var(--crema);text-decoration-color:rgba(239,233,221,.35)}
.pie a:hover{text-decoration-color:var(--crema)}
.pie .cols{display:grid;gap:40px}
.pie .cols > div{min-width:0}
.pie .cols p{line-height:1.6}
.pie .sello{width:96px;height:96px}
.pie .marca-pie{max-width:30ch}
.pie h4{color:var(--crema);font-size:12px;font-family:var(--sans);font-weight:300;letter-spacing:.3em;text-transform:uppercase;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid rgba(239,233,221,.2)}
.pie p{margin:0 0 .5em}
.pie .sello{color:var(--crema)}
.pie .lema{font-style:italic;color:var(--crema);font-size:17px;margin:16px 0 4px}
.pie .mute,.pie .dato,.pie .ej{color:var(--crema-2);border-color:var(--crema-2)}
.pie .horario{display:grid;grid-template-columns:auto 1fr;gap:4px 14px}
.pie .horario dt{color:var(--crema-2)}
.pie .horario dd{margin:0;color:var(--crema)}
.pie .legal{border-top:1px solid rgba(239,233,221,.2);margin-top:36px;padding-top:18px;font-size:13px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.pie .legal a{color:var(--crema-2)}

/* ============================================================
   MOMENTO 1 · la receta que se va a casa (móvil dibujado)
   ============================================================ */
.demo{margin:0}
.demo-cab{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px;border-top:1px solid var(--tinta);padding-top:16px}
.demo-cab h2,.demo-cab h3{margin:0;border:0;padding:0}
.demo-pausa{display:none;border:1px solid var(--linea);border-radius:var(--radio);padding:6px 12px;font-size:14px;color:var(--texto);transition:background .2s}
.demo-pausa:hover{background:var(--crema)}
.js .demo-pausa{display:inline-block}
.demo-pausa[aria-pressed="true"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}

.tira{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
.tira .movil{flex:none;scroll-snap-align:start}
.tira .escena{flex:none;scroll-snap-align:start}

.movil{
  width:240px;height:490px;border:1px solid var(--tinta);border-radius:34px;padding:12px;
  background:var(--papel);position:relative;box-shadow:inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--linea);
}
.movil::before{content:"";position:absolute;left:50%;top:12px;width:68px;height:6px;margin-left:-34px;border-radius:3px;background:var(--linea)}
.pant{
  position:absolute;inset:28px 12px 12px;border-radius:24px;border:1px solid var(--linea);overflow:hidden;
  background:var(--papel);display:flex;flex-direction:column;
}
.pant .barra{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--texto);padding:12px 14px;border-bottom:1px solid var(--linea);display:flex;justify-content:space-between;gap:8px}
.pant .barra span:last-child{margin-left:auto;flex:none}
.pant .cuerpo{padding:12px;font-size:13px;line-height:1.45;flex:1}
.pant .cuerpo p{margin:0 0 8px}
.pant .cuerpo h5{font-family:var(--serif);font-weight:400;font-size:16px;margin:0 0 6px;color:var(--tinta);line-height:1.25}
.pant .pie-p{padding:10px 14px;border-top:1px solid var(--linea);font-size:12px;color:var(--texto)}

/* QR dibujado (no apunta a nada) */
.qr{width:112px;height:112px;margin:10px auto 10px}
.qr rect{fill:var(--tinta)}
.qr .marco{fill:none;stroke:var(--tinta);stroke-width:1}

/* burbujas de chat, sin logos */
.chat{display:flex;flex-direction:column;gap:6px}
.bur{max-width:88%;padding:8px 10px;border-radius:12px;border:1px solid var(--linea);background:var(--papel);font-size:12.5px;line-height:1.4}
.bur.neg{align-self:flex-start;border-bottom-left-radius:3px}
.bur.yo{align-self:flex-end;background:var(--oscuro);color:var(--crema);border-color:var(--oscuro);border-bottom-right-radius:3px}
.bur small{display:block;color:var(--texto);font-size:10px;margin-top:3px;text-align:right}
.bur.yo small{color:var(--crema-2)}
.bur .rec{margin:4px 0 0;padding-left:1em}
.bur .rec li{margin:0}
.bur-img{padding:4px}
.bur-img img{width:104px;height:auto;border-radius:9px;display:block}
.bur-img small{padding:0 6px 2px}

/* Secuencia animada (solo con JS y sin reduced-motion) */
.js .demo-receta .tira{display:block;overflow:visible;padding:0}
.js .demo-receta .movil{position:relative;margin:0 auto}
.js .demo-receta .escena{position:absolute;inset:0}
.js .demo-receta .escena .pant{opacity:0;animation:receta 9s linear infinite}
.js .demo-receta .escena:nth-child(1) .pant{animation-delay:0s}
.js .demo-receta .escena:nth-child(2) .pant{animation-delay:3s}
.js .demo-receta .escena:nth-child(3) .pant{animation-delay:6s}
.js .demo-receta.is-paused .pant{animation-play-state:paused}
.js .demo-receta .tira{position:relative;height:490px}
.js .demo-receta .tira .movil{position:absolute;left:50%;top:0;margin-left:-120px;background:transparent;box-shadow:none}
.js .demo-receta .escena:first-child .movil{box-shadow:inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--linea)}
.js .demo-receta .escena:not(:first-child) .movil{border-color:transparent}
.js .demo-receta .escena:not(:first-child) .movil::before{display:none}
@keyframes receta{0%{opacity:0}3%{opacity:1}31%{opacity:1}34%{opacity:0}100%{opacity:0}}
.demo-leyenda{font-size:15px;color:var(--texto);margin-top:16px;max-width:44ch;font-style:italic}
.js .demo-receta .paso-txt{display:none}
.paso-txt{white-space:nowrap;font-size:11px;color:var(--texto);margin:0 0 8px;font-family:var(--sans);font-weight:300;letter-spacing:.25em;text-transform:uppercase}
/* pasos del recorrido, en texto, al lado del móvil */
.pasos-receta{list-style:none;padding:0;margin:0;counter-reset:pr}
.pasos-receta li{counter-increment:pr;display:grid;grid-template-columns:30px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--linea);align-items:start}
.pasos-receta li:last-child{border-bottom:1px solid var(--linea)}
.pasos-receta li::before{content:counter(pr);width:26px;height:26px;border:1px solid var(--tinta);border-radius:50%;display:grid;place-items:center;font-size:13px;font-style:italic;color:var(--tinta)}
.pasos-receta b{display:block;font-weight:400;color:var(--tinta)}
.pasos-receta span{color:var(--texto);font-size:15px}

/* ============================================================
   MOMENTO 2 · precio de socio (dentro del reveal de El Círculo)
   ============================================================ */
.socio-demo{max-width:440px;border:1px solid var(--crema);border-radius:14px;padding:24px 24px 20px;margin-top:8px;background:var(--oscuro);position:relative;box-shadow:inset 0 0 0 4px var(--oscuro),inset 0 0 0 5px rgba(239,233,221,.25)}
.socio-demo .et{color:var(--crema-2)}
.socio-demo .fila{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(239,233,221,.2);padding:10px 0;font-size:15px}
.socio-demo .fila span:last-child{color:var(--crema)}
.socio-demo .tel{font-variant-numeric:tabular-nums;letter-spacing:.08em;min-width:12ch;text-align:right}
.socio-demo .precio{position:relative;height:84px;margin:18px 0 4px}
.socio-demo .precio span{position:absolute;left:0;top:0;font-size:72px;line-height:84px;color:var(--crema);transition:opacity .5s;letter-spacing:-.02em}
.socio-demo .precio .p-si{opacity:0}
.socio-demo .precio .p-si::after{content:"precio de socia";font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-family:var(--sans);font-weight:300;color:var(--crema-2);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:14px;white-space:nowrap}
.socio-demo .saludo{min-height:1.5em;color:var(--crema-2);font-size:15px;transition:opacity .5s;opacity:0;font-style:italic}
.socio-demo input{position:absolute;opacity:0;width:1px;height:1px}
.socio-demo .inter{display:flex;align-items:center;gap:12px;margin-top:18px;cursor:pointer;user-select:none;width:max-content}
.socio-demo .inter .pista{width:48px;height:28px;border:1px solid var(--crema);border-radius:14px;position:relative;flex:none}
.socio-demo .inter .pista::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--crema);transition:left .25s}
.socio-demo .inter .l{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--crema-2)}
.socio-demo input:focus-visible ~ .inter .pista{outline:2px solid var(--crema);outline-offset:3px}
.socio-demo input:checked ~ .precio .p-no{opacity:0}
.socio-demo input:checked ~ .precio .p-si{opacity:1}
.socio-demo input:checked ~ .saludo{opacity:1}
.socio-demo input:checked ~ .inter .pista::after{left:23px}
.socio-demo input:checked ~ .inter .l.si{color:var(--crema)}
.socio-demo input:not(:checked) ~ .inter .l.no{color:var(--crema)}
.socio-demo .nota{font-size:13px;color:var(--crema-2);margin:14px 0 0}

/* ============================================================
   MOMENTO 4 · el sistema (SVG propio, dos versiones por ancho)
   ============================================================ */
.sistema{margin-top:28px}
.sistema svg{width:100%;height:auto;font-family:var(--serif);font-size:16px}
.sistema .caja{fill:var(--papel);stroke:var(--tinta);stroke-width:1}
.sistema .caja-t{fill:var(--tinta)}
.sistema .caja-s{fill:var(--texto);font-size:13px}
.sistema .arista{fill:none;stroke:var(--linea);stroke-width:1;stroke-dasharray:4 4}
.sistema .ruta{fill:none;stroke:var(--acento);stroke-width:1.5;stroke-dasharray:4 4}
.sistema .punta{fill:var(--linea)}
.sistema .ruta-punta{fill:var(--acento)}
.sis-h{display:none}
.sis-v{display:block;max-width:420px;margin:0 auto}
.js .sistema[data-anim="1"] .ruta{opacity:.25;transition:opacity .4s}
.js .sistema[data-anim="1"] .ruta.lit{opacity:1}
.js .sistema[data-anim="1"] .ruta-punta{opacity:.25;transition:opacity .4s}
.js .sistema[data-anim="1"] .ruta-punta.lit{opacity:1}
.js .sistema[data-anim="1"] .nodo .caja{transition:fill .4s,stroke .4s}
.js .sistema[data-anim="1"] .nodo .caja-t,.js .sistema[data-anim="1"] .nodo .caja-s{transition:fill .4s}
.js .sistema[data-anim="1"] .nodo.lit .caja{fill:var(--oscuro);stroke:var(--oscuro)}
.js .sistema[data-anim="1"] .nodo.lit .caja-t{fill:var(--crema)}
.js .sistema[data-anim="1"] .nodo.lit .caja-s{fill:var(--crema-2)}
.sis-leyenda{font-size:15px;color:var(--texto);max-width:52ch;margin-top:10px;font-style:italic}
.sis-estado{font-size:17px;color:var(--tinta);min-height:1.6em;margin:10px 0 0;border-left:2px solid var(--acento);padding-left:12px}
.sis-ctrl{display:none;margin-top:12px}
.js .sis-ctrl{display:inline-flex}

/* ---------- Secciones genéricas ---------- */
.dos{display:grid;gap:36px}
.tres{display:grid;gap:36px}
.plato-dia{border:1px solid var(--linea);padding:24px;border-radius:var(--radio)}
.plato-dia h3{margin:.2em 0 .3em}
.plato-dia .p{color:var(--tinta)}
.menu-grid{display:grid;gap:18px}
.cartel{margin:0}
.cartel img{width:100%;max-width:300px;height:auto;border:1px solid var(--linea);box-shadow:0 0 0 5px var(--papel),0 0 0 6px var(--linea)}
.cartel figcaption{font-size:14px;color:var(--texto);margin-top:14px;max-width:300px;font-style:italic;line-height:1.5}
.cartel--peq{margin:0 0 var(--s4)}
.menu-grid--ancho .cartel--peq{margin:0}
.cita-col{padding-bottom:6px}
.sec--corto{padding-top:64px;padding-bottom:64px}
.sec--corto .cont > .dos > div > h2:first-child{border-top:0;padding-top:0}
.cartel--mini img{max-width:170px}
.semana{list-style:none;padding:0;margin:0;border-top:1px solid var(--tinta)}
.semana li{display:grid;grid-template-columns:3.5em 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--linea);align-items:baseline}
.semana li.hoy{background:var(--crema);margin:0 -12px;padding-left:12px;padding-right:12px}
.semana .d{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--texto)}
.semana li.hoy .d{color:var(--acento)}
.semana .t{color:var(--texto);font-size:15px;display:block;font-style:italic;margin-top:2px}
.semana .fotos{display:flex;gap:6px;margin:8px 0 4px}
.semana .fotos img{width:64px;height:48px;object-fit:cover;border:1px solid var(--linea)}
.ficha{border-top:1px solid var(--linea);padding:24px 0;display:grid;gap:4px}
.ficha:last-child{border-bottom:1px solid var(--linea)}
.ficha h3{margin-bottom:.2em}
.ficha .meta{color:var(--texto);font-size:15px;margin:0 0 .5em}
.ficha p:last-child{margin:0}
.ficha--foto{grid-template-columns:96px 1fr;column-gap:20px;grid-auto-rows:min-content}
.ficha--foto .ficha-img{grid-row:1/span 4;width:96px;height:96px;object-fit:cover;border:1px solid var(--linea);margin-top:4px}
.ficha--foto > :not(.ficha-img){grid-column:2}
@media (min-width:700px){.ficha--foto{grid-template-columns:140px 1fr}.ficha--foto .ficha-img{width:140px;height:105px}}
.garantia{border-left:2px solid var(--acento);padding:4px 0 4px 18px;max-width:46ch;font-style:italic;font-size:19px}
.oscuro .garantia,.reveal .garantia{border-left-color:var(--crema)}
.nota-pie{font-size:15px;color:var(--texto);line-height:1.55;max-width:52ch}
table + .nota-pie,.lista + .nota-pie{margin-top:var(--s2)!important}
.form{display:grid;gap:14px;max-width:520px}
.form label{display:block}
.form label span{display:block;font-size:15px;color:var(--texto);margin-bottom:4px}
.form input,.form select,.form textarea{width:100%;font:inherit;padding:11px 12px;border:1px solid var(--linea);border-radius:var(--radio);background:var(--papel);color:var(--tinta);transition:border-color .2s}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--tinta);outline:0}
.form textarea{min-height:110px}
.cita{font-size:24px;line-height:1.35;font-style:italic;color:var(--tinta);max-width:30ch;margin:0;padding-left:20px;border-left:1px solid var(--tinta)}
.cita + .firma{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;margin:12px 0 0 21px;color:var(--texto)}

/* ---------- Seguridad: nada queda invisible ---------- */
.todo-visible .demo-receta .tira{display:flex!important;height:auto!important;overflow-x:auto!important}
.todo-visible .demo-receta .movil{position:relative!important;left:auto!important;margin:0!important;border-color:var(--tinta)!important;background:var(--papel)!important}
.todo-visible .demo-receta .movil::before{display:block!important}
.todo-visible .demo-receta .escena{position:static!important}
.todo-visible .demo-receta .pant{opacity:1!important;animation:none!important}
.todo-visible .socio-demo .precio span{opacity:1!important;position:static!important;display:inline-block;margin-right:16px}
.todo-visible .socio-demo .saludo{opacity:1!important}
.todo-visible .sistema .ruta,.todo-visible .sistema .ruta-punta{opacity:1!important}

/* ---------- Reduced motion: versiones estáticas ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .demo-receta .tira{display:flex;height:auto;overflow-x:auto;padding-bottom:8px}
  .js .demo-receta .tira .movil,.js .demo-receta .escena:not(:first-child) .movil{position:relative;left:auto;margin:0;border-color:var(--tinta);background:var(--papel)}
  .js .demo-receta .escena{flex:none}
  .js .demo-receta .escena:not(:first-child) .movil::before{display:block}
  .js .demo-receta .escena{position:static}
  .js .demo-receta .escena .pant{opacity:1;animation:none}
  .js .demo-receta .paso-txt{display:block}
  .demo-pausa{display:none!important}
  .sis-ctrl{display:none!important}
}

/* ---------- Tablet ---------- */
@media (min-width:700px){
  :root{--lado:32px;--salto:96px;--s4:48px}
  body{font-size:18px}
  body.con-cta{padding-bottom:0}
  .cta-movil{display:none}
  h1{font-size:56px}
  h2{font-size:36px}
  h3{font-size:23px}
  .hero{padding:72px 0 56px}
  .hero-grid{grid-template-columns:7fr 5fr;align-items:start;gap:56px}
  .dos{gap:48px}
  .tres{grid-template-columns:1fr 1fr 1fr}
  .menu-grid{grid-template-columns:220px 1fr;gap:28px;align-items:start}
  .camino{grid-template-columns:1fr 1fr 1fr;gap:0}
  .camino li{border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);padding:36px 28px 36px 28px}
  .camino li+li{border-left:1px solid var(--linea)}
  .camino li::before{position:static;margin-bottom:18px}
  .camino li::after{content:"";position:absolute;right:-1px;top:49px;width:28px;border-top:1px solid var(--tinta);display:none}
  .pie .cols{grid-template-columns:1fr 1fr;gap:48px 56px}
  .reveal{padding:96px 0}
  .reveal > .cont{padding-top:56px;padding-bottom:56px}
  .reveal h2,.reveal .grande{font-size:48px}
  .top .btn{display:inline-flex}
}

/* ---------- Escritorio ---------- */
@media (min-width:1000px){
  :root{--salto:112px}
  .dos{grid-template-columns:1fr 1fr;gap:88px}
  .dos--precio{grid-template-columns:1.1fr .9fr;align-items:center}
  .dos--foto{align-items:center}
  .menu-grid--ancho{grid-template-columns:300px 1fr;gap:72px;align-items:start}
  .hero-grid{gap:88px}
  h1{font-size:68px}
  .hero .agua{right:-60px;top:-60px;width:520px;height:520px}
  h2{font-size:40px}
  h3{font-size:24px}
  .util{display:block}
  .nav-d{display:flex;align-items:center;margin-right:8px}
  .nav-m{display:none}
  .sis-h{display:block}
  .sis-v{display:none}
  .hero .lead{font-size:21px}
  .reveal .grande{font-size:56px}
  .reveal .dos{grid-template-columns:1.1fr 1fr;align-items:center}
  .dos--lista{grid-template-columns:1.2fr 1fr;gap:72px}
  .bodegon{margin-top:-8px}
}

/* ---------- Pie a cuatro columnas solo con sitio ---------- */
@media (min-width:1100px){
  .pie .cols{grid-template-columns:1.3fr 1fr 1fr .9fr;gap:64px}
}

/* listas de la Escuela: filas sin enlace, más compactas */
.lista--es .fila{padding:14px 0;margin:0;align-items:flex-start}
.lista--es .t{font-size:18px}
.lista--es .t .sub{display:block;font-size:14px;font-style:italic;color:var(--texto);margin-top:3px;line-height:1.45}
.lista--es .der{margin-left:auto;white-space:nowrap;color:var(--texto);font-size:14px}
.fam-p{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--texto);margin:18px 0 6px}

/* la Escuela en la portada: la pieza de vídeo como enlace, sobre papel claro */
.escuela-home .pieza--enlace{display:block;text-decoration:none;box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px var(--linea),8px 10px 0 var(--crema);transition:transform .25s,box-shadow .25s}
.escuela-home .pieza--enlace:hover{transform:translate(-2px,-2px);box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px var(--linea),12px 14px 0 var(--crema)}
.escuela-home .pieza--video .capit li{color:var(--texto)}
.escuela-home .pieza--video .capit li.ahora{color:var(--tinta)}
.escuela-home .pieza--video h3{color:var(--tinta)}
@media (prefers-reduced-motion:reduce){.escuela-home .pieza--enlace,.escuela-home .pieza--enlace:hover{transform:none}}
@media (max-width:700px){.mock-web{gap:8px;padding:8px 12px}.mock-web span{width:100%;text-align:center}.mock-web a{padding:4px 10px;font-size:10px}}

/* ---------- Escuela online: así se ve por dentro (capturas reales en marco) ---------- */
.dentro-grid{display:grid;gap:28px;align-items:end;margin-top:var(--s3)}
.navegador{margin:0;border:1px solid var(--tinta);background:var(--papel);box-shadow:10px 12px 0 var(--crema),10px 12px 0 1px var(--linea)}
.navegador .nav-barra{display:flex;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--linea);background:var(--crema)}
.navegador .nav-barra i{width:9px;height:9px;border-radius:50%;border:1px solid var(--linea);background:var(--papel)}
.navegador .nav-barra span{margin-left:10px;flex:1;font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.12em;color:var(--texto);background:var(--papel);border:1px solid var(--linea);border-radius:10px;padding:3px 10px}
.navegador img{display:block;width:100%;height:auto}
.navegador figcaption,.telefono figcaption{font-size:13.5px;font-style:italic;color:var(--texto);padding:10px 12px 12px;border-top:1px solid var(--linea)}
.telefono{margin:0;display:grid;justify-items:center;gap:10px}
.telefono figcaption{border:0;text-align:center;padding:0}
.tel-marco{width:min(100%,250px);border:1px solid var(--tinta);border-radius:28px;padding:10px;background:var(--tinta);box-shadow:8px 10px 0 var(--crema),8px 10px 0 1px var(--linea)}
.tel-marco img{display:block;width:100%;height:auto;border-radius:20px}
.dentro-puntos{list-style:none;padding:0;margin:var(--s4) 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.dentro-puntos li{padding:16px 14px 16px 0;border-bottom:1px solid var(--linea)}
.dentro-puntos b{display:block;font-weight:400;font-size:18px;color:var(--tinta);margin-bottom:3px}
.dentro-puntos span{font-size:14px;font-style:italic;color:var(--texto);line-height:1.45;display:block}
.navegador--ancho{max-width:960px;margin:0 auto}
@media (min-width:700px){
  .dentro-grid{grid-template-columns:minmax(0,1fr) 260px;gap:40px}
  .dentro-puntos{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dentro-puntos li+li{border-left:1px solid var(--linea);padding-left:14px}
}
/* Escuela online: versión corta */
.telefono--hero{justify-self:center}
.telefono--hero .tel-marco{width:min(100%,260px)}
.dentro-que{list-style:none;padding:0;margin:var(--s3) 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.dentro-que li{padding:16px 14px 16px 0;border-bottom:1px solid var(--linea)}
.dentro-que b{display:block;font-weight:400;font-size:22px;color:var(--tinta);margin-bottom:4px}
.dentro-que span{font-size:14px;font-style:italic;color:var(--texto);line-height:1.45;display:block}
@media (min-width:700px){.dentro-que{grid-template-columns:repeat(4,minmax(0,1fr))}.dentro-que li+li{border-left:1px solid var(--linea);padding-left:14px}}
.dentro .navegador--ancho{margin-top:var(--s3)}
.dentro .dentro-puntos{margin-bottom:0}

/* Escuela online: dudas y cierre */
.faq{border-top:1px solid var(--tinta);max-width:760px}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{list-style:none;cursor:pointer;padding:16px 36px 16px 0;font-size:19px;color:var(--tinta);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:22px;color:var(--acento);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:0 0 18px;max-width:640px;color:var(--texto)}
.cierre-es > .cont{text-align:center;padding-left:24px;padding-right:24px}
.cierre-es .et{color:var(--crema-2)}
.cierre-es h2{max-width:720px;margin:10px auto 18px;color:var(--crema)}
.cierre-es .grande em{color:var(--crema)}
.cierre-precio{color:var(--crema-2);font-size:17px;margin:0 0 26px}
.cierre-precio b{font-weight:400;color:var(--crema);font-size:22px}
.cierre-botones{display:flex;gap:22px;align-items:center;justify-content:center;flex-wrap:wrap}
.cierre-botones .flecha{color:var(--crema);border-bottom-color:rgba(239,233,221,.4)}
.cierre-fiable{list-style:none;padding:0;margin:34px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;font-size:14px;color:var(--crema-2);max-width:760px}
.cierre-fiable li{display:inline-flex;align-items:center;gap:8px}
.cierre-fiable li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--crema-2);opacity:.7}
.cierre-firma{margin:26px 0 0;font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--crema-2)}
.cierre-es > .cont{display:block}
.cierre-es > .cont > *{margin-left:auto;margin-right:auto;text-align:center}
.cierre-es .et{display:block}
.cierre-es h2.grande{max-width:640px;text-align:center}
.cierre-precio{max-width:none}
.cierre-precio{max-width:560px}
.cierre-firma{max-width:none}

/* menú: grupo "Aprende" desplegable, a la izquierda; y los grupos en el menú móvil */
.nav-grupo .nav-mas-lista{left:0;right:auto}
.nav-m-grupo{display:block;padding:14px 22px 4px;font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--texto)}
.nav-m nav a.nav-m-sec{padding-left:34px;font-size:17px}

/* ============================================================
   LA TIENDA · web pública y Escuela (mismos estilos)
   Modelo: tiendas ecológicas online (categorías arriba, rejilla de
   productos con precio y "Añadir", cesta fija a la derecha).
   ============================================================ */
.tienda-cab{padding:40px 0 0}
.tienda-cab-grid{display:grid;gap:18px;align-items:end}
.tienda-cab h1{margin-bottom:.2em}
.tienda-cab .lead{max-width:620px}
.tienda-buscar{display:flex;gap:8px;max-width:460px;width:100%}
.tienda-buscar input{flex:1;min-width:0;font:inherit;font-size:16px;padding:11px 16px;border:1px solid var(--linea);border-radius:22px;background:var(--crema);color:var(--tinta)}
.tienda-buscar input:focus{border-color:var(--tinta);outline:0}
.tienda-info{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.tienda-info li{padding:12px 14px 12px 0;border-bottom:1px solid var(--linea);font-size:14px;color:var(--texto)}
.tienda-info b{display:block;font-weight:400;color:var(--tinta);font-size:16px}
.cat-chips{position:sticky;top:66px;z-index:6;background:var(--papel);margin:0 0 22px;padding:12px 0;border-bottom:1px solid var(--linea)}
.es .cat-chips{top:98px}
.cat-chips ul{list-style:none;margin:0;padding:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.cat-chips ul::-webkit-scrollbar{display:none}
.cat-chips a{display:inline-block;white-space:nowrap;text-decoration:none;font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--texto);border:1px solid var(--linea);border-radius:16px;padding:8px 14px;transition:all .2s}
.cat-chips a:hover{border-color:var(--tinta);color:var(--tinta)}
.cat-chips a[aria-current]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo{padding-top:22px}
.tienda-grid{display:grid;gap:32px;align-items:start}
.tienda-cat{padding:26px 0 8px;scroll-margin-top:70px}
.tienda-cat h2{font-size:24px;margin:0 0 14px;display:flex;align-items:baseline;gap:12px;border:0;padding:0}
.tienda-cat h2 .mas{margin-left:auto;font-size:14px;white-space:nowrap;color:var(--texto)}
.tienda-cat > .mute{margin:-8px 0 14px;font-size:14px}

/* destacado */
.destacado{display:grid;text-decoration:none;color:var(--tinta);border:1px solid var(--tinta);background:var(--crema);box-shadow:inset 0 0 0 5px var(--crema),inset 0 0 0 6px var(--linea);margin-bottom:8px;transition:transform .25s}
.destacado:hover{transform:translateY(-2px)}
.destacado-img{position:relative;aspect-ratio:16/9;background:var(--tinta);overflow:hidden}
.destacado-img img{width:100%;height:100%;object-fit:cover;opacity:.85;display:block}
.destacado-img .dato{position:absolute;right:12px;top:12px;color:var(--crema);border-color:var(--crema-2)}
.destacado-txt{padding:20px 22px 22px}
.destacado-txt h2{font-size:26px;margin:4px 0 .3em}
.destacado-txt p{margin:0 0 12px;color:var(--texto)}
.destacado-pr{display:block;font-size:22px;margin-bottom:14px}
.destacado-pr small{font-size:13px;color:var(--texto);font-style:italic}

/* rejilla de productos */
.prods{list-style:none;padding:0;margin:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.prod{border:1px solid var(--linea);background:var(--papel);display:flex;flex-direction:column;transition:border-color .2s,transform .2s,box-shadow .2s}
.prod:hover{border-color:var(--tinta);transform:translateY(-2px);box-shadow:0 8px 0 -4px var(--crema),0 8px 0 -3px var(--linea)}
.prod-img{position:relative;aspect-ratio:1;display:grid;place-items:center;background:#fff;color:var(--acento);border-bottom:1px solid var(--linea);overflow:hidden}
.prod-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.prod:hover .prod-img img{transform:scale(1.04)}
.destacado-img--prod{background:#fff}.destacado-img--prod img{opacity:1;object-fit:contain;padding:18px}
.prod-img--hoja{background:#E9E6D6}.prod-img--grano{background:#EDE4D3}.prod-img--tarro{background:#E6DDD2}.prod-img--botella{background:#E2DCD0}.prod-img--caja{background:#E4E0D4}
.prod-ico{width:46%;height:46%;opacity:.9}
.prod-foto{position:absolute;right:8px;bottom:8px;font-family:var(--sans);font-weight:300;font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);border:1px dashed var(--linea);padding:1px 5px;background:rgba(243,238,229,.8)}
.prod-txt{padding:12px 12px 4px;display:grid;gap:2px}
.prod-txt b{font-weight:400;font-size:16px;color:var(--tinta);line-height:1.25}
.prod-txt small{color:var(--texto);font-size:12.5px;font-style:italic}
.prod-rec{font-family:var(--sans);font-weight:300;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--acento);margin-top:4px}
.prod-pie{margin-top:auto;padding:8px 12px 12px;display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.prod-pie .pr{font-size:17px;color:var(--tinta);line-height:1.1}
.prod-pie .pr small{display:block;font-size:11px;color:var(--texto);font-style:italic;margin-top:2px}
.prod-add{padding:6px 10px;font-size:14px}
.prod-add[disabled]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}

/* la receta con la compra */
.ingred{list-style:none;padding:0;margin:0 0 10px;border-top:1px solid var(--linea)}
.ingred li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--linea);font-size:15px}
.ingred label{display:flex;gap:10px;align-items:center;cursor:pointer;color:var(--tinta)}
.ingred input{accent-color:var(--acento);width:16px;height:16px;margin:0}
.ingred .pr{white-space:nowrap;color:var(--tinta);font-size:14px;text-align:right}
.ingred .pr small{display:block;color:var(--texto);font-size:11.5px;font-style:italic}
.ingred .sin{color:var(--texto);font-style:italic}
.ingred .sin > span:first-child{padding-left:26px}
.cesta-mini{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;background:var(--crema);border:1px solid var(--linea);font-size:14px;color:var(--texto)}
.cesta-mini b{font-weight:400;color:var(--tinta);font-size:16px}
.cesta-mini .btn{margin:0}
.receta .acciones{margin-top:12px}
.kit{border:1px solid var(--linea);padding:16px;margin-bottom:16px;background:var(--papel)}
.kit-cab{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;margin-bottom:12px}
.kit-cab img{width:72px;height:54px;object-fit:cover;border:1px solid var(--linea)}
.kit-cab b{display:block;font-weight:400;font-size:18px;color:var(--tinta)}
.kit-cab small{display:block;color:var(--texto);font-size:13px;font-style:italic}
.kit-cab .et{margin:0 0 2px}

/* la cesta */
.cesta-caja{border:1px solid var(--tinta);padding:18px;background:var(--papel);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
.cesta-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.cesta-cab .et{margin:0}
.cesta-cab b{font-weight:400;font-size:13px;min-width:22px;height:22px;border-radius:11px;background:var(--acento);color:var(--crema);display:inline-grid;place-items:center;padding:0 6px}
.cesta-lineas{list-style:none;padding:0;margin:0;border-top:1px solid var(--linea)}
.cesta-lineas li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--linea);font-size:14.5px}
.cesta-tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0 4px;font-size:14px;color:var(--texto)}
.cesta-tot b{font-weight:400;font-size:24px;color:var(--tinta)}
.cesta-socio{font-size:13px;color:var(--texto);font-style:italic;margin:0 0 12px}
.cesta-como{display:grid;gap:8px;margin-bottom:14px}
.cesta-como label{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--linea);padding:10px 12px;cursor:pointer;background:var(--papel)}
.cesta-como label:has(input:checked){border-color:var(--tinta);background:var(--crema)}
.cesta-como input{accent-color:var(--acento);margin-top:4px}
.cesta-como span{font-size:15px;color:var(--tinta)}
.cesta-como small{display:block;color:var(--texto);font-size:12.5px;font-style:italic}
.cesta-caja .btn{width:100%;justify-content:center}
.cesta-lado{display:none}
.cesta-barra{position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--tinta);color:var(--crema);display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px var(--lado);font-size:14px}
.cesta-barra b{font-weight:400}
.cesta-barra .btn{background:var(--crema);color:var(--tinta);border-color:var(--crema)}
body.es .cesta-barra{bottom:62px}
@media (min-width:700px){
  .tienda-cab-grid{grid-template-columns:minmax(0,1fr) auto}
  .tienda-info{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tienda-info li+li{border-left:1px solid var(--linea);padding-left:14px}
  .destacado{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center}
  .destacado-img{aspect-ratio:4/3;height:100%}
}
@media (min-width:1000px){
  .tienda-grid{grid-template-columns:minmax(0,1fr) 300px}
  .cesta-lado{display:block;position:sticky;top:140px}
  .cesta-barra{display:none}
}

/* filtro de categorías sin JS: el chip apunta a un ancla y la rejilla esconde el resto */
.tienda-todo .ancla{display:block;position:relative;top:-150px;height:0}
.tienda-vacio{display:none;color:var(--texto);font-style:italic}
.tienda-cuerpo:has(#c-verdura:target) .prod:not([data-cat="verdura"]),.es-main:has(#c-verdura:target) .prod:not([data-cat="verdura"]){display:none}
.tienda-cuerpo:has(#c-verdura:target) .cat-chips a[href="#c-verdura"],.es-main:has(#c-verdura:target) .cat-chips a[href="#c-verdura"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-verdura:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-verdura:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}
.tienda-cuerpo:has(#c-granel:target) .prod:not([data-cat="granel"]),.es-main:has(#c-granel:target) .prod:not([data-cat="granel"]){display:none}
.tienda-cuerpo:has(#c-granel:target) .cat-chips a[href="#c-granel"],.es-main:has(#c-granel:target) .cat-chips a[href="#c-granel"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-granel:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-granel:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}
.tienda-cuerpo:has(#c-despensa:target) .prod:not([data-cat="despensa"]),.es-main:has(#c-despensa:target) .prod:not([data-cat="despensa"]){display:none}
.tienda-cuerpo:has(#c-despensa:target) .cat-chips a[href="#c-despensa"],.es-main:has(#c-despensa:target) .cat-chips a[href="#c-despensa"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-despensa:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-despensa:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}
.tienda-cuerpo:has(#c-fermentos:target) .prod:not([data-cat="fermentos"]),.es-main:has(#c-fermentos:target) .prod:not([data-cat="fermentos"]){display:none}
.tienda-cuerpo:has(#c-fermentos:target) .cat-chips a[href="#c-fermentos"],.es-main:has(#c-fermentos:target) .cat-chips a[href="#c-fermentos"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-fermentos:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-fermentos:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}
.tienda-cuerpo:has(#c-cajas:target) .prod:not([data-cat="cajas"]),.es-main:has(#c-cajas:target) .prod:not([data-cat="cajas"]){display:none}
.tienda-cuerpo:has(#c-cajas:target) .cat-chips a[href="#c-cajas"],.es-main:has(#c-cajas:target) .cat-chips a[href="#c-cajas"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-cajas:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-cajas:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}
.tienda-cuerpo:has(#c-recetas:target) .cat-chips a[href="#c-recetas"],.es-main:has(#c-recetas:target) .cat-chips a[href="#c-recetas"]{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.tienda-cuerpo:has(#c-recetas:target) .cat-chips a[href="#c-todo"],.es-main:has(#c-recetas:target) .cat-chips a[href="#c-todo"]{background:transparent;color:var(--texto);border-color:var(--linea)}

/* cesta: quitar una línea y estado "en la cesta" */
.cesta-lineas .quitar{font:inherit;font-size:14px;line-height:1;background:none;border:1px solid var(--linea);border-radius:50%;width:20px;height:20px;color:var(--texto);cursor:pointer;margin-left:6px;vertical-align:middle;transition:all .2s}
.cesta-lineas .quitar:hover{border-color:var(--acento);color:var(--acento)}
.cesta-lineas .vacia{color:var(--texto);font-style:italic}
.prod-add.en-cesta{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.cesta-lineas li > span:first-child small{white-space:nowrap;color:var(--texto)}
.cesta-lineas li > span:last-child{white-space:nowrap;display:inline-flex;align-items:center;gap:6px}

/* cabecera: siete entradas caben porque el botón de WhatsApp pasa a la barra de arriba y a una burbuja fija */
.util-der{display:inline-flex;gap:22px;align-items:center}
.util-wa{color:var(--acento)!important;border-bottom:1px solid transparent}
.util-wa:hover{border-bottom-color:var(--acento)}
@media (min-width:1000px) and (max-width:1180px){.nav-d a,.nav-mas summary{margin-left:18px;font-size:15px}}




@media (min-width:1000px){}

/* El Círculo: los beneficios en rejilla */
.beneficios{list-style:none;padding:0;margin:var(--s3) 0 0;display:grid;gap:0;border-top:1px solid var(--tinta);counter-reset:b}
.beneficios li{padding:24px 0 26px;border-bottom:1px solid var(--linea);position:relative}
.beneficios b{display:block;font-weight:400;font-size:19px;line-height:1.3;color:var(--tinta);margin-bottom:8px}
.beneficios > li > span{font-size:15px;font-style:italic;color:var(--texto);line-height:1.6;display:block;max-width:40ch}
.beneficios span span{display:inline;font-style:normal;color:var(--tinta);white-space:nowrap}
@media (min-width:700px){
  .beneficios{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:0}
  .beneficios li{padding-left:32px;padding-right:32px}
  .beneficios li:nth-child(3n+1){padding-left:0}
  .beneficios li:nth-child(3n){padding-right:0}
  .beneficios li:not(:nth-child(3n+1)){border-left:1px solid var(--linea)}
}
/* El Círculo: la cuenta de la membresía */
.cuentas{display:grid;gap:0;border:1px solid var(--tinta);margin-top:var(--s4);max-width:820px}
.cuentas-col{padding:22px 24px}
.cuentas-col ul{list-style:none;padding:0;margin:10px 0 0;border-top:1px solid var(--linea)}
.cuentas-col li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:15px;color:var(--texto)}
.cuentas-col li b{font-weight:400;color:var(--tinta);white-space:nowrap}
.cuentas-tot{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding-top:12px;color:var(--texto);font-size:15px}
.cuentas-tot b{font-weight:400;font-size:26px;color:var(--tinta)}
.cuentas-col--pago{background:var(--oscuro);color:var(--crema)}
.cuentas-col--pago .et{color:var(--crema-2)}
.cuentas-grande{margin:10px 0 12px}
.cuentas-grande b{font-weight:400;font-size:52px;line-height:1;color:var(--crema);letter-spacing:-.02em}
.cuentas-grande small{display:block;font-size:14px;font-style:italic;color:var(--crema-2);margin-top:4px}
.cuentas-col--pago p{font-size:14.5px;color:var(--crema-2);margin:0 0 16px;line-height:1.5}
.cuentas-col--pago .btn{background:var(--crema);color:var(--tinta);border-color:var(--crema)}
@media (min-width:700px){.cuentas{grid-template-columns:1fr 1fr}.cuentas-col--pago{display:flex;flex-direction:column;justify-content:center}}

/* ---- quiénes somos: retratos, hitos, prensa, perfiles ---------------------- */
.retratos{display:grid;gap:var(--s4);margin-top:var(--s4)}
.retrato{display:grid;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:22px;align-items:start}
.retrato-foto{margin:0;aspect-ratio:3/4;border:1px solid var(--linea);background:var(--crema);display:grid;place-items:center;overflow:hidden;position:relative}
.retrato-foto img{width:100%;height:100%;object-fit:cover}
.retrato-foto .ini{font-family:var(--serif,"Lora",Georgia,serif);font-size:44px;color:var(--crema-2);line-height:1}
.retrato h3{font-size:23px;line-height:1.25;margin:4px 0 10px;font-weight:400;color:var(--tinta)}
.retrato p{font-size:16px;line-height:1.62;color:var(--texto);margin:0 0 10px}
.retrato .et{margin:0}
.nuestro-cierre{margin:var(--s4) 0 0;padding-top:var(--s3);border-top:1px solid var(--linea);display:flex;flex-wrap:wrap;gap:14px 26px;align-items:baseline;justify-content:space-between}
.nuestro-cierre p{margin:0;font-family:var(--serif,"Lora",Georgia,serif);font-size:23px;font-style:italic;color:var(--tinta);line-height:1.4;max-width:30ch}
.hitos{list-style:none;padding:0;margin:var(--s4) 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.hitos li{display:grid;grid-template-columns:minmax(0,110px) minmax(0,1fr);gap:18px;padding:16px 0;border-bottom:1px solid var(--linea)}
.hitos .cu{font-size:14px;font-style:italic;color:var(--mute)}
.hitos b{display:block;font-weight:400;font-size:18px;color:var(--tinta);margin-bottom:3px}
.hitos span.q{font-size:15px;color:var(--texto);line-height:1.5}
.logros{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:0;border-top:1px solid var(--linea)}
.logros li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:15px;color:var(--texto)}
.logros li b{font-weight:400;color:var(--tinta)}
.logros li span.cu{white-space:nowrap;font-size:13.5px;font-style:italic;color:var(--mute)}
.prensa{list-style:none;padding:0;margin:var(--s4) 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.prensa li{border:1px solid var(--linea);background:var(--papel);padding:0;display:flex;flex-direction:column}
.prensa .marco{aspect-ratio:4/3;background:var(--crema);border-bottom:1px solid var(--linea);display:grid;place-items:center;text-align:center;padding:14px;position:relative}
.prensa .marco img{width:100%;height:100%;object-fit:cover}
.prensa .marco small{font-size:12.5px;font-style:italic;color:var(--mute);line-height:1.4}
.prensa .pr-pie{padding:12px 14px}
.prensa .pr-pie b{display:block;font-weight:400;font-size:16px;color:var(--tinta)}
.prensa .pr-pie small{display:block;font-size:13px;font-style:italic;color:var(--texto);margin-top:2px}
.perfil{display:grid;gap:var(--s3);grid-template-columns:minmax(0,1fr)}
.perfil-cab{display:grid;grid-template-columns:minmax(0,160px) minmax(0,1fr);gap:24px;align-items:end}
@media (min-width:760px){
  .retratos{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4) 40px}
  .prensa{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:520px){
  .retrato{grid-template-columns:minmax(0,88px) minmax(0,1fr);gap:16px}
  .retrato-foto .ini{font-size:32px}
  .hitos li{grid-template-columns:minmax(0,1fr);gap:4px}
  .perfil-cab{grid-template-columns:minmax(0,110px) minmax(0,1fr);gap:16px}
}

/* ---- empresas: paquetes con precio --------------------------------------- */
.paquetes{list-style:none;padding:0;margin:var(--s3) 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.paquetes li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 24px;padding:18px 0;border-bottom:1px solid var(--linea);align-items:start}
.paquetes b{display:block;font-weight:400;font-size:19px;color:var(--tinta);margin-bottom:4px}
.paquetes .q{font-size:14.5px;color:var(--texto);line-height:1.5;font-style:italic;display:block}
.paquetes .pr{text-align:right;white-space:nowrap;font-size:19px;color:var(--tinta)}
.paquetes .pr small{display:block;font-size:13px;font-style:italic;color:var(--mute);white-space:normal;max-width:16ch;margin-top:2px}
@media (max-width:520px){.paquetes li{grid-template-columns:minmax(0,1fr)}.paquetes .pr{text-align:left}.paquetes .pr small{max-width:none}}

/* ---- mosaico de la casa: acepta verticales (3:4) y horizontales (4:3) ----- */
.mosaico{list-style:none;padding:0;margin:var(--s4) 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mosaico li{margin:0;position:relative}
.mosaico figure{margin:0;height:100%}
.mosaico .mz{display:block;aspect-ratio:3/4;background:var(--crema);border:1px solid var(--linea);overflow:hidden;position:relative;display:grid;place-items:center;text-align:center;padding:12px}
.mosaico .mz img{width:100%;height:100%;object-fit:cover;display:block}
.mosaico .mz small{font-size:12px;font-style:italic;color:var(--mute);line-height:1.4}
.mosaico figcaption{font-size:13px;font-style:italic;color:var(--texto);line-height:1.4;margin-top:8px}
.mosaico .h .mz{aspect-ratio:4/3}
@media (min-width:760px){
  .mosaico{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
  /* una horizontal ocupa dos columnas y queda exactamente a la misma altura que una vertical */
  .mosaico .h{grid-column:span 2}
  .mosaico .h .mz{aspect-ratio:3/2}
}

/* ---- el camino: una línea y sus paradas ---------------------------------- */
.camino-l{list-style:none;margin:var(--s4) 0 0;padding:0 0 0 30px;position:relative;max-width:68ch}
.camino-l::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--linea)}
.camino-l li{position:relative;display:grid;grid-template-columns:minmax(0,96px) minmax(0,1fr);gap:4px 20px;padding:0 0 26px}
.camino-l li:last-child{padding-bottom:0}
.camino-l li::before{content:"";position:absolute;left:-29px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--papel);border:1px solid var(--linea)}
.camino-l li:last-child::before{background:var(--acento);border-color:var(--acento)}
.camino-l .c-a{font-size:13px;font-style:italic;color:var(--mute);padding-top:2px}
.camino-l .c-t{font-family:var(--serif);font-size:18px;color:var(--tinta);line-height:1.35}
.camino-l .c-t small{display:block;font-family:var(--sans);font-size:13.5px;color:var(--texto);font-style:italic;margin-top:2px;line-height:1.5}
@media (max-width:620px){
  .camino-l li{grid-template-columns:minmax(0,1fr);gap:2px}
  .camino-l .c-a{order:-1}
}
/* fotos a sangre dentro de sus marcos: sin passepartout cuando hay imagen */
.prensa .marco:has(img){padding:0}
.mosaico .mz:has(img){padding:0}
/* una pieza de prensa a doble ancho (un recorte de periódico se tiene que leer) */
@media (min-width:760px){.prensa .ancha{grid-column:span 2}}
@media (min-width:760px){.prensa--tres{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---- nuestra historia: dos orígenes en paralelo -------------------------- */
.origen{margin:0}
.origen .foto{margin:0 0 18px}
.origen .et{margin:0 0 6px}
.origen h3{font-size:24px;line-height:1.22;margin:0 0 10px;font-weight:400}
.origen p{margin:0}
.cita--centro{text-align:center;max-width:34ch;margin:var(--s4) auto 0;border:0;padding:0}
h3.h2{font-size:clamp(28px,3.4vw,40px);line-height:1.08;margin:0 0 .3em}

/* ---- dos carriles: el camino de cada uno, en paralelo -------------------- */
.carriles{display:grid;gap:var(--s4);align-items:start;margin-top:var(--s4)}
.carril{margin:0;display:grid;gap:0}
.carril .foto{margin:0 0 20px}
.carril .et{margin:0 0 6px}
.carril h3{font-size:24px;line-height:1.22;margin:0 0 12px;font-weight:400}
.carril p.prosa{margin:0 0 12px}
.carril .sub-et{display:block;font-family:var(--sans);font-weight:300;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:22px 0 2px}
.logros--c{border-top:1px solid var(--linea)}
.logros--c li{padding:7px 0;font-size:14.5px;gap:12px}
.logros--c li span.cu{font-size:12.5px}
/* tira de platos: miniaturas cuadradas, sin marco */
.tiraf{list-style:none;padding:0;margin:12px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tiraf img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;border:1px solid var(--linea)}
.tiraf-pie{font-size:13px;font-style:italic;color:var(--texto);margin:10px 0 0;line-height:1.5}
@media (min-width:760px){
  .carriles{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
  .tiraf{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---- dos carriles: aire, medida de lectura y filete central -------------- */
.carriles{gap:var(--s5,56px)}
.carril .foto{margin-bottom:30px}
.carril .et{margin-bottom:10px}
.carril h3{font-size:25px;line-height:1.24;margin:0 0 18px;letter-spacing:-.01em}
.carril p.prosa{font-size:17px;line-height:1.76;margin:0 0 20px;max-width:62ch}
.carril .sub-et{margin:38px 0 6px}
.carril .logros--c li{padding:11px 0;font-size:15px;line-height:1.45}
.carril .tiraf{margin-top:14px;gap:10px}
.carril .tiraf-pie{margin-top:14px;line-height:1.6}
.carril .cita{margin-top:38px;font-size:22px;line-height:1.4;padding-left:22px}
.carril .firma{margin-top:14px}
@media (min-width:760px){
  .carriles{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:0}
  .carriles > .carril{padding-right:clamp(28px,3.6vw,52px)}
  .carriles > .carril + .carril{padding-right:0;padding-left:clamp(28px,3.6vw,52px);border-left:1px solid var(--linea)}
}
@media (max-width:759px){
  .carriles{gap:var(--s4)}
  .carriles > .carril + .carril{border-top:1px solid var(--linea);padding-top:var(--s4)}
}
@media (min-width:760px){.mosaico--tres{grid-template-columns:repeat(3,minmax(0,1fr))}}


/* retratos de la portada: foto grande y texto con aire */
.retratos{gap:var(--s4) 44px}
.retrato{grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:26px}
.retrato h3{font-size:22px;line-height:1.26;margin:6px 0 12px}
.retrato p{font-size:16.5px;line-height:1.72;margin:0}
@media (min-width:980px){.retrato{grid-template-columns:minmax(0,210px) minmax(0,1fr);gap:32px}}
/* la columna de texto no deja un hueco al lado de una pieza alta */
.dos--medio{align-items:center}

/* ---- la carta, como la de la casa --------------------------------------- */
.carta-r{list-style:none;padding:0;margin:16px 0 0}
.carta-r li{padding:14px 0;border-bottom:1px solid var(--linea)}
.carta-r li:first-child{border-top:1px solid var(--tinta)}
.carta-r .f{display:flex;align-items:baseline;gap:10px}
.carta-r .n{color:var(--tinta);font-size:17px;line-height:1.3}
.carta-r .pts{flex:1 1 auto;min-width:16px;border-bottom:1px dotted var(--linea);transform:translateY(-5px)}
.carta-r .p{white-space:nowrap;color:var(--tinta);font-size:17px}
.carta-r .d{display:block;font-size:14px;font-style:italic;color:var(--texto);line-height:1.55;margin-top:4px;max-width:48ch}
.carta-cab{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:2px}
.carta-cab .et{margin:0}
.carta-nota{font-size:14px;font-style:italic;color:var(--texto);margin:14px 0 0;line-height:1.55}

/* ---- la carta, compacta: foto a un lado y dos columnas de carta --------- */
.carta-grid{display:grid;gap:var(--s3);margin-top:var(--s3)}
.carta-cols{display:grid;gap:var(--s3) 44px}
.carta-r li{padding:10px 0}
.carta-r li:first-child{border-top:0}
.carta-r .n{font-size:16.5px}
.carta-r .p{font-size:16.5px;color:var(--texto)}
.carta-r .d{font-size:13.5px;line-height:1.5;margin-top:2px;max-width:44ch}
.carta-r--min li{padding:7px 0}
.carta-grid .foto{margin:0}
@media (min-width:860px){
  .carta-grid{grid-template-columns:minmax(0,290px) minmax(0,1fr);gap:48px;align-items:stretch}
  .carta-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .carta-grid > .foto{height:100%}
  .carta-grid > .foto img{height:100%;width:100%;object-fit:cover;aspect-ratio:auto}
}
/* en la portada, los retratos son una pincelada: ni diminutos ni gigantes */
#nosotros .origen .foto{max-width:290px;margin-bottom:22px}
#nosotros .origen h3{font-size:22px}

/* ---- el mapa, integrado sobre el pie ------------------------------------ */
.pie-mapa{position:relative;background:var(--crema);border-top:1px solid var(--linea);margin-top:var(--salto)}
.pie-mapa iframe{display:block;width:100%;height:340px;border:0;filter:grayscale(.32) sepia(.16) contrast(.96) brightness(1.02)}
.pie-mapa .cont{position:relative}
.pie-mapa-tarjeta{background:var(--papel);border:1px solid var(--linea);box-shadow:0 14px 34px rgba(31,30,28,.14);padding:24px 26px;max-width:330px;margin:-170px 0 26px;position:relative}
.pie-mapa-tarjeta .et{margin:0 0 10px}
.pie-mapa-tarjeta .dir{font-family:var(--serif);font-size:20px;line-height:1.35;color:var(--tinta);margin:0 0 14px}
.pie-mapa-tarjeta .horario{display:grid;grid-template-columns:auto 1fr;gap:5px 16px;font-size:14.5px;margin:0 0 18px}
.pie-mapa-tarjeta .horario dt{color:var(--mute)}
.pie-mapa-tarjeta .horario dd{margin:0;color:var(--tinta)}
.pie-mapa-tarjeta .btn{margin:0}
@media (max-width:620px){
  .pie-mapa iframe{height:240px}
  .pie-mapa-tarjeta{margin:-60px 0 24px;max-width:none}
}
/* ---- el pie, con aire ---------------------------------------------------- */
.pie{padding:68px 0 32px;margin-top:0}
.pie .cols{gap:48px}
.pie .cols p{line-height:1.75}
.pie h4{margin-bottom:18px}
.pie .legal{margin-top:52px;padding-top:20px;align-items:center}
.pie .redes{display:inline-flex;gap:20px;flex-wrap:wrap}
.pie-wa{display:inline-flex;align-items:center;gap:9px}
.pie-wa svg{width:19px;height:19px;fill:none;stroke:#25D366;stroke-width:1.5;stroke-linejoin:round;flex:none}
@media (min-width:860px){.pie .cols{grid-template-columns:1.25fr .85fr .95fr 1.1fr;gap:56px}}

.siguiente .cont{align-items:center}

/* ---- el menú del día: tres platos, con su foto y su orden --------------- */
.menu-hoy{list-style:none;padding:0;margin:0;border-top:1px solid var(--tinta)}
.menu-hoy li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:22px;align-items:center;padding:18px 0;border-bottom:1px solid var(--linea)}
.menu-hoy img{width:84px;height:84px;object-fit:cover;display:block;border:1px solid var(--linea)}
.menu-hoy .et{margin:0 0 5px}
.menu-hoy p{margin:0;font-family:var(--serif);font-size:19px;line-height:1.35;color:var(--tinta)}
@media (max-width:520px){
  .menu-hoy li{grid-template-columns:62px minmax(0,1fr);gap:16px}
  .menu-hoy img{width:62px;height:62px}
  .menu-hoy p{font-size:17px}
}


/* ============================================================
   El chat de WhatsApp (mockup del agente que contestará)
   Colores oficiales de WhatsApp: burbuja #25D366, cabecera #075E54,
   fondo del chat #ECE5DD y mensaje propio #DCF8C6.
   ============================================================ */
.wa{position:fixed;right:24px;bottom:24px;z-index:60;display:none}
.wa-burbuja{position:relative;width:60px;height:60px;border-radius:50%;border:0;background:#25D366;color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 8px 24px rgba(7,94,84,.3);transition:transform .18s,box-shadow .18s;padding:0}
.wa-burbuja svg{width:34px;height:34px;fill:#fff}
.wa-burbuja:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(7,94,84,.38)}
.wa-aviso-punto{position:absolute;top:2px;right:2px;width:13px;height:13px;border-radius:50%;background:var(--acento);border:2px solid var(--papel)}
.wa--abierto .wa-aviso-punto{display:none}
.wa-panel{position:absolute;right:0;bottom:76px;width:370px;max-width:calc(100vw - 32px);background:#ECE5DD;border-radius:12px;overflow:hidden;box-shadow:0 20px 50px rgba(31,30,28,.3);display:none;flex-direction:column;max-height:min(620px, calc(100vh - 140px))}
.wa-panel[hidden]{display:none}
.wa--abierto .wa-panel{display:flex}
.wa-cab{display:flex;align-items:center;gap:12px;background:#075E54;color:#fff;padding:12px 14px}
.wa-ava{width:38px;height:38px;border-radius:50%;background:#0B7265;display:grid;place-items:center;flex:none}
.wa-ava svg{width:26px;height:26px;color:#fff;fill:currentColor}
.wa-quien{display:grid;line-height:1.25;flex:1;min-width:0}
.wa-quien b{font-weight:400;font-size:16px;font-family:var(--serif)}
.wa-quien small{font-size:12px;color:#A7D3CB}
.wa-cerrar{background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:4px 6px;opacity:.85}
.wa-cerrar:hover{opacity:1}
.wa-cuerpo{flex:1;overflow-y:auto;padding:16px 14px 8px;background-color:#ECE5DD;background-image:radial-gradient(rgba(7,94,84,.05) 1px, transparent 1px);background-size:18px 18px}
.wa-dia{text-align:center;margin:0 0 14px;font-size:11.5px;letter-spacing:.06em;color:#5B6B66;background:#fff;display:table;margin-inline:auto;padding:3px 12px;border-radius:8px;box-shadow:0 1px 1px rgba(0,0,0,.06)}
.wa-msj{max-width:84%;margin:0 0 10px;background:#fff;border-radius:8px;padding:7px 10px 5px;box-shadow:0 1px 1px rgba(0,0,0,.08);position:relative}
.wa-msj--mio{margin-left:auto;background:#DCF8C6}
.wa-txt{display:block;font-size:14.5px;line-height:1.5;color:#1F2C28}
.wa-txt b{font-weight:600}
.wa-hora{display:block;text-align:right;font-size:10.5px;color:#7A8C86;margin-top:2px}
.wa-ok{font-style:normal;color:#4FC3F7}
.wa-escribe .wa-txt{display:flex;gap:4px;padding:4px 2px}
.wa-escribe i{width:7px;height:7px;border-radius:50%;background:#9FB0AA;animation:waPunto 1.1s infinite}
.wa-escribe i:nth-child(2){animation-delay:.18s}
.wa-escribe i:nth-child(3){animation-delay:.36s}
@keyframes waPunto{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.wa-chips{display:flex;flex-wrap:wrap;gap:7px;padding:4px 12px 10px;background:#ECE5DD}
.wa-chip{font:inherit;font-size:13px;background:#fff;color:#075E54;border:1px solid rgba(7,94,84,.25);border-radius:16px;padding:6px 13px;cursor:pointer;transition:background .15s}
.wa-chip:hover{background:#D9F2E6}
.wa-pie{display:flex;align-items:center;gap:8px;padding:9px 10px;background:#F0F0F0}
.wa-pie input{flex:1;min-width:0;border:0;border-radius:20px;padding:10px 14px;font:inherit;font-size:14.5px;background:#fff;color:#1F2C28}
.wa-pie input:focus{outline:2px solid rgba(7,94,84,.35);outline-offset:1px}
.wa-pie button{width:40px;height:40px;border-radius:50%;border:0;background:#25D366;display:grid;place-items:center;cursor:pointer;flex:none}
.wa-pie button svg{width:19px;height:19px;fill:#fff}
.wa-nota{margin:0;background:#F0F0F0;padding:0 12px 10px;font-size:11.5px;color:#6B7A75;line-height:1.5;text-align:center}
.wa-nota a{color:#075E54}
@media (min-width:1000px){.wa{display:block}}
/* en móvil no hay burbuja (está la barra de abajo), pero el chat sí se abre */
.wa.wa--abierto{display:block}
@media (max-width:999px){
  .wa--abierto .wa-burbuja{display:none}
  .wa--abierto .wa-panel{position:fixed;left:12px;right:12px;bottom:12px;width:auto;max-width:none;max-height:calc(100vh - 100px)}
}
/* el marco manda: cualquier foto, vertical u horizontal, se recorta al mismo alto */
.prensa .marco{overflow:hidden}
.prensa .marco img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mosaico .mz{overflow:hidden;position:relative}
.mosaico .mz img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---- vitrina: premios, concursos y prensa, sin cajas ni huecos ----------- */
.vitrina{list-style:none;padding:0;margin:var(--s4) 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}
.vitrina li{margin:0}
.vitrina .marco{display:block;aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--crema)}
.vitrina .marco img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.vitrina li:hover .marco img{transform:scale(1.03)}
.vitrina .marco small{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:14px;font-size:12.5px;font-style:italic;color:var(--mute);line-height:1.4}
.vitrina .cap{display:block;margin-top:12px}
.vitrina .cap b{display:block;font-family:var(--serif);font-weight:400;font-size:17px;color:var(--tinta);line-height:1.3}
.vitrina .cap small{display:block;font-size:13px;font-style:italic;color:var(--texto);margin-top:3px;line-height:1.5}
@media (min-width:760px){
  .vitrina{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 26px;grid-auto-flow:dense}
  /* el recorte de prensa ocupa cuatro celdas: se lee y la cuadrícula no se rompe */
  .vitrina .ancha{grid-column:span 2;grid-row:span 2;display:grid;grid-template-rows:1fr auto}
  .vitrina .ancha .marco{aspect-ratio:auto;height:100%;min-height:0}
}

/* ---- el árbol del Círculo ------------------------------------------------ */
.arbol-wrap{display:grid;justify-items:center;text-align:center;gap:20px}
.arbol-circ{width:min(330px,72vw);color:var(--oscuro);line-height:0}
.arbol-circ svg{width:100%;height:auto;display:block}
.arbol-nota{font-size:14.5px;font-style:italic;color:var(--texto);max-width:36ch;line-height:1.65;margin:0}
.arbol-nota b{font-weight:400;color:var(--tinta);font-style:normal}

/* ============================================================
   El viaje de la receta: de la tarjeta de la mesa al WhatsApp.
   Animación en bucle, sencilla: tres momentos sobre un mismo escenario.
   ============================================================ */
.viaje{display:grid;gap:var(--s4)}
.viaje-pasos{list-style:none;padding:0;margin:var(--s3) 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.viaje-pasos li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:16px;align-items:start;padding:16px 0;border-bottom:1px solid var(--linea);transition:opacity .5s}
.viaje-pasos .n{width:26px;height:26px;border-radius:50%;border:1px solid var(--linea);display:grid;place-items:center;font-size:12px;font-style:italic;color:var(--mute);margin-top:2px;transition:background .45s,color .45s,border-color .45s}
.viaje-pasos b{display:block;font-weight:400;font-size:19px;color:var(--tinta);line-height:1.3}
.viaje-pasos span.q{display:block;font-size:14.5px;font-style:italic;color:var(--texto);line-height:1.55;margin-top:3px}
/* escenario */
.escena-mesa{position:relative;aspect-ratio:4/5;max-width:460px;margin:0 auto;background:var(--crema);background-image:var(--grano);border:1px solid var(--linea);overflow:hidden}
.escena-mesa .tarj{position:absolute;left:50%;top:50%;width:58%;transform:translate(-50%,-50%) rotate(-3.5deg);box-shadow:0 14px 34px rgba(31,30,28,.18);border:1px solid var(--linea)}
.escena-mesa .tarj img{display:block;width:100%;height:auto}
.escena-mesa .tel{position:absolute;left:50%;bottom:-6%;width:50%;transform:translate(-50%,0);border-radius:22px;background:var(--tinta);padding:7px;box-shadow:0 18px 40px rgba(31,30,28,.3)}
.escena-mesa .tel-pant{background:var(--papel);border-radius:16px;overflow:hidden;aspect-ratio:9/17;position:relative}
.escena-mesa .capa{position:absolute;inset:0;display:flex;flex-direction:column}
.escena-mesa .capa--scan{background:#1F1E1C}
.escena-mesa .scan-vista{flex:1;display:grid;place-items:center;position:relative;overflow:hidden}
.escena-mesa .scan-vista img{width:78%;opacity:.92;border-radius:3px}
.escena-mesa .marco-scan{position:absolute;left:14%;top:28%;width:72%;aspect-ratio:1/1;border:2px solid rgba(255,255,255,.9);border-radius:10px}
.escena-mesa .rayo{position:absolute;left:14%;width:72%;height:2px;background:linear-gradient(90deg,transparent,#8FE3AE,transparent);box-shadow:0 0 12px #8FE3AE}
.escena-mesa .scan-pie{padding:10px;text-align:center;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.escena-mesa .capa--chat{background:#ECE5DD}
.escena-mesa .chat-cab{background:#075E54;color:#fff;padding:9px 11px;font-size:11.5px;display:flex;justify-content:space-between;gap:8px}
.escena-mesa .chat-cuerpo{flex:1;padding:10px;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.escena-mesa .bur-w{background:#fff;border-radius:7px;padding:7px 9px;font-size:11.5px;line-height:1.45;color:#1F2C28;box-shadow:0 1px 1px rgba(0,0,0,.07)}
.escena-mesa .bur-w b{font-weight:600}
.escena-mesa .bur-w small{display:block;text-align:right;font-size:9px;color:#7A8C86;margin-top:2px}
/* el bucle */
@media (prefers-reduced-motion:no-preference){
  .js .viaje .tarj{animation:vTarj 13s infinite ease-in-out}
  .js .viaje .tel{animation:vTel 13s infinite cubic-bezier(.2,.7,.3,1)}
  .js .viaje .capa--scan{animation:vScan 13s infinite ease-in-out}
  .js .viaje .capa--chat{animation:vChat 13s infinite ease-in-out}
  .js .viaje .rayo{animation:vRayo 13s infinite ease-in-out}
  .js .viaje .viaje-pasos li{opacity:.42}
  .js .viaje .viaje-pasos li:nth-child(1){animation:vPaso 13s infinite} 
  .js .viaje .viaje-pasos li:nth-child(2){animation:vPaso 13s infinite;animation-delay:3.6s}
  .js .viaje .viaje-pasos li:nth-child(3){animation:vPaso 13s infinite;animation-delay:7.6s}
}
@keyframes vTarj{
  0%,24%{transform:translate(-50%,-50%) rotate(-3.5deg) scale(1);filter:none}
  32%,58%{transform:translate(-50%,-62%) rotate(-3.5deg) scale(.86);filter:brightness(.97)}
  66%,100%{transform:translate(-50%,-66%) rotate(-3.5deg) scale(.82);filter:brightness(.94) saturate(.9)}
}
@keyframes vTel{
  0%,22%{transform:translate(-50%,42%);opacity:0}
  34%,100%{transform:translate(-50%,8%);opacity:1}
}
@keyframes vScan{0%,26%{opacity:0}30%,54%{opacity:1}60%,100%{opacity:0}}
@keyframes vChat{0%,56%{opacity:0}62%,96%{opacity:1}100%{opacity:0}}
@keyframes vRayo{0%,30%{top:30%;opacity:0}34%{opacity:1}50%{top:68%;opacity:1}56%,100%{top:68%;opacity:0}}
@keyframes vPaso{0%,2%{opacity:1}26%{opacity:1}30%,100%{opacity:.42}}
.js .demo-receta.is-paused .viaje *{animation-play-state:paused!important}
@media (min-width:900px){.viaje{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}}
.viaje > div{min-width:0}
.escena-mesa{width:100%}
/* los <span> de la escena necesitan ser bloques para que el aspecto funcione */
.escena-mesa .tel-pant,.escena-mesa .scan-pie,.escena-mesa .bur-w,.escena-mesa .tarj{display:block}
.escena-mesa{background-image:none}
/* ajuste fino de la escena: el móvil se ve entero y el marco encuadra la tarjeta */
.escena-mesa .tel{bottom:0;width:48%}
.escena-mesa .scan-vista{padding:0 0 4px}
.escena-mesa .scan-vista img{width:76%}
.escena-mesa .marco-scan{left:10%;top:50%;transform:translateY(-50%);width:80%;aspect-ratio:1/1;border-radius:8px;border-color:rgba(255,255,255,.85)}
.escena-mesa .rayo{left:12%;width:76%}
@keyframes vTel{
  0%,22%{transform:translate(-50%,46%);opacity:0}
  34%,100%{transform:translate(-50%,10%);opacity:1}
}
@keyframes vRayo{0%,30%{top:18%;opacity:0}34%{opacity:1}50%{top:80%;opacity:1}56%,100%{top:80%;opacity:0}}
@keyframes vTel{
  0%,22%{transform:translate(-50%,44%);opacity:0}
  34%,100%{transform:translate(-50%,3%);opacity:1}
}
/* el móvil, en claro: el negro apagaba toda la escena */
.escena-mesa .tel{background:#CFC7B8;padding:8px;border-radius:26px;box-shadow:0 16px 36px rgba(31,30,28,.22),inset 0 0 0 1px rgba(255,255,255,.5)}
.escena-mesa .tel-pant{border-radius:19px}
.escena-mesa .capa--scan{background:var(--oscuro)}
.escena-mesa .scan-vista{padding:0}
.escena-mesa .scan-vista img{width:80%;border-radius:4px;box-shadow:0 8px 20px rgba(0,0,0,.35)}
/* el encuadre de la cámara: cuatro esquinas, como en el móvil de verdad */
.escena-mesa .marco-scan{border:0;border-radius:0;
  background:
    linear-gradient(#fff,#fff) left top/20px 2px no-repeat,
    linear-gradient(#fff,#fff) left top/2px 20px no-repeat,
    linear-gradient(#fff,#fff) right top/20px 2px no-repeat,
    linear-gradient(#fff,#fff) right top/2px 20px no-repeat,
    linear-gradient(#fff,#fff) left bottom/20px 2px no-repeat,
    linear-gradient(#fff,#fff) left bottom/2px 20px no-repeat,
    linear-gradient(#fff,#fff) right bottom/20px 2px no-repeat,
    linear-gradient(#fff,#fff) right bottom/2px 20px no-repeat;
  opacity:.9}
.escena-mesa .marco-scan{left:4%;width:92%}
.escena-mesa .rayo{left:8%;width:84%}

/* ---- resalte tipográfico: el bloque de tinta sobre el titular ------------ */
.marca-alta{background:var(--oscuro);color:var(--crema);padding:.04em .3em .1em;box-decoration-break:clone;-webkit-box-decoration-break:clone;font-style:italic}
/* ---- la tarjeta de la mesa, dibujada (para que el texto cuadre con la web) */
/* el contenedor de consulta va en el padre; dentro, todo en cqw: así la
   tarjeta se dibuja igual sobre la mesa y dentro de la cámara del móvil  */
.escena-mesa .tarj,.escena-mesa .tarj-vista{container-type:inline-size}
.tarj-cara{background:#FBF8F2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4.5cqw;padding:9cqw 8cqw;border:1px solid rgba(31,30,28,.1)}
.tarj-sello{width:17cqw;height:17cqw;color:var(--oscuro);display:block;flex:none}
.tarj-txt{font-family:var(--serif);text-align:center;color:var(--tinta);line-height:1.3;font-size:6.6cqw;display:block}
.tarj-txt em{display:table;margin:.34em auto 0;font-style:italic;font-size:1.14em;background:var(--oscuro);color:var(--crema);padding:.06em .36em .14em}
.tarj-qr{width:40cqw;height:40cqw;display:block;flex:none;mix-blend-mode:multiply}
.escena-mesa .tarj-vista{display:block;width:80%;border-radius:3px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.35)}

/* ---------- La escalera de la portada (un peldaño, un siguiente paso) ----- */
.esc-lead{max-width:68ch;margin:var(--s3) 0 0;font-size:19px;line-height:1.72;color:var(--texto)}
.escalera{--paso:26px;list-style:none;margin:var(--s4) 0 0;padding:0;position:relative;counter-reset:peld}
.escalera > li{counter-increment:peld;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;
  padding:22px 0 24px;border-top:1px solid var(--linea)}
.escalera > li:last-child{border-bottom:1px solid var(--linea)}
.esc-n{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--mute);letter-spacing:.04em;line-height:1}
.escalera h3{margin:0;font-size:26px;line-height:1.15;font-weight:400}
.escalera h3 a{color:var(--tinta);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.escalera h3 a:hover{border-bottom-color:var(--acento)}
.esc-q{margin:0;color:var(--texto);line-height:1.62;max-width:40ch}
.esc-pr{list-style:none;margin:2px 0 0;padding:0;font-family:var(--serif);font-size:16.5px;color:var(--texto);line-height:1.55}
.esc-pr b{font-weight:400;font-size:20px;color:var(--tinta);margin-right:.18em}
.esc-pr .mn{color:var(--mute);font-size:15px}
.esc-pr .mn b{font-size:17px;color:var(--mute)}
.esc-sig{margin-top:auto;padding-top:14px;display:block;width:100%;max-width:34ch;border-top:1px solid var(--linea);
  font-family:var(--serif);font-style:italic;font-size:17px;color:var(--acento);text-decoration:none;line-height:1.4}
.esc-sig::after{content:"→";margin-left:.4em;display:inline-block;transition:transform .2s}
.esc-sig:hover::after{transform:translateX(4px)}
.esc-et{display:block;font-family:var(--sans);font-style:normal;font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--mute);margin-bottom:5px}
.esc-pie{margin:var(--s4) 0 0;font-family:var(--serif);font-size:19px;color:var(--texto)}
.esc-pie-g{color:var(--tinta);font-style:italic}

@media (min-width:950px){
  .escalera{--paso:30px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
  .escalera > li{--top:calc((3 - var(--n)) * var(--paso));border:0;min-height:calc(300px + var(--top));
    padding:calc(22px + var(--top)) 26px 4px}
  .escalera > li:first-child{padding-left:0}
  .escalera > li:last-child{border-bottom:0;padding-right:0}
  /* el peldaño: la línea horizontal y, bajo ella, la contrahuella que separa */
  .escalera > li::before{content:"";position:absolute;left:0;right:0;top:var(--top);border-top:1px solid var(--linea)}
  .escalera > li::after{content:"";position:absolute;left:0;top:var(--top);bottom:0;border-left:1px solid var(--linea)}
  .escalera > li:first-child::after{display:none}
  .escalera > li:last-child::before{right:0}
}
@media (max-width:949px){
  /* en vertical no hay peldaños: hay un camino con sus hitos */
  .escalera{padding-left:30px}
  .escalera::before{content:"";position:absolute;left:4px;top:10px;bottom:10px;width:1px;background:var(--linea)}
  .escalera > li::before{content:"";position:absolute;left:-30px;top:27px;width:9px;height:9px;border-radius:50%;
    background:var(--papel);border:1px solid var(--linea)}
  .escalera > li:last-child::before{background:var(--acento);border-color:var(--acento)}
}
@media (min-width:950px) and (max-width:1160px){
  .escalera{--paso:26px}
  .escalera > li{padding-left:18px;padding-right:18px}
  .escalera h3{font-size:23px}
  .esc-q{font-size:15.5px}
}

/* ===== v55 · ajustes de la auditoría ===================================== */
/* el menú del día es ahora h2 (jerarquía), con el mismo aspecto que tenía */
.ticket .cab h2{margin:0;font-size:22px;border:0;padding:0}
/* galería sin la celda vacía: la horizontal ocupa tres columnas y cierra la fila */
@media (min-width:760px){
  .mosaico .h{grid-column:span 3}
  .mosaico .h .mz{aspect-ratio:7/3}
}
/* la tarjeta de la mesa: el paso siguiente, en el hueco que quedaba */
.viaje-cta{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}
.viaje-cta .cta-nota{margin:0;max-width:36ch}
/* «Pausar» deja de competir con el titular: control discreto al final */
.demo-pausa{margin-top:18px;background:none;border:0;border-radius:0;padding:8px 0;font-size:13px;color:var(--mute);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.demo-pausa:hover{background:none;color:var(--tinta)}
.demo-pausa[aria-pressed="true"]{background:none;color:var(--tinta);border:0}
/* área de toque de 44 px sin mover el diseño */
.flecha,.banda-hoy a{position:relative}
.flecha::before,.banda-hoy a::before{content:"";position:absolute;left:-6px;right:-6px;top:-11px;bottom:-11px}

/* ---- franja de prueba bajo el hero -------------------------------------- */
.prueba{border-bottom:1px solid var(--linea);background:var(--papel)}
.prueba-l{list-style:none;margin:0;padding:18px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}
.prueba-l li{display:grid;gap:3px;line-height:1.3;align-content:start}
.prueba-l b{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--tinta)}
.prueba-l span{font-size:13.5px;font-style:italic;color:var(--texto)}
.prueba-l .ej,.prueba-l .dato{font-size:10px;font-style:normal;vertical-align:1px}
@media (min-width:760px){.prueba-l{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){
  .prueba-l{grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:22px 0}
  .prueba-l li{padding:0 18px;border-left:1px solid var(--linea)}
  .prueba-l li:first-child{padding-left:0;border-left:0}
}

/* ---- El Círculo en la home, sobre el bloque oscuro ----------------------- */
.reveal--circulo .dos{align-items:center}
.reveal--circulo h2 em{font-style:italic}
.reveal--circulo .arbol-circ{color:var(--crema);width:min(300px,64vw)}
.reveal--circulo .arbol-nota{color:var(--crema-2)}
.reveal--circulo .arbol-nota b{color:var(--crema)}
.reveal .hero-datos{border-top-color:rgba(239,233,221,.55)}
.reveal .hero-datos > div{border-bottom-color:rgba(239,233,221,.22)}
.reveal .hero-datos > div + div{border-left-color:rgba(239,233,221,.22)}
.reveal .hero-datos dt{color:var(--crema-2)}
.reveal .hero-datos dd{color:var(--crema)}
.reveal .hero-datos dd small{color:var(--crema-2)}
.circ-cta{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.circ-cta .btn--claro{margin-top:0}
.reveal .flecha{border-bottom-color:rgba(239,233,221,.4)}
.reveal .flecha::after{color:var(--crema)}

/* ---- y en la misma casa: tienda, Cuídate, empresas ----------------------- */
.otras{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;gap:36px}
.otras li{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.otras-foto{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--linea);margin-bottom:8px}
.otras-foto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.otras li:hover .otras-foto img{transform:scale(1.03)}
.otras .et{margin:0}
.otras h3{margin:0;font-size:22px;line-height:1.2}
.otras h3 a{color:var(--tinta);text-decoration:none}
.otras h3 a:hover{text-decoration:underline;text-decoration-color:var(--acento);text-underline-offset:4px;text-decoration-thickness:1px}
.otras p{margin:0;color:var(--texto);line-height:1.6;max-width:42ch}
.otras .otras-nota{font-size:14.5px;font-style:italic}
.otras .otras-nota b{font-weight:400;font-style:normal;color:var(--tinta)}
.otras .flecha{margin-top:auto;padding-top:6px}
@media (min-width:860px){.otras{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}}

/* ---- preguntas ---------------------------------------------------------- */
.faq{border-top:1px solid var(--tinta)}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{list-style:none;cursor:pointer;padding:17px 34px 17px 0;position:relative;font-family:var(--serif);font-size:19px;color:var(--tinta);line-height:1.35;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:15px;font-size:22px;color:var(--acento);font-family:var(--sans);font-weight:300;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
.faq details p{margin:0 0 18px;color:var(--texto);line-height:1.65;max-width:60ch}

/* ---- cierre: reservar --------------------------------------------------- */
.cierre-home{padding:72px 0 80px;text-align:center;border-top:1px solid var(--linea)}
.cierre-home .et{display:block;margin:0 0 10px}
.cierre-home h2{font-size:clamp(34px,5vw,52px);margin:0 0 14px}
.cierre-home p{margin:0 auto;max-width:46ch;color:var(--texto);line-height:1.65}
.cierre-home-b{margin-top:26px!important;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px}

/* ---- móvil: comida a la vista y el menú de hoy sin cortar ---------------- */
.hero-platos{display:none}
@media (max-width:759px){
  .hero-platos{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:2px 0 20px;padding:0}
  .hero-platos img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--linea)}
  .banda-hoy .cont{align-items:flex-start;padding-top:9px;padding-bottom:9px;font-size:14px}
  .banda-hoy .et,.banda-hoy .punto{margin-top:4px}
  .banda-hoy .pre{display:none}
  .banda-hoy .txt{white-space:normal;overflow:visible;line-height:1.45}
  .banda-hoy a{margin-top:1px}
}

/* ---- página legal y enlaces del pie ------------------------------------- */
.legal-pag{max-width:760px}
.legal-pag h1{font-size:clamp(32px,4.5vw,44px);margin:8px 0 14px}
.legal-pag h2{margin-top:var(--s5,56px);padding-top:18px;border-top:1px solid var(--tinta);font-size:26px;scroll-margin-top:90px}
.legal-datos{margin:0 0 18px;border-top:1px solid var(--linea)}
.legal-datos > div{display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--linea)}
.legal-datos dt{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);padding-top:3px}
.legal-datos dd{margin:0;color:var(--tinta)}
.legal-lista{margin:0 0 16px;padding-left:20px;color:var(--texto);line-height:1.7}
.legal-l{display:flex;flex-wrap:wrap;gap:6px 18px}
.legal-l a{color:inherit}

.prueba-a{color:inherit;text-decoration:underline;text-decoration-color:var(--linea);text-underline-offset:3px}
.prueba-a:hover{text-decoration-color:var(--acento)}
/* el bloque marrón es su propia caja: ya no se monta sobre las letras de la línea de arriba */
.marca-alta{display:inline-block;margin-top:.16em;line-height:1.08;padding:.03em .3em .12em}
.prueba-l b span{font-size:inherit;font-style:normal;color:inherit}
/* con once preguntas, el titular acompaña mientras se leen */
@media (min-width:900px){#preguntas .dos{align-items:start}#preguntas .dos > div:first-child{position:sticky;top:110px}}

/* ===== franja de datos v56: iconos con significado y opiniones con su plataforma ===== */
.prueba{background:var(--papel);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.prueba-l{padding:26px 0;gap:22px 18px;align-items:stretch}
.prueba-l > li{display:flex;flex-direction:column;align-items:flex-start;gap:3px;line-height:1.3}
.pr-ico{width:30px;height:30px;color:var(--acento);margin-bottom:8px;flex:none}
.prueba-l > li > b{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--tinta)}
.prueba-l > li > span{font-size:13.5px;font-style:italic;color:var(--texto)}
.prueba-l .res :where(span){font-size:inherit;font-style:normal;color:inherit}
/* opiniones */
.prueba-l .pr-res .res{display:flex;flex-direction:column;gap:6px;color:inherit;text-decoration:none;width:100%}
.prueba-l .res-cab{display:flex;align-items:center;gap:8px;height:30px;margin-bottom:2px}
.prueba-l .res-ico{width:26px;height:26px;color:var(--acento)}
.prueba-l .res-logo{width:24px;height:24px;object-fit:contain;display:block}
.prueba-l .res-plat{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--texto)}
.prueba-l .res-nota{display:flex;align-items:center;gap:10px;line-height:1}
.prueba-l .res-nota b{font-family:var(--serif);font-weight:400;font-size:27px;color:var(--tinta);letter-spacing:-.01em}
.prueba-l .estrellas{position:relative;display:inline-block;line-height:0}
.prueba-l .est-capa{display:inline-flex;gap:2px;color:var(--linea)}
.prueba-l .est-capa svg{width:13px;height:13px;display:block;flex:none}
.prueba-l .est-llena{position:absolute;left:0;top:0;color:var(--acento);overflow:hidden;width:calc(var(--v) / 5 * 100%);white-space:nowrap}
.prueba-l .res-tot{font-size:13.5px;font-style:italic;color:var(--texto);text-decoration:underline;text-decoration-color:var(--linea);text-underline-offset:3px}
.prueba-l .res:hover .res-tot{text-decoration-color:var(--acento)}
.prueba-l .res:focus-visible{outline:2px solid var(--acento);outline-offset:4px}
.prueba-l .res-tot .ej{display:table;font-style:normal;font-size:10px;margin-top:6px;text-decoration:none}
@media (min-width:1100px){
  .prueba-l{grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:28px 0}
  .prueba-l > li{padding:0 20px;border-left:1px solid var(--linea)}
  .prueba-l > li:first-child{padding-left:0;border-left:0}
  .prueba-l > li.pr-res{background:linear-gradient(var(--papel),var(--papel))}
}

/* ===== escalera: tres peldaños, cada uno con su foto (las fotos suben como la escalera) ===== */
.esc-foto{display:block;width:100%;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--linea);margin-bottom:12px;background:var(--crema)}
.esc-foto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.escalera > li:hover .esc-foto img{transform:scale(1.035)}
@media (min-width:950px){
  .escalera{--paso:44px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .escalera > li{--top:calc((2 - var(--n)) * var(--paso));min-height:0;padding:calc(24px + var(--top)) 30px 4px}
  .escalera > li:first-child{padding-left:0}
  .escalera > li:last-child{padding-right:0}
  .esc-foto{aspect-ratio:4/3;margin-bottom:16px}
}
@media (min-width:950px) and (max-width:1160px){
  .escalera{--paso:36px}
  .escalera > li{padding-left:20px;padding-right:20px}
}

/* ===== escalera: un icono por peldaño, en el sello de la casa (doble aro, como el logo y el ticket) ===== */
.esc-ico{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--crema);color:var(--acento);
  border:1px solid var(--linea);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea);margin-bottom:14px;
  transition:transform .45s ease,box-shadow .45s ease}
.esc-ico svg{width:54px;height:54px;display:block}
.escalera > li:hover .esc-ico{transform:translateY(-3px);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--acento)}
@media (min-width:950px){.esc-ico{width:92px;height:92px;margin-bottom:18px}.esc-ico svg{width:58px;height:58px}}
@media (max-width:949px){.escalera > li::before{top:52px}}

/* ---- cierre con la fachada: para reconocer la puerta al llegar ---------- */
.cierre-home-g{display:grid;gap:32px;align-items:center;text-align:left}
.cierre-foto{margin:0}
.cierre-foto img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 50%;border:1px solid var(--linea)}
.cierre-foto figcaption{font-size:13px;font-style:italic;color:var(--texto);margin-top:8px}
.cierre-txt .et{display:block;margin:0 0 10px}
.cierre-txt p{margin:0;max-width:40ch}
.cierre-home .cierre-txt .cierre-home-b{justify-content:flex-start}
@media (min-width:900px){
  .cierre-home-g{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px}
}

/* ---- la puerta en la tarjeta del mapa (todas las páginas) ---------------- */
.pie-mapa-tarjeta{max-width:360px;padding:0 0 24px;overflow:hidden}
.pie-mapa-tarjeta > :not(.pie-mapa-foto){margin-left:26px;margin-right:26px}
.pie-mapa-foto{margin:0 0 18px;line-height:0;border-bottom:1px solid var(--linea)}
.pie-mapa-foto img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
@media (min-width:900px){.pie-mapa iframe{height:420px}.pie-mapa-tarjeta{margin-top:-330px}}
@media (max-width:899px){.pie-mapa-tarjeta{max-width:none}.pie-mapa-foto img{aspect-ratio:16/10}}

/* ===== Nuestra historia · dos líneas de tiempo que confluyen en una ======= */
.rieles,.confluye{display:none}
@media (min-width:760px){
  #caminos{padding-bottom:0}
  .carriles{position:relative}
  .carriles > .carril + .carril{border-left:0}
  .rieles{display:block;position:absolute;top:6px;bottom:0;left:50%;width:22px;transform:translateX(-50%);pointer-events:none;z-index:1}
  .riel{position:absolute;top:0;bottom:0;width:1px;background:var(--linea)}
  .riel--a{left:0}
  .riel--b{right:0}
  .riel-lleno{position:absolute;left:0;top:0;width:1px;height:calc(var(--p,0) * 100%);background:var(--acento)}
  .riel-punto{position:absolute;left:50%;top:calc(var(--p,0) * 100%);width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;
    background:var(--acento);box-shadow:0 0 0 4px var(--papel),0 0 0 5px rgba(91,43,40,.28);opacity:0;transition:opacity .4s}
  .js .riel-punto{opacity:var(--o,1)}
  .riel-punto span{position:absolute;top:50%;writing-mode:vertical-rl;font-family:var(--sans);font-weight:300;font-size:9px;letter-spacing:.24em;
    text-transform:uppercase;color:var(--acento);white-space:nowrap;line-height:1}
  .riel--a .riel-punto span{right:12px;transform:translateY(-50%) rotate(180deg)}
  .riel--b .riel-punto span{left:12px;transform:translateY(-50%)}
  /* la confluencia */
  .confluye{display:block;position:relative;width:120px;height:150px;margin:0 auto}
  .confluye svg{display:block;width:100%;height:100%;overflow:visible}
  .confluye path{fill:none;stroke-width:1;vector-effect:non-scaling-stroke}
  .cf-base{stroke:var(--linea)}
  .cf-lleno{stroke:var(--acento);stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--q,0))}
  .cf-nudo{position:absolute;left:50%;bottom:4px;width:15px;height:15px;margin-left:-7.5px;border-radius:50%;background:var(--papel);
    border:1px solid var(--linea);transition:background .5s,border-color .5s,transform .5s cubic-bezier(.2,.8,.3,1.4),box-shadow .5s}
  .confluye.unido .cf-nudo{background:var(--acento);border-color:var(--acento);transform:scale(1.25);box-shadow:0 0 0 5px var(--papel),0 0 0 6px rgba(91,43,40,.3)}
  #camino{padding-top:20px}
}
/* «Y aquí confluyen», centrado */
#camino .sec-cab{display:block;text-align:center;border-top:0;padding-top:0;margin-bottom:18px}
#camino .sec-cab h2{font-size:clamp(30px,3.6vw,42px)}
#camino .sec-cab .nota{display:block;margin-top:8px}
#camino > .cont > .prosa{margin:0 auto;text-align:center}
/* la línea de Luz y Tierra */
.cl-wrap{position:relative;margin-top:var(--s4)}
.cl-wrap .camino-l{margin-top:0}
.cl-lleno,.cl-punto{display:none}
.js .cl-lleno,.js .cl-punto{display:block}
.cl-lleno{position:absolute;top:6px;left:5px;width:1px;height:calc(var(--p,0) * (100% - 12px));background:var(--acento);z-index:1}
.cl-punto{position:absolute;left:5px;top:calc(6px + var(--p,0) * (100% - 12px));width:13px;height:13px;margin:-6.5px 0 0 -6px;border-radius:50%;
  background:var(--acento);box-shadow:0 0 0 4px var(--papel),0 0 0 5px rgba(91,43,40,.28);z-index:2}
.camino-l--uno li::before{transition:background .4s,border-color .4s,transform .4s}
.camino-l--uno li.llegado::before{background:var(--acento);border-color:var(--acento)}
@media (min-width:760px){
  .cl-wrap{max-width:900px;margin-left:auto;margin-right:auto}
  .camino-l--uno{max-width:none;padding:0}
  .camino-l--uno::before{left:50%;top:6px;bottom:6px}
  .cl-lleno{left:50%}
  .cl-punto{left:50%;margin-left:-6.5px}
  .camino-l--uno li{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:72px;padding:0 0 38px}
  .camino-l--uno li::before{left:50%;top:6px;margin-left:-5px;width:10px;height:10px}
  .camino-l--uno .c-a,.camino-l--uno .c-t{grid-row:1}
  .camino-l--uno li:nth-child(odd) .c-t{grid-column:1;text-align:right}
  .camino-l--uno li:nth-child(odd) .c-a{grid-column:2;text-align:left}
  .camino-l--uno li:nth-child(even) .c-a{grid-column:1;text-align:right}
  .camino-l--uno li:nth-child(even) .c-t{grid-column:2;text-align:left}
  .camino-l--uno .c-a{font-size:14px;padding-top:3px}
  .camino-l--uno .c-t{font-size:20px}
  .camino-l--uno .c-t small{font-size:14px;margin-top:4px}
  .camino-l--uno li:last-child::before{width:14px;height:14px;margin-left:-7px;top:4px}
}

/* ===== bloques marrones: más compactos y más estrechos en toda la web ===== */
.reveal{padding:36px 0}
.reveal > .cont{padding-top:28px;padding-bottom:28px;max-width:1040px}
.reveal h2,.reveal .grande{font-size:30px;margin-bottom:.4em}
.reveal p{font-size:16.5px;line-height:1.6;margin-top:0;margin-bottom:.8em}
.reveal .agua{width:260px;height:260px;right:-40px;bottom:-60px}
.reveal .foto img,.reveal figure img{max-height:340px;object-fit:cover}
.reveal .dos{gap:28px}
@media (min-width:760px){
  .reveal{padding:52px 0}
  .reveal > .cont{padding:36px 48px}
  .reveal h2,.reveal .grande{font-size:38px}
  .reveal .dos{gap:48px}
}
@media (min-width:1100px){.reveal .grande{font-size:42px}}
/* cierre de Nuestra historia */
.cierre-es > .cont{max-width:880px}
.cierre-es h2.grande{margin:6px auto 12px}
.cierre-es p{max-width:56ch}
.reveal h2,.reveal .grande{max-width:24ch}
@media (min-width:760px){.reveal{padding:40px 0}.reveal > .cont{padding:32px 44px}.reveal h2,.reveal .grande{font-size:36px}}
@media (min-width:1100px){.reveal .grande{font-size:38px}}
@media (max-width:759px){.reveal{padding:28px 0}.reveal > .cont{padding-top:24px;padding-bottom:24px}.reveal h2,.reveal .grande{font-size:28px}}
@media (max-width:759px){.reveal--circulo .arbol-circ{width:170px}.reveal--circulo .arbol-wrap{gap:12px}}
@media (min-width:760px){.reveal--circulo .arbol-circ{width:min(240px,30vw)}}
.reveal h2,.reveal .grande{line-height:1.14}

/* ===== los 29 talleres: acordeón con foto, sutil ========================= */
.talleres--acordeon{border-top:1px solid var(--tinta)}
.tl{border-bottom:1px solid var(--linea);margin:0}
.tl details{margin:0}
.tl summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:34px minmax(0,1fr) auto 28px;grid-template-areas:"n t c m" "n d c m";
  column-gap:14px;row-gap:3px;align-items:center;padding:20px 10px;margin:0 -10px;transition:background .3s ease}
.tl summary::-webkit-details-marker{display:none}
.tl summary:hover{background:rgba(239,233,221,.65)}
.tl summary:focus-visible{outline:2px solid var(--acento);outline-offset:-2px}
.tl-n{grid-area:n;align-self:start;padding-top:5px;font-family:var(--serif);font-style:italic;font-size:13px;color:var(--mute);letter-spacing:.04em}
.tl summary h3{grid-area:t;margin:0;font-size:21px;line-height:1.22;font-weight:400;color:var(--tinta);transition:color .3s}
.tl-d{grid-area:d;font-size:14.5px;font-style:italic;color:var(--texto);line-height:1.5;transition:opacity .35s,max-height .35s;max-height:4.5em;overflow:hidden}
.tl-chip{grid-area:c;font-family:var(--sans);font-weight:300;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--acento);
  border:1px solid rgba(91,43,40,.3);border-radius:20px;padding:4px 10px;white-space:nowrap}
.tl-mas{grid-area:m;position:relative;width:28px;height:28px;border-radius:50%;border:1px solid var(--linea);transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .3s,background .3s}
.tl-mas::before,.tl-mas::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1px;background:var(--acento);transform:translate(-50%,-50%)}
.tl-mas::after{transform:translate(-50%,-50%) rotate(90deg)}
.tl summary:hover .tl-mas{border-color:var(--acento)}
.tl details[open] .tl-mas{transform:rotate(45deg);background:var(--acento);border-color:var(--acento)}
.tl details[open] .tl-mas::before,.tl details[open] .tl-mas::after{background:var(--papel)}
.tl details[open] summary .tl-d{opacity:0;max-height:0}
.tl details[open] summary h3{color:var(--acento)}
/* el cuerpo desplegado */
.tl-cuerpo{overflow:hidden}
.tl-in{display:grid;gap:22px;padding:4px 0 28px 48px}
.tl-foto{margin:0;position:relative;overflow:hidden;border:1px solid var(--linea);aspect-ratio:4/3;background:var(--crema)}
.tl-foto img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.06);opacity:0;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),opacity .7s ease}
.tl details[open] .tl-foto img{transform:scale(1);opacity:1}
.tl-prov{position:absolute;left:10px;bottom:10px;background:rgba(243,238,229,.92)}
.tl-info{display:flex;flex-direction:column;gap:12px;min-width:0}
.tl-info > *{opacity:0;transform:translateY(8px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.tl details[open] .tl-info > *{opacity:1;transform:none}
.tl details[open] .tl-info > :nth-child(2){transition-delay:.06s}
.tl details[open] .tl-info > :nth-child(3){transition-delay:.12s}
.tl details[open] .tl-info > :nth-child(4){transition-delay:.18s}
.tl-info .et{margin:0}
.tl-lead{margin:0;font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.4;color:var(--tinta);max-width:34ch}
.tl-datos{margin:4px 0 0;border-top:1px solid var(--linea)}
.tl-datos > div{display:grid;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:14.5px}
.tl-datos dt{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);padding-top:3px}
.tl-datos dd{margin:0;color:var(--tinta)}
.tl-acc{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin:6px 0 0}
@media (min-width:860px){
  .tl-in{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px;padding:6px 0 34px 48px;align-items:start}
}
@media (max-width:600px){
  .tl summary{grid-template-columns:26px minmax(0,1fr) 28px;grid-template-areas:"n t m" "n d m" "n c m";column-gap:10px}
  .tl-chip{justify-self:start;margin-top:4px}
  .tl-in{padding-left:0}
  .tl-lead{font-size:19px}
}
@media (prefers-reduced-motion:reduce){.tl-foto img,.tl-info > *,.tl-mas{transition:none}}
@media (min-width:860px){.tl-in{grid-template-columns:minmax(0,4fr) minmax(0,6fr)}}

/* ===== Transforma: el año en cuatro peldaños ============================== */
.tris{list-style:none;margin:var(--s3) 0 0;padding:0;display:grid;gap:14px}
.tri{position:relative;border:1px solid var(--linea);background:var(--papel);padding:22px 22px 20px;display:flex;flex-direction:column;gap:6px}
.tri--1{border-color:var(--tinta);box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px var(--linea)}
.tri-n{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--mute)}
.tri-aqui{position:absolute;top:18px;right:18px;font-family:var(--sans);font-weight:300;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--papel);background:var(--acento);border-radius:20px;padding:4px 10px}
.tri h3{margin:2px 0 0;font-size:21px;line-height:1.25;font-weight:400}
.tri-m{font-size:13.5px;font-style:italic;color:var(--acento)}
.tri-s{list-style:none;margin:12px 0 0;padding:12px 0 0;border-top:1px solid var(--linea);display:grid;gap:8px}
.tri-s li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;font-size:14.5px;line-height:1.45;color:var(--texto)}
.tri-s li span{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--mute);padding-top:1px}
.tris-pie{margin:18px 0 0;font-size:15px;font-style:italic;color:var(--texto)}
@media (min-width:900px){
  .tris{grid-template-columns:repeat(4,minmax(0,1fr));align-items:end;gap:16px}
  .tri{min-height:calc(300px + var(--n) * 26px)}
}
/* el primer trimestre: acordeón con las listas */
.tl--t1 .tl-in{grid-template-columns:1fr;gap:26px}
@media (min-width:860px){.tl--t1 .tl-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}}
.t1-l{margin:6px 0 0;padding:0 0 0 18px;display:grid;gap:6px;font-size:15px;line-height:1.5;color:var(--tinta)}
.t1-l li::marker{color:var(--mute);font-family:var(--serif);font-style:italic;font-size:13px}
.t1-l--rec{columns:1}
.t1-coc{margin:10px 0 0;padding:14px 16px;background:var(--crema);border-left:2px solid var(--acento);font-size:14.5px;line-height:1.6;color:var(--texto)}
.t1-coc b{display:block;font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--acento);margin-bottom:4px}
.t1-martes{margin:var(--s3) 0 0;font-size:15.5px;line-height:1.6;color:var(--texto);max-width:70ch}
.t1-martes b{font-weight:400;color:var(--tinta)}
/* lo que incluye */
.incluye{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.incluye li{display:grid;gap:3px;padding:13px 0;border-bottom:1px solid var(--linea)}
.incluye b{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--tinta)}
.incluye span{font-size:14.5px;color:var(--texto);line-height:1.55}
/* aparte del programa */
.aparte{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--linea)}
.aparte li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px 24px;padding:14px 0;border-bottom:1px solid var(--linea)}
.aparte b{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--tinta)}
.aparte span{font-size:14.5px;font-style:italic;color:var(--texto)}
.aparte em{font-style:normal;font-family:var(--serif);font-size:17px;color:var(--tinta)}
@media (min-width:760px){.aparte li{grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) auto;align-items:baseline}}
.sec--corta{padding-top:calc(var(--salto) * .7);padding-bottom:calc(var(--salto) * .7)}
@media (min-width:900px){.tris{align-items:stretch}.tri{min-height:0}}

/* ===== v70 · compactación (auditoría 2) ================================== */
/* tarjeta del mapa: ahora también es el cierre de reserva */
.pm-tit{font-family:var(--serif);font-size:26px;line-height:1.15;color:var(--tinta);margin:2px 0 10px}
.pie-mapa-tarjeta .dir{font-size:18px}
.pm-acc{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:0}
.pm-acc .btn{margin:0}
@media (min-width:900px){.pie-mapa-tarjeta{max-width:380px;margin-top:-360px}.pie-mapa iframe{height:460px}}
/* receta: los pasos apagados se siguen leyendo */
.js .viaje .viaje-pasos li{opacity:.7}
/* huecos entre la galería y la receta */
#la-casa{padding-bottom:calc(var(--salto) * .55)}
.sec:has(#demo-receta){padding-top:calc(var(--salto) * .55);padding-bottom:calc(var(--salto) * .6)}
@media (min-width:900px){.viaje{align-items:start}}
/* área táctil de «Pausar» */
.demo-pausa{padding:14px 0;min-height:44px}
/* firma de las respuestas */
.faq-firma{margin:14px 0 0;font-size:12.5px;letter-spacing:.04em;color:var(--mute);font-style:italic}

@media (max-width:759px){
  /* H2: los platos ya están bajo el titular; en el ticket, solo el texto */
  .ticket .menu-dia img{display:none}
  .ticket .menu-dia li{grid-template-columns:1fr}
  /* H10: la galería, en una fila que se desliza */
  #la-casa .mosaico{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:calc(var(--lado) * -1);margin-right:calc(var(--lado) * -1);
    padding:0 var(--lado) 6px;scrollbar-width:none}
  #la-casa .mosaico::-webkit-scrollbar{display:none}
  #la-casa .mosaico li{flex:0 0 62%;scroll-snap-align:start}
  #la-casa .mosaico .h{flex-basis:86%}
  #la-casa .mosaico .h .mz{aspect-ratio:4/3}
  /* H7: Rafa y Laura con foto al lado */
  #nosotros .dos{gap:26px}
  #nosotros .origen{display:grid;grid-template-columns:118px minmax(0,1fr);column-gap:16px;align-items:start}
  #nosotros .origen .foto{grid-row:1 / span 3;margin:0;max-width:none}
  #nosotros .origen h3{font-size:19px;margin-bottom:6px}
  #nosotros .origen .prosa{font-size:15.5px;line-height:1.6}
  /* H3: las otras puertas, en lista con foto pequeña */
  .otras{gap:0;border-top:1px solid var(--linea)}
  .otras li{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:14px;row-gap:4px;padding:16px 0;border-bottom:1px solid var(--linea);align-items:start}
  .otras-foto{grid-row:1 / span 5;margin:0;aspect-ratio:1/1}
  .otras h3{font-size:18px}
  .otras p{font-size:14.5px;line-height:1.55}
  .otras .flecha{margin-top:4px;padding-top:0}
}
/* franja de datos con siete piezas: cuatro datos y tres plataformas de opiniones */
@media (min-width:760px) and (max-width:1099px){.prueba-l{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1100px){
  .prueba-l{grid-template-columns:repeat(7,minmax(0,1fr))}
  .prueba-l > li{padding:0 16px}
  .prueba-l .res-nota b{font-size:25px}
}
/* móvil: los cuatro datos en 2 × 2 y las tres opiniones en una fila */
@media (max-width:759px){
  .prueba-l{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:12px}
  .prueba-l > li{grid-column:span 3}
  .prueba-l > li.pr-res{grid-column:span 2}
  .prueba-l .res-nota{flex-direction:column;align-items:flex-start;gap:4px}
  .prueba-l .res-nota b{font-size:22px}
  .prueba-l .res-plat{font-size:9.5px;letter-spacing:.12em}
  .prueba-l .res-tot{font-size:12.5px}
}

/* ===== mapa del pie: la tarjeta va encima del mapa, sin franja debajo ===== */
@media (max-width:699px){.pie-mapa-tarjeta{margin:-60px 0 24px;max-width:none}}
@media (min-width:700px){
  .pie-mapa iframe{height:600px}
  .pie-mapa > .cont{position:absolute;top:0;bottom:0;left:0;right:0;margin:0 auto;display:flex;align-items:center;justify-content:flex-end;pointer-events:none}
  .pie-mapa-tarjeta{pointer-events:auto;margin:0;width:400px;max-width:400px;padding-bottom:22px}
  .pie-mapa-foto{margin-bottom:16px}
  .pie-mapa-foto img{aspect-ratio:16/9}
  .pm-tit{font-size:24px;margin-bottom:8px}
  .pie-mapa-tarjeta .dir{font-size:17px;margin-bottom:12px}
  .pie-mapa-tarjeta .horario{grid-template-columns:auto 1fr auto 1fr;gap:5px 14px;font-size:14px;margin-bottom:16px}
}
/* tablet: el mapa arriba y la tarjeta en horizontal debajo, montada sobre él */
@media (min-width:700px) and (max-width:1099px){
  .pie-mapa iframe{height:380px}
  .pie-mapa > .cont{position:relative;inset:auto;display:block;pointer-events:auto}
  .pie-mapa-tarjeta{width:auto;max-width:none;margin:-90px 0 28px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);padding:0;align-items:stretch}
  .pie-mapa-foto{grid-row:1 / span 6;margin:0;border-bottom:0;border-right:1px solid var(--linea)}
  .pie-mapa-foto img{height:100%;aspect-ratio:auto}
  .pie-mapa-tarjeta > :not(.pie-mapa-foto){margin-left:24px;margin-right:24px}
  .pie-mapa-tarjeta > .et{margin-top:20px}
  .pie-mapa-tarjeta > .pm-acc{margin-bottom:20px}
}

/* ===== v73 · ajuste fino de la versión móvil ============================== */
/* la firma del cierre no hereda el tamaño de los párrafos del bloque marrón */
.reveal .cierre-firma{font-size:10px;line-height:1.7;letter-spacing:.22em;max-width:none}
@media (max-width:759px){
  /* 1. Datos del hero: de tres columnas apretadas a filas limpias (etiqueta · valor) */
  .hero-datos{grid-template-columns:1fr;max-width:none}
  .hero-datos > div{display:grid;grid-template-columns:minmax(0,104px) minmax(0,1fr);column-gap:14px;align-items:baseline;padding:11px 0}
  .hero-datos > div + div{border-left:0;padding-left:0}
  .hero-datos dt{margin:0;padding-top:2px}
  .hero-datos dd{font-size:16.5px}
  .hero-datos dd small{display:inline;margin-left:6px;font-size:13px}
  /* 2. Tienda: el precio arriba y el botón debajo, a todo el ancho */
  .prod-pie{flex-direction:column;align-items:stretch;gap:8px}
  .prod-pie .pr{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
  .prod-pie .pr small{display:inline;margin:0}
  .prod-pie .btn{width:100%;justify-content:center;white-space:nowrap}
  /* 3. Trimestre de Iniciación (Aprende): sesión, fecha y título apilados */
  .pieza-filas li{grid-template-columns:1fr auto;row-gap:4px}
  .pieza-filas li .n{grid-column:1;grid-row:1}
  .pieza-filas li .d{grid-column:2;grid-row:1;justify-self:end}
  .pieza-filas li > span:not(.n):not(.d){grid-column:1 / -1;grid-row:2}
  .pieza-filas li.entre{display:block}
  .pieza-sello{transform:scale(.8);transform-origin:top right}
  /* 4. Cierres marrones: la lista de garantías en columna, centrada */
  .cierre-fiable{flex-direction:column;align-items:center;gap:8px;margin-top:24px}
  .cierre-fiable li{text-align:center}
  /* 5. Lo que se desliza en horizontal avisa de que hay más */
  .horario-wrap,.tabs-fam ul,.cat-chips ul{-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
  /* 6. Pie: «La casa» y «También» lado a lado */
  .pie .cols{grid-template-columns:1fr 1fr;gap:34px 22px}
  .pie .cols > .marca-pie,.pie .cols > div:last-child{grid-column:1 / -1}
  /* 7. Escalera: el hito de la línea a la altura del icono */
  .escalera > li::before{top:38px}
  /* 8. Nuestra historia: la confluencia también en móvil, más pequeña */
  .confluye{display:block;position:relative;width:90px;height:110px;margin:8px auto 0}
  .confluye svg{display:block;width:100%;height:100%;overflow:visible}
  .confluye path{fill:none;stroke-width:1;vector-effect:non-scaling-stroke}
  .cf-base{stroke:var(--linea)}
  .cf-lleno{stroke:var(--acento);stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--q,0))}
  .cf-nudo{position:absolute;left:50%;bottom:4px;width:13px;height:13px;margin-left:-6.5px;border-radius:50%;background:var(--papel);border:1px solid var(--linea);transition:background .5s,border-color .5s}
  .confluye.unido .cf-nudo{background:var(--acento);border-color:var(--acento)}
  #caminos{padding-bottom:0}
  #camino{padding-top:16px}
}
@media (max-width:759px){
  .cierre-fiable li::before{display:none}
  .cierre-fiable li + li{border-top:1px solid rgba(239,233,221,.16);padding-top:8px}
  .reveal .cierre-firma{margin-top:22px}
  .escalera > li::before{top:60px}
}

/* ===== v74 · móvil curado: menos repetición, el orden que pide quien llega ===== */
.faq-mas{display:none}
@media (max-width:759px){
  /* fuera lo que se repite unas líneas más abajo */
  .p-index .hero .hero-datos,          /* los precios ya están en el menú del día, la escalera y el Círculo */
  .p-come .hero .hero-datos,           /* horario y parking: en la tarjeta del mapa */
  .p-aprende .hero .hero-datos,        /* precio y duración: ya en la entradilla */
  .p-cuidate .hero .hero-datos,        /* precios: en las tablas de abajo */
  .p-circulo .hero .hero-datos,        /* cuesta / vale: en «Lo que te llevas» */
  .p-nuestra-historia .hero .hero-datos, /* Rafa / Laura: lo cuentan sus columnas */
  .reveal--circulo .hero-datos,
  .escuela-home .hero-datos{display:none}
  .p-index .banda-hoy{display:none}    /* en la portada el menú del día ya está en pantalla */
  .ticket .cartel-mini{display:none}
  /* la receta: la animación explica los tres pasos; el texto, una sola vez */
  #demo-receta .viaje-pasos,#demo-receta .viaje-cta .cta-nota,#demo-receta .demo-pausa{display:none}
  #demo-receta .viaje-cta{margin-top:18px}
  /* la Escuela en la portada: el vídeo y el botón; el índice de capítulos, dentro */
  .escuela-home .capit{display:none}
  /* preguntas: cinco a la vista y el resto bajo demanda */
  .js .faq:not(.faq--todas) details:nth-of-type(n+6){display:none}
  .js .faq-mas{display:block;width:100%;margin-top:14px;padding:14px;border:1px solid var(--linea);background:none;
    font-family:var(--serif);font-size:16px;color:var(--acento);cursor:pointer;border-radius:var(--radio)}
  #preguntas .faq-firma{display:none}
}
@media (max-width:759px){
  .p-escuela #dentro{display:none}            /* capturas de escritorio: en el móvil no se leen; el móvil ya se ve en la cabecera */
  .p-aprende .pieza--programa{display:none}   /* el detalle del trimestre está en la página del Transforma */
}

/* ===== menú del día: los platos, servidos (formato de carta intacto) ====== */
.menu-dia li{grid-template-columns:118px minmax(0,1fr);gap:22px;padding:16px 0}
.plato-foto{position:relative;display:block;width:118px;height:118px;margin-left:-58px;border-radius:50%;
  background:var(--papel);padding:5px;box-shadow:0 0 0 1px var(--linea),0 14px 26px -8px rgba(74,40,38,.45),0 3px 8px rgba(31,30,28,.12);
  transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}
.plato-foto::after{content:"";position:absolute;inset:5px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),inset 0 -10px 18px rgba(0,0,0,.12);pointer-events:none}
.menu-dia .plato-foto img{display:block;width:100%;height:100%;object-fit:cover;border:0;border-radius:50%;transform:scale(1.18);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.menu-dia li:hover .plato-foto{transform:translateY(-3px) rotate(-4deg);box-shadow:0 0 0 1px var(--acento),0 20px 34px -10px rgba(74,40,38,.55),0 4px 10px rgba(31,30,28,.14)}
.menu-dia li:hover .plato-foto img{transform:scale(1.28)}
.menu-dia .plato-t{font-family:var(--serif);font-size:19px;line-height:1.28}
.menu-dia .et--inline{color:var(--acento);margin-bottom:5px}
.ticket{padding-left:30px}
/* entrada: los platos llegan a la mesa uno tras otro */
@media (prefers-reduced-motion:no-preference){
  .js .menu-dia li{animation:servir .8s cubic-bezier(.2,.7,.2,1) both}
  .js .menu-dia li:nth-child(2){animation-delay:.12s}
  .js .menu-dia li:nth-child(3){animation-delay:.24s}
  @keyframes servir{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
}
@media (max-width:759px){
  .p-index .hero-platos{display:none}           /* los platos ya se ven, más grandes, en el menú */
  .ticket .menu-dia img{display:block}
  .ticket .menu-dia li{grid-template-columns:96px minmax(0,1fr);gap:16px}
  .plato-foto{width:96px;height:96px;margin-left:0;padding:4px}
  .ticket{padding-left:18px}
  .menu-dia .plato-t{font-size:17px}
}
/* ajuste: plato más cerca del texto, sin aro dibujado y sin ampliar la foto de más */
.menu-dia li{grid-template-columns:64px minmax(0,1fr);gap:26px}
.plato-foto::after{box-shadow:inset 0 -8px 16px rgba(0,0,0,.10)}
.menu-dia .plato-foto img{transform:scale(1.04)}
.menu-dia li:hover .plato-foto img{transform:scale(1.12)}
@media (max-width:759px){
  /* en el móvil los platos van arriba, junto al titular, con el mismo emplatado; el menú queda en texto */
  .p-index .hero-platos{display:grid;gap:14px;margin:6px 0 22px}
  .hero-platos li{aspect-ratio:1/1;border-radius:50%;padding:4px;background:var(--papel);
    box-shadow:0 0 0 1px var(--linea),0 12px 22px -8px rgba(74,40,38,.45),0 3px 8px rgba(31,30,28,.12)}
  .hero-platos img{width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:50%;object-fit:cover}
  .ticket .menu-dia .plato-foto{display:none}
  .ticket .menu-dia li{grid-template-columns:1fr}
  .js .hero-platos li{animation:servir .8s cubic-bezier(.2,.7,.2,1) both}
  .js .hero-platos li:nth-child(2){animation-delay:.12s}
  .js .hero-platos li:nth-child(3){animation-delay:.24s}
}

/* ===== v76 · menú del día: fotos enmarcadas como el resto de la web ======
   (rectangulares, filete fino y marco de papel como el propio ticket; nunca más
   anchas de 130 px para que la foto de 320 px se vea nítida en pantallas retina) */
.menu-dia li{grid-template-columns:128px minmax(0,1fr);gap:20px;padding:14px 0;align-items:center}
.plato-foto{width:128px;height:96px;margin:0;border-radius:0;padding:3px;background:var(--papel);
  box-shadow:0 0 0 1px var(--linea);overflow:hidden;transform:none}
.plato-foto::after{display:none}
.menu-dia .plato-foto img{width:100%;height:100%;object-fit:cover;border-radius:0;transform:none;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s}
.menu-dia li:hover .plato-foto{transform:none;box-shadow:0 0 0 1px var(--acento)}
.menu-dia li:hover .plato-foto img{transform:scale(1.04)}
.menu-dia .plato-t{font-size:18px;line-height:1.3}
.menu-dia .et--inline{color:var(--texto)}
.ticket{padding-left:22px}
@media (prefers-reduced-motion:no-preference){.js .menu-dia li{animation:none}}
@media (max-width:759px){
  .p-index .hero-platos{gap:8px;margin:2px 0 20px}
  .hero-platos li{aspect-ratio:4/3;border-radius:0;padding:3px;background:var(--papel);box-shadow:0 0 0 1px var(--linea)}
  .hero-platos img{border-radius:0}
  .js .hero-platos li{animation:none}
}
.ticket .cab{padding-right:0}
/* el pie del menú de la portada: solo el enlace, a la derecha */
.ticket .pie-t{justify-content:flex-end}
/* Come: las fotos del menú de hoy con el mismo marco y formato que en la portada */
.menu-hoy li{grid-template-columns:128px minmax(0,1fr)}
.menu-hoy img{width:128px;height:96px;padding:3px;background:var(--papel);border:0;box-shadow:0 0 0 1px var(--linea);transition:box-shadow .3s}
.menu-hoy li:hover img{box-shadow:0 0 0 1px var(--acento)}
@media (max-width:759px){
  .menu-hoy li{grid-template-columns:104px minmax(0,1fr)}
  .menu-hoy img{width:104px;height:78px}
}

/* ===== Redes: la cocina en YouTube, Instagram, TikTok y Facebook ========== */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.redes{border-top:1px solid var(--linea)}
.rd-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
.rd{display:flex;flex-direction:column;gap:14px;background:var(--papel);border:1px solid var(--linea);padding:18px 18px 20px;
  box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px rgba(205,197,182,.55);transition:border-color .3s}
.rd:hover{border-color:var(--crema-2)}
.rd-cab{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--tinta)}
.rd-ico{width:22px;height:22px;color:var(--acento)}
.rd-red{font-family:var(--sans);font-weight:300;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--tinta);line-height:1.3}
.rd-red small{display:block;font-family:var(--serif);font-style:italic;letter-spacing:0;text-transform:none;font-size:13px;color:var(--texto)}
.rd-seguir{font-size:13px;color:var(--acento);text-decoration:none;border-bottom:1px solid rgba(91,43,40,.3);padding:6px 0 1px;transition:border-color .2s}
.rd-seguir:hover{border-color:var(--acento)}
/* el mismo marco que las fotos del menú del día */
.rd-m{position:relative;display:block;overflow:hidden;background:var(--papel);padding:3px;box-shadow:0 0 0 1px var(--linea);transition:box-shadow .3s}
.rd-m img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
a:hover > .rd-m,.rd-ig:hover .rd-m:hover,.rd-tt .rd-m:hover,.rd-lista a:hover .rd-m{box-shadow:0 0 0 1px var(--acento)}
a:hover > .rd-m img,.rd-ig .rd-m:hover img,.rd-tt .rd-m:hover img{transform:scale(1.04)}
.rd-169{aspect-ratio:16/9}.rd-43{aspect-ratio:4/3}.rd-916{aspect-ratio:9/16}
.rd-dest{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit}
.rd-tit{font-family:var(--serif);font-size:18px;line-height:1.3;color:var(--tinta)}
.rd-play{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:rgba(243,238,229,.9);
  box-shadow:0 4px 14px rgba(31,30,28,.18)}
.rd-play::after{content:"";position:absolute;left:19px;top:15px;border-style:solid;border-width:8px 0 8px 12px;border-color:transparent transparent transparent var(--acento)}
.rd-play--peq{width:34px;height:34px;margin:-17px 0 0 -17px}
.rd-play--peq::after{left:14px;top:11px;border-width:6px 0 6px 9px}
.rd-chip{position:absolute;left:10px;bottom:10px;font-family:var(--sans);font-weight:300;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(243,238,229,.92);color:var(--tinta);padding:4px 8px}
.rd-lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--linea)}
.rd-lista a{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--tinta);font-size:14.5px;line-height:1.3}
.rd-mini{width:72px;aspect-ratio:16/9}
.rd-lista small{display:block;font-size:12.5px;font-style:italic;color:var(--texto);margin-top:2px}
.rd-ig{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.rd-ig .rd-m{aspect-ratio:1/1;padding:2px}
.rd-pie{margin:auto 0 0;font-size:13.5px;font-style:italic;color:var(--texto);line-height:1.55}
.rd-tt{display:grid;grid-template-columns:1fr 1fr;gap:8px;text-decoration:none}
.rd-cap{position:absolute;left:3px;right:3px;bottom:3px;padding:26px 9px 9px;background:linear-gradient(transparent,rgba(31,30,28,.72));
  color:var(--crema);font-size:12.5px;line-height:1.35;font-family:var(--serif)}
.rd-post{font-size:14.5px;line-height:1.6;color:var(--tinta)}
.rd-post small{display:block;font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:4px}
.rd-nota{margin:18px 0 0;font-size:13px;font-style:italic;color:var(--texto)}
.rd-nota .ej{margin-right:6px}
@media (min-width:760px) and (max-width:1099px){.rd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:759px){
  .rd-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(var(--lado) * -1);padding:0 var(--lado) 8px;scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .rd-grid::-webkit-scrollbar{display:none}
  .rd{flex:0 0 84%;scroll-snap-align:start}
}
/* el pie: las cuatro redes con su icono */
.redes--ico{display:flex;flex-wrap:wrap;gap:8px 20px}
.redes--ico a{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.redes--ico svg{width:17px;height:17px;color:var(--crema);opacity:.85}
.redes--ico a:hover svg{opacity:1}
.rd-ig{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.rd-tt{display:block}
.rd-vert{aspect-ratio:9/13}
.rd-vert .rd-cap{font-size:15px;padding:40px 14px 14px}
.rd-dest .rd-m + .rd-post{margin-top:2px}
span.redes{border-top:0}
.rd,.rd-grid{position:relative}

/* ===== El hilo: las redes, fundidas en el pie ============================= */
.pie{padding-top:0}
.hilo{margin:0 0 56px;padding-top:44px}
.hilo-cab{display:flex;align-items:baseline;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;margin-bottom:22px}
.hilo-tit{margin:0;font-family:var(--serif);font-style:italic;font-size:22px;color:var(--crema);line-height:1.3}
.hilo-tit span{display:inline-block;margin-left:12px;font-family:var(--sans);font-style:normal;font-weight:300;font-size:11px;letter-spacing:.2em;color:var(--crema-2);vertical-align:2px}
.hilo-redes{display:flex;gap:6px 24px;flex-wrap:wrap}
.hilo-redes a{display:inline-flex;align-items:center;gap:8px;padding:8px 0;color:var(--crema-2);text-decoration:none;font-family:var(--sans);font-weight:300;
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;transition:color .3s}
.hilo-redes svg{width:18px;height:18px;color:currentColor}
.hilo-redes a:hover{color:var(--crema)}
/* la cinta: borde a borde, avanza sola y se para al pasar el ratón */
.hilo-cinta{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.hilo-pista{list-style:none;margin:0;padding:0;display:flex;gap:4px;width:max-content}
.hilo-pista li{flex:none;width:184px}
.hilo-pista a{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:#3a201e}
.hilo-pista img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.92) brightness(.9);transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s}
.hilo-pista a:hover img,.hilo-pista a:focus-visible img{transform:scale(1.05);filter:none}
.hl-play{position:absolute;right:10px;top:10px;width:24px;height:24px;border-radius:50%;background:rgba(243,238,229,.88)}
.hl-play::after{content:"";position:absolute;left:9px;top:7px;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent var(--acento)}
.hl-red{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:7px;padding:28px 12px 11px;background:linear-gradient(transparent,rgba(31,30,28,.7));
  color:var(--crema);font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.18em;text-transform:uppercase;opacity:0;transform:translateY(6px);transition:opacity .45s,transform .45s}
.hl-red svg{width:15px;height:15px;color:currentColor}
.hilo-pista a:hover .hl-red,.hilo-pista a:focus-visible .hl-red{opacity:1;transform:none}
.hilo-pista a:focus-visible{outline:2px solid var(--crema);outline-offset:-2px}
@media (prefers-reduced-motion:no-preference){
  .js .hilo-pista{animation:hilo 90s linear infinite}
  .hilo-cinta:hover .hilo-pista,.hilo-cinta:focus-within .hilo-pista{animation-play-state:paused}
  @keyframes hilo{to{transform:translateX(calc(-50% - 2px))}}
}
@media (prefers-reduced-motion:reduce){.hilo-cinta{overflow-x:auto}}
@media (max-width:759px){
  .hilo{padding-top:34px;margin-bottom:40px}
  .hilo-tit{font-size:19px}
  .hilo-tit span{display:block;margin:6px 0 0}
  .hilo-redes span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .hilo-redes{gap:6px 22px}
  .hilo-redes svg{width:22px;height:22px}
  .hilo-redes a{padding:10px 2px}
  .hilo-pista li{width:132px}
  .hl-red{opacity:1;transform:none;padding:22px 9px 8px;font-size:9px}
  .hl-red svg{width:13px;height:13px}
}
@media (max-width:759px){.hl-red{font-size:0;gap:0;padding:18px 8px 8px}.hl-red svg{width:14px;height:14px}}

/* ===== Instagram: integración dedicada ==================================== */
.ig{background:var(--crema);border-top:1px solid var(--linea);padding:76px 0 40px;margin-top:var(--salto);position:relative;overflow:hidden}
.ig::before{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.5;pointer-events:none}
.ig > *{position:relative}
.ig-perfil{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.ig-avatar{display:grid;place-items:center;width:96px;height:96px;border-radius:50%;background:var(--papel);color:var(--oscuro);
  box-shadow:0 0 0 4px var(--crema),0 0 0 5px var(--acento),0 0 0 11px var(--crema),0 0 0 12px rgba(91,43,40,.25);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ig-avatar svg{width:74px;height:74px}
.ig-avatar:hover{transform:rotate(-6deg)}
.ig-id{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:10px}
.ig-red{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:300;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--acento)}
.ig-logo{width:20px;height:20px;color:var(--acento)}
.ig-id h2{margin:0;font-size:clamp(30px,3.6vw,44px);border:0;padding:0;letter-spacing:-.01em}
.ig-id h2 a{color:var(--tinta);text-decoration:none;background:linear-gradient(var(--acento),var(--acento)) 0 100%/0 1px no-repeat;transition:background-size .5s}
.ig-id h2 a:hover{background-size:100% 1px}
.ig-id p{margin:2px 0 0;font-family:var(--serif);font-style:italic;font-size:17px;color:var(--texto);max-width:46ch}
.ig-seguir{margin-top:6px}
/* destacadas: cada una abre su parte de la web */
.ig-dest{list-style:none;margin:34px auto 0;padding:0;display:flex;justify-content:center;gap:26px;flex-wrap:wrap}
.ig-dest a{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;color:var(--tinta);font-size:13px;letter-spacing:.02em}
.ig-aro{display:block;width:74px;height:74px;border-radius:50%;padding:3px;background:var(--crema);box-shadow:0 0 0 1px var(--linea);transition:box-shadow .4s}
.ig-aro img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ig-dest a:hover .ig-aro{box-shadow:0 0 0 1.5px var(--acento)}
.ig-dest a:hover .ig-aro img{transform:scale(1.08)}
/* el carril de publicaciones */
.ig-carril{position:relative;margin-top:44px}
.ig-pista{list-style:none;margin:0;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;
  padding:4px max(var(--lado),calc((100vw - var(--ancho)) / 2 + var(--lado))) 10px;scroll-padding-left:max(var(--lado),calc((100vw - var(--ancho)) / 2 + var(--lado)))}
.ig-pista::-webkit-scrollbar{display:none}
.ig-pista:focus-visible{outline:2px solid var(--acento);outline-offset:4px}
.ig-post{flex:0 0 clamp(220px,22vw,300px);scroll-snap-align:start}
.ig-post a{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:var(--papel);box-shadow:0 1px 2px rgba(31,30,28,.06)}
.ig-post img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.ig-tipo{position:absolute;top:12px;right:12px;width:20px;height:20px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}
.ig-capa{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:18px;
  background:linear-gradient(180deg,transparent 35%,rgba(43,24,22,.82));opacity:0;transition:opacity .5s}
.ig-txt{font-family:var(--serif);font-size:17px;line-height:1.35;color:var(--crema);transform:translateY(8px);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ig-ver{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--crema-2)}
.ig-post a:hover img,.ig-post a:focus-visible img{transform:scale(1.05)}
.ig-post a:hover .ig-capa,.ig-post a:focus-visible .ig-capa{opacity:1}
.ig-post a:hover .ig-txt,.ig-post a:focus-visible .ig-txt{transform:none}
.ig-nav{position:absolute;top:calc(50% - 4px);transform:translateY(-50%);z-index:2;width:50px;height:50px;border-radius:50%;border:1px solid var(--linea);
  background:rgba(243,238,229,.94);color:var(--tinta);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 22px -8px rgba(31,30,28,.35);transition:opacity .3s,border-color .3s,background .3s}
.ig-nav svg{width:22px;height:22px}
.ig-nav:hover{border-color:var(--acento);background:var(--papel)}
.ig-nav[disabled]{opacity:0;pointer-events:none}
.ig-nav--i{left:max(12px,calc((100vw - var(--ancho)) / 2 - 20px))}
.ig-nav--d{right:max(12px,calc((100vw - var(--ancho)) / 2 - 20px))}
.ig-nota{margin-top:20px !important;font-size:13px;font-style:italic;color:var(--texto)}
.ig-nota .ej{margin-right:6px}
.ig + .pie{margin-top:0}
@media (max-width:759px){
  .ig{padding:52px 0 32px}
  .ig-avatar{width:80px;height:80px}.ig-avatar svg{width:62px;height:62px}
  .ig-dest{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;gap:18px;padding:0 var(--lado);margin-left:calc(var(--lado) * -1);margin-right:calc(var(--lado) * -1)}
  .ig-dest::-webkit-scrollbar{display:none}
  .ig-aro{width:64px;height:64px}
  .ig-nav{display:none}
  .ig-post{flex-basis:72vw}
  .ig-capa{opacity:1;background:linear-gradient(180deg,transparent 55%,rgba(43,24,22,.75))}
  .ig-txt{transform:none;font-size:15px}
  .ig-ver{display:none}
}
.ig::before{opacity:.12}
.ig-nav--i{left:max(10px,calc((100vw - var(--ancho)) / 2 - 64px))}
.ig-nav--d{right:max(10px,calc((100vw - var(--ancho)) / 2 - 64px))}
/* el pie recupera su aire arriba (lo había quitado la cinta de la v81) */
.pie{padding-top:64px}
.ig{padding-bottom:64px}
@media (max-width:759px){.pie{padding-top:48px}.ig{padding-bottom:44px}}

/* ===== El Círculo v84: lo que trae, con su valor =========================== */
.valor{display:grid;gap:28px;margin-top:var(--s3)}
.valor-lista .v-g{display:block;font-family:var(--sans);font-weight:300;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--acento);margin:26px 0 0;padding-bottom:10px;border-bottom:1px solid var(--tinta)}
.valor-lista .v-g:first-child{margin-top:0}
.valor-lista ul{list-style:none;margin:0;padding:0}
.valor-lista li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:baseline;padding:15px 0;border-bottom:1px solid var(--linea)}
.v-t b{display:block;font-family:var(--serif);font-weight:400;font-size:19px;color:var(--tinta);line-height:1.3}
.v-t b a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s}
.v-t b a:hover{border-bottom-color:var(--acento)}
.v-hoja{width:9px;height:14px;margin-left:8px;color:var(--acento);vertical-align:0}
.v-t small{display:block;font-size:14px;font-style:italic;color:var(--texto);line-height:1.5;margin-top:3px}
.v-p{font-family:var(--serif);font-size:18px;color:var(--tinta);white-space:nowrap}
.valor-pago{background:var(--oscuro);color:var(--crema);padding:30px 30px 26px;align-self:start;position:relative;
  box-shadow:inset 0 0 0 6px var(--oscuro),inset 0 0 0 7px rgba(239,233,221,.22)}
.valor-pago .et{color:var(--crema-2);margin:0}
.vp-vale{margin:4px 0 18px;font-family:var(--serif);font-size:30px;color:var(--crema-2);text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:rgba(239,233,221,.45)}
.vp-vale small,.vp-pagas small{font-size:14px;font-style:italic;margin-left:6px;text-decoration:none;display:inline-block}
.vp-pagas{margin:2px 0 16px;font-family:var(--serif);color:var(--crema)}
.vp-pagas b{font-weight:400;font-size:64px;line-height:1;letter-spacing:-.02em}
.vp-fiable{list-style:none;margin:0 0 22px;padding:14px 0 0;border-top:1px solid rgba(239,233,221,.22);display:grid;gap:7px;font-size:14px;color:var(--crema-2)}
.vp-fiable li::before{content:"·";margin-right:8px;color:var(--crema)}
.valor-pago .btn--claro{margin:0}
.vp-nota{margin:16px 0 0;font-size:12px;font-style:italic;color:var(--crema-2)}
@media (min-width:900px){.valor{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px}.valor-pago{position:sticky;top:110px}}

/* ===== El Árbol: la red de referidos, en el centro de la página ========== */
.arbol-sec{background:var(--crema);position:relative}
.ab-cab{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;max-width:640px;margin:0 auto}
.ab-arbol{width:92px;height:92px;color:var(--oscuro)}
.ab-cab .et{margin:6px 0 0}
.ab-cab h2{margin:0;border:0;padding:0;font-size:clamp(32px,4vw,48px)}
.ab-cab p{margin:4px 0 0;font-size:18px;line-height:1.65;color:var(--texto)}
.ab-pasos{list-style:none;margin:48px 0 0;padding:0;display:grid;gap:28px;position:relative}
.ab-pasos li{position:relative;text-align:center;padding:0 10px}
.ab-n{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 14px;border-radius:50%;background:var(--papel);border:1px solid var(--acento);
  font-family:var(--serif);font-style:italic;font-size:19px;color:var(--acento);position:relative;z-index:1}
.ab-pasos h3{margin:0 0 6px;font-size:21px}
.ab-pasos p{margin:0 auto;max-width:30ch;font-size:15px;line-height:1.6;color:var(--texto)}
@media (min-width:860px){
  .ab-pasos{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
  .ab-pasos::before{content:"";position:absolute;top:23px;left:16.66%;right:16.66%;border-top:1px dashed rgba(91,43,40,.45)}
}
.ab-crece{display:grid;gap:30px;margin-top:56px;padding-top:40px;border-top:1px solid var(--linea)}
.ab-sub{margin:0 0 14px;font-size:22px}
.ab-escala{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.ab-escala li{display:grid;grid-template-columns:86px minmax(0,1fr) minmax(0,1.2fr);gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linea)}
.ab-hojas{display:flex;gap:3px;color:var(--acento)}
.ab-hojas svg{width:10px;height:15px}
.ab-por{font-size:14.5px;font-style:italic;color:var(--texto)}
.ab-recibes{font-family:var(--serif);font-size:17px;color:var(--tinta);line-height:1.35}
.ab-sin{margin:12px 0 0;font-size:13.5px;font-style:italic;color:var(--texto)}
.ab-enlace{background:var(--papel);border:1px solid var(--tinta);padding:26px 26px 24px;align-self:start;
  box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
.ab-enlace .et{margin:0}
.ab-url{margin:10px 0 12px;font-family:var(--serif);font-size:21px;color:var(--tinta);word-break:break-all}
.ab-url span{color:var(--acento)}
.ab-enlace p:not(.ab-url){margin:0 0 18px;font-size:15px;line-height:1.6;color:var(--texto)}
@media (min-width:900px){.ab-crece{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px}}
@media (prefers-reduced-motion:no-preference){
  .js .ab-escala li .ab-hojas svg{opacity:0;transform:translateY(4px);transition:opacity .5s,transform .5s}
  .js .ab-escala.visto li .ab-hojas svg{opacity:1;transform:none}
  .js .ab-escala.visto li:nth-child(2) svg{transition-delay:.15s}
  .js .ab-escala.visto li:nth-child(3) svg{transition-delay:.3s}
  .js .ab-escala.visto li:nth-child(4) svg{transition-delay:.45s}
}
.tarjeta40{max-width:760px}
.tarjeta40 h2{font-size:24px}
@media (max-width:759px){
  .ab-escala li{grid-template-columns:62px minmax(0,1fr);row-gap:2px}
  .ab-escala .ab-recibes{grid-column:2}
  .ab-hojas{grid-row:1 / span 2}
  .vp-pagas b{font-size:52px}
}
.v-hoja{display:inline-block;fill:currentColor;width:8px;height:12px;margin-left:9px;vertical-align:1px;transform:rotate(18deg)}
.ab-hojas svg{fill:currentColor}
.ab-hojas svg:nth-child(odd){transform:rotate(-14deg)}
.ab-hojas svg:nth-child(even){transform:rotate(14deg)}
.js .ab-escala.visto li .ab-hojas svg:nth-child(odd){transform:rotate(-14deg)}
.js .ab-escala.visto li .ab-hojas svg:nth-child(even){transform:rotate(14deg)}
.valor-pago .btn--claro{color:var(--crema);border-color:var(--crema)}
.valor-pago .btn--claro:hover{background:var(--crema);color:var(--oscuro)}
@media (min-width:760px){.carril h3{max-width:400px}}

/* =========================================================
   v87 · Hormozi: captación, voces, niveles de la Escuela,
   ancla de precio e invitación del Árbol
   ========================================================= */

/* --- La receta de hoy por WhatsApp (home y Come) --- */
.receta-wa{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;align-items:center;margin:26px 0 0;padding:16px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);max-width:560px}
.receta-wa .rw-ico{width:26px;height:26px;color:var(--acento)}
.receta-wa p{margin:0;font-size:15px;line-height:1.55;color:var(--texto)}
.receta-wa p b{font-weight:400;color:var(--tinta);font-family:var(--serif);font-size:17px}
.receta-wa .btn{grid-column:2;justify-self:start}
@media (min-width:760px){
  .receta-wa{grid-template-columns:auto 1fr auto}
  .receta-wa .btn{grid-column:auto;white-space:nowrap}
}
.menu-grid .receta-wa{max-width:none;margin-top:18px}

/* --- Voces: frases reales, con nombre y permiso --- */
.voces{display:grid;gap:0;border-top:1px solid var(--tinta)}
.voz{margin:0;padding:26px 0 22px;position:relative;border-bottom:1px solid var(--linea)}
.voz::before{content:"\201C";position:absolute;left:-2px;top:6px;font-family:var(--serif);font-size:54px;line-height:1;color:var(--acento);opacity:.55}
.voz blockquote{margin:0;padding:22px 0 0}
.voz blockquote p{margin:0;font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.5;color:var(--tinta);max-width:34ch}
.voz figcaption{margin-top:14px;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.voz figcaption b{font-weight:400;font-size:14px;color:var(--tinta)}
.voz figcaption > span{font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto)}
.voz .dato{font-style:normal}
@media (min-width:760px){
  .voces{grid-template-columns:repeat(3,minmax(0,1fr))}
  .voces .voz{border-bottom:0;padding-right:28px}
  .voces .voz + .voz{border-left:1px solid var(--linea);padding-left:28px}
  .voces .voz + .voz::before{left:26px}
}
.voz--sola{margin-top:22px;border-top:1px solid var(--linea);border-bottom:0;padding-bottom:0;max-width:48ch}

/* --- Escuela: básica (con el Círculo) y completa --- */
.niveles{display:grid;gap:34px;margin-top:var(--s3)}
.nivel-cab{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 18px;margin-bottom:-10px}
.nivel-cab .et{margin:0}
.nivel-cab b{font-weight:400;font-family:var(--serif);font-size:18px;color:var(--tinta)}
.nivel--basica .nivel-cab b{color:var(--acento)}
.nivel--basica .dentro-que{border-top-color:var(--acento)}
@media (min-width:700px){.nivel--basica .dentro-que{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* --- Transforma: el año, frente a mes a mes --- */
.precios .ancla{display:block;font-size:15px;color:var(--texto);text-decoration-color:var(--acento);margin-bottom:2px}
.fila-ancla td:not(.no){color:var(--acento)}

/* --- Invitación del Árbol (luzytierra.es/a/…) --- */
.invita{display:grid;justify-items:center;align-content:center;gap:14px}
.invita-tarj{width:min(380px,100%);background:#FBF8F2;border:1px solid var(--tinta);padding:34px 30px 26px;text-align:center;
  box-shadow:inset 0 0 0 6px #FBF8F2,inset 0 0 0 7px var(--linea)}
.invita-sello{width:54px;height:54px;color:var(--acento);margin:0 auto 12px;display:block}
.invita-tarj .et{margin-bottom:12px}
.invita-que{font-family:var(--serif);font-size:30px;line-height:1.15;color:var(--tinta);margin:0 0 14px}
.invita-para{margin:0 0 20px;font-size:14px;color:var(--texto)}
.invita-para em{display:block;font-family:var(--serif);font-size:26px;color:var(--acento);margin-top:2px}
.invita-datos{margin:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.invita-datos > div{padding:12px 4px}
.invita-datos > div + div{border-left:1px solid var(--linea)}
.invita-datos dt{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--texto);margin-bottom:4px}
.invita-datos dd{margin:0;font-size:14px;color:var(--tinta);line-height:1.3}
.invita-pie{margin:16px 0 0;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto)}
.invita-nota{margin:0;font-family:var(--serif);font-style:italic;color:var(--texto);font-size:16px}
.p-invitado .hero .et--icono svg{width:16px;height:16px;fill:currentColor;stroke:none}
.reveal--invita h2 em{font-style:italic}
.invita-cond{font-size:14px !important;color:var(--crema-2) !important;margin-top:18px}
.invita-cond .dato{color:var(--crema);border-color:var(--crema-2)}
@media (max-width:759px){
  .invita-tarj{padding:28px 20px 22px}
  .invita-que{font-size:26px}
}

@media (max-width:699px){.precios .cab th,.precios .cab td{white-space:normal;letter-spacing:.16em;line-height:1.5;vertical-align:bottom}}

@media (min-width:760px){.demo .receta-wa{grid-template-columns:auto 1fr}.demo .receta-wa .btn{grid-column:2}}

.dentro-que span .dato,.dentro-que span .ej{display:inline-block;width:auto}

.cta-movil .btn{white-space:nowrap;font-size:17px;padding-left:14px;padding-right:14px}
.cta-movil small{max-width:36%}

/* --- Voces reales de Tripadvisor, verificables --- */
.voz--real .voz-tit{display:block;padding-top:24px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--acento)}
.voz--real blockquote{padding-top:10px}
.voz--real figcaption{flex-direction:column;align-items:flex-start;gap:3px}
.voz--real figcaption b{font-size:15px}
.voz-lugar{font-size:13px;color:var(--texto)}
.voz--real .voz-q{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--texto)}
.voz-fuente{margin-top:10px;display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--texto);text-decoration:none;border-bottom:1px solid var(--linea);padding-bottom:2px;transition:border-color .2s,color .2s}
.voz-fuente svg{width:15px;height:15px;color:var(--acento);flex:none}
.voz-fuente .voz-ir{margin-left:4px;color:var(--tinta)}
.voz-fuente .voz-ir::after{content:" \2197";color:var(--acento)}
.voz-fuente:hover{border-color:var(--acento);color:var(--tinta)}
.voces-sec .sec-cab a.nota{text-decoration:none}
.voz--real figcaption b .voz-lugar{font-size:13px;letter-spacing:0;text-transform:none;color:var(--texto)}
#circulo-home .hero-datos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}
#circulo-home .circ-cta{margin-top:26px}
#circulo-home .hero-datos{margin-top:34px}
#circulo-home .hero-datos > div{padding-top:16px;padding-bottom:18px}
#circulo-home .circ-cta{margin-top:36px;display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
#circulo-home .circ-cta .btn--claro{margin-top:0}
#circulo-home > .cont{padding-top:56px;padding-bottom:56px}
@media (max-width:759px){#circulo-home .circ-cta{margin-top:28px}}

/* --- Redes del pie: iconos reconocibles, enmarcados --- */
.redes--ico{gap:10px 26px;align-items:center}
.redes--ico a{gap:10px;color:var(--crema);opacity:.9;transition:opacity .2s}
.redes--ico .rs-ico{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid rgba(239,233,221,.45);border-radius:2px;transition:background .25s,border-color .25s}
.redes--ico .rs-ico svg{width:19px;height:19px;color:var(--crema);opacity:1}
.redes--ico a:hover{opacity:1}
.redes--ico a:hover .rs-ico{background:var(--crema);border-color:var(--crema)}
.redes--ico a:hover .rs-ico svg{color:var(--oscuro)}
.pie .redes--ico a{color:var(--crema);font-size:16px}
.pie .redes--ico .rs-ico svg{width:20px;height:20px}
.p-aprende .hero .hero-datos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}
@media (max-width:699px){.p-aprende .hero .hero-datos{grid-template-columns:1fr;max-width:none}}

/* --- Pestañas de familias: más aire (escritorio) --- */
@media (min-width:900px){
  .tabs-fam ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible}
  .tabs-fam li{min-width:0}
  .tabs-fam li + li{border-left:1px solid var(--linea)}
  .tab-fam{height:100%;margin-right:0;padding:20px 22px 18px;gap:8px;white-space:normal;justify-content:flex-start}
  .tabs-fam li:first-child .tab-fam{padding-left:0}
  .tab-fam .tf-n{font-size:18px;line-height:1.3}
  .tab-fam .tf-c{font-size:10px}
}
@media (max-width:899px){
  .tab-fam{padding:16px 22px 14px 0;margin-right:22px}
}
@media (min-width:900px){.tab-fam .tf-c{margin-top:auto;padding-top:10px}}

/* --- Fechas que vienen del panel --- */
.tl-fecha.con-fecha,[data-taller-fecha].con-fecha{color:var(--acento)}
.reveal [data-taller-fecha].con-fecha{color:var(--crema)}
.t1-cuando{border-top:0 !important;padding-top:0 !important}
.t1-cuando span{color:var(--tinta)}
.t1-cuando span.con-fecha{color:var(--acento)}
.reveal .pieza [data-taller-fecha].con-fecha{color:var(--acento)}
.pieza-filas .d{white-space:nowrap}

/* --- Aprende: pie del catálogo, con aire --- */
.cat-pie{margin-top:56px;padding-top:28px;border-top:1px solid var(--tinta)}
.cat-como{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.cat-como li{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;align-items:baseline}
.cc-n{grid-row:span 2;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--acento);border-radius:50%;font-size:13px;color:var(--acento);align-self:start}
.cat-como b{font-weight:400;font-size:18px;color:var(--tinta)}
.cat-como li > span:last-child{font-size:14.5px;line-height:1.55;color:var(--texto);font-style:italic}
.cat-online{margin:28px 0 0;font-size:15px;color:var(--texto)}
.cierre--circulo{margin-top:40px;padding:30px 32px;gap:18px 36px;max-width:none}
.cierre--circulo .cc-precio{display:grid;gap:2px}
.cierre--circulo .cc-precio .et{margin:0;color:var(--acento)}
.cierre--circulo .cc-precio b{font-weight:400;font-family:var(--serif);font-size:40px;line-height:1.05;color:var(--tinta)}
.cierre--circulo .cc-precio small{font-size:13px;color:var(--texto);font-style:italic}
.cierre--circulo p{font-size:16px;line-height:1.65;color:var(--texto);max-width:46ch}
@media (min-width:760px){
  .cat-como{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  .cat-como li + li{border-left:1px solid var(--linea);padding-left:28px}
  .cierre--circulo{grid-template-columns:auto 1fr auto}
  .cierre--circulo .cc-precio{padding-right:36px;border-right:1px solid var(--linea)}
  .cierre--circulo .btn{justify-self:end}
}
.cat-como li{align-items:start}
.cat-como b{line-height:30px}
.cat-como li{align-content:start}

/* --- Transforma: la garantía, más limpia --- */
.gar-txt h2 em{font-style:italic}
.gar-txt > p{font-size:18px;margin:0 0 26px}
.gar-prox{margin:0 0 28px;padding:14px 0;border-top:1px solid rgba(239,233,221,.35);border-bottom:1px solid rgba(239,233,221,.35);display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;max-width:420px}
.gar-prox dt{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--crema-2)}
.gar-prox dd{margin:0;font-family:var(--serif);font-size:19px;color:var(--crema)}
.reveal .gar-prox dd.con-fecha{color:var(--crema)}
.pieza--garantia{max-width:440px;padding:30px 30px 26px}
.pieza--garantia .et{margin-bottom:10px}
.pieza--garantia h3{font-size:24px;line-height:1.2;margin:0 0 10px}
.reveal .pieza--garantia .gar-ses{font-size:15px;line-height:1.6;color:var(--texto);margin:0}
.reveal .pieza--garantia .gar-preg{margin:24px 0 0;padding-top:18px;border-top:1px solid var(--tinta);font-size:15px;color:var(--texto)}
.gar-preg em{font-family:var(--serif);font-size:20px;color:var(--tinta)}
.gar-ramas{list-style:none;margin:10px 0 0;padding:0}
.gar-ramas li{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:start;padding:14px 0;border-bottom:1px solid var(--linea)}
.gar-r{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--acento);border-radius:50%;font-family:var(--serif);font-size:17px;color:var(--acento)}
.gar-ramas li:first-child .gar-r{background:var(--acento);color:var(--crema)}
.reveal .pieza--garantia .gar-ramas p{margin:0;padding-top:8px;font-size:15px;line-height:1.55;color:var(--tinta)}
.reveal .pieza--garantia .gar-nota{margin:16px 0 0;font-size:13px;line-height:1.55;font-style:italic;color:var(--texto)}
.gar-nota .dato{font-style:normal}

/* --- Escuela: lo que trae cada curso, en lista --- */
.p-escuela .hero .lead{margin-bottom:14px}
.es-lista{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:0;border-top:1px solid var(--linea);max-width:560px}
.es-lista li{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--linea)}
.es-lista svg{width:10px;height:14px;fill:var(--acento);transform:translateY(1px)}
.es-lista span{font-size:16px;line-height:1.45;color:var(--texto)}
.es-lista b{font-weight:400;color:var(--tinta)}
@media (min-width:760px){
  .es-lista{grid-template-columns:1fr 1fr;column-gap:28px}
}

/* --- Escuela: "por dentro", en tres puntos --- */
.dentro-puntos--min{display:grid;grid-template-columns:1fr;gap:0;margin-top:36px;border-top:1px solid var(--tinta)}
.dentro-puntos--min li{padding:18px 0;border:0;border-bottom:1px solid var(--linea)}
.dentro-puntos--min b{display:block;font-weight:400;font-size:19px;color:var(--tinta);margin-bottom:4px}
.dentro-puntos--min span{display:block;font-size:15px;font-style:italic;color:var(--texto)}
@media (min-width:760px){
  .dentro-puntos--min{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dentro-puntos--min li{border-bottom:0;padding:22px 28px}
  .dentro-puntos--min li:first-child{padding-left:0}
  .dentro-puntos--min li + li{border-left:1px solid var(--linea)}
}

/* --- Escuela: dos niveles, minimalista --- */
.niveles2{display:grid;gap:20px;margin-top:var(--s3)}
.nv{border:1px solid var(--linea);padding:28px 28px 24px;background:var(--papel)}
.nv--completa{border-color:var(--tinta);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
.nv .et{margin:0 0 8px}
.nv-precio{margin:0 0 18px;font-family:var(--serif);font-size:24px;line-height:1.2;color:var(--tinta)}
.nv:first-child .nv-precio{color:var(--acento)}
.nv-precio small{display:block;font-size:14px;font-style:italic;color:var(--texto);margin-top:4px}
.nv-mas{margin:0 0 6px;font-size:14px;font-style:italic;color:var(--texto)}
.nv-lista{list-style:none;margin:0;padding:0;border-top:1px solid var(--linea)}
.nv-lista li{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--linea);font-size:16px;color:var(--tinta)}
.nv-lista li:last-child{border-bottom:0}
.nv-lista svg{width:9px;height:13px;fill:var(--acento)}
.nv-lista .dato{font-size:10px}
@media (min-width:760px){.niveles2{grid-template-columns:1fr 1fr;gap:28px;align-items:start}}
@media (min-width:760px){.niveles2{align-items:stretch}}
.p-cuidate .hero .hero-datos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}
@media (max-width:699px){.p-cuidate .hero .hero-datos{grid-template-columns:1fr;max-width:none}}

/* Datos de cabecera con solo dos elementos: dos columnas, sin hueco */
@media (min-width:700px){.hero-datos:has(> div:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}}

/* =========================================================
   Tablas de precios · un solo estilo en toda la web
   Nombre a la izquierda, precios alineados a la derecha,
   el precio con el Círculo en el color de la casa.
   ========================================================= */
.precios{width:100%;max-width:600px;border-collapse:collapse}
.precios th,.precios td{border:0}
.precios th{width:auto;padding-right:16px;text-align:left;vertical-align:top;font-weight:400;font-size:17px;line-height:1.35;color:var(--tinta)}
.precios td{width:7.2em;text-align:right;vertical-align:top;padding-left:12px;font-size:17px;line-height:1.35;color:var(--acento);white-space:nowrap;font-variant-numeric:tabular-nums lining-nums}
.precios td.no{color:var(--texto);font-size:16px}
.precios td[colspan]{white-space:normal;text-align:right}
.precios tr:not(.cab) th,.precios tr:not(.cab) td{padding-top:15px;padding-bottom:15px;border-bottom:1px solid var(--linea)}
.precios tr:not(.cab):hover th,.precios tr:not(.cab):hover td{background:transparent}
.precios .cab th,.precios .cab td{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.22em;line-height:1.5;text-transform:uppercase;color:var(--texto);border-bottom:1px solid var(--tinta);padding:0 0 10px;white-space:normal;vertical-align:bottom}
.precios .cab td{padding-left:12px;text-align:right}
.precios .cab td:not(.no){color:var(--acento)}
.precios .sub{display:block;font-size:13.5px;line-height:1.45;color:var(--texto);font-style:italic;margin-top:3px}
.precios .ancla{display:block;font-size:13px;color:var(--texto);margin:0 0 2px}
@media (max-width:699px){
  .precios th{width:auto;font-size:16px}
  .precios td{width:5.4em;font-size:16px}
  .precios td.no{font-size:15px}
  .precios .cab th,.precios .cab td{letter-spacing:.14em}
}
.precios .cab td.no,.precios .cab td{font-size:10px}
.precios tr:not(.cab) td{line-height:23px}
.precios tr:not(.cab) th{line-height:23px}

/* --- Empresas: paquetes en tarjetas --- */
.paquetes2{list-style:none;margin:var(--s3) 0 0;padding:0;display:grid;gap:18px}
.pq{display:flex;flex-direction:column;border:1px solid var(--linea);background:var(--papel);padding:26px 26px 22px}
.pq .et{margin:0 0 10px;color:var(--acento)}
.pq h3{margin:0 0 10px;font-size:21px;line-height:1.25;font-weight:400}
.pq p{margin:0 0 22px;font-size:15px;line-height:1.6;color:var(--texto)}
.pq-pr{margin-top:auto;padding-top:14px;border-top:1px solid var(--linea);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.pq-pr b{font-weight:400;font-family:var(--serif);font-size:20px;color:var(--tinta)}
.pq-pr small{font-size:13px;font-style:italic;color:var(--texto)}
.pq--cta{background:var(--oscuro);border-color:var(--oscuro);box-shadow:inset 0 0 0 5px var(--oscuro),inset 0 0 0 6px rgba(239,233,221,.25)}
.pq--cta .et{color:var(--crema-2)}
.pq--cta h3{color:var(--crema)}
.pq--cta p{color:var(--crema-2)}
.pq--cta .btn{margin-top:auto;align-self:flex-start;color:var(--crema);border-color:var(--crema)}
.pq--cta .btn:hover{background:var(--crema);color:var(--oscuro)}
.pq-datos{margin:40px 0 0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.pq-datos > div{padding:16px 0;border-bottom:1px solid var(--linea)}
.pq-datos dt{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto);margin-bottom:6px}
.pq-datos dd{margin:0;font-size:15px;line-height:1.55;color:var(--tinta)}
@media (min-width:700px){.paquetes2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){
  .paquetes2{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
  .pq-datos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pq-datos > div{border-bottom:0;padding:20px 28px}
  .pq-datos > div:first-child{padding-left:0}
  .pq-datos > div + div{border-left:1px solid var(--linea)}
}
.pq-pr{flex-direction:column;align-items:flex-start;gap:2px}
#paquetes .nota-pie{margin-top:22px}

/* Pestañas de familias: misma caja para las cinco (alineadas) */
@media (min-width:900px){
  .tabs-fam{background:transparent}
  .tabs-fam ul{background:var(--papel);border-top:1px solid var(--linea)}
  .tabs-fam li:first-child .tab-fam,.tab-fam{padding:20px 22px 18px;justify-content:flex-start}
  .tab-fam .tf-n{min-height:2.6em;display:block}
  .tab-fam .tf-c{margin-top:10px;padding-top:0}
}

/* --- Círculo: la tarjeta de 40 €, integrada bajo el valor --- */
.t40{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:center;margin-top:34px;padding:18px 22px;border:1px solid var(--linea);background:var(--papel)}
.t40-ico{width:44px;height:44px;color:var(--acento)}
.t40 p{margin:0;font-size:15px;line-height:1.6;color:var(--texto);max-width:none}
.t40 b{font-weight:400;font-family:var(--serif);font-size:17px;color:var(--tinta)}
@media (max-width:599px){.t40{grid-template-columns:1fr}.t40-ico{width:36px;height:36px}}

.valor-col{display:grid;gap:18px;align-self:start}
@media (min-width:900px){.valor-col{position:sticky;top:110px}.valor-col .valor-pago{position:static}}
.valor-col .t40{margin-top:0;grid-template-columns:34px 1fr;align-items:start;padding:16px 18px}
.valor-col .t40-ico{width:34px;height:34px}
.valor-col .t40 p{font-size:14px}
.valor-col .t40 b{display:block;font-size:16px;margin-bottom:2px}
.ini-prox{margin:22px 0 22px}
.reveal h2.grande em{font-style:italic}
.circ-mas{margin:-6px 0 26px;font-size:16px;line-height:1.6;color:var(--texto);max-width:46ch}

/* --- Círculo, cabecera: el Árbol con su lema --- */
.arbol-cab{text-align:center;margin-top:22px;display:grid;justify-items:center;gap:8px}
.arbol-cab .et{margin:0;color:var(--acento)}
.arbol-tit{margin:0;font-family:var(--serif);font-size:30px;line-height:1.15;color:var(--tinta)}
.arbol-sub{margin:0;max-width:32ch;font-size:15px;line-height:1.55;font-style:italic;color:var(--texto)}
.arbol-cab .flecha{margin-top:6px;font-size:15px}
@media (max-width:759px){.arbol-tit{font-size:25px}}
#mediodia{scroll-margin-top:72px}
#mediodia{scroll-margin-top:-18px}

/* --- Come: un solo paso tras el menú --- */
.menu-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 28px;margin-top:26px;padding:22px 0;border-top:1px solid var(--tinta);border-bottom:1px solid var(--linea)}
.mc-precio{margin:0;display:flex;align-items:baseline;gap:14px}
.mc-precio b{font-weight:400;font-family:var(--serif);font-size:36px;line-height:1;color:var(--tinta)}
.mc-precio > span{font-size:15px;color:var(--texto);line-height:1.4}
.mc-precio small{display:block;font-size:13px;font-style:italic;color:var(--acento)}
@media (max-width:599px){.menu-cta .btn{width:100%;justify-content:center}}

/* --- Aprende: familias con JS (sin saltos) y cabecera de familia discreta --- */
.catalogo.js-fam .familias .fam{display:none !important}
.catalogo.js-fam .familias .fam.activa{display:block !important}
.catalogo.js-fam .tabs-fam .tab-fam{border-bottom-color:transparent !important}
.catalogo.js-fam .tabs-fam .tab-fam .tf-c{color:var(--texto) !important}
.catalogo.js-fam .tabs-fam .tab-fam.activa{border-bottom-color:var(--acento) !important;background:var(--crema)}
.catalogo.js-fam .tabs-fam .tab-fam.activa .tf-c{color:var(--acento) !important}
.catalogo.js-fam .tabs-fam .tab-fam:not(.activa):hover{background:rgba(239,233,221,.6)}
.tabs-fam{margin-bottom:28px}
.fam-cab{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fam{scroll-margin-top:200px}
.fam.activa .talleres{animation:famEntra .35s ease both}
@keyframes famEntra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fam.activa .talleres{animation:none}}
@media (min-width:900px){
  .tab-fam,.tabs-fam li:first-child .tab-fam{padding:16px 20px 14px}
  .tab-fam .tf-n{font-size:17px;min-height:2.6em}
  .tab-fam .tf-c{margin-top:6px}
}
.familias .talleres--acordeon{border-top-color:transparent}
.catalogo.js-fam .tabs-fam{margin-bottom:8px}

/* =========================================================
   Listas con precio · acabado premium y un solo lenguaje
   (tablas .precios, carta de Come, valor del Círculo,
    "Si quieres ir más allá" de Transforma)
   Hover: la fila se ilumina en crema, un filete granate
   aparece a la izquierda y el nombre se desplaza con calma.
   ========================================================= */
:root{--fila-t:.45s cubic-bezier(.22,.61,.36,1)}

/* — Tablas de precios — */
.precios{border-top:0}
.precios .cab th,.precios .cab td{padding-bottom:12px;border-bottom:1px solid var(--tinta)}
.precios tr:not(.cab) th,.precios tr:not(.cab) td{padding-top:18px;padding-bottom:18px;transition:background-color var(--fila-t),padding var(--fila-t),box-shadow var(--fila-t),color var(--fila-t)}
.precios tr:not(.cab) th{font-family:var(--serif);font-size:18px;padding-left:0;box-shadow:inset 0 0 0 transparent}
.precios tr:not(.cab) td:last-child{padding-right:0}
.precios td{font-family:var(--serif);font-size:18px}
.precios td.no{font-size:16px;color:var(--texto)}
.precios td:not(.no){letter-spacing:.01em}
@media (hover:hover){
  .precios tr:not(.cab):hover th,.precios tr:not(.cab):hover td{background-color:var(--crema)}
  .precios tr:not(.cab):hover th{padding-left:18px;box-shadow:inset 2px 0 0 var(--acento)}
  .precios tr:not(.cab):hover td:last-child{padding-right:14px}
  .precios tr:not(.cab):hover td:not(.no){color:var(--acento)}
  .precios tr:not(.cab):hover td.no{color:var(--tinta)}
}

/* — Carta de Come (con puntos guía) — */
.carta-r li{position:relative;transition:background-color var(--fila-t),padding var(--fila-t),box-shadow var(--fila-t)}
.carta-r .n,.carta-r .p{transition:color var(--fila-t)}
.carta-r .pts{transition:border-color var(--fila-t)}
@media (hover:hover){
  .carta-r li:hover{background-color:var(--crema);padding-left:14px;padding-right:14px;box-shadow:inset 2px 0 0 var(--acento)}
  .carta-r li:hover .n{color:var(--acento)}
  .carta-r li:hover .p{color:var(--tinta)}
  .carta-r li:hover .pts{border-bottom-color:var(--acento)}
}

/* — Lo que trae el Círculo — */
.valor-lista li{transition:background-color var(--fila-t),padding var(--fila-t),box-shadow var(--fila-t)}
.valor-lista .v-p{transition:color var(--fila-t)}
@media (hover:hover){
  .valor-lista li:hover{background-color:var(--crema);padding-left:16px;padding-right:16px;box-shadow:inset 2px 0 0 var(--acento)}
  .valor-lista li:hover .v-p{color:var(--acento)}
}

/* — Transforma: "Si quieres ir más allá" — */
.aparte li{transition:background-color var(--fila-t),padding var(--fila-t),box-shadow var(--fila-t)}
@media (min-width:760px){.aparte li{grid-template-columns:minmax(0,1fr) auto;align-items:baseline}.aparte em{grid-column:2;grid-row:1 / span 2;align-self:center}}
@media (hover:hover){
  .aparte li:hover{background-color:var(--crema);padding-left:16px;padding-right:16px;box-shadow:inset 2px 0 0 var(--acento)}
  .aparte li:hover em{color:var(--acento)}
}

@media (prefers-reduced-motion:reduce){
  .precios th,.precios td,.carta-r li,.valor-lista li,.aparte li{transition:none}
}
.aparte em span{font:inherit;color:inherit;font-style:normal}
.aparte em{font-size:18px}
.aparte em .dato{font-family:var(--sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--texto)}
.prox-claro{margin:6px 0 22px;border-color:var(--linea)}
.prox-claro dt{color:var(--texto)}
.prox-claro dd{color:var(--tinta)}
.prox-claro dd.con-fecha{color:var(--acento)}
.formacion-w{max-width:760px}
/* Formación (Empresas): mismo acabado que las demás listas con precio */
.paquetes li{transition:background-color var(--fila-t),padding var(--fila-t),box-shadow var(--fila-t)}
.paquetes .pr{font-family:var(--serif);font-size:17px;color:var(--tinta);text-align:right;transition:color var(--fila-t)}
.paquetes .pr small{display:block;font-size:13px;font-style:italic;color:var(--texto)}
@media (hover:hover){
  .paquetes li:hover{background-color:var(--crema);padding-left:16px;padding-right:16px;box-shadow:inset 2px 0 0 var(--acento)}
  .paquetes li:hover .pr{color:var(--acento)}
}
.pq--cta h3 em{font-style:italic;color:var(--crema)}
.pq--cta h3{font-size:23px}

/* =========================================================
   La banda "Hoy" queda fija bajo la cabecera al hacer scroll.
   --alto-top / --alto-hoy los mide main.js; aquí sus valores por defecto.
   ========================================================= */
:root{--alto-top:67px;--alto-hoy:45px}
.banda-hoy{position:sticky;top:var(--alto-top);z-index:19;background:rgba(243,238,229,.96);-webkit-backdrop-filter:saturate(1.2) blur(6px);backdrop-filter:saturate(1.2) blur(6px)}
.p-index{--alto-hoy:0px}
.tabs-fam,.cat-chips{top:calc(var(--alto-top) + var(--alto-hoy))}
.tienda-cat{scroll-margin-top:calc(var(--alto-top) + var(--alto-hoy) + 70px)}
@media (min-width:900px){
  .valor-col,#preguntas .dos > div:first-child{top:calc(var(--alto-top) + var(--alto-hoy) + 36px)}
  .cesta-lado{top:calc(var(--alto-top) + var(--alto-hoy) + 70px)}
}
#mediodia{scroll-margin-top:calc(var(--alto-hoy) - 18px)}
/* En el móvil, una sola línea para que la banda fija ocupe poco */
@media (max-width:759px){
  :root{--alto-hoy:41px}
  .banda-hoy .cont{align-items:center;padding-top:0;padding-bottom:0;min-height:40px;font-size:13.5px}
  .banda-hoy .et,.banda-hoy .punto,.banda-hoy a{margin-top:0}
  .banda-hoy .txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
}
#circulo-home .circ-cta{margin-top:30px}

/* =========================================================
   Cuídate · horario semanal por días
   ========================================================= */
.horario2{--c-tib:var(--acento);--c-ter:#7C6A45;--c-aer:#5E6E58;--c-qi:#3F5560;margin-top:var(--s3)}
.hz-ley{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.hz-ley li{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--texto)}
.hz-ley li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c)}
.ley--tib{--c:var(--c-tib)}.ley--ter{--c:var(--c-ter)}.ley--aer{--c:var(--c-aer)}.ley--qi{--c:var(--c-qi)}
.hz-semana{display:grid;gap:22px;border-top:1px solid var(--tinta);padding-top:18px}
.hz-semana .dia h3{margin:0 0 12px;font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--texto)}
.hz-semana .dia ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ses{position:relative;display:grid;gap:2px;padding:14px 16px 13px 18px;background:var(--papel);border:1px solid var(--linea);transition:background-color var(--fila-t),border-color var(--fila-t),transform var(--fila-t),box-shadow var(--fila-t)}
.ses::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;background:var(--c)}
.ses--tib{--c:var(--c-tib)}.ses--ter{--c:var(--c-ter)}.ses--aer{--c:var(--c-aer)}.ses--qi{--c:var(--c-qi)}
.ses time{font-family:var(--sans);font-weight:300;font-size:11px;letter-spacing:.12em;color:var(--texto)}
.ses b{font-weight:400;font-family:var(--serif);font-size:17px;line-height:1.25;color:var(--tinta)}
.ses span{font-size:13px;font-style:italic;color:var(--texto)}
@media (hover:hover){.ses:hover{background:var(--crema);border-color:var(--c);transform:translateY(-2px);box-shadow:0 10px 24px -18px rgba(31,30,28,.45)}}
@media (min-width:760px){.hz-semana{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}}
@media (min-width:760px) and (max-width:1023px){.ses b{font-size:15.5px}.ses{padding:12px 12px 11px 14px}}
@media (max-width:759px){
  .hz-semana{gap:0;padding-top:0}
  .hz-semana .dia{display:grid;grid-template-columns:86px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--linea)}
  .hz-semana .dia h3{margin:4px 0 0}
}
@media (prefers-reduced-motion:reduce){.ses{transition:none}.ses:hover{transform:none}}
.hz-semana .ses{grid-template-columns:1fr;margin:0}
@media (max-width:759px){.hz-semana .dia{grid-template-columns:1fr;gap:10px}.hz-semana .dia h3{margin:0}.hz-semana .dia ul{gap:8px}}

/* =========================================================
   Coherencia de componentes (revisión UI/UX)
   ========================================================= */
/* Títulos de sección: un solo tamaño */
.ab-cab h2,.arbol-sec .ab-cab h2{font-size:40px}
.sec-cab h2{font-size:40px}
@media (max-width:759px){.ab-cab h2,.sec-cab h2{font-size:30px}}
/* Títulos de tarjeta: 21px; tarjetas destacadas (camino, historias): 24px */
main .origen h3,main .otras h3,main .ab-crece .ab-sub,main .pq--cta h3,main .pieza--garantia h3,main .cuerpo-v h3{font-size:21px}
main .escalera h3,main .carril h3{font-size:24px}
/* Tarjetas: el mismo gesto al pasar el puntero */
.pq:not(.pq--cta),.nv{transition:border-color var(--fila-t),transform var(--fila-t),box-shadow var(--fila-t),background-color var(--fila-t)}
@media (hover:hover){
  .pq:not(.pq--cta):hover,.nv:hover{border-color:var(--acento);transform:translateY(-2px);box-shadow:0 12px 26px -20px rgba(31,30,28,.5)}
}
@media (prefers-reduced-motion:reduce){.pq,.nv{transition:none}.pq:hover,.nv:hover{transform:none}}
/* Testimonio pendiente: un solo marcador, limpio */
.voz--pendiente{border:1px dashed var(--linea);border-top:1px dashed var(--linea);padding:18px 20px;display:grid;gap:8px;justify-items:start}
.voz--pendiente::before{display:none}
.voz--pendiente p{margin:0;font-family:var(--serif);font-style:italic;font-size:16px;color:var(--texto)}
.voz--pendiente p i{font-style:italic}
main .origen h3,main .pieza h3{font-size:21px !important}
main .sec-cab h2{font-size:40px !important}
@media (max-width:759px){main .sec-cab h2{font-size:30px !important}}

/* =========================================================
   Transforma · los cuatro trimestres, interactivos
   ========================================================= */
.tris--tabs .tri{padding:0;display:block;min-height:0 !important}
.tri-btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:6px;width:100%;height:100%;padding:22px 22px 18px;position:relative;transition:background-color .35s}
.tri-btn:focus-visible{outline:2px solid var(--acento);outline-offset:3px}
.tri-h{display:block;margin:2px 0 0;font-family:var(--serif);font-size:21px;line-height:1.25;color:var(--tinta)}
.tri-ver{margin-top:auto;padding-top:14px;font-size:13px;color:var(--texto);display:inline-flex;align-items:center;gap:6px}
.tri-ver::after{content:"↓";color:var(--acento);transition:transform .35s}
.tris--tabs .tri{transition:border-color .35s,box-shadow .35s,transform .35s}
.tris--tabs .tri--1{border-color:var(--linea);box-shadow:none}
.tris--tabs .tri.tri--on{border-color:var(--tinta);box-shadow:inset 0 0 0 4px var(--papel),inset 0 0 0 5px var(--linea)}
.tris--tabs .tri.tri--on .tri-ver{color:var(--acento)}
.tris--tabs .tri.tri--on .tri-ver::after{transform:rotate(0)}
.tris--tabs .tri.tri--on::after{content:"";position:absolute;left:50%;bottom:-9px;width:16px;height:16px;background:var(--papel);border-right:1px solid var(--tinta);border-bottom:1px solid var(--tinta);transform:translateX(-50%) rotate(45deg)}
@media (hover:hover){.tris--tabs .tri:not(.tri--on):hover{border-color:var(--acento);transform:translateY(-2px)}.tris--tabs .tri:not(.tri--on):hover .tri-btn{background:var(--crema)}}
.tri-paneles{margin-top:26px;border-top:1px solid var(--tinta)}
.js-tris .tri-ver{display:inline-flex}
.tri-panel{padding-top:26px}
.tri-panel + .tri-panel{border-top:1px solid var(--linea);margin-top:30px}
.js-tris .tri-panel + .tri-panel{border-top:0;margin-top:0}
.tri-panel[hidden]{display:none}
.tri-entra{animation:triEntra .45s ease both}
@keyframes triEntra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tri-pan-cab{max-width:62ch;margin-bottom:22px}
.tri-pan-cab .et{color:var(--acento);margin-bottom:8px}
.tri-pan-cab p{margin:0;font-size:17px;line-height:1.6;color:var(--texto)}
.tri-pan-grid{display:grid;gap:28px}
@media (min-width:960px){.tri-pan-grid{grid-template-columns:minmax(0,1fr) 320px;gap:44px;align-items:start}}
.tri-ses{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.tri-ses li{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:baseline;padding:18px 0;border-bottom:1px solid var(--linea)}
.tri-ses b{font-weight:400;font-family:var(--serif);font-size:20px;line-height:1.3;color:var(--tinta)}
.tri-dato{margin:14px 0 0;font-size:14px;font-style:italic;color:var(--texto)}
.tri-acc{margin-top:0}
.tri-ficha{border:1px solid var(--tinta);background:var(--papel);padding:22px 22px 20px;box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
@media (min-width:960px){.tri-ficha{position:sticky;top:calc(var(--alto-top) + var(--alto-hoy) + 24px)}}
.tri-ficha dl{margin:0 0 18px}
.tri-ficha dl > div{padding:11px 0;border-bottom:1px solid var(--linea)}
.tri-ficha dl > div:first-child{padding-top:0}
.tri-ficha dt{font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--texto);margin-bottom:4px}
.tri-ficha dd{margin:0;font-family:var(--serif);font-size:16.5px;line-height:1.35;color:var(--tinta)}
.tri-ficha dd small{display:block;font-family:var(--serif);font-size:13px;font-style:italic;color:var(--texto);margin-top:2px}
.tri-ficha dd .con-fecha{color:var(--acento)}
.tri-ficha .btn{width:100%;justify-content:center}
.tri-gar{margin:0 0 14px;font-size:14px;font-style:italic;color:var(--acento);line-height:1.5}
@media (prefers-reduced-motion:reduce){.tri-entra{animation:none}.tris--tabs .tri{transition:none}}
.tri-ses .ts-n{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--mute)}
.tri-ficha .btn{font-size:16px;padding-left:16px;padding-right:16px}
@media (max-width:759px){
  .tris--tabs{grid-template-columns:1fr 1fr;gap:10px}
  .tris--tabs .tri-s,.tris--tabs .tri-ver{display:none}
  .tris--tabs .tri-btn{padding:14px 14px 14px;gap:4px}
  .tris--tabs .tri-h{font-size:17px}
  .tris--tabs .tri-aqui{position:static;align-self:flex-start;margin:2px 0 4px}
  .tris--tabs .tri.tri--on::after{display:none}
}

/* --- Rampa de Aprende en el menú y puentes entre taller e Iniciación --- */
.nav-rampa{min-width:340px}
.nav-rampa a{padding:14px 22px}
.nav-rampa .nr-paso{font-family:var(--sans);font-weight:300;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--acento);margin-bottom:2px}
.nav-rampa a small{line-height:1.45;max-width:30ch}
.nav-m .nav-m-sec small{display:block;font-size:12.5px;font-style:italic;color:var(--texto);margin-top:2px}
.tl-puente{margin:14px 0 0;padding:12px 14px;background:var(--crema);border-left:2px solid var(--acento);font-size:14px;line-height:1.55;color:var(--texto)}
.tl-puente a{color:var(--acento)}
.tri-prueba{margin:14px 0 0;font-size:13.5px;line-height:1.55;color:var(--texto)}
.tri-prueba a{color:var(--acento)}
.nav-m nav a.nav-m-sec{flex-direction:column;align-items:flex-start;justify-content:center;gap:2px}
.nav-m nav a.nav-m-sec::after{display:none}
/* Aprende: cómo reservar, en una línea antes de los talleres */
.cat-como--top{margin:0 0 22px;padding:0;gap:10px 28px;display:flex;flex-wrap:wrap}
.cat-como--top li{display:inline-flex;align-items:center;gap:10px;border:0;padding:0}
.cat-como--top li + li{border-left:0;padding-left:0}
.cat-como--top .cc-n{width:26px;height:26px;font-size:12px;grid-row:auto}
.cat-como--top b{font-size:16px;line-height:1.3}
@media (min-width:760px){.cat-como--top{display:flex}.cat-como--top li + li::before{content:"";width:28px;border-top:1px dashed var(--linea);margin-right:4px}}
/* Cuídate · el shiatsu, explicado */
.reveal h2.grande em{font-style:italic}
.shi-quien{font-size:16px !important;font-style:italic;color:var(--crema-2) !important;margin:0 0 22px}
.shi-pasos{list-style:none;margin:0 0 22px;padding:0;border-top:1px solid rgba(239,233,221,.28)}
.shi-pasos li{display:grid;grid-template-columns:34px 1fr;column-gap:12px;padding:12px 0;border-bottom:1px solid rgba(239,233,221,.18)}
.shi-pasos span{grid-row:span 2;display:grid;place-items:center;width:26px;height:26px;border:1px solid rgba(239,233,221,.5);border-radius:50%;font-size:12px;color:var(--crema)}
.shi-pasos b{font-weight:400;font-family:var(--serif);font-size:17px;color:var(--crema)}
.shi-pasos small{font-size:14px;font-style:italic;color:var(--crema-2)}
/* Transforma · sesiones del T1 con el mismo componente que los talleres */
.tl--t1 .tl-in{grid-template-columns:1fr;gap:22px}
@media (min-width:760px){.tl--t1 .tl-in{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px}}
.tl-temario{margin-top:4px;border-bottom:1px solid var(--linea)}
.tl-temario > summary{cursor:pointer;list-style:none;padding:10px 0;font-size:14.5px;color:var(--acento);display:flex;justify-content:space-between;align-items:center}
.tl-temario > summary::-webkit-details-marker{display:none}
.tl-temario > summary::after{content:"+";font-size:18px}
.tl-temario[open] > summary::after{content:"–"}
.tl-tem-in{display:grid;gap:18px;padding:4px 0 16px}
@media (min-width:600px){.tl-tem-in{grid-template-columns:1fr 1fr;gap:24px}}
.tl-tem-in .et{margin:0 0 8px}
.tl-tem-in .t1-l{font-size:14.5px}
.tl--t1 .tl-foto{aspect-ratio:4/3}
.tl-temario > summary{font-family:var(--serif);font-size:15px}
.tl--t1 .tl-lead{font-size:19px}

/* =========================================================
   Transforma · Lo que cuesta (dos planes, compacto y premium)
   ========================================================= */
.planes{display:grid;gap:18px;margin-top:var(--s3)}
@media (min-width:760px){.planes{grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}}
.plan{position:relative;display:flex;flex-direction:column;gap:6px;border:1px solid var(--linea);background:var(--papel);padding:28px 28px 26px;transition:border-color var(--fila-t),transform var(--fila-t),box-shadow var(--fila-t)}
.plan .et{margin:0;color:var(--acento)}
.plan h3{margin:2px 0 0;font-size:24px;font-weight:400;line-height:1.2}
.plan-q{margin:0;font-style:italic;font-size:15px;color:var(--texto)}
.plan-pr{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--linea);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.plan-pr b{font-weight:400;font-family:var(--serif);font-size:44px;line-height:1;color:var(--tinta)}
.plan-pr s{font-family:var(--serif);font-size:20px;color:var(--texto);text-decoration-color:var(--acento)}
.plan-pr small{flex-basis:100%;font-size:13.5px;font-style:italic;color:var(--acento)}
.plan-nota{margin:6px 0 18px;font-size:14px;line-height:1.5;color:var(--texto)}
.plan .btn{margin-top:auto;align-self:flex-start}
.plan--top{border-color:var(--tinta);box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea)}
.plan-sello{position:absolute;top:-11px;right:24px;background:var(--acento);color:var(--crema);font-family:var(--sans);font-weight:300;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
@media (hover:hover){.plan:hover{border-color:var(--acento);transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(31,30,28,.55)}.plan--top:hover{box-shadow:inset 0 0 0 5px var(--papel),inset 0 0 0 6px var(--linea),0 14px 30px -22px rgba(31,30,28,.55)}}
.plan-inc{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:0;border-top:1px solid var(--tinta)}
.plan-inc li{padding:14px 0;border-bottom:1px solid var(--linea);display:grid;gap:2px}
.plan-inc li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acento);margin-bottom:6px}
.plan-inc b{font-weight:400;font-family:var(--serif);font-size:16px;color:var(--tinta)}
.plan-inc span{font-size:13px;font-style:italic;color:var(--texto);line-height:1.45}
@media (min-width:900px){.plan-inc{grid-template-columns:repeat(5,minmax(0,1fr))}.plan-inc li{border-bottom:0;padding:18px 18px 4px}.plan-inc li:first-child{padding-left:0}.plan-inc li + li{border-left:1px solid var(--linea)}}
.plan-extra{margin-top:30px;padding-top:18px;border-top:1px solid var(--linea)}
.plan-extra .et{margin:0 0 6px}
.plan-extra ul{list-style:none;margin:0;padding:0}
.plan-extra li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 20px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--linea)}
.plan-extra b{font-weight:400;font-family:var(--serif);font-size:16px;color:var(--tinta)}
.plan-extra span{grid-column:1;font-size:13px;font-style:italic;color:var(--texto)}
.plan-extra em{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-family:var(--serif);font-size:15px;color:var(--tinta);text-align:right}
@media (prefers-reduced-motion:reduce){.plan{transition:none}.plan:hover{transform:none}}
.plan-extra > .et{font-style:normal;font-size:11px;letter-spacing:.3em;color:var(--acento)}
.plan-extra li span{grid-column:1;font-size:13px;font-style:italic;color:var(--texto)}
@media (max-width:899px){.plan-inc li{grid-template-columns:14px 1fr;column-gap:8px}.plan-inc li::before{grid-row:span 2;margin:8px 0 0}}
.plan-extra em span{font:inherit;color:inherit;grid-column:auto}

/* --- Aprende · módulo del mes (patrocinado, cambia cada mes) --- */
.del-mes{position:relative;display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--linea);background:var(--crema);overflow:hidden;transition:border-color var(--fila-t),box-shadow var(--fila-t)}
.dm-foto{margin:0;aspect-ratio:4/3;overflow:hidden}
.dm-foto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.dm-txt{padding:24px 26px 18px;display:flex;flex-direction:column;gap:8px}
.dm-txt .et{margin:0;color:var(--acento)}
.dm-txt h2{margin:0;font-size:28px;line-height:1.15;border:0;padding:0}
.dm-txt p{margin:0 0 6px;font-size:15.5px;line-height:1.6;color:var(--texto);max-width:46ch}
.dm-txt p b{font-weight:400;color:var(--tinta)}
.dm-txt .flecha{align-self:flex-start;font-size:16px}
.dm-patro{margin:0;padding:10px 26px 14px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--linea);font-family:var(--sans);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--texto)}
@media (min-width:760px){
  .del-mes{grid-template-columns:minmax(0,4fr) minmax(0,7fr);grid-template-rows:1fr auto}
  .dm-foto{grid-row:1 / span 2;aspect-ratio:auto;min-height:100%}
  .dm-txt{padding:28px 32px 18px;justify-content:center}
  .dm-patro{padding:12px 32px 14px}
}
@media (hover:hover){.del-mes:hover{border-color:var(--acento);box-shadow:0 14px 30px -24px rgba(31,30,28,.55)}.del-mes:hover .dm-foto img{transform:scale(1.03)}}
.nw{white-space:nowrap}