/* site-tokens.css · tokens + base · portada (y todo el sitio tras el paso 2) · 13 Nov 2026 */
/* ───────────── tokens ───────────── */
:root{
  --navy:#0c1e50;
  --red:#e85555;            /* acento del sitio */
  --red-ink:#c53f3f;        /* texto pequeño y botón sobre claro (5,05:1) */
  --l1:#fbfbfd; --l2:#f5f5f7;
  --ink:#1d1d1f; --mute:#636366; --card:#ffffff; --line:rgba(0,0,0,.1);
  --d1:#0a0b14; --d2:#12131f;
  --dink:#f5f5f7; --dmute:#a1a1a6; --dcard:#1c1d2b; --dline:rgba(255,255,255,.12);
  --accent-l:var(--red-ink); --accent-d:var(--red);
  --font:"Inter","Inter Fallback",-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --max:1120px; --gut:clamp(20px,5vw,48px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --hdr:64px;
  --r-l:clamp(24px,3vw,32px); --r-m:20px; --r-s:12px;   /* radios */
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:40px; --sp-5:64px; /* espaciado */
}
/* Tema: automático (prefers-color-scheme) o forzado con <html data-theme="light|dark"> (interruptor de la cabecera) */
:root{color-scheme:light dark}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){ --l1:#000; --l2:#0d0d10; --ink:#f5f5f7; --mute:#a1a1a6; --card:#1c1c1e; --line:rgba(255,255,255,.14);
         --d1:#16171f; --d2:#1d1e29; --accent-l:var(--red); }
}
:root[data-theme="dark"]{ --l1:#000; --l2:#0d0d10; --ink:#f5f5f7; --mute:#a1a1a6; --card:#1c1c1e; --line:rgba(255,255,255,.14);
         --d1:#16171f; --d2:#1d1e29; --accent-l:var(--red); }
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:56px}
body{margin:0;font-feature-settings:"cv11","ss01";font-optical-sizing:auto;background:var(--l1);color:var(--ink);font-family:var(--font);font-size:clamp(17px,16.6px + .25vw,20px);line-height:1.5;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,figure,blockquote{margin:0}
ul{padding:0;list-style:none}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:6px}
::selection{background:var(--red);color:#fff}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--navy);color:#fff;padding:12px 18px;border-radius:12px;z-index:100;transition:top .2s}
.skip:focus{top:12px}

/* ───────────── acabado (13 Nov 2026) ───────────── */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.28s;animation-timing-function:var(--ease)}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
h1,h2,h3{text-wrap:balance}
p,li,blockquote{text-wrap:pretty}
html{font-kerning:normal;text-rendering:optimizeLegibility}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:8px;box-shadow:0 0 0 5px color-mix(in srgb,var(--red) 22%,transparent)}
a,button{-webkit-tap-highlight-color:transparent}
::selection{background:color-mix(in srgb,var(--red) 85%,#fff);color:#fff}