/* public/vg/site-chrome.css · UI-C2 R1.2 (25 Oct 2026). The Fultz Visibility WEBSITE header (with the Our Services flyout) and footer
   NAV-1 R13 (30 Oct 2026): phone-menu switch 1280 → 1180px, with a COMPACT DESKTOP tier for 1181–1360px (tighter spacing,
   18px wordmark, 14px links; measured in tests/browser/header-width-measure.html) so the full navigation shows at a
   normal 1280px window. Above 1360px the original spacing is unchanged. Menu closing on crossing 1180px: site-chrome.js.
   on the customer workshop pages (register, pay, ticket). EVERY selector begins with .fvsite-scope, the class on the <header> and
   <footer> only, so nothing here can restyle checkout, payment or ticket content. Only rules for classes actually present in that
   header/footer markup (or added by site-chrome.js) are kept. Sources: website-next tokens, the portal's main-site header section and
   website-next responsive.css (build 1.0.0-4f3c846d). Checked by tests/css-check.js.
   R1.4: desktop/phone-menu switch MEASURED at 1280px (tests/browser/header-fit.html): this header's desktop items need ~1240px of
   viewport, so at the website's 1120px value 'Start an Assessment' was clipped between 1121 and ~1239px. Menu closing on crossing
   1280px is in site-chrome.js. */
