/* Motion polish and detail layers discovered during the second reference pass. */
html { scroll-behavior: auto; }

/* Fade the returning header on its own composited surface. Extending that surface
   above the viewport prevents the one-pixel seam Chromium can expose at y=0. */
.site-header {
  background-color: transparent !important;
  box-shadow: none !important;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  will-change: transform;
}
.site-header::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -3px 0 -1px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(22, 23, 29, .1);
  opacity: 0;
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: opacity;
  pointer-events: none;
  transition: opacity 1s cubic-bezier(.22, .61, .36, 1);
}
.site-header > * {
  position: relative;
  z-index: 1;
}
.site-header.is-solid::before { opacity: 1; }
.site-header.is-top-fading::before { opacity: 0; }
.site-header.is-hidden { transform: translate3d(0, -110%, 0); }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@keyframes media-drift {
  0% { transform: translate3d(-1.5%, -1%, 0) scale(1); }
  45% { transform: translate3d(1.5%, 1.2%, 0) scale(1.035); }
  100% { transform: translate3d(-.5%, 2%, 0) scale(1.015); }
}
@keyframes progress-spin { to { transform: rotate(360deg); } }

.media-placeholder i,
.experts-media i {
  animation: media-drift 13s ease-in-out infinite alternate;
  will-change: transform;
}
.media-placeholder i:nth-of-type(2),
.experts-media i:nth-of-type(2) { animation-delay: -4s; animation-duration: 16s; }
.media-placeholder i:nth-of-type(3),
.experts-media i:nth-of-type(3) { animation-delay: -7s; animation-duration: 18s; }

.hero-blur {
  position: absolute;
  z-index: 2;
  inset: 0 auto 0 0;
  width: 76px;
  background: linear-gradient(90deg, rgba(18, 22, 25, .28), transparent);
  backdrop-filter: blur(9px);
  pointer-events: none;
}

