/* ==========================================================================
   hifce theme — warm personal palette, sage green accent
   Overrides forte-css token defaults. Unlayered — wins over @layer forte.tokens.
   ========================================================================== */


/* ── Satoshi (self-hosted variable font) ─────────────────────────────────────
   Variable font: one file covers weights 300-900. Eliminates Fontshare CDN
   dependency — files served from /static/fonts/ via Eleventy passthrough.
   ──────────────────────────────────────────────────────────────────────────── */

@font-face {
  font-family: 'Satoshi';
  src: url('/static/fonts/Satoshi-Variable.woff2') format('woff2-variations'),
       url('/static/fonts/Satoshi-Variable.woff2') format('woff2');
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Satoshi';
  src: url('/static/fonts/Satoshi-VariableItalic.woff2') format('woff2-variations'),
       url('/static/fonts/Satoshi-VariableItalic.woff2') format('woff2');
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
}


/* ── Type Scale ──────────────────────────────────────────────────────────────
   Ratio: 1.25 (major third) — forte default, correct for personal writing.
   Measure widened to 68ch for longer, more relaxed paragraphs.
   No --forte-step-* overrides — default scale is appropriate.
   ──────────────────────────────────────────────────────────────────────────── */

:root {
  --forte-measure: 68ch;

  --forte-font-body: 'Lora', Georgia, 'Times New Roman', serif;

  /* Conservative type scale for personal writing — quieter than forte's default
     marketing-friendly scale. Headings present, not shouting. */
  --forte-step-0:  clamp(1.0rem, 0.95rem + 0.2vw, 1.075rem);   /* body */
  --forte-step-1:  clamp(1.1rem, 1.05rem + 0.2vw, 1.2rem);
  --forte-step-2:  clamp(1.25rem, 1.18rem + 0.25vw, 1.375rem);
  --forte-step-3:  clamp(1.4rem, 1.3rem + 0.35vw, 1.55rem);    /* h3 */
  --forte-step-4:  clamp(1.55rem, 1.4rem + 0.5vw, 1.75rem);    /* h2 */
  --forte-step-5:  clamp(1.85rem, 1.65rem + 0.65vw, 2.1rem);   /* h1 */
}


/* ── Type families ───────────────────────────────────────────────────────────
   Body: Lora (warm humanist serif, screen-tuned for prose).
   Headings + chrome: Satoshi (geometric humanist sans; shared with prodocloud.com
   for cross-property typographic continuity).
   forte-css currently exposes only --forte-font-body, so headings override
   directly. :where() keeps specificity at 0 — same approach forte uses.
   ──────────────────────────────────────────────────────────────────────────── */

:where(.forte) :is(h1, h2, h3, h4, h5, h6) {
  font-family: 'Satoshi', system-ui, -apple-system, sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
}


/* ── Color: Light Palette ────────────────────────────────────────────────────
   Warm cream-adjacent surface, brown-black text, muted sage green accent.
   Code surface/text unchanged — forte's Catppuccin Mocha is correct.
   Info/warning/danger/tip accents unchanged from forte defaults.
   ──────────────────────────────────────────────────────────────────────────── */

:root {
  --forte-color-text-primary: #222018;
  --forte-color-text-secondary: #5c5a50;
  --forte-color-text-muted: #8a8878;
  --forte-color-text-link: #5c7a3e;
  --forte-color-surface-page: #fdfcf8;
  --forte-color-surface-raised: #f2f0e8;
  --forte-color-border-subtle: #dddbd0;
}


/* ── Color: Dark Palette — system preference ─────────────────────────────── */

@media (prefers-color-scheme: dark) {
  :root {
    --forte-color-text-primary: #e6e4da;
    --forte-color-text-secondary: #96948a;
    --forte-color-text-muted: #636156;
    --forte-color-text-link: #8aad68;
    --forte-color-surface-page: #16150f;
    --forte-color-surface-raised: #1e1c16;
    --forte-color-border-subtle: #2c2a22;
    --forte-color-accent-info: #60a5fa;
  }
}


/* ── Color: Dark Palette — explicit data-theme override ──────────────────── */

[data-theme="dark"] {
  --forte-color-text-primary: #e6e4da;
  --forte-color-text-secondary: #96948a;
  --forte-color-text-muted: #636156;
  --forte-color-text-link: #8aad68;
  --forte-color-surface-page: #16150f;
  --forte-color-surface-raised: #1e1c16;
  --forte-color-border-subtle: #2c2a22;
  --forte-color-accent-info: #60a5fa;
}

