/*
Theme Name: First Dental Image
Theme URI: https://firstdentalimage.com/
Author: Local WordPress conversion
Description: A block-editor-ready custom theme recreated from the supplied DoctorLogic site mirror.
Version: 2.4.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: first-dental-image
*/

:root {
  --fdi-ink: #333;
  --fdi-white: #fff;
  --fdi-green: #89d973;
  --fdi-aqua: #04d9d9;
  --fdi-teal: #027368;
  --fdi-soft: #f9f9f9;
  --fdi-content: 1336px;
  --fdi-narrow: 1000px;
  /* Typekit families first (production loads kit wir2rle); the Google
   * equivalents remain as fallbacks but their metrics differ slightly. */
  --fdi-font-body: "open sans", "Open Sans", sans-serif;
  --fdi-font-head: montserrat, "Montserrat", sans-serif;
  --fdi-font-accent: "thermal-variable", "Marcellus", Georgia, serif;
  --fdi-shadow: 0 20px 55px rgb(14 55 57 / 12%);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--fdi-ink);
  background: var(--fdi-white);
  font-family: var(--fdi-font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }

img { max-width: 100%; height: auto; }

a { color: var(--fdi-teal); text-underline-offset: 0.18em; }

/* Content links render dark on production, not teal. */
.entry-content a,
.fdi-svc-main a { color: var(--fdi-ink); }

/* Production content headings carry no letter-spacing; the components that
 * do (sitemap cards, info-card titles, promo banners) set it explicitly. */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 20px;
  color: var(--fdi-ink);
  font-family: var(--fdi-font-head);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.2;
}

h1 { font-size: clamp(2rem, 3.8vw, 3.8rem); }
h2 { font-size: clamp(1.5rem, 3.2vw, 3.2rem); }
h3 { font-size: clamp(1.2rem, 1.8vw, 1.7rem); }

p, ul, ol { margin: 0 0 1.35em; }

p {
  font-size: clamp(0.9rem, 1.1vw, 1.1rem);
  line-height: 1.8;
}

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  z-index: 100000;
  top: 8px;
  left: 8px;
  width: auto;
  height: auto;
  padding: 12px 18px;
  clip: auto;
  color: var(--fdi-ink);
  background: var(--fdi-white);
}

.fdi-shell {
  width: min(calc(100% - 64px), var(--fdi-content));
  margin-inline: auto;
}

/* ---------------------------------------------------------------------------
 * Header
 * ------------------------------------------------------------------------ */

.site-header {
  position: sticky;
  top: 0;
  right: 0;
  left: 0;
  z-index: 500;
}

.home .site-header { position: fixed; }

.fdi-topbar {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 48px;
  background: var(--fdi-green);
}

.fdi-topbar a {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--fdi-white);
  font-size: clamp(0.7rem, 0.8vw, 0.8rem);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
}

.fdi-topbar svg { width: 16px; height: 16px; fill: var(--fdi-white); }

/* Production's header background snaps between states (no transition). */
.fdi-header-main {
  background: var(--fdi-white);
}

.fdi-header-inner {
  max-width: 1600px;
  margin: 0 auto;
  padding: 24px 48px 16px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.fdi-header-phone,
.fdi-header-book {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--fdi-ink);
  font-size: 12.8px;
  font-weight: 700;
  letter-spacing: 2px;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.2s ease;
}

.fdi-header-phone:hover,
.fdi-header-book:hover { color: var(--fdi-aqua); }

.fdi-header-phone { grid-column: 1; justify-self: start; }
.fdi-header-book { grid-column: 3; justify-self: end; }

.fdi-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 30px;
  background: var(--fdi-ink);
  border-radius: 4px;
  transition: background 0.25s ease;
}

.fdi-icon-box svg { width: 17px; height: 17px; fill: var(--fdi-white); }

.fdi-icon-cal { display: inline-flex; }
.fdi-icon-cal svg { width: 18px; height: 18px; fill: currentColor; }

.site-branding {
  grid-column: 2;
  display: block;
}

.site-branding img {
  display: block;
  width: 130px;
  height: 130px;
  object-fit: contain;
}

.site-branding img.fdi-logo-white { display: none; }

.primary-navigation {
  grid-column: 1 / -1;
  justify-self: center;
  margin-top: 28px;
}

.primary-navigation ul {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.primary-navigation li { position: relative; }

.primary-navigation > ul > li { padding: 0 16px; }

.primary-navigation a {
  display: block;
  padding: 0;
  color: var(--fdi-ink);
  font-size: 12.8px;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1.5;
  text-decoration: none;
  text-transform: uppercase;
}

/* Desktop dropdowns, matched to the production menu: transparent UL with a
 * 20px hover bridge, 300px-wide white items, gray hover, third level flying
 * out at left:300px aligned to the top of the dropdown. */
@media (min-width: 1241px) {
  .primary-navigation .sub-menu {
    position: absolute;
    top: 20px;
    left: 0;
    z-index: 30;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 300px;
    min-width: 300px;
    margin: 0;
    padding: 20px 0;
    list-style: none;
    /* Production keeps the panel itself transparent; the white comes from
     * the item boxes (the 20px paddings stay see-through). */
    background: transparent;
    /* Production fades dropdowns in: visibility keeps the opacity
     * transition alive (display:none would kill it). */
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s;
  }

  .primary-navigation li:hover > .sub-menu {
    visibility: visible;
    opacity: 1;
  }

  .primary-navigation .sub-menu li {
    position: static;
    width: 100%;
  }

  .primary-navigation .sub-menu a {
    position: relative;
    width: 100%;
    padding: 16px;
    background: var(--fdi-white);
    color: var(--fdi-ink);
    line-height: 1.5;
    text-align: left;
  }

  .primary-navigation .sub-menu a::before {
    content: "•  ";
    color: #c6c6c6;
  }

  .primary-navigation .sub-menu li:hover > a { background: #c6c6c6; }

  .primary-navigation .sub-menu li.menu-item-has-children > a::after {
    content: "＞";
    position: absolute;
    right: 36px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .primary-navigation .sub-menu li.menu-item-has-children:hover > a::after { opacity: 1; }

  .primary-navigation .sub-menu .sub-menu {
    top: 20px;
    left: 300px;
    width: 320px;
    min-width: 0;
    padding: 0 0 20px;
  }

  /* Invisible hover zone under the flyout (same as production): keeps the
   * parent item's hover alive while the mouse travels diagonally from a low
   * dropdown item up to the top-anchored flyout. */
  .primary-navigation .sub-menu .sub-menu::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 100%;
    min-height: 40vh;
    z-index: -1;
  }
}

/* Transparent header floating over the homepage hero. */
.home .site-header:not(.is-scrolled) .fdi-header-main { background: transparent; }

.home .site-header:not(.is-scrolled) .fdi-header-phone,
.home .site-header:not(.is-scrolled) .fdi-header-book,
.home .site-header:not(.is-scrolled) .primary-navigation > ul > li > a { color: var(--fdi-white); }

.home .site-header:not(.is-scrolled) .fdi-header-phone:hover,
.home .site-header:not(.is-scrolled) .fdi-header-book:hover { color: var(--fdi-aqua); }

.home .site-header:not(.is-scrolled) .fdi-icon-box {
  width: 44px;
  height: 28px;
  background: transparent;
  border-right: 1px solid var(--fdi-white);
  border-radius: 0;
}

.home .site-header:not(.is-scrolled) .site-branding img.fdi-logo-color { display: none; }
.home .site-header:not(.is-scrolled) .site-branding img.fdi-logo-white { display: block; }

.site-header.is-scrolled .fdi-header-main {
  background: var(--fdi-soft);
  box-shadow: rgba(17, 12, 46, 0.15) 0 0 100px 0;
}

.fdi-menu-toggle {
  display: none;
  padding: 8px;
  color: var(--fdi-ink);
  background: transparent;
  border: 0;
  font: inherit;
}

.home .site-header:not(.is-scrolled) .fdi-menu-toggle { color: var(--fdi-white); }

.fdi-menu-toggle svg { display: block; width: 26px; }

.site-main { min-height: 60vh; }

/* ---------------------------------------------------------------------------
 * Content shells
 * ------------------------------------------------------------------------ */

.entry-content > * {
  width: min(calc(100% - 64px), var(--fdi-narrow));
  margin-inline: auto;
}

.entry-content > .alignwide { width: min(calc(100% - 64px), var(--fdi-content)); max-width: none; }
.entry-content > .alignfull { width: 100%; max-width: none; }

/* Band-masthead pages: wide, left-anchored container like production
 * (content at x=44 on a 1440 viewport). */
.entry-content--wide > *,
.entry-content--wide > .alignwide {
  width: min(calc(100% - 88px), 1352px);
  margin-inline: 44px auto;
}

/* The promotions listing uses production's narrower 1256px variant. */
.entry-content--w1256 > *,
.entry-content--w1256 > .alignwide { width: min(calc(100% - 88px), 1256px); }

/* The financing pages use production's centered variant: 1200px masthead,
 * 1160px content, and full-bleed gray strips for section headings. */
.page-id-91 .fdi-masthead-band__inner,
.page-id-92 .fdi-masthead-band__inner { max-width: 1200px; margin-inline: auto; }
.page-id-91 .fdi-masthead-band h1,
.page-id-92 .fdi-masthead-band h1 { font-size: clamp(2rem, 4.17vw, 3.75rem); }
.page-id-91 .fdi-masthead-band,
.page-id-92 .fdi-masthead-band { background: rgb(137, 210, 111); }
.page-id-91 .fdi-breadcrumbs,
.page-id-91 .fdi-breadcrumbs a,
.page-id-92 .fdi-breadcrumbs,
.page-id-92 .fdi-breadcrumbs a { font-family: Arial, sans-serif; font-size: 14px !important; }
.page-id-91 .fdi-breadcrumbs { width: 100%; }
.page-id-91 .fdi-breadcrumbs > span { display: block; width: 100%; }
.page-id-91 .fdi-crumb-sep { display: none; }
.fdi-fin-panels {
  display: grid;
  grid-template-columns: 900px 443px;
  gap: 4px;
  width: min(calc(100% - 88px), 1347px) !important;
  max-width: none !important;
  margin-inline: auto !important;
}
.fdi-fin-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: center;
  justify-content: center;
  min-height: 320px;
  isolation: isolate;
  background: var(--fdi-ink) center / cover no-repeat;
  text-decoration: none;
}
.fdi-fin-panel::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgb(0 0 0 / 35%); }
.fdi-fin-panel span {
  color: var(--fdi-white);
  font-family: var(--fdi-font-head);
  font-size: 46.08px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.fdi-fin-panel__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 200px;
  padding: 20px;
  border: 1px solid var(--fdi-aqua);
  border-radius: 4px;
  background: var(--fdi-aqua);
  color: var(--fdi-ink);
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  transition: all 0.3s ease;
}

