/* Instrument Sans with merged contours for clean CSS text strokes. */
@font-face {
  font-family: "Instrument Sans Outline";
  src: url("../fonts/instrument-sans-outline-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* Brand fonts — variable TTFs bundled locally (OFL licences alongside them). */
@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/instrument-sans.ttf") format("truetype");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono.ttf") format("truetype");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Brand color */
  --lyt-color-ink: #0b0a09;
  --lyt-color-purple: #462768;
  --lyt-color-purple-deep: #1d102c;
  --lyt-color-purple-bright: #6e4594;
  --lyt-color-orange: #eea341;
  --lyt-color-blue: #4d7a87;
  --lyt-color-paper: #f7f7f4;
  --lyt-color-paper-deep: #eeece7;
  --lyt-color-white: #ffffff;
  --lyt-color-muted: #6f6972;

  /* Semantic color */
  --lyt-surface-page: var(--lyt-color-paper);
  --lyt-surface-card: var(--lyt-color-white);
  --lyt-surface-subtle: var(--lyt-color-paper-deep);
  --lyt-surface-instrument: var(--lyt-color-purple-deep);
  --lyt-text-primary: var(--lyt-color-ink);
  --lyt-text-secondary: var(--lyt-color-muted);
  --lyt-text-brand: var(--lyt-color-purple);
  --lyt-text-on-dark: var(--lyt-color-white);
  --lyt-signal-primary: var(--lyt-color-orange);
  --lyt-signal-secondary: var(--lyt-color-blue);
  --lyt-border-subtle: rgba(70, 39, 104, .16);
  --lyt-border-strong: rgba(70, 39, 104, .36);
  --lyt-status-positive: #2f6b58;
  --lyt-status-caution: var(--lyt-color-orange);
  --lyt-status-critical: #8f3043;

  /* Typography */
  --lyt-font-display: "Instrument Sans", "Trebuchet MS", sans-serif;
  --lyt-font-body: "Instrument Sans", Calibri, sans-serif;
  --lyt-font-outline: "Instrument Sans Outline", var(--lyt-font-display);
  --lyt-font-data: "JetBrains Mono", Consolas, monospace;
  --lyt-weight-regular: 400;
  --lyt-weight-bold: 700;
  --lyt-leading-display: .86;
  --lyt-leading-heading: 1;
  --lyt-leading-body: 1.52;
  --lyt-leading-data: 1.35;
  --lyt-tracking-display: -.03em;
  --lyt-tracking-heading: -.018em;
  --lyt-tracking-body: 0;
  --lyt-tracking-data: .08em;
  --lyt-size-body: 18px;
  --lyt-size-small: 14px;
  --lyt-size-data: 11px;

  /* Spacing */
  --lyt-space-1: 4px;
  --lyt-space-2: 8px;
  --lyt-space-3: 12px;
  --lyt-space-4: 16px;
  --lyt-space-6: 24px;
  --lyt-space-8: 32px;
  --lyt-space-12: 48px;
  --lyt-space-16: 64px;
  --lyt-space-24: 96px;
  --lyt-space-32: 128px;
  --lyt-page-gutter: clamp(24px, 5vw, 88px);
  --lyt-content-max: 1440px;
  --lyt-reading-max: 780px;

  /* Shape and border */
  --lyt-radius-control: 5px;
  --lyt-radius-menu: 8px;
  --lyt-radius-card: 14px;
  --lyt-border-width: 1px;

  /* Elevation */
  --lyt-shadow-card: 0 24px 70px rgba(29, 16, 44, .08);
  --lyt-shadow-menu: 0 22px 45px rgba(29, 16, 44, .18);
  --lyt-shadow-signal: 0 0 28px rgba(238, 163, 65, .35);

  /* Motion */
  --lyt-duration-fast: 180ms;
  --lyt-duration-base: 240ms;
  --lyt-duration-reveal: 700ms;
  --lyt-ease-standard: cubic-bezier(.2, .8, .2, 1);
  --lyt-ease-linear: linear;

  /* Accessibility */
  --lyt-focus-ring: 2px solid var(--lyt-color-orange);
  --lyt-focus-offset: 4px;
  --lyt-touch-target: 44px;
}

/* Rich-text authoring utilities. These are the only selectable text colors in the CMS. */
.lyt-text-orange { color: var(--lyt-color-orange, #eea341) !important; }
.lyt-text-purple { color: var(--lyt-color-purple, #462768) !important; }
.lyt-text-ink { color: var(--lyt-color-ink, #0b0a09) !important; }
.lyt-text-muted { color: var(--lyt-color-muted, #6f6972) !important; }
.lyt-text-white { color: var(--lyt-color-white, #ffffff) !important; }

/* Shared semantic roles also cover CMS-authored content and native controls. */
body { font-family: var(--lyt-font-body); letter-spacing: var(--lyt-tracking-body); }
h1, h2, h3, h4, h5, h6 { font-family: var(--lyt-font-display); letter-spacing: var(--lyt-tracking-heading); }
button, input, select, textarea { font-family: var(--lyt-font-body); }
code, pre, kbd, samp { font-family: var(--lyt-font-data); }
p { letter-spacing: var(--lyt-tracking-body); }
