/* Ninja Boiler post-migration enhancement layer.
   Tokens lifted from the site's OWN computed styles (getComputedStyle on live
   staging, 1440px): Urbanist 900/700 display, Commissioner body, #1a2830 dark
   bands, #f47a20 accent, zero border radius, 15px/45px uppercase buttons.
   Astra + Elementor theme CSS fights injected styles, hence explicit px and
   !important throughout. Versioned via ?v=N on the link tag: bump on every edit. */

.nb {
  --nb-dark: #1a2830;
  --nb-orange: #f47a20;
  /* Same hue family, darkened for AA where the accent is TEXT on a light band:
     5.70:1 on #fff, 5.31:1 on #f5f5f5. The brand #f47a20 is untouched wherever
     it is a fill (buttons, orange bands), which is how the original site uses it. */
  --nb-orange-ink: #a34f10;
  --nb-yellow: #ffc03d;
  --nb-ink: #4b4f58;
  --nb-grey: #f5f5f5;
  --nb-line: #e3e6e8;
  --nb-display: Urbanist, "Urbanist", sans-serif;
  --nb-body: Commissioner, "Commissioner", sans-serif;
}

.nb * { box-sizing: border-box; }

.nb .nb-wrap { max-width: 1200px !important; margin: 0 auto !important; padding: 0 24px !important; }

/* ---- scroll anchor offset (sticky header) ---- */
.nb [id] { scroll-margin-top: 48px !important; }

