/* =========================================================================
   Rodovalho Advogados — Design Tokens
   Editorial / boutique law-firm aesthetic. Navy + gold.
   ========================================================================= */

:root {
  /* --- COLOR --- */
  --ink-900: #061a28;          /* darkest navy, almost black */
  --ink-800: #0a2538;          /* primary navy */
  --ink-700: #0f3551;          /* mid navy (current site --ink) */
  --ink-600: #1c4f72;          /* lighter navy, links/accents */
  --ink-500: #2a6890;
  --ink-400: #4f86a8;

  --gold-700: #6f522a;         /* deep antique gold */
  --gold-600: #a98552;         /* primary gold */
  --gold-500: #c9a66b;         /* original site gold */
  --gold-400: #ddbe89;         /* light gold */
  --gold-300: #ecd9b3;         /* champagne */

  --paper-50: #fbf8f2;         /* warm off-white */
  --paper-100: #f6f0e6;        /* warm paper */
  --paper-200: #ede4d4;        /* aged paper */
  --paper-300: #d9cab2;        /* sand */

  --neutral-900: #1a1a1a;
  --neutral-700: #3a3a3a;
  --neutral-500: #6f6f6f;
  --neutral-300: #b8b8b8;
  --neutral-100: #ececec;

  /* Semantic */
  --bg: var(--paper-50);
  --bg-soft: var(--paper-100);
  --bg-deep: var(--ink-900);
  --bg-accent: var(--ink-800);

  --text: #182733;
  --text-soft: #43586a;
  --text-faint: #43586a;
  --text-on-dark: #f3ece0;
  --text-on-dark-soft: rgba(243, 236, 224, 0.72);
  --text-on-dark-faint: rgba(243, 236, 224, 0.5);

  --rule: rgba(15, 53, 81, 0.14);
  --rule-strong: rgba(15, 53, 81, 0.28);
  --rule-on-dark: rgba(243, 236, 224, 0.14);
  --rule-on-dark-strong: rgba(243, 236, 224, 0.32);

  --accent: var(--gold-600);
  --accent-soft: var(--gold-400);

  /* --- TYPE --- */
  --font-serif: "Fraunces", "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --font-sans: "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Display sizes (responsive) */
  --fs-display-xl: clamp(3.6rem, 2.4rem + 5vw, 7.2rem);
  --fs-display-lg: clamp(3rem, 2.1rem + 3.8vw, 5.6rem);
  --fs-display-md: clamp(2.4rem, 1.8rem + 2.6vw, 4rem);
  --fs-display-sm: clamp(1.9rem, 1.5rem + 1.6vw, 2.8rem);

  --fs-h1: clamp(2.4rem, 1.7rem + 2.8vw, 4.2rem);
  --fs-h2: clamp(1.9rem, 1.5rem + 1.6vw, 2.9rem);
  --fs-h3: clamp(1.35rem, 1.15rem + 0.7vw, 1.7rem);
  --fs-h4: clamp(1.1rem, 1rem + 0.4vw, 1.3rem);

  --fs-body-lg: clamp(1.05rem, 1rem + 0.25vw, 1.18rem);
  --fs-body: 1rem;
  --fs-body-sm: 0.92rem;
  --fs-eyebrow: 0.78rem;

  --lh-tight: 1.02;
  --lh-snug: 1.18;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  --tracking-display: -0.018em;
  --tracking-h: -0.012em;
  --tracking-eyebrow: 0.18em;

  /* --- SPACING --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-40: 160px;

  /* Section rhythm — adjustable via density tweak */
  --section-y: clamp(80px, 6vw + 40px, 140px);
  --container-w: 1280px;
  --container-narrow: 920px;
  --gutter: clamp(20px, 3vw, 48px);

  /* Header */
  --header-h: 84px;

  /* --- RADII / SHADOWS --- */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 12px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(6, 26, 40, 0.06), 0 1px 1px rgba(6, 26, 40, 0.04);
  --shadow-2: 0 6px 18px rgba(6, 26, 40, 0.08), 0 2px 6px rgba(6, 26, 40, 0.05);
  --shadow-3: 0 18px 40px rgba(6, 26, 40, 0.14), 0 6px 14px rgba(6, 26, 40, 0.08);
  --shadow-4: 0 30px 70px rgba(6, 26, 40, 0.22);

  /* --- MOTION --- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 180ms;
  --dur-2: 280ms;
  --dur-3: 480ms;
  --dur-4: 720ms;
  --dur-5: 1100ms;
}

/* Density variants (Tweaks) */
:root[data-density="compact"] {
  --section-y: clamp(56px, 4vw + 24px, 96px);
}
:root[data-density="spacious"] {
  --section-y: clamp(112px, 8vw + 64px, 200px);
}

/* Type variants (Tweaks) */
:root[data-type="classic"] {
  --font-serif: "Playfair Display", Georgia, serif;
  --font-sans: "DM Sans", "Inter", -apple-system, sans-serif;
}
:root[data-type="modern"] {
  --font-serif: "Fraunces", Georgia, serif;
  --font-sans: "Inter Tight", -apple-system, sans-serif;
}
:root[data-type="contrast"] {
  --font-serif: "Cormorant Garamond", "Fraunces", Georgia, serif;
  --font-sans: "Inter Tight", -apple-system, sans-serif;
  --tracking-display: -0.025em;
}