.page-id-91 .fdi-masthead-band h1,
.page-id-92 .fdi-masthead-band h1 { font-weight: 300; line-height: 1.1; }

/* Production's gray section-heading strips span the full viewport. */
.page-id-91 .entry-content--wide > h2,
.page-id-92 .entry-content--wide > h2 {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Thank-you (production "Confirmation" page): white masthead, dark crumbs,
 * centered body copy. */
.fdi-page-thank-you .fdi-masthead-band { background: var(--fdi-white); padding: 40px 40px 20px; }
.fdi-page-thank-you .fdi-masthead-band h1 { color: var(--fdi-ink); text-transform: none; }
.fdi-page-thank-you .fdi-breadcrumbs,
.fdi-page-thank-you .fdi-breadcrumbs a { color: var(--fdi-ink); font-size: 14.4px !important; }
.fdi-page-thank-you .entry-content p { font-size: 15.84px; line-height: 1.8; text-align: center; }

/* Schedule page: left-anchored intro column, timeslot column beside the
 * fields column, and visible field labels — as on production. */
.fdi-page-schedule-appointment .entry-content > h2,
.fdi-page-schedule-appointment .entry-content > p {
  width: min(calc(100% - 40px), 824px);
  margin-left: 20px;
}

.fdi-page-schedule-appointment .entry-content > .wp-block-shortcode,
.fdi-page-schedule-appointment .entry-content > .wpcf7 {
  width: calc(100% - 40px);
  max-width: none;
  margin-inline: 20px;
}

.fdi-sched-cols {
  display: grid;
  grid-template-columns: 844px 1fr;
  gap: 20px;
  align-items: start;
}

.fdi-sched-slots {
  padding: 20px;
  background: #f8f8f8;
}

.fdi-page-schedule-appointment .wpcf7-form label {
  font-size: 16px;
  line-height: 1.15;
  margin-top: 16px;
}

@media (max-width: 1024px) {
  .fdi-sched-cols { grid-template-columns: 1fr; }
}
.page-id-91 .entry-content--wide > *,
.page-id-92 .entry-content--wide > * { width: min(calc(100% - 88px), 1160px); margin-inline: auto; }
.page-id-91 .entry-content--wide h3,
.page-id-92 .entry-content--wide h3 {
  font-family: var(--fdi-font-head);
  font-size: 18.72px;
  font-weight: 400;
  letter-spacing: 1px;
  text-align: center;
  text-transform: uppercase;
}
.page-id-91 .entry-content--wide > p,
.page-id-92 .entry-content--wide > p { text-align: center; }
.fdi-cc-logo { margin: 0 0 20px; }
.fdi-cc-logo img { width: 300px; height: auto; }
.fdi-journey-band {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100% !important;
  max-width: none !important;
  margin: 48px 0 0 !important;
  padding: 110px 32px;
  background: #58585a;
}
.fdi-journey-band h2 {
  margin: 0;
  color: var(--fdi-white);
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
}
.fdi-carecredit {
  background: var(--fdi-soft);
  padding: 40px;
  width: min(calc(100% - 88px), 1000px) !important;
  margin-inline: auto !important;
}
.fdi-carecredit .wp-block-buttons { justify-content: flex-start !important; }

/* Promotion detail pages: card on the left, request form beside it, in
 * production's two 623px halves. */
.fdi-promo-detail {
  display: grid;
  grid-template-columns: 623px 623px;
  width: 1246px;
  max-width: calc(100% - 32px);
  margin: 40px auto 64px;
}
.fdi-promo-detail > .fdi-promolist--detail { justify-content: center; }
.fdi-promo-detail__form { padding: 0 24px; }
.fdi-promo-detail__form .wpcf7 { max-width: 500px; }
.fdi-promo-detail__form .fdi-form-grid { grid-template-columns: 1fr; }
.fdi-promolist--detail { grid-template-columns: 500px !important; }
.entry-content--wide .fdi-promolist--detail { margin-left: 171px; }
.fdi-promolist--detail .fdi-promo { aspect-ratio: auto; }
.fdi-promolist--detail .fdi-promo__media { flex: 0 0 300px; }
.fdi-promolist--detail .fdi-promo { border-radius: 24px; }
.fdi-promolist--detail .fdi-promo__banner { padding: 15px; }
.fdi-promolist--detail .fdi-promo__banner strong { font-size: 25px; letter-spacing: 1px; }
.fdi-promolist--detail .fdi-promo__banner em { font-size: 15px; }
.fdi-promolist--detail .fdi-promo__desc { font-size: 14.4px; line-height: 1.8; max-width: 83.5%; padding: 10px; }
.fdi-masthead-crumbs {
  padding: 26px 64px 10px;
}

.fdi-masthead-crumbs--hero {
  min-height: 1026px;
  padding: 26px 64px;
  background: var(--fdi-ink) center / cover no-repeat;
}

.fdi-masthead-crumbs--hero .fdi-breadcrumbs,
.fdi-masthead-crumbs--hero .fdi-breadcrumbs a { color: var(--fdi-white); }
.fdi-masthead-crumbs .fdi-breadcrumbs {
  margin-bottom: 0;
  font-size: 11.2px;
  font-weight: 400;
  letter-spacing: normal;
  text-align: left;
  text-transform: none;
}
.fdi-masthead-crumbs .fdi-breadcrumbs a { color: var(--fdi-ink); }

/* Sitemap nav tree: five gray column cards, as on production. */
.page-id-99 .fdi-sitemap-tree {
  display: grid !important;
  grid-template-columns: repeat(6, 212px);
  gap: 16px;
  align-items: start;
  margin-bottom: 48px;
}

.fdi-sitemap-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 16px;
  background: #efefef;
}

.fdi-sitemap-col a {
  width: fit-content !important;
  margin: 6px 0;
  padding: 0;
  color: var(--fdi-ink);
  font-size: 1rem;
  line-height: 1.34;
  text-decoration: none;
}

.fdi-sitemap-col a.fdi-sitemap-top { width: fit-content; }
.fdi-sitemap-col span.fdi-sitemap-top { width: 100%; }
.fdi-sitemap-col .fdi-sitemap-top {
  color: var(--fdi-ink);
  font-family: var(--fdi-font-head);
  font-size: 18.72px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.31;
  text-transform: uppercase;
}

/* Production's tree entries wrap in a narrow column. */
.fdi-sitemap-col a { max-width: 128px; }

.page-id-99 .entry-content--wide > h2 {
  width: 100% !important;
  max-width: none;
  margin-inline: 0;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.fdi-sitemap-full {
  display: grid !important;
  grid-template-columns: repeat(3, 480px);
  align-items: start;
  margin-left: 40px;
}
.fdi-sitemap-full ul { margin: 0; padding: 0; list-style: none; }
.fdi-sitemap-full li { padding: 16px 0; font-size: 15.84px; line-height: 1.5; }

/* Sitemap section headings: small uppercase, shrink-to-fit, slightly inset. */
.page-id-99 .entry-content--wide > h3 {
  width: fit-content;
  margin-left: 60px;
  font-family: var(--fdi-font-body);
  font-size: 28.8px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.3 !important;
  text-transform: uppercase;
}

/* Procedure pages use production's centered 936px column. */
.fdi-procedure .entry-content > *,
.fdi-procedure .fdi-soft-band > * { width: min(calc(100% - 64px), 936px); margin-inline: auto; }

/* Doctor and office pages: production two-column layout (bio | form). */
.fdi-bio-cols {
  display: grid !important;
  grid-template-columns: 663px 566px;
  gap: 25px;
  width: 1254px !important;
  max-width: calc(100% - 88px) !important;
  margin-left: 52px !important;
  margin-right: auto !important;
}
.fdi-bio-cols .wp-block-column > * { width: 100% !important; }
/* Child-combinator selector outranks the generic column child width rule.
 * Production's card: photo on the left, details offset beside it. */
.fdi-bio-cols .wp-block-column > .fdi-info-card,
.fdi-info-card {
  position: relative;
  width: 631px !important;
  margin-left: 0 !important;
  padding: 24px 24px 24px 143.5px;
  border: 1px solid rgb(137 217 115 / 30%);
  border-radius: 4px;
  background: var(--fdi-soft);
}
.fdi-info-card > * { width: fit-content; max-width: 442px; margin-left: 0; }

.fdi-info-card__avatar {
  position: absolute;
  top: 24px;
  left: 25px;
  width: 89px;
  height: 89px;
  border-radius: 50%;
  object-fit: cover;
}

/* Production's office-photo rotator: three crossfading slides. */
.fdi-photo-rotator {
  position: relative;
  width: min(100%, 1000px) !important;
  height: 667px;
  margin: 150px auto !important;
}

/* Practice page: the form sits directly under its headline. */
.page-id-84 .fdi-inline-form { margin-top: 0 !important; padding-top: 0; }

.fdi-photo-rotator img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1s ease;
}

