/* ==========================================================================
   Duoris Estudio — tokens
   Paleta de marca (fija) + derivados teñidos hacia Azul Noche.
   ========================================================================== */

@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Marca */
  --noche: #0e1a3a;
  --duoris: #3b5bfd;
  --claro: #9db0ff;
  --niebla: #f4f6fb;
  --blanco: #ffffff;

  /* Derivados (Azul Noche mezclado sobre Gris Niebla, nunca gris puro) */
  --ink: var(--noche);
  --ink-2: #535c74;          /* texto secundario · 6.2:1 sobre niebla */
  --ink-3: #656e83;          /* metadatos · 4.7:1 sobre niebla */
  --rule: #d4d7e0;           /* filetes del documento */
  --rule-strong: #b7bccb;
  --paper: var(--blanco);
  --duoris-press: #2a47e0;
  --duoris-tint: #f2f5ff;    /* texto secundario sobre Azul Duoris · 4.6:1 */
  --noche-2: #16244a;        /* superficie elevada sobre noche */
  --noche-rule: #26355f;

  /* Tipografía — Inter variable: opsz 32 = Inter Display */
  --font: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --display: 'opsz' 32;
  --text: 'opsz' 14;

  --fs-hero: clamp(2.75rem, 1.6rem + 4.6vw, 6rem);
  --fs-h2: clamp(2.125rem, 1.45rem + 2.6vw, 4rem);
  --fs-h3: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem);
  --fs-lead: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.875rem;
  --fs-micro: 0.75rem;

  /* Ritmo: una sola unidad de renglón (8px) gobierna todo */
  --u: 0.5rem;
  --line: calc(var(--u) * 4);        /* 32px: el pautado del papel */
  --gutter: clamp(1rem, 0.4rem + 3vw, 3.5rem);
  --max: 82rem;                      /* 1312px */
  --section: clamp(5rem, 3rem + 7vw, 10rem);

  /* Forma */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 20px;

  /* Profundidad: varias capas, sombra teñida de noche */
  --shadow-sheet:
    0 1px 1px rgb(14 26 58 / 0.04),
    0 2px 6px rgb(14 26 58 / 0.05),
    0 12px 28px -6px rgb(14 26 58 / 0.1),
    0 40px 80px -24px rgb(14 26 58 / 0.18);
  --shadow-lift:
    0 1px 2px rgb(14 26 58 / 0.06),
    0 8px 20px -6px rgb(14 26 58 / 0.14);

  /* Movimiento */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-stamp: cubic-bezier(0.16, 1, 0.3, 1);
  --t-press: 140ms;
  --t-ui: 200ms;
}