/* atas.aero — shared design tokens + site chrome (nav / classification bar /
   footer / module tabs), injected by /chrome.js on pages that opt in via
   <body data-chrome="marketing|compact">. See docs/FRONTEND_ARCHITECTURE.md
   ("consolidate the shared chrome" — this file is that track).

   TOKENS. One canonical set, plus compatibility aliases for the names the
   per-page inline styles historically used (the three drifting `:root` systems
   the June-2026 review found). Values are the shipped ones — notably the
   accent named `--amber` was ALWAYS the brand blue #0066CC; `--acc` is now the
   canonical name and `--amber` is an alias, so nothing changes visually.
   Page inline <style> blocks may still define their own :root — those win by
   order, which is intended during the incremental adoption. */

:root {
  /* surfaces */
  --paper: #FFFFFF;
  --paper-dim: #F2F6F8;
  --paper-deep: #E3ECEF;
  --bg: var(--paper-dim);
  /* ink */
  --ink: #111418;
  --ink-soft: #3A4250;
  --muted: #555E6F;
  --muted-faint: #606A77;
  --faint: var(--muted-faint);
  /* De-emphasis ON DARK surfaces (classbar, footer). The light-surface
     greys above were darkened to clear AA on #F2F6F8/#FFF; applying them to
     the near-black bar inverts the problem (#606A77 is 3.66:1 there). On
     dark, de-emphasis has to get LIGHTER, not darker. */
  --on-dark-soft: #9AA3AD;
  --soft: var(--ink-soft);
  /* rules / borders */
  --rule: #E2E8ED;
  --rule-soft: #EEF2F5;
  --rule-l: var(--rule-soft);
  --border: var(--rule);
  /* accent — the brand blue (canonical: --acc) */
  --acc: #0066CC;
  --acc-bright: #3399FF;
  --acc-tint: #E6F0FB;
  --amber: var(--acc);            /* legacy name (value was always this blue) */
  --amber-bright: var(--acc-bright);
  --amber-tint: var(--acc-tint);
  --accent-brand: var(--acc);     /* profiler-set alias */
  /* deep brand + supporting hues */
  --steel: #003D7A;
  --steel-bright: #1D68B5;
  --steel-tint: #DCEAF7;
  --brand-deep: var(--steel);
  --sage: #2A6F8E;
  --rust: #9C5228;              /* Engine module accent (promoted from index.html) */

  /* Type — two faces, and nothing else. Georgia and Courier New are retired
     site-wide (2026-07); these are the only stacks a page should name.
     Each leads with the webfont and then walks a full system ladder to a
     generic family, so a page still renders correctly everywhere if the
     webfont is blocked, slow or unsupported — never a browser default serif.
     A page that names one of these must also LOAD the webfont it leads with;
     surfaces that deliberately ship no webfont (the legal pages) use the
     --font-system / --mono-system ladders instead. */
  --font-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --mono-system: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
  --font: 'Poppins', var(--font-system);
  --mono: 'JetBrains Mono', var(--mono-system);
}

/* ── Site chrome ─────────────────────────────────────────────
   Everything below styles ONLY the .site-* elements chrome.js injects; it is
   scoped so linking this file cannot restyle page content. Metrics are lifted
   verbatim from index.html (marketing) and lease-redelivery.html /
   cost-data-pack.html (compact). */

.site-container { max-width: 1180px; margin: 0 auto; padding: 0 32px; position: relative; z-index: 2; }

/* Classification bar (both variants) */
.site-classbar {
  background: var(--ink); color: var(--paper); padding: 7px 0;
  font-family: 'Poppins', sans-serif;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
}
.site-classbar .site-classbar-row { display: flex; justify-content: space-between; }
.site-classbar span { color: var(--on-dark-soft); }
.site-classbar .live { color: var(--acc-bright); }
/* Compact pages run the bar edge-to-edge with tighter padding. */
.site-classbar--compact { padding: 7px 26px; }
.site-classbar--compact .site-classbar-row { max-width: none; padding: 0; }
/* The compact bar used to re-point .live at --acc (#0066CC), which is 3.32:1
   on the near-black bar — the brand blue is a light-surface colour. Both
   variants now use --acc-bright (6.28:1). */
.site-classbar--compact .live { color: var(--acc-bright); }

