/*
Theme Name: Nick Brock DC
Theme URI: https://nickbrockdc.com
Author: Kamber Digital
Description: Custom theme for Advanced Chiropractic Rehabilitation — Dr. Nick Brock, DC (Thousand Oaks, CA). Lightweight, schema-first, no page builder.
Version: 2.17.6
License: Proprietary
Text Domain: nickbrockdc
*/

/* ====================================================================
   V3-C design system — light canvas, full-color photography.
   Palette is the practice's REAL brand, sampled from the logo:
   blue #0071BD + gray #999999. The previous navy/gold was invented
   during Phase 2 design direction and never matched the identity.
   Legacy --nbdc-navy / --nbdc-gold tokens are kept as aliases so any
   template or inline style still referencing them resolves to brand blue.
   ==================================================================== */
:root {
  /* Brand */
  --nbdc-blue:        #0071BD;
  --nbdc-blue-dark:   #00548D;
  --nbdc-blue-deep:   #003F6B;
  --nbdc-blue-light:  #1D86CC;
  --nbdc-blue-wash:   #EAF3FA;
  --nbdc-grey:        #999999;

  /* Surface */
  --nbdc-paper:       #FFFFFF;
  --nbdc-bone:        #FAFBFC;
  --nbdc-tint:        #F1F5F8;
  --nbdc-ink:         #0B1218;

  /* Text */
  --nbdc-text:        #0B1218;
  --nbdc-text-soft:   #54636F;
  --nbdc-text-mute:   #8494A0;
  --nbdc-line:        rgba(11,18,24,.10);
  --nbdc-line-strong: rgba(11,18,24,.16);

  /* Legacy aliases */
  --nbdc-navy:        #0071BD;
  --nbdc-navy-dark:   #00548D;
  --nbdc-navy-tint:   #EAF3FA;
  --nbdc-gold:        #0071BD;
  --nbdc-gold-dark:   #00548D;
  --nbdc-stone:       #E3E9EE;
  --nbdc-charcoal:    #0B1218;
  --nbdc-ash:         #54636F;
  --nbdc-mist:        #8494A0;

  /* Semantic */
  --nbdc-success:     #2E7D46;
  --nbdc-warning:     #B7791F;
  --nbdc-danger:      #C53030;

  /* Type scale */
  --step--1: clamp(0.833rem, 0.79rem + 0.22vw, 0.944rem);
  --step-0:  clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-1:  clamp(1.2rem, 1.13rem + 0.33vw, 1.406rem);
  --step-2:  clamp(1.44rem, 1.34rem + 0.5vw, 1.758rem);
  --step-3:  clamp(1.728rem, 1.58rem + 0.74vw, 2.197rem);
  --step-4:  clamp(2.074rem, 1.86rem + 1.07vw, 2.747rem);
  --step-5:  clamp(2.488rem, 2.18rem + 1.54vw, 3.433rem);

  --nbdc-ease: cubic-bezier(.16,1,.3,1);
  --nbdc-radius: 6px;
  --nbdc-radius-lg: 20px;
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  /* System stack — this is what has always rendered; there was never an
     @font-face for Inter. Keeps the look identical at zero network cost. */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  font-size: var(--step-0);
  line-height: 1.65;
  color: var(--nbdc-text);
  background: var(--nbdc-bone);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--nbdc-blue); text-decoration: none; }
a:hover { color: var(--nbdc-blue-dark); }
h1,h2,h3,h4,h5 { margin: 0 0 .5em; font-weight: 600; letter-spacing: -.032em; line-height: 1.08; }
h1 { font-size: var(--step-5); }
h2 { font-size: var(--step-4); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }
p  { margin: 0 0 1.1em; }
ul, ol { margin: 0 0 1.1em; padding-left: 1.3em; }
li { margin-bottom: .4em; }
strong { font-weight: 600; }
blockquote { margin: 0; }
:focus-visible { outline: 2px solid var(--nbdc-blue); outline-offset: 3px; border-radius: 3px; }

/* Film grain — the cue that reads "designed" rather than "templated".
   It is a full-viewport fixed layer running an SVG feTurbulence filter at
   2.8% opacity: real rasterization and compositing cost for an effect that
   is imperceptible on a small screen. Desktop only — see the media query
   further down that switches it off under 861px. */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 300; pointer-events: none; opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Layout ---------- */
.nbdc-container { width: 100%; max-width: 1300px; margin: 0 auto; padding: 0 38px; }
.nbdc-container--narrow { max-width: 820px; }
.nbdc-section { padding: 104px 0; position: relative; }
.nbdc-section--sm { padding: 68px 0; }
.nbdc-section--bg-tint { background: var(--nbdc-tint); }
.nbdc-section--bg-navy { background: var(--nbdc-ink); color: #fff; }
.nbdc-section--bg-navy h1,.nbdc-section--bg-navy h2,.nbdc-section--bg-navy h3 { color: #fff; }
.nbdc-section--bg-navy p { color: rgba(255,255,255,.76); }
.nbdc-section--bg-navy a { color: #6FB6E4; }
.nbdc-main { display: block; }
.nbdc-text-center { text-align: center; }
.nbdc-mt-sm { margin-top: 1rem; }
.nbdc-visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link:focus { position: fixed; top: 12px; left: 12px; width: auto; height: auto;
  clip: auto; background: var(--nbdc-ink); color: #fff; padding: 12px 18px; z-index: 999; border-radius: 6px; }

/* ---------- Eyebrow / section header ---------- */
.nbdc-eyebrow, .nbdc-hero__eyebrow {
  display: inline-block; font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--nbdc-blue); font-weight: 700; margin-bottom: 14px;
}
.nbdc-section-header { max-width: 780px; margin-bottom: 54px; }
.nbdc-section-header h2 { font-size: var(--step-5); margin-bottom: 16px; }
.nbdc-section-header__lead { color: var(--nbdc-text-soft); font-size: var(--step-1); max-width: min(56ch,100%); margin-bottom: 0; }
.nbdc-section--bg-navy .nbdc-eyebrow { color: #6FB6E4; }
.nbdc-text-lead { font-size: var(--step-1); color: var(--nbdc-text-soft); max-width: min(58ch,100%); }

/* ---------- Buttons ---------- */
.nbdc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 17px 34px; border-radius: 100px; font-size: 15px; font-weight: 600;
  letter-spacing: -.005em; border: 1px solid transparent; cursor: pointer;
  transition: all .45s var(--nbdc-ease); text-align: center; white-space: nowrap;
}
.nbdc-btn--primary { background: var(--nbdc-blue); color: #fff; }
.nbdc-btn--primary:hover { background: var(--nbdc-blue-dark); color: #fff; transform: translateY(-3px); box-shadow: 0 18px 40px rgba(0,113,189,.3); }
.nbdc-btn--secondary { background: var(--nbdc-paper); color: var(--nbdc-text); border-color: var(--nbdc-line); }
.nbdc-btn--secondary:hover { border-color: var(--nbdc-text); color: var(--nbdc-text); transform: translateY(-3px); box-shadow: 0 14px 30px rgba(11,18,24,.1); }
.nbdc-btn--ghost { background: transparent; color: var(--nbdc-text); border-color: var(--nbdc-line); }
.nbdc-btn--ghost:hover { border-color: var(--nbdc-text); transform: translateY(-3px); }
.nbdc-btn--large { padding: 20px 40px; font-size: 16px; }
.nbdc-btn--block { display: flex; width: 100%; }
.nbdc-section--bg-navy .nbdc-btn--primary { background: #fff; color: var(--nbdc-ink); }
.nbdc-section--bg-navy .nbdc-btn--primary:hover { background: var(--nbdc-blue); color: #fff; }
.nbdc-section--bg-navy .nbdc-btn--secondary,
.nbdc-section--bg-navy .nbdc-btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.28); }
.nbdc-section--bg-navy .nbdc-btn--secondary:hover,
.nbdc-section--bg-navy .nbdc-btn--ghost:hover { border-color: #fff; background: rgba(255,255,255,.06); }

/* ---------- Header / nav ---------- */
.nbdc-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250,251,252,.86); backdrop-filter: blur(22px) saturate(1.5);
  border-bottom: 1px solid transparent; transition: border-color .5s var(--nbdc-ease), box-shadow .5s var(--nbdc-ease);
}
.nbdc-header.is-scrolled { border-bottom-color: var(--nbdc-line); box-shadow: 0 6px 24px rgba(11,18,24,.05); }
.nbdc-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 26px; padding: 12px 0; }
.nbdc-logo { display: flex; align-items: center; flex: none; }
.nbdc-logo img { height: 104px; width: auto; }
.nbdc-logo__text { font-weight: 700; font-size: 1.05rem; line-height: 1.15; color: var(--nbdc-text); letter-spacing: -.02em; }
.nbdc-logo__text span { display: block; font-size: .68rem; font-weight: 500; color: var(--nbdc-text-mute); letter-spacing: .04em; margin-top: 3px; }

.nbdc-nav__list { display: flex; align-items: center; gap: 34px; list-style: none; margin: 0; padding: 0; }
.nbdc-nav__item { position: relative; margin: 0; }
.nbdc-nav__link { font-size: 15px; font-weight: 500; color: var(--nbdc-text-soft); padding: 8px 0; display: inline-block; position: relative; transition: color .3s var(--nbdc-ease); }
.nbdc-nav__link::after { content: ""; position: absolute; left: 0; bottom: 2px; width: 0; height: 1.5px; background: var(--nbdc-blue); transition: width .45s var(--nbdc-ease); }
.nbdc-nav__link:hover { color: var(--nbdc-text); }
.nbdc-nav__link:hover::after { width: 100%; }
.nbdc-nav__dropdown {
  position: absolute; top: 100%; left: -18px; min-width: 250px; list-style: none; margin: 0; padding: 12px;
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line); border-radius: 14px;
  box-shadow: 0 22px 50px rgba(11,18,24,.14);
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: all .4s var(--nbdc-ease); z-index: 60;
}
.nbdc-nav__item--has-dropdown:hover .nbdc-nav__dropdown,
.nbdc-nav__item--has-dropdown:focus-within .nbdc-nav__dropdown { opacity: 1; visibility: visible; transform: none; }
.nbdc-nav__dropdown li { margin: 0; }
.nbdc-nav__dropdown a { display: block; padding: 11px 16px; border-radius: 9px; font-size: 15px; color: var(--nbdc-text-soft); transition: all .25s var(--nbdc-ease); }
.nbdc-nav__dropdown a:hover { background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark); }
.nbdc-nav__toggle { display: none; background: none; border: 0; color: var(--nbdc-text); cursor: pointer; padding: 8px; }

@media (max-width: 1080px) {
  .nbdc-nav__toggle { display: block; }
  /* An ancestor with backdrop-filter becomes the containing block for its
     position:fixed descendants. The header has one, so the drawer below was
     being sized against the 88px header instead of the viewport — the nav list
     collapsed to ~30px and only the Call/Book block overflowed into view.
     Solid background at drawer widths; desktop keeps the frosted treatment. */
  .nbdc-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--nbdc-bone); }
  /* While the drawer is open it is a modal surface and must sit above the
     announce bar (z-index 101), which lives outside <header>. */
  body.nbdc-nav-is-open .nbdc-header { z-index: 120; }

  .nbdc-nav { position: fixed; inset: 0 0 0 auto; width: min(360px,86vw); background: var(--nbdc-paper);
    padding: 100px 28px 40px; transform: translateX(100%); transition: transform .5s var(--nbdc-ease);
    box-shadow: -20px 0 60px rgba(11,18,24,.16); overflow-y: auto; z-index: 90; }
  .nbdc-nav--open { transform: none; }
  .nbdc-nav__list { flex-direction: column; align-items: stretch; gap: 4px; }
  .nbdc-nav__link { padding: 13px 0; font-size: 17px; }
  .nbdc-nav__dropdown { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none;
    border: 0; border-left: 2px solid var(--nbdc-line); border-radius: 0; padding: 0 0 0 14px; margin: 2px 0 10px; min-width: 0; }
}
@media (max-width: 560px) { .nbdc-logo img { height: 68px; } }

