/* ============================================================
   Lux Summit Estates — luxesummitestates.com
   Direction: #2 Kinetic Swiss Magazine (2026)
   Off-white ground, matte surfaces, ink black, editorial red,
   data blue. Instrument Serif display + IBM Plex Sans body.
   Swiss-grid editorial / magazine brochure spread system.
   ============================================================ */

:root {
  color-scheme: light;

  /* Surfaces — matte paper */
  --bg:           #FAFAF7;  /* ground */
  --bg-soft:      #F4F2EC;
  --surface:      #ECE9E1;  /* matte card */
  --surface-2:    #E4E0D6;
  --surface-sunk: #F2F0EA;
  --surface-raise:#FFFFFF;

  /* Ink / text — near-black on paper (AA-checked) */
  --ink:          #101010;  /* headings */
  --text:         #1A1A1A;  /* body */
  --text-muted:   #5A5A55;  /* AA on paper */
  --text-faint:   #8A8A82;  /* captions/meta only */
  --on-accent:    #FFFFFF;  /* text on red fills */
  --on-blue:      #FFFFFF;

  /* Lines — thin black rules */
  --border:        rgba(16,16,16,0.14);
  --border-strong: rgba(16,16,16,0.28);
  --rule:          rgba(16,16,16,0.10);
  --rule-strong:   #101010;

  /* Brand accent — editorial red (sparing: section numbers, key accents) */
  --accent:        #D3422F;
  --accent-soft:   #E36B5B;
  --accent-tint:   rgba(211,66,47,0.10);
  --accent-ink:    #B8331F;  /* AA red text on paper */

  /* Data accent — blue (data, links) */
  --data:          #2457C5;
  --data-soft:     #5B7FDB;
  --data-tint:     rgba(36,87,197,0.08);
  --data-ink:      #1B3F94;  /* AA blue text on paper */

  /* Type */
  --font-display: "Instrument Serif", "Times New Roman", Georgia, serif;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Fluid type scale */
  --fs-mast: clamp(2.6rem, 7vw, 7.5rem);     /* masthead/cover title */
  --fs-h1: clamp(2.2rem, 4.5vw, 4.5rem);
  --fs-h2: clamp(1.6rem, 2.4vw, 2.6rem);
  --fs-h3: clamp(1.2rem, 0.8vw + 0.9rem, 1.5rem);
  --fs-lead: clamp(1.05rem, 0.4vw + 0.95rem, 1.25rem);
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-cap: 0.75rem;
  --fs-num: clamp(0.95rem, 0.3vw + 0.85rem, 1.1rem);

  --lh-tight: 1.02;
  --lh-snug: 1.15;
  --lh-head: 1.25;
  --lh-body: 1.6;

  --track-tight: -0.02em;
  --track-cap: 0.18em;

  /* Spacing (8px base) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;

  /* Layout */
  --maxw: min(1280px, 92vw);
  --maxw-wide: min(1440px, 94vw);
  --maxw-narrow: min(760px, 92vw);
  --grid-cols: 12;
  --gap: clamp(16px, 2vw, 32px);
  --gap-tight: 16px;
  --gutter: clamp(20px, 4vw, 64px);

  /* Radii — Swiss: sharp, near-zero */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-pill: 999px;

  /* Shadows — minimal, paper */
  --shadow-1: 0 1px 0 rgba(16,16,16,0.06), 0 12px 32px rgba(16,16,16,0.08);
  --shadow-2: 0 1px 0 rgba(16,16,16,0.08), 0 24px 64px rgba(16,16,16,0.12);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur: 280ms;
  --dur-slow: 600ms;

  /* Focus */
  --focus: 2px solid var(--data);
  --focus-offset: 3px;
}