/* ---- base typography (must precede components) ---- */
.nb h2 { font-family: var(--nb-display) !important; font-weight: 700 !important; font-size: 32px !important; line-height: 1.3 !important; color: var(--nb-dark) !important; margin: 0 0 18px !important; }
.nb h3 { font-family: var(--nb-display) !important; font-weight: 700 !important; font-size: 21px !important; line-height: 1.35 !important; color: var(--nb-dark) !important; margin: 0 0 10px !important; }
.nb p, .nb li { font-family: var(--nb-body) !important; font-size: 17px !important; line-height: 1.68 !important; color: var(--nb-ink) !important; }
.nb p { margin: 0 0 16px !important; }
.nb .nb-sec-dark h2, .nb .nb-sec-dark h3, .nb .nb-sec-dark p, .nb .nb-sec-dark li { color: #ffffff !important; }
.nb .nb-sec-orange h2, .nb .nb-sec-orange h3, .nb .nb-sec-orange p, .nb .nb-sec-orange li { color: #ffffff !important; }
.nb .nb-eyebrow { font-family: var(--nb-body) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 1.6px !important; text-transform: uppercase !important; color: var(--nb-orange-ink) !important; margin: 0 0 10px !important; }
.nb .nb-sec-dark .nb-eyebrow, .nb .nb-sec-orange .nb-eyebrow { color: var(--nb-yellow) !important; }

/* ---- breadcrumb ---- */
.nb .nb-crumb { background: #ffffff !important; padding: 14px 0 !important; border-bottom: 1px solid var(--nb-line) !important; }
.nb .nb-crumb ol { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; align-items: center !important; }
.nb .nb-crumb li { font-family: var(--nb-body) !important; font-size: 13px !important; color: #5b6169 !important; margin: 0 !important; }
.nb .nb-crumb li + li::before { content: "\203A"; margin-right: 8px !important; color: #9aa1a8 !important; }
.nb .nb-crumb a { color: #5b6169 !important; text-decoration: none !important; border-bottom: 1px solid transparent !important; }
.nb .nb-crumb a:hover, .nb .nb-crumb a:focus-visible { color: #a34f10 !important; border-bottom-color: #a34f10 !important; }
.nb .nb-crumb [aria-current] { color: var(--nb-dark) !important; font-weight: 600 !important; }

/* ---- hero ---- */
.nb .nb-hero { position: relative !important; background-color: var(--nb-dark) !important; background-size: cover !important; background-position: center !important; padding: 96px 0 84px !important; }
.nb .nb-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(16,26,32,.93) 0%, rgba(16,26,32,.80) 52%, rgba(16,26,32,.60) 100%); }
.nb .nb-hero .nb-wrap { position: relative !important; z-index: 2 !important; }
.nb .nb-hero-grid { display: grid !important; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr) !important; gap: 44px !important; align-items: start !important; }
.nb .nb-hero p.nb-kicker, .nb p.nb-kicker { font-family: var(--nb-body) !important; font-weight: 300 !important; font-size: 22px !important; line-height: 1.35 !important; color: #ffffff !important; margin: 0 0 14px !important; text-shadow: 0 1px 10px rgba(0,0,0,.55) !important; }
.nb .nb-hero h1 { font-family: var(--nb-display) !important; font-weight: 900 !important; font-size: 50px !important; line-height: 1.16 !important; color: #ffffff !important; margin: 0 0 20px !important; letter-spacing: -0.5px !important; text-shadow: 0 2px 16px rgba(0,0,0,.5) !important; }
.nb .nb-hero p { font-family: var(--nb-body) !important; font-size: 18px !important; line-height: 1.62 !important; color: #eef1f3 !important; margin: 0 0 16px !important; text-shadow: 0 1px 8px rgba(0,0,0,.5) !important; }
.nb .nb-hero p strong { color: #ffffff !important; }
.nb .nb-cta-row { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; margin-top: 26px !important; }

/* ---- buttons (site pattern: solid orange, zero radius, uppercase) ---- */
.nb .nb-btn { display: inline-block !important; font-family: var(--nb-body) !important; font-weight: 500 !important; font-size: 16px !important; letter-spacing: .4px !important; text-transform: uppercase !important; text-decoration: none !important; padding: 15px 34px !important; border-radius: 0 !important; border: 2px solid var(--nb-orange) !important; background: var(--nb-orange) !important; color: #ffffff !important; transition: background .18s ease, border-color .18s ease, transform .18s ease !important; }
.nb .nb-btn:hover, .nb .nb-btn:focus-visible { background: #d9640f !important; border-color: #d9640f !important; color: #ffffff !important; transform: translateY(-2px) !important; }
.nb .nb-btn-dark { background: var(--nb-dark) !important; border-color: var(--nb-dark) !important; color: #ffffff !important; }
.nb .nb-btn-dark:hover, .nb .nb-btn-dark:focus-visible { background: #0e1a20 !important; border-color: #0e1a20 !important; }
.nb .nb-btn-ghost { background: transparent !important; border-color: #ffffff !important; color: #ffffff !important; }
.nb .nb-btn-ghost:hover, .nb .nb-btn-ghost:focus-visible { background: #ffffff !important; border-color: #ffffff !important; color: var(--nb-dark) !important; }
.nb a:focus-visible, .nb button:focus-visible, .nb summary:focus-visible { outline: 3px solid var(--nb-yellow) !important; outline-offset: 2px !important; }

/* ---- hero side card (echoes the site's floating white quote card) ---- */
.nb .nb-card { background: #ffffff !important; border-top: 6px solid var(--nb-orange) !important; padding: 30px 28px !important; box-shadow: 0 22px 50px rgba(0,0,0,.28) !important; }
.nb .nb-card h2 { font-family: var(--nb-display) !important; font-weight: 700 !important; font-size: 27px !important; line-height: 1.28 !important; color: var(--nb-dark) !important; margin: 0 0 12px !important; text-align: center !important; }
.nb .nb-card p { font-family: var(--nb-body) !important; font-size: 16px !important; line-height: 1.6 !important; color: var(--nb-ink) !important; margin: 0 0 18px !important; text-align: center !important; }
.nb .nb-card .nb-btn { display: block !important; text-align: center !important; font-size: 19px !important; }
.nb .nb-card p.nb-card-note, .nb p.nb-card-note { font-family: var(--nb-body) !important; font-size: 12px !important; letter-spacing: .6px !important; text-transform: uppercase !important; color: #6b7178 !important; text-align: center !important; margin: 14px 0 0 !important; }

/* ---- generic sections ---- */
.nb .nb-sec { padding: 68px 0 !important; background: #ffffff !important; }
.nb .nb-sec-grey { background: var(--nb-grey) !important; }
.nb .nb-sec-dark { background: var(--nb-dark) !important; }
.nb .nb-sec-orange { background: var(--nb-orange) !important; }
.nb .nb-split { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1.25fr) !important; gap: 48px !important; align-items: start !important; }

/* ---- trust strip ---- */
.nb .nb-strip { background: #ffffff !important; border-bottom: 1px solid var(--nb-line) !important; padding: 22px 0 !important; }
.nb .nb-strip ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 18px !important; }
.nb .nb-strip li { font-family: var(--nb-body) !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: .8px !important; text-transform: uppercase !important; color: var(--nb-dark) !important; text-align: center !important; padding-top: 34px !important; position: relative !important; }
.nb .nb-strip li::before { content: ""; position: absolute; top: 0; left: 50%; width: 26px; height: 26px; transform: translateX(-50%); background: var(--nb-orange); clip-path: polygon(50% 0%, 100% 25%, 100% 72%, 50% 100%, 0% 72%, 0% 25%); }

/* ---- included cards (echo the site's bordered service cards) ---- */
.nb .nb-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 24px !important; }
.nb .nb-cardx { background: #ffffff !important; border: 1px solid var(--nb-line) !important; border-top: 4px solid var(--nb-orange) !important; padding: 26px 24px !important; transition: transform .18s ease, box-shadow .18s ease !important; }
.nb .nb-cardx:hover { transform: translateY(-4px) !important; box-shadow: 0 16px 34px rgba(26,40,48,.12) !important; }
.nb .nb-cardx p { font-size: 16px !important; margin: 0 !important; }
.nb .nb-ticks { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.nb .nb-ticks li { position: relative !important; padding-left: 30px !important; margin: 0 0 12px !important; font-size: 16px !important; }
.nb .nb-ticks li::before { content: ""; position: absolute; left: 0; top: 6px; width: 16px; height: 9px; border-left: 3px solid #2f9e5a; border-bottom: 3px solid #2f9e5a; transform: rotate(-45deg); }
.nb .nb-sec-dark .nb-ticks li::before, .nb .nb-sec-orange .nb-ticks li::before { border-color: var(--nb-yellow) !important; }

/* ---- local considerations ---- */
.nb .nb-local { display: grid !important; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr) !important; gap: 44px !important; align-items: start !important; }
.nb .nb-local img { width: 100% !important; height: auto !important; display: block !important; }
.nb .nb-facts { list-style: none !important; margin: 22px 0 0 !important; padding: 0 !important; border-top: 1px solid rgba(255,255,255,.22) !important; }
.nb .nb-facts li { display: grid !important; grid-template-columns: 190px minmax(0,1fr) !important; gap: 18px !important; padding: 14px 0 !important; border-bottom: 1px solid rgba(255,255,255,.22) !important; font-size: 16px !important; }
.nb .nb-facts b { font-family: var(--nb-body) !important; font-weight: 600 !important; letter-spacing: .8px !important; text-transform: uppercase !important; font-size: 12px !important; color: var(--nb-yellow) !important; padding-top: 3px !important; }

/* ---- internal link components (designed, not outline pills) ---- */
.nb .nb-towns { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 14px !important; }
.nb .nb-towns a { display: flex !important; align-items: center !important; gap: 10px !important; background: rgba(255,255,255,.06) !important; border: 1px solid rgba(255,255,255,.18) !important; padding: 14px 16px !important; text-decoration: none !important; font-family: var(--nb-body) !important; font-size: 16px !important; font-weight: 500 !important; color: #ffffff !important; transition: transform .18s ease, background .18s ease, border-color .18s ease !important; }
.nb .nb-towns a:hover, .nb .nb-towns a:focus-visible { transform: translateY(-3px) !important; background: rgba(244,122,32,.18) !important; border-color: var(--nb-orange) !important; color: #ffffff !important; }
.nb .nb-towns a::before { content: ""; flex: 0 0 auto; width: 13px; height: 18px; background: var(--nb-orange); clip-path: path("M6.5 0C2.9 0 0 2.9 0 6.5 0 11.4 6.5 18 6.5 18S13 11.4 13 6.5C13 2.9 10.1 0 6.5 0Zm0 9.1a2.6 2.6 0 1 1 0-5.2 2.6 2.6 0 0 1 0 5.2Z"); }
.nb .nb-svcs { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; margin-top: 26px !important; }
.nb .nb-svcs a { display: inline-flex !important; align-items: center !important; gap: 10px !important; background: var(--nb-orange) !important; color: #ffffff !important; text-decoration: none !important; font-family: var(--nb-body) !important; font-weight: 500 !important; font-size: 15px !important; letter-spacing: .4px !important; text-transform: uppercase !important; padding: 13px 24px !important; transition: background .18s ease, transform .18s ease !important; }
.nb .nb-svcs a::after { content: "\2192"; font-size: 17px !important; }
.nb .nb-svcs a:hover, .nb .nb-svcs a:focus-visible { background: #d9640f !important; transform: translateY(-2px) !important; color: #ffffff !important; }
.nb .nb-sec-orange .nb-svcs a { background: var(--nb-dark) !important; }
.nb .nb-sec-orange .nb-svcs a:hover { background: #0e1a20 !important; }

/* ---- FAQ accordion ---- */
.nb .nb-faq { margin-top: 8px !important; }
.nb .nb-faq details { border-bottom: 1px solid rgba(255,255,255,.2) !important; }
.nb .nb-faq summary { list-style: none !important; cursor: pointer !important; display: flex !important; justify-content: space-between !important; gap: 20px !important; align-items: center !important; padding: 18px 0 !important; font-family: var(--nb-body) !important; font-weight: 600 !important; font-size: 17px !important; line-height: 1.45 !important; color: #ffffff !important; }
.nb .nb-faq summary::-webkit-details-marker { display: none !important; }
.nb .nb-faq summary::after { content: "+"; flex: 0 0 auto; font-size: 26px !important; line-height: 1 !important; color: var(--nb-orange) !important; }
.nb .nb-faq details[open] summary::after { content: "\2212"; }
.nb .nb-faq details p { padding: 0 0 20px !important; margin: 0 !important; color: #d9dee2 !important; font-size: 16px !important; max-width: 62em !important; }

/* ---- final CTA ---- */
.nb .nb-final { text-align: center !important; }
.nb .nb-final h2 { color: #ffffff !important; font-size: 34px !important; }
.nb .nb-final p { color: #d9dee2 !important; max-width: 46em !important; margin: 0 auto 22px !important; }
.nb .nb-final .nb-cta-row { justify-content: center !important; }

/* ---- hub ---- */
.nb .nb-hub-group { margin-bottom: 40px !important; }
.nb .nb-hub-group h3 { font-size: 18px !important; letter-spacing: .6px !important; text-transform: uppercase !important; color: var(--nb-orange-ink) !important; border-bottom: 1px solid var(--nb-line) !important; padding-bottom: 10px !important; margin-bottom: 18px !important; }
.nb .nb-hub-rows { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 18px !important; }
.nb .nb-hub-rows > li { border: 1px solid var(--nb-line) !important; border-left: 4px solid var(--nb-orange) !important; padding: 18px 20px !important; background: #ffffff !important; transition: transform .18s ease, box-shadow .18s ease !important; }
.nb .nb-hub-rows > li:hover { transform: translateY(-3px) !important; box-shadow: 0 14px 30px rgba(26,40,48,.1) !important; }
.nb .nb-hub-rows h4 { font-family: var(--nb-display) !important; font-weight: 700 !important; font-size: 19px !important; margin: 0 0 4px !important; }
.nb .nb-hub-rows h4 a { color: var(--nb-dark) !important; text-decoration: none !important; }
.nb .nb-hub-rows h4 a:hover, .nb .nb-hub-rows h4 a:focus-visible { color: #a34f10 !important; }
.nb .nb-hub-meta { font-family: var(--nb-body) !important; font-size: 13px !important; color: #6b7178 !important; margin: 0 0 10px !important; }
.nb .nb-hub-links { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.nb .nb-hub-links a { font-family: var(--nb-body) !important; font-size: 13px !important; font-weight: 500 !important; text-decoration: none !important; color: #ffffff !important; background: var(--nb-dark) !important; padding: 7px 12px !important; transition: background .18s ease !important; }
.nb .nb-hub-links a:hover, .nb .nb-hub-links a:focus-visible { background: var(--nb-orange) !important; color: #ffffff !important; }

/* ---- homepage / legacy coverage strip injection ---- */
.nb .nb-cover { background: var(--nb-dark) !important; padding: 56px 0 !important; }
.nb .nb-cover h2 { color: #ffffff !important; text-align: center !important; }
.nb .nb-cover p { color: #cfd6da !important; text-align: center !important; max-width: 52em !important; margin: 0 auto 26px !important; }
.nb .nb-cover .nb-cta-row { justify-content: center !important; margin-top: 26px !important; }

/* ---- responsive ---- */
@media (max-width: 1024px) {
.nb .nb-hero-grid, .nb .nb-split, .nb .nb-local { grid-template-columns: minmax(0,1fr) !important; gap: 32px !important; }
.nb .nb-cards { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
.nb .nb-towns { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
.nb .nb-hub-rows { grid-template-columns: minmax(0,1fr) !important; }
.nb .nb-hero h1 { font-size: 40px !important; }
}
@media (max-width: 767px) {
.nb .nb-wrap { padding: 0 18px !important; }
.nb .nb-sec { padding: 48px 0 !important; }
.nb .nb-hero { padding: 62px 0 54px !important; }
.nb .nb-hero h1 { font-size: 31px !important; }
.nb .nb-kicker { font-size: 18px !important; }
  .nb h2 { font-size: 25px !important; }
.nb .nb-final h2 { font-size: 26px !important; }
.nb .nb-cards { grid-template-columns: minmax(0,1fr) !important; }
.nb .nb-towns { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
.nb .nb-strip ul { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
.nb .nb-facts li { grid-template-columns: minmax(0,1fr) !important; gap: 4px !important; }
.nb .nb-btn { padding: 14px 22px !important; font-size: 15px !important; }
.nb .nb-cta-row { gap: 10px !important; }
}
@media (max-width: 380px) {
.nb .nb-towns, .nb .nb-strip ul { grid-template-columns: minmax(0,1fr) !important; }
.nb .nb-hero h1 { font-size: 27px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .nb * { transition: none !important; }
.nb .nb-btn:hover, .nb .nb-towns a:hover, .nb .nb-cardx:hover, .nb .nb-svcs a:hover, .nb .nb-hub-rows > li:hover { transform: none !important; }
}