/* tokens.css — Hallmark · Coral theme · seguroausa.com redesign
 * paper-band: white (L = 100%) · display: roman-serif · accent-hue: warm (H 30°)
 */
:root {
  /* ── Color: Paper (white, zero chroma) ── */
  --color-paper:           oklch(100% 0 0);
  --color-paper-2:         oklch(96% 0 0);
  --color-paper-3:         oklch(92% 0 0);

  /* Paper overlays for dark-background sections */
  --color-paper-on-dark:   oklch(100% 0 0 / 0.85);
  --color-paper-muted:     oklch(100% 0 0 / 0.6);
  --color-paper-dim:       oklch(100% 0 0 / 0.4);
  --color-paper-ghost:     oklch(100% 0 0 / 0.28);
  --color-paper-line:      oklch(100% 0 0 / 0.12);

  /* ── Color: Ink (neutral, zero chroma for clean white base) ── */
  --color-ink:             oklch(12% 0 0);
  --color-ink-2:           oklch(38% 0 0);
  --color-ink-3:           oklch(58% 0 0);

  /* ── Color: Dark band (footer, CTA, hero dark sections) ── */
  --color-dark-band:       oklch(32% 0.13 242);

  /* ── Color: Accent (logo navy blue, H ≈ 242°) ── */
  --color-accent:          oklch(40% 0.08 242);
  --color-accent-hover:    oklch(33% 0.08 242);
  --color-accent-text:     oklch(100% 0 0);
  --color-accent-text-dim: oklch(100% 0 0 / 0.8);
  --color-accent-subtle:   oklch(40% 0.08 242 / 0.08);

  /* ── Color: Overlay ── */
  --color-overlay-dark:    oklch(0% 0 0 / 0.52);
  --color-carousel-eye:    oklch(80% 0.05 242);

  /* ── Color: State ── */
  --color-error:           oklch(55% 0.21 25);
  --color-success:         oklch(55% 0.18 145);

  /* ── Color: Rule (crisp grey on white) ── */
  --color-rule:            oklch(88% 0 0);
  --color-rule-dark:       oklch(100% 0 0 / 0.12);

  /* ── Color: Focus ── */
  --color-focus:           oklch(62% 0.19 30);

  /* ── Typography ── */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* ── Type scale ── */
  --text-display:   clamp(3.5rem, 8vw, 6rem);
  --text-display-s: clamp(2rem, 5vw, 3.5rem);
  --text-xl:        clamp(1.4rem, 2.5vw, 1.875rem);
  --text-lg:        1.25rem;
  --text-md:        1rem;
  --text-sm:        0.875rem;
  --text-xs:        0.75rem;

  /* ── Spacing (4pt scale) ── */
  --space-1:  0.25rem;   /*  4px */
  --space-2:  0.5rem;    /*  8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6rem;      /* 96px */
  --space-32: 8rem;      /* 128px */

  /* ── Motion ── */
  --dur-instant: 0ms;
  --dur-fast:    120ms;
  --dur-base:    200ms;
  --dur-slow:    350ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ── Radius ── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-full: 9999px;

  /* ── Rules ── */
  --rule-thin:  1px;
  --rule-thick: 2px;
}