.fdi-photo-rotator img.fdi-active { opacity: 1; }
.fdi-info-card .wp-block-button__link {
  width: 213.3px;
  min-width: 0;
  padding: 11px 20px;
  font-size: 12px;
  line-height: 1;
}
.fdi-info-card__title, .fdi-info-card__subtitle { width: 442px !important; }
.fdi-info-card__title {
  margin: 10px 0 4px;
  font-family: var(--fdi-font-head);
  font-size: 20.16px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
  text-transform: uppercase;
}
.fdi-info-card__subtitle { font-weight: 700; }
.fdi-smart-hours { font-size: 14.4px !important; line-height: 1.35 !important; }
.fdi-info-card .wp-block-buttons { margin-top: 12px; gap: 16px; }
.fdi-info-card .fdi-hours td { text-align: center; }

/* Doctor and office pages use a 920px centered column. */
.page-id-82 .entry-content > * { width: min(calc(100% - 88px), 920px); }

.page-id-84 .fdi-bio-cols {
  grid-template-columns: 663px 663px !important;
  gap: 10px !important;
  width: 1336px !important;
}

/* Privacy page body copy runs larger on production. */
.page-id-3 .entry-content--wide p,
.page-id-3 .entry-content--wide li { font-size: 1.2rem; line-height: 1.5; }
.page-id-3 .entry-content--wide li { padding: 16px 0; margin: 0; }

/* Contact page: production's two 675px halves on the gray page band. */
.fdi-contact-cols {
  display: grid !important;
  grid-template-columns: 675px 675px;
  gap: 10px;
  justify-content: start;
  max-width: none !important;
}
.page-id-85 .site-main { background: var(--fdi-soft); }
.page-id-85 .entry-content--wide > * { margin-left: 40px; }
.page-id-85 .fdi-contact-cols .wp-block-column:first-child { padding: 24px 24px 24px 0; }
.page-id-85 .fdi-contact-cols .wp-block-column:last-child { padding: 24px 0 24px 24px; }
/* Production indents the address/phone lines and sizes the info headings. */
.page-id-85 .fdi-contact-cols .wp-block-column:last-child p { margin-left: 56px; }
.page-id-85 .fdi-contact-cols .wp-block-column:last-child h2 { width: 352px; }
.page-id-85 .fdi-contact-cols .wp-block-column:last-child h2:nth-of-type(3) { width: 736px; }
.fdi-hours th { padding-right: 24px; }

/* Ragged hour rows, as production renders them (day + times inline). */
.fdi-hours-flex { display: flex; align-items: baseline; }
.fdi-hours-flex p,
.fdi-hours-flex span { margin: 0 !important; font-size: 15.84px; line-height: 1.8; }
.fdi-hours-flex .fdi-hours-day { width: auto; padding-right: 10px; font-weight: 700; }
.fdi-hours-flex span { padding: 0 4px; }

/* Practice page: production closes with a full-bleed contact band. */
.fdi-contact-band {
  width: 100vw !important;
  max-width: none !important;
  margin: 64px 0 0 calc(50% - 50vw) !important;
  padding: 60px 64px 100px;
  background: var(--fdi-soft);
}
.fdi-contact-band__inner { max-width: 540.8px; }
.fdi-contact-band__inner h2 { margin: 32px 0 24px; }
.fdi-contact-band .fdi-band-indent { margin: 0 0 4px 60px; font-size: 15.84px; line-height: 1.8; }
.fdi-contact-band a { color: var(--fdi-ink); }

.fdi-page-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 630px;
  color: var(--fdi-white);
  background: #67ce4b;
}

.fdi-page-hero__media {
  background: var(--fdi-ink) center / cover no-repeat;
}

.fdi-page-hero__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 32px;
  background: transparent;
}

.fdi-page-hero__panel h1 {
  max-width: 500px;
  line-height: 1.15;
  text-transform: uppercase;
}

.fdi-page-hero h1 {
  margin: 0;
  color: var(--fdi-white);
  font-size: clamp(2rem, 3.8vw, 3.8rem);
  text-align: left;
  text-transform: uppercase;
}

.fdi-page-hero__subtitle {
  width: fit-content;
  margin-top: 10px;
  color: var(--fdi-white);
  font-family: var(--fdi-font-head);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
}

.fdi-page-hero__btn { margin-top: 24px; }

.fdi-breadcrumbs {
  margin-bottom: 14px;
  color: var(--fdi-white);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fdi-breadcrumbs a { color: var(--fdi-white); text-decoration: none; }

.page .entry-content { padding-block: clamp(64px, 9vw, 120px); }
.home .entry-content { padding-block: 0; }
/* Production's procedure template starts its copy close under the CTA bar. */
.fdi-procedure .entry-content { padding-block: 60px 38px; }

/* Heading rhythm applies to the flat band-page content only; home and
 * procedure templates space via their sections, as production does. */
.entry-content--wide .wp-block-heading:not(:first-child) { margin-top: 1.65em; }
.entry-content .wp-block-list { padding-left: 1.3em; }
.entry-content .wp-block-list li { margin-bottom: 0.5em; }

/* ---------------------------------------------------------------------------
 * Buttons
 * ------------------------------------------------------------------------ */

.wp-block-button__link,
.wpcf7-submit,
.fdi-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 200px;
  padding: 20px;
  color: var(--fdi-ink) !important;
  background: var(--fdi-aqua) !important;
  border: 1px solid var(--fdi-aqua);
  border-radius: 4px !important;
  font-family: var(--fdi-font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.3s;
}

.wp-block-button__link:hover,
.wpcf7-submit:hover,
.fdi-button:hover {
  background: var(--fdi-green) !important;
  border-color: var(--fdi-green);
}

.wp-block-buttons { margin-top: 20px; }

/* ---------------------------------------------------------------------------
 * Shared homepage typography
 * ------------------------------------------------------------------------ */

.fdi-eyebrow {
  margin-block: 0 20px !important;
  color: var(--fdi-green);
  font-family: var(--fdi-font-head);
  font-size: clamp(1rem, 2vw, 1.4rem) !important;
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 1.6;
  text-transform: uppercase;
}

.home .entry-content h1,
.home .entry-content h2 {
  font-size: clamp(1.8rem, 4vw, 3.6rem);
  font-weight: 500;
  letter-spacing: 4px;
  line-height: 1.2;
  text-transform: capitalize;
  margin: 0 0 20px;
  transition: all 0.5s ease;
}

/* ---------------------------------------------------------------------------
 * Homepage hero
 * ------------------------------------------------------------------------ */

.fdi-home-hero {
  min-height: 100vh !important;
  padding: 0 !important;
  /* Production paints a poster frame behind the hero video. */
  background: url("assets/images/1533196.webp") center / cover no-repeat;
}

.fdi-home-hero .wp-block-cover__inner-container {
  width: min(calc(100% - 124px), 1316px);
  text-align: center;
  padding-top: 80px;
}

.fdi-home-hero h1 {
  color: var(--fdi-white);
  margin-inline: auto;
}

.fdi-home-hero .wp-block-buttons { justify-content: center; display: flex; }

/* ---------------------------------------------------------------------------
 * Homepage feature panels (welcome / practitioner)
 * ------------------------------------------------------------------------ */

.entry-content > .fdi-feature {
  width: min(calc(100% - 160px), 1280px);
  margin-block: 60px;
}

/* Production's section rhythm around the two feature panels. */
.entry-content > .fdi-feature:not(.fdi-feature--panel-right) { margin-bottom: 154px; }
.entry-content > .fdi-feature--panel-right { margin-top: 179px; }
.fdi-feature__panel .wp-block-buttons { margin-top: 52px; }

.fdi-feature { min-height: 1124px !important; padding: 0 !important; background: var(--fdi-white); }
.fdi-feature--panel-right { min-height: 630px !important; }

/* Welcome: full-bleed photo with a translucent white text panel over it
 * (verified against production imagery); practitioner: photo fills the left
 * 47.3% with the text beside it on the white section. */
.fdi-feature--panel-right .wp-block-cover__image-background {
  left: 0 !important;
  right: auto !important;
  width: 49.4% !important;
}

.fdi-feature .wp-block-cover__inner-container {
  width: 100%;
  display: flex;
}

.fdi-feature__panel {
  max-width: 446px;
  margin-left: 7.33%;
  padding: 40px;
  background: rgb(255 255 255 / 85%);
}

.fdi-feature--panel-right .fdi-feature__panel { background: transparent; }

.fdi-feature--panel-right .fdi-feature__panel {
  margin-left: 61.9%;
  max-width: 424px;
}

.fdi-feature__panel h2 { color: var(--fdi-ink); }
.fdi-feature__panel p:not(.fdi-eyebrow) { color: var(--fdi-ink); }

/* ---------------------------------------------------------------------------
 * Homepage treatments (doorways)
 * ------------------------------------------------------------------------ */

.fdi-treatments {
  padding: 130px 32px 120px;
  background: var(--fdi-soft);
  overflow: hidden;
}

.fdi-section-intro {
  max-width: 960px;
  margin: 0 auto 60px;
  text-align: center;
}

.fdi-section-intro > * { max-width: none !important; }

.fdi-treatments .wp-block-group.alignwide {
  max-width: 1280px !important;
  margin: 0 auto;
}

.fdi-treatments .wp-block-group.alignwide > .fdi-treatment-grid { max-width: none !important; }

.fdi-treatment-grid {
  gap: 16px !important;
  margin-bottom: 16px !important;
}

.fdi-treatment-grid .wp-block-column:first-child { margin-top: -60px; }

.fdi-treatment-card {
  min-height: 630px !important;
  overflow: hidden;
}

.fdi-treatment-card .wp-block-cover__background {
  background: rgb(0 0 0 / 30%) !important;
  opacity: 1 !important;
  transition: opacity 0.5s ease, background 0.5s ease;
}

.fdi-treatment-card:hover .wp-block-cover__background { background: rgb(137 217 115 / 80%) !important; }

.fdi-treatment-card .wp-block-cover__inner-container {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 20px 40px 10px;
  text-align: center;
}

.fdi-treatment-card:hover .wp-block-cover__inner-container { justify-content: center; }

.fdi-treatment-card h3 {
  margin: 0 0 20px;
  color: var(--fdi-white);
  font-family: var(--fdi-font-accent);
  font-size: clamp(1rem, 1.2vw, 1.08rem);
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 1.6;
  text-transform: uppercase;
}

.fdi-treatment-card h3 a { color: inherit; text-decoration: none; }

.fdi-treatment-card h3 a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
}