/* Marketing nav */
.site-nav { border-bottom: 1px solid var(--rule); padding: 18px 0; background: var(--paper); }
.site-nav .site-nav-row { display: flex; align-items: center; justify-content: space-between; }
.site-brand { display: flex; align-items: baseline; gap: 12px; text-decoration: none; color: inherit; }
.site-brand b { font-weight: 500; font-size: 18px; letter-spacing: -0.01em; color: var(--ink); }
.site-brand .div { width: 1px; height: 18px; background: var(--rule); align-self: center; }
.site-brand .sub {
  font-family: 'Poppins', sans-serif; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.18em; color: var(--acc); font-weight: 500;
}
.site-nav-links { display: flex; gap: 32px; font-size: 13px; color: var(--ink-soft); }
.site-nav-links a { color: inherit; text-decoration: none; transition: color 0.15s; }
.site-nav-links a:hover, .site-nav-links a.active { color: var(--acc); }
.site-nav-cta {
  border: 1px solid var(--ink); padding: 7px 18px;
  font-family: 'Poppins', sans-serif; font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--ink); text-decoration: none; transition: all 0.2s;
}
.site-nav-cta:hover { background: var(--ink); color: var(--paper); }
/* The client-portal door: quiet next to the CTA, same size grammar. */
.site-nav-signin {
  padding: 7px 14px; margin-right: 10px;
  font-family: 'Poppins', sans-serif; font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--ink-soft); text-decoration: none; transition: color 0.15s;
}
.site-nav-signin:hover { color: var(--acc); }

/* Compact header (tool pages) */
.site-hdr {
  background: var(--paper); border-bottom: 1px solid var(--rule);
  padding: 15px 26px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.site-hdr .site-brand { gap: 9px; }
.site-hdr .site-brand b { font-weight: 600; }
.site-hdr .site-brand .div { height: 15px; }
.site-hdr .site-pg { font-size: 12.5px; color: var(--muted); }

/* Module tabs (both variants) */
.site-modtabs { display: inline-flex; border: 1px solid var(--rule); margin-left: auto; }
.site-modtabs a {
  font-family: 'Poppins', sans-serif; font-size: 11.5px; padding: 8px 16px;
  border: 0; border-right: 1px solid var(--rule); cursor: pointer;
  background: var(--paper); color: var(--ink-soft); text-decoration: none;
}
.site-modtabs a:last-child { border-right: 0; }
.site-modtabs a.on { background: var(--acc); color: #fff; font-weight: 500; }

/* Footer (marketing; data-footer="full" | "slim") */
.site-footer { padding: 50px 0 34px; background: var(--ink); color: var(--paper-deep); }
.site-footer .footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 48px; }
.site-footer .footer-brand { font-family: 'Poppins', sans-serif; font-size: 26px; color: var(--paper); margin-bottom: 8px; }
.site-footer .footer-brand em { font-style: italic; color: var(--acc-bright); }
.site-footer .footer-tag {
  font-family: 'Poppins', sans-serif; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.18em; color: var(--on-dark-soft); margin-bottom: 14px;
}
.site-footer .footer-grid p { font-size: 12.5px; color: var(--paper-deep); line-height: 1.6; }
.site-footer .footer-col h4 {
  font-family: 'Poppins', sans-serif; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.18em; color: var(--acc-bright); margin-bottom: 14px; font-weight: 500;
}
.site-footer .footer-col ul { list-style: none; margin: 0; padding: 0; }
.site-footer .footer-col li { font-size: 12.5px; color: var(--paper-deep); line-height: 1.85; }
.site-footer .footer-col a { color: var(--paper-deep); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.15s; }
.site-footer .footer-col a:hover { border-color: var(--acc-bright); }
.site-footer .footer-bottom {
  margin-top: 44px; padding-top: 22px; border-top: 1px solid #2D343F;
  font-family: 'Poppins', sans-serif; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.15em; color: var(--on-dark-soft);
  display: flex; justify-content: space-between;
}
.site-footer .footer-bottom a { color: var(--paper-deep); text-decoration: none; }
.site-footer .footer-bottom a:hover { color: var(--acc-bright); }
.site-footer--slim .footer-bottom { margin-top: 0; padding-top: 0; border-top: 0; }
.site-footer .footer-legal {
  margin-top: 44px; padding-top: 22px; border-top: 1px solid #2D343F;
  font-size: 11.5px; color: var(--paper-deep); line-height: 1.7;
}
.site-footer .footer-legal a { color: var(--paper-deep); }
.site-footer .footer-legal + .footer-bottom { margin-top: 12px; padding-top: 0; border-top: 0; }
.site-footer--slim .footer-legal { margin-top: 0; padding-top: 0; border-top: 0; }

@media (max-width: 960px) {
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .site-nav-links { display: none; }
  .site-container { padding: 0 20px; }
  .site-classbar .site-classbar-row { font-size: 9px; }
  .site-footer .footer-grid { grid-template-columns: 1fr; }
}

/* ── Iconography (assets/icons.svg sprite — docs/VISUAL_DESIGN.md) ──
   Stroke styling lives on the sprite's <symbol>s (currentColor at 1.5);
   these classes only size and align. Icons are decorative: pair with
   visible text and mark aria-hidden="true". */
.ic { width: 18px; height: 18px; vertical-align: -3.5px; flex-shrink: 0; }
.ic--sm { width: 14px; height: 14px; vertical-align: -2px; }
.ic--lg { width: 28px; height: 28px; vertical-align: -6px; }
