/* ───────────────────────────────────────────────────────────────
   Euno — design tokens
   Exact values from the Euno Design System + the landing mock.
   Palette is law: no gradients, no neon, no pure white, no gray shadows.
   ─────────────────────────────────────────────────────────────── */

:root {
  /* ── color · surfaces ── */
  --color-surface: #F5EFE3;        /* dominant cream background */
  --color-band-warm: #EAE0CE;      /* warm contrast band (hero-adjacent, precio) */
  --color-band: #EDE5D3;           /* secondary band (diarios, espejo) */
  --color-card: #FBF8F2;           /* warm paper card — never pure white */

  /* ── color · ink ── */
  --color-primary: #1A2E4A;        /* navy — headlines, primary buttons, icons */
  --color-primary-dark: #0E1B2E;   /* navy dark — pressed, shadow source */
  --color-primary-hover: #16273f;  /* primary button hover */
  --color-text-secondary: #5C6B7F;
  --color-text-tertiary: #8A97A8;
  --color-text-muted: #9aa6b3;     /* fainter metadata */
  --color-eyebrow-warm: #9a8b6e;   /* eyebrow on warm bands */

  /* ── color · lines ── */
  --color-divider: #E7DDCC;        /* lighter divider */
  --color-divider-strong: #D9CFBD; /* default border / divider */

  /* ── color · accents (muted, never saturated) ── */
  --accent: #C66B4F;               /* terracota — emotional accent (default) */
  --accent-soft: #E8C8B8;          /* terracota soft — chip / badge bg */
  --accent-sage: #7A8B6B;          /* salvia — secondary accent */
  --accent-ink: #9a4a30;           /* terracota text on soft bg */
  --bar-track: #DBCDB6;            /* portrait progress-bar track */

  /* ── color · inverse (navy sections) ── */
  --color-inverse: #F5EFE3;
  --color-inverse-70: rgba(245, 239, 227, 0.72);
  --color-inverse-60: rgba(245, 239, 227, 0.62);
  --color-inverse-50: rgba(245, 239, 227, 0.5);
  --color-inverse-45: rgba(245, 239, 227, 0.45);
  --color-inverse-40: rgba(245, 239, 227, 0.4);
  --color-inverse-28: rgba(245, 239, 227, 0.28);
  --color-inverse-14: rgba(245, 239, 227, 0.14);
  --color-inverse-06: rgba(245, 239, 227, 0.06);

  /* ── shadows · navy ink, never gray ── */
  --shadow-lift1: 0 8px 24px rgba(14, 27, 46, 0.07);
  --shadow-card: 0 14px 40px rgba(14, 27, 46, 0.08);
  --shadow-cta: 0 12px 30px rgba(14, 27, 46, 0.16);

  /* ── type families ── */
  --font-display: 'Plus Jakarta Sans', Georgia, serif; /* display only · 400 + italic */
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  /* ── type scale (fluid; hierarchy from size, never weight) ── */
  --text-hero: clamp(44px, 7.4vw, 78px);
  --text-manifesto: clamp(34px, 5.6vw, 58px);
  --text-h2-lg: clamp(30px, 4.8vw, 48px);
  --text-h2: clamp(28px, 4.4vw, 46px);
  --text-quote-lg: clamp(28px, 5vw, 46px);
  --text-list: clamp(22px, 3vw, 30px);
  --text-h3: 25px;
  --text-body-lg: clamp(17px, 2vw, 20px);
  --text-body: clamp(16px, 1.9vw, 18px);
  --text-base: 16px;
  --text-caption: 15px;
  --text-small: 14px;
  --text-label: 12px;

  /* ── spacing · 4pt base ── */
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-xxxl: 64px;

  /* ── layout ── */
  --max-wide: 1180px;
  --nav-h: 75px;

  /* ── radii ── */
  --radius-card: 16px;
  --radius-card-lg: 20px;
  --radius-chip: 13px;
  --radius-pill: 9999px;

  /* ── motion · ease-out, no bounce ── */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 150ms;

  /* ── icon masks (color driven by accent vars) ── */
  --check-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}
