/* sitio.css · compartido por index.html e inscripcion.html (ESPEC 3.7 y 4.1).
   Aquí solo va lo que ambas páginas usan igual; lo propio de cada una sigue en su <style>.
   Se enlaza en el <head> antes del <style> de la página: bloquea el render, así que no hay contenido sin estilo. */

/* ---------- Respaldos calibrados ----------
   Medidos con canvas.measureText (ancho de una frase de la página y fontBoundingBox) contra Arial y Georgia, 2 oct 2026 */
@font-face{font-family:"Poppins Respaldo";src:local("Arial"),local("ArialMT");font-weight:400;size-adjust:111.06%;ascent-override:94.54%;descent-override:31.51%;line-gap-override:0%}
@font-face{font-family:"Poppins Respaldo";src:local("Arial"),local("ArialMT");font-weight:500;size-adjust:111.97%;ascent-override:93.78%;descent-override:31.26%;line-gap-override:0%}
@font-face{font-family:"Cormorant Respaldo";src:local("Georgia Bold"),local("Georgia-Bold");font-weight:600;font-style:normal;size-adjust:75.99%;ascent-override:121.07%;descent-override:38.16%;line-gap-override:0%}
@font-face{font-family:"Cormorant Respaldo";src:local("Georgia Italic"),local("Georgia-Italic");font-weight:500;font-style:italic;size-adjust:78.97%;ascent-override:116.5%;descent-override:36.72%;line-gap-override:0%}
@font-face{font-family:"Cormorant Respaldo";src:local("Georgia Bold Italic"),local("Georgia-BoldItalic");font-weight:600;font-style:italic;size-adjust:68.51%;ascent-override:134.29%;descent-override:42.33%;line-gap-override:0%}

/* ---------- Tokens (ESPEC 3.7) ---------- */
:root{
  --crema:#F8F0E8;--arena:#F0E8D8;--beige:#E8D8B8;--durazno:#F8C8B8;--camel:#C8A888;
  --cafe:#684838;--cafe-oscuro:#582808;--caramelo:#784818;--blanco:#FFFFFF;
  --durazno-claro:#FBEDE6;--cielo-lila:#D9C8D1;--cielo-malva:#CDB8C6;--cielo-rosa:#E8C7C0;
  --texto:var(--cafe);--titulo:var(--cafe-oscuro);--acento:var(--caramelo);--foco:var(--cafe-oscuro);
  --luna-luz:var(--cafe);--luna-sombra:var(--crema);--luna-borde:var(--camel);
  --borde:#9A7A62;--error:#9B2C1F;--linea:rgba(104,72,56,.16);
  --serif:"Cormorant Garamond","Cormorant Respaldo",Georgia,serif;
  --sans:"Poppins","Poppins Respaldo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-h1:clamp(2.4rem,1.5rem + 3.9vw,4.2rem);--fs-h2:clamp(1.95rem,1.45rem + 2.2vw,3rem);
  --fs-h3:clamp(1.35rem,1.2rem + .6vw,1.6rem);--fs-cita:clamp(1.3rem,1.1rem + 1vw,1.75rem);
  --fs-dato:clamp(2.2rem,1.8rem + 1.8vw,3rem);--fs-precio:clamp(2.8rem,2.3rem + 2vw,3.6rem);
  --fs-marcador:1.125rem;--fs-lead:1.0625rem;--fs-base:1rem;--fs-chico:.875rem;--fs-etiqueta:.75rem;
  --e-1:4px;--e-2:8px;--e-3:12px;--e-4:16px;--e-5:24px;--e-6:32px;--e-7:48px;--e-8:64px;
  --sec-s:clamp(56px,8vw,96px);--sec-m:clamp(64px,10vw,128px);--sec-l:clamp(72px,12vw,144px);
  --gutter:16px;
  --r-xs:8px;--r-s:14px;--r-m:20px;--r-l:26px;--r-pill:999px;
  --sombra-1:0 1px 2px rgba(88,40,8,.06),0 8px 20px -14px rgba(88,40,8,.25);
  --sombra-2:0 18px 34px -20px rgba(88,40,8,.38);
  --sombra-foto:0 24px 44px -26px rgba(88,40,8,.45);
  --sombra-header:0 6px 18px -12px rgba(88,40,8,.25);
  --ease-calma:cubic-bezier(.22,1,.36,1);--ease-salida:cubic-bezier(.55,0,1,.45);--ease-respira:cubic-bezier(.45,0,.55,1);
  --t-micro:160ms;--t-ui:220ms;--t-barra:320ms;--t-revelar:640ms;--t-linea:820ms;--t-hero:900ms;--t-lento:1400ms;--t-cielo:1600ms;
  --d-1:6px;--d-2:8px;--d-3:14px;--d-4:16px;
  --escalon:80ms;--escalon-corto:35ms;--escalon-lento:150ms;
}
@media (min-width:480px){:root{--gutter:20px}}
@media (min-width:960px){:root{--gutter:24px}}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:80px}
body{font-family:var(--sans);font-size:var(--fs-base);line-height:1.7;color:var(--texto);background:var(--crema);overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit}
ul,ol{list-style:none;padding:0}
h1,h2,h3{font-family:var(--serif);font-weight:600;color:var(--titulo);text-wrap:balance}
p,li,dd{text-wrap:pretty}
em{font-style:italic;color:var(--acento)}
.num{font-variant-numeric:lining-nums tabular-nums}
.wrap{width:min(1120px,100% - 2*var(--gutter));margin-inline:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--foco);outline-offset:3px;border-radius:4px}
[tabindex="-1"]:focus{outline:none}

