/* IRIS landing 2026 tokens. Light is the default; dark applies with <html class="dark-mode"> (site.js) or data-theme="dark". */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600&family=Poppins:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --bg-primary: #f8f9fa;
  --bg-raised: #ffffff;
  --text-primary: #233042;
  --text-secondary: #475161;
  --text-muted: #5d6573;
  --text-quiet: #7d8695;
  --accent: #2459d6;
  --accent-hover: #1d56cc;
  --accent-line: #2e6ff2;
  --accent-tint: rgba(46, 111, 242, 0.08);
  --action: #2459d6;
  --action-hover: #1d56cc;
  --on-action: #ffffff;
  --iris-blue: #2e6ff2;
  --iris-sky: #5399ee;
  --rule: rgba(35, 48, 66, 0.12);
  --rule-strong: rgba(35, 48, 66, 0.16);
  --hatch: rgba(35, 48, 66, 0.08);
  --hero-hatch: rgba(46, 111, 242, 0.06);
  --nav-bg: rgba(248, 249, 250, 0.85);
  --nav-text: #233042;
  --btn-secondary-bg: #ffffff;
  --logo-navy: #152b47;
  --logo-blue: #3b6cbc;
  --logo-sky: #5ea4f7;
  --dot-red: #d04c3c;
  --dot-yellow: #e5a93e;
  --dot-green: #1da87c;
  --status-active-bg: rgba(29, 168, 124, 0.15);
  --status-pending-bg: rgba(229, 169, 62, 0.15);
  --mockup-bg: #f0f2f5;
  --mockup-sidebar: #e8eaed;
  --mockup-card-bg: #ffffff;
  --mockup-bar-track: #e2e5ea;
  --mockup-titlebar: #e0e2e6;
  --mockup-text: #233042;
  --mockup-text-muted: #5d6573;
  --mockup-border: rgba(35, 48, 66, 0.08);
  --shadow-cta: 0 4px 16px rgba(36, 89, 214, 0.25);
  --shadow-mockup: 0 -2px 40px rgba(35, 48, 66, 0.10);
}

:root.dark-mode,
:root[data-theme="dark"] {
  --bg-primary: #0f1319;
  --bg-raised: #1e2a3d;
  --text-primary: #ebedf0;
  --text-secondary: #b9b9b9;
  --text-muted: #8d8d8d;
  --accent: #5399ee;
  --accent-hover: #7aabf2;
  --accent-line: #5399ee;
  --accent-tint: rgba(83, 153, 238, 0.12);
  --rule: rgba(231, 231, 231, 0.09);
  --rule-strong: rgba(231, 231, 231, 0.16);
  --hatch: rgba(231, 231, 231, 0.06);
  --hero-hatch: rgba(83, 153, 238, 0.06);
  --nav-bg: rgba(15, 19, 25, 0.85);
  --nav-text: #e7e7e7;
  --btn-secondary-bg: rgba(231, 231, 231, 0.04);
  --mockup-bg: #1a2233;
  --mockup-sidebar: #151c28;
  --mockup-card-bg: #1e2a3d;
  --mockup-bar-track: #2a3548;
  --mockup-titlebar: #151c28;
  --mockup-text: #e7e7e7;
  --mockup-text-muted: #9aa3b0;
  --mockup-border: rgba(231, 231, 231, 0.06);
  --shadow-cta: 0 4px 20px rgba(83, 153, 238, 0.25);
  --shadow-mockup: 0 -2px 48px rgba(83, 153, 238, 0.10);
  color-scheme: dark;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-28: 112px;
  --space-32: 128px;
  --radius-none: 0px;
  --radius-xs: 4px;
  --radius-md: 8px;
  --radius-window: 14px;
  --content-width: 1200px;
  --cell-pad-x: 48px;
  --strip-height: 48px;
  --nav-height: 64px;
  --nav-divider-height: 28px;
  --hero-fade: 280px;
  --rail-fade: 320px;
  --bp-mobile: 680px;
  --bp-tablet: 1024px;
  --font-display: "Poppins", system-ui, sans-serif;
  --font-body: "Open Sans", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
.type-display { font-family: var(--font-display); font-size: 64px; line-height: 1.06; font-weight: 700; letter-spacing: -0.025em; }
.type-statement { font-family: var(--font-display); font-size: 44px; line-height: 1.15; font-weight: 600; letter-spacing: -0.02em; }
.type-heading-1 { font-family: var(--font-display); font-size: 40px; line-height: 1.15; font-weight: 600; letter-spacing: -0.015em; }
.cell-title { font-family: var(--font-display); font-size: 17px; line-height: 1.3; font-weight: 600; }
.item-name { font-family: var(--font-display); font-size: 16px; line-height: 1.3; font-weight: 500; }
.button-label { font-family: var(--font-display); font-size: 15px; line-height: 1.2; font-weight: 600; }
.hero-subtitle { font-family: var(--font-body); font-size: 19px; line-height: 1.6; font-weight: 400; }
.section-description { font-family: var(--font-body); font-size: 17px; line-height: 1.7; font-weight: 400; }
.cell-body { font-family: var(--font-body); font-size: 15px; line-height: 1.6; font-weight: 400; }
.nav-link { font-family: var(--font-body); font-size: 14px; line-height: 1.4; font-weight: 500; }
.type-small { font-family: var(--font-body); font-size: 13px; line-height: 1.5; font-weight: 400; }
.label-section { font-family: var(--font-mono); font-size: 12px; line-height: 1.3; font-weight: 400; letter-spacing: 0.04em; }
.label-index { font-family: var(--font-mono); font-size: 12px; line-height: 1.3; font-weight: 400; letter-spacing: 0.04em; }
.label-tag { font-family: var(--font-mono); font-size: 11px; line-height: 1.3; font-weight: 400; letter-spacing: 0.05em; }
.module-code { font-family: var(--font-mono); font-size: 12px; line-height: 1.3; font-weight: 500; letter-spacing: 0.06em; }