/* Tessra landing4 — game-aligned themes (v3.3).
   Default = Warm Ledger (Soft Atlas). Three palettes have screenshots. */

:root,
[data-landing-theme="soft-atlas"] {
  --bg: #151515;
  --bg-2: #1A1917;
  --bg-card: #1E1D1B;
  --bg-elev: rgba(36, 35, 33, 0.88);

  --ink: #F3F0EA;
  --ink-2: #BDB7AD;
  --ink-3: #7C7770;
  --hairline: rgba(243, 240, 234, 0.10);
  --hairline-2: rgba(243, 240, 234, 0.06);

  --accent: #F06F5E;
  --accent-deep: #E96758;
  --accent-soft: rgba(240, 111, 94, 0.14);
  --accent-wash: rgba(240, 111, 94, 0.08);

  --gold: #F1D86E;
  --gold-soft: rgba(241, 216, 110, 0.18);

  --navy: #10100E;
  --navy-2: #1A1917;
  --navy-line: rgba(243, 240, 234, 0.12);
  --pale: #E9D76B;
  --dark-gold: #F1B96B;

  --tile-thick: #E96758;
  --tile-thick-edge: rgba(233, 103, 88, 0.45);
  --tile-thin: #E9D76B;
  --tile-thin-edge: rgba(233, 215, 107, 0.35);
  --tile-accent: #F06F5E;

  --theme-swatch-a: #E96758;
  --theme-swatch-b: #E9D76B;
  --theme-swatch-bg: #151515;
}

[data-landing-theme="lagoon"] {
  --bg: #101715;
  --bg-2: #131B18;
  --bg-card: #18221F;
  --bg-elev: rgba(29, 40, 37, 0.9);

  --ink: #EAF1ED;
  --ink-2: #A6BAB3;
  --ink-3: #6C7F79;
  --hairline: rgba(234, 241, 237, 0.10);
  --hairline-2: rgba(234, 241, 237, 0.06);

  --accent: #6FC2B2;
  --accent-deep: #5FB4A6;
  --accent-soft: rgba(111, 194, 178, 0.14);
  --accent-wash: rgba(111, 194, 178, 0.08);

  --gold: #9FD9C9;
  --gold-soft: rgba(159, 217, 201, 0.18);

  --navy: #0C1210;
  --navy-2: #131B18;
  --navy-line: rgba(234, 241, 237, 0.12);
  --pale: #79BEDC;
  --dark-gold: #92D6C8;

  --tile-thick: #5FB4A6;
  --tile-thick-edge: rgba(95, 180, 166, 0.45);
  --tile-thin: #79BEDC;
  --tile-thin-edge: rgba(121, 190, 220, 0.35);
  --tile-accent: #6FC2B2;

  --theme-swatch-a: #5FB4A6;
  --theme-swatch-b: #79BEDC;
  --theme-swatch-bg: #101715;
}

[data-landing-theme="quartz"] {
  --bg: #15141A;
  --bg-2: #18171F;
  --bg-card: #1D1C24;
  --bg-elev: rgba(36, 35, 44, 0.9);

  --ink: #F1EFF5;
  --ink-2: #BBB6C7;
  --ink-3: #7D7889;
  --hairline: rgba(241, 239, 245, 0.10);
  --hairline-2: rgba(241, 239, 245, 0.06);

  --accent: #E0A7BC;
  --accent-deep: #DDA6B4;
  --accent-soft: rgba(224, 167, 188, 0.14);
  --accent-wash: rgba(224, 167, 188, 0.08);

  --gold: #E7D4AC;
  --gold-soft: rgba(231, 212, 172, 0.18);

  --navy: #101018;
  --navy-2: #18171F;
  --navy-line: rgba(241, 239, 245, 0.12);
  --pale: #A8C7E2;
  --dark-gold: #D9BCE6;

  --tile-thick: #DDA6B4;
  --tile-thick-edge: rgba(221, 166, 180, 0.45);
  --tile-thin: #A8C7E2;
  --tile-thin-edge: rgba(168, 199, 226, 0.35);
  --tile-accent: #E0A7BC;

  --theme-swatch-a: #DDA6B4;
  --theme-swatch-b: #A8C7E2;
  --theme-swatch-bg: #15141A;
}

[data-landing-theme="folio"] {
  --bg: #0A0A0C;
  --bg-2: #0D0D10;
  --bg-card: #101012;
  --bg-elev: rgba(30, 30, 36, 0.9);

  --ink: #F0EEF2;
  --ink-2: #A8A4B0;
  --ink-3: #65616E;
  --hairline: rgba(240, 238, 242, 0.10);
  --hairline-2: rgba(240, 238, 242, 0.06);

  --accent: #F090A8;
  --accent-deep: #E87898;
  --accent-soft: rgba(240, 144, 168, 0.14);
  --accent-wash: rgba(240, 144, 168, 0.08);

  --gold: #D8D2DC;
  --gold-soft: rgba(216, 210, 220, 0.18);

  --navy: #060608;
  --navy-2: #0D0D10;
  --navy-line: rgba(240, 238, 242, 0.12);
  --pale: #9AA0AC;
  --dark-gold: #F5B4C4;

  --tile-thick: #E87898;
  --tile-thick-edge: rgba(232, 120, 152, 0.45);
  --tile-thin: #9AA0AC;
  --tile-thin-edge: rgba(154, 160, 172, 0.35);
  --tile-accent: #F090A8;

  --theme-swatch-a: #E87898;
  --theme-swatch-b: #9AA0AC;
  --theme-swatch-bg: #0A0A0C;
}

:root {
  --font-display: "Fraunces", "Times New Roman", Georgia, serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* Brief: labels / eyebrows / buttons → JetBrains Mono */
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;

  --fs-hero: clamp(2.6rem, 6.2vw, 5.4rem);
  --fs-h2: clamp(2rem, 4vw, 3.4rem);
  --fs-h3: 1.18rem;
  --fs-lead: clamp(1.05rem, 1.4vw, 1.28rem);
  --fs-body: 1rem;
  --fs-label: 0.74rem;

  --lh-tight: 1.04;
  --lh-snug: 1.22;
  --lh-body: 1.62;

  --pad-x: clamp(1.25rem, 5vw, 4rem);
  --section-y: clamp(5rem, 10vw, 9rem);
  --maxw: 1200px;
  --maxw-text: 56ch;

  --r-sm: 12px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2), 0 6px 18px rgba(0, 0, 0, 0.18);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.22), 0 20px 50px rgba(0, 0, 0, 0.28);
  --shadow-phone: 0 30px 80px -20px rgba(0, 0, 0, 0.55), 0 8px 24px rgba(0, 0, 0, 0.35);

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}