/* ---------- Vista previa: marca de "por confirmar" (ESPEC 2.1) ---------- */
html[data-revision] [data-pendiente]:not(section){text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:var(--camel);text-decoration-thickness:1.5px;text-underline-offset:.24em;text-decoration-skip-ink:none}
.pie [data-pendiente]{text-decoration-color:var(--durazno)!important}
.aviso-revision,.solo-revision{display:none}
html[data-revision] .aviso-revision,html[data-revision] .solo-revision{display:block}
/* IVA: una sola marca por página (precio de la tarjeta en la landing, total junto al botón en la inscripción) y la misma nota debajo */
.nota-iva{margin-top:6px;font-size:.8125rem;line-height:1.5;color:var(--texto)}

/* ---------- Botón ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 26px;border-radius:var(--r-pill);border:1.5px solid var(--cafe-oscuro);background:var(--cafe-oscuro);color:var(--crema);font:500 .975rem/1.3 var(--sans);text-align:center;text-decoration:none;cursor:pointer;transition:background-color var(--t-micro),color var(--t-micro),border-color var(--t-micro)}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sombra-2);opacity:0;pointer-events:none}
.btn:hover{background:var(--cafe);border-color:var(--cafe)}
.btn strong{color:inherit;font-weight:500}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .btn{transition:transform 200ms var(--ease-calma),background-color var(--t-micro),color var(--t-micro),border-color var(--t-micro)}
  .btn::after{transition:opacity 200ms var(--ease-calma)}
  .btn:hover{transform:translateY(-2px)}
  .btn:hover::after{opacity:1}
  .btn:active{transform:scale(.98);transition-duration:120ms}
}

/* ---------- Encabezado (60 px; 68 px desde 720) ----------
   Por debajo de 960, fondo crema opaco: sin desenfoque, un 97 % dejaba ver como "fantasma" el texto que pasa debajo.
   Desde 960, translúcido con desenfoque donde el navegador lo soporta (ESPEC 10: sin backdrop-filter por debajo de 960). */
.cab{position:sticky;top:0;z-index:30;background:var(--crema)}
.cab::after{content:"";position:absolute;inset:0;border-bottom:1px solid rgba(104,72,56,.14);box-shadow:var(--sombra-header);opacity:0;pointer-events:none;transition:opacity var(--t-micro) var(--ease-salida)}
.cab.sombra::after{opacity:1;transition:opacity var(--t-ui) var(--ease-calma)}
.cab-in{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;padding-block:8px}
.logo{display:flex;align-items:center;gap:8px;min-width:0;min-height:44px;text-decoration:none;view-transition-name:vt-logo;border-radius:8px}
.logo svg{width:36px;height:36px;flex:none}
.logo-t{display:block;line-height:1.25}
.logo-t b{display:block;font-weight:500;font-size:.68rem;letter-spacing:.14em;white-space:nowrap;color:var(--cafe-oscuro)}
.logo-t span{display:block;font-size:.8125rem;letter-spacing:.02em;white-space:nowrap}
@media (min-width:480px){.logo-t b{font-size:.75rem;letter-spacing:.2em}.logo{gap:10px}}
@media (min-width:720px){.logo svg{width:44px;height:44px}.cab-in{min-height:68px}}
@media (min-width:960px){
  @supports ((backdrop-filter:blur(8px)) or (-webkit-backdrop-filter:blur(8px))){
    .cab{background:rgba(248,240,232,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  }
}

/* ---------- Pie (café oscuro; texto arena 10.01:1; foco crema) ---------- */
.pie{background:var(--cafe-oscuro);color:var(--arena);padding-block:48px;--foco:var(--crema);font-size:var(--fs-chico)}
.pie-g{display:grid;gap:16px}
.pie-marca{display:flex;align-items:center;gap:12px}
.pie-marca svg{width:44px;height:44px;--logo-luna:var(--beige);flex:none}
.pie-marca p{line-height:1.5}
.pie-enlaces{display:flex;flex-wrap:wrap;column-gap:22px}
.pie-enlaces a{display:inline-flex;align-items:center;min-height:44px;color:var(--crema);text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:rgba(248,240,232,.45)}
.pie-legal,.pie-salud{line-height:1.6;max-width:70ch}
.pie .solo-revision{color:var(--durazno);font-size:.8125rem}
@media (min-width:960px){.pie-g{grid-template-columns:auto 1fr;column-gap:48px;align-items:center}.pie-enlaces{justify-content:flex-end}.pie-legal,.pie-salud,.pie .solo-revision{grid-column:1/-1}}

/* ---------- View Transitions entre páginas (mejora progresiva, ESPEC 7.8) ---------- */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-group(vt-logo),::view-transition-group(vt-precio){animation-duration:350ms;animation-timing-function:cubic-bezier(.22,1,.36,1)}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:200ms}
}

@media print{.cab{position:static}}