/* Production keeps tile descriptions collapsed (height 0) until hover, when
 * the copy fades in over the recentered tile. */
.fdi-treatment-card p {
  height: 0;
  margin: 0;
  overflow: visible;
  color: var(--fdi-white);
  font-size: clamp(0.9rem, 1.1vw, 0.99rem);
  line-height: 1.8;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.fdi-treatment-card:hover p { opacity: 1; }

/* ---------------------------------------------------------------------------
 * Homepage contact strip + map
 * ------------------------------------------------------------------------ */

.entry-content > .fdi-contact-strip { width: min(calc(100% - 160px), 1280px); }

.fdi-contact-strip { padding-block: 236px 80px; }

.fdi-contact-strip .wp-block-columns {
  display: grid !important;
  grid-template-columns: repeat(4, 320px);
  gap: 0 !important;
  align-items: center !important;
  max-width: none !important;
}

.fdi-contact-strip .wp-block-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.fdi-contact-strip h2 {
  margin-bottom: 0;
  overflow-wrap: normal;
  word-break: normal;
}

.fdi-contact-strip p:not(.fdi-eyebrow) {
  margin: 16px 0 8px;
  font-size: 15.84px;
  line-height: 1;
}

.fdi-strip-label {
  font-weight: 600;
  text-transform: uppercase;
}

.fdi-contact-strip a { color: var(--fdi-ink); text-decoration: none; }

.fdi-contact-strip .wp-block-buttons { justify-content: center; display: flex; margin-top: 0; }

.fdi-map {
  width: 100%;
  max-width: none !important;
  height: 560px;
  margin-top: 64px;
  display: block;
  border: 0;
  background: var(--fdi-soft);
}

/* ---------------------------------------------------------------------------
 * Interior mastheads (band + procedure variants)
 * ------------------------------------------------------------------------ */

.fdi-masthead-band {
  padding: 26px 44px 34px;
  background: var(--fdi-green);
}

.fdi-masthead-band__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.fdi-masthead-band h1 {
  margin: 6px 0 0;
  color: var(--fdi-white);
  text-transform: uppercase;
}

/* Breadcrumbs sit after the H1 in the DOM (as on production) but render
 * above it. */
.fdi-breadcrumbs { order: -1; }

.fdi-masthead-band .fdi-breadcrumbs,
.fdi-page-hero .fdi-breadcrumbs {
  margin-bottom: 0;
  font-size: 11.2px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}

.fdi-masthead-proc .fdi-breadcrumbs {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}

.fdi-masthead-band .fdi-breadcrumbs,
.fdi-page-hero .fdi-breadcrumbs,
.fdi-masthead-band .fdi-breadcrumbs a,
.fdi-page-hero .fdi-breadcrumbs a { color: var(--fdi-white); }
.fdi-masthead-band .fdi-breadcrumbs a:hover { color: var(--fdi-aqua); }
.fdi-crumb-sep { margin: 0 8px; }

.fdi-masthead-proc {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 70vh;
  isolation: isolate;
  overflow: hidden;
  background: var(--fdi-green);
}

/* Production's hero photo is viewport-fixed (a parallax against the page),
 * which also sizes `cover` against the viewport rather than the element. */
.fdi-masthead-proc__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: 50% 0% / cover no-repeat fixed;
}

/* Production dims the whole masthead with a 50% ink overlay. */
.fdi-masthead-proc::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgb(51 51 51 / 50%);
}

.fdi-masthead-proc__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 1128px;
  /* Production's title block sits 52px below the masthead's vertical center
   * (verified at 630px and 980px masthead heights). */
  margin-top: 52px;
  padding: 60px 64px;
  color: var(--fdi-white);
}

.fdi-masthead-proc__text h1 {
  margin: 8px 0 0;
  color: var(--fdi-white);
  font-size: clamp(2rem, 4.45vw, 4rem);
  line-height: 1.15;
  text-transform: uppercase;
}

.fdi-masthead-proc .fdi-breadcrumbs,
.fdi-masthead-proc .fdi-breadcrumbs a { color: var(--fdi-white); }
.fdi-masthead-proc .fdi-breadcrumbs a:hover { color: var(--fdi-aqua); }

.fdi-masthead-proc__btn { margin-top: 53px; margin-left: 16px; }

/* ---------------------------------------------------------------------------
 * Services list layout (sidebar filter + procedure cards)
 * ------------------------------------------------------------------------ */

.fdi-svc-layout {
  display: grid;
  grid-template-columns: 300px 980px;
  gap: 42px;
  width: min(calc(100% - 88px), 1352px);
  margin: 32px auto 90px;
}

.page .fdi-svc-layout .entry-content { padding-block: 0 35px; }
.fdi-svc-layout .entry-content > * { width: 100%; max-width: 916px; margin-inline: 0; }

.fdi-filter {
  padding: 0 32px 32px;
  background: var(--fdi-soft);
}

/* Production: fixed cyan bar that opens the filter as a modal below 1025px. */
.fdi-filter-toggle {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  display: none;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 10px 15px;
  border: 0;
  color: var(--fdi-white);
  background: var(--fdi-aqua);
  font-family: var(--fdi-font-body);
  font-size: 16px;
  cursor: pointer;
}

.fdi-filter-toggle svg { width: 24px; height: 24px; margin-right: 5px; }

.fdi-filter__close {
  display: none;
  position: absolute;
  top: 12px;
  right: 16px;
  width: 36px;
  height: 36px;
  border: 1px solid rgb(51 51 51 / 30%);
  border-radius: 50%;
  background: var(--fdi-white);
  color: var(--fdi-ink);
  font-size: 16px;
  cursor: pointer;
}

.fdi-filter__heading {
  display: block;
  margin: 32px 0 16px;
  padding: 0 24px 0 0;
  color: var(--fdi-ink);
  font-family: var(--fdi-font-head);
  font-size: 14.88px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
  text-transform: uppercase;
}

.fdi-filter__link {
  display: flex;
  margin: 0;
  padding: 8px 0;
  border-radius: 30px;
  color: var(--fdi-ink);
  font-size: 14.4px;
  line-height: 1.5;
  text-decoration: none;
  transition: all 0.7s ease;
}

.fdi-filter__link:hover { color: var(--fdi-teal); }

.fdi-filter__link.fdi-filter__active { transition: none; }

.fdi-listcard-group { margin-bottom: 0; }

.fdi-listcard-group > h2 {
  margin: 0 0 56px;
  font-size: 46.08px;
  font-weight: 500;
  letter-spacing: normal;
}

.fdi-listcards {
  display: grid;
  grid-template-columns: repeat(3, 313px);
  gap: 20px;
  padding-bottom: 24px;
}

/* Production card interaction: green hue at rest deepening on hover, dark
 * scrim, label sliding up, description fading in, arrow appearing, lift
 * shadow — all measured from the rendered mirror. */
