/* Hoisted from the design's inline styles. Declarations are copied
   verbatim; only the :hover rules are new, because the export's
   `style-hover` attribute has no inline equivalent. */

/* --- design base (from the export's <helmet>) --- */


/* STRUCTURE MOVED to `src/styles/foundation/nav.css` (2026-09-03) — the header
   bar, its inner row, the logo, the nav and the actions group are now the shared
   `.site-header*` classes, which SiteHeader.tsx carries alongside these.
   Removed from here: .sf-header-3 (row: 1200px/24px/72px flex), .sf-header-4 and
   -5 (logo), .sf-header-6 (nav), and the position/z-index half of .sf-header-2.
   The foundation reproduces each measurement in rem; the one deliberate change
   is the nav gap, which snaps from 40px onto --space-5 (32px).

   What stays here is BRANDING: the bar's white ground and shadow, link and
   badge colour, the CTA gradient, the type family. */

/* --- element rules --- */
.sf-header-1 { font-family:'Poppins',sans-serif; }
.sf-header-2 { background:#fff;box-shadow:0 5px 20px 0 rgba(0,0,0,.08); }
.sf-header-8 { position:relative;z-index:1;padding:5px 14px;border-radius: var(--r-lg);color:#fff;font-weight:400;font-size:var(--text-sm);font-family:'Poppins';line-height:normal;text-decoration:none;background:linear-gradient(135deg,#5479FF 0%,#51C5FF 100%); }
.sf-header-9 { display:flex;align-items:center;gap:24px;flex-shrink:0; }
.sf-header-14 { font-weight:400;font-size:var(--text-sm);font-family:'Poppins';line-height:normal; }
.sf-header-15 { margin-left:4px; }
.sf-header-16 { display:inline-flex;align-items:center;text-decoration:none; }
.sf-header-17 { width:34px;height:23px;object-fit:cover;border-radius: var(--r-xs);display:block; }

/* --- white links keep their colour on hover (see the port pipeline) --- */
.sf-header-8:hover { color: #fff; }

/* The <ul> reset that lived here is the foundation's `.site-header__nav ul`. It
   had to go: it also fixed `display:flex` horizontally, which would have beaten
   the mobile panel's `flex-direction: column`. */
.sf-header-2 .sf-header-6 a { text-decoration: none; font-weight:400;font-size:var(--text-sm);font-family:'Poppins';line-height:normal; color: var(--ink-600); }
.sf-header-2 .sf-header-6 a:hover,
.sf-header-2 .sf-header-6 a[aria-current="page"] { color: var(--color-primary); }

/* The open phone menu's rows: body ink at a readable size; the current page
   keeps its purple (the rule above outranks this one). */
@media (max-width: 1024px) {
  .sf-header-2 .sf-header-6 a { font-size: 1rem; font-weight: 500; color: var(--color-text); }
}