/* -----------------------------------------------------------
   DESIGN SYSTEM
   Marina Huerta — Marketing with a point of view.

   The whole system runs on two colours and one typeface family,
   pushed hard with weight and scale. Cormorant Garamond is the
   single editorial accent, used only where the copy is a
   philosophy statement rather than information.
----------------------------------------------------------- */

:root {
  /* ---------- Colour ---------- */
  --color-bg: #fffaf2;          /* primary background, warm cream paper */
  --color-ink: #000000;         /* primary text, true black */
  --color-ink-70: rgba(0, 0, 0, 0.7);
  --color-ink-55: rgba(0, 0, 0, 0.55);
  --color-ink-35: rgba(0, 0, 0, 0.35);
  --color-line: rgba(0, 0, 0, 0.14);   /* hairline rules */
  --color-line-strong: rgba(0, 0, 0, 0.85);

  --color-invert-bg: #000000;   /* inverted section (Difference) */
  --color-invert-ink: #fffaf2;
  --color-invert-ink-60: rgba(255, 250, 242, 0.6);
  --color-invert-line: rgba(255, 250, 242, 0.2);

  --color-focus: #000000;

  /* ---------- Type ---------- */
  --font-sans: "Barlow", "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Cormorant Garamond", "Times New Roman", serif;

  /* Fluid type scale */
  --text-h1: clamp(2.75rem, 2rem + 3.4vw, 6rem);
  --text-h2: clamp(2.25rem, 1.7rem + 2.3vw, 4rem);
  --text-h3: clamp(1.5rem, 1.3rem + 0.9vw, 2.25rem);
  --text-lead: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --text-body: clamp(1rem, 0.94rem + 0.2vw, 1.125rem);
  --text-small: 0.875rem;
  --text-eyebrow: 0.8125rem;
  --text-display: clamp(3rem, 1.6rem + 7vw, 9rem);

  /* ---------- Spacing ---------- */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.75rem;
  --space-lg: 3rem;
  --space-xl: clamp(4rem, 3rem + 4vw, 7.5rem);
  --space-2xl: clamp(5rem, 3rem + 8vw, 11.25rem);

  /* ---------- Layout ---------- */
  --content-max: 1360px;
  --edge: clamp(1.25rem, 3vw, 4rem);
  --col-gap: clamp(1rem, 2vw, 2rem);

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 200ms;
  --dur-med: 500ms;
  --dur-slow: 900ms;

  /* ---------- Misc ---------- */
  --header-h: 84px;
}