/* v3 "silver glass". Scoped to body.page-v3 (fragment meta "nav": "v3"). Loaded last, after site.css, features.css, motion.css, video.css.
   Built from the v3 design handoff (Dentistry and Implants Home.dc.html), then taken further:
   - Liquid Glass lives ONLY on floating controls (header, buttons, pills, hero badges, flyout). Cards, tiles, forms, the office panel,
     before/after pairs and photo frames are solid white.
   - Buttons carry no color. Schedule Now pops through contrast (graphite glass) and a bright lensed rim, Call Now is white glass.
   - Cursor light (--mx/--my), rim direction (--ang), press = gel flex. No idle animation on glass.
   - Pearl-spotlight hero with one slow light sweep, floating tilting photo frame, lift-on-hover cards. All motion off under prefers-reduced-motion. */

@property --ang { syntax: "<angle>"; inherits: true; initial-value: 280deg; }
@property --gs { syntax: "<length>"; inherits: false; initial-value: 90px; }
@property --gi { syntax: "<number>"; inherits: false; initial-value: .45; }
@property --ri { syntax: "<number>"; inherits: true; initial-value: .35; }

:root {
  --v3-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --v3-brand: #2552b0; --v3-brand-2: #6f7ef2; --v3-ink: #1d1d1f; --v3-ink-2: #6e6e73; --v3-ink-metal: #4a4a52; --v3-white: #fff; --v3-silver: #f5f5f7;
  --v3-radius: 28px; --v3-pill: 980px;
  --v3-card-shadow: inset 0 0 0 1px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04), 0 12px 32px -18px rgba(30,30,40,.2);
  --v3-card-shadow-hover: inset 0 0 0 1px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(0,0,0,.04), 0 24px 48px -16px rgba(30,30,40,.32);
  --v3-frame-shadow: inset 0 0 0 1px rgba(0,0,0,.05), 0 2px 4px rgba(0,0,0,.06), 0 30px 70px -24px rgba(20,20,30,.38);
  --v3-ease: cubic-bezier(.22,.61,.36,1); --v3-lift: cubic-bezier(.2,.8,.2,1); --v3-gel: cubic-bezier(.34,1.56,.64,1);
  --v3-fs-super: 80px; --v3-fs-hero: 56px; --v3-fs-h3: 28px; --v3-fs-eyebrow: 21px; --v3-fs-subhead: 28px; --v3-fs-intro: 21px; --v3-fs-body: 17px; --v3-fs-link: 21px;
  --v3-nav-h: 52px; --v3-max: 980px; --v3-max-wide: 1200px; --v3-gutter: 22px; --v3-section-pad: 120px;
}
@media (max-width: 1068px) { :root { --v3-fs-super: 64px; --v3-fs-hero: 48px; --v3-fs-subhead: 24px; --v3-fs-eyebrow: 19px; --v3-fs-intro: 19px; --v3-fs-link: 19px; --v3-section-pad: 100px; } }
@media (max-width: 734px) { :root { --v3-fs-super: 44px; --v3-fs-hero: 34px; --v3-fs-h3: 24px; --v3-fs-subhead: 19px; --v3-fs-eyebrow: 17px; --v3-fs-intro: 17px; --v3-fs-body: 16px; --v3-fs-link: 17px; --v3-gutter: 16px; --v3-section-pad: 76px; --v3-radius: 22px; --v3-nav-h: 48px; } }

