/* VENDORED COPY — canonical source: asym-intel/asym-intel-commons:fe-commons/chrome.css
 * Synced @ 80e03bbec302e6a1464c53b2c3b503fa438aa3e4 (2026-06-25). Do NOT edit here to change layout/structure —
 * edit the commons canonical and re-sync. Colours are NOT edited here either:
 * this file is palette-agnostic; the Advennt palette is mapped to the --chrome-*
 * hooks in the renderer (_LIVE_PALETTE_OVERRIDE .ai-chrome block). */

/*
 * fe-commons/chrome.css
 * Canonical fleet-wide site-chrome primitive — presentation layer.
 * The universal page shell: top header bar (brand + primary nav + theme/menu
 * toggles + mobile drawer), in-page section subnav, regulatory disclaimer aside,
 * site footer, and the layout-container width wrapper.
 *
 * Authority: AD-2026-06-23-FE-COMMONS-CHROME-PRIMITIVE (operator 2026-06-23
 *            "learn from AIC but parametrise"; Path A approved).
 * Companion: the consumer's header/footer/subnav/disclaimer HTML partials use
 *            the neutral .ai-* class family this file styles.
 * Consumed by: asymmetric-investor-gi (first adopter, 2026-06-23);
 *              artificial-intelligence-gi (AIC) migration tracked as Fleet follow-up
 *              (currently .pub-head/.pub-mast/.pub-nav — unchanged by this file).
 * Generalises to every consumer-surface repo per fe-commons §"Adding a primitive".
 *
 * THEMING CONTRACT — this file is palette-agnostic. Each consumer maps its own
 * tokens via the CSS custom properties below; every hook has a neutral fallback so
 * the chrome renders without any token map (degraded but functional). Do NOT fork
 * this file to change colours — set the variables in the consuming page's own
 * stylesheet (typically on the .ai-chrome scope or :root). Font sizes use the
 * commons --fs-* scale (AD-2026-06-13-FE-COMMONS-TYPE-SCALE).
 *
 *   --chrome-bg          page / header background      (fallback #ffffff)
 *   --chrome-surface     subnav / mobile-drawer bg     (fallback #f5f5f5)
 *   --chrome-line        hairline borders              (fallback #e0e0e0)
 *   --chrome-text        primary text / brand name     (fallback #1a1a1a)
 *   --chrome-text-muted  nav links / meta / footer     (fallback #6b6b6b)
 *   --chrome-accent      brand mark / nav hover / links(fallback #1d3b5e)
 *   --chrome-accent-dim  nav active / hover-deep        (fallback #2a5285)
 *   --chrome-disc-bg     disclaimer aside background   (fallback rgba(0,0,0,.04))
 *   --chrome-disc-line   disclaimer left accent border (fallback var(--chrome-accent))
 *   --chrome-maxw        layout-container max width    (fallback 1100px)
 *   --chrome-pad         layout-container side padding (fallback 24px)
 *   --chrome-z           header z-index base           (fallback 40)
 *
 * Last seeded: 2026-06-23
 */

/* ─────────────────────────── layout container ─────────────────────────── */
.layout-container{
  max-width:var(--chrome-maxw, 1100px);
  margin-inline:auto;
  padding-inline:var(--chrome-pad, 24px);
  width:100%;
}

