/* ============================================================
   AEQUARA · aeq-chrome.css — the ONE static-site chrome module
   2026-06-10 · chrome-unification (judge findings DC-3/DC-4/
   CV-03/CV-07/A11Y-06)
   ------------------------------------------------------------
   Canonical header + footer for every static HTML page under
   public/. Mirrors the React stack exactly:
     · nav    = /platform pf-nav lockup (circled-A mark + Fraunces
                wordmark) with links Decide · Tools · Trust ·
                Pricing · Platform and ONE persistent CTA
                "Try a tool free →" → /tools-v2
     · footer = static twin of app/_components/SiteFooter.tsx
                (same sf- classes, same 5-column IA, same blurb),
                light bone ground.
   Plain <nav aria-label="Main"> with plain links — no
   role=tablist/tab (A11Y-06). Current page gets
   aria-current="page" + bronze-deep underline.

   Self-contained: every var() carries a literal fallback so the
   module renders identically on token-less pages (merch). Ink
   text colours are LITERALS (not var(--aeq-fg)) so no legacy
   dark-ground token re-flip can invert them.
   ============================================================ */

/* ============== NAV ============== */
.aeq-nav {
  position: sticky; top: 0; z-index: 60;
  background: rgba(248,244,234,.88);
  backdrop-filter: saturate(140%) blur(14px);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid rgba(14,17,22,.12);
  font-family: var(--aeq-sans, 'Geist', "Helvetica Neue", system-ui, sans-serif);
}
.aeq-nav-inner {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  max-width: 1180px; margin: 0 auto; padding: 13px 24px;
}
.aeq-nav-brand { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; border: none; }
.aeq-nav-brand:hover { border: none; }
.aeq-nav-name {
  font-family: var(--aeq-serif, 'Fraunces', Georgia, serif);
  font-weight: 400; font-size: 18px; letter-spacing: .02em;
  color: #0E1116;
}
.aeq-nav-links { display: inline-flex; align-items: center; gap: 4px; }
.aeq-nav-links a {
  font-size: 14px; color: #1A1F26; text-decoration: none; border: none;
  padding: 7px 13px; border-radius: 8px;
  transition: background .15s ease, color .15s ease;
}
.aeq-nav-links a:hover { background: rgba(14,17,22,.04); color: #0E1116; border: none; }
.aeq-nav-links a[aria-current="page"] {
  color: #0E1116;
  text-decoration: underline;
  text-decoration-color: var(--aeq-bronze-deep, #6B5530);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}
.aeq-nav-links a.aeq-nav-cta {
  font-size: 13.5px; font-weight: 500;
  color: #F5F2EB; background: #0E1116;
  padding: 8px 16px; border-radius: 9px;
  white-space: nowrap; margin-left: 8px;
  text-decoration: none;
  transition: opacity .15s ease;
}
.aeq-nav-links a.aeq-nav-cta:hover { opacity: .85; background: #0E1116; color: #F5F2EB; }
@media (max-width: 759px) {
  .aeq-nav-links a:not(.aeq-nav-cta) { display: none; }
}

/* ============== SUBSCRIBE BAND (pre-footer; preserves the wired
   quarterly-publication form lifted out of the legacy dark footers;
   the #newsletter anchor target lives here) ============== */
.aeq-subscribe-band {
  background: var(--aeq-bone-deep, #EAE6DC);
  border-top: 1px solid rgba(14,17,22,.12);
  border-bottom: none;
  padding: 48px 24px;
  margin-top: 100px;
}
.aeq-subscribe-inner {
  max-width: 1180px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center;
  scroll-margin-top: 80px;
}
@media (max-width: 760px) { .aeq-subscribe-inner { grid-template-columns: 1fr; } }
.aeq-subscribe-eyebrow {
  font-family: var(--aeq-mono, 'Geist Mono', ui-monospace, monospace);
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--aeq-bronze-deep, #6B5530);
}
.aeq-subscribe-title {
  font-family: var(--aeq-serif, 'Fraunces', Georgia, serif);
  font-size: 22px; color: #0E1116; margin-top: 4px;
}
.aeq-subscribe-sub {
  font-family: var(--aeq-sans, 'Geist', system-ui, sans-serif);
  font-size: 12.5px; color: #1A1F26; max-width: 40ch; margin-top: 8px;
}
/* Light-ground re-skin of the legacy dark-footer newsletter form */
.aeq-subscribe-band .newsletter { display: flex; flex-direction: column; gap: 10px; max-width: 520px; }
.aeq-subscribe-band .newsletter-form {
  background: #FFFFFF; border: 1px solid rgba(14,17,22,.16);
  display: flex; gap: 8px; align-items: center;
  border-radius: var(--aeq-radius-pill, 999px);
  padding: 4px 4px 4px 20px;
}
.aeq-subscribe-band .newsletter-form:focus-within {
  border-color: var(--aeq-bronze, #8B6F3F);
  box-shadow: 0 0 0 3px rgba(139,111,63,.18);
}
.aeq-subscribe-band .newsletter-form input {
  flex: 1; border: none; background: transparent; outline: none;
  font-family: var(--aeq-sans, 'Geist', system-ui, sans-serif);
  font-size: 14px; color: #0E1116; padding: 8px 0;
}
.aeq-subscribe-band .newsletter-form input::placeholder { color: rgba(14,17,22,.45); }
.aeq-subscribe-band .newsletter-form button {
  font-family: var(--aeq-sans, 'Geist', system-ui, sans-serif);
  font-size: 13px; font-weight: 600;
  padding: 10px 18px; border-radius: var(--aeq-radius-pill, 999px);
  background: #0E1116; color: #F5F2EB;
  border: none; cursor: pointer; white-space: nowrap;
  transition: opacity .15s ease;
}
.aeq-subscribe-band .newsletter-form button:hover { opacity: .85; background: #0E1116; }
.aeq-subscribe-band .newsletter-meta {
  font-family: var(--aeq-sans, 'Geist', system-ui, sans-serif);
  font-size: 11px; color: #3A4049; letter-spacing: .02em;
}

/* ============== FOOTER — static twin of SiteFooter.tsx ============== */
.sf-foot {
  margin-top: 0; padding: 64px 24px 40px;
  border-top: 1px solid rgba(14,17,22,.12);
  background: var(--aeq-bg, #F5F2EB);
  color: #0E1116; text-align: left;
  font-family: var(--aeq-sans, 'Geist', "Helvetica Neue", system-ui, sans-serif);
}
/* Pages without a subscribe band keep the component's 100px breathing room */
:not(.aeq-subscribe-band) + .sf-foot { margin-top: 100px; }
.aeq-subscribe-band + .sf-foot { border-top: none; margin-top: 0; }
.sf-grid { display: grid; grid-template-columns: 1fr; gap: 36px 28px; max-width: 1180px; margin: 0 auto; }
@media (min-width: 640px) { .sf-grid { grid-template-columns: 1.4fr 1fr 1fr; } }
@media (min-width: 1000px) { .sf-grid { grid-template-columns: 1.5fr repeat(5, 1fr); } }
.sf-brand-mark { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.sf-brand-name { font-family: var(--aeq-serif, 'Fraunces', Georgia, serif); font-weight: 400; font-size: 17px; letter-spacing: .02em; color: #0E1116; }
.sf-blurb { margin: 0 0 16px; font-size: 13px; line-height: 1.55; color: #3A4049; max-width: 34ch; }
.sf-bridge { margin: 0; font-size: 12px; line-height: 1.5; color: #1A1F26; }
.sf-bridge em { font-style: italic; color: var(--aeq-bronze-deep, #6B5530); }
.sf-col-h { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #1A1F26; margin-bottom: 11px; }
.sf-col a { display: block; font-size: 13px; color: #3A4049; text-decoration: none; border: none; padding: 3px 0; transition: color .15s ease; }
.sf-col a:hover { color: var(--aeq-bronze, #8B6F3F); border: none; }
.sf-col a[aria-current="page"] {
  color: #0E1116;
  text-decoration: underline;
  text-decoration-color: var(--aeq-bronze-deep, #6B5530);
  text-underline-offset: 4px;
}
.sf-legal {
  max-width: 1180px; margin: 40px auto 0; padding-top: 18px;
  border-top: 1px solid rgba(14,17,22,.12);
  font-size: 12px; color: #3A4049;
  display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between;
}
.sf-legal-sign { letter-spacing: .04em; }
