/* ============================================================
   Trivie Business Brokers — Design Tokens (v2)
   Concept: "A core sample of a built thing." One continuous
   sunset-to-soil substrate crossed once at a horizon — canopy
   light up top, the valuation in the trunk, proof in the roots.
   Display: Fraunces (broadsheet). Body: Inter Tight (grotesque).
   Ring-numerals are the only ornament. No cards. No soft shadows.
   ============================================================ */

:root {
  /* ---- L1 Primitives: the sunset-to-soil light ---- */
  --marigold:  #F6C24A;   /* canopy light, top of page */
  --sun:       #E87A2A;   /* brand orange — the sunset */
  --sun-deep:  #C75F18;
  --rust:      #B5481A;   /* last light at the horizon */
  --navy-700:  #14345C;
  --navy-800:  #0D2847;   /* brand navy — the badge / ink */
  --navy-900:  #0A1F38;   /* soil */
  --navy-950:  #07131F;   /* root-dark, deepest */

  --paper:     #FBF7EF;
  --cream:     #F4EFE7;
  --ink-warm:  #2A2118;

  --neutral-100: #ECE6DC;
  --neutral-300: #C2B8A8;
  --neutral-500: #6E6657;
  --neutral-600: #564E40;

  /* ---- L2 Semantic ---- */
  --ink:            var(--navy-800);
  --ink-muted:      color-mix(in srgb, var(--navy-800) 68%, transparent);
  --ink-on-soil:    #F1E9DA;
  --ink-on-soil-muted: #A9B6C8;
  --accent:         var(--sun);
  --accent-ink:     var(--navy-950);
  --line-sky:       color-mix(in srgb, var(--navy-800) 26%, transparent);
  --line-soil:      color-mix(in srgb, #F1E9DA 22%, transparent);
  --focus:          2px solid var(--navy-800);

  /* ---- Spacing — 4-based, 16px heartbeat ---- */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 24px;  --space-6: 32px;  --space-7: 48px;  --space-8: 64px;
  --space-9: 96px;  --space-10: 128px; --space-11: 160px; --space-12: 224px;

  /* ---- Type scale — 1.333 perfect fourth (editorial broadsheet) ---- */
  --ms-0: 1rem;        --ms-1: 1.333rem;   --ms-2: 1.777rem;   --ms-3: 2.369rem;
  --ms-4: 3.157rem;    --ms-5: 4.209rem;   --ms-6: 5.61rem;    --ms-7: 7.478rem;
  --ms-dn1: 0.78rem;   --ms-dn2: 0.66rem;

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-text: "Inter Tight", system-ui, -apple-system, sans-serif;

  /* ---- Radius — minimal; hairlines do the work ---- */
  --r-xs: 3px;  --r-sm: 6px;  --r-md: 10px;  --r-pill: 999px; --r-full: 50%;

  /* ---- Motion ---- */
  --ease-standard:   cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-expressive: cubic-bezier(0.16, 1, 0.30, 1);
  --dur-micro: 120ms; --dur-element: 200ms; --dur-section: 320ms; --dur-cinematic: 640ms;
  --stagger: 75ms;

  /* ---- Layout ---- */
  font-size: clamp(1rem, 0.95rem + 0.28vw, 1.1875rem);
  --section-y: clamp(4rem, 2.6rem + 5vw, 8.5rem);
  --gutter:    clamp(1.25rem, 0.8rem + 2vw, 3rem);
  --edge:      clamp(1.1rem, 0.6rem + 1.4vw, 1.75rem);
  --measure:   62ch;
  --shell:        min(100% - 2 * var(--edge), 74rem);
  --shell-wide:   min(100% - 2 * var(--edge), 86rem);
  --shell-narrow: min(100% - 2 * var(--edge), 46rem);

  /* the two continuous fields meet at one horizon */
  --sky-grad:  linear-gradient(180deg, var(--marigold) 0%, var(--sun) 48%, var(--sun-deep) 80%, var(--rust) 100%);
  --soil-grad: linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 48%, var(--navy-950) 100%);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}