/* ---------- Hero ---------- */
.nbdc-hero { padding: 96px 0 84px; position: relative; overflow: hidden; }
.nbdc-hero::before {
  content: ""; position: absolute; top: -300px; right: -220px; width: 860px; height: 860px; border-radius: 50%;
  background: radial-gradient(circle, var(--nbdc-blue-wash) 0%, transparent 68%); z-index: 0; pointer-events: none;
}
.nbdc-hero > .nbdc-container { position: relative; z-index: 1; }
.nbdc-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 68px; align-items: center; }
.nbdc-hero__grid:not(:has(.nbdc-hero__image)) { grid-template-columns: 1fr; max-width: 940px; }
.nbdc-hero__headline { font-size: clamp(40px,5.6vw,80px); margin: 0 0 22px; }
.nbdc-hero__subhead { font-size: var(--step-1); color: var(--nbdc-text-soft); max-width: min(48ch,100%); margin-bottom: 32px; }
.nbdc-hero__ctas { display: flex; gap: 13px; flex-wrap: wrap; }
.nbdc-hero__image { position: relative; }
.nbdc-hero__image img { width: 100%; border-radius: var(--nbdc-radius-lg); box-shadow: 0 40px 90px rgba(11,18,24,.18); }
@media (max-width: 960px) { .nbdc-hero__grid { grid-template-columns: 1fr; gap: 44px; } }

/* ---------- Stat bar ---------- */
.nbdc-statbar { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--nbdc-line); border-bottom: 1px solid var(--nbdc-line); background: var(--nbdc-paper); }
.nbdc-stat { padding: 46px 26px; text-align: center; border-right: 1px solid var(--nbdc-line); transition: background .5s var(--nbdc-ease); }
.nbdc-stat:last-child { border-right: none; }
.nbdc-stat:hover { background: var(--nbdc-blue-wash); }
.nbdc-stat__num { display: block; font-size: clamp(32px,3.8vw,54px); font-weight: 600; letter-spacing: -.045em; line-height: 1; color: var(--nbdc-blue); }
.nbdc-stat__num { font-variant-numeric: tabular-nums; contain: layout style; }
.nbdc-stat__label { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--nbdc-text-soft); margin-top: 12px; }
@media (max-width: 820px) {
  .nbdc-statbar { grid-template-columns: repeat(2,1fr); }
  .nbdc-stat:nth-child(2n) { border-right: none; }
  .nbdc-stat:nth-child(-n+2) { border-bottom: 1px solid var(--nbdc-line); }
}

/* ---------- Grids & cards ---------- */
.nbdc-grid { display: flex; flex-wrap: wrap; gap: 24px; justify-content: center; }
.nbdc-grid > * { flex: 1 1 300px; }
.nbdc-grid--2 > * { flex-basis: 380px; max-width: 560px; }
.nbdc-grid--3 > * { flex-basis: 300px; max-width: 400px; }
.nbdc-grid--4 > * { flex-basis: 240px; max-width: 330px; }

.nbdc-card {
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line); border-radius: var(--nbdc-radius-lg);
  padding: 34px 30px; box-shadow: 0 3px 16px rgba(11,18,24,.04);
  transition: transform .5s var(--nbdc-ease), box-shadow .5s var(--nbdc-ease), border-color .5s var(--nbdc-ease);
}
.nbdc-card:hover { transform: translateY(-7px); box-shadow: 0 26px 54px rgba(11,18,24,.12); border-color: transparent; }
.nbdc-card h3 { margin-bottom: 10px; }
.nbdc-card p:last-child { margin-bottom: 0; }
.nbdc-section--bg-navy .nbdc-card { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12); }

/* Service / condition cards */
.nbdc-service-card, .nbdc-condition-card {
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line); border-radius: var(--nbdc-radius-lg);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .5s var(--nbdc-ease), box-shadow .5s var(--nbdc-ease), border-color .5s var(--nbdc-ease);
}
.nbdc-service-card:hover, .nbdc-condition-card:hover { transform: translateY(-7px); box-shadow: 0 26px 54px rgba(11,18,24,.13); border-color: transparent; }
.nbdc-service-card__image { aspect-ratio: 16/10; overflow: hidden; background: var(--nbdc-tint); }
.nbdc-service-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--nbdc-ease); }
.nbdc-service-card:hover .nbdc-service-card__image img { transform: scale(1.06); }
.nbdc-service-card h3, .nbdc-condition-card h3 { padding: 26px 26px 0; margin-bottom: 8px; }
.nbdc-service-card__description, .nbdc-condition-card p { padding: 0 26px; color: var(--nbdc-text-soft); font-size: var(--step--1); }
.nbdc-service-card__link, .nbdc-condition-card a {
  margin: auto 26px 26px; padding-top: 14px; font-size: 12px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: var(--nbdc-blue);
  display: inline-flex; align-items: center; gap: 8px; transition: gap .4s var(--nbdc-ease);
}
.nbdc-service-card:hover .nbdc-service-card__link, .nbdc-condition-card:hover a { gap: 14px; }

/* ---------- Doctor card ---------- */
.nbdc-doctor-card { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: center; }
.nbdc-doctor-card--no-photo { grid-template-columns: 1fr; }
.nbdc-doctor-card__photo img { width: 100%; border-radius: var(--nbdc-radius-lg); box-shadow: 0 30px 70px rgba(11,18,24,.16); }
.nbdc-doctor-card__credentials { list-style: none; padding: 0; margin: 26px 0 0; }
.nbdc-doctor-card__credentials li {
  padding: 16px 0; border-top: 1px solid var(--nbdc-line);
  display: grid; grid-template-columns: 150px 1fr; gap: 18px; font-size: var(--step--1); color: var(--nbdc-text-soft); margin: 0;
}
@media (max-width: 900px) {
  .nbdc-doctor-card { grid-template-columns: 1fr; gap: 34px; }
  .nbdc-doctor-card__credentials li { grid-template-columns: 1fr; gap: 3px; }
}

