/* ==========================================================
   DATRANSUR S.L. — Sistema de diseño
   Paleta extraída del logotipo oficial. Azul #003882 dominante.
   Tokens de motion según skill emilkowalski (animate):
   ease-out fuerte, duraciones <300ms UI, stagger 30-80ms.
   ========================================================== */
:root {
  --color-primary: #003882;
  --color-primary-dark: #00295f;
  --color-primary-light: #0a4a9a;
  --color-primary-ink: #001f45;
  --color-ink: #0a1a2e;

  --color-secondary: #78b3df;
  --color-secondary-light: #dcecF8;
  --color-secondary-dark: #4a90c2;

  --color-accent: #ffb224;
  --color-accent-strong: #f59e00;
  --color-accent-soft: #fff3d9;

  --color-white: #ffffff;
  --color-background: #f2f5f8;
  --color-surface: #ffffff;
  --color-surface-alt: #e9eff4;

  --color-text: #24313b;
  --color-text-secondary: #5f6f7b;
  --color-text-inverse: #ffffff;
  --color-text-on-primary: #ffffff;

  --color-border: #d9e0e6;
  --color-border-strong: #b9c6d1;
  --color-focus: #0a4a9a;

  --grad-primary: linear-gradient(135deg, #0a4a9a 0%, #003882 48%, #00295f 100%);
  --grad-dark: linear-gradient(135deg, #0e2a4e 0%, #001f45 55%, #0a1a2e 100%);
  --grad-accent: linear-gradient(135deg, #ffcf5c 0%, #ffb224 55%, #f59e00 100%);

  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Archivo", "Inter", "Segoe UI", system-ui, sans-serif;

  --fs-hero: clamp(2.4rem, 5.2vw, 4.4rem);
  --fs-h2: clamp(1.9rem, 3.4vw, 2.9rem);
  --fs-h3: clamp(1.15rem, 1.8vw, 1.45rem);
  --fs-lead: clamp(1.05rem, 1.6vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.9rem;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(0, 31, 69, 0.08), 0 2px 10px rgba(0, 31, 69, 0.06);
  --shadow-md: 0 10px 28px rgba(0, 31, 69, 0.14), 0 2px 8px rgba(0, 31, 69, 0.08);
  --shadow-lg: 0 24px 60px rgba(0, 31, 69, 0.22), 0 4px 14px rgba(0, 31, 69, 0.1);
  --shadow-accent: 0 10px 26px rgba(245, 158, 0, 0.32);

  /* Motion — emilkowalski: custom curves, nunca ease-in en UI */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --transition-fast: 160ms var(--ease-out);
  --transition-normal: 220ms var(--ease-out);
  --transition-slow: 420ms var(--ease-out);

  --container-width: 1200px;
  --container-padding: clamp(1.1rem, 4vw, 2rem);
  --header-height: 74px;

  --bp-tablet: 1024px;
  --bp-mobile: 768px;
  --bp-small: 480px;
}