/* ============================================================
   Auditas — Design Tokens
   Extraídos de Figma (Auditas / auditRA). No inventar valores.
   ============================================================ */
:root {
  /* ---- Marca / Oscuros ---- */
  --blackdit: #242b2e;   /* color base de marca (header / fondos) */
  --black90:  #131217;
  --black80:  #191a21;
  --black70:  #1d2025;
  --black60:  #20252a;
  --blackf:   #000000;

  /* ---- Amarillos (acento) ---- */
  --yelludit:    #ffb300; /* acento primario */
  --yelludit20:  #ffe999;
  --yelludit60:  #db9300;
  --yelludit80:  #935a00;
  --seyedit:     #ffeb3b; /* amarillo brillante */
  --orange-acc:  #ff6f00; /* acento del check del logo */

  /* ---- Azul info ---- */
  --infodit:    #1d8dfa;
  --infodit10:  #d1f1fe;
  --infodit40:  #54b2fb;

  /* ---- Neutros / claros ---- */
  --grayudit: #fdfdfd;
  --gray10:   #f2f5f8;
  --gray20:   #dee0de;
  --gray30:   #bfc2c0;
  --gray40:   #a0a5a3;
  --gray60:   #626969;
  --gray70:   #434a4c;
  --whitef:   #ffffff;

  /* ---- Degradados (dirección/grados respetados desde el diseño) ---- */
  --grad-yellow: linear-gradient(135deg, var(--yelludit) 0%, var(--seyedit) 100%);
  --grad-yellow-h: linear-gradient(90deg, var(--yelludit60) 0%, var(--yelludit) 45%, var(--seyedit) 100%);
  /* Overlay del hero: 75.62° del diseño + espejo horizontal (scaleX-1) => 284.375° */
  --grad-hero: linear-gradient(284.375deg, var(--black90) 43.094%, rgba(29, 32, 37, 0) 65.747%);

  /* ---- Tipografía ---- */
  --font-title: "Ubuntu", "Segoe UI", system-ui, sans-serif;
  --font-body:  "Tahoma", "Verdana", "Geneva", system-ui, sans-serif;

  --fw-bold: 700;
  --fw-med:  500;
  --fw-reg:  400;

  /* Escala de tamaños (px de referencia del diseño, fluidos con clamp donde aplica) */
  --fs-h1:    clamp(30px, 1.05rem + 2.6vw, 47px);
  --fs-h2:    clamp(28px, 1.2rem + 1.6vw, 38px);
  --fs-h3:    clamp(21px, 1.1rem + 0.6vw, 24px);
  --fs-l:     clamp(22px, 1rem + 1.1vw, 32px);
  --fs-body:  16px;
  --fs-body-lg: clamp(16px, 0.9rem + 0.4vw, 20px);
  --fs-link:  15px;
  --fs-mini:  13px;

  /* ---- Espaciado ---- */
  --sp-2: 2px;  --sp-4: 4px;  --sp-6: 6px;  --sp-8: 8px;
  --sp-12: 12px; --sp-16: 16px; --sp-20: 20px; --sp-24: 24px;
  --sp-28: 28px; --sp-32: 32px; --sp-40: 40px; --sp-44: 44px;
  --sp-56: 56px; --sp-64: 64px; --sp-80: 80px; --sp-96: 96px; --sp-120: 120px;

  /* ---- Radios ---- */
  --r-s: 6px;
  --r-m: 12px;
  --r-l: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ---- Sombras (base #A0A5A3 con alfas del diseño) ---- */
  --sh-xs: 1px 2px 2px rgba(67, 74, 76, 0.10);
  --sh-s:  4px 4px 4px rgba(160, 165, 163, 0.30);
  --sh-m:  8px 8px 8px rgba(160, 165, 163, 0.25);
  --sh-l:  12px 12px 12px rgba(160, 165, 163, 0.35);
  --sh-dm: 8px 8px 8px rgba(160, 165, 163, 0.75);
  --sh-xl: 12px 12px 12px rgba(160, 165, 163, 0.75);
  /* Sombra para piezas sobre fondo oscuro */
  --sh-dark: 0 18px 50px rgba(0, 0, 0, 0.45);
  --sh-card: 0 10px 30px rgba(0, 0, 0, 0.18);

  /* ---- Layout ---- */
  --container: 1280px;
  --container-pad: clamp(20px, 5vw, 64px);
  --header-h: 65px;

  /* ---- Movimiento ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 0.18s;
  --t-med: 0.32s;
  --t-slow: 0.6s;
}