/* Legal Engine brand layer for the HSFK PPR prototype.
 *
 * Aligned to the production www2.legalengine.co.uk 2026 brand system
 * (le-web-branding-2026/src/styles/global.css): the "verified" aesthetic —
 * warm PAPER canvas, near-black INK type, Fraunces serif display + Inter body
 * + JetBrains Mono, on the CORAL accent (the site's orange-accent mode).
 *
 * Pages hardcode most colours inline; those are remapped by a one-off script
 * (charcoal->ink, blue-accent->coral, off-white->paper). This file provides
 * the typographic + base foundation and the token surface.
 */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,460;9..144,500;9..144,600&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* === Paper + ink (www2) === */
  --paper:     #faf8f4;   /* warm off-white canvas */
  --paper-2:   #f3f0e9;   /* sunken sections */
  --card:      #ffffff;
  --ink:       #14130f;   /* near-black body / headlines */
  --ink-2:     #56534b;   /* secondary text */
  --ink-3:     #8a867b;   /* muted / captions */
  --line:      #e7e2d8;   /* hairline borders */
  --line-2:    #d8d2c5;

  /* === Accent: coral (www2 orange-accent mode) === */
  --accent:        #ff6b5e;
  --accent-bright: #ff8a5b;
  --accent-wash:   #fff0ec;
  --accent-soft:   #ff9d80;

  /* === Type === */
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --serif: "Fraunces", "Times New Roman", Georgia, serif;
  --mono:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Back-compat alias used by le-brand earlier */
  --le-charcoal: var(--ink);
  --le-blue: var(--accent);
  --le-coral: var(--accent);
  --le-offwhite: var(--paper);
}

html { font-size: 16px; scroll-behavior: smooth; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

body {
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.6;
  letter-spacing: -0.011em;
  font-feature-settings: "ss01", "cv05";
  -moz-osx-font-smoothing: grayscale;
}

/* Fraunces serif display — the editorial heading look of the live brand. */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--serif);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--ink);
  font-optical-sizing: auto;
}

a { color: var(--accent); }

code, pre, .mono { font-family: var(--mono); }

table { border-color: var(--line) !important; }
::selection { background: rgba(255,107,94,0.20); }

/* Mono "eyebrow" treatment to match www2 (used by the comprehension band). */
.le-eyebrow {
  font-family: var(--mono);
  font-size: 0.72rem; font-weight: 500; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--accent);
}