/* ============================================================================
   Sherpa marketing site — shared design tokens (V2: green / charcoal)
   ----------------------------------------------------------------------------
   Single source of truth for the public site palette. Each page links this
   BEFORE its inline <style>; pages reference tokens via var(--…) only — they no
   longer carry their own :root block.

   Values mirror the app design system (lib/design-system/tokens.ts, ships in
   evident-ma-frontend #223/#224). The teal-on-white ban is structural:
     • peak   #19FADA — electric teal, FILL/STROKE ON CHARCOAL ONLY, never text.
                        Introduced surgically on dark surfaces in later batches,
                        deliberately NOT a base token here.
     • ink    #0B6B5E — the ONLY brand teal allowed as TEXT / thin mark on light.

   Token NAMES are kept from V1 (--navy, --blue, …) so the ~258 existing var()
   call-sites flip centrally without renaming. Names are now historical; the
   VALUES are V2. Font swap (DM Sans → IBM Plex Sans) is a separate batch.
   ============================================================================ */
:root{
  --navy:#1D1F21;   /* charcoal — dark chrome (dark sections/footer) + dark text */
  --blue:#0B6B5E;   /* brand ink — teal, legible as text & CTA fill on light */
  --blue2:#0B6B5E;  /* brand ink — em highlights / hover */
  --ice:#38C6B2;    /* trail teal — light accent on charcoal surfaces only */
  --white:#FFFFFF;
  --off:#F4F5F7;    /* neutral canvas — light work surface */
  --rule:#E0E1E3;   /* hairline border */
  --muted:#5A5C5E;  /* charcoal-gray — secondary text on light */
  --text:#1D1F21;   /* body ink */
  --green:#1A6F37;  /* BRAG success text (AA on light) */

  /* peak — electric teal. FILL ON CHARCOAL ONLY (CTA / dark chrome), carries
     charcoal text, never white, never text-on-light. Introduced with the header
     batch; the charcoal nav bar is its first legit surface. */
  --peak:#19FADA;
  --peak-hover:#3FF5DE;  /* brighter peak on hover */
  --peak-text:#1D1F21;   /* charcoal — the ONLY text/icon color on a peak fill */

  --sans:'DM Sans',sans-serif;  /* font swap deferred to the fonts batch */
}

/* ============================================================================
   SITE HEADER — shared, one source of truth. The SAME full <nav> (logo lockup +
   PLATFORM / WHO IT'S FOR / PRICING / INVESTORS / CONTACT + teal GET STARTED) is
   used on home + pricing + investors + investors/capital — links are absolute so
   the identical markup works from any page. The investor funnel pages (nda /
   request-access / thank-you) intentionally keep a minimal .brand-header (logo +
   breadcrumb) to stay focused. Nav CSS lived inline in index.html; centralized
   here so the nav can't drift from the logo again.
   ============================================================================ */
/* Logo lockup — shared by the full nav and the minimal brand-header */
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.nav-attr{font-family:var(--sans);font-size:.62rem;font-weight:400;letter-spacing:.5px;white-space:nowrap;color:rgba(255,255,255,0.55)}
@media(max-width:440px){.nav-attr{display:none}}
.brand-logo{display:block;height:32px;width:auto}

/* Full nav — fixed charcoal bar (home + content sub-pages) */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;height:64px;background:rgba(29,31,33,0.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,0.10)}
.nav-links{display:flex;align-items:center;gap:2rem}
.nav-links a{font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,0.75);text-decoration:none;transition:color .2s;padding-bottom:4px;border-bottom:2px solid transparent}
.nav-links a:hover{color:#fff}
.nav-links a[aria-current="page"]{color:#fff;border-bottom-color:var(--peak)}
.nav-cta,.nav-links a.nav-cta{padding:.55rem 1.4rem;background:var(--peak);color:var(--peak-text)!important;font-size:.75rem;font-weight:600;letter-spacing:1px;text-transform:uppercase;text-decoration:none;border:1px solid transparent;transition:background .2s}
.nav-cta:hover,.nav-links a.nav-cta:hover{background:var(--peak-hover);color:var(--peak-text)!important}
@media(max-width:760px){.nav-links{display:none}}
/* content sub-pages adopting the fixed nav must clear its 64px height */
body.subpage-nav{padding-top:64px}

/* Minimal brand-header — investor funnel pages only (nda / request-access / thank-you) */
.brand-header{background:var(--navy);padding:1.2rem 2.5rem;border-bottom:1px solid rgba(255,255,255,.10)}
.logo-wrap{max-width:1100px;margin:auto;display:flex;align-items:center;justify-content:space-between}
.back-link{font-size:.72rem;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.55);text-decoration:none;transition:color .2s;font-family:var(--sans)}
.back-link:hover{color:#fff}