.fdi-listcard {
  position: relative;
  display: block;
  min-height: 400px;
  border: 1px solid rgb(51 51 51 / 10%);
  border-radius: 4px;
  overflow: hidden;
  background: var(--fdi-soft) center / cover no-repeat;
  text-decoration: none;
  isolation: isolate;
  box-shadow: rgb(255 255 255 / 10%) 0 0 0 0 inset, rgb(50 50 93 / 25%) 0 0 0 0, rgb(0 0 0 / 30%) 0 0 0 0;
  transition: box-shadow 0.3s ease;
}

.fdi-listcard:hover {
  box-shadow: rgb(255 255 255 / 10%) 0 1px 1px 0 inset, rgb(50 50 93 / 25%) 0 50px 100px -20px, rgb(0 0 0 / 30%) 0 30px 60px -30px;
}

/* Overlay order matches production: green hue above the dark scrim. */
.fdi-listcard::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: 4px;
  background: rgb(137 217 115 / 20%);
  transition: background 0.7s ease;
}

.fdi-listcard::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 4px;
  background: #333;
  opacity: 0.3;
  transition: opacity 0.7s ease;
}

.fdi-listcard:hover::before { background: rgb(137 217 115 / 40%); }

.fdi-listcard__arrow {
  position: absolute;
  bottom: 24px;
  left: 24px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 64px;
  height: 32px;
  color: var(--fdi-white);
  font-size: 1.2rem;
  opacity: 0;
  transition: opacity 0.7s ease;
}

.fdi-listcard:hover .fdi-listcard__arrow { opacity: 1; }

.fdi-listcard__label {
  position: absolute;
  top: 50%;
  right: 1px;
  left: 1px;
  z-index: 1;
  padding: 24px 24px 0;
  color: var(--fdi-white);
  font-family: var(--fdi-font-head);
  font-size: 17.28px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  transition: top 0.7s ease;
}

.fdi-listcard:hover .fdi-listcard__label { top: 35%; }

.fdi-listcard__desc {
  position: absolute;
  top: 70%;
  right: 1px;
  left: 1px;
  z-index: 1;
  padding: 24px 24px 0;
  color: var(--fdi-white);
  font-size: 14.4px;
  line-height: 1.5;
  opacity: 0;
  transition: all 0.7s ease;
}

.fdi-listcard:hover .fdi-listcard__desc { top: 50%; opacity: 1; }

/* Production's scroll-reveal: elements start hidden and push up into view
 * once scrolled to (the .pushup class is applied by site.js, so content
 * stays visible without JavaScript). */
.pushup { opacity: 0; }
.pushed { animation: pushup 0.7s ease-out forwards; }

@keyframes pushup {
  0% { opacity: 0; transform: translateY(60px); }
  100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .pushup { opacity: 1; }
}

/* ---------------------------------------------------------------------------
 * Procedure page extras (related sections, fixed CTA bar, heading accents)
 * ------------------------------------------------------------------------ */

.fdi-procedure .entry-content > ul {
  width: min(calc(100% - 64px), 936px);
  margin: 32px auto 120px;
  padding: 80px;
  background: var(--fdi-soft);
  border-radius: 16px;
  list-style-position: outside;
}

/* Production list rhythm: 12px above and below each item, trimmed at the
 * list's edges (items measure 36/48/48/48/36 on the braces page). */
.fdi-procedure .entry-content > ul li {
  margin-bottom: 0;
  padding: 12px 0;
  font-size: 15.84px;
  line-height: 1.5;
}

.fdi-procedure .entry-content > ul li:first-child { padding-top: 0; }
.fdi-procedure .entry-content > ul li:last-child { padding-bottom: 0; }

/* Green heading underline, positioned so it adds no height (production h2
 * boxes measure line-height only). */
.fdi-procedure .entry-content h2 {
  position: relative;
  margin-bottom: 56px;
}

/* Production leaves 60px between the split band and the next text block. */
.fdi-proc-split + h2,
.fdi-proc-split + .fdi-text-section { margin-top: 60px; }

.fdi-procedure .entry-content h2::after {
  content: "";
  position: absolute;
  top: calc(100% + 24px);
  left: 0;
  display: block;
  width: 220px;
  height: 4px;
  background: var(--fdi-green);
}

/* Production's related band: fixed-attachment office photo under an 80%
 * ink scrim (subtle parallax as the page scrolls). */
.fdi-related-services {
  position: relative;
  isolation: isolate;
  padding: 120px 32px 136px;
  background: url("assets/images/1533166.jpg") center / cover no-repeat fixed;
}

/* The scrim sits over the photo; the heading/cards are lifted above it. */
.fdi-related-services::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: rgb(51 51 51 / 80%);
}

.fdi-related-services h2,
.fdi-related-services .fdi-listcard { z-index: 1; }

.fdi-related-services .fdi-listcards {
  grid-template-columns: repeat(3, 432px);
  gap: 20px;
  padding-inline: 20px;
}
.fdi-related-services .fdi-listcard {
  min-height: 432px;
  border: 0;
  border-radius: 4px;
  background-color: transparent;
}

/* Production's related tiles (doorways__item) carry a single #333 veil at
 * opacity .2 that deepens to .7 on hover — no green wash, no label motion,
 * no arrow; those behaviors belong to the services-page cards only. */
.fdi-related-services .fdi-listcard::before { content: none; }

.fdi-related-services .fdi-listcard::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 4px;
  background: rgb(51 51 51);
  opacity: 0.2;
  transition: opacity 0.7s ease;
}

.fdi-related-services .fdi-listcard:hover::after { opacity: 0.7; }

.fdi-related-services .fdi-listcard:hover { transform: none; box-shadow: none; }
.fdi-related-services .fdi-listcard__arrow { display: none; }
.fdi-related-services .fdi-listcard__label {
  top: calc(50% - 25px);
  bottom: auto;
  right: 9px;
  left: 9px;
  padding: 0 10px;
  font-size: 28.8px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.7;
  text-align: center;
  transition: none;
  z-index: 1;
}

.fdi-related-services .fdi-listcard:hover .fdi-listcard__label { top: calc(50% - 25px); }
.fdi-related-promos { margin-top: 12px; }

.fdi-related-promos .fdi-promolist {
  grid-template-columns: 412.8px;
  gap: 20px;
  justify-content: center;
}

/* Production anchors the related headings to the 1000px column: the
 * services heading is centered on the dark band, the promotions heading is
 * left-aligned; both carry the green underline without added height. */
.fdi-related-services h2,
.fdi-related-promos h2 {
  position: relative;
  width: min(calc(100% - 64px), 1000px);
  margin: 0 auto 40px;
  line-height: 1.2;
  text-align: center;
}

.fdi-related-services h2 { margin-top: 0; margin-bottom: 96px; color: var(--fdi-white); }
.fdi-related-promos h2 { text-align: left; margin-bottom: 56px; }

/* Production's floating booking pill (its third-party widget iframe),
 * bottom-right on every page. */
.fdi-book-fab {
  position: fixed;
  right: 20px;
  bottom: 12px;
  z-index: 340;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  padding: 0 24px;
  border-radius: 28px;
  background: #d3ba21;
  box-shadow: 0 2px 8px rgb(0 0 0 / 25%);
  color: #1a1a1a;
  font-family: var(--fdi-font-body);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
}

.fdi-book-fab:hover { filter: brightness(1.05); }

.fdi-book-fab__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--fdi-white);
}

.fdi-book-fab__icon svg { width: 20px; height: 20px; color: #1a1a1a; }

/* Production's procedure-page "Quick Search" jump navigation: a fixed cyan
 * tab on the right edge opening a slide-out panel (built by site.js). */
.fdi-quicknav__toggle {
  position: fixed;
  top: 420px;
  right: 0;
  z-index: 320;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border: 0;
  background: var(--fdi-aqua);
  color: var(--fdi-white);
  cursor: pointer;
}

.fdi-quicknav__toggle svg { width: 24px; height: 24px; }

.fdi-quicknav__panel {
  position: fixed;
  top: 135px;
  right: 0;
  z-index: 330;
  width: 320px;
  max-height: calc(100vh - 160px);
  padding: 40px;
  overflow-y: auto;
  background: var(--fdi-soft);
  box-shadow: -8px 0 30px rgb(0 0 0 / 15%);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  visibility: hidden;
}

body.quicknav-open .fdi-quicknav__panel { transform: none; visibility: visible; }

.fdi-quicknav__panel .fdi-quicknav__headline {
  margin: 0 0 12px;
  font-family: var(--fdi-font-head);
  font-size: 20.16px;
  font-weight: 500;
}

.fdi-quicknav__panel ul { margin: 0 0 20px; padding: 0; list-style: none; }
.fdi-quicknav__panel li { padding: 10px 0; }

.fdi-quicknav__panel a {
  color: var(--fdi-ink);
  font-size: 14.4px;
  line-height: 1;
  text-decoration: none;
}

.fdi-quicknav__panel a:hover { color: var(--fdi-teal); }

.fdi-related-services h2::after,
.fdi-related-promos h2::after {
  content: "";
  position: absolute;
  top: calc(100% + 24px);
  left: 50%;
  width: 220px;
  height: 4px;
  margin: 0;
  background: var(--fdi-green);
  transform: translateX(-50%);
}

.fdi-related-promos h2::after { left: 0; transform: none; }

.fdi-related-promos .fdi-promolist {
  max-width: 1352px;
  margin: 0 auto;
}

/* Production doorways grid: 1376px wide (so the first tile lands at x=52
 * with the 20px inline padding). */
.fdi-related-services .fdi-listcards {
  max-width: 1376px;
  margin: 0 auto;
}

.fdi-related-promos { padding: 60px 44px 60px; }

/* Promotion cards, after production's promotion--layout-1. */
.fdi-promolist {
  display: grid;
  grid-template-columns: repeat(auto-fill, 427px);
  gap: 20px;
}

.fdi-promo {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 4px;
  background: #fefefe;
  text-decoration: none;
  aspect-ratio: 1 / 1;
}

.fdi-promo__media {
  position: relative;
  display: block;
  flex: 0 0 60%;
  background: var(--fdi-soft) center / cover no-repeat;
}

.fdi-promo__banner {
  position: absolute;
  right: 20px;
  bottom: 20px;
  left: 20px;
  display: block;
  padding: 16px;
  background: rgb(137 217 115 / 80%);
  text-align: center;
}

.fdi-promo__banner em {
  display: block;
  padding-bottom: 10px;
  color: var(--fdi-white);
  font-family: "linotype-didot", Georgia, serif;
  font-size: 12.8px;
  font-style: normal;
}

.fdi-promo__banner strong {
  display: block;
  padding-bottom: 10px;
  color: var(--fdi-white);
  font-family: "proxima-nova", var(--fdi-font-body);
  font-size: 21.33px;
  font-weight: 700;
  text-transform: uppercase;
}

.fdi-promo__hr {
  display: block;
  width: 5%;
  height: 1px;
  margin: 0 auto;
  background: rgb(255 255 255 / 50%);
}

.fdi-promo__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 0;
  min-height: 0;
  text-align: center;
}