/* ---------- CTA banner ---------- */
.nbdc-cta-banner {
  position: relative; overflow: hidden; text-align: center;
  background: var(--nbdc-ink); color: #fff; border-radius: 32px; padding: 84px 40px;
}
.nbdc-cta-banner::before {
  content: ""; position: absolute; top: -45%; left: 50%; transform: translateX(-50%);
  width: 900px; height: 900px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,113,189,.42) 0%, transparent 62%);
}
.nbdc-cta-banner > * { position: relative; }
.nbdc-cta-banner h2 { color: #fff; font-size: clamp(30px,4.4vw,56px); }
.nbdc-cta-banner p { color: rgba(255,255,255,.78); max-width: min(52ch,100%); margin-inline: auto; }
.nbdc-cta-banner__ctas { display: flex; gap: 13px; justify-content: center; flex-wrap: wrap; margin-top: 26px; }
.nbdc-cta-banner .nbdc-btn--primary { background: #fff; color: var(--nbdc-ink); }
.nbdc-cta-banner .nbdc-btn--primary:hover { background: var(--nbdc-blue); color: #fff; }
.nbdc-cta-banner .nbdc-btn--secondary { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.nbdc-cta-banner .nbdc-btn--secondary:hover { border-color: #fff; background: rgba(255,255,255,.06); }
@media (max-width: 640px) { .nbdc-cta-banner { padding: 60px 24px; border-radius: 24px; } }

/* ---------- FAQ ---------- */
.nbdc-faq { border-top: 1px solid var(--nbdc-line); }
.nbdc-faq__item { border-bottom: 1px solid var(--nbdc-line); }
.nbdc-faq__question {
  display: flex; justify-content: space-between; align-items: center; gap: 20px;
  padding: 26px 0; font-size: var(--step-1); font-weight: 600; cursor: pointer; list-style: none;
  transition: color .3s var(--nbdc-ease);
}
.nbdc-faq__question::-webkit-details-marker { display: none; }
.nbdc-faq__question::after { content: "+"; font-size: 26px; font-weight: 300; color: var(--nbdc-blue); transition: transform .45s var(--nbdc-ease); flex: none; }
.nbdc-faq__item[open] .nbdc-faq__question::after { transform: rotate(45deg); }
.nbdc-faq__question:hover { color: var(--nbdc-blue); }
.nbdc-faq__answer { padding: 0 0 26px; color: var(--nbdc-text-soft); max-width: min(70ch,100%); }
.nbdc-faq__answer p:last-child { margin-bottom: 0; }

/* ---------- Breadcrumbs ---------- */
/* ---- Breadcrumbs ------------------------------------------------------
   Drawn INSIDE the page hero on templates that have one (so they read as
   part of the composition instead of floating on a bare white strip), and
   as a tinted standalone bar on templates that do not. */
.nbdc-breadcrumbs { margin: 0 0 26px; }
.nbdc-breadcrumbs__list {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0;
  list-style: none; margin: 0; padding: 0;
  font-size: 13px; line-height: 1.4; letter-spacing: .01em; color: var(--nbdc-text-mute);
}
.nbdc-breadcrumbs__item { margin: 0; display: inline-flex; align-items: center; }
.nbdc-breadcrumbs__item + .nbdc-breadcrumbs__item::before {
  content: ""; flex: none; width: 5px; height: 5px; margin: 0 10px;
  border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor;
  transform: rotate(45deg); opacity: .45;
}
.nbdc-breadcrumbs__item a {
  color: var(--nbdc-text-soft); text-decoration: none; padding: 3px 0;
  border-bottom: 1px solid transparent; transition: color .18s var(--nbdc-ease), border-color .18s var(--nbdc-ease);
}
.nbdc-breadcrumbs__item a:hover,
.nbdc-breadcrumbs__item a:focus-visible { color: var(--nbdc-blue); border-bottom-color: currentColor; }
.nbdc-breadcrumbs__item [aria-current="page"] { color: var(--nbdc-text); font-weight: 500; }

/* Standalone bar — templates without a page hero */
.nbdc-breadcrumbs--bar {
  margin: 0; padding: 15px 0 14px;
  background: linear-gradient(180deg, var(--nbdc-blue-wash) 0%, var(--nbdc-tint) 100%);
  border-bottom: 1px solid var(--nbdc-line);
}

/* Hero-embedded breadcrumbs sit on tinted ground, so soften them slightly */
.nbdc-pagehero .nbdc-breadcrumbs__list { color: var(--nbdc-text-mute); }
.nbdc-pagehero--deep .nbdc-breadcrumbs__list { color: rgba(255,255,255,.62); }
.nbdc-pagehero--deep .nbdc-breadcrumbs__item a { color: rgba(255,255,255,.78); }
.nbdc-pagehero--deep .nbdc-breadcrumbs__item a:hover { color: #fff; }
.nbdc-pagehero--deep .nbdc-breadcrumbs__item [aria-current="page"] { color: #fff; }

@media (max-width: 620px) {
  .nbdc-breadcrumbs { margin-bottom: 18px; }
  .nbdc-breadcrumbs__list { font-size: 12px; }
  .nbdc-breadcrumbs__item + .nbdc-breadcrumbs__item::before { margin: 0 7px; }
}

/* ---------- Badges / meta ---------- */
.nbdc-badge { display: inline-block; padding: 7px 15px; border-radius: 100px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.nbdc-badge--navy { background: var(--nbdc-blue); color: #fff; }
.nbdc-badge--tint { background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark); }
.nbdc-badge--stone { background: var(--nbdc-tint); color: var(--nbdc-text-soft); }
.nbdc-meta { display: block; margin-top: 14px; font-size: var(--step--1); color: var(--nbdc-text-mute); font-style: normal; }

/* ---------- Hours / NAP ---------- */
.nbdc-hours { list-style: none; margin: 0; padding: 0; }
.nbdc-hours li { display: flex; justify-content: space-between; gap: 18px; padding: 9px 0; border-bottom: 1px solid var(--nbdc-line); font-size: var(--step--1); margin: 0; }
.nbdc-hours li:last-child { border-bottom: none; }
.nbdc-hours__day { color: var(--nbdc-text-soft); }
.nbdc-hours__time { font-weight: 600; }
.nbdc-nap__line { display: grid; grid-template-columns: 90px 1fr; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--nbdc-line); font-size: var(--step--1); }
.nbdc-nap__label { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--nbdc-text-mute); font-weight: 600; padding-top: 3px; }

/* ---------- Forms ---------- */
.nbdc-field { margin-bottom: 20px; }
.nbdc-field__label { display: block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--nbdc-text-soft); margin-bottom: 8px; }
.nbdc-field__optional { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--nbdc-text-mute); }
.nbdc-field__input, .nbdc-field__textarea {
  width: 100%; padding: 15px 18px; font: inherit; font-size: var(--step-0); color: var(--nbdc-text);
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line); border-radius: 12px;
  transition: border-color .3s var(--nbdc-ease), box-shadow .3s var(--nbdc-ease);
}
.nbdc-field__input:focus, .nbdc-field__textarea:focus { outline: none; border-color: var(--nbdc-blue); box-shadow: 0 0 0 4px rgba(0,113,189,.12); }
.nbdc-field__textarea { min-height: 140px; resize: vertical; }
.nbdc-honeypot { position: absolute !important; left: -9999px; }
.nbdc-lead-form, .nbdc-booking-lead-form { background: var(--nbdc-paper); border: 1px solid var(--nbdc-line); border-radius: var(--nbdc-radius-lg); padding: 32px; }

/* ---------- Booking module ---------- */
.nbdc-booking-module { display: grid; gap: 34px; }
.nbdc-booking-module__offer { background: var(--nbdc-blue-wash); border-radius: var(--nbdc-radius-lg); padding: 26px 30px; }
.nbdc-booking-module__ctas { display: flex; gap: 13px; flex-wrap: wrap; }
.nbdc-booking-embed { border-radius: var(--nbdc-radius-lg); overflow: hidden; border: 1px solid var(--nbdc-line); background: var(--nbdc-paper); }
.nbdc-booking-embed iframe { width: 100%; border: 0; display: block; }

/* ---------- Map / citations / misc ---------- */
.nbdc-map { border-radius: var(--nbdc-radius-lg); overflow: hidden; border: 1px solid var(--nbdc-line); }
.nbdc-map iframe { width: 100%; border: 0; display: block; }
.nbdc-citations { font-size: var(--step--1); color: var(--nbdc-text-soft); padding-left: 1.4em; }
.nbdc-citations li { margin-bottom: 12px; }
.nbdc-portrait { border-radius: var(--nbdc-radius-lg); overflow: hidden; }
.nbdc-review-aggregate { display: flex; align-items: center; gap: 10px; font-size: var(--step--1); }
.nbdc-review-aggregate__stars { color: #E0A23C; letter-spacing: 2px; }
.nbdc-review-aggregate__count { color: var(--nbdc-text-mute); }
.nbdc-search-form { display: flex; gap: 10px; }
.nbdc-search-form input[type="search"] { flex: 1; padding: 14px 18px; border: 1px solid var(--nbdc-line); border-radius: 12px; font: inherit; }

/* ---------- Footer ---------- */
.nbdc-footer { background: var(--nbdc-ink); color: rgba(255,255,255,.62); padding: 76px 0 30px; font-size: var(--step--1); }
.nbdc-footer__grid { display: grid; grid-template-columns: 1.7fr repeat(4, 1fr); gap: 40px; margin-bottom: 48px; }
.nbdc-footer__brand img { height: 106px; width: auto; margin-bottom: 18px; }
.nbdc-footer__brand .nbdc-logo__text { color: #fff; }
.nbdc-footer__brand .nbdc-logo__text span { color: rgba(255,255,255,.5); }
.nbdc-footer h2, .nbdc-footer h3, .nbdc-footer__contact-h {
  color: #fff; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 14px; font-weight: 700;
}
.nbdc-footer__list { list-style: none; margin: 0; padding: 0; }
.nbdc-footer__list li { margin-bottom: 9px; }
.nbdc-footer a { color: rgba(255,255,255,.62); }
.nbdc-footer a:hover { color: #6FB6E4; }
.nbdc-footer .nbdc-hours li { border-bottom-color: rgba(255,255,255,.1); }
.nbdc-footer .nbdc-hours__day { color: rgba(255,255,255,.5); }
.nbdc-footer .nbdc-hours__time { color: rgba(255,255,255,.8); }
.nbdc-footer__social { display: flex; gap: 14px; margin-top: 16px; }
.nbdc-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); padding-top: 24px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px; font-size: 12px; }
.nbdc-footer__bottom-links { display: flex; gap: 18px; flex-wrap: wrap; }
@media (max-width: 1000px) { .nbdc-footer__grid { grid-template-columns: 1fr 1fr 1fr; gap: 32px; } }
@media (max-width: 640px) { .nbdc-footer__grid { grid-template-columns: 1fr 1fr; } }

/* ---------- Landing pages (paid) ---------- */
body.nbdc-lp { padding-bottom: 4.75rem; background: var(--nbdc-paper); }
.nbdc-lp-topbar { padding: 14px 0; border-bottom: 1px solid var(--nbdc-line); background: var(--nbdc-paper); }
.nbdc-lp-hero { padding: clamp(2.5rem,6vw,4.5rem) 0 clamp(1.5rem,4vw,2.5rem); background: linear-gradient(170deg, var(--nbdc-bone) 0%, var(--nbdc-blue-wash) 100%); text-align: center; }
.nbdc-lp-hero h1 { margin: 0 auto .75rem; max-width: 20ch; font-size: clamp(34px,5vw,60px); }
.nbdc-lp-hero--has-media h1,
.nbdc-lp-hero--has-media .nbdc-lp-hero__sub { margin-left: 0; margin-right: 0; }
.nbdc-lp-hero__sub { margin: 0 auto 1.5rem; max-width: min(52ch,100%); font-size: var(--step-1); color: var(--nbdc-text-soft); }
.nbdc-lp-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.nbdc-lp-hero__trust { margin: 1.25rem 0 0; font-size: var(--step--1); color: var(--nbdc-text-mute); }
.nbdc-lp-proof { background: var(--nbdc-ink); color: #fff; padding: 1.1rem 0; }
.nbdc-lp-proof__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem 2rem; justify-content: center; text-align: center; }
.nbdc-lp-proof__list li { font-size: var(--step--1); font-weight: 600; margin: 0; }
.nbdc-lp-proof__list li::before { content: "\2713"; color: #6FB6E4; margin-right: .45rem; }
.nbdc-lp-symptoms { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: .6rem; }
.nbdc-lp-symptoms li { position: relative; padding-left: 1.9rem; margin: 0; }
.nbdc-lp-symptoms li::before {
  content: "\2713"; position: absolute; left: 0; top: .15rem; width: 1.3rem; height: 1.3rem; border-radius: 50%;
  background: var(--nbdc-blue-wash); color: var(--nbdc-blue); display: grid; place-items: center; font-size: .72rem; font-weight: 700;
}
.nbdc-lp-offer { background: var(--nbdc-ink); color: #fff; }
.nbdc-lp-offer h2 { color: #fff; }
.nbdc-lp-offer__body { max-width: min(46ch,100%); margin: 0 auto 1.5rem; color: rgba(255,255,255,.76); }
.nbdc-lp-steps { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1.25rem; }
.nbdc-lp-steps li { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; align-items: start; margin: 0; }
.nbdc-lp-steps__num { grid-row: span 2; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--nbdc-blue); color: #fff; display: grid; place-items: center; font-weight: 700; }
.nbdc-lp-steps li strong { font-size: var(--step-1); }
.nbdc-lp-steps li span:not(.nbdc-lp-steps__num) { color: var(--nbdc-text-soft); }
.nbdc-lp-location { color: #fff; }
.nbdc-lp-location h2, .nbdc-lp-location h3 { color: #fff; }
.nbdc-lp-location__grid { display: grid; gap: 2rem; }
.nbdc-lp-location__addr { color: rgba(255,255,255,.72); margin-bottom: 1.5rem; }
.nbdc-lp-footer { padding: 1.75rem 0; text-align: center; background: var(--nbdc-ink); color: rgba(255,255,255,.55); font-size: var(--step--1); }
.nbdc-lp-footer a { color: #6FB6E4; }
.nbdc-lp-footer__legal { margin: .5rem 0 0; opacity: .75; }
@media (min-width: 48rem) {
  body.nbdc-lp { padding-bottom: 0; }
  .nbdc-lp-location__grid { grid-template-columns: 1.3fr 1fr; gap: 3rem; }
  .nbdc-lp-steps { grid-template-columns: repeat(3,1fr); gap: 2rem; }
  .nbdc-lp-steps li { grid-template-columns: 1fr; }
  .nbdc-lp-steps__num { grid-row: auto; }
}

/* ---------- Motion ---------- */
.nbdc-reveal { opacity: 0; transform: translateY(34px); transition: opacity .95s var(--nbdc-ease), transform .95s var(--nbdc-ease); }
.nbdc-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .nbdc-reveal { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ---------- Narrow screens ---------- */
@media (max-width: 620px) {
  .nbdc-container { padding: 0 22px; }
  .nbdc-section { padding: 68px 0; }
  .nbdc-section--sm { padding: 48px 0; }
  .nbdc-hero { padding: 60px 0 56px; }
  .nbdc-hero__ctas { flex-direction: column; align-items: stretch; }
  .nbdc-hero__ctas .nbdc-btn { width: 100%; }
}

/* ---------- Print ---------- */
@media print {
  .nbdc-header, .nbdc-footer, .nbdc-cta-banner, .nbdc-lp-callbar { display: none; }
  body { background: #fff; color: #000; }
  body::after { display: none; }
}

/* ====================================================================
   V3-C page architecture — components the mockup uses that the old
   templates had no equivalent for. Added so front-page.php can render
   the approved structure, not just the approved palette.
   ==================================================================== */

/* ---- Full-bleed hero (replaces the 2-column card hero on the homepage) ---- */
.nbdc-hero--full { min-height: 88vh; display: flex; align-items: center; padding: 150px 0 90px; overflow: hidden; }
.nbdc-hero--full::before { display: none; }
.nbdc-hero__media { position: absolute; inset: 0; z-index: 0; }
.nbdc-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 58% 40%;
  filter: contrast(1.02) saturate(1.04); transform: scale(1.06); border-radius: 0; box-shadow: none; }
.nbdc-hero__media::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(92deg, var(--nbdc-bone) 6%, rgba(250,251,252,.96) 36%, rgba(250,251,252,.62) 62%, rgba(250,251,252,.18) 100%); }
.nbdc-hero--full .nbdc-container { position: relative; z-index: 3; }
.nbdc-hero--full .nbdc-hero__grid { grid-template-columns: 1fr; max-width: 900px; }
.nbdc-hero--full .nbdc-hero__headline { font-size: clamp(46px,7vw,104px); }
.nbdc-hero__spine { position: absolute; right: 6%; top: 50%; transform: translateY(-50%); z-index: 2; width: min(300px,24vw); opacity: .55; pointer-events: none; }
.nbdc-hero__spine path, .nbdc-hero__spine line { stroke: var(--nbdc-blue); stroke-width: 1.4; fill: none;
  stroke-dasharray: var(--len); stroke-dashoffset: var(--len); animation: nbdc-draw 3.4s var(--nbdc-ease) .5s forwards; }
@keyframes nbdc-draw { to { stroke-dashoffset: 0; } }
.nbdc-hero__spine circle { fill: var(--nbdc-blue); opacity: 0; animation: nbdc-pop .5s var(--nbdc-ease) forwards; }
@keyframes nbdc-pop { to { opacity: .85; } }
.nbdc-hero__cue { position: absolute; left: 38px; bottom: 40px; z-index: 4; display: flex; align-items: center; gap: 14px;
  font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--nbdc-text-mute); }
.nbdc-hero__cue span { width: 52px; height: 1px; background: var(--nbdc-line-strong); position: relative; overflow: hidden; }
.nbdc-hero__cue span::after { content: ""; position: absolute; inset: 0; background: var(--nbdc-blue); transform: translateX(-100%); animation: nbdc-sweep 2.4s var(--nbdc-ease) infinite; }
@keyframes nbdc-sweep { 50% { transform: none; } 100% { transform: translateX(100%); } }
@media (max-width: 960px) { .nbdc-hero__spine { display: none; } .nbdc-hero--full { min-height: auto; padding: 120px 0 70px; } }

/* ---- Marquee ---- */
.nbdc-marquee { border-top: 1px solid var(--nbdc-line); border-bottom: 1px solid var(--nbdc-line); padding: 26px 0;
  overflow: hidden; background: var(--nbdc-paper);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%, #000 70%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 30%, #000 70%, transparent); }
.nbdc-marquee__track { display: flex; width: max-content; animation: nbdc-roll 38s linear infinite; }
.nbdc-marquee__track > span { display: inline-flex; align-items: center; gap: 46px; padding-right: 46px;
  font-size: clamp(20px,2.4vw,34px); font-weight: 600; letter-spacing: -.03em; color: rgba(11,18,24,.14); white-space: nowrap; }
.nbdc-marquee__track b { color: var(--nbdc-blue); font-weight: 600; }
.nbdc-marquee__track i { font-style: normal; color: rgba(11,18,24,.1); }
@keyframes nbdc-roll { to { transform: translateX(-50%); } }

/* ---- Method: sticky index + stepped detail ---- */
.nbdc-method { display: grid; grid-template-columns: 1fr 1.05fr; gap: 90px; align-items: start; }
.nbdc-method__index { position: sticky; top: 140px; }
.nbdc-method__index h2 { font-size: clamp(32px,3.4vw,52px); margin: 20px 0; }
.nbdc-method__index p { color: var(--nbdc-text-soft); font-size: 17px; max-width: min(44ch,100%); margin-bottom: 36px; }
.nbdc-method__index ol { list-style: none; counter-reset: nbm; margin: 0; padding: 0; }
.nbdc-method__index li { counter-increment: nbm; padding: 22px 0; border-top: 1px solid var(--nbdc-line);
  display: flex; gap: 20px; align-items: baseline; color: var(--nbdc-text-mute); transition: color .5s var(--nbdc-ease); margin: 0; }
.nbdc-method__index li::before { content: "0" counter(nbm); font-size: 12px; letter-spacing: .16em; transition: color .5s var(--nbdc-ease); }
.nbdc-method__index li span { font-size: clamp(22px,2.4vw,32px); font-weight: 600; letter-spacing: -.03em; }
.nbdc-method__index li.is-active { color: var(--nbdc-text); }
.nbdc-method__index li.is-active::before { color: var(--nbdc-blue); }
.nbdc-method__index .nbdc-btn { margin-top: 32px; }
.nbdc-method__step { padding: 56px 0; border-bottom: 1px solid var(--nbdc-line); }
.nbdc-method__step:first-child { padding-top: 0; }
.nbdc-method__step figure { margin: 0 0 26px; border-radius: var(--nbdc-radius); overflow: hidden; aspect-ratio: 16/10; }
.nbdc-method__step img { width: 100%; height: 100%; object-fit: cover; filter: contrast(1.02) saturate(1.04);
  transform: scale(1.02); transition: transform 1.4s var(--nbdc-ease); }
.nbdc-method__step:hover img { transform: scale(1.07); }
.nbdc-method__step h3 { font-size: clamp(26px,2.8vw,40px); margin-bottom: 12px; }
.nbdc-method__step p { color: var(--nbdc-text-soft); font-size: 17px; max-width: min(52ch,100%); margin: 0; }
@media (max-width: 1000px) { .nbdc-method { grid-template-columns: 1fr; gap: 44px; } .nbdc-method__index { position: static; } }

/* ---- Conditions as full-width rows with persistent thumbnails ---- */
.nbdc-condition-list { border-top: 1px solid var(--nbdc-line); }
.nbdc-condition-row { display: grid; grid-template-columns: 64px 132px 1fr auto; gap: 28px; align-items: center;
  padding: 44px 0; border-bottom: 1px solid var(--nbdc-line); transition: padding .6s var(--nbdc-ease); }
.nbdc-condition-row:hover { padding-left: 26px; }
.nbdc-condition-row__idx { font-size: 12px; letter-spacing: .18em; color: var(--nbdc-text-mute); transition: color .5s var(--nbdc-ease); }
.nbdc-condition-row__thumb { width: 132px; aspect-ratio: 4/3; border-radius: var(--nbdc-radius); overflow: hidden; }
.nbdc-condition-row__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--nbdc-ease); }
.nbdc-condition-row:hover .nbdc-condition-row__thumb img { transform: scale(1.08); }
.nbdc-condition-row h3 { font-size: clamp(26px,3.4vw,50px); margin: 0; transition: color .5s var(--nbdc-ease); }
.nbdc-condition-row p { color: var(--nbdc-text-soft); font-size: 15px; margin: 8px 0 0; max-width: min(46ch,100%); }
.nbdc-condition-row__arrow { font-size: 22px; color: var(--nbdc-text-mute); transition: transform .6s var(--nbdc-ease), color .5s var(--nbdc-ease); }
.nbdc-condition-row:hover .nbdc-condition-row__idx,
.nbdc-condition-row:hover .nbdc-condition-row__arrow { color: var(--nbdc-blue); }
.nbdc-condition-row:hover .nbdc-condition-row__arrow { transform: translateX(10px); }
@media (max-width: 860px) {
  .nbdc-condition-row { grid-template-columns: 56px 92px 1fr; gap: 16px; padding: 26px 0; }
  .nbdc-condition-row__arrow { display: none; }
  .nbdc-condition-row__thumb { width: 92px; }
}

/* ---- Big pull-quote ---- */
.nbdc-pullquote { text-align: center; }
.nbdc-pullquote blockquote { font-size: clamp(28px,4.6vw,70px); font-weight: 600; letter-spacing: -.045em;
  line-height: 1.06; max-width: 18ch; margin: 26px auto 0; }
.nbdc-pullquote em { font-style: normal; color: var(--nbdc-blue); }
.nbdc-pullquote__who { margin-top: 40px; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--nbdc-text-mute); }

/* ---- Offer: oversized figure with radial glow ---- */
.nbdc-offer-hero { position: relative; overflow: hidden; text-align: center; padding: 150px 0;
  background: var(--nbdc-ink); color: #fff; }
.nbdc-offer-hero::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 1200px; height: 1200px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,144,240,.34) 0%, rgba(0,113,189,.1) 40%, transparent 66%); }
.nbdc-offer-hero > * { position: relative; }
.nbdc-offer-hero__figure { font-size: clamp(90px,20vw,260px); font-weight: 600; letter-spacing: -.06em; line-height: .86;
  background: linear-gradient(170deg,#fff 24%,#6FB6E4 78%); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; margin: 16px 0 6px; }
.nbdc-offer-hero h2 { font-size: clamp(22px,2.6vw,38px); font-weight: 500; color: rgba(255,255,255,.7); margin-bottom: 34px; }
.nbdc-offer-hero .nbdc-eyebrow { color: #6FB6E4; }
.nbdc-offer-hero__fine { font-size: 13px; color: rgba(255,255,255,.5); margin: 26px auto 0; max-width: min(52ch,100%); }

@media (prefers-reduced-motion: reduce) {
  .nbdc-marquee__track, .nbdc-hero__cue span::after { animation: none; }
  .nbdc-hero__spine path, .nbdc-hero__spine line { animation: none; stroke-dashoffset: 0; }
  .nbdc-hero__spine circle { animation: none; opacity: .85; }
}
@media (max-width: 620px) { .nbdc-hero__cue { left: 22px; } }

/* ---- Transparent header over a full-bleed hero (matches the mockup) ----
   The header only gains its blurred background once scrolled, so the hero
   image runs edge-to-edge beneath it instead of starting below a white band. */
/* Header is sticky (not fixed) on every page, including home. Fixed positioning
   put it on top of the announce bar and left it covering content on scroll. */
body.home .nbdc-hero--full { padding-top: 72px; }
/* Long ACF headlines need a slightly tighter cap so the CTAs stay above the fold. */
.nbdc-hero--full .nbdc-hero__headline { font-size: clamp(42px,5.6vw,84px); }

/* ====================================================================
   Round-4 consistency pass — sections the design phase never covered,
   brought onto the same editorial language as the approved sections.
   ==================================================================== */

/* ---- Services: editorial tiles, not floating rounded widgets ----
   Hairline grid matching the condition rows: square corners, no shadow,
   no lift. The grid itself carries the structure. */
.nbdc-service-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0;
  border-top: 1px solid var(--nbdc-line); border-left: 1px solid var(--nbdc-line); }
/* Per-cell borders rather than gap-as-border: an incomplete final row leaves
   clean empty space instead of painting the grid background through it. */
.nbdc-service-grid > * { border-right: 1px solid var(--nbdc-line); border-bottom: 1px solid var(--nbdc-line); background: transparent; }
.nbdc-service-grid .nbdc-service-card {
  border: 0; border-radius: 0; box-shadow: none; padding: 40px 34px;
  transition: background .5s var(--nbdc-ease);
}
.nbdc-service-grid .nbdc-service-card:hover { transform: none; box-shadow: none; background: var(--nbdc-paper); }
.nbdc-service-grid .nbdc-service-card h3 { padding: 0; margin-bottom: 12px; font-size: var(--step-2); }
.nbdc-service-grid .nbdc-service-card__description { padding: 0; margin-bottom: 20px; }
.nbdc-service-grid .nbdc-service-card__link { margin: auto 0 0; padding-top: 0; }
.nbdc-service-grid .nbdc-service-card__image { margin: -40px -34px 24px; border-radius: 0; aspect-ratio: 16/9; }
@media (max-width: 980px) { .nbdc-service-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .nbdc-service-grid { grid-template-columns: 1fr; } }

/* ---- Doctor: square-edged editorial portrait + credential table ---- */
.nbdc-doctor-card { grid-template-columns: .78fr 1.22fr; gap: 72px; align-items: center; }
.nbdc-doctor-card__photo img { border-radius: var(--nbdc-radius); box-shadow: none; }
.nbdc-doctor-card__body h2 { font-size: clamp(32px,4vw,58px); margin-bottom: 20px; }
/* credentials become a label/value table rather than pill badges */
.nbdc-doctor-card__credentials { display: block; margin-top: 28px; }
.nbdc-doctor-card__credentials .nbdc-badge {
  display: block; background: none; padding: 15px 0; border-top: 1px solid var(--nbdc-line);
  border-radius: 0; color: var(--nbdc-text-soft); font-size: var(--step--1);
  letter-spacing: .01em; text-transform: none; font-weight: 500; text-align: left;
}
.nbdc-doctor-card__credentials .nbdc-badge::before { content: "— "; color: var(--nbdc-blue); }

/* The V3-C rules above re-declare .nbdc-doctor-card outside any media query, so
   they overrode the earlier mobile stacking rule and the card stayed two-column
   on phones — squeezing Dr. Brock's photo into a ~90px sliver. Restack here,
   after those rules, and cap the portrait so it does not dominate the screen. */
@media (max-width: 860px) {
  .nbdc-doctor-card { grid-template-columns: 1fr; gap: 30px; }
  .nbdc-doctor-card__photo { max-width: 320px; margin: 0 auto; width: 100%; }
  .nbdc-doctor-card__photo img {
    width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 22%;
    border-radius: var(--nbdc-radius-lg);
  }
}

/* ---- Pull-quote: dialled down from display-scale to readable ---- */
.nbdc-pullquote blockquote { font-size: clamp(24px,3.1vw,44px); max-width: 24ch; line-height: 1.16; }
.nbdc-pullquote__who { margin-top: 30px; }

/* ---- Kill the rounded-corner white gap and the double dark band ----
   .nbdc-cta-banner sat inside a light section with a 32px radius, so the
   page background showed through its corners directly beneath the dark
   offer block. Flush + square whenever it follows the offer. */
.nbdc-offer-hero + .nbdc-section .nbdc-cta-banner,
.nbdc-offer-hero + .nbdc-cta-banner { border-radius: 0; }
.nbdc-cta-banner--flush { border-radius: 0; margin: 0; }
/* Homepage already closes with the $39 offer — a second CTA is redundant. */
body.home .nbdc-cta-banner { display: none; }

/* ---- Footer: balanced 5-up, hours no longer a bulky orphan row ---- */
.nbdc-footer { padding: 68px 0 26px; }
/* six children: brand + Services + Conditions + New Patients + Areas + Contact */
.nbdc-footer__grid { grid-template-columns: 1.7fr .85fr .85fr .85fr .85fr 1.15fr; gap: 38px; align-items: start; margin-bottom: 40px; }
.nbdc-hours--compact li { display: grid; grid-template-columns: 4.6em 1fr; gap: 8px; padding: 4px 0; }
.nbdc-hours--compact .nbdc-hours__time { font-weight: 500; color: rgba(255,255,255,.8); }
.nbdc-footer__brand img { height: 88px; margin-bottom: 16px; }
.nbdc-footer__brand p { max-width: 34ch; font-size: var(--step--1); line-height: 1.6; }
.nbdc-footer .nbdc-hours { font-size: 13px; }
.nbdc-footer .nbdc-hours li { padding: 5px 0; border-bottom: 0; gap: 10px; }
.nbdc-footer .nbdc-hours__day { min-width: 3.2em; }
.nbdc-footer__contact-h { margin-top: 0; }
@media (max-width: 1200px) { .nbdc-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.1fr; } }
@media (max-width: 900px)  { .nbdc-footer__grid { grid-template-columns: 1fr 1fr 1fr; gap: 30px; } }
@media (max-width: 700px)  { .nbdc-footer__grid { grid-template-columns: 1fr 1fr; gap: 28px; } }
@media (max-width: 460px)  { .nbdc-footer__grid { grid-template-columns: 1fr; } }

/* ---- Nav dropdown: stylised ---- */
.nbdc-nav__dropdown {
  left: -22px; min-width: 288px; padding: 10px; border-radius: 16px;
  border: 1px solid var(--nbdc-line);
  background: rgba(255,255,255,.92); backdrop-filter: blur(26px) saturate(1.6);
  box-shadow: 0 28px 60px rgba(11,18,24,.16), 0 2px 6px rgba(11,18,24,.05);
  transform: translateY(12px) scale(.98); transform-origin: top left;
}
.nbdc-nav__item--has-dropdown:hover .nbdc-nav__dropdown,
.nbdc-nav__item--has-dropdown:focus-within .nbdc-nav__dropdown { transform: none; }
/* little pointer up into the nav item */
.nbdc-nav__dropdown::before {
  content: ""; position: absolute; top: -6px; left: 34px; width: 12px; height: 12px;
  background: inherit; border-left: 1px solid var(--nbdc-line); border-top: 1px solid var(--nbdc-line);
  transform: rotate(45deg); border-radius: 2px 0 0 0;
}
.nbdc-nav__dropdown a {
  position: relative; padding: 12px 16px 12px 30px; border-radius: 10px; font-weight: 500;
}
.nbdc-nav__dropdown a::before {
  content: ""; position: absolute; left: 14px; top: 50%; width: 5px; height: 5px; border-radius: 50%;
  background: var(--nbdc-line-strong); transform: translateY(-50%) scale(.6);
  transition: background .3s var(--nbdc-ease), transform .3s var(--nbdc-ease);
}
.nbdc-nav__dropdown a:hover { background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark); }
.nbdc-nav__dropdown a:hover::before { background: var(--nbdc-blue); transform: translateY(-50%) scale(1); }
@media (max-width: 1080px) {
  .nbdc-nav__dropdown { background: none; backdrop-filter: none; box-shadow: none; transform: none; }
  .nbdc-nav__dropdown::before { display: none; }
}

/* ====================================================================
   Round-5: stylised page heroes, reviews module, offer hierarchy
   ==================================================================== */

/* ---- Page hero -------------------------------------------------------
   Six variants inside the brand palette. One flat gradient on 20 pages read
   unfinished; each section of the site now gets its own gradient geometry,
   accent wash and motif. The base rules below are shared by all of them.

   Padding note: the 132px top padding here dated from the fixed-header era
   (pre-2.7.1). The header is sticky now and sits in flow, so that padding was
   dead space — it is why every interior page opened with an empty band. */
.nbdc-pagehero {
  position: relative; overflow: hidden; isolation: isolate;
  padding: 56px 0 68px;
  background: var(--nbdc-bone);
  border-bottom: 1px solid var(--nbdc-line);
}
.nbdc-pagehero > .nbdc-container { position: relative; z-index: 2; }
.nbdc-pagehero h1 { font-size: clamp(34px,4.6vw,62px); margin: 12px 0 18px; max-width: 20ch; }
.nbdc-pagehero__lead { font-size: var(--step-1); color: var(--nbdc-text-soft); max-width: min(58ch,100%); margin-bottom: 28px; }
.nbdc-pagehero .nbdc-hero__ctas { display: flex; gap: 13px; flex-wrap: wrap; }

/* Shared decorative layers — each variant paints these differently. */
.nbdc-pagehero::before,
.nbdc-pagehero::after { content: ""; position: absolute; pointer-events: none; z-index: 0; }

/* --- wash: the original soft blue bloom (default / paperwork) --- */
.nbdc-pagehero--wash {
  background: linear-gradient(165deg, var(--nbdc-blue-wash) 0%, var(--nbdc-bone) 62%, var(--nbdc-bone) 100%);
}
.nbdc-pagehero--wash::before {
  top: -340px; right: -180px; width: 820px; height: 820px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,113,189,.16) 0%, transparent 66%);
}
.nbdc-pagehero--wash::after {
  right: 4%; top: 50%; transform: translateY(-50%);
  width: 240px; height: 320px; opacity: .16;
  background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 420'%3E%3Cg fill='none' stroke='%230071BD' stroke-width='2'%3E%3Cpath d='M60 8C40 60 82 110 58 165 36 218 80 262 60 318 44 362 62 392 60 412'/%3E%3Cpath d='M24 52h72M24 106h72M24 160h72M24 214h72M24 268h72M24 322h72'/%3E%3C/g%3E%3C/svg%3E");
}

/* --- mesh: overlapping radial blooms (services) --- */
.nbdc-pagehero--mesh {
  background:
    radial-gradient(680px 420px at 88% 6%,  rgba(0,113,189,.20) 0%, transparent 70%),
    radial-gradient(520px 380px at 8% 92%,  rgba(29,134,204,.14) 0%, transparent 72%),
    linear-gradient(160deg, var(--nbdc-blue-wash) 0%, var(--nbdc-bone) 58%);
}
.nbdc-pagehero--mesh::before {
  inset: 0; opacity: .5;
  background-image:
    radial-gradient(rgba(0,113,189,.20) 1px, transparent 1.2px);
  background-size: 22px 22px;
  -webkit-mask-image: linear-gradient(115deg, transparent 42%, #000 100%);
          mask-image: linear-gradient(115deg, transparent 42%, #000 100%);
}

/* --- contour: topographic lines (conditions) --- */
.nbdc-pagehero--contour {
  background: linear-gradient(150deg, #E4EFF8 0%, var(--nbdc-bone) 60%, var(--nbdc-bone) 100%);
}
.nbdc-pagehero--contour::before {
  inset: 0; opacity: .55;
  background: no-repeat right center/cover url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 500' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%230071BD' stroke-opacity='.22' stroke-width='1.4'%3E%3Cpath d='M-40 430C180 380 300 300 520 300s380 70 560 20 240-120 240-120'/%3E%3Cpath d='M-40 470C180 420 300 340 520 340s380 70 560 20 240-120 240-120'/%3E%3Cpath d='M-40 390C180 340 300 260 520 260s380 70 560 20 240-120 240-120'/%3E%3Cpath d='M-40 350C180 300 300 220 520 220s380 70 560 20 240-120 240-120'/%3E%3Cpath d='M-40 310C180 260 300 180 520 180s380 70 560 20 240-120 240-120'/%3E%3C/g%3E%3C/svg%3E");
}

/* --- tide: layered horizontal bands (areas / contact) --- */
.nbdc-pagehero--tide {
  background: linear-gradient(115deg, var(--nbdc-blue-wash) 0%, #F3F8FC 45%, var(--nbdc-bone) 100%);
}
.nbdc-pagehero--tide::before {
  right: -8%; bottom: -60%; width: 780px; height: 780px; border-radius: 46% 54% 58% 42%/48% 42% 58% 52%;
  background: linear-gradient(140deg, rgba(0,113,189,.16), rgba(0,113,189,0));
  transform: rotate(-12deg);
}
.nbdc-pagehero--tide::after {
  left: -140px; top: -160px; width: 420px; height: 420px; border-radius: 50%;
  border: 1px solid rgba(0,113,189,.18);
  box-shadow: 0 0 0 34px rgba(0,113,189,.045), 0 0 0 78px rgba(0,113,189,.03);
}

/* --- dawn: warm-neutral lift (new patient special) --- */
.nbdc-pagehero--dawn {
  background:
    radial-gradient(720px 460px at 50% -10%, rgba(0,113,189,.18) 0%, transparent 68%),
    linear-gradient(180deg, #EFF5FA 0%, #FBFAF7 55%, var(--nbdc-bone) 100%);
}
.nbdc-pagehero--dawn::before {
  inset: 0;
  background: repeating-linear-gradient(135deg, rgba(0,113,189,.05) 0 2px, transparent 2px 16px);
  -webkit-mask-image: radial-gradient(circle at 50% 0%, #000 0%, transparent 72%);
          mask-image: radial-gradient(circle at 50% 0%, #000 0%, transparent 72%);
}

/* --- deep: dark, high-intent (book appointment) --- */
.nbdc-pagehero--deep {
  background:
    radial-gradient(760px 520px at 82% 12%, rgba(29,134,204,.42) 0%, transparent 66%),
    linear-gradient(150deg, #072B45 0%, #0B1218 68%);
  border-bottom-color: rgba(255,255,255,.10);
}
.nbdc-pagehero--deep::before {
  inset: 0; opacity: .5;
  background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1.2px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(120deg, transparent 38%, #000 100%);
          mask-image: linear-gradient(120deg, transparent 38%, #000 100%);
}
.nbdc-pagehero--deep::after {
  right: 5%; top: 50%; transform: translateY(-50%);
  width: 240px; height: 320px; opacity: .3;
  background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 420'%3E%3Cg fill='none' stroke='%236FC0F0' stroke-width='2'%3E%3Cpath d='M60 8C40 60 82 110 58 165 36 218 80 262 60 318 44 362 62 392 60 412'/%3E%3Cpath d='M24 52h72M24 106h72M24 160h72M24 214h72M24 268h72M24 322h72'/%3E%3C/g%3E%3C/svg%3E");
}
.nbdc-pagehero--deep h1,
.nbdc-pagehero--deep .nbdc-stat__value { color: #fff; }
.nbdc-pagehero--deep .nbdc-eyebrow { color: #6FC0F0; }
.nbdc-pagehero--deep .nbdc-pagehero__lead,
.nbdc-pagehero--deep p { color: rgba(255,255,255,.78); }
.nbdc-pagehero--deep .nbdc-btn--secondary,
.nbdc-pagehero--deep .nbdc-btn--ghost {
  background: rgba(255,255,255,.07); color: #fff; border-color: rgba(255,255,255,.34);
}
.nbdc-pagehero--deep .nbdc-btn--secondary:hover,
.nbdc-pagehero--deep .nbdc-btn--ghost:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.6); }

@media (max-width: 900px) {
  .nbdc-pagehero { padding: 40px 0 52px; }
  .nbdc-pagehero--wash::after,
  .nbdc-pagehero--deep::after { display: none; }
}
@media (max-width: 620px) {
  .nbdc-pagehero { padding: 30px 0 42px; }
  .nbdc-pagehero h1 { max-width: 100%; }
}

/* ---- Reviews: rating header + horizontal scroller + GMB link ---- */
.nbdc-reviews__head { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 34px; }
.nbdc-rating { display: flex; align-items: center; gap: 16px; }
.nbdc-rating__score { font-size: clamp(38px,4.6vw,62px); font-weight: 600; letter-spacing: -.045em; line-height: 1; color: var(--nbdc-blue); }
.nbdc-rating__stars { color: #E0A23C; font-size: 20px; letter-spacing: 3px; line-height: 1; }
.nbdc-rating__meta { font-size: var(--step--1); color: var(--nbdc-text-soft); margin-top: 5px; }
.nbdc-reviews__scroller {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(320px, 380px); gap: 20px;
  overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 22px;
  scrollbar-width: thin; scrollbar-color: var(--nbdc-line-strong) transparent;
}
.nbdc-reviews__scroller::-webkit-scrollbar { height: 6px; }
.nbdc-reviews__scroller::-webkit-scrollbar-thumb { background: var(--nbdc-line-strong); border-radius: 3px; }
.nbdc-review {
  scroll-snap-align: start; background: var(--nbdc-paper); border: 1px solid var(--nbdc-line);
  border-radius: var(--nbdc-radius-lg); padding: 28px 26px; display: flex; flex-direction: column;
}
.nbdc-review__stars { color: #E0A23C; letter-spacing: 2px; margin-bottom: 12px; font-size: 15px; }
.nbdc-review__body { color: var(--nbdc-text-soft); font-size: 15px; margin: 0 0 16px; }
.nbdc-review__who { margin-top: auto; font-weight: 600; font-size: 14px; }
.nbdc-review__who small { display: block; color: var(--nbdc-blue); font-weight: 500; margin-top: 2px; }
.nbdc-reviews__more { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; }
.nbdc-reviews__hint { font-size: 12px; color: var(--nbdc-text-mute); letter-spacing: .04em; }

/* ---- Offer: the perks must not be tiny next to a giant number ---- */
.nbdc-offer-hero__includes {
  list-style: none; margin: 30px auto 0; padding: 0; max-width: 640px;
  display: grid; grid-template-columns: repeat(2,1fr); gap: 12px 30px; text-align: left;
}
.nbdc-offer-hero__includes li {
  display: flex; gap: 12px; align-items: flex-start; margin: 0;
  font-size: var(--step-0); color: rgba(255,255,255,.92);
}
.nbdc-offer-hero__includes li::before {
  content: "\2713"; color: #6FB6E4; font-weight: 700; flex: none; line-height: 1.5;
}
.nbdc-offer-hero__value { font-size: var(--step-1); color: rgba(255,255,255,.72); margin: 20px 0 30px; }
.nbdc-offer-hero__value b { color: #fff; }
@media (max-width: 640px) { .nbdc-offer-hero__includes { grid-template-columns: 1fr; text-align: left; } }

/* ---- Themed cards for conditions/areas index pages ---- */
.nbdc-tile-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0;
  border-top: 1px solid var(--nbdc-line); border-left: 1px solid var(--nbdc-line); }
.nbdc-tile { display: flex; flex-direction: column; padding: 34px 30px; text-decoration: none;
  border-right: 1px solid var(--nbdc-line); border-bottom: 1px solid var(--nbdc-line);
  transition: background .45s var(--nbdc-ease); }
.nbdc-tile:hover { background: var(--nbdc-paper); }
.nbdc-tile h3 { font-size: var(--step-2); margin-bottom: 10px; }
.nbdc-tile p { color: var(--nbdc-text-soft); font-size: var(--step--1); margin-bottom: 18px; }
.nbdc-tile__link { margin-top: auto; font-size: 12px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--nbdc-blue); display: inline-flex; gap: 8px; transition: gap .4s var(--nbdc-ease); }
.nbdc-tile:hover .nbdc-tile__link { gap: 14px; }
@media (max-width: 980px) { .nbdc-tile-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px) { .nbdc-tile-grid { grid-template-columns: 1fr; } }

/* ====================================================================
   Round-6: contact / booking / paperwork / offer components
   ==================================================================== */

.nbdc-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
@media (max-width: 900px) { .nbdc-contact-grid { grid-template-columns: 1fr; gap: 40px; } }

.nbdc-map iframe { width: 100%; min-height: 320px; display: block; border: 0; }
.nbdc-map__links { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 14px; font-size: var(--step--1); font-weight: 600; }

.nbdc-contact-form .nbdc-lead-form { margin-top: 18px; }
.nbdc-contact-form fieldset { border: 0; padding: 0; margin: 0 0 20px; }
.nbdc-contact-form legend { padding: 0; }
.nbdc-lead-form label input[type="checkbox"],
.nbdc-lead-form label input[type="radio"] { margin-right: 8px; accent-color: var(--nbdc-blue); }
.nbdc-lead-form fieldset label { display: inline-flex; align-items: center; margin: 0 18px 8px 0; font-size: var(--step--1); }
.nbdc-rw-forms { margin: 20px 0 8px; min-height: 120px; }

/* Offer card — used on booking + special-offer pages */
.nbdc-offer-card {
  display: grid; grid-template-columns: 1.4fr .6fr; gap: 44px; align-items: center;
  background: var(--nbdc-ink); color: #fff; border-radius: var(--nbdc-radius-lg);
  padding: 46px 48px; position: relative; overflow: hidden;
}
.nbdc-offer-card::before {
  content: ""; position: absolute; top: -60%; right: -10%; width: 620px; height: 620px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,113,189,.45) 0%, transparent 64%);
}
.nbdc-offer-card > * { position: relative; }
.nbdc-offer-card h2 { color: #fff; font-size: clamp(26px,3.2vw,42px); margin-bottom: 18px; }
.nbdc-offer-card .nbdc-eyebrow { color: #6FB6E4; }
.nbdc-offer-card__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.nbdc-offer-card__list li { display: flex; gap: 11px; align-items: flex-start; margin: 0; color: rgba(255,255,255,.9); }
.nbdc-offer-card__list li::before { content: "\2713"; color: #6FB6E4; font-weight: 700; flex: none; }
.nbdc-offer-card__price { text-align: center; }
.nbdc-offer-card__was { display: block; font-size: var(--step--1); color: rgba(255,255,255,.5); text-decoration: line-through; }
.nbdc-offer-card__now { display: block; font-size: clamp(52px,6vw,84px); font-weight: 600; letter-spacing: -.05em; line-height: 1; margin: 6px 0 20px;
  background: linear-gradient(170deg,#fff 26%,#6FB6E4 82%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
@media (max-width: 820px) { .nbdc-offer-card { grid-template-columns: 1fr; gap: 30px; padding: 36px 28px; text-align: left; } }

/* ====================================================================
   Round-7: announce bar, persistent header CTAs, mobile drawer, dock
   ==================================================================== */

/* ---- Pre-header offer bar ---- */
.nbdc-announce { background: var(--nbdc-ink); color: #fff; font-size: 14px; }
.nbdc-announce__inner { display: flex; align-items: center; justify-content: center; gap: 10px 22px; flex-wrap: wrap; padding-top: 9px; padding-bottom: 9px; }
.nbdc-announce__deal { display: inline-flex; align-items: center; gap: 10px; color: #fff; }
.nbdc-announce__deal:hover { color: #fff; }
.nbdc-announce__price { background: var(--nbdc-blue); color: #fff; font-weight: 700; padding: 2px 10px; border-radius: 100px; font-size: 13px; flex: none; }
.nbdc-announce__text { color: rgba(255,255,255,.82); }
.nbdc-announce__cta { color: #6FB6E4; font-weight: 600; white-space: nowrap; }
.nbdc-announce__cta:hover { color: #fff; }
@media (max-width: 720px) {
  .nbdc-announce { font-size: 13px; position: relative; z-index: 101; }
  .nbdc-announce__inner { gap: 4px 14px; padding-top: 8px; padding-bottom: 8px; }
  .nbdc-announce__text { display: none; }
  .nbdc-announce__deal::after { content: "New Patient Special"; color: rgba(255,255,255,.86); }
  .nbdc-announce__cta { font-size: 12.5px; }
}

/* ---- Header: persistent call + book, all breakpoints ---- */
.nbdc-header__inner { gap: 16px; }
.nbdc-header__actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.nbdc-header__call { padding: 12px 18px; gap: 8px; font-size: 14px; }
.nbdc-header__book { padding: 13px 22px; font-size: 14px; }
/* toggle sits last so the actions stay beside it */
.nbdc-nav__toggle { order: 99; margin-left: 2px; }

@media (max-width: 1080px) {
  .nbdc-header__actions { margin-left: auto; }
  .nbdc-header__call { padding: 11px 16px; }
}
@media (max-width: 560px) {
  .nbdc-header__book { padding: 11px 14px; font-size: 13px; }
  .nbdc-header__inner { gap: 8px; padding: 10px 0; }
}
@media (max-width: 400px) {
  .nbdc-header__book { display: none; } /* dock covers Book at this width */
}

/* ---- Mobile drawer: head, close, CTAs, scrim ---- */
.nbdc-nav__head { display: none; }
.nbdc-scrim { position: fixed; inset: 0; z-index: 85; background: rgba(11,18,24,.5);
  backdrop-filter: blur(3px); opacity: 0; transition: opacity .4s var(--nbdc-ease); }
.nbdc-scrim.is-open { opacity: 1; }
.nbdc-nav__cta { display: none; }

@media (max-width: 1080px) {
  .nbdc-nav {
    inset: 0 0 0 auto; width: min(390px, 92vw); padding: 0;
    display: flex; flex-direction: column;
    background: var(--nbdc-paper); box-shadow: -24px 0 70px rgba(11,18,24,.22);
  }
  .nbdc-nav__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px 22px; border-bottom: 1px solid var(--nbdc-line); flex: none;
  }
  .nbdc-nav__title { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--nbdc-text-mute); }
  .nbdc-nav__close { background: var(--nbdc-tint); border: 0; width: 40px; height: 40px; border-radius: 50%;
    display: grid; place-items: center; color: var(--nbdc-text); cursor: pointer; transition: background .25s; }
  .nbdc-nav__close:hover { background: var(--nbdc-blue-wash); color: var(--nbdc-blue); }

  .nbdc-nav__list { flex: 1 1 auto; overflow-y: auto; padding: 8px 22px 22px; gap: 0; }
  .nbdc-nav__item { border-bottom: 1px solid var(--nbdc-line); }
  .nbdc-nav__item:last-child { border-bottom: 0; }
  .nbdc-nav__link { padding: 15px 0; font-size: 16px; font-weight: 600; color: var(--nbdc-text); width: 100%; }
  .nbdc-nav__link::after { display: none; }

  /* sub-items: quiet indented list, not a bordered card */
  .nbdc-nav__dropdown {
    border: 0; border-left: 2px solid var(--nbdc-blue-wash); border-radius: 0;
    background: none; box-shadow: none; padding: 0 0 10px 14px; margin: 0 0 8px;
    min-width: 0; transform: none; opacity: 1; visibility: visible;
  }
  .nbdc-nav__dropdown::before { display: none; }
  .nbdc-nav__dropdown a { padding: 9px 0 9px 14px; font-size: 15px; font-weight: 500; color: var(--nbdc-text-soft); border-radius: 0; }
  .nbdc-nav__dropdown a::before { left: 0; }
  .nbdc-nav__dropdown a:hover { background: none; color: var(--nbdc-blue); }

  .nbdc-nav__cta { display: grid; gap: 10px; padding: 18px 22px calc(18px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--nbdc-line); background: var(--nbdc-bone); flex: none; }
}

/* ---- Sticky mobile dock: Call / Book / Directions ----
   The practice line is voice-only (client-confirmed 2026-08-13), so the old
   Text button is gone; Directions is the useful third action for a local clinic. */
.nbdc-dock { display: none; }
@media (max-width: 860px) {
  .nbdc-dock {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
    display: grid; grid-template-columns: repeat(3,1fr); gap: 1px;
    background: var(--nbdc-line); border-top: 1px solid var(--nbdc-line);
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -6px 26px rgba(11,18,24,.12);
  }
  .nbdc-dock__btn {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    background: var(--nbdc-paper); color: var(--nbdc-text); min-height: 60px;
    font-size: 12px; font-weight: 700; letter-spacing: .02em; transition: background .25s, color .25s;
    text-align: center; padding: 0 4px;
  }
  .nbdc-dock__btn svg { opacity: .85; }
  .nbdc-dock__btn--book { background: var(--nbdc-blue); color: #fff; }
  .nbdc-dock__btn--book svg { opacity: 1; }
  .nbdc-dock__btn:active { background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark); }
  .nbdc-dock__btn--book:active { background: var(--nbdc-blue-dark); color: #fff; }
  /* keep the dock clear of page content and the footer */
  body { padding-bottom: 64px; }
  body.nbdc-lp { padding-bottom: 4.75rem; }
}

/* ---- Sticky header must not cover anchored content ---- */
:target, [id] { scroll-margin-top: 96px; }
@media (max-width: 1080px) { :target, [id] { scroll-margin-top: 84px; } }

/* ---- Mobile rhythm pass ---- */
@media (max-width: 620px) {
  .nbdc-section { padding: 56px 0; }
  .nbdc-section--sm { padding: 40px 0; }
  .nbdc-section-header { margin-bottom: 32px; }
  .nbdc-hero { padding: 48px 0 44px; }
  .nbdc-hero--full { padding: 92px 0 56px; min-height: auto; }
  .nbdc-card, .nbdc-lead-form { padding: 24px 20px; }
  .nbdc-grid { gap: 16px; }
  .nbdc-cta-banner { padding: 48px 22px; }
  .nbdc-offer-hero { padding: 64px 0; }
  .nbdc-statbar { border-left: 0; border-right: 0; }
  .nbdc-stat { padding: 28px 14px; }
  .nbdc-method__step { padding: 34px 0; }
  .nbdc-map iframe { min-height: 260px; }
  h1, .nbdc-hero__headline { overflow-wrap: break-word; }
}

/* ====================================================================
   2.8.0 — polish pass
   Breadcrumbs, hero variants and the dock live above. This block adds the
   floating quick-actions widget, the social row, staggered card motion,
   section variety and the width normalization.
   ==================================================================== */

/* ---- Reading width ---------------------------------------------------
   `--narrow` was 820px against a 1300px container. On pages that alternate
   between the two the step was big enough to read as a mistake. 1080px keeps
   prose inside a comfortable measure while sitting close enough to the full
   container that sections line up. Raw prose is additionally capped by
   `.nbdc-prose` where a very long line would otherwise form. */
.nbdc-container--narrow { max-width: 1080px; }
.nbdc-prose { max-width: 72ch; }
.nbdc-container--narrow > h2,
.nbdc-container--narrow > h3 { max-width: 26ch; }
.nbdc-container--narrow > p,
.nbdc-container--narrow > ul,
.nbdc-container--narrow > ol { max-width: 78ch; }

/* ---- Social icon row (contact page) ---- */
.nbdc-social-row { display: flex; gap: 10px; margin: 14px 0 0; }
.nbdc-social-row a,
.nbdc-footer__social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid var(--nbdc-line-strong); color: var(--nbdc-text-soft);
  transition: transform .2s var(--nbdc-ease), background .2s, color .2s, border-color .2s;
}
.nbdc-social-row a:hover,
.nbdc-footer__social a:hover {
  background: var(--nbdc-blue); border-color: var(--nbdc-blue); color: #fff; transform: translateY(-2px);
}

/* ---- Contact page photo ---- */
.nbdc-contact-photo { margin: 2rem 0 0; }
.nbdc-contact-photo img {
  width: 100%; height: auto; border-radius: var(--nbdc-radius-lg);
  border: 1px solid var(--nbdc-line); display: block;
}
.nbdc-contact-photo figcaption {
  margin-top: 10px; font-size: var(--step--1); color: var(--nbdc-text-mute);
}

/* ---- Tag list (insurance carriers) ---- */
.nbdc-taglist { list-style: none; margin: 12px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.nbdc-taglist li {
  margin: 0; padding: 6px 13px; border-radius: 999px;
  background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark);
  border: 1px solid rgba(0,113,189,.20);
  font-size: var(--step--1); font-weight: 600; white-space: nowrap;
}

/* ---- Staggered card reveal ---- */
.nbdc-stagger { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--nbdc-ease), transform .6s var(--nbdc-ease); }
.nbdc-stagger.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .nbdc-stagger { opacity: 1; transform: none; transition: none; }
}

/* ---- Card lift on hover ---- */
.nbdc-card { transition: transform .25s var(--nbdc-ease), box-shadow .25s var(--nbdc-ease), border-color .25s var(--nbdc-ease); }
.nbdc-card:hover { transform: translateY(-3px); box-shadow: 0 14px 40px rgba(11,18,24,.09); border-color: rgba(0,113,189,.28); }
@media (prefers-reduced-motion: reduce) { .nbdc-card:hover { transform: none; } }

/* ---- Section variety -------------------------------------------------
   Pages were reading as an unbroken run of white and pale blue. These give
   alternating sections a distinct ground without leaving the palette. */
.nbdc-section--bg-tint { position: relative; }
.nbdc-section--edge { border-top: 1px solid var(--nbdc-line); }
.nbdc-section--ink {
  background: linear-gradient(155deg, #072B45 0%, #0B1218 70%); color: rgba(255,255,255,.80);
}
.nbdc-section--ink h2, .nbdc-section--ink h3 { color: #fff; }
.nbdc-section--ink .nbdc-eyebrow { color: #6FC0F0; }
.nbdc-section--ink .nbdc-card {
  background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.14); color: rgba(255,255,255,.80);
}
.nbdc-section--ink .nbdc-card h3 { color: #fff; }

/* A hairline accent above tinted sections so the change of ground reads as
   deliberate rather than as an unstyled block. */
.nbdc-section--bg-tint::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0,113,189,.34), transparent);
}

/* ---- Floating quick actions (desktop) ---- */
.nbdc-fab { position: fixed; right: 24px; bottom: 24px; z-index: 96; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.nbdc-fab__toggle {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 13px 20px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--nbdc-blue); color: #fff; font: inherit; font-weight: 700; font-size: 15px;
  box-shadow: 0 10px 30px rgba(0,113,189,.34);
  transition: background .2s, transform .2s var(--nbdc-ease), box-shadow .2s;
}
.nbdc-fab__toggle:hover { background: var(--nbdc-blue-dark); transform: translateY(-2px); box-shadow: 0 14px 36px rgba(0,113,189,.42); }
.nbdc-fab__toggle:focus-visible { outline: 3px solid var(--nbdc-blue-light); outline-offset: 3px; }
.nbdc-fab__toggle-icon { display: inline-flex; }
.nbdc-fab__icon-close { display: none; }
.nbdc-fab.is-open .nbdc-fab__icon-open { display: none; }
.nbdc-fab.is-open .nbdc-fab__icon-close { display: inline; }

.nbdc-fab__panel {
  width: 320px; max-width: calc(100vw - 48px);
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line);
  border-radius: var(--nbdc-radius-lg); overflow: hidden;
  box-shadow: 0 24px 60px rgba(11,18,24,.20);
  animation: nbdc-fab-in .26s var(--nbdc-ease);
}
@keyframes nbdc-fab-in { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .nbdc-fab__panel { animation: none; } }

.nbdc-fab__head { padding: 18px 20px 14px; background: linear-gradient(160deg, var(--nbdc-blue-wash), var(--nbdc-paper)); border-bottom: 1px solid var(--nbdc-line); }
.nbdc-fab__title { margin: 0; font-weight: 800; font-size: 16px; color: var(--nbdc-text); }
.nbdc-fab__sub { margin: 3px 0 0; font-size: 12px; color: var(--nbdc-text-mute); }
.nbdc-fab__list { list-style: none; margin: 0; padding: 8px; display: grid; gap: 2px; }
.nbdc-fab__list li { margin: 0; }
.nbdc-fab__list a {
  display: flex; align-items: center; gap: 12px; padding: 11px 12px;
  border-radius: 12px; text-decoration: none; color: var(--nbdc-text);
  transition: background .18s;
}
.nbdc-fab__list a:hover { background: var(--nbdc-blue-wash); }
.nbdc-fab__list strong { display: block; font-size: 14px; font-weight: 700; }
.nbdc-fab__list small { display: block; font-size: 12px; color: var(--nbdc-text-mute); margin-top: 1px; }
.nbdc-fab__icon {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--nbdc-blue-wash); color: var(--nbdc-blue-dark);
}
.nbdc-fab__hours { margin: 0; padding: 11px 20px 14px; border-top: 1px solid var(--nbdc-line); font-size: 12px; color: var(--nbdc-text-mute); background: var(--nbdc-bone); }

/* The mobile dock already occupies this corner. */
@media (max-width: 860px) { .nbdc-fab { display: none; } }

/* ---- Page-hero photo panel -------------------------------------------
   Interior heroes were gradient-only, which left the right half of a wide
   screen empty. The photo is masked into the background rather than butted
   against it, so it reads as part of the hero instead of a pasted-in block.
   Text stays on the tinted left side, so contrast is unaffected. */
.nbdc-pagehero--has-media > .nbdc-container { max-width: 1300px; }
.nbdc-pagehero--has-media .nbdc-container > *:not(.nbdc-pagehero__media) { max-width: 60%; }
.nbdc-pagehero--has-media .nbdc-breadcrumbs { max-width: none; }

.nbdc-pagehero__media {
  position: absolute; top: 0; right: 0; bottom: 0; width: 46%;
  z-index: 1; pointer-events: none; overflow: hidden;
}
.nbdc-pagehero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  display: block;
  /* White, not black: under luminance masking a black gradient hides the whole
     image. White reads correctly whether the UA resolves mask-mode to alpha or
     to luminance. */
  -webkit-mask-image: linear-gradient(96deg, transparent 0%, rgba(255,255,255,.18) 28%, rgba(255,255,255,.62) 56%, #fff 86%);
          mask-image: linear-gradient(96deg, transparent 0%, rgba(255,255,255,.18) 28%, rgba(255,255,255,.62) 56%, #fff 86%);
}
/* On the dark booking hero the photo needs knocking back so white text on the
   left keeps its contrast and the image does not glare. */
.nbdc-pagehero--deep .nbdc-pagehero__media img { opacity: .40; filter: saturate(.75); }

/* The decorative motif and the photo would collide — photo wins. */
.nbdc-pagehero--has-media::after { display: none; }

@media (max-width: 1100px) {
  .nbdc-pagehero__media { width: 38%; }
  .nbdc-pagehero--has-media .nbdc-container > *:not(.nbdc-pagehero__media) { max-width: 68%; }
}
@media (max-width: 860px) {
  .nbdc-pagehero__media { display: none; }
  .nbdc-pagehero--has-media .nbdc-container > *:not(.nbdc-pagehero__media) { max-width: 100%; }
  .nbdc-pagehero--has-media::after { display: block; }
}


/* ---- Mobile: drop the decorative grain layer -------------------------
   Removing the fixed full-viewport SVG-filter overlay on phones, where it
   cannot be seen and costs rasterization plus a composited layer on scroll. */
@media (max-width: 860px) {
  body::after { display: none; }
}

/* ====================================================================
   Landing pages — brought up to the standard of the organic pages.
   These are the pages we buy traffic to, and they were missing the
   photography, the real reviews module, the map and the sticky dock that
   the rest of the site gained between 2.8 and 2.10.
   ==================================================================== */

/* Topbar: real logo plus a persistent call link (the old text lockup and the
   separate top call bar are gone — see single-landing_page.php). */
.nbdc-lp-topbar .nbdc-container { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.nbdc-lp-topbar .nbdc-logo img { height: 96px; width: auto; display: block; }
.nbdc-lp-topbar__call {
  display: inline-flex; align-items: center; gap: 9px; flex: none;
  padding: 10px 18px; border-radius: 999px; font-weight: 700; font-size: 15px;
  background: var(--nbdc-blue); color: #fff;
  transition: background .2s, transform .2s var(--nbdc-ease);
}
.nbdc-lp-topbar__call:hover { background: var(--nbdc-blue-dark); color: #fff; transform: translateY(-1px); }

/* Hero photo panel — same masked treatment as the organic page heroes. */
.nbdc-lp-hero { position: relative; overflow: hidden; isolation: isolate; }
.nbdc-lp-hero > .nbdc-container { position: relative; z-index: 2; }
.nbdc-lp-hero--has-media { text-align: left; }
.nbdc-lp-hero--has-media .nbdc-container > * { max-width: 60%; }
.nbdc-lp-hero--has-media .nbdc-lp-hero__cta { justify-content: flex-start; }
.nbdc-lp-hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: 46%; z-index: 1; pointer-events: none; overflow: hidden; }
.nbdc-lp-hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center; display: block;
  -webkit-mask-image: linear-gradient(96deg, transparent 0%, rgba(255,255,255,.18) 28%, rgba(255,255,255,.62) 56%, #fff 86%);
          mask-image: linear-gradient(96deg, transparent 0%, rgba(255,255,255,.18) 28%, rgba(255,255,255,.62) 56%, #fff 86%);
}

/* Map sits under the address/hours grid. */
.nbdc-lp-location__map { margin-top: 32px; border-radius: var(--nbdc-radius-lg); overflow: hidden; }
.nbdc-lp-location__map .nbdc-map { border-color: rgba(255,255,255,.16); }

/* The reviews module renders on the LP's tinted ground; keep it readable. */
.nbdc-lp .nbdc-reviews__title { margin-top: 4px; }

@media (max-width: 860px) {
  .nbdc-lp-hero__media { display: none; }
  .nbdc-lp-hero--has-media { text-align: center; }
  .nbdc-lp-hero--has-media .nbdc-container > * { max-width: 100%; }
  .nbdc-lp-hero--has-media .nbdc-lp-hero__cta { justify-content: center; }
  .nbdc-lp-topbar .nbdc-logo img { height: 68px; }
  .nbdc-lp-topbar__call { padding: 10px 15px; font-size: 14px; }
  /* Clear the sticky dock so the footer is not trapped behind it. */
  .nbdc-lp-footer { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

/* ---- Landing pages: proof, offer, doctor and booking ------------------
   Rebuilt 2026-08-14 after client review. The page previously buried its
   strongest asset (5.0 from 293 reviews) four sections down, had no photo of
   the doctor at all, presented "How it works" as an unexplained three-step
   block, and ended on a bare callback form with no alternative offered. */

/* Hero proof: rating + the doctor's face, above the fold. */
.nbdc-lp-hero__proof {
  display: flex; align-items: center; gap: 16px; margin: 26px 0 0;
  padding: 14px 18px; border-radius: 999px; background: var(--nbdc-paper);
  border: 1px solid var(--nbdc-line); box-shadow: 0 8px 26px rgba(11,18,24,.06);
  width: fit-content; max-width: 100%;
}
.nbdc-lp-hero--has-media .nbdc-lp-hero__proof { margin-left: 0; }
.nbdc-lp-hero:not(.nbdc-lp-hero--has-media) .nbdc-lp-hero__proof { margin-left: auto; margin-right: auto; }
.nbdc-lp-hero__face {
  width: 58px; height: 58px; border-radius: 50%; object-fit: cover;
  object-position: center 22%; flex: none; border: 2px solid var(--nbdc-paper);
  box-shadow: 0 0 0 1px var(--nbdc-line);
}
.nbdc-lp-hero__proof-text { text-align: left; line-height: 1.35; }
.nbdc-lp-hero__stars { color: #F5A623; letter-spacing: 1px; font-size: 14px; }
.nbdc-lp-hero__proof-text strong { font-size: 19px; font-weight: 800; margin-left: 6px; }
.nbdc-lp-hero__proof-text > span { font-size: 14px; color: var(--nbdc-text-soft); }
.nbdc-lp-hero__proof-text small { display: block; font-size: 12.5px; color: var(--nbdc-text-mute); margin-top: 2px; }

/* Offer card — modeled on the homepage offer block, not a bare centered heading. */
.nbdc-lp-offer { background: linear-gradient(155deg, #072B45 0%, #0B1218 72%); }
.nbdc-lp-offer__card {
  max-width: 820px; margin: 0 auto; text-align: center; color: rgba(255,255,255,.82);
}
.nbdc-lp-offer__card .nbdc-eyebrow { color: #6FC0F0; }
.nbdc-lp-offer__card h2 { color: #fff; margin-bottom: 14px; }
.nbdc-lp-offer__body { font-size: var(--step-1); color: rgba(255,255,255,.78); max-width: 60ch; margin: 0 auto 26px; }
.nbdc-lp-offer__included {
  list-style: none; padding: 0; margin: 0 auto 28px; max-width: 640px;
  display: grid; gap: 12px; text-align: left;
}
.nbdc-lp-offer__included li {
  display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-items: start;
  padding: 14px 18px; border-radius: 14px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
}
.nbdc-lp-offer__included li::before {
  content: "✓"; grid-row: span 2; color: #6FC0F0; font-weight: 800; font-size: 17px; line-height: 1.3;
}
.nbdc-lp-offer__included strong { color: #fff; font-size: var(--step-0); }
.nbdc-lp-offer__included span { color: rgba(255,255,255,.72); font-size: var(--step--1); }
.nbdc-lp-offer__cta { display: flex; gap: 13px; justify-content: center; flex-wrap: wrap; }
.nbdc-lp-offer .nbdc-btn--secondary {
  background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.34);
}
.nbdc-lp-offer .nbdc-btn--secondary:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.6); }

/* Doctor: he is an asset — show him. */
.nbdc-lp-doctor { display: grid; grid-template-columns: 320px 1fr; gap: 44px; align-items: center; }
.nbdc-lp-doctor__photo { margin: 0; }
.nbdc-lp-doctor__photo img {
  width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: center 20%;
  border-radius: var(--nbdc-radius-lg); border: 1px solid var(--nbdc-line);
}
.nbdc-lp-doctor__body h2 { margin-top: 0; }

/* Booking: phone primary, online secondary, form as an explicit fallback. */
.nbdc-lp-book { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: start; }
.nbdc-lp-book__primary h2 { margin-top: 6px; }
.nbdc-lp-book__primary .nbdc-btn { margin: 0 10px 10px 0; }
.nbdc-lp-book__fallback {
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line);
  border-radius: var(--nbdc-radius-lg); padding: 26px;
}
.nbdc-lp-book__fallback h3 { margin-top: 0; }

/* Location: hours were eating a full column for seven short rows. */
.nbdc-lp-location__grid { align-items: start; }
.nbdc-lp-location .nbdc-hours { font-size: var(--step--1); }
.nbdc-lp-location .nbdc-hours li,
.nbdc-lp-location .nbdc-hours tr { line-height: 1.5; }

@media (max-width: 860px) {
  .nbdc-lp-doctor { grid-template-columns: 1fr; gap: 26px; }
  .nbdc-lp-doctor__photo { max-width: 260px; margin: 0 auto; }
  .nbdc-lp-book { grid-template-columns: 1fr; gap: 30px; }
  .nbdc-lp-hero__proof { width: 100%; justify-content: flex-start; border-radius: var(--nbdc-radius-lg); }
}

/* ---- LP: mobile hero photo + symptom chips (client review 2026-08-14) ----
   The hero photo was hidden entirely on mobile, so the page opened on flat
   color where the organic pages open on a photograph. And the symptom list
   was a plain bulleted column eating a whole screen to answer a one-second
   "am I in the right place" question. */

/* Symptoms as chips: same information, a fraction of the height, and it reads
   as designed rather than as a default list. */
.nbdc-lp-symptoms {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.nbdc-lp-symptoms li {
  margin: 0; padding: 11px 18px 11px 40px; position: relative;
  background: var(--nbdc-paper); border: 1px solid var(--nbdc-line);
  border-radius: 999px; font-size: var(--step--1); font-weight: 500;
  color: var(--nbdc-text); line-height: 1.35;
  transition: border-color .2s var(--nbdc-ease), transform .2s var(--nbdc-ease);
}
.nbdc-lp-symptoms li::before {
  content: "✓"; position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: var(--nbdc-blue); font-weight: 800; font-size: 14px;
}
.nbdc-lp-symptoms li:hover { border-color: rgba(0,113,189,.34); transform: translateY(-1px); }

@media (max-width: 860px) {
  /* Show the photo as a contained banner instead of dropping it entirely. */
  .nbdc-lp-hero__media {
    display: block; position: static; width: 100%; height: 190px;
    margin: 24px 0 0; border-radius: var(--nbdc-radius-lg); overflow: hidden;
  }
  .nbdc-lp-hero__media img {
    -webkit-mask-image: none; mask-image: none;
    object-position: center 38%;
  }
  .nbdc-lp-symptoms { justify-content: flex-start; }
  .nbdc-lp-symptoms li { font-size: 14px; padding: 9px 15px 9px 34px; }
  .nbdc-lp-symptoms li::before { left: 13px; }
}


/* ---- Header call button: show the number ------------------------------
   It was collapsing to a bare phone icon under 1080px, which made the primary
   CTA ambiguous on exactly the devices most likely to use it. The number stays
   visible down to 420px, below which the header also carries Book and the
   hamburger and the row genuinely runs out of room. */
@media (max-width: 420px) {
  .nbdc-header__call .nbdc-header__call-label { display: none; }
  .nbdc-header__call { padding: 12px; border-radius: 50%; }
}

/* ---- Hours-aware CTA ---------------------------------------------------
   The office is closed Fri, Sat, Sun and Tuesday mornings — roughly 60% of the
   week the phone is not a conversion channel. A "call us" primary button at
   9pm on a Saturday sends the visitor to a voicemail and loses them.

   An inline head script sets data-office on <html> before first paint, using the
   PRACTICE's timezone. When closed, booking becomes the primary action and the
   call button steps down. No layout work happens in JS — only this attribute. */

.nbdc-cta-note { display: none; margin: 12px 0 0; font-size: var(--step--1); color: var(--nbdc-text-soft); }
[data-office="closed"] .nbdc-cta-note { display: block; }
[data-office="closed"] .nbdc-cta-note::before {
  content: "●"; color: var(--nbdc-warning); margin-right: 7px; font-size: 11px; vertical-align: 1px;
}

/* Swap the visual weight. Markup order is unchanged — the phone stays first in
   the DOM so keyboard and screen-reader order still leads with it. */
[data-office="closed"] [data-cta="book"] {
  background: var(--nbdc-blue); border-color: var(--nbdc-blue); color: #fff;
}
[data-office="closed"] [data-cta="book"]:hover { background: var(--nbdc-blue-dark); border-color: var(--nbdc-blue-dark); color: #fff; }
[data-office="closed"] [data-cta="call"] {
  background: transparent; color: var(--nbdc-text); border: 1px solid var(--nbdc-line-strong);
}
[data-office="closed"] [data-cta="call"]:hover { background: var(--nbdc-tint); color: var(--nbdc-text); }

/* On the dark offer and booking blocks the "stepped down" call button needs
   light treatment rather than the default dark-on-light. */
[data-office="closed"] .nbdc-lp-offer [data-cta="call"],
[data-office="closed"] .nbdc-pagehero--deep [data-cta="call"] {
  background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.34);
}


/* ---- Header fit on small screens --------------------------------------
   Showing the full phone number (2.14.0) pushed the hamburger 21px past the
   viewport at 500px: logo 109 + call 171 + book 147 + toggle 44 does not fit.
   The number is the more valuable of the two labels, so "Book Appointment"
   drops to "Book" instead. The sticky dock also carries Book, and the word
   alone is unambiguous next to a phone number. */
@media (max-width: 620px) {
  .nbdc-header__book-label { display: none; }
}

/* ---- Review Wave intake form ------------------------------------------
   The embed is NOT an iframe — Review Wave renders inline.

   Its structure is a flex row (.rw-slide-wrap) holding the active step
   (.rw-form-step, ~400px) alongside .rw-privacy-policy, which contains the full
   terms text and renders at 7,874px. Because they are flex siblings, that column
   dictates the row height — so step 1 (a consent checkbox and a Get Started
   button) sat above thousands of pixels of blank space.

   Fix: cap the policy column so it cannot drive the row height, and let it
   scroll inside itself. Do NOT cap the wrapper — an outer max-height creates a
   nested scroll trap that on a phone makes the page itself hard to scroll.

   These are vendor class names. Re-check after any Review Wave update. */
/* THE actual cause. Review Wave's script sets min-height on .rw-slide-wrap to
   the height of its TALLEST step — 7,874px, because one step holds the full
   terms text. Every other step then sits above thousands of pixels of reserved
   blank space. Its children measure 400 / 0 / 300 / 300, so nothing needs it.
   !important is warranted: the value comes from vendor-injected CSS. */
.nbdc-rw-forms .rw-slide-wrap {
  min-height: 0 !important;
  height: auto !important;
}

/* Belt and braces: cap the terms column so it cannot re-inflate the row. */
.nbdc-rw-forms .rw-privacy-policy {
  max-height: 360px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.nbdc-rw-forms .rw-consent-policy-wrap {
  max-height: 300px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--nbdc-line);
  border-radius: var(--nbdc-radius);
  padding: 14px 16px;
  background: var(--nbdc-paper);
  font-size: var(--step--1);
  line-height: 1.6;
}
.nbdc-rw-forms {
  border: 1px solid var(--nbdc-line);
  border-radius: var(--nbdc-radius-lg);
  background: var(--nbdc-bone);
  padding: 8px;
}

@media (max-width: 620px) {
  /* Give the inner form room to breathe rather than crowding the screen edge,
     which is what made the outer page hard to scroll past it. */
  .nbdc-rw-forms { padding: 4px; }
  .nbdc-rw-forms .rw-privacy-policy { max-height: 260px; }
  .nbdc-rw-forms .rw-consent-policy-wrap { max-height: 220px; }
}

/* ---- Centred page heroes ----------------------------------------------
   .nbdc-pagehero h1 is capped at 20ch and the lead at 58ch, both with zero
   side margins. Inside a .nbdc-text-center wrapper that centres the TEXT while
   leaving the BLOCK hard against the left edge — which is why the offer page
   read as almost-but-not-quite centred on desktop and fine on mobile, where the
   cap becomes 100% and the discrepancy disappears. */
.nbdc-text-center > h1,
.nbdc-text-center > h2,
.nbdc-text-center > .nbdc-pagehero__lead,
.nbdc-text-center > p {
  margin-left: auto;
  margin-right: auto;
}

/* Thank-you page — "call us, it's faster" panel.
   Uses .nbdc-card for the base surface; this only adds the accent edge so the
   phone route reads as the primary action rather than a footnote. */
.nbdc-thankyou-call {
  border-left: 4px solid var(--nbdc-blue);
  padding: 20px 22px;
}
.nbdc-thankyou-call .nbdc-btn { margin-top: 4px; }
