/* chrome.css: loaded LAST on every page, after the page's own CSS (as in the prototype, where the BD CANON block closed each
   page <style> and site-chrome.css was linked after it). Holds the BD CANON block and the header and footer rules. */

/* ===== BD CANON (canonical; superset of the prototype's variants: Home and Contact plus the pillar link rules) ===== */
:root {
  --ease-smooth: cubic-bezier(.22,.61,.36,1);

  /* MASTER WIDTH: every section's content column on desktop. Change these two numbers to widen or narrow the whole site. */
  --gutter: 24px;
  --wrap: min(1440px, 100%) !important;
  --wrap-wide: min(1600px, 100%) !important;

  /* spacing scale: every padding, margin and gap comes from here */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-6: 24px; --s-8: 32px;
  --s-10: 40px; --s-12: 48px; --s-16: 64px; --s-20: 80px; --s-24: 96px;
  --s-28: 112px; --s-32: 128px; --s-42: 168px;

  /* band heights: S connective, M standard, L the one moment that breathes */
  --band-s: 48px; --band-m: 72px; --band-l: 96px;

  /* type scale */
  --t-display: clamp(3rem, 1.5rem + 5.2vw, 5.25rem);
  --t-h1: clamp(2.25rem, 1.5rem + 2.6vw, 3.375rem);
  --t-h2: clamp(1.75rem, 1.3rem + 1.5vw, 2.5rem);
  --t-h3: clamp(1.375rem, 1.25rem + 0.5vw, 1.625rem);
  --t-card: 1.25rem;
  --t-lede: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  --t-body: 1.0625rem;
  --t-small: 0.875rem;
  --t-kicker: 0.75rem;

  /* radii: a token cannot be a range */
  --r-card-lg: 16px;

  /* --sky-on-light: derived from --sky (logo blue) in oklch, darkened to clear 4.5:1 on white and on --paper.
     Use for logo-blue accent text/links on LIGHT surfaces. On navy/ink keep --sky itself (8.6:1). */
  --sky-on-light: oklch(0.53 0.115 213); /* = #007c93 · 4.88:1 on white, 4.65:1 on --paper */

  /* --brick #B0503F is a SCOPED EXCEPTION: HVAC pillar page only. Not a per-vertical system. Do not extend. */
}
@media (min-width: 835px) { :root { --gutter: 40px; --band-s: 56px; --band-m: 88px; --band-l: 128px; } }
@media (min-width: 1281px) { :root { --gutter: 64px; --band-s: 72px; --band-m: 112px; --band-l: 168px; } }

.wrap, .wrap-wide { padding-left: var(--gutter) !important; padding-right: var(--gutter) !important; }

/* band rhythm utilities */
.bd-band-s { padding-top: var(--band-s) !important; padding-bottom: var(--band-s) !important; }
.bd-band-m { padding-top: var(--band-m) !important; padding-bottom: var(--band-m) !important; }
.bd-band-l { padding-top: var(--band-l) !important; padding-bottom: var(--band-l) !important; }

/* ---- type system: one scale, tightening tracking as size grows ---- */
h1 { font-family: var(--f-head); font-size: var(--t-h1) !important; font-weight: 600 !important; line-height: 1.06 !important; letter-spacing: -.03em !important; text-wrap: balance; }
/* h2 is container-aware: the display step applies at full width, and steps down inside narrow
   grid columns so a heading never breaks to 4-5 characters per line. */