.fdi-promo__desc {
  color: #000;
  font-family: "proxima-nova", var(--fdi-font-body);
  font-size: 12.29px;
  line-height: 1.4;
  max-width: 77%;
}

/* Inside procedure "Related Promotions" the cards render slightly smaller
 * (production sizes them by container queries). */
.fdi-related-promos .fdi-promo__banner strong { font-size: 20.64px; letter-spacing: 1px; line-height: 1; }
.fdi-related-promos .fdi-promo__desc { font-size: 11.89px; line-height: 1.8; }

/* Exact production rhythm for the 413px related-promotion card: banner
 * inset 16, tagline 33 high, hr 19x2, description at y256 (10px vertical
 * padding), button at y330, logo lockup 27px tall at y372. */
.fdi-related-promos .fdi-promo__banner { right: 16px; bottom: 17px; left: 16px; }
.fdi-related-promos .fdi-promo__banner em { font-size: 12.8px; line-height: 23.04px; }
.fdi-related-promos .fdi-promo__hr { width: 19px; height: 2px; }
.fdi-related-promos .fdi-promo__body {
  justify-content: flex-start;
  gap: 0;
  padding: 0 0 14px;
}
.fdi-related-promos .fdi-promo__desc { margin-top: 8px; padding: 10px 0; }
.fdi-related-promos .fdi-promo__btn { margin-top: 11px; padding: 7.43px 17.84px; font-size: 9.6px; line-height: 1; }
.fdi-related-promos .fdi-promo__logo { width: auto; height: 27px; margin-top: 18px; }

/* Production serves this banner photo pre-cropped to (93.84,268.36)-(1893.84,
 * 1280.86) of the 2000x1500 original; these percentages reproduce that
 * framing at any card width (the media box is always w x 0.6w). */
.fdi-related-promos .fdi-promo__media {
  background-size: 118.52% auto;
  background-position: 48.22% 55.05%;
}

.fdi-promo__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 16px;
  border-radius: 60px;
  background: var(--fdi-green);
  color: var(--fdi-white);
  font-family: "proxima-nova", var(--fdi-font-body);
  transition: all 0.3s ease;
  font-size: 9.6px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.fdi-promo__logo { width: auto; height: 42px; flex: 0 0 auto; }

.fdi-cta-bar {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 12px 36px;
  background: rgb(4 217 217 / 95%);
}

.fdi-cta-bar__headline {
  color: var(--fdi-white);
  font-family: var(--fdi-font-head);
  font-size: 24.48px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 1;
  text-transform: uppercase;
}

.fdi-cta-bar__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 165px;
  padding: 14px 20px;
  border: 1px solid var(--fdi-white);
  border-radius: 2px;
  background: #04d8d8;
  color: var(--fdi-white);
  font-family: "poppins", var(--fdi-font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.3s;
}

.fdi-cta-bar__btn:hover { background: var(--fdi-green); border-color: var(--fdi-green); }

.fdi-procedure { scroll-behavior: smooth; }

/* Team page roster */
.fdi-team-name { margin-bottom: 8px !important; }
.fdi-team-role {
  margin-bottom: 2.4em;
  font-family: var(--fdi-font-head);
  font-size: 18.72px !important;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* ---------------------------------------------------------------------------
 * Interior page helpers
 * ------------------------------------------------------------------------ */

.page-id-81 .entry-content > .fdi-center-heading { width: min(calc(100% - 88px), 1352px) !important; max-width: none; }

.fdi-split {
  width: 952px !important;
  max-width: calc(100% - 88px) !important;
  gap: 0;
  margin-block: 72px 84px !important;
  margin-left: 268px !important;
  margin-right: auto !important;
}
.fdi-split .wp-block-column:first-child { flex: 0 0 451px; }
.fdi-split__img img { width: 501px; height: 724px; object-fit: cover; }
.fdi-split__img { margin: -30px 0 0; }
.fdi-split__img img { display: block; border: 10px solid var(--fdi-white); box-shadow: var(--fdi-shadow); }

.fdi-center-heading { margin-top: 0 !important; text-align: center; }

.fdi-tile-centered .wp-block-cover__background { background: rgb(0 0 0 / 35%) !important; opacity: 1 !important; }
.fdi-tile-centered .wp-block-cover__inner-container { align-self: center !important; width: 100%; padding: 0; }
.fdi-tile-centered { border-radius: 4px; overflow: hidden; }

.fdi-tile-centered h3 {
  width: 100%;
  margin: 0;
  font-family: var(--fdi-font-head);
  font-size: 18.72px !important;
  font-weight: 400;
  letter-spacing: 1px;
  text-align: center;
  text-transform: uppercase;
}
.fdi-tile-centered h3 a { color: var(--fdi-white); text-decoration: none; }
.fdi-tile-centered h3 a::after { content: ""; position: absolute; inset: 0; }

.fdi-service-grid { gap: 22px !important; margin-top: 52px; }
.page-id-81 .fdi-service-grid { gap: 16px !important; }
.page-id-81 .fdi-service-tile { min-height: 430px !important; }
.page-id-81 .fdi-service-grid .wp-block-column { flex: 0 0 322.7px; }
.fdi-service-tile {
  min-height: 340px !important;
  overflow: hidden;
  box-shadow: var(--fdi-shadow);
}
.fdi-service-tile .wp-block-cover__background { background: linear-gradient(0deg, rgb(8 44 46 / 82%), transparent) !important; opacity: 1 !important; }
.fdi-service-tile .wp-block-cover__inner-container { align-self: end; padding: 28px; }
.fdi-service-tile h2, .fdi-service-tile h3 { color: var(--fdi-white); font-size: 1.35rem; }
.fdi-service-tile a { color: inherit; text-decoration: none; }

.fdi-inline-cta,
.fdi-third-party-note {
  margin-top: 64px !important;
  padding: clamp(30px, 5vw, 56px);
  background: var(--fdi-soft);
  border-left: 5px solid var(--fdi-green);
}

.fdi-inline-form { margin-top: 72px !important; padding-top: 64px; }
/* Production procedure form: 932px white card, radius 4, 64px padding; only
 * the consent row carries the gray field area. */
.fdi-procedure .fdi-inline-form {
  width: min(calc(100% - 64px), 932px);
  background: var(--fdi-white);
  border-radius: 4px;
  padding: 64px;
  margin-top: 96px !important;
}
.fdi-procedure .fdi-inline-form .wpcf7 {
  max-width: none;
  margin: 0 auto;
  padding: 0;
  background: transparent;
}
.fdi-proc-split {
  display: grid;
  grid-template-columns: 585px 1fr;
  gap: 0;
  width: min(calc(100% - 64px), 1000px) !important;
  margin-inline: auto;
  /* Production's single-image section: a full-bleed #f9f9f9 band 60px below
   * the intro text, with the photo topping the band by 120px. */
  margin-top: 60px;
  padding: 180px 0 40px;
  background: var(--fdi-soft);
  box-shadow: 0 0 0 100vmax var(--fdi-soft);
  clip-path: inset(0 -100vmax);
}

/* The closing sections (Smile With Confidence + the form) also sit on a
 * full-bleed soft band; site.js wraps them in this container. */
.fdi-soft-band {
  position: relative;
  margin-top: 0;
  padding: 48px 0 0;
  background: var(--fdi-soft);
  box-shadow: 0 0 0 100vmax var(--fdi-soft);
  clip-path: inset(0 -100vmax);
}

/* Production's faint logo watermark over both gray bands. */
.fdi-proc-split { position: relative; }

.fdi-proc-split::after,
.fdi-soft-band::after {
  content: "";
  position: absolute;
  /* Production: a 350px logo lockup pinned to each band's bottom-right. */
  inset: auto 60px 0 auto;
  width: 350px;
  height: 350px;
  background: url("assets/images/1533090.webp") center / contain no-repeat;
  opacity: 0.05;
  pointer-events: none;
}

.fdi-procedure .entry-content > .fdi-soft-band { width: 100% !important; max-width: none; }

/* Production widths/rhythm inside the closing band: only the form's own
 * heading sits on the 1000px column (site.js tags it). */
.fdi-procedure .fdi-soft-band > h2.fdi-form-heading { width: min(calc(100% - 64px), 1000px); margin-top: 99px; }
.fdi-procedure .fdi-soft-band > .fdi-inline-form { width: min(calc(100% - 64px), 932px) !important; margin-top: 0 !important; }
.fdi-proc-split__text {
  /* Positioned so the panel paints over the photo's -86px overlap: on
   * production the photo tucks UNDER the band surface (the "wrap"). */
  position: relative;
  padding: 40px 40px 0;
  background: var(--fdi-soft);
}
.fdi-proc-split__text > * { width: 100% !important; }
.fdi-proc-split__text > :last-child { margin-bottom: 0; }
.fdi-proc-split__img {
  border-radius: 0;
  background: center / cover no-repeat;
  align-self: start;
  width: 501px;
  height: 688px;
  min-height: 0;
  /* Production: 501x688 photo at +60 from the band top, x=719. */
  margin: -120px 0 0 -86px;
}

/* Production stacks form fields in a single full-width column. */
.fdi-form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.fdi-form-grid .fdi-field--full { grid-column: 1 / -1; }
.wpcf7-form label { display: block; font-size: 0; letter-spacing: 0; }
.page-id-86 .wpcf7-form label,
.page-id-87 .wpcf7-form label { font-size: 16px; }
.wpcf7-form-control-wrap { display: block; margin-top: 8px; }
.wpcf7-form input:not([type="checkbox"]):not([type="submit"]),
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  min-height: 50px;
  padding: 16px;
  color: var(--fdi-ink);
  background: var(--fdi-white);
  border: 1px solid rgb(51 51 51 / 50%);
  border-radius: 4px;
  font-family: var(--fdi-font-body);
  font-size: 16px;
}
.wpcf7-form textarea { min-height: 163px; resize: vertical; }