/* ──────────────────────────────── header ──────────────────────────────── */
.ai-head{
  background:var(--chrome-bg, #ffffff);
  border-bottom:1px solid var(--chrome-line, #e0e0e0);
  position:sticky; top:0;
  z-index:var(--chrome-z, 40);
}
.ai-head__inner{
  display:flex; align-items:center; gap:24px;
  min-height:60px;
  padding-block:10px;
}
.ai-head__brand{
  display:flex; align-items:baseline; gap:8px;
  text-decoration:none; color:inherit;
  margin-right:auto;
}
.ai-head__logo,
.ai-head__logo-mark{
  font-size:var(--fs-h3, 1.25rem);
  color:var(--chrome-accent, #1d3b5e);
  line-height:1;
}
.ai-head__name{
  font-size:var(--fs-lg, 0.9375rem);
  font-weight:700;
  color:var(--chrome-text, #1a1a1a);
  letter-spacing:-0.01em;
  white-space:nowrap;
}
.ai-head__tag{
  font-size:var(--fs-xs, 0.6875rem);
  color:var(--chrome-text-muted, #6b6b6b);
  text-transform:uppercase;
  letter-spacing:0.06em;
  white-space:nowrap;
}
@media (max-width: 720px){ .ai-head__tag{ display:none; } }

.ai-head__nav{
  display:flex; align-items:center; gap:20px;
}
.ai-nav__link{
  font-size:var(--fs-md, 0.8125rem);
  font-weight:500;
  color:var(--chrome-text-muted, #6b6b6b);
  text-decoration:none;
  padding:6px 2px;
  border-bottom:2px solid transparent;
  transition:color .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.ai-nav__link:hover,
.ai-nav__link:focus-visible{
  color:var(--chrome-accent, #1d3b5e);
  border-bottom-color:var(--chrome-accent, #1d3b5e);
}
.ai-nav__link[aria-current="page"],
.ai-nav__link.is-active{
  color:var(--chrome-text, #1a1a1a);
  border-bottom-color:var(--chrome-accent-dim, #2a5285);
}

/* theme + menu toggle buttons */
.ai-head__theme-toggle,
.ai-head__menu-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px;
  padding:0; border:1px solid var(--chrome-line, #e0e0e0);
  border-radius:6px; background:transparent;
  color:var(--chrome-text-muted, #6b6b6b);
  cursor:pointer;
  transition:color .15s ease, border-color .15s ease;
}
.ai-head__theme-toggle:hover,
.ai-head__menu-toggle:hover{
  color:var(--chrome-accent, #1d3b5e);
  border-color:var(--chrome-accent, #1d3b5e);
}
.ai-head__menu-toggle{ display:none; flex-direction:column; gap:4px; }
.ai-head__menu-toggle span{
  display:block; width:16px; height:2px; border-radius:2px;
  background:currentColor;
}

/* mobile nav drawer */
.ai-head__mobile-nav{
  display:none;
  background:var(--chrome-surface, #f5f5f5);
  border-top:1px solid var(--chrome-line, #e0e0e0);
}
.ai-head__mobile-nav[aria-hidden="false"],
.ai-head__mobile-nav.is-open{ display:block; }
.ai-head__mobile-nav nav{
  display:flex; flex-direction:column;
  padding:8px var(--chrome-pad, 24px) 12px;
}
.ai-head__mobile-nav .ai-nav__link{
  padding:10px 0;
  border-bottom:1px solid var(--chrome-line, #e0e0e0);
}
.ai-head__mobile-nav .ai-nav__link:last-child{ border-bottom:none; }

@media (max-width: 860px){
  .ai-head__nav{ display:none; }
  .ai-head__menu-toggle{ display:inline-flex; }
}

/* ──────────────────────────────── subnav ──────────────────────────────── */
.ai-subnav{
  background:var(--chrome-surface, #f5f5f5);
  border-bottom:1px solid var(--chrome-line, #e0e0e0);
  position:sticky; top:60px;
  z-index:calc(var(--chrome-z, 40) - 1);
}
.ai-subnav__inner{
  display:flex; align-items:center; gap:14px;
  min-height:40px; padding-block:6px;
  overflow-x:auto;
}
.ai-subnav__label{
  font-size:var(--fs-xs, 0.6875rem);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--chrome-text-muted, #6b6b6b);
  white-space:nowrap;
}
.ai-subnav__links{ display:flex; align-items:center; gap:14px; }
.ai-subnav__link{
  font-size:var(--fs-sm, 0.75rem);
  color:var(--chrome-text-muted, #6b6b6b);
  text-decoration:none;
  white-space:nowrap;
  padding:4px 0;
  border-bottom:2px solid transparent;
  transition:color .15s ease, border-color .15s ease;
}
.ai-subnav__link:hover,
.ai-subnav__link:focus-visible,
.ai-subnav__link.is-active{
  color:var(--chrome-accent, #1d3b5e);
  border-bottom-color:var(--chrome-accent, #1d3b5e);
}

/* ───────────────────────────── disclaimer ─────────────────────────────── */
.ai-disclaimer{
  background:var(--chrome-disc-bg, rgba(0,0,0,.04));
  border-left:3px solid var(--chrome-disc-line, var(--chrome-accent, #1d3b5e));
  border-radius:0 6px 6px 0;
  padding:14px 18px;
  margin:24px 0;
}
.ai-disclaimer__text{
  font-size:var(--fs-sm, 0.75rem);
  line-height:1.55;
  color:var(--chrome-text-muted, #6b6b6b);
  margin:0;
}

/* inline source-citation anchor */
.ai-source-link{
  font-size:var(--fs-xs, 0.6875rem);
  color:var(--chrome-accent, #1d3b5e);
  text-decoration:none;
  border-bottom:1px dotted currentColor;
  white-space:nowrap;
}
.ai-source-link:hover,
.ai-source-link:focus-visible{ color:var(--chrome-accent-dim, #2a5285); }

/* ──────────────────────────────── footer ──────────────────────────────── */
.ai-foot{
  background:var(--chrome-surface, #f5f5f5);
  border-top:1px solid var(--chrome-line, #e0e0e0);
  margin-top:48px;
  padding-block:28px;
}
.ai-foot__inner{
  display:flex; flex-direction:column; gap:12px;
}
.ai-foot__brand{
  display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
}
.ai-foot__name{
  font-size:var(--fs-base, 0.875rem);
  font-weight:700;
  color:var(--chrome-text, #1a1a1a);
}
.ai-foot__sep{ color:var(--chrome-text-muted, #6b6b6b); }
.ai-foot__domain{
  font-size:var(--fs-sm, 0.75rem);
  color:var(--chrome-text-muted, #6b6b6b);
}
.ai-foot__nav{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
.ai-foot__nav a{
  font-size:var(--fs-sm, 0.75rem);
  color:var(--chrome-text-muted, #6b6b6b);
  text-decoration:none;
}
.ai-foot__nav a:hover,
.ai-foot__nav a:focus-visible{ color:var(--chrome-accent, #1d3b5e); }
.ai-foot__legal{
  font-size:var(--fs-xs, 0.6875rem);
  line-height:1.55;
  color:var(--chrome-text-muted, #6b6b6b);
  margin:0;
  max-width:78ch;
}
.ai-foot__legal a{ color:var(--chrome-accent, #1d3b5e); text-decoration:none; }
.ai-foot__legal a:hover{ text-decoration:underline; }
