/* Home page (desktop strip). Layout system: every panel is drawn once at its true 1440 x 900 px on the original's
   grid (24 columns of 60, rows of 31) and the whole canvas is scaled with `zoom` by one factor --uz. Height sets
   the factor; screens narrower than 1280 canvas px fall back to width. Panels are 1440 x --uz wide whatever the
   screen, so wider screens show more of one continuous strip. The canvas sits on the panel's bottom edge; spare
   height opens above it, never under the floor band. Because the canvas is real pixels, the original's component
   styles below (rating, team bar, pillars) are used exactly as written.
   Review page: 01-fab-squad/clients/dentaplus/home-rebuild-layout-system.html (JARVIS). */
:root {
  /* tan(atan2(a, b)) = a / b as a plain number. */
  --uz: min(tan(atan2(100vh, 900px)), tan(atan2(100vw, 1280px)));
  --dpx-floor: #1f1f1f;
  --dpx-display: 'Outfit', sans-serif;
}

/* ---------- the original's global system (code/global-css/dp-system.css): tokens, modals, pills ---------- */
:root{--dp-bg:#1a1a1a;--dp-surface:#242424;--dp-accent:#a3cb4d;--dp-accent-hover:#b5d96a;--dp-text:#fff;--dp-text-muted:rgba(255,255,255,.5);--dp-text-dim:rgba(255,255,255,.3);--dp-border:rgba(255,255,255,.08);--dp-text-secondary:rgba(255,255,255,.55);--dp-text-body:rgba(255,255,255,.78);--dp-text-list:rgba(255,255,255,.6);--dp-green-subtle:rgba(163,203,77,.06);--dp-green-border:rgba(163,203,77,.12);--dp-green-line:rgba(163,203,77,.3);--dp-light-bg:#f2f2f2;--dp-light-surface:#f4f4f4;--dp-white:#fff;--dp-text-on-light:#1a1a1a;--dp-text-on-light-muted:rgba(0,0,0,.6);--dp-text-on-light-dim:rgba(0,0,0,.35);--dp-border-on-light:rgba(0,0,0,.08);--dp-accent-d1:#7da632;--dp-accent-d2:#7ab52d;--dp-accent-d3:#6a9e27;--dp-kids-roz:#fc4f60;--dp-kids-mov:#7569de;--dp-kids-galben:#ffa046;--dp-kids-verde:#9ecb45;--dp-kids-albastru:#4b86f8;--dp-kids-portocaliu:#fe6845;--dp-radius-sm:12px;--dp-radius-md:20px;--dp-radius-lg:24px;--dp-radius-xl:32px;--dp-radius-hero:50px;--dp-radius-pill:999px;--ease-out:cubic-bezier(.25,.46,.45,.94);--ease-spring:cubic-bezier(.34,1.56,.64,1);--ease-modal:cubic-bezier(.22,1,.36,1);--ease-menu:cubic-bezier(.65,0,.35,1);--ease-snap:cubic-bezier(.68,-.55,.27,1.55);--dp-z-sticky:100;--dp-z-menu:500;--dp-z-modal:999}[class^="dp-"],[class^="dp-"] *,[class^="dp-"] *::before,[class^="dp-"] *::after{font-family:inherit}[class^="dp-"] button,[class^="dp-"] input,[class^="dp-"] select,[class^="dp-"] textarea{font:inherit;color:inherit;letter-spacing:inherit}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}.dp-modal-overlay{position:fixed;inset:0;z-index:var(--dp-z-modal);background:rgba(0,0,0,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:24px 80px;opacity:0;visibility:hidden;transition:opacity .35s var(--ease-modal),visibility .35s var(--ease-modal)}.dp-modal-overlay.is-open{opacity:1;visibility:visible}.dp-modal-wrap{position:relative;width:100%;max-width:560px;display:flex;align-items:center;justify-content:center}.dp-modal{position:relative;width:100%;max-height:85vh;overflow-y:auto;padding:48px 44px 40px;border-radius:var(--dp-radius-lg);transform:translatey(24px) scale(.97);opacity:0;transition:transform .5s var(--ease-modal),opacity .5s var(--ease-modal);box-sizing:border-box}.dp-modal-overlay.is-open .dp-modal{transform:translatey(0) scale(1);opacity:1}.dp-modal::-webkit-scrollbar{width:6px}.dp-modal::-webkit-scrollbar-track{background:transparent}.dp-modal::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:3px}.dp-modal--dark::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15)}.dp-modal--dark{background:rgba(26,26,26,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--dp-border);color:var(--dp-text)}.dp-modal--soft{background:var(--dp-white);border:none;padding:56px 48px;border-radius:var(--dp-radius-hero);box-shadow:0 25px 60px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.15);color:var(--dp-text-on-light)}.dp-modal__close{position:absolute;top:20px;right:20px;width:36px;height:36px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .3s var(--ease-modal),border-color .3s var(--ease-modal);background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.08);padding:0}.dp-modal--dark .dp-modal__close{background:rgba(255,255,255,.06);border-color:var(--dp-border)}.dp-modal__close svg{width:14px;height:14px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke:rgba(0,0,0,.45);transition:stroke .3s var(--ease-modal)}.dp-modal--dark .dp-modal__close svg{stroke:rgba(255,255,255,.6)}.dp-modal__nav{position:absolute;top:50%;transform:translatey(-50%);width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);transition:background .3s var(--ease-modal),border-color .3s var(--ease-modal);padding:0}.dp-modal__nav svg{width:16px;height:16px;stroke:rgba(255,255,255,.85);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s var(--ease-modal)}.dp-modal__nav--prev{left:-64px}.dp-modal__nav--next{right:-64px}.dp-modal__number{font-size:12px;font-weight:500;color:var(--dp-accent-d1);letter-spacing:.1em;margin-bottom:12px}.dp-modal--dark .dp-modal__number{color:var(--dp-accent)}.dp-modal__title{font-size:22px;font-weight:600;line-height:1.25;letter-spacing:.02em;margin:0 0 6px;padding-right:40px}.dp-modal__subtitle{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;margin:0 0 20px;color:var(--dp-accent-d1)}.dp-modal--dark .dp-modal__subtitle{color:var(--dp-accent)}.dp-modal__divider{width:40px;height:1px;background:var(--dp-green-line);margin:0 0 24px}.dp-modal__desc{font-size:15px;font-weight:400;line-height:1.7;color:var(--dp-text-on-light-muted);margin:0 0 28px}.dp-modal--dark .dp-modal__desc{color:var(--dp-text-body)}.dp-modal__heading{font-size:15px;font-weight:600;margin:0 0 14px}.dp-modal__list{list-style:none;padding:0;margin:0 0 32px;display:flex;flex-direction:column;gap:10px}.dp-modal__list:last-child{margin-bottom:0}.dp-modal__list li{position:relative;padding-left:20px;font-size:14px;line-height:1.6;color:rgba(0,0,0,.6)}.dp-modal--dark .dp-modal__list li{color:var(--dp-text-list);font-size:13px}.dp-modal__list li::before{content:'';position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--dp-accent);opacity:.5}.dp-modal__note{font-size:14px;font-style:italic;color:var(--dp-text-on-light-dim);margin:0}.dp-modal--dark .dp-modal__note{color:var(--dp-text-dim)}.dp-modal__cta{display:inline-flex;align-items:center;gap:10px;background:var(--dp-accent);color:var(--dp-bg);font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:14px 28px;border:none;border-radius:var(--dp-radius-pill);cursor:pointer;transition:transform .3s var(--ease-modal),box-shadow .3s var(--ease-modal)}.dp-modal__cta svg{width:14px;height:14px;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.dp-modal__dots{display:flex;justify-content:center;gap:10px;margin-top:28px}.dp-modal__dot{width:6px;height:6px;border-radius:50%;background:rgba(0,0,0,.12);border:none;padding:0;cursor:pointer;transition:background .3s,transform .3s var(--ease-spring)}.dp-modal--dark .dp-modal__dot{background:rgba(255,255,255,.15)}.dp-modal__dot.is-active{background:var(--dp-accent-d1);transform:scale(1.3)}.dp-modal--dark .dp-modal__dot.is-active{background:var(--dp-accent)}@media (hover:hover){.dp-modal__close:hover{background:rgba(163,203,77,.12);border-color:rgba(163,203,77,.3)}.dp-modal__close:hover svg{stroke:var(--dp-accent-d1)}.dp-modal--dark .dp-modal__close:hover svg{stroke:var(--dp-accent)}.dp-modal__nav:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.35)}.dp-modal__nav:hover svg{stroke:#fff}.dp-modal__cta:hover{transform:translatey(-1px);box-shadow:0 8px 28px rgba(163,203,77,.25)}}.dp-modal__close:focus-visible,.dp-modal__nav:focus-visible,.dp-modal__dot:focus-visible,.dp-modal__cta:focus-visible{outline:2px solid var(--dp-accent);outline-offset:3px}@media (max-width:768px){.dp-modal-overlay{padding:24px 16px}.dp-modal{padding:36px 28px 32px;max-width:100%;border-radius:var(--dp-radius-xl)}.dp-modal--soft{padding:40px 28px;border-radius:var(--dp-radius-xl)}.dp-modal__title{font-size:18px;padding-right:36px}.dp-modal__desc{font-size:14px}.dp-modal__list li{font-size:13px}.dp-modal__nav{top:auto;bottom:-60px;transform:none;width:40px;height:40px}.dp-modal__nav--prev{left:12px}.dp-modal__nav--next{right:12px}.dp-modal__dots{margin-top:24px}}.dp-eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--dp-accent);margin:0 0 10px}.dp-treatment-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:rgba(0,0,0,.03);border-radius:var(--dp-radius-sm);font-size:14px;color:var(--dp-text-on-light-muted)}.dp-treatment-pill strong{color:var(--dp-text-on-light);font-weight:600}.dp-cta-pill{display:inline-flex;align-items:center;gap:10px;background:var(--dp-accent);color:var(--dp-bg);font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:14px 28px;border:none;border-radius:var(--dp-radius-pill);cursor:pointer;transition:transform .3s var(--ease-modal),box-shadow .3s var(--ease-modal)}.dp-cta-pill svg{width:14px;height:14px;flex-shrink:0;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}@media (hover:hover){.dp-cta-pill:hover{transform:translatey(-1px);box-shadow:0 8px 28px rgba(163,203,77,.25)}}.dp-cta-pill:focus-visible{outline:2px solid var(--dp-accent);outline-offset:3px}.dp-hover-invert{transition:background .3s var(--ease-modal),color .3s var(--ease-modal)}@media (hover:hover){.dp-hover-invert:hover{background:var(--dp-bg);color:var(--dp-white)}.dp-hover-invert:hover *{color:inherit}}body.dp-modal-open{overflow:hidden}.dp-loader{position:fixed;inset:0;z-index:2147483640;background:#fafafa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:24px;animation:dpLoaderExit .6s var(--ease-modal,cubic-bezier(.22,1,.36,1)) forwards 1.2s;will-change:transform}.dp-loader__logo{max-width:320px;max-height:96px;width:auto;height:auto;object-fit:contain;opacity:0;transform:translatey(8px);animation:dpLoaderFadeIn .7s var(--ease-modal,ease) forwards .15s}.dp-loader__text{font-family:'DM Sans',sans-serif;font-size:16px;font-weight:400;letter-spacing:.02em;color:var(--dp-text-on-light-muted,rgba(0,0,0,.55));text-align:center;max-width:560px;line-height:1.6;margin:0;opacity:0;transform:translatey(8px);animation:dpLoaderFadeIn .7s var(--ease-modal,ease) forwards .32s}.dp-loader__accent{width:32px;height:1px;background:var(--dp-accent,#a3cb4d);opacity:0;animation:dpLoaderFadeIn .7s var(--ease-modal,ease) forwards .24s}@keyframes dpLoaderFadeIn{to{opacity:1;transform:translatey(0)}}@keyframes dpLoaderExit{to{transform:translatey(-100%);pointer-events:none}}.dp-loader--transition{animation:dpLoaderEnter .4s var(--ease-modal,cubic-bezier(.22,1,.36,1)) forwards}@keyframes dpLoaderEnter{from{transform:translatey(100%)}to{transform:translatey(0)}}.dp-from-transition .dp-loader__logo,.dp-from-transition .dp-loader__text,.dp-from-transition .dp-loader__accent{animation:none;opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.dp-loader{animation-delay:.25s;animation-duration:.3s}.dp-loader__logo,.dp-loader__text,.dp-loader__accent{animation-delay:0s;animation-duration:.2s}}@media (max-width:640px){.dp-loader{gap:22px}.dp-loader__logo{max-width:220px;max-height:70px}.dp-loader__text{font-size:14px}}.dp-modal-overlay.is-entering-right,.dp-modal-overlay.is-entering-left{transition:none !important}.dp-modal-overlay.is-entering-right .dp-modal{animation:dpSlideInRight .45s var(--ease-modal) both}.dp-modal-overlay.is-entering-left .dp-modal{animation:dpSlideInLeft .45s var(--ease-modal) both}@keyframes dpSlideInRight{from{transform:translatex(80px);opacity:0}to{transform:translatex(0);opacity:1}}@keyframes dpSlideInLeft{from{transform:translatex(-80px);opacity:0}to{transform:translatex(0);opacity:1}}.dp-modal-overlay.is-navigating-out,.dp-modal-overlay.is-navigating-out .dp-modal{transition:none !important;animation:none !important}

/* ---------- system ---------- */
.dpx { display: flex; margin: 0; padding: 0; }
/* Not horizontal (touch tablets, narrow windows): the panels stack, each scaled to the screen width. */
body:not(.dp-desktop-horizontal) .dpx { flex-direction: column; }
/* The ID beats the migrated rebuild-overrides rule that sets stacked sections to height: auto. */
body[data-horizontal-page]:not(.dp-desktop-horizontal) #siteWrapper section.page-section.dpx-p, body:not(.dp-desktop-horizontal) .dpx-p { --uz: tan(atan2(100vw, 1440px)); width: 100vw !important; height: calc(900px * var(--uz)) !important; min-height: 0 !important; overflow: hidden; }
.dpx-p { position: relative; flex: none; width: calc(1440px * var(--uz)); height: 100vh; overflow: hidden; background: var(--dpx-bg, #fff); color: #1a1a1a; font-family: var(--dpx-display); }
.dp-astro-horizontal .dp-horizontal-track > section.dpx-p { flex: 0 0 calc(1440px * var(--uz)) !important; width: calc(1440px * var(--uz)) !important; overflow: hidden; }
/* Panel-wide background (photo or video): fills the spare height above the canvas too. */
.dpx-bgm { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* The 1440 x 900 drawing, pinned to the bottom of the panel and scaled as one piece. */
.dpx-c { position: absolute; left: 0; bottom: 0; width: 1440px; height: 900px; zoom: var(--uz); }
/* Anything placed on the canvas: style="--x:120;--y:249;--w:480;--h:279" in canvas pixels. */
.dpx-b { position: absolute; left: calc(var(--x, 0) * 1px); top: calc(var(--y, 0) * 1px); width: calc(var(--w, 0) * 1px); height: calc(var(--h, 0) * 1px); margin: 0; }
/* Shared floor band, rows 22-26. */
.dpx-floor { position: absolute; left: 0; width: 1440px; top: 682px; height: 155px; background: var(--dpx-floor); }
.dpx-fill { background: var(--dpx-floor); }
/* Bars that end mid-screen: half-circle endcap from their own height. */
.dpx-cap-l { border-radius: calc(var(--h) * .5px) 0 0 calc(var(--h) * .5px); }
.dpx-cap-r { border-radius: 0 calc(var(--h) * .5px) calc(var(--h) * .5px) 0; }
.dpx-img { object-fit: cover; object-position: 50% 50%; display: block; }
/* Cutouts fit inside their block, as the original's fluid images do, standing on its bottom edge. */
.dpx-cut { object-fit: contain; object-position: 50% 100%; display: block; }

/* Type scale of the original (px at 1440 x 900). */
.dpx-t96 { font-size: 96px; line-height: 1; }
.dpx-t80 { font-size: 80px; line-height: 1.12; }
.dpx-t64 { font-size: 64px; line-height: 1.246; }
.dpx-t60 { font-size: 60px; line-height: 1.246; }
.dpx-t44 { font-size: 44px; line-height: 1.302; }
.dpx-t32 { font-size: 32px; line-height: 1.344; }
.dpx-t19 { font-size: 19.2px; line-height: 1.8; }
.dpx-t16 { font-size: 16px; line-height: 1.8; }
.dpx-t12 { font-size: 11.68px; line-height: 1.8; }
.dpx-w2 { font-weight: 200; } .dpx-w4 { font-weight: 400; } .dpx-w7 { font-weight: 700; }
.dpx-green { color: var(--dp-accent); }
.dpx-white { color: #fff; }
/* Zero specificity, so the type classes above always win. */
:where(.dpx-b h1, .dpx-b h2, .dpx-b h3, .dpx-b h4, .dpx-b p, h1.dpx-b, h2.dpx-b, p.dpx-b) { margin: 0; font: inherit; }
/* The migrated site CSS colours headings at some widths; text on the canvas takes its colour from the canvas. */
.dpx-c :is(h1, h2, h3, h4, p) { color: inherit; letter-spacing: normal; text-transform: none; }
.dpx-c .dpx-white { color: #fff; }
.dpx-c .dpx-green { color: var(--dp-accent); }

/* ---------- panel 00 hero ---------- */
.dpx-hero .dpx-bgm { filter: grayscale(1); }
.dpx-hero__title h1 { font-size: 80px; line-height: 1.12; font-weight: 700; }
.dpx-hero__title h2 { font-size: 60px; line-height: 1.246; font-weight: 200; }
.dpx-hero__stats { text-align: center; }
.dpx-hero__stats i { font-style: normal; color: var(--dp-accent); }
.dpx-hero__bar { display: flex; align-items: center; justify-content: center; text-align: center; }

/* ---------- panel 01 founder ---------- */
.dpx-founder__floor { display: flex; flex-direction: column; }

/* ---------- panel 02 team: the tall floor steps down to the pillars' thin band with a rounded corner ---------- */
.dpx-team__step { border-top-right-radius: 31px; }
/* A doctor grows slightly from the floor when hovered (pixel hit-test in home-page.ts); the order stays. */
.dpx-team__doc { transform-origin: 50% 100%; transition: transform .45s var(--ease-modal); pointer-events: none; }
.dpx-team__doc.is-hover { transform: scale(1.03); }

/* ---------- original components (homepage code blocks) ---------- */
  .dp-rating {
    display: inline-flex;
    align-items: center;
    background: transparent;
    padding: 5px 0;
    text-decoration: none;
    transition: opacity 0.2s var(--ease-out);
  }

  .dp-rating__g-logo {
    margin-right: 10px;
    display: block;
  }

  .dp-rating__stars {
    color: var(--dp-text);
    font-size: 1.125rem;
    letter-spacing: 1px;
    margin-right: 8px;
    padding-bottom: 2px;
    line-height: 1;
  }

  .dp-rating__value {
    font-size: 1rem;
    font-weight: 600;
    color: var(--dp-text);
    line-height: 1;
  }

  @media (hover: hover) {
    .dp-rating:hover { opacity: 0.8; }
  }

  @media (max-width: 768px) {
    .dp-rating {
      display: flex;
      justify-content: center;
      width: 100%;
    }
  }

  .dp-team-bar {
    box-sizing: border-box;
    width: 100%;
    max-height: 75px;
    height: 75px;
    display: flex;
    align-items: center;
    background: rgba(26,26,26,0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius-lg);
    overflow: hidden;
  }
  .dp-team-bar *, .dp-team-bar *::before, .dp-team-bar *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  .dp-team-bar__grid {
    display: flex;
    width: 100%;
    height: 75px;
    align-items: stretch;
  }

  .dp-team-bar__col {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 16px;
    border-right: 1px solid var(--dp-border);
    position: relative;
  }

  .dp-team-bar__name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--dp-text);
    letter-spacing: 0.04em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .dp-team-bar__title {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--dp-accent);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.2;
    margin-top: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .dp-team-bar__subtitle {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--dp-text-muted);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.2;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* +ECHIPA solid CTA column */
  .dp-team-bar__cta {
    flex: 0 0 auto;
    min-width: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 75px;
    padding: 0 28px;
    background: var(--dp-accent);
    text-decoration: none;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--dp-white);
    position: relative;
    overflow: hidden;
    transition: background 0.35s var(--ease-out);
  }

  .dp-team-bar__cta svg {
    transition: transform 0.35s var(--ease-spring);
  }

  @media (hover: hover) {
    .dp-team-bar__cta:hover { background: var(--dp-accent-hover); }
    .dp-team-bar__cta:hover svg { transform: translateX(4px); }
  }

  /* Mobile: stack to 2 rows */
  @media (max-width: 767px) {
    .dp-team-bar {
      max-height: none;
      height: auto;
    }
    .dp-team-bar__grid {
      flex-wrap: wrap;
      height: auto;
    }
    .dp-team-bar__col {
      flex: 1 1 50%;
      min-height: 60px;
      padding: 0.5rem 0.75rem;
      border-bottom: 1px solid var(--dp-border);
    }
    .dp-team-bar__col:nth-child(2n)   { border-right: none; }
    .dp-team-bar__col:nth-child(odd)  { border-right: 1px solid var(--dp-border); }
    .dp-team-bar__name { font-size: 0.875rem; }
    .dp-team-bar__title,
    .dp-team-bar__subtitle { font-size: 0.625rem; }
    .dp-team-bar__cta {
      flex: 1 1 100%;
      min-width: 100%;
      height: 52px;
      font-size: 0.875rem;
    }
  }

  .dp-why {
    width: 100%;
  }
  .dp-why *,
  .dp-why *::before,
  .dp-why *::after { box-sizing: border-box; }

  .dp-why__bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(255,255,255,0.06);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: var(--dp-radius-lg);
    overflow: visible;                    /* v2: allow bubble to escape vertically */
    position: relative;
  }

  .dp-why__item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 16px;
    cursor: pointer;
    position: relative;
    transition: background 0.3s var(--ease-out);
    text-align: center;
    min-height: 80px;
    background: transparent;
    border: none;
    color: inherit;
  }

  .dp-why__item + .dp-why__item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 40%;
    background: rgba(255,255,255,0.10);
    transition: background 0.3s var(--ease-out);
  }

  .dp-why__label {
    font-size: 1rem;
    font-weight: 600;
    color: var(--dp-text);
    letter-spacing: 0.03em;
    line-height: 1.3;
    transition: color 0.3s var(--ease-out);
    position: relative;
    z-index: 1;
  }

  /* ────────── v2 Bubble (desktop only) ────────── */
  .dp-why__bubble {
    position: absolute;
    bottom: calc(100% + 18px);
    left: 50%;
    width: 320px;
    max-width: calc(100vw - 32px);
    transform: translateX(-50%) translateY(8px);
    background: var(--dp-white);
    color: var(--dp-text-on-light);
    text-align: left;
    border-radius: var(--dp-radius-lg);
    padding: 24px 28px 22px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.14);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transition:
      opacity 0.3s var(--ease-modal),
      transform 0.3s var(--ease-modal),
      visibility 0.3s var(--ease-modal);
  }
  /* Arrow / tail */
  .dp-why__bubble::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: var(--dp-white);
    transform: translate(-50%, -50%) rotate(45deg);
    border-radius: 2px;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.04);
  }

  .dp-why__bubble-number {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--dp-accent-d1);
    letter-spacing: 0.10em;
    margin-bottom: 8px;
  }
  .dp-why__bubble-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--dp-text-on-light);
    line-height: 1.25;
    letter-spacing: 0.02em;
    margin: 0 0 4px;
  }
  .dp-why__bubble-subtitle {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--dp-accent-d1);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .dp-why__bubble-divider {
    width: 32px;
    height: 1px;
    background: rgba(163,203,77,0.4);
    margin-bottom: 14px;
  }
  .dp-why__bubble-desc {
    font-size: 0.875rem;
    font-weight: 400;
    color: rgba(0,0,0,0.60);
    line-height: 1.6;
    margin: 0;
  }

  /* Edge-alignment so bubbles don't overflow the viewport */
  .dp-why__item:first-child .dp-why__bubble {
    left: 12px;
    transform: translateX(0) translateY(8px);
  }
  .dp-why__item:first-child .dp-why__bubble::after {
    left: calc(50% - (50% - 40px));
  }
  .dp-why__item:last-child .dp-why__bubble {
    left: auto;
    right: 12px;
    transform: translateX(0) translateY(8px);
  }
  .dp-why__item:last-child .dp-why__bubble::after {
    left: auto;
    right: 40px;
  }

  /* ────────── Desktop behavior ────────── */
  @media (hover: hover) {
    .dp-why__item:hover { background: var(--dp-green-subtle); }
    .dp-why__item:hover .dp-why__label { color: var(--dp-accent); }
    .dp-why__item:hover + .dp-why__item::before,
    .dp-why__item:hover::before { background: transparent; }

    .dp-why__item:hover .dp-why__bubble,
    .dp-why__item:focus-visible .dp-why__bubble {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
      pointer-events: auto;
    }
    .dp-why__item:first-child:hover .dp-why__bubble,
    .dp-why__item:first-child:focus-visible .dp-why__bubble {
      transform: translateX(0) translateY(0);
    }
    .dp-why__item:last-child:hover .dp-why__bubble,
    .dp-why__item:last-child:focus-visible .dp-why__bubble {
      transform: translateX(0) translateY(0);
    }

    /* Hide the mobile-fallback modals on desktop entirely */
    .dp-modal-overlay[data-dp-modal-group="why"] { display: none !important; }
  }

  /* ────────── Mobile behavior ────────── */
  @media (hover: none) {
    .dp-why__bubble { display: none; }
  }

  /* ────────── Mobile layout (collapsed bar → stacked rows) ────────── */
  @media (max-width: 768px) {
    .dp-why__bar { grid-template-columns: 1fr; border-radius: var(--dp-radius-md); overflow: hidden; }
    .dp-why__item {
      justify-content: flex-start;
      padding: 18px 22px;
      min-height: auto;
      text-align: left;
    }
    .dp-why__item + .dp-why__item::before {
      left: 22px; right: 22px;
      top: 0; bottom: auto;
      width: auto; height: 1px;
      transform: none;
      background: rgba(255,255,255,0.06);
    }
    .dp-why__label { font-size: 1rem; }
    .dp-why__item::after {
      content: '';
      margin-left: auto;
      width: 7px; height: 7px;
      border-right: 1.5px solid rgba(255,255,255,0.25);
      border-bottom: 1.5px solid rgba(255,255,255,0.25);
      transform: rotate(-45deg);
      flex-shrink: 0;
    }
  }