/* Procedure-page inline form, matched to production's geometry: the field
 * column spans 932px (so the card is 1060px, bleeding 30px past the 1000px
 * content column), inputs are exactly 50px tall on a 20px rhythm with 64px
 * above the first field, the textarea is fixed at 163px, and the select is
 * left native (production never styles it). */
.fdi-procedure .fdi-inline-form .fdi-form-grid { gap: 20px; }
.fdi-procedure .fdi-inline-form .fdi-form-grid p { margin: 0; }
/* Production renders placeholders only. CF7 emits all five fields in one
 * paragraph as label+br sequences: flex labels drop the stray text line box
 * (the text becomes a zero-size anonymous item), the br separators are
 * removed, and 20px label margins recreate production's field rhythm. */
.fdi-procedure .fdi-inline-form .fdi-form-grid p > label {
  display: flex;
  flex-direction: column;
}
.fdi-procedure .fdi-inline-form .fdi-form-grid p br { display: none; }
.fdi-procedure .fdi-inline-form .fdi-form-grid p > label { margin-bottom: 20px; }
.fdi-procedure .fdi-inline-form .fdi-form-grid p > label:last-of-type { margin-bottom: 0; }
.fdi-procedure .fdi-inline-form .wpcf7-form-control-wrap { margin-top: 0; }
.fdi-procedure .fdi-inline-form .wpcf7-form input:not([type="checkbox"]):not([type="submit"]) {
  height: 50px;
  line-height: 1;
}
.fdi-procedure .fdi-inline-form .wpcf7-form select {
  height: 50px;
  padding: 0;
  border: 1px solid rgb(118 118 118);
  border-radius: 0;
}
.fdi-procedure .fdi-inline-form .wpcf7-form textarea {
  height: 163px;
  min-height: 163px;
}
/* Production rhythm: 33px above the consent box, 25px above the button. */
.fdi-procedure .fdi-inline-form .wpcf7-acceptance { margin-top: 13px; }
.fdi-procedure .fdi-inline-form .wpcf7-submit { margin-top: 5px; }
.wpcf7-form input:focus, .wpcf7-form select:focus, .wpcf7-form textarea:focus { outline: 3px solid rgb(4 217 217 / 22%); border-color: var(--fdi-aqua); }
.wpcf7-acceptance { display: block; padding: 12px 15px; background: #f7f7f7; }
.wpcf7-acceptance label { display: flex; gap: 12px; align-items: flex-start; color: #1a1a1a; font-size: 16px !important; font-weight: 400; letter-spacing: 0; line-height: 1.4; text-transform: none; }
.wpcf7-acceptance input { margin-top: 4px; }

.fdi-privacy-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 16px;
  color: var(--fdi-ink);
  font-size: 12.8px;
  line-height: 1.15;
}

/* Production's padlock glyph beside the privacy note. */
.fdi-privacy-note::before {
  content: "";
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><g stroke-width="1" fill="none" stroke="%23000" stroke-linecap="round" stroke-linejoin="round"><path d="M14.5,9c0,4.5-6.5,6.5-6.5,6.5,0,0-6.5-2-6.5-6.5V2.5L8,.5l6.5,2v6.5Z"/><path d="M6.5,7.5v-1.5c0-.828,.672-1.5,1.5-1.5h0c.828,0,1.5,.672,1.5,1.5v1.5"/><rect x="5.5" y="7.5" width="5" height="3"/></g></svg>') center / contain no-repeat;
}

.wpcf7-acceptance a { color: rgb(0, 102, 204); }

.fdi-hours { width: 100%; border-collapse: collapse; }
.fdi-hours th, .fdi-hours td { padding: 10px 0; text-align: left; border-bottom: 1px solid #dce5e3; }

.wp-block-column .fdi-form-grid { grid-template-columns: 1fr; }
.wp-block-column .fdi-form-grid .fdi-field--full { grid-column: auto; }
.fdi-scheduler { width: 100%; min-height: 900px; border: 0; background: var(--fdi-soft); }

.fdi-reviews { display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fdi-review { padding: 30px; background: var(--fdi-soft); border-top: 4px solid var(--fdi-green); }
.fdi-review blockquote { margin: 0; font-size: 1.05rem; }
.fdi-review cite { display: block; margin-top: 20px; color: var(--fdi-teal); font-weight: 700; font-style: normal; }

/* ---------------------------------------------------------------------------
 * Disclaimer + footer
 * ------------------------------------------------------------------------ */

.fdi-disclaimer {
  padding: 20px 24px;
  color: var(--fdi-white);
  background: var(--fdi-teal);
  font-size: 1rem;
  text-align: center;
}

.site-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  color: var(--fdi-white);
  background: var(--fdi-teal);
}

.site-footer .fdi-disclaimer { width: 100%; }

.fdi-footer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 18px 24px 44px;
  text-align: center;
}

.fdi-footer-logo {
  width: 96px;
  height: 96px;
  object-fit: contain;
}

.fdi-footer-google {
  margin-top: 28px;
  color: var(--fdi-white);
}

.fdi-footer-google svg { width: 26px; height: 26px; display: block; }

.site-footer a { color: var(--fdi-white); text-decoration: none; }

.fdi-footer-address {
  display: flex;
  justify-content: center;
  gap: 0;
  margin: 40px 0 0;
  font-size: 15.84px;
  line-height: 1.8;
  text-align: left;
}

.fdi-footer-address span { padding: 0 5px; }

.fdi-footer-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  margin: 20px 0 0;
  padding: 0;
  font-size: 14.4px;
  line-height: 1.15;
  list-style: none;
  text-align: left;
}

.fdi-footer-links li:nth-child(2) { padding-left: 20px; }
.fdi-footer-links li:nth-child(3) { padding: 0 20px; }

.fdi-hometag {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  font-family: var(--fdi-font-head);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.15;
  text-align: left;
}

/* ---------------------------------------------------------------------------
 * Responsive
 * ------------------------------------------------------------------------ */