.bd-about2-content, .bd-team-text, .bd-story-content, .bd-pm-col, .bd-pm-def, .bd-why-grid > div,
.bd-pm-free-grid > div, .bd-both-sides > div, .bd-split > div, .bd-contact-grid > div,
.bd-hero-t2 .bd-hero2-in, .bd-listing-layout > div, .bd-val-grid > div, .bd-agent-layout > div { container-type: inline-size; }
h2 { font-family: var(--f-head); font-weight: 600 !important; line-height: 1.10 !important; letter-spacing: -.025em !important; text-wrap: balance; }
.section-head > h2, .ins-wrap > h2, .rail-head h2, .bd-hero2-in h2, section > .wrap > h2, section > .wrap-wide > h2, .bd-pm-col > h2, .bd-pm-col > .section-head > h2 {
  font-size: min(var(--t-h2), calc(7cqw + 0.5rem)) !important; max-width: 26ch;
}
@supports not (container-type: inline-size) {
  .section-head > h2, .ins-wrap > h2, .rail-head h2, .bd-hero2-in h2, section > .wrap > h2, section > .wrap-wide > h2, .bd-pm-col > h2, .bd-pm-col > .section-head > h2 { font-size: var(--t-h2) !important; }
}
h3 { font-family: var(--f-head); font-weight: 600; line-height: 1.25; letter-spacing: -.015em; }
.lede { font-size: var(--t-lede) !important; font-weight: 400; line-height: 1.5 !important; letter-spacing: 0 !important; max-width: 62ch; }
.bd-pm-card-title, .bd-listing-card-title, a h2, a h3, .bd-results h2, .bd-similar h2, .bd-lead-grid h2, .bd-team-grid h2 { font-size: var(--t-card) !important; font-weight: 600 !important; line-height: 1.30 !important; letter-spacing: -.01em !important; max-width: 34ch; }
.bd-hero2-in h1, .hero h1 { max-width: 20ch; }
/* vertical rhythm inside a heading block: never equal gaps */
.bd-hero2-eyebrow, .kicker, .au-kicker { margin-bottom: var(--s-4) !important; }
.section-head h2 { margin-bottom: var(--s-6); }
.section-head.center h2, .section-head.center p, .section-head[style*="center"] h2, .section-head[style*="center"] p, [style*="text-align:center"] > h2, .bd-hero2-in h2 { margin-left: auto !important; margin-right: auto !important; }
/* kicker: diamond stays (it is the brand), colour recedes behind the head */
.kicker, .au-kicker { font-size: var(--t-kicker) !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: .14em !important; color: var(--sky-deep) !important; }
.on-dark .kicker, .bd-hero2 .kicker { color: var(--sky) !important; }
/* running copy is --text; --text-light is metadata only */
.lede, .hero p, .ins-hero .sub, .au-bio p, .ins-lead p { color: var(--text); }
.on-dark .lede, .bd-hero2 .lede, .hero p { color: var(--text-on-dark); }
/* figures: tabular numerals everywhere a number leads */
.bd-hero2-stat b, .stat b, .bd-pm-card-pvalue, .bd-keystats, .bd-stat, .termsheet, .ts-row, .tr-stats, .bd-figure { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }

/* ---- motion (unchanged contract: one curve, 260–460ms) ---- */
a, button, .btn, .hd-drop-trigger, .bd-hd2-drop-trigger { transition: color .26s var(--ease-smooth), background-color .26s var(--ease-smooth), border-color .26s var(--ease-smooth), box-shadow .34s var(--ease-smooth), transform .34s var(--ease-smooth), gap .3s var(--ease-smooth), opacity .26s var(--ease-smooth); }
a svg, button svg { transition: transform .34s var(--ease-smooth); }
a:not(.btn):hover > svg:last-child, button:not(.btn):hover > svg:last-child:not(.chev):not(.bd-hd2-chev) { transform: translateX(3px); }
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-hover); }
.btn:active { transform: translateY(0) scale(.99); }
.bd-ft2 a, .ft-col a, .ft-col li a { display: inline-block; }
.bd-ft2 a:hover, .ft-col a:hover { transform: translateX(2px); }
a.bd-pm-card, a.bd-listing-card, a.bd-ins-card { transition: transform .34s var(--ease-smooth), box-shadow .34s var(--ease-smooth), border-color .26s var(--ease-smooth); }
a.bd-pm-card:hover, a.bd-listing-card:hover, a.bd-ins-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: rgba(105,212,237,.55); }
section button[aria-expanded="true"] + div { animation: bd-acc-in .4s var(--ease-smooth) both; overflow: hidden; }
@keyframes bd-acc-in { from { opacity: 0; max-height: 0; } 55% { opacity: 1; } to { opacity: 1; max-height: 24rem; } }
@supports (interpolate-size: allow-keywords) {
  :root { interpolate-size: allow-keywords; }
  section button[aria-expanded="true"] + div { animation: bd-acc-h .4s var(--ease-smooth) both; }
  @keyframes bd-acc-h { from { height: 0; opacity: 0; } 55% { opacity: 1; } to { height: auto; opacity: 1; } }
}
@supports selector(details::details-content) {
  details::details-content { block-size: 0; overflow: hidden; opacity: 0; transition: block-size .46s var(--ease-smooth), content-visibility .46s allow-discrete, opacity .34s var(--ease-smooth); }
  details[open]::details-content { block-size: auto; opacity: 1; }
  details[open] > *:not(summary) { animation: none !important; }
}
section button[aria-expanded] { border-radius: 12px; }
section button[aria-expanded]:hover { background: var(--sky-tint) !important; }
section button[aria-expanded] > span:last-child { transition: transform .34s var(--ease-smooth) !important; }
details > summary { cursor: pointer; transition: color .26s var(--ease-smooth); }
details[open] > *:not(summary) { animation: bd-acc-in .34s var(--ease-smooth) both; }
.hd-drop-panel, .bd-hd2-drop-panel { transition-delay: .05s !important; }
.hd-drop:not(:hover):not(:focus-within) .hd-drop-panel, .bd-hd2-drop:not(:hover):not(:focus-within) .bd-hd2-drop-panel { transition-delay: .3s !important; }
.hd-drop-panel::before, .bd-hd2-drop-panel::before { top: -18px !important; left: -26px !important; right: -26px !important; height: 22px !important; }
/* scroll reveal: OFF sitewide (founder 2026-10-12): sections are static; .bd-reveal classes left in markup are inert */