.fvsite-scope { --border-subtle: var(--neutral-200); --container-wide: 1360px; --font-brand: 'Jost', 'Century Gothic', system-ui, sans-serif; --weight-light: 300; --navy-900: #131b32; --accent: var(--cyan-400); --weight-regular: 400; --font-body: 'Source Sans 3', system-ui, -apple-system, sans-serif; --text-secondary: var(--neutral-600); --radius-button: var(--radius-sm); --weight-semibold: 600; --text-sm: 0.875rem; --action-text: var(--white); --action: var(--blue-600); --radius-md: 10px; --shadow-lg: 0 12px 28px rgba(19, 27, 50, 0.10), 0 4px 8px rgba(19, 27, 50, 0.05); --white: #ffffff; --border-inverse: rgba(255, 255, 255, 0.14); --text-on-inverse-muted: #aebbd1; --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', monospace; --cyan-400: #44cbfa; --neutral-500: #6c7d97; --neutral-600: #4f6079; --blue-600: #1763c0; --neutral-200: #e0e7f1; --radius-sm: 6px; --neutral-100: #eef2f8; --radius-lg: 14px; --neutral-50: #f6f9fc; --font-heading: 'Archivo', system-ui, sans-serif; --text-link: var(--action, var(--navy-700, #1f3a64)); font-family: var(--font-body); color: var(--text-primary, var(--navy-900)); line-height: 1.5; -webkit-font-smoothing: antialiased; }
.fvsite-scope *, .fvsite-scope *::before, .fvsite-scope *::after { box-sizing: border-box; }
.fvsite-scope a { color: inherit; }
.fvsite-scope { --navy-900:#131b32;--white:#ffffff;--container-wide:1360px;--border-inverse:rgba(255, 255, 255, 0.14);--font-brand:'Jost', 'Century Gothic', system-ui, sans-serif;--weight-light:300;--accent:var(--cyan-400);--cyan-400:#44cbfa;--weight-regular:400;--font-body:'Source Sans 3', system-ui, -apple-system, sans-serif;--text-on-inverse-muted:#aebbd1;--font-mono:'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;--neutral-500:#6c7d97;--blue-600:#1763c0;--neutral-200:#e0e7f1;--neutral-600:#4f6079;--radius-sm:6px;--neutral-100:#eef2f8;--text-secondary:var(--neutral-600);--action:var(--blue-600);--border-subtle:var(--neutral-200);--radius-lg:14px;--shadow-lg:0 12px 28px rgba(19, 27, 50, 0.10), 0 4px 8px rgba(19, 27, 50, 0.05);--radius-md:10px;--neutral-50:#f6f9fc;--font-heading:'Archivo', system-ui, sans-serif;--radius-button:var(--radius-sm);--weight-semibold:600;--text-sm:0.875rem;--action-text:var(--white) }
.fvsite-scope .fvn-ghost:hover { color: var(--navy-900) !important; background: var(--neutral-100); }
.fvsite-scope .site-nav-mobile { display: none; }
@media (max-width: 1180px) {
  .fvsite-scope .site-nav-desktop { display: none !important; }
  .fvsite-scope .site-nav-mobile { display: inline-flex !important; }
}
.fvsite-scope .fvhwh { position: relative; }
.fvsite-scope .fvhwh > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-body); font-size: 15px; font-weight: 500; color: var(--text-secondary); padding: 6px 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.fvsite-scope .fvhwh > summary::-webkit-details-marker { display: none; }
.fvsite-scope .fvhwh > summary:hover { color: var(--navy-900); }
.fvsite-scope .fvhwh > summary:focus-visible { outline: 2px solid var(--action); outline-offset: 4px; border-radius: 3px; }
.fvsite-scope .fvhwh[data-current] > summary { color: var(--navy-900); font-weight: 600; border-bottom-color: var(--cyan-400); }
.fvsite-scope .fvhwh-chev { transition: transform 150ms ease; }
.fvsite-scope .fvhwh[open] .fvhwh-chev { transform: rotate(180deg); }
.fvsite-scope .fvsm-panel { position: absolute; top: calc(100% + 14px); left: 0; z-index: 200; box-sizing: border-box; width: 326px; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.fvsite-scope .fvsm-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.fvsite-scope .fvsm-item { position: relative; }
.fvsite-scope .fvsm-card { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid var(--border-subtle); border-radius: var(--radius-md); background: var(--neutral-50); text-decoration: none; }
.fvsite-scope .fvsm-card:hover, .fvsite-scope .fvsm-item:hover > .fvsm-card, .fvsite-scope .fvsm-item:focus-within > .fvsm-card { border-color: var(--cyan-400); background: #fff; }
.fvsite-scope .fvsm-card:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; }
.fvsite-scope .fvsm-card-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fvsite-scope .fvsm-card-t { font-family: var(--font-heading); font-weight: 600; font-size: 14.5px; color: var(--navy-900); }
.fvsite-scope .fvsm-card-d { font-family: var(--font-body); font-size: 12px; line-height: 1.4; color: var(--text-secondary); }
.fvsite-scope .fvsm-card-arw { flex: none; margin-left: auto; padding-top: 2px; color: var(--blue-600); display: inline-flex; }
.fvsite-scope .fvsm-fly { position: absolute; top: -13px; left: 100%; z-index: 210; display: none; padding-left: 9px; }
.fvsite-scope .fvsm-item:hover > .fvsm-fly, .fvsite-scope .fvsm-item:focus-within > .fvsm-fly, .fvsite-scope .fvsm-cat:hover > .fvsm-fly, .fvsite-scope .fvsm-cat:focus-within > .fvsm-fly, .fvsite-scope .fvsm-cat[data-open] > .fvsm-fly { display: block; }
.fvsite-scope .fvsm-fly-box { box-sizing: border-box; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: 12px; }
.fvsite-scope .fvsm-l2 > .fvsm-fly-box { width: 288px; }
.fvsite-scope .fvsm-l3 > .fvsm-fly-box { width: 266px; max-height: calc(100vh - 120px); overflow-y: auto; overscroll-behavior: contain; }
.fvsite-scope .fvsm-fly-head { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--blue-600); padding: 2px 10px 8px; }
.fvsite-scope .fvsm-cat { position: relative; }
.fvsite-scope .fvsm-cat-btn { display: flex; width: 100%; align-items: center; gap: 8px; padding: 9px 10px; border: 0; border-radius: var(--radius-md); background: transparent; text-align: left; cursor: pointer; font-family: var(--font-body); font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--navy-900); }
.fvsite-scope .fvsm-cat:hover > .fvsm-cat-btn, .fvsite-scope .fvsm-cat[data-open] > .fvsm-cat-btn { background: var(--neutral-50); color: var(--action); }
.fvsite-scope .fvsm-cat-btn:focus-visible { outline: 2px solid var(--action); outline-offset: -2px; }
.fvsite-scope .fvsm-cat-btn > span { flex: 1 1 auto; min-width: 0; }
.fvsite-scope .fvsm-cat-btn > svg { flex: none; color: var(--blue-600); }
.fvsite-scope .fvsm-svc { display: block; padding: 8px 10px; border-radius: var(--radius-md); font-family: var(--font-body); font-size: 13.5px; line-height: 1.35; color: var(--text-secondary); text-decoration: none; }
.fvsite-scope .fvsm-svc:hover { background: var(--neutral-50); color: var(--action); }
.fvsite-scope .fvsm-svc:focus-visible { outline: 2px solid var(--action); outline-offset: -2px; }
.fvsite-scope .fvsm-item[data-flip] > .fvsm-fly, .fvsite-scope .fvsm-cat[data-flip] > .fvsm-fly { left: auto; right: 100%; padding-left: 0; padding-right: 9px; }
.fvsite-scope .fvhwh-m > summary, .fvsite-scope .fvhwh-m-cl > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-family: var(--font-body); color: var(--text-secondary); }
.fvsite-scope .fvhwh-m > summary { font-size: 15px; font-weight: 500; padding: 9px 2px; }
.fvsite-scope .fvhwh-m > summary::-webkit-details-marker, .fvsite-scope .fvhwh-m-cl > summary::-webkit-details-marker { display: none; }
.fvsite-scope .fvhwh-m > summary:focus-visible, .fvsite-scope .fvhwh-m-cl > summary:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; border-radius: 3px; }
.fvsite-scope .fvhwh-m[open] > summary .fvhwh-chev, .fvsite-scope .fvhwh-m-cl[open] > summary .fvhwh-chev { transform: rotate(180deg); }
.fvsite-scope .fvhwh-m-body { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 8px 10px; margin: 0 0 2px 2px; border-left: 2px solid var(--border-subtle); }
.fvsite-scope .fvhwh-m-overview { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--blue-600); text-decoration: none; padding: 8px 2px; }
.fvsite-scope .fvhwh-m-cl > summary { font-size: 13.5px; font-weight: 600; color: var(--navy-900); padding: 8px 2px; }
.fvsite-scope .fvhwh-m-cl-body { display: flex; flex-direction: column; gap: 1px; padding: 2px 0 6px 10px; border-left: 1px solid var(--border-subtle); }
.fvsite-scope .fvhwh-m-svc { font-family: var(--font-body); font-size: 13.5px; line-height: 1.35; color: var(--text-secondary); text-decoration: none; padding: 6px 2px; }
.fvsite-scope .fvhwh-m-orient { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--text-secondary); text-decoration: none; padding: 8px 2px; }
.fvsite-scope .fvhwh-m-hwh > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--navy-900); padding: 8px 2px; }
.fvsite-scope .fvhwh-m-hwh > summary::-webkit-details-marker { display: none; }
.fvsite-scope .fvhwh-m-hwh > summary:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; border-radius: 3px; }
.fvsite-scope .fvhwh-m-hwh[open] > summary .fvhwh-chev { transform: rotate(180deg); }
.fvsite-scope .fvhwh-m-hwh-body { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 6px 10px; margin-left: 2px; border-left: 2px solid var(--border-subtle); }
@media(max-width:1180px) {
  .fvsite-scope .site-nav-desktop { display:none !important; }
  .fvsite-scope .site-nav-mobile { display:inline-flex !important; }
}
@media (max-width:900px) {
  .fvsite-scope .r-footer { grid-template-columns:1fr 1fr !important; }
}
@media (max-width:620px) {
  .fvsite-scope .r-footer { grid-template-columns:1fr !important;gap:30px !important; }
}
@media (max-width: 900px) {
  .fvsite-scope .r-footer { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 620px) {
  .fvsite-scope .r-footer { grid-template-columns: 1fr !important; gap: 30px !important; }
}
@media print {
  .fvsite-scope { display: none !important; }
}

/* NAV-1 R13 · compact desktop tier (1181–1360px). Inline header styles need !important. Header only; footer untouched. */
@media (min-width: 1181px) and (max-width: 1360px) {
  header.fvsite-scope > div { padding: 0 20px !important; gap: 12px !important; }
  header.fvsite-scope > div > a:first-child { gap: 8px !important; }
  header.fvsite-scope > div > a:first-child > span[style*="font-size:20px"] { font-size: 18px !important; letter-spacing: 0.14em !important; }
  header.fvsite-scope nav.site-nav-desktop { gap: 13px !important; }
  header.fvsite-scope nav.site-nav-desktop > a, header.fvsite-scope nav.site-nav-desktop .fvhwh > summary { font-size: 14px !important; }
  header.fvsite-scope div.site-nav-desktop { padding-left: 10px !important; margin-left: 2px !important; }
  header.fvsite-scope div.site-nav-desktop > .fvn-ghost { padding-left: 6px !important; padding-right: 6px !important; }
}