@media (max-width: 1240px) {
  .fdi-header-inner { padding: 10px 20px 6px; grid-template-columns: 1fr auto 1fr; }
  .site-branding img { width: 84px; height: 84px; }
  .fdi-header-book { display: none; }
  .fdi-menu-toggle { grid-column: 3; display: block; justify-self: end; }
  /* Production: white panel sliding in from the right, over the page. */
  .primary-navigation {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    z-index: 200;
    width: 82%;
    max-width: 440px;
    margin: 0;
    padding: 64px 24px 32px 32px;
    overflow-y: auto;
    background: var(--fdi-white);
    box-shadow: -12px 0 40px rgb(0 0 0 / 18%);
    transform: translateX(105%);
    transition: transform 0.3s ease;
  }
  .menu-open .primary-navigation { transform: none; }
  .fdi-nav-close {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 20px;
    right: 20px;
    width: 36px;
    height: 36px;
    border: 1px solid rgb(51 51 51 / 30%);
    border-radius: 50%;
    background: var(--fdi-white);
    color: var(--fdi-ink);
    font-size: 14px;
    cursor: pointer;
  }
  .primary-navigation ul { display: block; }
  .primary-navigation > ul > li { padding: 0; position: relative; }
  .primary-navigation li { position: relative; }
  .primary-navigation a { padding: 13px 0; font-size: 0.82rem; color: var(--fdi-ink) !important; }
  /* Submenus stay collapsed behind per-item expanders, as on production. */
  .primary-navigation .sub-menu { display: none; position: static; min-width: 0; width: auto; padding: 0 0 0 18px; box-shadow: none; }
  .primary-navigation li.fdi-open > .sub-menu { display: block; }
  .primary-navigation .sub-menu a { background: transparent; padding: 13px 0; }
  .fdi-sub-toggle {
    position: absolute;
    top: 6px;
    right: 0;
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: var(--fdi-ink);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: transform 0.2s ease;
  }
  .primary-navigation li.fdi-open > .fdi-sub-toggle { transform: rotate(90deg); }
  .primary-navigation .sub-menu .fdi-sub-toggle { top: 6px; }
}

@media (min-width: 1241px) {
  .fdi-nav-close, .fdi-sub-toggle { display: none; }
}

/* Tablet: production keeps the treatment-tile pair side by side. The
 * heavier selectors outrank core's column-stacking rules below 782px. */
@media (min-width: 768px) and (max-width: 1024px) {
  .entry-content > .fdi-treatments { width: 100%; }
  .fdi-treatments { padding: 60px 4px 60px 80px; }
  .fdi-section-intro { width: 568px; max-width: none; margin: 0 auto 60px 20px !important; padding: 0; }
  .fdi-section-intro > * { margin-inline: 0 !important; }
  .fdi-treatments .fdi-treatment-grid { display: flex !important; flex-wrap: nowrap !important; gap: 87px !important; }
  .fdi-treatments .fdi-treatment-grid.wp-block-columns > .wp-block-column { flex: 1 1 0 !important; margin-bottom: 0; }
  .fdi-treatment-card { min-height: 480px !important; }
  /* Production double-pads the tile text (item 40px + text block 40px). */
  .fdi-treatment-card .wp-block-cover__inner-container { padding: 40px 80px; }
  .fdi-treatment-card h3 { font-size: 16px; line-height: 1.6; }
}

/* Below the sidebar breakpoint production shows the tile copy outright. */
@media (max-width: 1024px) {
  .fdi-treatment-card p {
    height: auto;
    margin: 14.4px 0;
    font-size: 14.4px;
    line-height: 1.8;
    opacity: 1;
    transition: none;
  }
}

/* Production hides the services sidebar below 1025px: the filter opens as a
 * modal from the fixed Search bar and the cards go two-up. */
@media (max-width: 1024px) {
  .fdi-svc-layout { display: block; width: 100%; margin: 0 0 90px; padding: 0 24px; }
  .fdi-filter { display: none; }
  body.filter-open .fdi-filter {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 400;
    overflow-y: auto;
    padding: 64px 24px 24px;
  }
  body.filter-open { overflow: hidden; }
  .fdi-filter-toggle { display: flex; }
  .fdi-filter__close { display: block; }
  .fdi-listcards { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .fdi-listcard-group > h2 { margin: 0 0 56px; font-size: 24.576px; }
  .fdi-listcard__label { top: 160px; font-size: 16px; }
  .fdi-listcard__desc { top: 224px; font-size: 12.8px; opacity: 1; }
  /* Touch viewports show the hover-strength green, as the copy is exposed. */
  .fdi-listcard::before { background: rgb(137 217 115 / 40%); }
}

@media (max-width: 900px) {
  .fdi-shell { width: min(calc(100% - 32px), var(--fdi-content)); }
  .entry-content > *, .entry-content > .alignwide { width: min(calc(100% - 32px), var(--fdi-content)); }
  .fdi-promolist { grid-template-columns: 1fr; }
  .entry-content--wide > *, .entry-content--wide > .alignwide { width: min(calc(100% - 32px), 1256px); margin-inline: 16px auto; }
  .fdi-masthead-band { padding: 20px 16px 26px; }
  .fdi-contact-strip .wp-block-columns { display: block; text-align: center; }
  .fdi-contact-strip .wp-block-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  /* Procedure pages collapse to production's single 326px-content column. */
  .fdi-proc-split { display: block; width: calc(100% - 64px) !important; }
  .fdi-proc-split__text { padding: 20px 0; }
  .fdi-proc-split__img { min-height: 220px; margin-top: 20px; }
  .fdi-procedure .entry-content > ul { padding: 40px; }
  .fdi-procedure .fdi-inline-form { width: calc(100% - 64px); padding: 24px 16px; }
  .fdi-related-services .fdi-listcards { grid-template-columns: 286px; gap: 20px; justify-content: center; }
  .fdi-related-services .fdi-listcard { min-height: 286px; }
  .fdi-related-services .fdi-listcard__label { font-size: 19.2px; }
  .fdi-related-promos .fdi-promolist { grid-template-columns: 326px; justify-content: center; }
  .fdi-related-promos .fdi-promo__banner strong { font-size: 16.3px; }
  .fdi-masthead-proc { min-height: 50vh; }
  .fdi-masthead-proc__text { padding: 40px 24px; }
  .fdi-cta-bar { flex-direction: column; gap: 10px; padding: 10px 16px; }
  .fdi-feature { min-height: 0 !important; }
  .fdi-feature__panel,
  .fdi-feature--panel-right .fdi-feature__panel {
    max-width: none;
    margin: 40vw 0 0;
    padding: 40px 56px;
    background: var(--fdi-white);
    text-align: center;
  }
  .fdi-feature__panel .wp-block-buttons { justify-content: center; display: flex; }
  .fdi-contact-strip .wp-block-columns { display: block; text-align: center; }
  .fdi-contact-strip p:not(.fdi-eyebrow) { font-size: 14.4px; }
  .fdi-page-hero { grid-template-columns: 1fr; min-height: 0; }
  .fdi-page-hero__media { min-height: 40vw; }
  .fdi-page-hero__panel { padding-block: 32px; }
  .fdi-treatment-grid .wp-block-column:first-child { margin-top: 0; }
  .fdi-form-grid { grid-template-columns: 1fr; }
  .fdi-form-grid .fdi-field--full { grid-column: auto; }
  .fdi-reviews { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  body { font-size: 15px; }
  .fdi-header-phone .fdi-cta-text { display: none; }
  .fdi-home-hero { min-height: 500px !important; }
  .fdi-home-hero .wp-block-cover__inner-container { width: 100%; padding: 130px 62px 0; }
  .fdi-page-hero__media { min-height: 52vw; }
  .fdi-feature__panel {
    margin: 40vw 0 0;
    padding: 40px 56px;
    background: var(--fdi-white);
    text-align: center;
  }
  .fdi-feature__panel .wp-block-buttons { justify-content: center; display: flex; }
  .fdi-treatments { padding: 60px 32px; }
  .fdi-section-intro { padding-inline: 20px; }
  .fdi-treatment-grid { display: block !important; }
  .fdi-treatment-grid > .wp-block-column { margin-bottom: 12px; }
  .fdi-treatment-card { min-height: 440px !important; }
  .fdi-treatment-card .wp-block-cover__inner-container { padding: 20px 40px; }
  .fdi-treatment-card h3 { font-size: 16px; line-height: 1.6; }
  .fdi-masthead-proc .fdi-breadcrumbs,
  .fdi-masthead-proc .fdi-breadcrumbs a { font-size: 12.8px; }
  .fdi-disclaimer { font-size: 14.4px; line-height: 1.65; }
  .fdi-contact-strip .wp-block-columns { display: block; text-align: center; }
  .fdi-contact-strip .wp-block-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .fdi-contact-strip p:not(.fdi-eyebrow) { font-size: 14.4px; }
  .home .entry-content h2 { font-size: 25.6px; }
  .fdi-treatment-card .wp-block-cover__inner-container { padding: 20px 60px; }
  .fdi-map { height: 400px; margin-top: 40px; }
  .fdi-scheduler { min-height: 760px; }
  .fdi-footer-address { flex-direction: column; gap: 4px; }
  .fdi-footer-links { flex-direction: column; gap: 12px; }
  .fdi-listcards { grid-template-columns: 1fr; }
  /* Production phone layout: every procedure band collapses to 40px
   * vertical padding, the split photo spans the content width, and the
   * promotion card fills the column. */
  .fdi-procedure .entry-content { padding-block: 40px 38px; }
  .fdi-proc-split { grid-template-columns: 1fr; margin-top: 0; padding: 40px 0; }
  .fdi-proc-split__img {
    width: 100%;
    height: auto;
    aspect-ratio: 501 / 688;
    margin: -120px auto 0;
  }
  .fdi-related-services { padding: 40px 32px 56px; }
  .fdi-related-promos { padding: 40px 32px; }
  .fdi-related-promos .fdi-promolist { grid-template-columns: 1fr; }
  .fdi-related-promos .fdi-promo__banner { right: 20px; left: 20px; padding: 10px 16px; }
  .fdi-soft-band { padding-bottom: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}