/* ---------- base ---------- */
.page-v3 { background: #fff; color: var(--v3-ink); font-family: var(--v3-font); font-size: var(--v3-fs-body); line-height: 1.47; letter-spacing: -.022em; -webkit-font-smoothing: antialiased; }
.page-v3 main { display: block; }
.page-v3 a { color: inherit; }
.page-v3 h1, .page-v3 h2, .page-v3 h3 { font-family: var(--v3-font); font-weight: 600; color: inherit; }
.page-v3 .accent, .page-v3 .brand-amp { color: inherit; }
.page-v3 .util-bar, .page-v3 .review-banner { display: none; }
.page-v3 :focus-visible { outline: 2px solid var(--v3-ink); outline-offset: 3px; }
.page-v3 .v3-graphite :focus-visible { outline-color: #fff; }

/* ---------- section rhythm ---------- */
.page-v3 .v3-section { position: relative; padding: var(--v3-section-pad) 0; text-align: center; overflow: hidden; scroll-margin-top: calc(var(--v3-nav-h) + 8px); }
.page-v3 .v3-white { background: #fff; }
.page-v3 .v3-silver { background: var(--v3-silver); }
.page-v3 .v3-tight { padding-top: calc(var(--v3-section-pad) * .55); padding-bottom: calc(var(--v3-section-pad) * .55); }
.page-v3 .v3-graphite { color: #f5f5f7; background: radial-gradient(120% 80% at 50% 0%, #4a4a52 0%, #2b2b30 55%, #1f1f23 100%); }
.page-v3 .v3-graphite::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(40% 30% at 50% 0%, rgba(255,255,255,.07), rgba(255,255,255,0) 70%), repeating-linear-gradient(90deg, rgba(255,255,255,.018) 0 1px, rgba(0,0,0,0) 1px 3px); }
.page-v3 .v3-wrap { position: relative; z-index: 2; width: 100%; max-width: var(--v3-max); margin: 0 auto; padding: 0 var(--v3-gutter); box-sizing: border-box; }
.page-v3 .v3-wrap-wide { max-width: var(--v3-max-wide); }

/* ---------- type ---------- */
.page-v3 .v3-eyebrow { margin: 0; font: 600 var(--v3-fs-eyebrow)/1.19 var(--v3-font); letter-spacing: .011em; color: var(--v3-ink-2); }
.page-v3 .v3-graphite .v3-eyebrow { color: rgba(245,245,247,.64); }
.page-v3 .v3-headline { margin: 8px 0 0; font: 600 var(--v3-fs-hero)/1.07 var(--v3-font); letter-spacing: -.008em; text-wrap: balance; }
.page-v3 .v3-super { font-size: var(--v3-fs-super); line-height: 1.04; letter-spacing: -.022em; }
.page-v3 .v3-h3 { margin: 0; font: 600 var(--v3-fs-h3)/1.14 var(--v3-font); letter-spacing: .004em; }
.page-v3 .v3-subhead { margin: 14px auto 0; max-width: 820px; font: 400 var(--v3-fs-subhead)/1.1429 var(--v3-font); letter-spacing: .007em; text-wrap: balance; }
.page-v3 .v3-intro { margin: 12px auto 0; max-width: 44ch; font: 400 var(--v3-fs-intro)/1.24 var(--v3-font); letter-spacing: .011em; color: var(--v3-ink-2); text-wrap: pretty; }
.page-v3 .v3-body { margin: 10px 0 0; color: var(--v3-ink-2); }
.page-v3 .v3-fine { margin: 12px 0 0; font-size: 13px; line-height: 1.33; color: var(--v3-ink-2); }
.page-v3 .v3-mark { margin: 0; font: 600 clamp(72px, 9vw, 128px)/.95 var(--v3-font); letter-spacing: -.035em; background: linear-gradient(180deg, #c7c8ce, #8a8b93); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* hero headline: graphite with one slow, soft shimmer */
.page-v3 .v3-metal-text { background: linear-gradient(100deg, #1d1d1f 0%, #2e2e33 30%, #1d1d1f 48%, #33343a 70%, #1d1d1f 100%); background-size: 220% 100%; animation: v3-text 10s ease-in-out infinite; -webkit-background-clip: text; background-clip: text; color: transparent; }
@keyframes v3-text { 0%, 100% { background-position: 0% 0; } 50% { background-position: 100% 0; } }


/* cursor-responsive emphasis on "Trust" and "Last": lift + a light glint that follows the pointer, and an underline that grows as it nears */
.page-v3 .v3-em { --p: 0; position: relative; display: inline-block; transform-origin: 50% 85%;
  transform: translateY(calc(var(--p) * -7px)) scale(calc(1 + var(--p) * .06)); transition: transform .28s var(--v3-lift);
  background: radial-gradient(circle 130px at var(--ex, 50%) var(--ey, 50%), rgba(255,255,255,calc(var(--p) * .6)), rgba(255,255,255,0) 70%), linear-gradient(100deg, #0d0d0f 0%, #3a3b42 50%, #0d0d0f 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; animation: none; }
.page-v3 .v3-em::after { content: ""; position: absolute; left: .02em; right: .02em; bottom: .04em; height: .055em; border-radius: 99px; pointer-events: none;
  background: linear-gradient(90deg, var(--v3-brand), var(--v3-brand-2)); transform-origin: 0 50%; transform: scaleX(calc(.34 + var(--p) * .66)); opacity: calc(.4 + var(--p) * .6); transition: transform .28s var(--v3-lift), opacity .28s; }


/* hero pills flanking "Ask us anything": the two things to know, as light glass chips */
.page-v3 .v3h-ask { gap: 14px 16px; }
@media (min-width: 1101px) {
  .page-v3 .v3-links.v3h-ask { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); width: min(1100px, 100%); margin-left: auto; margin-right: auto; }
  .page-v3 .v3-links.v3h-ask .v3-chip:first-child { justify-self: end; } .page-v3 .v3-links.v3h-ask .v3-chip:last-child { justify-self: start; }
}
.page-v3 .v3-chip { display: inline-flex; align-items: center; gap: 9px; padding: 11px 20px; border-radius: var(--v3-pill); font: 500 16px/1.2 var(--v3-font); letter-spacing: -.012em; color: var(--v3-ink); text-decoration: none; white-space: nowrap;
  background: rgba(255,255,255,.58); border: 1px solid rgba(255,255,255,.9); -webkit-backdrop-filter: blur(10px) saturate(190%) brightness(1.04); backdrop-filter: blur(10px) saturate(190%) brightness(1.04);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.07), 0 0 0 .5px rgba(29,29,31,.12), 0 8px 20px -10px rgba(40,44,60,.28); transition: transform .45s var(--v3-gel), box-shadow .3s; }
.page-v3 .v3-chip:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 #fff, 0 0 0 .5px rgba(29,29,31,.12), 0 0 18px rgba(255,255,255,.2), 0 14px 26px -10px rgba(40,44,60,.32); }
.page-v3 .v3-chip-dot { width: 9px; height: 9px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #a3adf6 0 18%, var(--v3-brand) 62%); flex: 0 0 auto; }
@media (max-width: 1100px) { .page-v3 .v3h-ask .v3-ask { order: -1; flex-basis: 100%; justify-content: center; max-width: max-content; margin: 0 auto; } }
@media (max-width: 734px) { .page-v3 .v3-chip { font-size: 14px; padding: 9px 14px; white-space: normal; text-align: left; } }


/* ---------- hero identity: big logo + locations that fly into the header corners on scroll ---------- */
.page-v3 .v3-hero-logo { display: inline-flex; align-items: center; gap: 30px; margin: 0 0 22px; color: var(--v3-brand); text-decoration: none; white-space: nowrap; }
.page-v3 .v3-hero-logo img { width: 84px; height: 84px; object-fit: contain; }
.page-v3 .v3-hero-logo span { font: 600 36px/1 var(--v3-font); letter-spacing: .16em; text-transform: uppercase; }
.page-v3 .v3-hero-loc { width: fit-content; margin: 0 auto; font: 600 21px/1.19 var(--v3-font); letter-spacing: .011em; color: var(--v3-ink-metal); white-space: nowrap; }
.page-v3 .v3h-title { margin-top: 12px; }
.v3-navloc { position: fixed; left: 0; top: 0; z-index: 2; margin: 0; pointer-events: none; will-change: transform, opacity; white-space: nowrap; font: 600 12px/1.2 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: .01em; color: #4a4a52; }
@media (max-width: 734px) { .v3-navloc { font-size: 11px; } }
html.v3-js .page-v3 .v3-offers[data-v3-scroll] .v3-card { will-change: transform, opacity; }
.page-v3 .v3-marquee.is-collapsing .v3-pill { will-change: transform, opacity; }
.v3-fly { position: fixed; left: 0; top: 0; z-index: 2; margin: 0; transform-origin: 0 0; will-change: transform; pointer-events: none; }
.v3-fly.v3-hero-logo, .v3-fly a { pointer-events: auto; }
html.v3-fly-on .page-v3 .v3-hero .v3-hero-logo:not(.v3-fly), html.v3-fly-on .page-v3 .v3-hero .v3-hero-loc.is-flying:not(.v3-fly) { visibility: hidden; }
html.v3-fly-on .page-v3 .site-header .brand { opacity: 0; }
@media (min-width: 1380px) { body.page-v3 .site-header .header-inner { max-width: 1400px; padding-right: 290px; } }
@media (max-width: 734px) {
  .page-v3 .v3-hero-logo { gap: 14px; margin-bottom: 16px; } .page-v3 .v3-hero-logo img { width: 48px; height: 48px; } .page-v3 .v3-hero-logo span { font-size: 17px; }
  .page-v3 .v3-hero-loc { font-size: 15px; white-space: normal; padding: 0 16px; }
}


/* typed mission sentence */
.page-v3 .v3h-mission.v3-typing .v3-ch { opacity: 0; }
.page-v3 .v3h-mission.v3-typing .v3-ch.on { opacity: 1; }
.page-v3 .v3h-mission .v3-ch.is-caret::after { content: ""; display: inline-block; width: 2px; height: 1.05em; margin-left: 1px; margin-right: -3px; vertical-align: -.17em; border-radius: 1px; background: #1d1d1f; animation: v3-blink 1s steps(1) infinite; transition: opacity .6s; }
.page-v3 .v3h-mission.v3-typed .v3-ch.is-caret::after { opacity: 0; animation: none; }
@keyframes v3-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

/* ---------- text links: graphite dot + graphite underline, no color ---------- */
.page-v3 .v3-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 22px; margin-top: 26px; }
.page-v3 .v3-link { display: inline-flex; align-items: baseline; color: inherit; font: 400 var(--v3-fs-link)/1.19 var(--v3-font); letter-spacing: .011em; text-decoration: none; white-space: nowrap; background: none; border: 0; padding: 0; cursor: pointer; }
.page-v3 .v3-link::after { content: "\203A"; display: inline-block; padding-inline-start: .26em; transition: transform 240ms var(--v3-ease); }
.page-v3 .v3-link:hover span { text-decoration: underline; text-underline-offset: .16em; }
.page-v3 .v3-link:hover::after { transform: translateX(3px); }
.page-v3 .v3-link-cta { font-weight: 500; }
.page-v3 .v3-link-cta span { border-bottom: 2px solid var(--v3-brand); padding-bottom: 2px; }
.page-v3 .v3-link-cta::before { content: ""; align-self: center; width: 9px; height: 9px; margin-right: 8px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #a3adf6 0 18%, var(--v3-brand) 62%); }
.page-v3 .v3-graphite .v3-link, .page-v3 .v3-graphite .v3-link:hover { color: #f5f5f7; }
.page-v3 .v3-graphite .v3-link-cta span { border-bottom-color: #f5f5f7; }
.page-v3 .v3-graphite .v3-link-cta::before { background: radial-gradient(circle at 35% 30%, #fff 0 18%, #8a8b93 70%); }

/* =====================================================================
   LIQUID GLASS BUTTONS
   Primary   = Schedule Now / Book online / Send referral: graphite glass, bright lensed rim, white label (the one that pops)
   Secondary = Call Now / Menu / Ask us anything: frosted white glass
   ===================================================================== */
.page-v3 :is(.v3-btn, .v3-ask, .header-cta, .header-call, .menu-toggle, .v3-flyout-cta, .office-row-actions .button, .cta-dock a) {
  --btn-text: #1d1d1f;
  --btn-base: rgba(255,255,255,.58);
  --btn-border: rgba(255,255,255,.9);
  --btn-light: 255,255,255;
  --btn-shadow: inset 0 0 0 1px rgba(255,255,255,.55), inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.07), inset 0 0 8px rgba(255,255,255,.45), inset 0 1px 0 #fff, 0 0 0 .5px rgba(29,29,31,.12), 0 8px 20px -10px rgba(40,44,60,.28);
  --btn-shadow-hover: inset 0 1px 0 #fff, 0 0 0 .5px rgba(29,29,31,.12), 0 0 18px rgba(255,255,255,.18), 0 14px 26px -10px rgba(40,44,60,.32);
  position: relative; overflow: hidden; isolation: isolate; box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 50px; padding: 0 28px; border-radius: var(--v3-pill);
  font: 600 17px/1.1 var(--v3-font); letter-spacing: -.016em; text-decoration: none; white-space: nowrap; cursor: pointer;
  color: var(--btn-text); border: 1px solid var(--btn-border);
  background:
    radial-gradient(var(--gs) calc(var(--gs) * .7) at var(--mx, 50%) var(--my, 0%), rgba(var(--btn-light), var(--gi)), rgba(var(--btn-light), 0) 70%),
    linear-gradient(110deg, rgba(var(--btn-light), 0) 35%, rgba(var(--btn-light), .9) 50%, rgba(var(--btn-light), 0) 65%) 110% 0 / 250% 100% no-repeat,
    var(--btn-base);
  box-shadow: var(--btn-shadow);
  -webkit-backdrop-filter: blur(10px) saturate(190%) brightness(1.04); backdrop-filter: blur(10px) saturate(190%) brightness(1.04);
  transition: transform .45s var(--v3-gel), --gs .4s, --gi .4s;
}
.page-v3 :is(.v3-btn-schedule, .header-cta, .office-row-actions .button, .v3-flyout-cta, .cta-dock .cta-book, .v3-form-actions .v3-btn) {
  /* Schedule Now: periwinkle-to-royal-blue glass, white label (Gavin's pick, 10-06) */
  --btn-text: #fff;
  --btn-border: rgba(255,255,255,.38);
  --btn-base: linear-gradient(100deg, #a3adf6 0%, #6f7ef2 34%, #4c5ee8 70%, #3a4bdc 100%);
  --btn-shadow: inset 0 1px 1px rgba(255,255,255,.75), inset 0 -1px 1px rgba(20,30,120,.35), inset 0 0 10px rgba(255,255,255,.18), 0 0 0 .5px rgba(40,50,160,.35), 0 10px 24px -10px rgba(58,75,220,.6), 0 3px 8px -4px rgba(40,50,160,.3);
  --btn-shadow-hover: inset 0 1px 1px rgba(255,255,255,.85), inset 0 -1px 1px rgba(20,30,120,.35), 0 0 0 .5px rgba(40,50,160,.35), 0 0 26px rgba(110,125,245,.45), 0 18px 34px -12px rgba(58,75,220,.65);
  text-shadow: 0 1px 1px rgba(20,30,120,.25);
}
/* hero "Ask us anything": the one dark glass pill on the page, so it reads first; it becomes the bottom-left chat pill on scroll */
body.page-v3 .v3h-ask .v3-ask {
  --btn-text: #fff; --btn-border: rgba(255,255,255,.28);
  --btn-base: linear-gradient(180deg, rgba(86,86,92,.94), rgba(40,40,44,.96));
  --btn-shadow: inset 0 1px 1px rgba(255,255,255,.5), inset 0 -1px 1px rgba(0,0,0,.4), inset 0 0 8px rgba(255,255,255,.08), 0 16px 34px -10px rgba(0,0,0,.42), 0 2px 6px rgba(0,0,0,.14);
  --btn-shadow-hover: inset 0 1px 1px rgba(255,255,255,.6), inset 0 -1px 1px rgba(0,0,0,.4), 0 0 24px rgba(255,255,255,.2), 0 22px 44px -10px rgba(0,0,0,.46);
  margin-top: 0; padding: 12px 26px 12px 14px; gap: 12px; font-size: 19px; font-weight: 600; overflow: visible;
}
body.page-v3 .v3h-ask .v3-ask::after { width: 34px; height: 34px; background-size: 17px, auto; box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 0 0 1px rgba(255,255,255,.14); background-color: transparent; }
body.page-v3 .v3h-ask .v3-ask::before { z-index: 1; }
body.page-v3 .v3h-ask { position: relative; }
body.page-v3 .v3h-ask .v3-ask { animation: v3-ask-pulse 3.4s var(--v3-ease) 1.4s 3 both; }
@keyframes v3-ask-pulse { 0% { box-shadow: var(--btn-shadow), 0 0 0 0 rgba(60,60,66,.4); } 70%, 100% { box-shadow: var(--btn-shadow), 0 0 0 20px rgba(60,60,66,0); } }
.page-v3 :is(.v3-btn, .v3-ask, .header-cta, .header-call, .menu-toggle, .v3-flyout-cta, .office-row-actions .button, .cta-dock a)::before {
  content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; padding: 1.5px; box-sizing: border-box; pointer-events: none;
  background: conic-gradient(from var(--ang), rgba(255,255,255,0) 0deg, rgba(255,255,255,.95) 45deg, #fff 90deg, rgba(220,222,228,.9) 135deg, rgba(255,255,255,.85) 175deg, rgba(255,255,255,0) 225deg, rgba(255,255,255,0) 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: var(--ri); transition: opacity .45s;
}
.page-v3 :is(.v3-btn, .v3-ask, .header-cta, .header-call, .menu-toggle, .v3-flyout-cta, .office-row-actions .button, .cta-dock a):hover {
  color: var(--btn-text); transform: translateY(-2px); box-shadow: var(--btn-shadow-hover); --ri: 1; --gi: .85;
  background-position: 0 0, -20% 0, 0 0;
}
.page-v3 :is(.v3-btn, .v3-ask, .header-cta, .header-call, .menu-toggle, .v3-flyout-cta, .office-row-actions .button, .cta-dock a):active { transform: scale(1.03, .94); --gs: 260px; --gi: .95; }
.page-v3 :is(.header-cta, .header-call, .menu-toggle)::after { display: none; }
body.page-v3 .v3-btn.v3-btn-lg { min-height: 58px; padding: 0 36px; font-size: 19px; }
.page-v3 .v3-btn-call, .page-v3 .header-call, .page-v3 .menu-toggle, .page-v3 .v3-ask { font-weight: 500; }
.page-v3 .v3-btn-call, .page-v3 .v3-btn-schedule { font-weight: 600; }
/* header-size controls (body-prefixed so they outrank the shared button block) */
body.page-v3 .site-header :is(.header-cta, .header-call, .menu-toggle), body.page-v3 .v3-flyout .v3-flyout-cta { min-height: 32px; padding: 0 14px; font-size: 13px; letter-spacing: -.01em; }
body.page-v3 .site-header .header-cta, body.page-v3 .v3-flyout .v3-flyout-cta { padding: 0 16px; font-weight: 600; }
body.page-v3 .site-header .header-call { margin-left: 6px; font-weight: 500; }
body.page-v3 .site-header .header-cta { margin-left: 8px; }
body.page-v3 .site-header .menu-toggle { display: none; }
.page-v3 .v3h-offices .office-row-actions .button { min-height: 40px; padding: 0 18px; font-size: 15px; font-weight: 500; line-height: 40px; }
body.page-v3 .v3-ask.v3-ask { margin-top: 12px; padding: 10px 18px 10px 12px; min-height: 0; gap: 10px; font-size: 17px; line-height: 1.2; font-weight: 500; }
.page-v3 .v3-ask > * { position: relative; z-index: 2; }
.page-v3 .v3-ask::after { content: ""; order: -1; width: 28px; height: 28px; border-radius: 50%; flex: 0 0 auto; background: var(--v3-icon-chat) center / 15px no-repeat, linear-gradient(180deg, #5a5a62, #2b2b30); box-shadow: inset 0 1px 0 rgba(255,255,255,.3); }
.page-v3 { --v3-icon-chat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 3C6.5 3 2 6.6 2 11c0 2.3 1.2 4.4 3.2 5.9L4.5 21l4.3-2.3c1 .2 2.1.3 3.2.3 5.5 0 10-3.6 10-8s-4.5-8-10-8z'/%3E%3C/svg%3E"); }
body.page-v3 .v3-hero .v3-links .v3-btn { min-width: 190px; }
@media (prefers-reduced-transparency: reduce) {
  .page-v3 :is(.v3-btn, .v3-ask, .header-cta, .header-call, .menu-toggle, .v3-flyout-cta, .office-row-actions .button, .cta-dock a) { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .page-v3 :is(.v3-btn-call, .header-call, .menu-toggle, .v3-ask) { background: #fff; }
}

/* ---------- hero: pearl spotlight + one slow light sweep ---------- */
.page-v3 .v3-hero {
  position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: calc(100svh - var(--v3-nav-h)); padding: 72px 0 96px; box-sizing: border-box; text-align: center; color: var(--v3-ink);
  background: radial-gradient(ellipse 70% 60% at 50% 38%, #ffffff 0%, #eef0f2 42%, #d7d9de 78%, #c3c6cc 100%);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(0,0,0,.18), inset 0 -40px 70px -34px rgba(70,74,84,.35);
}
.page-v3 .v3-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(55% 45% at 50% 42%, rgba(255,255,255,.55), rgba(255,255,255,0) 70%),
    linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 18%, rgba(255,255,255,0) 32%, rgba(255,255,255,.3) 64%, rgba(255,255,255,0) 80%),
    radial-gradient(80% 30% at 50% 100%, rgba(90,94,104,.28), rgba(90,94,104,0) 70%); }
.page-v3 .v3-hero::after { content: ""; position: absolute; top: -60%; left: 0; z-index: -1; width: 60%; height: 220%; pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.18) 30%, rgba(255,255,255,.7) 50%, rgba(255,255,255,.18) 70%, rgba(255,255,255,0));
  filter: blur(18px); mix-blend-mode: soft-light; animation: v3-sweep 14s cubic-bezier(.45,0,.25,1) infinite; }
@keyframes v3-sweep { 0% { transform: translateX(-120%); } 60%, 100% { transform: translateX(260%); } }
.page-v3 .v3-hero > * { position: relative; z-index: 1; }
.page-v3 .v3-hero .v3-eyebrow, .page-v3 .v3-hero .v3-intro { color: var(--v3-ink-metal); }
.page-v3 .v3h-title { max-width: 15ch; margin-left: auto; margin-right: auto; }
/* two-line mission headline (client request): each line on its own row, never wraps; scales down with the viewport so both lines fit */
.page-v3 .v3h-title.v3h-title-2l { max-width: none; font-size: min(var(--v3-fs-super), calc((min(100vw, var(--v3-max)) - 2 * var(--v3-gutter)) / 12.8)); }
.page-v3 .v3h-title-2l .v3h-line { display: block; white-space: nowrap; }
.page-v3 .v3h-mission { max-width: 46ch; margin-top: 22px; }
.page-v3 .v3-hero .v3-links { margin-top: 32px; }
.page-v3 .v3h-ask { margin-top: 18px; }
.page-v3 .v3h-ask .v3-ask { margin-top: 0; }

/* photo frame: solid white, floats, tilts, one periodic sheen; two glass badges ride above it */
.page-v3 .v3-frame {
  position: relative; display: block; width: min(92%, 880px); margin: 56px auto 0; padding: 10px; border-radius: 34px; box-sizing: border-box;
  background: #fff; box-shadow: var(--v3-frame-shadow);
  transform: perspective(1400px) rotateX(var(--v3-rx, 0deg)) rotateY(var(--v3-ry, 0deg)); transform-style: preserve-3d;
  transition: transform .35s var(--v3-lift); animation: v3-float 7s ease-in-out infinite;
}
@keyframes v3-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
.page-v3 .v3-frame img { display: block; width: 100%; height: auto; aspect-ratio: var(--v3-ratio, 16 / 10); object-fit: cover; border-radius: 26px; }
.page-v3 .v3-frame::after { content: ""; position: absolute; inset: 0; border-radius: 34px; pointer-events: none; mix-blend-mode: screen;
  background: linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.55) 48%, rgba(255,255,255,0) 60%); background-size: 250% 100%; background-repeat: no-repeat; background-position: -20% 0;
  animation: v3-shine 18s ease-in-out infinite; }
@keyframes v3-shine { 0% { background-position: 110% 0; } 22%, 100% { background-position: -20% 0; } }
.page-v3 .v3-section .v3-frame { margin-top: 48px; background: #f5f5f7; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06), 0 2px 4px rgba(0,0,0,.06), 0 30px 70px -24px rgba(20,20,30,.38); animation-delay: -3s; }
.page-v3 .v3h-frame-sm { width: min(92%, 600px); }
.page-v3 .v3h-frame-sm img { aspect-ratio: auto; }
.page-v3 .v3-graphite .v3-frame { background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.04)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), inset 0 1px 0 rgba(255,255,255,.32), 0 2px 4px rgba(0,0,0,.06), 0 30px 70px -24px rgba(0,0,0,.6); animation-delay: -5s; }
.page-v3 .v3-badge { position: absolute; z-index: 3; padding: 12px 16px; white-space: nowrap; border-radius: 18px; text-align: left; font-size: 13px; line-height: 1.3; color: var(--v3-ink-metal);
  background: rgba(255,255,255,.62); border: 1px solid rgba(255,255,255,.85); -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%);
  box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 12px 32px rgba(40,44,60,.12), 0 30px 60px -30px rgba(40,44,60,.3), inset 0 1px 0 rgba(255,255,255,.9);
  transform: translateZ(60px); animation: v3-float 6s ease-in-out infinite; }
.page-v3 .v3-badge strong { display: block; font-size: 15px; color: var(--v3-ink); }
.page-v3 .v3-badge-l { left: max(-26px, calc((100% - 100vw) / 2 + 40px)); bottom: 54px; animation-delay: -2s; }
.page-v3 .v3-badge-r { right: max(-22px, calc((100% - 100vw) / 2 + 40px)); top: 36px; animation-delay: -4s; }


/* ---------- office banner: wide, short, cycles through the Mount Kisco photos ---------- */
.page-v3 .v3-banner { width: min(94%, 1120px); }
.page-v3 .v3-banner-stage { position: relative; overflow: hidden; aspect-ratio: 21 / 9; border-radius: 26px; background: #e9eaed; }
.page-v3 .v3-banner .v3-banner-stage img { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity 1.2s var(--v3-ease), transform 7s linear; }
.page-v3 .v3-banner .v3-banner-stage img.is-active { opacity: 1; transform: scale(1); }
.page-v3 .v3-banner-cap { position: absolute; z-index: 3; left: 30px; bottom: 30px; display: grid; gap: 1px; padding: 10px 16px; border-radius: 16px; text-align: left; font-size: 13px; line-height: 1.3; color: var(--v3-ink-metal); background: rgba(255,255,255,.62); border: 1px solid rgba(255,255,255,.85); -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); box-shadow: 0 12px 32px rgba(40,44,60,.12), inset 0 1px 0 rgba(255,255,255,.9); }
.page-v3 .v3-banner-cap strong { font-size: 15px; color: var(--v3-ink); }
.page-v3 .v3-banner-dots { position: absolute; z-index: 3; right: 30px; bottom: 34px; display: flex; gap: 7px; align-items: center; padding: 8px 10px; border-radius: 99px; background: rgba(255,255,255,.55); -webkit-backdrop-filter: blur(14px) saturate(170%); backdrop-filter: blur(14px) saturate(170%); border: 1px solid rgba(255,255,255,.8); }
.page-v3 .v3-banner-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: rgba(0,0,0,.25); cursor: pointer; transition: width .3s var(--v3-ease), background .3s; }
.page-v3 .v3-banner-dot.is-active { width: 22px; background: #1d1d1f; }
.page-v3 .v3-banner .v3-badge-l { top: 36px; bottom: auto; }
@media (max-width: 734px) {
  .page-v3 .v3-banner { width: calc(100% - 32px); }
  .page-v3 .v3-banner-stage { aspect-ratio: 4 / 3; border-radius: 20px; }
  .page-v3 .v3-banner-cap { left: 18px; bottom: 18px; padding: 8px 12px; } .page-v3 .v3-banner-dots { right: 18px; bottom: 22px; }
  .page-v3 .v3-banner .v3-badge-l { top: auto; bottom: 76px; left: 10px; } .page-v3 .v3-banner .v3-badge-r { top: 14px; }
}
@media (prefers-reduced-motion: reduce) { .page-v3 .v3-banner .v3-banner-stage img { transition: opacity .01s; transform: none; } }


/* full-bleed banner: edge to edge under the hero buttons; the two offer cards rise over its lower edge as you scroll */
.page-v3 .v3-hero:has(.v3-banner-full) { padding-bottom: 0; }
.page-v3 .v3-banner.v3-banner-full { width: 100%; max-width: none; margin: 48px 0 0; padding: 0; border-radius: 0; background: none; box-shadow: none; animation: none; transform: none; transition: none; }
.page-v3 .v3-banner-full::after { display: none; }
.page-v3 .v3-banner-full .v3-banner-stage { aspect-ratio: 21 / 8; border-radius: 0; }
.page-v3 .v3-banner-full .v3-banner-stage::after { content: ""; position: absolute; inset: auto 0 0 0; height: 42%; pointer-events: none; background: linear-gradient(180deg, rgba(20,22,28,0), rgba(20,22,28,.28)); }
.page-v3 .v3-banner-full .v3-banner-cap { left: max(30px, calc((100% - 1120px) / 2)); bottom: auto; top: 30px; }
.page-v3 .v3-banner-full .v3-banner-dots { right: max(30px, calc((100% - 1120px) / 2)); bottom: auto; top: 34px; }
.page-v3 .v3-offers.v3-overlap { margin-top: -190px; }
html.v3-js .page-v3 .v3-offers[data-v3-scroll] .v3-card:not(:hover) { opacity: var(--s, 0); transform: translateY(calc((1 - var(--s, 0)) * 90px)); transition: box-shadow .3s; }
@media (max-width: 734px) {
  .page-v3 .v3-banner.v3-banner-full { margin-top: 36px; }
  .page-v3 .v3-banner-full .v3-banner-stage { aspect-ratio: 4 / 3; }
  .page-v3 .v3-banner-full .v3-banner-cap { left: 16px; top: 16px; } .page-v3 .v3-banner-full .v3-banner-dots { right: 16px; top: 20px; }
  .page-v3 .v3-offers.v3-overlap { margin-top: -70px; }
}
@media (prefers-reduced-motion: reduce) { html.v3-js .page-v3 .v3-offers[data-v3-scroll] .v3-card:not(:hover) { opacity: 1; transform: none; } }


/* three offer cards on desktop; the third is where the services carousel lands */
@media (min-width: 1000px) {
  .page-v3 .v3-offers.v3-three { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1180px; }
  .page-v3 .v3-offers.v3-three .v3-card { padding: 32px 28px; }
  .page-v3 .v3-offers.v3-three .v3-h3 { font-size: 24px; }
}
.page-v3 .v3-marquee.is-collapsing .v3-marquee-track { animation-play-state: paused; }
.page-v3 .v3-marquee.is-collapsing .v3-pill { transform: translateX(calc(var(--dx, 0px) * var(--u, 0))) scale(calc(1 - var(--u, 0) * .42)); opacity: calc(1 - var(--u, 0) * 1.05); transition: none; pointer-events: none; }
.v3-allpill { position: fixed; left: 0; top: 0; z-index: 8; display: inline-flex; align-items: center; gap: 12px; padding: 10px 24px 10px 10px; border-radius: 980px; font: 500 18px/1.2 var(--v3-font); letter-spacing: -.012em; color: #1d1d1f; text-decoration: none; white-space: nowrap; opacity: 0; pointer-events: none; will-change: transform, opacity;
  background: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.9); -webkit-backdrop-filter: blur(10px) saturate(190%) brightness(1.04); backdrop-filter: blur(10px) saturate(190%) brightness(1.04);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.07), 0 0 0 .5px rgba(29,29,31,.12), 0 14px 30px -12px rgba(40,44,60,.34); }
.v3-allpill-faces { display: inline-flex; }
.v3-allpill-faces img { width: 38px; height: 38px; margin-left: -12px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff; }
.v3-allpill-faces img:first-child { margin-left: 0; }

/* ---------- solid cards ---------- */
.page-v3 .v3-card { position: relative; overflow: hidden; isolation: isolate; padding: 36px 32px; border-radius: var(--v3-radius); text-align: left; box-sizing: border-box; background: #fff; color: var(--v3-ink); box-shadow: var(--v3-card-shadow); transition: transform .3s var(--v3-lift), box-shadow .3s; }
.page-v3 .v3-card::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0; transition: opacity .4s; background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), rgba(200,204,214,.22), rgba(200,204,214,0) 70%); }
.page-v3 .v3-card:hover { transform: translateY(-6px); box-shadow: var(--v3-card-shadow-hover); }
.page-v3 .v3-card:hover::after { opacity: 1; }
.page-v3 .v3-card .v3-eyebrow { font-size: 14px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.page-v3 .v3-card .v3-h3 { margin-top: 10px; }
.page-v3 .v3-card .v3-links { justify-content: flex-start; margin-top: 18px; }
.page-v3 .v3-card .v3-link { font-size: 17px; }
.page-v3 .v3-card-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 18px; border-radius: 16px; background: #f5f5f7; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
.page-v3 .v3-card-icon svg { width: 26px; height: 26px; }
.page-v3 .v3-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 48px; }
.page-v3 .v3-offers { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: var(--v3-max); margin: 0 auto; padding: 0 var(--v3-gutter); box-sizing: border-box; }
.page-v3 .v3-offers.v3-overlap { margin-top: -72px; }
.page-v3 .v3-offers .v3-card .v3-fine { margin-top: 12px; }

/* ---------- doctors ---------- */
.page-v3 .v3-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 48px; }
.page-v3 .v3-person { position: relative; margin: 0; text-align: left; }
.page-v3 .v3-person-photo { position: relative; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--v3-radius); background: #f5f5f7; box-shadow: 0 1px 1px rgba(0,0,0,.04), 0 14px 40px -16px rgba(30,30,40,.22); }
.page-v3 .v3-person-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--v3-ease); }
.page-v3 .v3-person:hover .v3-person-photo img { transform: scale(1.04); }
.page-v3 .v3-person-soon { display: grid; place-items: center; padding: 8px; text-align: center; color: var(--v3-ink-2); font: 500 17px/1.3 var(--v3-font); background: linear-gradient(160deg, #f5f5f7, #e3e4e8 60%, #d9dade); }
.page-v3 .v3-person-name { margin: 16px 0 0; font: 600 21px/1.2 var(--v3-font); }
.page-v3 .v3-person-name a { color: inherit; text-decoration: none; }
.page-v3 .v3-person-name a::after { content: ""; position: absolute; inset: 0; border-radius: var(--v3-radius); }
.page-v3 .v3-person:hover .v3-person-name a { text-decoration: underline; text-underline-offset: .16em; }
.page-v3 .v3-person-role { margin: 4px 0 0; font-size: 15px; color: var(--v3-ink-2); }
.page-v3 .v3h-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; margin: 64px 0 0; padding: 32px 0 0; list-style: none; border-top: 1px solid rgba(0,0,0,.1); text-align: left; }
.page-v3 .v3h-stats strong { display: block; font: 600 40px/1.05 var(--v3-font); letter-spacing: -.01em; }
.page-v3 .v3h-stats span { display: block; margin-top: 8px; font-size: 14px; line-height: 1.43; color: var(--v3-ink-2); }

/* ---------- service icon row ---------- */
.page-v3 .v3-icons { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 10px; margin: 40px 0 0; padding: 0; list-style: none; }
.page-v3 .v3-icons a { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 96px; font: 500 13px/1.25 var(--v3-font); letter-spacing: -.01em; text-decoration: none; text-align: center; color: inherit; }
.page-v3 .v3-icon-img { position: relative; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #f5f5f7; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06), 0 8px 20px -10px rgba(0,0,0,.35); transition: transform 300ms var(--v3-ease), box-shadow 300ms; }
.page-v3 .v3-icon-img img { width: 100%; height: 100%; object-fit: cover; }
.page-v3 .v3-icon-img svg { width: 28px; height: 28px; opacity: .85; }
.page-v3 .v3-icons a:hover .v3-icon-img, .page-v3 .v3-icons a:focus-visible .v3-icon-img { transform: translateY(-3px) scale(1.06); box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), 0 14px 26px -12px rgba(0,0,0,.45); }

/* ---------- 2-up service tiles ---------- */
.page-v3 .v3h-tile { display: flex; flex-direction: column; }
.page-v3 .v3h-tile .v3-links { margin-top: 18px; }
.page-v3 .v3h-tile-media { margin-top: 28px; overflow: hidden; border-radius: 20px; aspect-ratio: 16 / 9; }
.page-v3 .v3h-tile-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--v3-ease); }
.page-v3 .v3h-tile:hover .v3h-tile-media img { transform: scale(1.04); }
.page-v3 .v3h-tile-mark { margin-top: auto; padding-top: 28px; text-align: center; }

/* ---------- before and after: solid frames around the auto-sweep compare ---------- */
.page-v3 .v3h-ba { margin-top: 48px; text-align: left; }
.page-v3 .v3h-ba .di-ba-pair { padding: 10px; border-radius: var(--v3-radius); background: #fff; box-shadow: var(--v3-card-shadow); }
.page-v3 .v3h-ba .mo-compare, .page-v3 .v3h-ba .di-ba-images { border-radius: 20px; overflow: hidden; }
.page-v3 .v3h-ba .di-ba-label { border-radius: 980px; padding: 3px 11px; background: rgba(29,29,31,.72); font: 600 12px/1.4 var(--v3-font); letter-spacing: .02em; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.page-v3 .v3h-ba figcaption { padding: 12px 10px 4px; font-size: 15px; color: var(--v3-ink-2); }
.page-v3 .v3h-ba .mo-compare-tip { margin: 0; padding: 8px 10px 0; font-size: 13px; color: var(--v3-ink-2); }

/* ---------- referral form (solid) ---------- */
.page-v3 .v3-form { max-width: 760px; margin: 44px auto 0; padding: 28px; border-radius: var(--v3-radius); text-align: left; background: #fff; box-shadow: var(--v3-card-shadow); box-sizing: border-box; }
.page-v3 .v3-form-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.page-v3 .v3-field { display: grid; gap: 6px; font: 500 13px/1.2 var(--v3-font); color: var(--v3-ink-2); }
.page-v3 .v3-input { width: 100%; min-height: 48px; padding: 0 14px; border: 0; border-radius: 14px; box-sizing: border-box; background: rgba(255,255,255,.85); box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); color: var(--v3-ink); font: 400 16px/1.2 var(--v3-font); }
.page-v3 .v3-input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--v3-ink); }
.page-v3 .v3-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 18px; }
.page-v3 .v3-form-note { margin: 0; font-size: 13px; color: var(--v3-ink-2); }
.page-v3 .v3-form-status { margin: 12px 0 0; font-size: 15px; }

/* ---------- reviews ---------- */
.page-v3 .v3h-stories { margin-top: 48px; }
.page-v3 .v3h-quotes, .page-v3 .v3h-videos { display: flex; flex-direction: column; }
.page-v3 .v3h-quotes .mo-rotator { margin: 18px 0 0; min-height: 220px; }
.page-v3 .v3h-quotes .mo-rotator blockquote { color: var(--v3-ink); font: 500 clamp(21px, 2.1vw, 26px)/1.3 var(--v3-font); letter-spacing: .004em; }
.page-v3 .v3h-quotes .mo-rotator figcaption { margin-top: 16px; font-size: 15px; color: var(--v3-ink-2); }
.page-v3 .v3h-quotes .mo-rotator-nav button.mo-dot { width: 8px; height: 8px; border-radius: 980px; background: rgba(0,0,0,.2); transition: width 300ms; }
.page-v3 .v3h-quotes .mo-rotator-nav button.mo-dot.is-active { width: 22px; background: #1d1d1f; }
.page-v3 .v3h-quotes .mo-rotator-nav button.mo-pause { border-color: rgba(0,0,0,.18); border-radius: 980px; color: var(--v3-ink); font-size: 13px; }
.page-v3 .v3h-quotes .mo-rotator-progress { background: rgba(0,0,0,.08); }
.page-v3 .v3h-quotes .mo-rotator-progress i { background: rgba(0,0,0,.35); }
.page-v3 .v3h-quotes .v3-links, .page-v3 .v3h-videos .v3-links { margin-top: auto; padding-top: 24px; }
.page-v3 .v3h-videos .vd-testimonials { width: min(100%, 280px); margin: 22px auto 0; grid-template-columns: 1fr; }
.page-v3 .v3h-videos .vd-testimonials > :not(.vd-testimonial), .page-v3 .v3h-videos .vd-filters { display: none; }
.page-v3 .v3h-videos .vd-play { background: rgba(255,255,255,.85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #1d1d1f; box-shadow: 0 10px 26px -10px rgba(0,0,0,.5); }
.page-v3 .v3h-videos .vd-play svg { fill: #1d1d1f; color: #1d1d1f; }
.page-v3 .v3h-videos .vd-testimonial { border-radius: 20px; overflow: hidden; }
.page-v3 .v3h-videos .vd-testimonial figcaption { padding: 10px 0 0; font-size: 14px; color: var(--v3-ink-2); text-align: center; }

/* ---------- offices: one solid panel ---------- */
.page-v3 .v3h-offices { margin: 48px auto 0; padding: 4px 32px; border: 0; border-radius: var(--v3-radius); text-align: left; background: #fff; box-shadow: var(--v3-card-shadow); }
.page-v3 .v3h-offices .office-row { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(0, 1fr) minmax(0, 1.3fr) auto; gap: 24px; padding: 28px 0; border-top: 1px solid rgba(0,0,0,.08); border-bottom: 0; background: transparent; font-size: 15px; color: var(--v3-ink); }
.page-v3 .v3h-offices .office-row:first-child { border-top: 0; }
.page-v3 .v3h-offices .office-row:hover { background: transparent; }
.page-v3 .v3h-offices .office-row .eyebrow { margin: 0 0 4px; font: 600 13px/1.33 var(--v3-font); letter-spacing: 0; text-transform: none; color: var(--v3-ink-2); }
.page-v3 .v3h-offices .office-row h3 { margin: 0 0 6px; font: 600 21px/1.19 var(--v3-font); }
.page-v3 .v3h-offices .office-row h3 a { color: var(--v3-ink); }
.page-v3 .v3h-offices .office-row p { margin: 0 0 6px; color: var(--v3-ink-2); }
.page-v3 .v3h-offices .office-phone { color: var(--v3-ink); font-size: 17px; text-decoration: none; background-image: none; }
.page-v3 .v3h-offices .office-phone:hover { text-decoration: underline; }
.page-v3 .v3h-offices .hours { margin: 0; gap: 2px; font-size: 14px; }
.page-v3 .v3h-offices .hours div { display: grid; grid-template-columns: minmax(130px, auto) 1fr; gap: 12px; }
.page-v3 .v3h-offices .hours dt { color: var(--v3-ink); font-weight: 500; }
.page-v3 .v3h-offices .hours dd { margin: 0; color: var(--v3-ink-2); }
.page-v3 .v3h-offices .office-note, .page-v3 .v3h-offices .hours-tk { margin-top: 8px; font-size: 14px; color: var(--v3-ink); }
.page-v3 .v3h-offices .office-row-actions { display: grid; gap: 12px; justify-items: start; align-content: start; }
.page-v3 .v3h-offices .office-row-actions .text-link { color: var(--v3-ink); font-weight: 400; font-size: 14px; text-decoration: none; background-image: none; }
.page-v3 .v3h-offices .office-row-actions .text-link:hover { text-decoration: underline; }
html:not(.v3-reddit) .page-v3 [data-reddit] { display: none !important; }
.page-v3 .v3-reddit-row { display: flex; align-items: center; gap: 8px; text-decoration: none; }

/* ---------- reveal ---------- */
html.v3-js .page-v3 [data-v3-reveal] { opacity: 0; transform: translateY(28px); transition: opacity 900ms var(--v3-ease), transform 900ms var(--v3-ease), filter 900ms var(--v3-ease), box-shadow .3s; transition-delay: calc(var(--v3-i, 0) * 90ms); }
html.v3-js .page-v3 [data-v3-reveal="scale"] { transform: scale(.94); }
html.v3-js .page-v3 [data-v3-reveal="blur"] { transform: translateY(16px); filter: blur(10px); }
html.v3-js .page-v3 [data-v3-reveal="fade"] { transform: none; }
html.v3-js .page-v3 [data-v3-reveal].v3-in { opacity: 1; transform: none; filter: none; }
html.v3-js .page-v3 .v3-frame[data-v3-reveal].v3-in { transform: perspective(1400px) rotateX(var(--v3-rx, 0deg)) rotateY(var(--v3-ry, 0deg)); }
html.v3-js .page-v3 [data-v3-reveal].v3-done { transition-delay: 0ms; }
html.v3-js .page-v3 .v3-card[data-v3-reveal].v3-done { transition: transform .3s var(--v3-lift), box-shadow .3s, opacity .3s; }
html.v3-js .page-v3 .v3-frame[data-v3-reveal].v3-done { transition: transform .35s var(--v3-lift); }

/* header CTAs float into the bar after the hero buttons scroll away (home page) */
body.page-v3 .site-header :is(.header-call, .header-cta) { transition: transform .55s var(--v3-gel), opacity .35s var(--v3-ease), visibility 0s, box-shadow .3s, --gs .4s, --gi .4s; }
html:not(.v3-ctas-docked) body.page-v3 .site-header :is(.header-call, .header-cta) { opacity: 0; visibility: hidden; transform: translateY(18px) scale(.9); pointer-events: none; transition: transform .35s var(--v3-ease), opacity .25s var(--v3-ease), visibility 0s linear .35s; }

/* ---------- header: light frosted bar (the glass is on a pseudo layer so the flyout can sit inside) ---------- */
.page-v3 .site-header { position: sticky; top: 0; z-index: 60; isolation: isolate; padding: 0; background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; color: var(--v3-ink); }
.page-v3 .site-header::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: rgba(250,250,252,.72); border-bottom: 1px solid rgba(0,0,0,.06); -webkit-backdrop-filter: saturate(190%) blur(34px); backdrop-filter: saturate(190%) blur(34px); }
html.mo-scrolled .page-v3 .site-header { background: none; box-shadow: none; }
.page-v3 .header-inner { position: static; width: 100%; max-width: 1080px; min-height: var(--v3-nav-h); margin: 0 auto; padding: 0 22px; gap: 4px; box-sizing: border-box; }
.page-v3 .brand { display: inline-flex; align-items: center; gap: 10px; color: var(--v3-brand); font: 600 12px/1 var(--v3-font); letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; }
.page-v3 .brand::before { content: ""; width: 28px; height: 28px; flex: 0 0 auto; background: url("../img/logo/kwon-icon-blue.png") center / contain no-repeat; }
.page-v3 .brand:hover { color: var(--v3-brand); }
.page-v3 .primary-nav { gap: 0; margin: 0 0 0 auto; }
.page-v3 .primary-nav a { display: flex; align-items: center; height: var(--v3-nav-h); padding: 0 10px; color: var(--v3-ink); opacity: .8; font: 400 13px/1 var(--v3-font); letter-spacing: -.01em; text-decoration: none; transition: opacity 240ms; }
.page-v3 .primary-nav a:hover, .page-v3 .primary-nav a[aria-current="page"], .page-v3 .primary-nav a[aria-expanded="true"] { opacity: 1; color: var(--v3-ink); text-decoration: none; }
.page-v3 .primary-nav a.v3-has-flyout::after { content: ""; width: 6px; height: 6px; margin: -3px 0 0 6px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); opacity: .7; transition: transform 240ms var(--v3-ease), margin 240ms; }
.page-v3 .primary-nav a.v3-has-flyout[aria-expanded="true"]::after { transform: rotate(-135deg); margin-top: 3px; }
.page-v3 .di-lang a { color: var(--v3-ink); opacity: .7; font: 400 13px/1 var(--v3-font); padding: 0 6px; text-decoration: none; }
.page-v3 .di-lang a:hover, .page-v3 .di-lang a[aria-current="true"] { opacity: 1; color: var(--v3-ink); }
.page-v3 .skip-link { z-index: 80; }

/* ---------- services flyout: a frosted sheet under the bar ---------- */
.page-v3 .v3-flyout { position: absolute; top: 100%; left: 0; right: 0; z-index: 59; width: min(1080px, calc(100% - 2 * var(--v3-gutter))); margin: 10px auto 0; border-radius: 32px; box-sizing: border-box; color: var(--v3-ink);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,248,250,.93)); border: 1px solid rgba(255,255,255,.9);
  -webkit-backdrop-filter: blur(34px) saturate(190%) brightness(1.04); backdrop-filter: blur(34px) saturate(190%) brightness(1.04);
  box-shadow: inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.05), 0 24px 60px -18px rgba(0,0,0,.24), 0 2px 8px rgba(0,0,0,.06);
  opacity: 0; visibility: hidden; transform: translateY(-8px) scale(.985); transform-origin: 50% 0; transition: opacity 280ms var(--v3-ease), transform 380ms var(--v3-ease), visibility 0s linear 380ms; }
.page-v3 .v3-flyout::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.page-v3 .v3-flyout.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity 280ms var(--v3-ease), transform 380ms var(--v3-ease), visibility 0s; }
.page-v3 .v3-flyout-inner { max-width: 1080px; margin: 0 auto; padding: 24px var(--v3-gutter); box-sizing: border-box; }
.page-v3 .v3-flyout-head { margin: 0 0 4px; font: 600 12px/1 var(--v3-font); letter-spacing: .14em; text-transform: uppercase; color: var(--v3-ink-2); text-align: center; }
.page-v3 .v3-flyout .v3-icons { display: grid; grid-template-columns: repeat(7, 104px); justify-content: center; margin-top: 18px; gap: 20px 6px; }
.page-v3 .v3-flyout .v3-icons a { width: auto; font-size: 12px; }
.page-v3 .v3-flyout .v3-icons li { opacity: 0; transform: translateY(8px); transition: opacity 360ms var(--v3-ease), transform 420ms var(--v3-ease); transition-delay: calc(var(--v3-i, 0) * 22ms); }
.page-v3 .v3-flyout.is-open .v3-icons li { opacity: 1; transform: none; }
.page-v3 .v3-flyout-foot { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 24px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(0,0,0,.07); }
.page-v3 .v3-flyout-foot .v3-link { font-size: 15px; }
.page-v3 .v3-flyout-cta { min-height: 38px; padding: 0 19px; font-size: 14px; }
.page-v3 .v3-scrim { position: fixed; inset: 0; z-index: 55; background: rgba(30,30,32,.06); opacity: 0; visibility: hidden; transition: opacity 300ms var(--v3-ease), visibility 0s linear 300ms; }
.page-v3 .v3-scrim.is-open { opacity: 1; visibility: visible; transition: opacity 300ms var(--v3-ease), visibility 0s; }

/* ---------- menu (below 1080) ---------- */
@media (max-width: 1080px) {
  body.page-v3 .site-header .menu-toggle { display: inline-flex; margin-left: auto; }
  .page-v3 .di-lang { display: none; }
  .page-v3 .primary-nav { top: 100%; left: 0; right: 0; max-height: calc(100svh - var(--v3-nav-h)); overflow-y: auto; padding: 8px 22px 24px; margin: 0; border: 0; border-bottom: 1px solid rgba(0,0,0,.06); background: rgba(250,250,252,.96); box-shadow: 0 24px 40px -24px rgba(0,0,0,.2); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); }
  .page-v3 .primary-nav a { height: auto; padding: 12px 0; border: 0; opacity: 1; font: 600 22px/1.2 var(--v3-font); letter-spacing: .004em; }
  .page-v3 .primary-nav a.v3-has-flyout { justify-content: space-between; }
  .page-v3 .primary-nav a.v3-has-flyout::after { width: 10px; height: 10px; border-width: 0 2px 2px 0; margin-right: 6px; }
  body.page-v3:has(.primary-nav.is-open) #di-chat, body.page-v3:has(.primary-nav.is-open) #di-a11y { display: none; }
  .page-v3 .v3-flyout, .page-v3 .v3-scrim { display: none; }
  body.page-v3 .site-header .header-call { display: none; }
}
.page-v3 .v3-sheet { display: none; margin: 0 0 8px; padding: 18px 14px; border-radius: 22px; background: #fff; box-shadow: var(--v3-card-shadow); }
.page-v3 .v3-sheet.is-open { display: block; animation: v3-sheet-in 360ms var(--v3-ease); }
.page-v3 .v3-sheet .v3-icons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 6px; margin: 0; }
.page-v3 .v3-sheet .v3-icons a { width: auto; font-size: 12px; }
.page-v3 .v3-sheet .v3-icon-img { width: 56px; height: 56px; }
.page-v3 .v3-sheet .v3-flyout-foot { margin-top: 16px; padding-top: 14px; }
.page-v3 .primary-nav .v3-sheet a { padding: 0; font: 500 12px/1.25 var(--v3-font); letter-spacing: -.01em; white-space: normal; }
.page-v3 .primary-nav .v3-sheet .v3-flyout-foot a.v3-link { font-size: 15px; }
.page-v3 .primary-nav .v3-sheet .v3-flyout-cta { padding: 0 18px; font: 600 14px/1 var(--v3-font); }
@keyframes v3-sheet-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- phone dock ---------- */
.page-v3 .cta-dock { background: rgba(250,250,252,.72); -webkit-backdrop-filter: saturate(190%) blur(30px); backdrop-filter: saturate(190%) blur(30px); border-top: 1px solid rgba(0,0,0,.06); box-shadow: none; }
.page-v3 .cta-dock a { min-height: 48px; font-size: 16px; }

/* ---------- footer: graphite ---------- */
.page-v3 .site-footer { position: relative; padding: 56px var(--v3-gutter) 24px; color: rgba(245,245,247,.64); background: linear-gradient(180deg, #2b2b30, #1f1f23); font: 400 13px/1.38 var(--v3-font); letter-spacing: -.01em; }
.page-v3 .site-footer p { margin: 0 0 .8em; font-size: 13px; color: rgba(245,245,247,.64); }
.page-v3 .footer-main { max-width: var(--v3-max); margin: 0 auto; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 28px; padding: 0 0 28px; border-bottom: 1px solid rgba(255,255,255,.18); }
.page-v3 .footer-brand { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; color: #f5f5f7; font: 600 12px/1 var(--v3-font); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; }
.page-v3 .footer-brand::before { content: ""; width: 34px; height: 34px; background: url("../img/logo/kwon-icon-white.png") center / contain no-repeat; }
.page-v3 .footer-head { margin: 0 0 .9em; font: 600 13px/1.3 var(--v3-font); letter-spacing: -.01em; text-transform: none; color: #f5f5f7 !important; }
.page-v3 .footer-links { display: grid; gap: .7em; }
.page-v3 .site-footer a { color: rgba(245,245,247,.64); font-size: 13px; text-decoration: none; }
.page-v3 .site-footer a:hover { color: #f5f5f7; text-decoration: underline; }
.page-v3 .footer-offices { list-style: none; margin: 0; padding: 0; gap: 12px; }
.page-v3 .footer-offices li { color: rgba(245,245,247,.64); font-size: 13px; }
.page-v3 .footer-offices strong { color: #f5f5f7; font-weight: 600; }
.page-v3 .footer-bottom { max-width: var(--v3-max); margin: 0 auto; padding: 18px 0 0; border-top: 0; font-size: 12px; color: rgba(245,245,247,.64); }
.page-v3 .footer-legal a { margin-right: 10px; }
.page-v3 .v3-footer-reddit { margin-top: 10px; }

/* chat starts as the hero "Ask us anything"; after the hero button scrolls away it docks as the bottom-left pill */
.page-v3 #di-chat { transition: opacity 420ms var(--v3-ease), transform 520ms var(--v3-gel), visibility 0s; }
html:not(.v3-chat-docked) .page-v3 #di-chat:not(:has(#di-chat-panel:not([hidden]))) { opacity: 0; visibility: hidden; transform: translateY(28px) scale(.92); pointer-events: none; transition: opacity 300ms var(--v3-ease), transform 380ms var(--v3-ease), visibility 0s linear 380ms; }

/* ---------- services carousel: auto-scrolling glass pills (pauses on hover) ---------- */
.page-v3 .v3-marquee { position: relative; width: 100%; margin-top: 44px; padding: 12px 0 18px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.page-v3 .v3-marquee-track { display: flex; width: max-content; animation: v3-marquee 70s linear infinite; }
.page-v3 .v3-marquee:hover .v3-marquee-track, .page-v3 .v3-marquee:focus-within .v3-marquee-track { animation-play-state: paused; }
@keyframes v3-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.page-v3 .v3-pill { position: relative; display: flex; align-items: center; gap: 14px; margin-right: 16px; padding: 10px 28px 10px 10px; border-radius: var(--v3-pill); font: 500 19px/1.2 var(--v3-font); white-space: nowrap; text-decoration: none; color: var(--v3-ink);
  background: rgba(255,255,255,.5); border: 1px solid rgba(255,255,255,.9); -webkit-backdrop-filter: blur(10px) saturate(190%) brightness(1.04); backdrop-filter: blur(10px) saturate(190%) brightness(1.04);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.07), inset 0 0 8px rgba(255,255,255,.45), 0 0 0 .5px rgba(29,29,31,.12), 0 10px 24px -12px rgba(40,44,60,.3);
  transition: transform .45s var(--v3-gel), box-shadow .3s; }
.page-v3 .v3-pill:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 #fff, 0 0 0 .5px rgba(29,29,31,.12), 0 0 18px rgba(255,255,255,.2), 0 16px 30px -12px rgba(40,44,60,.36); }
.page-v3 .v3-pill-img { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; background: #f5f5f7; box-shadow: 0 0 0 1px rgba(255,255,255,.9); }
.page-v3 .v3-pill-img img { width: 100%; height: 100%; object-fit: cover; }
.page-v3 .v3-pill-img svg { width: 26px; height: 26px; opacity: .85; }
@media (max-width: 734px) { .page-v3 .v3-pill { font-size: 16px; padding-right: 20px; } .page-v3 .v3-pill-img { width: 44px; height: 44px; } .page-v3 .v3-marquee { margin-top: 32px; } }

/* ---------- chat pill (features.js #di-chat): dark titanium glass, prominent, pulses three times then rests ---------- */
.page-v3 .di-widget { font-family: var(--v3-font); }
.page-v3 #di-chat { left: 20px; bottom: 20px; z-index: 9996; gap: 12px; }
.page-v3 #di-chat .di-chat-toggle { --btn-text: #fff; --btn-base: linear-gradient(180deg, rgba(86,86,92,.92), rgba(40,40,44,.94)); --btn-border: rgba(255,255,255,.28); --btn-light: 255,255,255;
  --btn-shadow: inset 0 1px 1px rgba(255,255,255,.5), inset 0 -1px 1px rgba(0,0,0,.4), inset 0 0 8px rgba(255,255,255,.08), 0 12px 34px -8px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.14);
  --btn-shadow-hover: inset 0 1px 1px rgba(255,255,255,.6), inset 0 -1px 1px rgba(0,0,0,.4), 0 0 22px rgba(255,255,255,.18), 0 18px 40px -8px rgba(0,0,0,.45);
  position: relative; overflow: visible; isolation: isolate; display: inline-flex; align-items: center; gap: 10px; min-height: 60px; padding: 0 24px 0 12px !important; box-sizing: border-box; border-radius: var(--v3-pill);
  color: #fff; font: 600 16px/1 var(--v3-font) !important; letter-spacing: -.016em; border: 1px solid var(--btn-border);
  background: radial-gradient(var(--gs) calc(var(--gs) * .7) at var(--mx, 50%) var(--my, 0%), rgba(255,255,255,calc(var(--gi) * .5)), rgba(255,255,255,0) 70%), var(--btn-base);
  box-shadow: var(--btn-shadow); -webkit-backdrop-filter: blur(10px) saturate(190%); backdrop-filter: blur(10px) saturate(190%); transition: transform .45s var(--v3-gel), --gs .4s, --gi .4s; }
.page-v3 #di-chat .di-chat-toggle::before { content: ""; position: static; inset: auto; padding: 0; width: 34px; height: 34px; border-radius: 50%; flex: 0 0 auto; opacity: 1; -webkit-mask: none; mask: none; background: var(--v3-icon-chat) center / 16px no-repeat, linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08)); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 0 0 1px rgba(255,255,255,.14); }
.page-v3 #di-chat .di-chat-toggle::after { content: ""; position: absolute; z-index: -1; inset: -1px; border-radius: inherit; pointer-events: none; box-shadow: 0 0 0 0 rgba(255,255,255,0); animation: v3-pulse 3.4s var(--v3-ease) 1.2s 3 both; }
@keyframes v3-pulse { 0% { box-shadow: 0 0 0 0 rgba(60,60,66,.42); } 70%, 100% { box-shadow: 0 0 0 18px rgba(60,60,66,0); } }
.page-v3 #di-chat .di-chat-toggle:hover { color: #fff; transform: translateY(-2px); box-shadow: var(--btn-shadow-hover); --gi: .85; }
.page-v3 #di-chat .di-chat-toggle[aria-expanded="true"]::after { animation: none; }
.page-v3 .di-chat-panel { width: 380px; border-radius: 26px; color: var(--v3-ink); background: linear-gradient(180deg, rgba(255,255,255,.7) 0%, rgba(255,255,255,0) 30%), rgba(248,248,249,.94); border: 1px solid rgba(255,255,255,.75); -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%); box-shadow: inset 0 1px 0 #fff, 0 30px 80px -20px rgba(20,20,30,.35); }
.page-v3 .di-chat-head { padding: 16px 18px; border-bottom: 1px solid rgba(0,0,0,.06); }
.page-v3 .di-chat-title { font: 600 15px/1.2 var(--v3-font); }
.page-v3 .di-chat-msg { border-radius: 16px; font-size: 14px; }
.page-v3 .di-chat-bot { background: rgba(0,0,0,.05); color: var(--v3-ink); }
.page-v3 .di-chat-user { background: linear-gradient(180deg, #4a4a4d, #2c2c2e); color: #fff; }
.page-v3 .di-chat-pick { border: 0; background: #fff; color: var(--v3-ink); box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); border-radius: var(--v3-pill); }
.page-v3 .di-chat-pick:hover, .page-v3 .di-chat-pick:focus-visible { background: #2c2c2e; color: #fff; }
.page-v3 .di-chat-form { border-top: 1px solid rgba(0,0,0,.06); padding: 12px 14px; }
.page-v3 .di-chat-form input { border: 0; border-radius: var(--v3-pill); padding: 10px 16px; background: rgba(0,0,0,.05); }
.page-v3 .di-chat-form input:focus { outline: 2px solid #2c2c2e; }
.page-v3 .di-chat-form button { border-radius: var(--v3-pill); padding: 8px 18px; background: #2c2c2e; }
.page-v3 .di-chat-form button:hover { background: #1d1d1f; }
.page-v3 .di-chat-links a { color: var(--v3-ink); text-decoration: underline; }
.page-v3 .di-chat-panel .v3-reddit-row { margin: 0 14px 14px; padding: 10px 14px; border-radius: 14px; background: rgba(0,0,0,.04); color: var(--v3-ink); font: 500 14px/1.2 var(--v3-font); }
body.page-v3:has(#di-chat-panel:not([hidden])) #di-a11y { display: none; }
.page-v3 #di-a11y { right: 20px; bottom: 20px; z-index: 9996; }
.page-v3 #di-a11y > button, .page-v3 .di-a11y-panel button { border: 1px solid rgba(255,255,255,.9); border-radius: var(--v3-pill); color: var(--v3-ink); background: rgba(255,255,255,.7); box-shadow: inset 0 1px 1px #fff, 0 8px 24px -10px rgba(0,0,0,.25); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%); font-family: var(--v3-font); }
.page-v3 .di-a11y-panel { border-radius: 20px; background: rgba(248,248,249,.9); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); }
.page-v3 .di-a11y-panel button { border-radius: 12px; box-shadow: none; }
.page-v3 .di-a11y button[aria-pressed="true"] { background: #2c2c2e; color: #fff; }
.page-v3 { --v3-icon-a11y: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='4.5' r='1.8' fill='%231d1d1f' stroke='none'/%3E%3Cpath d='M5 8.5l7 1.5 7-1.5M12 10v4.5M12 14.5l-3.5 6M12 14.5l3.5 6'/%3E%3C/svg%3E"); }

/* ---------- responsive ---------- */
@media (max-width: 1068px) { .page-v3 .v3h-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-v3 .v3h-offices .office-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .page-v3 .v3h-offices .office-row-hours, .page-v3 .v3h-offices .office-row-actions { grid-column: 1 / -1; } .page-v3 .v3h-offices .office-row-actions { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; } }
@media (max-width: 860px) {
  .page-v3 .site-header .header-cta { display: none; }
  .page-v3 .cta-dock { transition: transform 420ms var(--v3-ease); }
  html.v3-hero-visible .page-v3 .cta-dock { transform: translateY(110%); }
  body.page-v3 { padding-bottom: 0 !important; }
  .page-v3 .site-footer { padding-bottom: calc(76px + 72px + env(safe-area-inset-bottom)); }
  .page-v3 #di-a11y { bottom: 84px !important; right: 16px; }
  .page-v3 #di-chat { left: 16px; bottom: 84px !important; }
}
@media (max-width: 734px) {
  .page-v3 .v3-grid-2, .page-v3 .v3-offers { grid-template-columns: minmax(0, 1fr); }
  .page-v3 .v3-offers.v3-overlap { margin-top: -48px; }
  .page-v3 .v3-hero { min-height: 0; padding: 48px 0 72px; }
  .page-v3 .v3-frame { width: calc(100% - 32px); margin-top: 40px; padding: 8px; border-radius: 26px; }
  .page-v3 .v3-frame img { border-radius: 20px; }
  .page-v3 .v3-frame::after { border-radius: 26px; }
  .page-v3 .v3-badge { padding: 9px 12px; font-size: 12px; border-radius: 14px; transform: none; }
  .page-v3 .v3-badge strong { font-size: 13px; }
  .page-v3 .v3-badge-l { left: 10px; bottom: 14px; } .page-v3 .v3-badge-r { right: 10px; top: 14px; }
  .page-v3 .v3-card { padding: 28px 22px; }
  .page-v3 .v3-people { gap: 10px; }
  .page-v3 .v3-person-name { font-size: 15px; } .page-v3 .v3-person-role { font-size: 12px; }
  .page-v3 .v3-person-soon { font-size: 12px; }
  .page-v3 .v3-form { padding: 20px; } .page-v3 .v3-form-row { grid-template-columns: minmax(0, 1fr); }
  .page-v3 .v3-icons a { width: 84px; font-size: 12px; } .page-v3 .v3-icon-img { width: 56px; height: 56px; }
  body.page-v3 .v3-btn { min-height: 46px; padding: 0 22px; font-size: 16px; } body.page-v3 .v3-btn.v3-btn-lg { min-height: 52px; padding: 0 28px; font-size: 17px; }
  body.page-v3 .v3-hero .v3-links .v3-btn { min-width: 0; }
  .page-v3 .v3-links { gap: 12px 16px; }
  .page-v3 .header-inner { padding: 0 14px; gap: 2px; min-width: 0; }
  .page-v3 .brand { min-width: 0; gap: 8px; font-size: 11px; letter-spacing: .1em; } .page-v3 .brand::before { width: 26px; height: 26px; }
  .page-v3 .di-lang a { padding: 0 4px; font-size: 12px; }
  .page-v3 .v3h-stats { gap: 22px 18px; margin-top: 44px; } .page-v3 .v3h-stats strong { font-size: 30px; } .page-v3 .v3h-stats span { font-size: 13px; }
  .page-v3 .v3h-offices { padding: 0 20px; } .page-v3 .v3h-offices .office-row { grid-template-columns: minmax(0, 1fr); gap: 14px; } .page-v3 .v3h-offices .hours div { grid-template-columns: minmax(0, 1fr) auto; }
  .page-v3 .footer-main { grid-template-columns: minmax(0, 1fr); }
  .page-v3 #di-a11y > button { width: 44px; height: 44px; min-height: 44px; padding: 0 !important; font-size: 0 !important; display: grid; place-items: center; }
  .page-v3 #di-a11y > button::before { content: ""; width: 22px; height: 22px; background: var(--v3-icon-a11y) center / contain no-repeat; }
  .page-v3 #di-chat .di-chat-toggle { min-height: 52px; padding: 0 18px 0 8px !important; font-size: 15px !important; }
  .page-v3 #di-chat .di-chat-toggle::before { width: 30px; height: 30px; }
  .page-v3 .di-chat-panel { width: calc(100vw - 32px); }
}
@media (max-width: 390px) { .page-v3 .brand { gap: 7px; font-size: 10.5px; letter-spacing: .08em; } .page-v3 .v3-super { font-size: 40px; } .page-v3 .v3-headline { font-size: 32px; } .page-v3 .v3-wrap { padding: 0 16px; } }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-v3 *, .page-v3 *::before, .page-v3 *::after { animation: none !important; }
  html.v3-js .page-v3 [data-v3-reveal] { opacity: 1; transform: none; filter: none; transition: none; }
  .page-v3 .v3-frame { transform: none; transition: none; }
}

/* =====================================================================
   SCROLL-DRIVEN MOTION (html.v3-sda: Chrome/Edge 115+, Safari 26+). Runs on the compositor, locked to the scroll position.
   JS only supplies the measured start/end points as custom properties. Other browsers keep the JS-eased path.
   ===================================================================== */
/* logo: from the hero into the header's top-left (y is linear so it stays glued to the page; scale eases) */
html.v3-sda .v3-fly { transform: none; translate: var(--fx0, 0px) var(--fy0, 0px);
  animation: v3-fly-pos linear both, v3-fly-scale linear both; animation-timeline: scroll(root), scroll(root); animation-range: 0px var(--fD, 1px), 0px var(--fD, 1px); }
@keyframes v3-fly-pos { from { translate: var(--fx0) var(--fy0); } to { translate: var(--fx1) var(--fy1); } }
@keyframes v3-fly-scale { from { scale: 1; animation-timing-function: cubic-bezier(.45,0,.25,1); } to { scale: var(--fs1); } }
/* locations: start in the top-left of the bar, slide out of the logo's way, reappear top-right (wide screens) */
html.v3-sda .v3-navloc { transform: none; animation: v3-loc linear both; animation-timeline: scroll(root); animation-range: 0px var(--fD, 1px); }
html.v3-sda .v3-navloc.is-narrow { animation-name: v3-loc-out; }
@keyframes v3-loc { 0% { translate: var(--lx0) var(--ly); opacity: 1; } 42% { translate: calc(var(--lx0) + 80px) var(--ly); opacity: 0; } 58% { translate: calc(var(--lx1) + 60px) var(--ly); opacity: 0; } 100% { translate: var(--lx1) var(--ly); opacity: 1; } }
@keyframes v3-loc-out { 0% { translate: var(--lx0) var(--ly); opacity: 1; } 42%, 100% { translate: calc(var(--lx0) + 80px) var(--ly); opacity: 0; } }
/* offer cards rise as they enter the viewport (separate `translate`, so hover lift still works) */
html.v3-sda.v3-js .page-v3 .v3-offers[data-v3-scroll] .v3-card { --s: 1; animation: v3-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
html.v3-sda.v3-js .page-v3 .v3-offers[data-v3-scroll] .v3-card:nth-child(2) { animation-range: entry 4% entry 62%; }
@keyframes v3-rise { from { opacity: 0; translate: 0 60px; } to { opacity: 1; translate: 0 0; } }
/* services carousel closes toward its centre, the single pill travels to the third card, the card takes over */
html.v3-sda .page-v3 .v3-marquee.v3-sda-collapse { animation: v3-mq-close linear both; animation-timeline: scroll(root); animation-range: var(--c0, 0px) var(--c1, 1px); }
@keyframes v3-mq-close { from { clip-path: inset(0 0 0 0 round 999px); opacity: 1; scale: 1; } 70% { opacity: 1; } to { clip-path: inset(0 47% 0 47% round 999px); opacity: 0; scale: .92; } }
html.v3-sda .v3-allpill.is-sda { position: absolute; transform: none; opacity: 0; animation: v3-allpill linear both; animation-timeline: scroll(root); animation-range: var(--p0, 0px) var(--p1, 1px); }
@keyframes v3-allpill { 0% { translate: var(--ax) var(--ay); opacity: 0; scale: .9; } 14% { translate: var(--ax) var(--ay); opacity: 1; scale: 1; } 82% { opacity: 1; } 100% { translate: var(--bx) var(--by); opacity: 0; scale: .92; } }
html.v3-sda.v3-js .page-v3:has(.v3-marquee.v3-sda-collapse) .v3-offers[data-v3-scroll] .v3-card[data-v3-all] { animation: v3-rise linear both; animation-timeline: scroll(root); animation-range: var(--h0, 0px) var(--h1, 1px); }

/* =====================================================================
   SHORTER HOME (10-06): one implant section, offices as three cards, a compact referral band
   ===================================================================== */
/* implants: two items side by side on the graphite band */
.page-v3 .v3h-imp { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 48px; text-align: left; }
.page-v3 .v3h-imp-item { color: #f5f5f7; }
.page-v3 .v3h-imp-media { overflow: hidden; aspect-ratio: 16 / 10; padding: 8px; border-radius: 30px; box-sizing: border-box; background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.04)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), inset 0 1px 0 rgba(255,255,255,.3), 0 30px 60px -28px rgba(0,0,0,.6); }
.page-v3 .v3h-imp-media img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 22px; transition: transform 900ms var(--v3-ease); }
.page-v3 .v3h-imp-item:hover .v3h-imp-media img { transform: scale(1.03); }
.page-v3 .v3h-imp-item .v3-h3 { margin-top: 22px; color: #f5f5f7; }
.page-v3 .v3h-imp-item .v3-body { color: rgba(245,245,247,.68); }
.page-v3 .v3h-imp-item .v3-links { justify-content: flex-start; margin-top: 14px; }
.page-v3 .v3h-imp-item .v3-link { font-size: 17px; }

/* offices: three cards side by side */
.page-v3 .v3h-offices.office-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 44px auto 0; padding: 0; background: none; box-shadow: none; border-radius: 0; }
.page-v3 .v3h-offices .office-row { display: flex; flex-direction: column; gap: 14px; padding: 30px 28px; border: 0; border-radius: var(--v3-radius); background: #fff; box-shadow: var(--v3-card-shadow); transition: transform .3s var(--v3-lift), box-shadow .3s; }
.page-v3 .v3h-offices .office-row:first-child { border-top: 0; }
.page-v3 .v3h-offices .office-row:hover { transform: translateY(-4px); box-shadow: var(--v3-card-shadow-hover); background: #fff; }
.page-v3 .v3h-offices .office-row .hours { font-size: 13px; }
.page-v3 .v3h-offices .hours div { grid-template-columns: minmax(96px, auto) 1fr; gap: 10px; }
.page-v3 .v3h-offices .office-row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: auto; padding-top: 6px; }
.page-v3 #offices .v3-section-foot { margin-top: 26px; }

/* referral: one line and a button */
.page-v3 .v3-band { padding-top: 56px; padding-bottom: 56px; }
.page-v3 .v3h-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 32px; text-align: left; }
.page-v3 .v3h-band .v3-eyebrow { font-size: 14px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.page-v3 .v3h-band .v3-h3 { margin-top: 6px; }
.page-v3 .v3h-band .v3-links { margin-top: 0; }

@media (max-width: 1068px) {
  .page-v3 .v3h-offices.office-list { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
}
@media (max-width: 734px) {
  .page-v3 .v3h-imp { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .page-v3 .v3h-band { justify-content: center; text-align: center; }
  .page-v3 .v3h-band .v3-links { justify-content: center; }
}

/* Reddit pill: rides beside the docked "Ask a question" pill, appears and hides with it */
.v3-reddit-pill { position: fixed; z-index: 9996; left: 220px; top: calc(100vh - 50px); translate: 0 -50%; display: inline-flex; align-items: center; gap: 10px; min-height: 60px; padding: 0 22px 0 12px; border-radius: 980px; box-sizing: border-box;
  font: 600 16px/1 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: -.016em; color: #1d1d1f; text-decoration: none; white-space: nowrap; cursor: pointer;
  background: rgba(255,255,255,.72); border: 1px solid rgba(255,255,255,.95); -webkit-backdrop-filter: blur(14px) saturate(190%); backdrop-filter: blur(14px) saturate(190%);
  box-shadow: inset 0 1px 1px #fff, inset 0 -1px 1px rgba(0,0,0,.06), 0 0 0 .5px rgba(29,29,31,.12), 0 12px 30px -10px rgba(40,44,60,.32);
  transition: opacity .42s cubic-bezier(.22,.61,.36,1), transform .52s cubic-bezier(.34,1.56,.64,1), visibility 0s; }
.v3-reddit-pill:hover { transform: translateY(-2px); color: #1d1d1f; }
.v3-reddit-ico { display: grid; width: 36px; height: 36px; flex: 0 0 auto; }
.v3-reddit-ico svg { width: 36px; height: 36px; }
.v3-reddit-soon { margin-left: 2px; padding: 4px 9px; border-radius: 99px; background: rgba(0,0,0,.06); color: #6e6e73; font-size: 12px; font-weight: 600; }
.v3-reddit-pill.is-soon { cursor: pointer; }
html:not(.v3-chat-docked) .v3-reddit-pill { opacity: 0; visibility: hidden; transform: translateY(28px) scale(.92); pointer-events: none; transition: opacity .3s, transform .38s, visibility 0s linear .38s; }
body:has(.primary-nav.is-open) .v3-reddit-pill { display: none; }
@media (max-width: 734px) {
  .v3-reddit-pill { min-height: 52px; padding: 0 8px; gap: 0; }
  .v3-reddit-txt, .v3-reddit-soon { display: none; }
  .v3-reddit-ico, .v3-reddit-ico svg { width: 34px; height: 34px; }
}

.v3-reddit-txt { display: grid; gap: 2px; text-align: left; }
.v3-reddit-main { font: inherit; }
.v3-reddit-sub { font-size: 11px; font-weight: 500; letter-spacing: .01em; line-height: 1; color: #6e6e73; }
.v3-reddit-sub[hidden] { display: none; }

/* =====================================================================
   SITE-WIDE FIXES (10-06 review). New rules only; nothing above is changed. Apply to the home page and every inner page.
   ===================================================================== */
/* office picker: a rounded solid dialog; actions are the Schedule gradient with white labels
   (".page-v3 a { color: inherit }" was beating features.css and left black text on black) */
.page-v3 .di-office-dialog { border: 0; border-radius: 22px; background: #fff; color: var(--v3-ink); font-family: var(--v3-font); box-shadow: var(--v3-frame-shadow); }
.page-v3 .di-office-dialog::backdrop { background: rgba(29,29,31,.34); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.page-v3 .di-office-head { padding: 20px 18px 16px 28px; border-bottom: 1px solid rgba(0,0,0,.08); }
.page-v3 .di-office-title { font: 600 24px/1.15 var(--v3-font); letter-spacing: .004em; color: var(--v3-ink); }
.page-v3 .di-office-close { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,.06); color: var(--v3-ink); font: 400 22px/1 var(--v3-font); }
.page-v3 .di-office-close:hover { border: 0; background: rgba(0,0,0,.1); color: var(--v3-ink); }
.page-v3 .di-office-row { padding: 18px 28px; border-bottom: 1px solid rgba(0,0,0,.06); }
.page-v3 .di-office-name { font: 600 19px/1.2 var(--v3-font); color: var(--v3-ink); }
.page-v3 .di-office-addr { font-size: 15px; color: var(--v3-ink-2); }
.page-v3 .di-office-action, .page-v3 .di-office-action:hover, .page-v3 .di-office-action:focus-visible {
  color: #fff; border: 0; border-radius: 980px; text-decoration: none; text-shadow: 0 1px 1px rgba(20,30,120,.25);
  background: linear-gradient(100deg, #a3adf6 0%, #6f7ef2 34%, #4c5ee8 70%, #3a4bdc 100%);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.75), inset 0 -1px 1px rgba(20,30,120,.35), 0 0 0 .5px rgba(40,50,160,.35), 0 10px 24px -10px rgba(58,75,220,.6); }
.page-v3 .di-office-action { min-height: 44px; padding: 0 22px; font: 600 15px/1 var(--v3-font); letter-spacing: -.01em; transition: filter .2s, transform .3s var(--v3-gel); }
.page-v3 .di-office-action:hover, .page-v3 .di-office-action:focus-visible { filter: brightness(1.05); transform: translateY(-1px); }
.page-v3 .di-office-dialog :focus-visible { outline: 2px solid var(--v3-ink); outline-offset: 3px; }
@media (max-width: 520px) { .page-v3 .di-office-row { padding: 16px 20px; } .page-v3 .di-office-head { padding-left: 20px; } }

/* video player: rounded white box, graphite title, round glass close */
.page-v3 .vd-dialog { background: transparent; color: var(--v3-ink); }
.page-v3 .vd-dialog::backdrop { background: rgba(20,20,24,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.page-v3 .vd-dialog-box { border-radius: 22px; overflow: hidden; background: #fff; box-shadow: var(--v3-frame-shadow); }
.page-v3 .vd-dialog-title { background: #fff; color: #1d1d1f; font: 600 17px/1.3 var(--v3-font); letter-spacing: -.01em; }
.page-v3 .vd-close { top: 8px; right: 10px; width: 40px; height: 40px; border-radius: 50%; color: #1d1d1f; border: 1px solid rgba(255,255,255,.9); background: rgba(255,255,255,.72);
  box-shadow: inset 0 1px 1px #fff, 0 0 0 .5px rgba(29,29,31,.14), 0 6px 16px -8px rgba(40,44,60,.35); -webkit-backdrop-filter: blur(10px) saturate(180%); backdrop-filter: blur(10px) saturate(180%); }
.page-v3 .vd-close:hover { color: #1d1d1f; background: #fff; }
.page-v3 .vd-close svg { width: 18px; height: 18px; }

/* phone and tablet menu: the Call / Schedule dock steps aside while the menu is open, and the menu carries the language switch */
.page-v3 .primary-nav .v3-menu-lang { display: none; }
@media (max-width: 1080px) {
  body.page-v3:has(.primary-nav.is-open) .cta-dock { display: none; }
  .page-v3 .primary-nav .v3-menu-lang { display: flex; gap: 22px; margin-top: 8px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.06); }
  .page-v3 .primary-nav .v3-menu-lang a { height: auto; padding: 10px 0; font: 500 17px/1.2 var(--v3-font); opacity: .6; }
  .page-v3 .primary-nav .v3-menu-lang a[aria-current="true"] { opacity: 1; }
}

/* the Reddit pill does nothing until the account exists: off on phones and tablets, an icon with a tooltip on desktop */
@media (max-width: 1080px) { .v3-reddit-pill.is-soon { display: none; } }

/* footer fine print at the 13px floor */
.page-v3 .footer-bottom { font-size: 13px; }
/* before/after labels and the phone doctor captions at the 13px floor */
.page-v3 .v3h-ba .di-ba-label { font-size: 13px; line-height: 1.3; }
@media (max-width: 734px) { .page-v3 .v3-person-role, .page-v3 .v3-person-soon { font-size: 13px; } }

/* =====================================================================
   LAUNCH FIXES (10-07). New rules only; the home hero, its photo layer, the logo flight, the typing line,
   the carousel collapse and the offer cards are untouched.
   ===================================================================== */
/* phone and tablet menu: the flying hero logo and the locations line step aside while the menu is open, so they
   never paint over (or catch taps meant for) the menu links; the header shows the real logo instead */
html:has(#primary-nav.is-open) .v3-fly, html:has(#primary-nav.is-open) .v3-navloc { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
.page-v3 #primary-nav.is-open { z-index: 5; }
html.v3-fly-on body.page-v3:has(#primary-nav.is-open) .site-header .brand { opacity: 1; }
/* the open menu locks the page behind it and dims it; a tap on the dimmed page closes the menu (site.js) */
html.v3-menu-open { overflow: hidden; }
@media (max-width: 1080px) {
  body.page-v3::after { content: ""; position: fixed; inset: 0; z-index: 58; background: rgba(29,29,31,.28); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 300ms var(--v3-ease), visibility 0s linear 300ms; }
  html.v3-menu-open body.page-v3::after { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 300ms var(--v3-ease), visibility 0s; }
}

/* floating controls: "Ask a question" hides under its own open panel; on phones and tablets (where the Call / Schedule dock shows)
   both floating buttons are 44px icons at the same height (each keeps its accessible name) */
.page-v3 #di-chat:has(#di-chat-panel:not([hidden])) .di-chat-toggle { display: none; }
.page-v3 #di-a11y > button { color: #1d1d1f; background: rgba(255,255,255,.8); border: 1px solid rgba(255,255,255,.95); box-shadow: inset 0 1px 1px #fff, 0 0 0 .5px rgba(29,29,31,.14), 0 8px 24px -10px rgba(40,44,60,.3); }
@media (max-width: 860px) {
  .page-v3 #di-a11y > button { width: 44px; height: 44px; min-height: 44px; padding: 0 !important; font-size: 0 !important; display: grid; place-items: center; }
  .page-v3 #di-a11y > button::before { content: ""; width: 22px; height: 22px; background: var(--v3-icon-a11y) center / contain no-repeat; }
  .page-v3 #di-chat .di-chat-toggle { width: 44px; height: 44px; min-height: 44px; padding: 0 !important; gap: 0; justify-content: center; font-size: 0 !important; letter-spacing: 0; }
  .page-v3 #di-chat .di-chat-toggle::before { width: 44px; height: 44px; background-size: 18px, auto; box-shadow: none; }
  .page-v3 #di-chat .di-chat-toggle::after { animation: none; }
}
/* desktop below 1440: the pill keeps its label but sits lower and tighter, clear of the reading column */
@media (min-width: 861px) and (max-width: 1439px) {
  .page-v3 #di-chat .di-chat-toggle { min-height: 48px; padding: 0 18px 0 8px !important; font-size: 15px !important; }
  .page-v3 #di-chat .di-chat-toggle::before { width: 32px; height: 32px; }
}
@media (min-width: 861px) { .page-v3 #di-chat { left: 16px; bottom: 16px; } .page-v3 #di-a11y { right: 16px; bottom: 16px; } }

/* tap targets: carousel and banner dots keep their 8px look with a 24px hit area; office phones and links are 44px tall */
.page-v3 :is(.v3-banner-dot, .mo-rotator-nav button.mo-dot, .mo-slideshow-dots button) { position: relative; }
.page-v3 :is(.v3-banner-dot, .mo-rotator-nav button.mo-dot, .mo-slideshow-dots button)::before { content: ""; position: absolute; inset: -8px; }
.page-v3 .office-row :is(.office-phone, .text-link), .page-v3 .v3p-map figcaption .text-link { display: inline-flex; align-items: center; min-height: 44px; }

/* active chips and the payment calculator: logo blue, like the nav and the accents */
body.v3-inner :is(.vd-filter[aria-pressed="true"], .v3p-filter button[aria-pressed="true"], .di-calc-opt:has(input:checked)) { background: #2552b0; border-color: #2552b0; color: #fff; box-shadow: 0 6px 16px -8px rgba(37,82,176,.55); }

/* office hours: one fixed day column so all three offices line up; a little air before the Stamford note */
@media (min-width: 735px) { .page-v3 .office-row .hours div { grid-template-columns: 8.5em minmax(0, 1fr); } }
.page-v3 .office-row .office-note { margin-top: 10px; }

/* home: Dr. Kwon and Dr. Park, two across */
.page-v3 .v3-people.v3-people-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; margin-left: auto; margin-right: auto; }
/* team page: Dr. Oh as a text card until his photo arrives (no placeholder art) */
body.page-v3 .v3x-crew > li.v3x-crew-text { justify-content: center; padding: 34px 18px; }
body.page-v3 .v3x-crew > li.v3x-crew-text h3 { margin-top: 0; }

/* a hero with a photo: the jump links line up with the text */
@media (min-width: 861px) { body.v3-inner .page-hero:has(> figure) .service-index { justify-content: flex-start; } }
/* a framed photo under a sticky section heading (insurance) */
body.v3-inner .v3p-side-photo { max-width: 360px; margin: 28px 0 0; padding: 8px; border-radius: 26px; background: #fff; box-shadow: var(--v3-card-shadow); }
body.v3-inner .v3p-side-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 19px; }
@media (max-width: 860px) { body.v3-inner .v3p-side-photo { margin: 24px auto 0; } }

/* services: one real photo above each group's cards */
body.v3-inner .v3s-group-photo { max-width: 560px; margin: 0 auto clamp(32px, 4vw, 48px); padding: 8px; border-radius: 28px; background: #fff; box-shadow: var(--v3-card-shadow); box-sizing: border-box; }
body.v3-inner .v3s-group-photo img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 21px; }
body.v3-inner .v3s-group-photo.is-xray { max-width: 520px; }
body.v3-inner .v3s-group-photo.is-xray img { aspect-ratio: 550 / 283; background: #000; }
/* the Same day card: its content sits centered in the tall card instead of leaving an empty lower half */
body.v3-inner .v3s-card-feature { display: flex; flex-direction: column; justify-content: center; }

/* Spanish pages: a short row of patient videos */
body.v3-inner .v3p-videos { max-width: 760px; margin: clamp(40px, 5vw, 64px) auto; text-align: center; }
body.v3-inner .v3p-videos h3 { margin: 0 0 20px; font: 600 clamp(22px, 2.4vw, 28px)/1.2 var(--v3-font); color: var(--v3-ink); }
body.v3-inner .v3p-videos .vd-testimonials:has(> figure:only-child) { grid-template-columns: minmax(0, 300px); justify-content: center; }
body.v3-tpl-services .v3s-card.v3s-card-feature > p:not(.v3s-card-links) { flex: 0 0 auto; }
.page-v3 .office-row .office-row-hours .office-note { margin-top: 10px; }
@media (min-width: 621px) { body.v3-inner .v3p-videos .vd-testimonials { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