/* ---------- panels 04-07 ---------- */
/* Shapes of the original: fill, per-corner radius, stacking; a few are nudged 2-4 px so the dark slab shows
   through as a hairline next to the service cards. */
.dpx-shape { pointer-events: none; }
.dpx-dark { background: var(--dpx-floor); }
.dpx-light { background: #fff; }
.dpx-photo { object-fit: cover; display: block; border-radius: 50px; }
.dpx-card { padding: 0 24px; box-sizing: border-box; }
.dpx-card h4 { font-size: 32px; line-height: 1.344; font-weight: 700; }
.dpx-card .lg { font-size: 19.2px; line-height: 1.8; margin-top: 22px; }
.dpx-card p:not(.lg) { font-size: 16px; line-height: 1.8; margin-top: 14px; }
/* Radiologie | CT: a white shape covers the x-ray and fades out on hover (250 ms, as on the original). */
.dpx-xray-cover { transition: opacity 250ms ease; pointer-events: auto !important; }
.dpx-xray-cover:hover { opacity: 0; }
/* Ortodonție: the white "tooth" card tilts toward the pointer (the original's vanilla-tilt, max 10deg). */
.dpx-tilt { transition: transform 300ms cubic-bezier(.03, .98, .52, .99); will-change: transform; }
.dpx-xray { object-fit: cover; object-position: 33.39% 81.62%; border-radius: 999px 999px 0 200px; display: block; }
.dpx-kids-photo { object-fit: contain; filter: brightness(1.01) contrast(1.12) grayscale(1); }
.dpx-note { background: #fff; border-radius: 8px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 3%; box-sizing: border-box; font-size: 32px; line-height: 1.344; font-weight: 200; color: #1f1f1f; }
.dpx-step-n { display: flex; align-items: flex-start; justify-content: center; color: #fff; font-size: 44px; font-weight: 700; line-height: 1.302; }
.dpx-step h3 { font-size: 44px; line-height: 1.302; font-weight: 700; color: #1a1a1a; }
.dpx-step h3 { margin: 32px 0 0; }
.dpx-step p { font-size: 16px; line-height: 1.8; margin-top: 12px; }

/* ---------- original components (homepage code blocks): services bar, Kids link ---------- */
  .dp-srv {
    width: 100%;
    padding: 0 20px;
  }
  .dp-srv *,
  .dp-srv *::before,
  .dp-srv *::after { box-sizing: border-box; }

  .dp-srv__bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    max-width: 1200px;
    margin: 0 auto;
  }

  .dp-srv__item {
    background: transparent;
    border: none;
    padding: 6px 28px;
    cursor: pointer;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 1;
    color: inherit;
  }

  .dp-srv__item-title {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--dp-text);
    transition: color 0.35s var(--ease-out);
    line-height: 1.3;
  }

  .dp-srv__item-subtitle {
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--dp-text-secondary);
    line-height: 1.4;
    transition: color 0.35s var(--ease-out);
  }

  .dp-srv__dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    flex-shrink: 0;
  }

  /* Desktop: hide primary bar items; show only secondary */
  .dp-srv__item[data-primary="true"] { display: none; }

  @media (hover: hover) {
    .dp-srv__item:hover .dp-srv__item-title { color: var(--dp-accent); }
    .dp-srv__item:hover .dp-srv__item-subtitle { color: var(--dp-text-body); }
  }

  @media (max-width: 768px) {
    .dp-srv { padding: 0; }
    .dp-srv__bar {
      flex-direction: column;
      gap: 0;
      align-items: stretch;
    }
    .dp-srv__dot { display: none; }
    .dp-srv__item[data-primary="true"] { display: flex; }
    .dp-srv__item {
      padding: 0.75rem 0;
      flex-direction: row;
      justify-content: space-between;
      text-align: left;
      gap: 0;
      border-bottom: 1px solid rgba(255,255,255,0.04);
    }
    .dp-srv__item:last-child { border-bottom: none; }
    .dp-srv__item-text { display: flex; flex-direction: column; gap: 2px; }
    .dp-srv__item-arrow svg {
      width: 12px;
      height: 12px;
      stroke: rgba(255,255,255,0.2);
      stroke-width: 2;
      fill: none;
      transition: stroke 0.3s var(--ease-out);
    }
    @media (hover: hover) {
      .dp-srv__item:hover .dp-srv__item-arrow svg { stroke: var(--dp-accent); }
    }
  }
  @media (min-width: 769px) {
    .dp-srv__item-arrow { display: none; }
    .dp-srv__item-text { display: contents; }
  }

  .dp-kids-link {
    line-height: 1;
  }
  .dp-kids-link *,
  .dp-kids-link *::before,
  .dp-kids-link *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  .dp-kids-link h2 {
    font-size: clamp(3rem, 12vw, 6rem);
    line-height: inherit;
  }

  /* Whole wordmark is the link. Anchor spans both lines. */
  .dp-kids-link .dp-kids-link__anchor,
  .dp-kids-link .dp-kids-link__anchor:visited {
    display: block;
    text-decoration: none;
    cursor: pointer;
    color: inherit;
  }
  .dp-kids-link .dp-kids-link__anchor:hover,
  .dp-kids-link .dp-kids-link__anchor:focus {
    text-decoration: none;
    color: inherit;
  }

  .dp-kids-link__line {
    display: block;
  }
  .dp-kids-link__line--bottom {
    display: flex;
    align-items: center;
  }

  /* DENTA / PLUS stay black even while the anchor is hovered. */
  .dp-kids-link__bold {
    font-weight: 700;
    color: var(--dp-bg, #1a1a1a);
  }
  .dp-kids-link__regular {
    font-weight: 300;
    color: var(--dp-bg, #1a1a1a);
    margin-right: 0.25em;
  }
  .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__bold,
  .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__regular,
  .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__bold,
  .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__regular {
    color: var(--dp-bg, #1a1a1a) !important;
  }

  /* KIDS letters + arrow — resting state is primary lime */
  .dp-kids-link__char {
    display: inline-block;
    font-weight: 700;
    color: var(--dp-accent, #A3CB4D);
    transition: color 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .dp-kids-link__arrow {
    display: inline-block;
    font-weight: 700;
    font-size: 0.55em;
    color: var(--dp-accent, #A3CB4D);
    margin-left: 0.2em;
    vertical-align: middle;
    transition:
      color 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
      transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  }

  /* Stagger the color transitions.
     Within .dp-kids-link__line--bottom the children are ordered:
       1) PLUS (regular)
       2) K   (char)   3) I   (char)   4) D   (char)   5) S   (char)   6) ► (arrow)
     So nth-child targets 2..5 for the chars. */
  .dp-kids-link__line--bottom .dp-kids-link__char:nth-child(2) { transition-delay: 0s; }
  .dp-kids-link__line--bottom .dp-kids-link__char:nth-child(3) { transition-delay: 0.04s; }
  .dp-kids-link__line--bottom .dp-kids-link__char:nth-child(4) { transition-delay: 0.08s; }
  .dp-kids-link__line--bottom .dp-kids-link__char:nth-child(5) { transition-delay: 0.12s; }
  .dp-kids-link__arrow                                         { transition-delay: 0.16s; }

  /* Hover: trigger from the WHOLE anchor, not just KIDS.
     Selectors are over-specified to outrank Squarespace theme rules. */
  @media (hover: hover) {
    .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__char:nth-child(2),
    .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__char:nth-child(2) { color: var(--kids-roz,    #FC4F60) !important; }
    .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__char:nth-child(3),
    .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__char:nth-child(3) { color: var(--kids-mov,    #7569DE) !important; }
    .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__char:nth-child(4),
    .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__char:nth-child(4) { color: var(--kids-galben, #FFA046) !important; }
    .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__char:nth-child(5),
    .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__char:nth-child(5) { color: var(--kids-verde,  #9ECB45) !important; }
    .dp-kids-link .dp-kids-link__anchor:hover .dp-kids-link__arrow,
    .dp-kids-link .dp-kids-link__anchor:focus .dp-kids-link__arrow {
      color: var(--kids-roz, #FC4F60) !important;
      transform: translateX(4px);
    }
  }

  @media (max-width: 768px) {
    .dp-kids-link__bold,
    .dp-kids-link__regular {
      color: var(--dp-text, #ffffff) !important;
    }
  }


/* ---------- panels 08-10 ---------- */
.dpx-quote h4 { font-size: 32px; line-height: 1.344; font-weight: 200; color: #fff; }
.dpx-quote h4 b { font-weight: 700; }
.dpx-quote p { font-size: 11.68px; line-height: 1.8; color: #fff; margin-top: 30px; }
.dpx-c .dpx-cat { font-size: 11.68px; line-height: 1.8; font-weight: 700; color: var(--dp-accent); }
.dpx-r24 { border-radius: 24px; }
/* Testimonial photos fade to the patient's "before" photo on hover (503 ms, as on the original). */
.dpx-reveal { transition: opacity 503ms ease; }
.dpx-reveal:hover { opacity: 0; }

/* ---------- original component: technology list with pop-overs ---------- */
  .dp-tech-bar {
    font-family: 'DM Sans', sans-serif;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px 0;
    position: relative;
    padding: 20px 0;
  }
  .dp-tech-bar *,
  .dp-tech-bar *::before,
  .dp-tech-bar *::after { box-sizing: border-box; font-family: inherit; }

  .dp-tech-bar__item {
    position: relative;
    cursor: pointer;
    padding: 10px 16px;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    gap: 10px;
    color: inherit;
    transition: opacity 0.3s var(--ease-out, ease);
  }

  /* Dim siblings when one item is click-pinned */
  .dp-tech-bar.is-has-active .dp-tech-bar__item:not(.is-active) { opacity: 0.3; }

  /* Brand-accent dot — single color (this is the homepage; per-item color belongs to /kids) */
  .dp-tech-bar__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--dp-accent, #A3CB4D);
    opacity: 0.4;
    transition: opacity 0.3s var(--ease-out, ease), transform 0.3s var(--ease-out, ease);
  }
  .dp-tech-bar__item.is-active .dp-tech-bar__dot,
  .dp-tech-bar__item:hover .dp-tech-bar__dot {
    opacity: 1;
    transform: scale(1.2);
  }

  .dp-tech-bar__name {
    font-size: 0.9rem;
    font-weight: 600;
    color: inherit;
    margin: 0;
    white-space: nowrap;
    letter-spacing: -0.01em;
    transition: color 0.3s var(--ease-out, ease);
  }
  .dp-tech-bar__item.is-active .dp-tech-bar__name { color: var(--dp-accent, #A3CB4D); }
  @media (hover: hover) {
    .dp-tech-bar__item:hover .dp-tech-bar__name { color: var(--dp-accent, #A3CB4D); }
  }

  /* Popover — opens UPWARD (arrow points DOWN). Image-top-third card. */
  .dp-tech-bar__pop {
    position: absolute;
    top: 50%;
    left: calc(100% + 16px);
    transform: translateY(-50%) translateX(-8px);
    background: var(--dp-white, #fff);
    color: var(--dp-text-on-light);
    border-radius: 16px;
    width: 320px;
    height: 360px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition:
      opacity 0.25s var(--ease-out, ease),
      transform 0.25s var(--ease-out, ease),
      visibility 0.25s var(--ease-out, ease);
    pointer-events: none;
    z-index: var(--dp-z-sticky, 50);
    box-shadow: 0 12px 36px rgba(0,0,0,0.18);
    text-align: left;
  }
  .dp-tech-bar__pop::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -6px;
    width: 12px;
    height: 12px;
    background: var(--dp-white, #fff);
    border-radius: 2px;
    transform: translateY(-50%) rotate(45deg);
  }
  /* Transparent bridge across the 16px gap so hover doesn't drop while the cursor crosses it */
  .dp-tech-bar__pop::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: -18px;
    width: 18px;
  }

  .dp-tech-bar__pop-image {
    height: 50%;
    background-size: cover;
    background-position: center;
    background-color: rgba(0,0,0,0.06);
  }
  .dp-tech-bar__pop-body {
    height: 50%;
    padding: 18px 22px;
    overflow: hidden;
  }
  .dp-tech-bar__pop-title {
    font-size: 0.8rem;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--dp-text-on-light);
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .dp-tech-bar__pop-desc {
    font-size: 0.86rem;
    line-height: 1.6;
    margin: 0;
    color: var(--dp-text-on-light-muted);
  }

  .dp-tech-bar__item.is-active .dp-tech-bar__pop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%) translateX(0);
  }

  /* Desktop hover also opens the popover — suppressed while an item is click-pinned. */
  @media (hover: hover) {
    .dp-tech-bar:not(.is-has-active) .dp-tech-bar__item:hover .dp-tech-bar__pop {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(-50%) translateX(0);
    }
  }

  @media (max-width: 900px) {
    .dp-tech-bar__item { padding: 8px 14px; }
    .dp-tech-bar__name { font-size: 0.88rem; }
  }
  @media (max-width: 640px) {
    .dp-tech-bar { gap: 2px 0; }
    .dp-tech-bar__item { padding: 8px 12px; }
    .dp-tech-bar__name { font-size: 0.84rem; }

    /* No room for a side popover on phones — switch to a fixed bottom sheet. */
    .dp-tech-bar__pop {
      position: fixed;
      top: auto;
      bottom: 24px;
      left: 20px;
      right: 20px;
      width: auto;
      height: 340px;
      max-height: calc(100vh - 48px);
      transform: translateY(8px);
    }
    .dp-tech-bar__pop::before,
    .dp-tech-bar__pop::after { display: none; }
    .dp-tech-bar__item.is-active .dp-tech-bar__pop {
      transform: translateY(0);
    }
    .dp-tech-bar:not(.is-has-active) .dp-tech-bar__item:hover .dp-tech-bar__pop {
      transform: translateY(0);
    }
  }


/* ---------- panels 11-13 ---------- */
.dpx-green-fill { background: var(--dp-accent); }
.dpx-f5-fill { background: #f5f5f5; }
/* Reviews panel: the background fades from the clinics panel's white (left) to the contact panel's grey (right);
   the light shape that draws the inside curve at x 60-180 carries the matching slice of that gradient. */
.dpx-fade-slice { background: linear-gradient(to right, rgb(254.6, 254.6, 254.6), rgb(253.75, 253.75, 253.75)); }
.dpx-logo { object-fit: contain; }
/* Instalments: one composed card, text in rhythm, partners pinned to the bottom with logos at one height. */
.dpx-rate { box-sizing: border-box; height: 100%; padding: 56px 56px 52px; border-radius: 50px; background: var(--dp-accent); color: #fff; display: flex; flex-direction: column; }
.dpx-c .dpx-rate h2 { font-size: 60px; line-height: 1.1; font-weight: 200; color: #fff; }
.dpx-c .dpx-rate h2 b { font-weight: 700; }
.dpx-c .dpx-rate h4 { font-size: 32px; line-height: 1.344; font-weight: 200; color: #fff; margin-top: 40px; }
.dpx-c .dpx-rate h4 b { font-weight: 700; }
.dpx-c .dpx-rate > p { font-size: 16px; line-height: 1.8; color: #fff; margin-top: 24px; }
.dpx-rate__partners { margin-top: auto; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .35); }
.dpx-c .dpx-rate__partners p { font-size: 12px; line-height: 1; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.dpx-rate__partners div { display: flex; align-items: center; gap: 28px; margin-top: 16px; }
.dpx-rate__partners img { height: 40px; width: auto; display: block; }
.dpx-contact h2 { font-size: 64px; line-height: 1.246; font-weight: 200; color: #fff; }
.dpx-contact h2 b { font-weight: 700; color: var(--dp-accent); }
.dpx-contact h4 { font-size: 32px; line-height: 1.344; font-weight: 200; color: #fff; margin-top: -27px; }
.dpx-contact p { font-size: 16px; line-height: 1.8; color: #fff; margin-top: 32px; }
.dpx-social { display: flex; justify-content: center; align-items: center; gap: 18px; height: 100%; }
.dpx-social a { color: #fff; display: flex; transition: color .3s var(--ease-out); }
.dpx-social a:hover { color: var(--dp-accent); }
.dpx-social svg { width: 22px; height: 22px; fill: currentColor; }

/* Google reviews (were an Elfsight widget): a summary of the listing, three large cards per page, and the page
   dots sitting in the floor line, as tall as the line, between its left and right ends. */
.dpx-gsum { height: 100%; display: flex; flex-direction: column; align-items: flex-start; font-family: 'Outfit', sans-serif; color: #1a1a1a; }
.dpx-c .dpx-gsum p { color: #1a1a1a; }
.dpx-c .dpx-gsum__src { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.dpx-gsum__src .dpx-rev__g { position: static; width: 28px; height: 28px; }
.dpx-c .dpx-gsum__score { font-size: 128px; line-height: 1; font-weight: 700; letter-spacing: -.03em; margin-top: 28px; }
.dpx-gsum .dpx-rev__stars { margin: 14px 0 0; }
.dpx-gsum .dpx-rev__stars svg { width: 30px; height: 30px; }
.dpx-c .dpx-gsum__count { font-size: 16px; line-height: 1.6; color: rgba(26, 26, 26, .6); margin-top: 14px; }
.dpx-gsum__cta { margin-top: auto; display: inline-flex; align-items: center; height: 48px; padding: 0 28px; border-radius: 999px; background: #1f1f1f; color: #fff !important; font-size: 15px; font-weight: 600; text-decoration: none; transition: background .3s var(--ease-out); }
.dpx-gsum__cta:hover { background: var(--dp-accent); color: #1a1a1a !important; }
.dpx-gsum__all { margin-top: 14px; font-size: 14px; color: rgba(26, 26, 26, .6) !important; text-decoration: underline; text-underline-offset: 3px; }
.dpx-revs { width: 840px; height: 495px; overflow: hidden; font-family: 'Outfit', sans-serif; }
.dpx-revs__track { display: flex; height: 100%; transition: transform .7s var(--ease-modal); }
.dpx-rev { flex: 0 0 264px; margin-right: 24px; box-sizing: border-box; height: 100%; padding: 28px; border-radius: 24px; background: #fff; color: #111; display: flex; flex-direction: column; }
.dpx-rev__head { display: flex; align-items: center; gap: 12px; }
.dpx-rev__avatar { position: relative; flex: none; width: 44px; height: 44px; }
.dpx-rev__avatar img, .dpx-rev__avatar i { width: 44px; height: 44px; border-radius: 50%; display: block; object-fit: cover; }
.dpx-rev__avatar i { background: #0b8a6b; color: #fff; font-style: normal; font-size: 20px; line-height: 44px; text-align: center; }
.dpx-rev__g { position: absolute; right: -6px; bottom: -6px; width: 22px; height: 22px; }
.dpx-rev__who { display: flex; flex-direction: column; min-width: 0; }
.dpx-rev__name { font-size: 16px; font-weight: 600; line-height: 20px; display: flex; align-items: center; gap: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dpx-rev__check { width: 14px; height: 14px; fill: #0e8b25; flex: none; }
.dpx-rev__date { font-size: 12px; line-height: 16px; color: rgba(17, 17, 17, .5); margin-top: 3px; }
.dpx-rev__stars { display: flex; gap: 0; margin: 18px 0 12px; }
.dpx-rev__stars svg { width: 22px; height: 22px; fill: #fbbc05; }
.dpx-c .dpx-rev__text { font-size: 16px; line-height: 1.6; color: #111; margin: 0; display: -webkit-box; -webkit-line-clamp: 11; -webkit-box-orient: vertical; overflow: hidden; }
.dpx-c .dpx-rev__more, .dpx-rev-modal .dpx-rev__more { all: unset; cursor: pointer; margin-top: auto; padding-top: 10px; font-size: 15px; line-height: 23px; color: #0e8b25; align-self: flex-start; }
.dpx-c .dpx-rev__more[hidden] { display: none; }
.dpx-rev__more:hover { text-decoration: underline; }
.dpx-revs__dots { height: 100%; display: flex; align-items: center; justify-content: center; gap: 14px; }
.dpx-revs__dots button { all: unset; cursor: pointer; width: 31px; height: 31px; border-radius: 50%; background: rgba(31, 31, 31, .28); transition: background .3s var(--ease-out), transform .3s var(--ease-out); }
.dpx-revs__dots button:hover { background: rgba(31, 31, 31, .5); }
.dpx-revs__dots button[aria-current] { background: var(--dpx-floor); }
.dpx-revs__dots button:focus-visible { outline: 2px solid var(--dp-accent); outline-offset: 3px; }
.dpx-rev-modal .dpx-rev { height: auto; background: none; padding: 0; margin: 0; }
.dpx-rev-modal .dpx-rev__text { display: block; -webkit-line-clamp: unset; margin-top: 8px; white-space: pre-line; }

/* ---------- original components: clinic tabs, contact rows ---------- */
  /* Height comes from JS at the bottom of this block: we measure the
     .fe-block ancestor and set this wrapper's height inline. CSS height
     propagation through Squarespace's code-block wrapper chain is unreliable
     (wrapper class names shift between SS versions), so JS sidesteps the issue
     by reading the drawn block height directly. (Mobile is the exception — see
     the matchMedia branch in the script.) */
  .dp-loc-frosted {
    font-family: 'DM Sans', sans-serif;
    color: var(--dp-text-on-light);
    margin: 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .dp-loc-frosted *,
  .dp-loc-frosted *::before,
  .dp-loc-frosted *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: inherit;
  }

  /* ── Card: no background, image fills, frosted chin overlays ──
     The card has no fixed aspect: it fills whatever box Fluid Engine gives it
     (flex:1 takes remaining height after the tab row). The photo uses
     background-size: cover, so resizing the Code Block to a wider/taller
     ratio just crops more of the photo - never distorts it. The min-height
     is purely a fallback for contexts that don't supply a parent height
     (e.g. local preview pages); inside Fluid Engine the drawn box wins. */
  .dp-loc-frosted__card {
    position: relative;
    width: 100%;
    flex: 1;
    min-height: 360px;
    border-radius: 24px;
    overflow: hidden;
  }

  /* Panel switching */
  .dp-loc-frosted__panel {
    display: none;
    position: absolute;
    inset: 0;
  }
  .dp-loc-frosted__panel.is-active {
    display: block;
    animation: dp-loc-frosted-fade 0.45s var(--ease-modal);
  }
  @keyframes dp-loc-frosted-fade {
    from { opacity: 0; transform: scale(1.015); }
    to   { opacity: 1; transform: scale(1); }
  }

  /* Photo: fills the card, aspect preserved via cover-crop */
  .dp-loc-frosted__photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-color: rgba(0,0,0,0.06);
  }
  /* Subtle bottom-to-top darkening so the chin's frosted edge has contrast
     even against a bright photo region */
  .dp-loc-frosted__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,0.28) 100%);
    pointer-events: none;
  }

  /* ── Frosted chin (overlay at bottom of photo) ── */
  .dp-loc-frosted__chin {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 28px 22px;
    background: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
    font-weight: 300;
    letter-spacing: 0.01em;
  }

  /* Address: small uppercase eyebrow at the top of the chin */
  .dp-loc-frosted__address {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.60);
    margin-bottom: 14px;
    line-height: 1.4;
  }

  /* Info row: Program (1fr) | Actions (auto, both buttons in a flex row) */
  .dp-loc-frosted__info {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 28px;
    align-items: center;
  }
  .dp-loc-frosted__group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
  }
  .dp-loc-frosted__label {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.3;
  }
  .dp-loc-frosted__schedule {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .dp-loc-frosted__schedule-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    font-size: 13px;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.5;
  }
  .dp-loc-frosted__schedule-row strong {
    font-weight: 500;
    color: #fff;
  }
  .dp-loc-frosted__closed {
    color: rgba(255, 255, 255, 0.50);
    font-weight: 300;
  }

  /* Actions row: two equal-width pill buttons side by side (Telefon + Maps) */
  .dp-loc-frosted__actions {
    display: flex;
    gap: 10px;
    align-items: stretch;
  }

  /* CTA: pill button, glass-on-glass. Shared by both action buttons so they
     read as a matched pair (same height, same shape, same min-width). */
  .dp-loc-frosted__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 180px;
    padding: 11px 20px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: var(--dp-radius-pill);
    color: #fff;
    font-family: inherit;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.3s var(--ease-out), border-color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
  }
  .dp-loc-frosted__cta svg {
    width: 13px;
    height: 13px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
  }
  @media (hover: hover) {
    .dp-loc-frosted__cta:hover {
      background: rgba(255, 255, 255, 0.22);
      border-color: rgba(255, 255, 255, 0.50);
      transform: translateY(-1px);
    }
  }

  /* ── Tab row (top) — minimal text-only, identical to locations-tabs ── */
  .dp-loc-frosted__tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    width: 100%;
  }
  .dp-loc-frosted__tab {
    background: transparent;
    border: none;
    padding: 14px 12px;
    cursor: pointer;
    color: inherit;
    font-family: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    position: relative;
    opacity: 0.5;
    transition: opacity 0.3s var(--ease-out);
  }
  .dp-loc-frosted__tab-brand {
    display: flex;
    align-items: baseline;
  }
  .dp-loc-frosted__tab-logo {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: var(--dp-text-on-light);
    line-height: 1;
  }
  .dp-loc-frosted__tab-logo span {
    font-weight: 300;
    color: rgba(0,0,0,0.45);
  }
  .dp-loc-frosted__tab-name {
    font-size: 16px;
    font-weight: 700;
    color: var(--dp-accent-d2);
    line-height: 1;
    margin-left: 8px;
  }
  .dp-loc-frosted__tab-badge {
    display: inline-flex;
    align-items: center;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dp-white);
    background: var(--dp-accent-d2);
    padding: 3px 8px;
    border-radius: 30px;
    line-height: 1.4;
  }
  @media (hover: hover) {
    .dp-loc-frosted__tab:hover { opacity: 0.85; }
  }
  .dp-loc-frosted__tab.is-active {
    opacity: 1;
    cursor: default;
  }
  .dp-loc-frosted__tab.is-active::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 2px;
    background: var(--dp-accent-d2);
    border-radius: 2px;
  }
  @media (hover: hover) {
    .dp-loc-frosted__tab.is-active:hover { opacity: 1; }
  }

  /* ── Mobile ──
     Layout flips from "frosted overlay on a flexible box" to "stacked card":
     a fixed 3:2 photo on top and a solid dark info panel beneath it. */
  @media (max-width: 768px) {

    /* Card now flows to its content height (3:2 photo + chin stacked), instead
       of filling a JS-pinned box. flex:none + min-height:0 release the desktop
       sizing; the script clears the inline wrapper height to match. */
    .dp-loc-frosted__card {
      flex: none;
      min-height: 0;
    }

    /* Active panel joins normal flow so its photo and chin can stack */
    .dp-loc-frosted__panel.is-active {
      position: relative;
      inset: auto;
    }

    /* (1) Image locked to a 3:2 landscape box at the top of the card.
       background-size: cover still crops without distortion. */
    .dp-loc-frosted__photo {
      position: relative;
      inset: auto;
      width: 100%;
      aspect-ratio: 3 / 2;
    }
    /* Crisp edge where the photo meets the dark chin — the overlay fade was
       only there to give the frosted glass contrast, which we no longer need. */
    .dp-loc-frosted__photo::after {
      display: none;
    }

    /* (2) Chin drops BELOW the photo and goes solid dark instead of frosted.
       No backdrop blur (nothing behind it now) and no top border. Swap the
       background for a brand "dark surface" token if dp-system.css defines one. */
    .dp-loc-frosted__chin {
      position: relative;
      left: auto;
      right: auto;
      bottom: auto;
      padding: 18px 18px 20px;
      background: #181b19;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      border-top: none;
    }

    .dp-loc-frosted__address {
      font-size: 9px;
      margin-bottom: 12px;
    }
    .dp-loc-frosted__info {
      grid-template-columns: 1fr;
      gap: 14px;
      align-items: start;
    }
    .dp-loc-frosted__schedule-row { font-size: 12px; }
    .dp-loc-frosted__actions {
      flex-direction: column;
      width: 100%;
      gap: 8px;
    }
    .dp-loc-frosted__cta {
      min-width: 0;
      width: 100%;
      padding: 12px 16px;
    }

    /* (3) Tabs stack and align to the left */
    .dp-loc-frosted__tabs {
      grid-template-columns: 1fr;
    }
    .dp-loc-frosted__tab {
      justify-content: flex-start;
      padding: 11px 18px;
    }
    .dp-loc-frosted__tab.is-active::before {
      left: 18px;
      transform: none;
    }
    .dp-loc-frosted__tab-logo,
    .dp-loc-frosted__tab-name { font-size: 15px; }
  }

  .dp-contact {
    width: 100%;
    box-sizing: border-box;
    color: var(--dp-text);
    font-family: 'DM Sans', sans-serif;
  }
  .dp-contact *,
  .dp-contact *::before,
  .dp-contact *::after { box-sizing: border-box; }

  .dp-contact__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  .dp-contact__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    column-gap: 28px;
  }

  .dp-contact__brand {
    font-size: 0.9375rem;
    font-weight: 400;
    color: var(--dp-text);
    line-height: 1.3;
    white-space: nowrap;
  }
  .dp-contact__brand-mark {
    font-weight: 700;
    color: var(--dp-accent);
  }
  .dp-contact__location {
    margin-left: 6px;
    font-weight: 700;
    color: var(--dp-text);
  }

  .dp-contact__phone {
    font-weight: 500;
    font-size: 0.9375rem;
    letter-spacing: 0.04em;
    color: var(--dp-text);
    text-decoration: none;
    font-variant-numeric: tabular-nums;
    transition: color 0.25s var(--ease-out, ease-out);
  }
  .dp-contact__phone:hover,
  .dp-contact__phone:focus-visible {
    color: var(--dp-accent);
    outline: none;
  }

  .dp-contact__divider {
    display: block;
    width: 100%;
    height: 1px;
    margin: 22px 0 16px;
    border: 0;
    background: rgba(255, 255, 255, 0.10);
  }

  .dp-contact__email-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    column-gap: 28px;
  }
  .dp-contact__email-label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.10em;
    color: rgba(255, 255, 255, 0.55);
    text-transform: uppercase;
  }
  .dp-contact__email {
    font-size: 0.9375rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--dp-text);
    text-decoration: none;
    transition: color 0.25s var(--ease-out, ease-out);
  }
  .dp-contact__email:hover,
  .dp-contact__email:focus-visible { color: var(--dp-accent); outline: none; }

  /* Mobile: stack the two columns vertically per row */
  @media (max-width: 600px) {
    .dp-contact__row,
    .dp-contact__email-row {
      grid-template-columns: 1fr;
      row-gap: 4px;
    }
    .dp-contact__list { gap: 20px; }
    .dp-contact__brand { white-space: normal; }
  }


/* ---------- refinements over the original components ---------- */
/* Pillars bar: solid white pill with dark text; team bar: solid dark pill. Both 75 px tall on the same centre line. */
.dpx-c .dp-why__bar { background: #fff; border: 0; border-radius: 999px; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: 0 10px 30px rgba(0, 0, 0, .08); }
.dpx-c .dp-why__item { min-height: 75px; height: 75px; padding: 0 16px; }
.dpx-c .dp-why__item:first-child { border-radius: 999px 0 0 999px; }
.dpx-c .dp-why__item:last-child { border-radius: 0 999px 999px 0; }
.dpx-c .dp-why__item + .dp-why__item::before { background: rgba(0, 0, 0, .1); }
.dpx-c .dp-why__label { color: #1a1a1a; }
.dpx-c .dp-why__item:hover { background: rgba(163, 203, 77, .14); }
.dpx-c .dp-why__item:hover .dp-why__label { color: var(--dp-accent-d1); }
.dpx-c .dp-team-bar { background: #2a2a2a; border: 1px solid rgba(255, 255, 255, .1); border-radius: 999px; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.dpx-c .dp-team-bar__col { border-right-color: rgba(255, 255, 255, .1); }
.dpx-c .dp-team-bar__col:first-child { padding-left: 40px; }
.dpx-c .dp-team-bar__name { color: #fff; }
.dpx-c .dp-team-bar__title { color: var(--dp-accent); }
.dpx-c .dp-team-bar__subtitle { color: rgba(255, 255, 255, .55); }
/* Services on the floor: hover shows the pillars' bubble with the service summary. */
.dpx-c .dp-srv__bar { overflow: visible; }
.dpx-c .dp-srv__item { position: relative; }
@media (hover: hover) {
  .dpx-c .dp-srv__item:hover .dp-why__bubble, .dpx-c .dp-srv__item:focus-visible .dp-why__bubble { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); pointer-events: auto; }
}
/* +ECHIPA: a green pill laid over the end of the team pill. */
.dpx-c .dp-team-bar__cta { border-radius: 999px; padding: 0 36px 0 40px; box-shadow: -10px 0 24px rgba(0, 0, 0, .14); transition: background .35s var(--ease-out), box-shadow .35s var(--ease-out); }
.dpx-c .dp-team-bar__cta:hover { box-shadow: -14px 0 30px rgba(0, 0, 0, .2); }

/* Layout check (?grid): the 60 x 31 grid over every canvas. */
.dpx-grid .dpx-c::after { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 99;
  background-image: linear-gradient(to right, rgba(255, 0, 80, .3) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 0, 80, .3) 1px, transparent 1px);
  background-size: 60px 31px; background-position: left bottom; }
.dpx-ph { display: flex; align-items: center; justify-content: center; color: rgba(0, 0, 0, .25); font-weight: 200; font-size: 44px; }