.services-bg {
  position: absolute;
  inset: -9%;
  opacity: .62;
  filter: blur(34px) saturate(.72);
  transform: scale(1.08);
  transition: background 650ms cubic-bezier(.22,.61,.36,1);
}
.services-bg.state-0,
.services-bg.state-1,
.services-bg.state-2,
.services-bg.state-3 { background: linear-gradient(135deg,#796f63,#566460 52%,#222b2e); }

/* The portrait and the first service frame share one visual plane at the hand-off. */
.goal-media,
.service-images { transform: translateZ(0); backface-visibility: hidden; }
.goal-media-anchor { display: none; }
.goal.is-handoff { z-index: auto; }
.goal.is-handoff .goal-stage { overflow: visible; }
.goal-media.is-portal {
  position: fixed;
  z-index: 90;
  left: 0;
  top: 0;
  width: 50%;
  height: 100%;
  opacity: var(--goal-handoff-opacity,1);
  transform: translateZ(0) scale(var(--goal-handoff-scale,1));
  transform-origin: center;
  backface-visibility: hidden;
  will-change: opacity,transform;
  pointer-events: none;
}
.goal-media.is-portal > span,
.goal-media.is-portal > i,
.goal-media.is-service-first > span,
.goal-media.is-service-first > i { opacity: 0; }
.service-images > .goal-media.is-service-first {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  transform: scale(var(--service-scale,1));
  clip-path: none;
  pointer-events: none;
}
.goal-media::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: -12%;
  background: linear-gradient(105deg,transparent 34%,rgba(255,255,255,.25) 49%,transparent 64%);
  opacity: var(--goal-sheen-opacity,0);
  transform: translate3d(var(--goal-sheen-x,-120%),0,0);
  mix-blend-mode: soft-light;
  pointer-events: none;
}
.goal-media > span { opacity: var(--goal-media-label-opacity, 1); transition: opacity .56s var(--ease); }
.goal-media > i { opacity: var(--goal-media-detail-opacity, .75); }
.service-images {
  inset: auto;
  left: var(--service-frame-x, 0%);
  top: var(--service-frame-y, 0%);
  width: var(--service-frame-w, 50%);
  height: var(--service-frame-h, 100%);
  will-change: left, top, width, height;
}
.service-image { transform: scale(var(--service-scale,1)); }
.service-titles.is-ui-portal {
  position: fixed;
  z-index: 95;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.service-index.is-ui-portal {
  position: fixed;
  z-index: 95;
}
.service-titles {
  opacity: var(--service-ui-opacity, 1);
  will-change: opacity;
}
.services-right,
.service-index,
.service-all {
  opacity: var(--service-ui-opacity, 1);
  transform: translateY(var(--service-ui-y, 0px));
  will-change: opacity, transform;
}
.service-image > span { opacity: var(--service-ui-opacity, 1); }

/* Semantic elements keep the original visual styling after the heading cleanup. */
.service-titles .service-title {
  position: absolute;
  z-index: 4;
  left: 17%;
  bottom: 12%;
  width: 66%;
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(72px,10.6vw,166px);
  font-weight: 400;
  line-height: .76;
  letter-spacing: -.055em;
  opacity: 0;
  transform: translateY(45px);
  transition: opacity .64s var(--ease), transform .84s var(--ease);
}
.service-titles .service-title { transition: opacity .64s var(--ease), transform .84s var(--ease); }
.service-titles .service-title.is-active { opacity: 1; transform: none; }
.service-copy-stack p { transition: opacity .58s var(--ease), transform .76s var(--ease); }
.technology-list h3 { margin: 0; font-family: var(--serif); font-size: clamp(30px,3.2vw,52px); font-weight: 400; }
.expert-names h3 { margin: 0; font-weight: 400; font-size: 13px; }
.testimonial-nav h2 { margin: 0 0 18px; font: 400 10px/1.2 var(--sans); }
.footer-top h2 { margin: 0; max-width: 700px; font-family: var(--serif); font-size: clamp(34px,4.4vw,68px); font-weight: 400; line-height: 1; }

.round-cta,
.service-all,
.service-links li,
.footer-social a,
.menu-cards a {
  transition: color .46s var(--ease), border-color .46s var(--ease), background-color .46s var(--ease), transform .68s var(--ease);
}
.round-cta b { transition: transform .72s var(--ease), background-color .46s var(--ease), color .46s var(--ease); }
.round-cta:hover b { transform: rotate(45deg) scale(1.06); }
.service-all:hover { transform: translateX(5px); }
.service-links li:hover { padding-left: 6px; }
.service-links li > a { width: 100%; display: flex; align-items: center; justify-content: space-between; }
.footer-social a:hover { background: var(--ink); color: var(--light); transform: translateY(-4px); }
.menu-cards a:hover { transform: translateY(-5px); }

.technology-label {
  position: absolute;
  left: 55.2%;
  top: 32%;
  font-size: 10px;
  letter-spacing: .04em;
}
.technology-list {
  top: 35%;
  overflow: hidden;
  transform: none;
}
.technology-list article { height: 17.85vh; }
.technology-list-scroller {
  transform: translateY(var(--tech-list-y, 0));
  will-change: transform;
}
.technology-list article { position: relative; }
.tech-image {
  opacity: 0;
  transform: translateZ(0) scale(1.085);
  transform-origin: center;
  transition: opacity .82s cubic-bezier(.22,.61,.36,1),transform 1.05s cubic-bezier(.22,.61,.36,1);
  will-change: opacity,transform;
  backface-visibility: hidden;
}
.tech-image.is-active { opacity: 1; transform: translateZ(0) scale(1); }
.technology-list article > a {
  position: absolute;
  right: 2px;
  top: 18px;
  font-size: 9px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.expert-names article { max-width: 260px; }
.expert-names article p {
  margin-top: 14px;
  max-width: 220px;
  color: rgba(238,234,229,.72);
  font-size: 9px;
  line-height: 1.38;
}

.testimonial-nav button i {
  position: relative;
  width: 10px;
  height: 10px;
}
.testimonial-nav button.is-active i {
  border-color: rgba(238,234,229,.25);
  background: transparent;
}
.testimonial-nav button.is-active i::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: var(--light);
  animation: progress-spin 6s linear infinite;
}
.testimonial-mouse {
  position: absolute;
  z-index: 3;
  left: calc(50% - 90px);
  top: 50%;
  width: 180px;
  height: 180px;
  border: 1px solid rgba(238,234,229,.14);
  border-radius: 50%;
  display: grid;
  place-items: center;
  opacity: 0;
  transform: scale(.8);
  transition: opacity .35s, transform .55s cubic-bezier(.2,.7,.15,1);
  pointer-events: none;
}
.testimonials-inner:hover .testimonial-mouse { opacity: .72; transform: scale(1); }
.testimonial-mouse i { position: absolute; inset: -1px; border-top: 1px solid var(--light); border-radius: 50%; animation: progress-spin 6s linear infinite; }
.testimonial-mouse span { font-size: 11px; letter-spacing: 10px; }
.technology-media, .quote-stage { touch-action: pan-y; }
.testimonial-orbit { display: none; }
.metric-content { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; }

:root { --serif: "Bodoni MT", Didot, "Times New Roman", serif; }

@media (min-width: 901px) {
  .service-flyout { transform:translate3d(0,-18px,0); transition:transform .72s var(--ease),opacity .56s var(--ease),visibility .72s; }
  .service-flyout.is-open { transform:none; }
  .tech-image { transform:scale(1.085); transition:opacity .68s var(--ease),transform .95s var(--ease); }
  .tech-image.is-active { transform:scale(1); }
  /* Goal stays pinned while the fully composed first service stage covers it. */
  .goal { height: 234vh; }
  .goal-stage { top: calc(100vh - 134vh); height: 134vh; }
  .services { margin-top: -100vh; }
  .goal-label,
  .goal-copy {
    opacity: var(--goal-content-opacity,1);
    filter: blur(var(--goal-content-blur,0px));
    transform: translateZ(0);
    will-change: opacity,filter;
  }
  .goal.is-handoff .goal-media { z-index: 7; }
  .services-stage {
    transform: translate3d(0,var(--service-exit-y,0px),0);
    will-change: transform;
  }
  .banner {
    transform: translate3d(0,var(--banner-entry-y,0px),0);
    will-change: transform;
  }

  /* Lower-page kinetic sequence: intersecting orbital lines and metric bubbles. */
  .why-circle {
    left: var(--why-orbit-cx,50%);
    right: auto;
    top: var(--why-orbit-cy,55%);
    width: 100vh;
    height: 100vh;
    border: 0;
    backface-visibility: hidden;
    transform: translate3d(-50%,-50%,0) rotate(var(--why-orbit-r,0deg));
    transform-origin: center;
    will-change: left,top,transform;
  }
  .why-circle::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: conic-gradient(from 0deg, transparent 0deg, rgba(238,234,229,.52) 45deg, rgba(238,234,229,.52) 135deg, transparent 180deg, transparent 360deg);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--why-arc-stroke,2.5px)), #000 calc(100% - var(--why-arc-stroke,2.5px) + .5px));
    mask: radial-gradient(farthest-side, transparent calc(100% - var(--why-arc-stroke,2.5px)), #000 calc(100% - var(--why-arc-stroke,2.5px) + .5px));
    pointer-events: none;
  }
  .why-circle--left {
    left: var(--why-left-cx,-2%);
    top: var(--why-left-cy,55%);
    --why-arc-stroke: var(--why-left-stroke,2.5px);
    transform: translate3d(-50%,-50%,0) rotate(var(--why-pair-r,0deg)) scale(var(--why-left-scale,1));
  }
  .why-circle--right {
    left: var(--why-right-cx,102%);
    top: var(--why-right-cy,55%);
    opacity: var(--why-right-opacity,1);
    transform: translate3d(-50%,-50%,0) rotate(var(--why-pair-r,0deg)) scale(var(--why-right-scale,1));
  }
  .why-circle--right::before {
    background: conic-gradient(from 180deg, transparent 0deg, rgba(238,234,229,.52) 45deg, rgba(238,234,229,.52) 135deg, transparent 180deg, transparent 360deg);
  }
  .why-label {
    z-index: 4;
    top: calc(43% + var(--why-label-y, 0vh));
    width: 90px;
    text-align: center;
    line-height: 1.05;
    opacity: var(--why-label-opacity, 1);
  }
  .why h2 {
    z-index: 3;
    top: calc(35% + var(--why-title-y, 0vh));
    height: 34vh;
    font-size: 10.625vw;
    line-height: .77;
    transform: scale(var(--why-title-scale,.94));
    transform-origin: 50% 45%;
    opacity: var(--why-title-opacity,.2);
    white-space: nowrap;
  }
  .why h2 .why-line { position: absolute; display: block; }
  .why h2 { opacity: var(--why-title-opacity,.2); }
  .why-line--left { left: 1.6%; top: 0; }
  .why-line--right { right: 1.6%; top: 0; }
  .why-line--center { left: 50%; top: 52%; transform: translateX(-50%); }

  .metrics-grid {
    position: absolute;
    z-index: 5;
    inset: 0;
    display: block;
    opacity: 1;
    transform: none;
    pointer-events: none;
  }
  .metrics-grid .metric-bubble {
    position: absolute;
    left: 0!important;
    top: 0!important;
    width: 16.1vw;
    height: 16.1vw;
    min-height: 0;
    border: 0;
    border-radius: 44% 44% 34% 34% / 31% 31% 69% 69%;
    clip-path: polygon(18% 8%,32% 2%,50% 7%,68% 2%,82% 8%,94% 25%,92% 48%,82% 70%,72% 96%,58% 76%,50% 67%,42% 76%,28% 96%,18% 70%,8% 48%,6% 25%);
    display: grid;
    place-items: center;
    color: #30313a;
    opacity: var(--bubble-opacity,0);
    transform: translate3d(var(--bubble-x,50vw),var(--bubble-y,-30vh),0) translate(-50%,-50%) rotate(var(--bubble-rotate,0deg)) scale(var(--bubble-scale,.96));
    transform-origin: center;
    will-change: transform,opacity;
  }
  .metrics-grid .metric-bubble:last-child { border: 0; }
  .metric-bubble--experience { background: #565867; color: var(--light)!important; }
  .metric-bubble--veneers { background: #f0efed; }
  .metric-bubble--education { background: #666979; color: var(--light)!important; }
  .metric-bubble--locations { background: #9ea5b5; }
  .metric-bubble--patients,
  .metric-bubble--crowns { width: 22.2vw!important; height: 22.2vw!important; background: #d4cfcc; }
  .metric-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transform: rotate(var(--bubble-content-rotate,0deg));
    transform-origin: center;
    will-change: transform;
  }
  .metrics-grid strong { font-size: clamp(42px,4.1vw,66px); line-height: .9; }
  .metric-bubble--patients strong,
  .metric-bubble--crowns strong { font-size: clamp(60px,5.8vw,92px); }
  .metrics-grid span { width: 58%; margin-top: 12px; color: currentColor; font-size: 9px; line-height: 1.05; text-transform: uppercase; }

  /* Testimonials are a full editorial panel with a persistent progress control. */
  .testimonials { min-height: 82vh; padding: 7vh var(--pad) 12vh; }
  .testimonials-inner {
    height: 62vh;
    grid-template-columns: 1fr 1fr;
    border-top-color: rgba(238,234,229,.18);
    opacity: var(--testimonial-opacity,0);
    transform: translateY(var(--testimonial-y,42px));
    will-change: opacity,transform;
  }
  .testimonials-inner::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(238,234,229,.14);
  }
  .testimonial-nav { padding-right: 7vw; }
  .testimonial-nav button { max-width: 230px; }
  .quote-stage { min-height: 100%; padding-left: 24px; overflow: hidden; }
  .quote-stage p {
    max-width: 92%;
    font-family: var(--sans);
    font-size: clamp(25px,2.15vw,42px);
    font-weight: 600;
    line-height: .96;
    letter-spacing: -.045em;
  }
  .quote-stage span { position: absolute; left: 24px; bottom: 0; }
  .testimonial-orbit {
    position: absolute;
    z-index: 4;
    left: calc(75% - 105px);
    top: 47%;
    width: 210px;
    height: 210px;
    border: 1px solid rgba(238,234,229,.16);
    border-radius: 50%;
    color: var(--light);
    display: grid;
    place-items: center;
    transition: transform .45s cubic-bezier(.22,.61,.36,1),border-color .3s;
  }
  .testimonial-orbit:hover { transform: scale(1.06); border-color: rgba(238,234,229,.42); }
  .testimonial-orbit i,
  .testimonial-orbit::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 50%;
    border: 2px solid transparent;
    border-right-color: var(--light);
  }
  .testimonial-orbit.is-running::before { animation: progress-spin 6s linear infinite; }
  .testimonial-orbit span { font-size: 32px; font-weight: 300; }

  .finale-sequence {
    position: relative;
    height: 235vh;
    background: var(--ink);
  }
  .finale-stage {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
    background: var(--ink);
  }
  .pre-footer {
    position: absolute;
    inset: 0;
    height: 100vh;
  }
  .prefooter-orbit { display: none; }
  .prefooter-media {
    inset: 0;
    width: 100%;
    height: 100%;
    clip-path: none;
    transform: none;
    will-change: auto;
  }
  .prefooter-media > img,
  .prefooter-media > video { width: 100%; height: 100%; object-fit: cover; }
  .prefooter-media i { animation: none; transform: none; will-change: auto; }
  .pre-footer h2 {
    top: 50%;
    bottom: auto;
    z-index: 2;
    color: #fff;
    opacity: 1;
    mix-blend-mode: difference;
    transform: translate3d(0,-50%,0);
    will-change: auto;
  }
  .footer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100vh;
    z-index: 6;
    margin: 0;
    padding: 8vh var(--pad) 16px;
    border-radius: 50% 50% 0 0 / var(--footer-curve,11vw) var(--footer-curve,11vw) 0 0;
    background: #272832;
    color: var(--light);
    transform: translate3d(0,var(--footer-dome-y,100vh),0);
    will-change: transform;
  }
  .footer::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 18vh;
    border-top: 1px solid rgba(238,234,229,.15);
    border-radius: 50% 50% 0 0 / var(--footer-curve,11vw) var(--footer-curve,11vw) 0 0;
    pointer-events: none;
  }
  .footer-orbit { top: -8vh; width: min(40vw,58vh); height: min(40vw,58vh); border-color: rgba(238,234,229,.2); }
  .footer-orbit::before { border-color: rgba(238,234,229,.15); }
  .footer-links,
  .footer-bottom { border-color: rgba(238,234,229,.18); }
  .footer-links p,
  .footer-locations span { color: rgba(238,234,229,.58); }
  .footer-locations details { border-color: rgba(238,234,229,.18); }
  .footer-social a { border-color: rgba(238,234,229,.22); }
  .footer-fields input { color: var(--light); border-color: rgba(238,234,229,.28); }
  .footer-fields input:focus { border-color: var(--light); }
  .footer-fields button { background: var(--light); color: #272832; }
  .footer-form fieldset span { border-color: rgba(238,234,229,.28); }
  .footer-form fieldset input:checked + span { background: var(--light); color: #272832; }
  .footer-logo,
  .footer-top,
  .footer-social { opacity: var(--footer-content-opacity,0); transition: opacity .32s cubic-bezier(.22,.61,.36,1); }
  .footer-logo {
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    top: 5.5vh;
    font-size: clamp(48px,5vw,76px);
    line-height: 1;
  }
  .footer-top {
    width: 50%;
    margin: 8.5vh 0 1.5vh auto;
    gap: 12px;
  }
  .footer-top > h2 {
    max-width: 520px;
    font-size: clamp(30px,3.1vw,48px);
    line-height: .94;
  }
  .footer-form { gap: 9px; }
  .footer-form fieldset span { padding: 6px 9px; }
  .footer-fields { grid-template-columns: 1fr 1fr 56px; gap: 7px; }
  .footer-fields label { min-height: 43px; padding: 0 18px; }
  .footer-fields button { width: 52px; height: 52px; }
  .footer-links {
    margin-top: auto;
    padding-top: 14px;
  }
  .footer-links > div { gap: 5px; font-size: 10px; }
  .footer-links p { margin-bottom: 4px; }
  .footer-locations details { padding-top: 6px; }
  .footer-locations span { margin-top: 5px; }
  .footer-social { top: 42%; }
  .footer-bottom { margin-top: 12px; padding-top: 10px; }
}

@media (min-width: 901px) {
  .banner { overflow: visible; }
  .media-placeholder--banner {
    transform: translateY(var(--banner-y,0)) translateY(var(--banner-exit-y,0px)) scale(var(--banner-scale,1.08));
    will-change: transform;
  }
  .banner-grid {
    transform: translate3d(0,var(--banner-exit-y,0px),0);
    will-change: transform;
  }
  .technology { padding-top: 26.8vh; }
  .technology-bridge { left:18%; top:-126vh; height:28vh; overflow:visible; padding-bottom:.22em; font-size:10.625vw; transform:translate3d(0,var(--tech-bridge-y,0),0) scaleX(.86) scaleY(1.12); transform-origin:left top; will-change:transform; }
  .technology-bridge span { overflow: visible; }
  .technology-bridge span:first-child { color:var(--ink); clip-path:none; }
  .technology-bridge span:last-child { display:none; }
  .technology-title {
    position: relative;
    width: calc(100% - 2*var(--pad));
    height: 34vh;
    display: grid;
    grid-template-columns: max-content max-content;
    grid-template-rows: auto auto;
    justify-content: center;
    align-content: start;
    column-gap: clamp(18px,2.2vw,42px);
    font-size: clamp(82px,10.625vw,154px);
    line-height: .76;
  }
  .technology-title span,
  .technology-title em,
  .technology-title b {
    position: relative;
    font: inherit;
    line-height: inherit;
    white-space: nowrap;
  }
  .technology-title span { grid-column:1; grid-row:1; transform: scaleX(.92) scaleY(1.12); transform-origin: right top; }
  .technology-title em { grid-column:2; grid-row:1; font-style: normal; }
  .technology-title em i { display: inline-block; margin-right: .18em; font-size: 1em; font-style: italic; transform: scaleY(1.12); transform-origin: left top; }
  .technology-title em strong { display: inline-block; font: inherit; transform: scaleX(.95) scaleY(1.12); transform-origin: left top; }
  .technology-title b { grid-column:1 / -1; grid-row:2; justify-self:center; margin-top:.24em; transform:scaleX(.88) scaleY(1.12); font-weight:400; }
  .technology-runway { margin-top: 3vh; }
  .experts h2 { left: 4%; top: 7.5%; font-size: 17.2vw; transform: translate3d(var(--expert-title-x,-46vw),var(--expert-title-y,0),0) scaleX(.92); transform-origin: left top; }
  .expert-names { top: 45%; }
  .experts-copy { top: 66%; }
  .site-header {
    grid-template-columns: 240px 1fr auto;
    gap: 28px;
    align-items: start;
  }
  .desktop-nav { justify-self: start; gap: 34px; }
  .header-actions { display: flex; align-items: flex-start; gap: 28px; font-size: 10px; }
  .header-actions > a { padding-top: 4px; }
  .header-phone { display: grid; line-height: 1.05; }
  .header-phone small { margin-top: 3px; font-size: 7px; opacity: .65; }
  .header-actions > button { min-width: 170px; height: 44px; margin-top: -3px; padding: 0 13px 0 22px; border-radius: 99px; background: var(--light); display: flex; align-items: center; justify-content: space-between; }
  .site-header.is-solid .header-actions > button,
  .site-header.is-top-fading .header-actions > button { background: var(--ink); color: var(--light); }
  .header-actions > button b { font-size: 20px; font-weight: 400; }
  .site-header > .menu-button { display: none; }

  .goal-copy { height: 53.7%; }
  .goal-label { top: 35%; }
  .goal-label { font-size: 5.77vw; line-height: .94; }
  .goal-copy h2 { position: absolute; top: 34vh; margin: 0; font-size: 5.77vw; line-height: .93; }
  .goal-copy > .round-cta { position: absolute; top: var(--goal-cta-top,118vh); }
  .hero-next { top: 44.5%; font-size: 10.625vw; }
  .service-titles .service-title { left: 30.9%; bottom: 5.7%; width: 39.4%; font-size: 10.625vw; }
  .services-right { left: 71.6%; top: 3.5%; width: 26.4%; }
  .services-heading { margin: 0 0 62px; font: 400 10px/1.2 var(--sans); }
  .service-copy-stack { min-height: 76px; }
  .service-copy-stack p { font-size: 16px; font-weight: 600; line-height: .98; letter-spacing: -.035em; }
  .service-card-media { width: 44%; height: 30vh; margin-top: 10px; }
  .service-links { position: absolute; left: 53%; top: 158px; width: 47%; }
  .service-index { bottom: 20px; width: 155px; gap: 4px; }
  .service-index-label { margin-bottom: 16px; font-size: 10px; color: var(--light); }
  .service-index button { gap: 0; }
  .service-index i { display: none; }
  .service-all { width: 140px; height: 44px; right: var(--pad); bottom: 18px; padding: 0 16px 0 20px; border-radius: 99px; background: var(--light); color: var(--ink); display: flex; align-items: center; justify-content: space-between; }
  .technology-active-title { display: none; }
  .footer-top {
    width: 50%;
    margin: 8.5vh 0 1.5vh auto;
    justify-items: stretch;
    text-align: left;
    gap: 12px;
  }
  .footer-top > h2 { max-width: 520px; font-size: clamp(30px,3.1vw,48px); line-height: .94; }
  .footer-mobile-cta { display: none; }
  .footer-form { display: grid; gap: 9px; }
  .footer-form fieldset { border: 0; padding: 0; margin: 0; display: flex; align-items: center; gap: 9px; }
  .footer-form legend { float: left; margin-right: 18px; font-size: 9px; line-height: 30px; }
  .footer-form fieldset label { cursor: pointer; }
  .footer-form fieldset input { position: absolute; opacity: 0; }
  .footer-form fieldset span { display: block; border: 1px solid var(--line); border-radius: 99px; padding: 6px 9px; font-size: 9px; }
  .footer-form fieldset input:checked + span { background: var(--light); color: #272832; }
  .footer-fields { display: grid; grid-template-columns: 1fr 1fr 56px; gap: 7px; align-items: center; }
  .footer-fields label { min-height: 43px; padding: 0 18px; border: 1px solid rgba(238,234,229,.2); border-radius: 999px; display: grid; align-content: center; gap: 2px; font-size: 9px; }
  .footer-fields label:nth-child(3) { grid-column: 1 / 3; }
  .footer-fields input { width: 100%; border: 0; background: transparent; padding: 3px 0; outline: none; }
  .footer-fields input:focus { border-color: var(--ink); }
  .footer-fields button { grid-column: 3; grid-row: 2; width: 52px; height: 52px; border-radius: 50%; background: var(--light); color: #272832; }
  .footer-form .form-status { min-height: 12px; font-size: 9px; }
  .footer-form .form-privacy { max-width:620px; margin:0; color:#9a9ba3; font-size:9px; line-height:1.45; }
  .footer-form .form-privacy a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
  .footer-social { position: absolute; left: var(--pad); top: 42%; margin: 0; }
}

.menu-main a {
  --menu-link-x: 0px;
  font-size: clamp(2rem,3.2vw,3.8rem);
  line-height: .82;
  opacity: 1;
  transform: translate3d(var(--menu-link-x),0,0);
  transition:
    opacity .38s cubic-bezier(.22,.61,.36,1),
    color .38s cubic-bezier(.22,.61,.36,1),
    transform .62s var(--ease);
  will-change: opacity, transform;
}

/* The start-page overlay uses the same calm interaction as every subpage menu. */
.menu-overlay.is-open .menu-main a {
  animation: menu-main-link-in .82s var(--ease) backwards;
}
.menu-overlay.is-open .menu-main a:nth-child(2) { animation-delay: .045s; }
.menu-overlay.is-open .menu-main a:nth-child(3) { animation-delay: .09s; }
.menu-overlay.is-open .menu-main a:nth-child(4) { animation-delay: .135s; }
.menu-overlay.is-open .menu-main a:nth-child(5) { animation-delay: .18s; }
.menu-overlay.is-open .menu-main a:nth-child(6) { animation-delay: .225s; }
.menu-overlay.is-open .menu-main a:nth-child(7) { animation-delay: .27s; }

.menu-overlay.is-open .menu-services,
.menu-overlay.is-open .menu-social {
  animation: menu-supporting-content-in .78s var(--ease) .08s backwards;
}
.menu-overlay.is-open .menu-cards a {
  animation: menu-card-in .76s var(--ease) backwards;
}
.menu-overlay.is-open .menu-cards a:nth-child(2) { animation-delay: .06s; }
.menu-overlay.is-open .menu-cards a:nth-child(3) { animation-delay: .12s; }
.menu-overlay.is-open .menu-cards a:nth-child(4) { animation-delay: .18s; }

.menu-main:where(:hover,:focus-within) a:not(:hover):not(:focus-visible) {
  opacity: .28;
}
.menu-main a:where(:hover,:focus-visible) {
  --menu-link-x: 10px;
  opacity: 1;
}
.menu-main a:focus-visible {
  outline: 1px solid rgba(238,234,229,.62);
  outline-offset: 5px;
}

@keyframes menu-main-link-in {
  from { opacity:0; transform:translate3d(-18px,24px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
@keyframes menu-card-in {
  from { opacity:0; transform:translate3d(0,30px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
@keyframes menu-supporting-content-in {
  from { opacity:0; transform:translate3d(0,18px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}

@media (max-width: 900px) {
  .desktop-nav, .header-actions { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .hero-blur, .services-bg, .technology-label, .testimonial-mouse, .footer-form { display: none; }
  .hero-initial--dark {
    display: block;
    z-index: 4;
    left: 16.6px;
    top: 158px;
    width: calc(100% - 33.2px);
    clip-path: none;
    text-align: left;
    font-size: 74px;
    line-height: .74;
    opacity: 1;
    transform: none;
  }
  .hero-initial--dark span + span { margin-top: 0; }
  .hero-mobile-copy { position: absolute; z-index: 4; inset: 0; padding: 0; pointer-events: none; }
  .hero-mobile-copy p { position: absolute; top: 342px; right: 16.6px; width: 235px; margin: 0; }
  .services-mobile > .mobile-section-title { padding: 0 31px; margin-bottom: 58px; font-family: var(--serif); font-size: 56px; font-weight: 400; }
  .expert-names article p { display: none; }
  .expert-names h3 { font-size: 10px; }
  .technology-active-title { display: block; }
  .technology-title { line-height: .82; overflow: hidden; }
  .technology-title span,
  .technology-title em,
  .technology-title b { position: static; display: block; font: inherit; line-height: inherit; white-space: nowrap; transform: none; }
  .technology-title em { text-align: right; font-style: normal; }
  .technology-title em i { font-size: .78em; font-style: italic; }
  .technology-title em strong { font: inherit; }
  .technology-title b { text-align: center; font-weight: 400; }
  .footer-top h2 { width: 95%; font-size: 39px; line-height: .95; }
  .why-stage::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 28px;
    width: 90px;
    height: 45px;
    border: 1px solid rgba(238,234,229,.22);
    border-bottom: 0;
    border-radius: 90px 90px 0 0;
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .media-placeholder i, .experts-media i, .prefooter-media i,
  .testimonial-nav button.is-active i::after, .testimonial-mouse i { animation: none; }
}

/* Contact forms stay disabled until a verified recipient and data workflow exist. */
.footer-direct-actions {
  width: 100%;
  max-width: 520px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  justify-self: start;
  border-top: 1px solid rgba(238,234,229,.28);
  border-bottom: 1px solid rgba(238,234,229,.28);
  text-align: left;
}
.footer-direct-actions::before {
  content: "Online-Termin wählen";
  grid-column: 1 / -1;
  padding: 11px 0;
  border-bottom: 1px solid rgba(238,234,229,.18);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .62;
}
.footer-direct-actions a {
  min-width: 0;
  min-height: 86px;
  padding: 17px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  transition: background .32s, color .32s, padding .32s;
}
.footer-direct-actions a:first-of-type { border-right: 1px solid rgba(238,234,229,.18); }
.footer-direct-actions a:hover { padding-left: 25px; background: rgba(238,234,229,.08); }
.booking-direct-actions a {
  min-height: 66px;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  transition: background .25s, color .25s;
}
.footer-direct-actions span,
.booking-direct-actions span { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; opacity: .62; }
.footer-direct-actions strong,
.booking-direct-actions strong { font: 400 clamp(15px,1.3vw,20px)/1 var(--serif); }
.booking-direct-actions { display: grid; gap: 8px; }
.booking-direct-actions a:hover { background: var(--ink); color: var(--light); }

@media (max-width: 900px) {
  .footer-direct-actions { display: none; }
  .booking-direct-actions a { min-height: 58px; padding: 11px 14px; }
  .booking-direct-actions strong { font-size: 16px; }
}