/* ---- micro-detail: focus, fields, hairlines ---- */
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--sky-deep); outline-offset: 2px; border-radius: 8px;
}
.on-dark a:focus-visible, .on-dark button:focus-visible, .bd-hero2 a:focus-visible, .bd-hero2 button:focus-visible, .bd-ft2 a:focus-visible, footer.site a:focus-visible { outline-color: var(--sky); }
input, select, textarea { min-height: 44px; }
select { padding-right: 48px !important; background-position: right 18px center !important; }
.step-note a, .bd-inline-link, .answer a, .terms p a { color: var(--sky-on-light) !important; text-decoration-color: var(--sky-on-light) !important; text-underline-offset: 4px; }
.on-dark .step-note a, .on-dark .answer a, .on-dark .terms p a, .on-dark .bd-inline-link, .on-dark .bf-left a, .on-dark .bf-right a, .bd-hero2 .bd-inline-link, .hero .answer a, .bf-left a, .bf-right a { color: var(--sky) !important; text-decoration-color: var(--sky) !important; }
textarea { min-height: 96px; }

/* ---- HERO TIERS (same DNA, three weights; tier is set by the page's job) ---- */
/* Tier 1 · Statement: home only */
.bd-hero-t1 { min-height: 82vh; }
/* Tier 2 · Conversion: asymmetric split, text left, form right */
.bd-hero-t2 { padding-top: var(--band-m) !important; padding-bottom: var(--band-m) !important; }
.bd-hero-t2 .bd-hero2-in { text-align: left; }
.bd-hero-t2 .bd-hero2-in h1, .bd-hero-t2 .bd-hero2-lede, .bd-hero-t2 .bd-hero2-cta, .bd-hero-t2 .bd-hero2-trust { margin-left: 0; margin-right: 0; }
/* Tier 3 · Orientation: centred (prose pages) or left (grid/list/table pages) */
.bd-hero2 { position: relative; overflow: hidden; background: var(--ink); padding-top: clamp(56px,6.2vw,92px); padding-bottom: clamp(52px,5.6vw,80px); }
.bd-hero-t3 { display: flex; align-items: center; min-height: clamp(300px, 46vh, 500px); padding-top: var(--band-m) !important; padding-bottom: calc(var(--band-m) * 1.15) !important; }
.bd-hero-t3 > .wrap, .bd-hero-t3 > .wrap-wide { width: 100%; }
.bd-hero-t3 .bd-hero2-in h1 { max-width: 26ch; }
.bd-hero-t3 .bd-hero2-lede { max-width: 52ch; }
.bd-hero-t3--left .bd-hero2-in { text-align: left; }
.bd-hero-t3--left .bd-hero2-in h1, .bd-hero-t3--left .bd-hero2-lede, .bd-hero-t3--left .bd-hero2-cta, .bd-hero-t3--left .bd-hero2-trust, .bd-hero-t3--left .bd-hero2-stats { margin-left: 0; margin-right: 0; justify-content: flex-start; }
.bd-hero-t3--left .bd-hero2-lede { max-width: 62ch; }
/* interior heroes are plain navy: no backdrop graphic */
.bd-hero2-in { position: relative; text-align: center; }
.bd-hero2-in h1 { color: var(--white); font-family: var(--f-head); font-weight: 600 !important; letter-spacing: -.03em !important; line-height: 1.06 !important; font-size: var(--t-h1) !important; margin: 0 auto var(--s-6); max-width: 24ch; text-wrap: balance; }
.bd-hero2-in .sky { color: var(--sky); }
@media (min-width: 835px) { .bd-hero2-in .sky { white-space: nowrap; } }
.bd-hero2-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: var(--t-kicker); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--sky); margin: 0 0 var(--s-4); }
.bd-hero2-lede { color: var(--text-on-dark); font-size: var(--t-lede) !important; line-height: 1.5 !important; max-width: 56ch; margin: 0 auto; }
.bd-hero2-cta { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: var(--s-4) var(--s-6); margin-top: var(--s-10); }
.bd-hero2-trust { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--s-4) var(--s-8); margin-top: var(--s-8); padding-top: var(--s-6); border-top: 1px solid var(--line-dark); }
.bd-hero2-trust > span { display: inline-flex; align-items: center; gap: 10px; font-size: var(--t-small); font-weight: 500; color: var(--text-on-dark); }
.bd-hero2-stats { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--s-6) var(--s-16); margin-top: var(--s-8); padding-top: var(--s-6); border-top: 1px solid var(--line-dark); }
.bd-hero2-stat b { display: block; font-family: var(--f-head); font-weight: 600; font-size: clamp(2rem,2.6vw,2.75rem); color: var(--white); line-height: 1; letter-spacing: -.03em; }
.bd-hero2-stat span { display: block; font-size: var(--t-kicker); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #8AA2B5; margin-top: var(--s-2); }
@media (max-width: 834px) { .bd-hero-t1 { min-height: 78vh; } .bd-hero-t3 { min-height: 0; } }

/* ---- editorial intro band (white, centred; no dark banner) ---- */
.ins-hero { position: relative; background: var(--white) !important; color: var(--text) !important; text-align: center; padding: var(--band-m) 0 var(--band-s) !important; }
.ins-hero h1 { color: var(--navy) !important; max-width: 24ch; margin-left: auto !important; margin-right: auto !important; text-wrap: balance; }
.ins-hero h1 .sky { color: inherit; }
.ins-hero .sub, .ins-hero p { color: var(--text) !important; max-width: 60ch !important; margin-left: auto !important; margin-right: auto !important; }
.ins-hero .tr-stats, .ins-hero .ins-tabs, .ins-hero .ins-meta { justify-content: center; }

/* ---- dead rules retired: .kicker markup no longer exists in section heads ---- */
.final-card .kicker { display: none; }

@media (prefers-reduced-motion: reduce) {
  a, button, .btn, a.bd-pm-card { transition: none !important; }
  .btn:hover, a.bd-pm-card:hover { transform: none !important; }
  section button[aria-expanded="true"] + div, details[open] > *:not(summary) { animation: none !important; }
  .bd-reveal, .bd-reveal > * { animation: none !important; opacity: 1 !important; transform: none !important; }
}
/* Q7: form error lines tied to their fields; summary for screen readers */
.bd-ferr { margin:-6px 2px 12px; font-size:14px; font-weight:500; line-height:1.45; color:var(--danger) !important; }
.bd-sr { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* ===== end BD CANON ===== */

/* ===== assets/site-chrome.css ===== */
/* BizDepot site chrome: the ONE header and the ONE footer.
   Linked from every shipping page AFTER the page's own <style> (so it wins ties), BEFORE heading-case.css.
   Two markup flavours, one look:
     .dc.html pages   header.bd-hd2 / footer.bd-ft2   (template bindings: hdScrolled, hdToggle, hdBuyToggle, hdSellToggle ...)
     plain .html      header.site  / footer.site     (behaviour in assets/site-chrome.js)
   Markup is stamped by _tools/stamp_chrome.py; edit the template there, then re-run it. Per page, only the active nav item differs.
   Rules: no phone anywhere in the chrome; header CTA is always the 42px "Get a valuation" (.btn.m, sized in surface.css). */

:root { --hd-h: 78px; }
#valuation-form { scroll-margin-top: calc(var(--hd-h) + 16px); }

/* ============ DC HEADER (bd-hd2) ============ */
.bd-hd2-nav, .bd-hd2-right { display: flex; }
.bd-hd2-toggle { display: none; }
.bd-hd2-menu { display: none; }
.bd-hd2-chev { width: 11px; height: 11px; flex: none; transition: transform .18s var(--ease); }
.bd-hd2-drop { position: relative; display: flex; align-items: center; }
.bd-hd2-drop:hover .bd-hd2-chev, .bd-hd2-drop:focus-within .bd-hd2-chev { transform: rotate(180deg); }
.bd-hd2-drop-panel { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(6px); min-width: 460px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); box-shadow: var(--shadow-hover); padding: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s var(--ease), transform .18s var(--ease); z-index: 70; }
.bd-hd2-drop-panel::before { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
.bd-hd2-drop:hover .bd-hd2-drop-panel, .bd-hd2-drop:focus-within .bd-hd2-drop-panel { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(9px); }
.bd-hd2-drop-panel a { display: flex; align-items: center; gap: 11px; padding: 10px 13px; border-radius: 9px; font-size: var(--t-body); font-weight: 500; color: var(--navy); text-decoration: none; white-space: nowrap; transition: background .14s var(--ease), color .14s var(--ease); }
.bd-hd2-drop-panel a .dia { width: 7px; height: 7px; background: var(--line); transition: background .14s var(--ease); }
.bd-hd2-drop-panel a:hover { background: var(--sky-tint); color: #116E8D; }
.bd-hd2-drop-panel a:hover .dia { background: var(--sky); }
.bd-hd2-drop-panel a[aria-current="page"] { color: #116E8D; font-weight: 600; }
.bd-hd2-drop-panel a[aria-current="page"] .dia { background: var(--sky); }
.bd-hd2-drop-all { grid-column: 1 / -1; }
.bd-hd2-drop-panel--buy { min-width: 250px; grid-template-columns: 1fr; }
.bd-hd2-menu-inner { padding: 6px clamp(16px,2.2vw,40px) 14px; display: grid; gap: 2px; }
.bd-hd2-menu-inner > a, .bd-hd2-acc-trigger { display: flex; align-items: center; gap: 11px; width: 100%; padding: 12px 4px; font-family: var(--f-body); font-size: var(--t-body); font-weight: 600; color: var(--navy); text-decoration: none; text-align: left; line-height: 1.3; cursor: pointer; }
.bd-hd2-acc-trigger { background: none; border: none; }
.bd-hd2-menu-inner > a .dia, .bd-hd2-acc-trigger .dia { width: 8px; height: 8px; background: var(--line); flex: none; }
.bd-hd2-menu-inner > a:hover .dia { background: var(--sky); }
.bd-hd2-menu-inner > a[aria-current="page"] { color: #116E8D; }
.bd-hd2-menu-inner > a[aria-current="page"] .dia { background: var(--sky); }
.bd-hd2-acc-trigger .bd-hd2-chev { width: 12px; height: 12px; margin-left: auto; }
.bd-hd2-acc-trigger[aria-expanded="true"] { color: #116E8D; }
.bd-hd2-acc-trigger[aria-expanded="true"] .dia { background: var(--sky); }
.bd-hd2-acc-trigger[aria-expanded="true"] .bd-hd2-chev { transform: rotate(180deg); }
.bd-hd2-acc-trigger[aria-current="page"] { color: #116E8D; }
.bd-hd2-acc-trigger[aria-current="page"] .dia { background: var(--sky); }
.bd-hd2-acc-panel { padding: 2px 0 8px 20px; display: grid; gap: 0; }
.bd-hd2-acc-panel a { display: flex; align-items: center; gap: 11px; padding: 10px 4px; font-size: var(--t-body); font-weight: 500; color: var(--navy); text-decoration: none; }
.bd-hd2-acc-panel a .dia { width: 7px; height: 7px; background: var(--line); flex: none; }
.bd-hd2-acc-panel a:hover { color: #116E8D; }
.bd-hd2-acc-panel a:hover .dia { background: var(--sky); }
.bd-hd2-acc-panel a[aria-current="page"] { color: #116E8D; font-weight: 600; }
.bd-hd2-acc-panel a[aria-current="page"] .dia { background: var(--sky); }
.bd-hd2-menu-inner > a.bd-hd2-menu-cta { margin-top: 10px; justify-content: center; padding: 14px 22px; color: var(--navy); }
.bd-hd2-menu-inner > a.bd-hd2-menu-cta:hover { color: var(--navy); }
@media (max-width: 1080px) {
  .bd-hd2-nav, .bd-hd2-right { display: none; }
  .bd-hd2-toggle { display: grid; }
  .bd-hd2-menu { display: grid; }
}
@media (max-width: 1240px) and (min-width: 1081px) { .bd-hd2-nav { gap: 20px !important; } }
/* narrow desktop: "Get a free valuation" plus the full nav fit with a right gutter */
@media (max-width: 1200px) and (min-width: 1081px) { .bd-hd2-nav, header.site .hd-nav { gap: 16px !important; } .bd-hd2-row, header.site .nav { column-gap: 18px !important; } .bd-hd2-cta, header.site .hd-cta { padding-left: 16px !important; padding-right: 16px !important; } }
/* glass over a dark hero (data-scrolled="false"), solid white strip once scrolled */
.bd-hd2 { --hd-ink: var(--navy); --hd-active: #116E8D; transition: background-color .42s var(--ease-smooth), border-color .42s var(--ease-smooth), box-shadow .42s var(--ease-smooth); }
.bd-hd2[data-scrolled="false"] { --hd-ink: #FFFFFF; --hd-active: var(--sky); background: rgba(14,29,46,.22) !important; border-bottom-color: rgba(255,255,255,.14) !important; backdrop-filter: blur(24px) saturate(1.7); -webkit-backdrop-filter: blur(24px) saturate(1.7); }
.bd-hd2[data-scrolled="true"] { box-shadow: 0 1px 0 rgba(227,234,240,.9), 0 10px 30px -22px rgba(14,29,46,.5); }
/* off the dark hero the header is solid white on every page, never see-through (founder 2026-10-12). Some pages set a
   translucent white inline; this wins over all of them. */
.bd-hd2:not([data-scrolled="false"]), header.site:not([data-scrolled="false"]) { background: #FFFFFF !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.bd-hd2-logo { position: relative; display: block; height: 34px; }
.bd-hd2-logo img { position: absolute; left: 0; top: 0; height: 34px; width: auto; max-width: none; display: block; transition: opacity .42s var(--ease-smooth); }
.bd-hd2 .bd-hd2-logo .is-dark { opacity: 0; }
.bd-hd2[data-scrolled="false"] .bd-hd2-logo .is-light { opacity: 0; }
.bd-hd2[data-scrolled="false"] .bd-hd2-logo .is-dark { opacity: 1; }
.bd-hd2-cta { white-space: nowrap; flex: none; }
header.bd-hd2 .bd-hd2-row { --gutter: clamp(16px, 2.4vw, 44px); max-width: none !important; width: 100%; }
@media (max-width: 1080px) { .bd-hd2-row { grid-template-columns: auto 1fr !important; } .bd-hd2-toggle { justify-self: end; } }
.bd-hd2[data-scrolled="false"] .bd-hd2-toggle span span { background: #fff !important; }
.bd-hd2[data-scrolled="false"] .bd-hd2-menu { background: rgba(14,29,46,.98) !important; border-top-color: rgba(255,255,255,.12) !important; }
/* nav hover: one rule on every page (!important beats the inline --hd-ink) */
.bd-hd2 .bd-hd2-link:hover, .bd-hd2 .bd-hd2-drop-trigger:hover { color: #116E8D !important; }
.bd-hd2[data-scrolled="false"] .bd-hd2-link:hover, .bd-hd2[data-scrolled="false"] .bd-hd2-drop-trigger:hover { color: var(--sky) !important; }
.bd-hd2 .bd-hd2-acc-trigger:hover, .bd-hd2 .bd-hd2-menu-inner > a:hover { color: #116E8D !important; }
.bd-hd2[data-scrolled="false"] .bd-hd2-acc-trigger:hover, .bd-hd2[data-scrolled="false"] .bd-hd2-menu-inner > a:hover { color: var(--sky) !important; }
.bd-hd2-drop-panel a:hover { color: #116E8D !important; }

/* ============ PLAIN HEADER (header.site) ============
   Positioning stays with the page: pillars overlay a photo hero (fixed + glass), editorial pages sit a solid fixed bar
   above body padding. Everything else is shared here. */
header.site { --hd-ink: var(--navy); --hd-active: #116E8D; overflow: visible; transition: background-color .42s var(--ease-smooth), border-color .42s var(--ease-smooth), box-shadow .42s var(--ease-smooth); }
header.site[data-scrolled="false"] { --hd-ink: #FFFFFF; --hd-active: var(--sky); background: rgba(14,29,46,.22) !important; border-bottom-color: rgba(255,255,255,.14) !important; backdrop-filter: blur(24px) saturate(1.7); -webkit-backdrop-filter: blur(24px) saturate(1.7); }
header.site[data-scrolled="true"] { box-shadow: 0 1px 0 rgba(227,234,240,.9), 0 10px 30px -22px rgba(14,29,46,.5); }
header.site > .nav { max-width: none !important; width: 100%; margin: 0; padding-left: clamp(16px,2.4vw,44px) !important; padding-right: clamp(16px,2.4vw,44px) !important;
  display: grid !important; grid-template-columns: auto 1fr auto !important; align-items: center; height: 78px; gap: clamp(20px,2.6vw,44px); }
header.site .hd-nav { grid-column: 2; justify-self: center; gap: clamp(20px,2.1vw,32px) !important; }
header.site .hd-right { grid-column: 3; justify-self: end; margin-left: 0 !important; display: flex; align-items: center; gap: 14px; }
header.site .hd-toggle { grid-column: 3; justify-self: end; }
@media (max-width: 1240px) and (min-width: 1081px) { header.site .hd-nav { gap: 20px !important; } }
@media (min-width: 1081px) {
  header.site .hd-nav { display: flex !important; }
  header.site .hd-toggle { display: none !important; }
  header.site > .nav > .hd-right { display: flex !important; }
  header.site .hd-cta { display: inline-flex !important; }
}
@media (max-width: 1080px) {
  header.site > .nav { grid-template-columns: auto 1fr !important; }
  header.site .hd-nav, header.site > .nav > .hd-right { display: none !important; }
  header.site .hd-toggle { display: grid !important; grid-column: 2; }
}
/* dual logo crossfade (the white logo only shows on the glass state) */
header.site .nav > a:first-child { position: relative; display: block; height: 34px; width: 150px; flex-shrink: 0; }
header.site .nav > a:first-child img { position: absolute; left: 0; top: 0; height: 34px; width: auto; max-width: none; display: block; transition: opacity .42s var(--ease-smooth); }
header.site .nav > a:first-child img.is-dark { opacity: 0; }
header.site[data-scrolled="false"] .nav > a:first-child img.is-light { opacity: 0; }
header.site[data-scrolled="false"] .nav > a:first-child img.is-dark { opacity: 1; }
/* nav ink follows the state */
header.site .hd-nav > a, header.site .hd-nav > .hd-drop > .hd-drop-trigger { color: var(--hd-ink) !important; }
header.site .hd-nav > a[aria-current="page"], header.site .hd-nav > .hd-drop > .hd-drop-trigger[aria-current="page"] { color: var(--hd-active) !important; }
header.site .hd-nav > a:hover, header.site .hd-nav > .hd-drop > .hd-drop-trigger:hover { color: #116E8D !important; }
header.site[data-scrolled="false"] .hd-nav > a:hover, header.site[data-scrolled="false"] .hd-nav > .hd-drop > .hd-drop-trigger:hover { color: var(--sky) !important; }
header.site .hd-acc-trigger:hover, header.site .hd-wrap > a:hover { color: #116E8D !important; }
/* dropdown panels are always a light surface */
.hd-drop-panel a { color: var(--navy) !important; }
.hd-drop-panel a:hover { color: #116E8D !important; }
.hd-drop-panel a[aria-current="page"] { color: #116E8D !important; font-weight: 600; }
header.site[data-scrolled="false"] .hd-toggle .bars span { background: #fff !important; }
/* the open mobile panel hangs below the bar, always on the solid treatment */
.hd-menu { position: absolute; top: 78px; left: 0; right: 0; }
/* the open mobile menu scrolls inside itself, so every link stays reachable on short phones */
.hd-menu { max-height: calc(100dvh - 78px); overflow-y: auto; overscroll-behavior: contain; }
.bd-hd2-menu { max-height: calc(100dvh - 78px); }
.bd-hd2-menu > div { overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain; }
header.site:has(.hd-menu.is-open) { background: rgba(255,255,255,.98) !important; --hd-ink: var(--navy) !important; --hd-active: #116E8D !important; border-bottom-color: var(--line) !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; }
header.site:has(.hd-menu.is-open) .hd-menu { background: var(--white) !important; border-top-color: var(--line) !important; }
header.site:has(.hd-menu.is-open) .hd-wrap > a, header.site:has(.hd-menu.is-open) .hd-acc-trigger, header.site:has(.hd-menu.is-open) .hd-acc-panel a { color: var(--navy) !important; }
header.site:has(.hd-menu.is-open) .hd-wrap > a[aria-current="page"], header.site:has(.hd-menu.is-open) .hd-acc-trigger[aria-current="page"], header.site:has(.hd-menu.is-open) .hd-acc-panel a[aria-current="page"] { color: #116E8D !important; }
header.site:has(.hd-menu.is-open) .hd-toggle .bars span { background: var(--navy) !important; }
header.site:has(.hd-menu.is-open) .nav > a:first-child img.is-light { opacity: 1 !important; }
header.site:has(.hd-menu.is-open) .nav > a:first-child img.is-dark { opacity: 0 !important; }
.hd-acc-trigger[aria-current="page"] { color: #116E8D; }
.hd-acc-panel a[aria-current="page"] { color: #116E8D; font-weight: 600; }

/* ============ SHARED: dropdown hover bridge + 300ms exit delay (both flavours) ============ */
.hd-drop-panel, .bd-hd2-drop-panel { transition-delay: .05s !important; }
.hd-drop:not(:hover):not(:focus-within) .hd-drop-panel, .bd-hd2-drop:not(:hover):not(:focus-within) .bd-hd2-drop-panel { transition-delay: .3s !important; }
.hd-drop-panel::before, .bd-hd2-drop-panel::before { top: -18px !important; left: -26px !important; right: -26px !important; height: 22px !important; }

/* ============ FOOTER (both flavours) ============ */
/* Footer column titles are h2 (heading order) but look exactly like the h4 they replaced (PageSpeed, 2026-10-16). */
.bd-ft-h { font-size: 13px !important; line-height: 1.3 !important; letter-spacing: -.01em !important; margin: 1.33em 0 13px !important; max-width: none !important; }
/* The industry pages' hero form title is an h2 (it follows the page's h1) that keeps the look it had as an h3 (Lighthouse round, 2026-10-16). */
.hero-form h2.hf-h { font-size: var(--t-card) !important; font-weight: 600 !important; line-height: 1.25 !important; letter-spacing: -.015em !important; margin: 0 0 6px !important; max-width: none !important; }
.bd-ft2-grid, .ft-grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 36px; }
.bd-ft2 a:hover, footer.site a:hover { color: #C6D5E1; }
.bd-ft2-logos, .ft-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 34px; row-gap: 20px; }
.bd-ft2 li, footer.site li { font-size: var(--t-sub); line-height: 1.5; }
footer.site .wrap-wide { max-width: min(1600px, 100%) !important; margin: 0 auto; padding-left: var(--gutter) !important; padding-right: var(--gutter) !important; }
.bd-ft2-social, .ft-social { display: flex; gap: 10px; margin-top: 16px; }
.bd-ft2-social a, .ft-social a { display: inline-grid !important; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line-dark); border-radius: 10px; color: #8AA2B5; }
.bd-ft2-social a:hover, .ft-social a:hover { color: #FFFFFF; border-color: var(--sky); transform: none !important; }
.bd-ft2-social svg, .ft-social svg { width: 17px; height: 17px; }
@media (max-width: 1080px) { .bd-ft2-grid, .ft-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; } .bd-ft2-brand, .ft-brand { grid-column: 1 / -1; } }
@media (max-width: 760px) { .bd-ft2-grid, .ft-grid { grid-template-columns: 1fr 1fr; gap: 30px; } .bd-ft2-logos, .ft-logos { justify-content: space-between; gap: 22px; } }
@media (max-width: 480px) { .bd-ft2-grid, .ft-grid { grid-template-columns: 1fr 1fr; gap: 28px 20px; } .bd-ft2-logos, .ft-logos { gap: 24px 30px; } }

/* plain mobile menu matches the DC one item for item */
header.site .hd-menu .hd-wrap { padding: 6px clamp(16px,2.2vw,40px) 14px; }
header.site .hd-menu .hd-wrap > a, header.site .hd-acc-trigger { font-size: var(--t-body); font-weight: 600; padding: 12px 4px; }
header.site .hd-acc-panel a { font-size: var(--t-body); font-weight: 500; padding: 10px 4px; }

/* One navy (founder 2026-10-08): full-width dark bands use the footer's deep navy (--ink #0E1D2E); a hairline keeps a
   dark band that sits right above the footer from merging into it. */
.bd-ft2, footer.site { border-top: 1px solid rgba(255,255,255,.08); }
