/* scroll-details.css */
/* Additional motion is confined to homepage content, never the header. */
.team-chapter {
  background: #f7f7f0;
  padding: 95px 0
}

.team-stack {
  display: block;
  position: relative;
  isolation: isolate;
  padding-bottom: 35px
}

.team-stack .team-card {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  position: relative;
  height: 465px;
  padding: 0;
  margin: 0 0 45px;
  background: #e7eddc;
  border: 1px solid #cbd6b8;
  overflow: hidden;
  color: #193038;
  text-decoration: none
}

.team-stack .team-card:nth-child(2) {
  background: #e6ede7;
  border-color: #d0dccf
}

.team-stack .team-card:nth-child(3) {
  background: #f0f1e8;
  border-color: #d9dfca
}

.motion-stack .team-card {
  position: sticky;
  top: calc(var(--stack-top, 112px) + var(--card-peek));
  z-index: var(--card-order);
  margin-bottom: 140px;
  transform: scale(var(--card-scale, 1));
  transform-origin: top center;
  box-shadow: 0 -8px 35px #1930380c
}

.motion-stack .team-card:last-child {
  margin-bottom: 0
}

.team-stack .team-card:after {
  display: none
}

.team-card-portrait {
  height: 100%;
  min-width: 0;
  overflow: hidden
}

.team-stack .team-card .team-card-portrait img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center 23%;
  border-radius: 0;
  transition: scale .7s
}

.team-card:hover .team-card-portrait img {
  scale: 1.025
}

.team-card-info {
  padding: 45px 55px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0
}

.team-card-index {
  font-size: 9px;
  letter-spacing: .17em;
  color: #7b8c65;
  margin-bottom: 35px
}

.team-stack .team-card h3 {
  font-size: clamp(31px, 3.7vw, 54px);
  margin: 0 0 14px;
  line-height: 1.1;
  letter-spacing: -.055em;
  max-width: 520px
}

.team-card-title {
  font-size: 11px;
  line-height: 1.8;
  color: #536b48;
  max-width: 340px
}

.team-stack .team-card p {
  font-size: 13px;
  line-height: 1.85;
  max-width: 380px;
  margin: 20px 0 24px;
  color: #71816c
}

.team-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 45px;
  padding-bottom: 8px;
  border-bottom: 1px solid #aab995;
  font-size: 11px;
  margin-top: auto
}

.team-card-cta .ui-icon {
  width: 19px;
  height: 19px
}

.statement-section {
  background: #e9eedf;
  padding: 100px 0 80px
}

.statement-section .wrap {
  max-width: 1150px
}

.scroll-statement {
  font-family: Manrope, sans-serif;
  font-size: clamp(44px, 6.5vw, 91px);
  letter-spacing: -.055em;
  line-height: 1.16;
  font-weight: 500;
  color: #223a2d;
  margin: 35px 0 45px
}

.statement-word {
  display: inline-block
}

.statement-motion .statement-word {
  opacity: var(--word-opacity, .25);
  transition: opacity .12s linear
}

.statement-line {
  height: 1px;
  background: #c3d0af;
  max-width: 220px;
  margin-bottom: 28px;
  overflow: hidden
}

.statement-line i {
  display: block;
  width: 100%;
  height: 100%;
  background: #718a43;
  transform: scaleX(var(--statement-progress, 1));
  transform-origin: left
}

.statement-section .text-link {
  font-size: 11px;
  color: #667d45
}

.cinema-poster {
  transform: scale(var(--cinema-scale, 1));
  transform-origin: center;
  transition: transform .12s linear
}

.cinema-section {
  overflow: hidden
}

.hero-premium .hero-image>img {
  transform: translateY(var(--hero-depth, 0px)) scale(1.045);
  will-change: transform
}

.hero-background-word {
  transform: translateX(var(--hero-word-shift, 0px))
}

.chapter-navigation {
  position: fixed;
  right: 12px;
  top: 50%;
  translate: 0 -50%;
  z-index: 18;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 18px 10px;
  border: 1px solid #d8e1cd;
  background: #f7f7f0e8;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 25px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s
}

.chapter-navigation.shown {
  opacity: 1;
  visibility: visible
}

.chapter-navigation a {
  position: relative;
  width: 10px;
  height: 10px;
  display: grid;
  place-items: center
}

.chapter-navigation a:before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #aebc97;
  transition: scale .25s, background .25s
}

.chapter-navigation a[aria-current=true]:before {
  scale: 1.7;
  background: #5d742d
}

.chapter-navigation a>span {
  position: absolute;
  right: 25px;
  white-space: nowrap;
  font-size: 10px;
  color: #304b31;
  background: #f7f7f0;
  border: 1px solid #d8e1cd;
  padding: 5px 10px;
  opacity: 0;
  translate: 6px 0;
  transition: .2s;
  pointer-events: none
}

.chapter-navigation a:hover>span,
.chapter-navigation a:focus-visible>span {
  opacity: 1;
  translate: 0 0
}

.chapter-navigation a:focus-visible {
  outline: 2px solid #718a43;
  outline-offset: 4px;
  border-radius: 50%
}

@media(max-width:1050px) {
  .team-card-info {
    padding: 35px
  }

  .team-stack .team-card {
    height: 430px
  }

  .team-card-index {
    margin-bottom: 25px
  }

  .chapter-navigation {
    display: none
  }
}

@media(max-width:720px) {
  .team-chapter {
    padding: 65px 0
  }

  .team-stack .team-card {
    grid-template-columns: 1fr;
    height: calc(100svh - var(--mobile-header-height) - var(--mobile-bar-height) - 65px);
    min-height: 455px;
    max-height: 640px;
    grid-template-rows: 52% 48%;
    margin-bottom: 35px
  }

  .motion-stack .team-card {
    margin-bottom: 90px;
    top: calc(var(--stack-top, 86px) + var(--card-peek));
    transform: scale(var(--card-scale, 1))
  }

  .motion-stack .team-card:last-child {
    margin-bottom: 0
  }

  .team-stack .team-card .team-card-portrait img {
    object-position: center 25%
  }

  .team-card-info {
    padding: 23px 25px 22px
  }

  .team-card-index {
    font-size: 7px;
    margin-bottom: 13px
  }

  .team-stack .team-card h3 {
    font-size: 31px;
    margin-bottom: 8px
  }

  .team-card-title {
    font-size: 9px;
    line-height: 1.65
  }

  .team-stack .team-card p {
    font-size: 10px;
    line-height: 1.65;
    margin: 12px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
  }

  .team-card-cta {
    font-size: 9px;
    padding-bottom: 5px;
    gap: 30px;
    margin-top: auto
  }

  .team-card-cta .ui-icon {
    width: 16px;
    height: 16px
  }

  .statement-section {
    padding: 70px 0 60px
  }

  .scroll-statement {
    font-size: clamp(41px, 10.8vw, 58px);
    line-height: 1.2;
    margin: 28px 0 35px
  }

  .statement-section .eyebrow {
    font-size: 8px
  }

  .statement-section .text-link {
    font-size: 10px
  }

  .statement-line {
    max-width: 150px;
    margin-bottom: 22px
  }
}

@media(max-width:720px) and (max-height:660px) {
  .team-stack .team-card {
    min-height: 390px;
    grid-template-rows: 46% 54%
  }

  .team-card-info {
    padding: 16px 20px
  }

  .team-stack .team-card h3 {
    font-size: 26px
  }

  .team-card-index {
    margin-bottom: 9px
  }

  .team-stack .team-card p {
    display: none
  }

  .team-card-cta {
    margin-top: 15px
  }
}

@media(prefers-reduced-motion:reduce) {
  .motion-stack .team-card {
    position: relative;
    top: auto;
    transform: none;
    margin-bottom: 30px
  }

  .statement-motion .statement-word {
    opacity: 1
  }

  .cinema-poster,
  .hero-premium .hero-image>img,
  .hero-background-word {
    transform: none;
    will-change: auto
  }

  .statement-line i {
    transform: none
  }

  .chapter-navigation {
    transition: none
  }
}

@media print {
  .motion-stack .team-card {
    position: relative;
    top: auto;
    transform: none;
    break-inside: avoid;
    margin-bottom: 25px
  }

  .statement-word {
    opacity: 1 !important
  }

  .chapter-navigation {
    display: none
  }

  .cinema-poster {
    transform: none
  }
}

/* Leave room for long names and qualifications at intermediate widths. */
@media(min-width:721px) {
  .team-stack .team-card {
    height: 500px
  }

  .team-card-info {
    padding: 35px 45px
  }

  .team-card-index {
    margin-bottom: 22px
  }

  .team-stack .team-card h3 {
    font-size: clamp(30px, 3.2vw, 46px)
  }

  .team-stack .team-card p {
    font-size: 12px;
    line-height: 1.8;
    margin: 18px 0 20px
  }
}

@media(max-width:720px) {
  .team-stack .team-card p {
    display: none
  }

  .team-card-cta {
    margin-top: auto
  }
}

/* compact-home.css */
/* Compact the homepage without changing its established desktop hero. */
.team-chapter {
  padding: 75px 0
}

.team-stack {
  padding-bottom: 15px
}

.team-stack .team-card {
  height: 410px;
  grid-template-columns: .8fr 1.2fr;
  grid-template-rows: 38px minmax(0, 1fr);
  border: 1px solid #ccd7be;
  border-radius: 10px;
  background: #edf1e4;
  margin-bottom: 25px;
  box-shadow: 0 6px 20px #19303808
}

.team-stack .team-card:nth-child(2) {
  background: #eaf0e9
}

.team-stack .team-card:nth-child(3) {
  background: #f3f4eb
}

.motion-stack .team-card {
  top: calc(var(--stack-top, 106px) + var(--card-peek));
  margin-bottom: 95px;
  transform: scale(var(--card-scale, 1));
  box-shadow: 0 -3px 16px #1930380b
}

.motion-stack .team-card:last-child {
  margin-bottom: 0
}

.team-card-bar {
  grid-column: 1/-1;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  height: 38px;
  padding: 0 23px;
  border-bottom: 1px solid #ccd7be;
  color: #536b43;
  font-size: 10px;
  line-height: 1;
  letter-spacing: .02em;
  background: inherit
}

.team-card-bar small {
  font-size: 8px;
  letter-spacing: .12em;
  color: #849673
}

.team-card-portrait {
  grid-column: 1;
  grid-row: 2;
  height: 100%;
  border-radius: 0 0 0 9px
}

.team-card-info {
  grid-column: 2;
  grid-row: 2;
  padding: 28px 38px;
  justify-content: center
}

.team-card-info .team-card-index {
  display: none
}

.team-stack .team-card h3 {
  font-size: clamp(29px, 3vw, 43px);
  margin-bottom: 12px;
  line-height: 1.1
}

.team-card-title {
  font-size: 10px;
  line-height: 1.7
}

.team-stack .team-card p {
  font-size: 12px;
  line-height: 1.75;
  margin: 16px 0 20px;
  max-width: 420px
}

.team-card-cta {
  font-size: 10px;
  gap: 30px;
  padding-bottom: 6px;
  margin-top: auto
}

.team-stack .team-card .team-card-portrait img {
  object-position: center 25%;
  scale: 1 !important
}

.team-card:hover {
  border-color: #acbe8d
}

.team-stack .team-card:hover h3 {
  color: #193038
}

.reviews-compact {
  padding: 58px 0 45px
}

.reviews-compact .section-head {
  margin-bottom: 24px;
  align-items: center
}

.reviews-compact .section-head h2 {
  font-size: 42px;
  max-width: 700px;
  margin-top: 12px
}

.reviews-compact .section-head .text-link {
  font-size: 11px;
  white-space: nowrap
}

.reviews-compact .review-stage {
  overflow: hidden;
  height: var(--active-review-height, auto);
  transition: height .25s ease
}

.reviews-compact .review-track {
  align-items: flex-start;
  height: 100%
}

.reviews-compact .review-slide {
  height: auto;
  padding: 18px 10% 12px;
  border: 0
}

.reviews-compact .review-slide .quote {
  font-size: 55px;
  line-height: .65
}

.reviews-compact .review-slide blockquote {
  font-size: 24px;
  line-height: 1.65;
  margin: 18px auto 12px;
  max-width: 900px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden
}

.reviews-compact .review-slide.expanded blockquote {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset
}

.reviews-compact .review-slide cite {
  font-size: 9px;
  letter-spacing: .1em
}

.review-expand {
  display: block;
  margin: 0 auto 14px;
  padding: 3px 0;
  border: 0;
  border-bottom: 1px solid #b4c49e;
  background: none;
  color: #69814a;
  font-size: 10px;
  cursor: pointer
}

.review-expand[hidden] {
  display: none
}

.reviews-compact .review-navigation {
  padding-top: 12px;
  gap: 20px
}

.reviews-compact .review-navigation button {
  height: 36px;
  width: 36px
}

.reviews-compact .review-navigation button .ui-icon {
  width: 15px;
  height: 15px
}

.reviews-compact .review-counter {
  font-size: 9px
}

.reviews-compact .partners {
  padding-top: 22px;
  margin-top: 27px;
  gap: 20px
}

.reviews-compact .partners img {
  width: 105px;
  height: 40px
}

@media(max-width:1050px) {
  .team-card-info {
    padding: 25px
  }

  .team-stack .team-card {
    height: 400px
  }

  .team-stack .team-card h3 {
    font-size: 31px
  }

  .team-stack .team-card p {
    font-size: 11px
  }

  .reviews-compact .section-head h2 {
    font-size: 36px
  }
}

@media(max-width:720px) {

  /* One compact composition: portrait and title together, then the actions. */
  .hero-premium {
    padding-top: 20px;
    padding-bottom: 20px
  }

  .hero-premium .hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
    grid-template-rows: auto auto auto auto auto;
    gap: 12px;
    align-items: start;
    min-height: 0
  }

  .hero-premium .hero-copy {
    display: contents
  }

  .hero-copy>.eyebrow {
    grid-column: 1/-1;
    grid-row: 1;
    font-size: 7px;
    letter-spacing: .12em;
    margin: 0 0 1px;
    gap: 8px
  }

  .hero-copy>.eyebrow:before {
    width: 18px
  }

  .hero-premium .hero-copy>h1 {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    font-size: clamp(37px, 10.6vw, 48px);
    line-height: 1.04;
    letter-spacing: -.065em;
    margin: 0;
    padding: 0;
    max-width: 100%;
    overflow-wrap: normal
  }

  .hero-premium .hero-copy>h1 em {
    font-size: .95em;
    line-height: 1.06;
    letter-spacing: -.065em;
    white-space: normal;
    display: inline
  }

  .hero-premium .hero-image {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    height: 230px;
    min-height: 0;
    max-height: none;
    border-radius: 3px;
    margin: 0
  }

  .hero-premium .hero-image>img {
    object-position: center 22%;
    transform: none !important;
    will-change: auto
  }

  .hero-premium .hero-photo-tag,
  .hero-premium .hero-doctor>span,
  .hero-premium .hero-doctor small {
    display: none
  }

  .hero-premium .hero-doctor {
    left: 12px;
    right: 10px;
    bottom: 12px
  }

  .hero-premium .hero-doctor strong {
    font-size: 13px;
    line-height: 1.2;
    letter-spacing: -.025em;
    margin: 0;
    max-width: calc(100% - 26px)
  }

  .hero-premium .hero-doctor>a {
    width: 24px;
    height: 24px;
    right: 0;
    bottom: 0
  }

  .hero-premium .hero-doctor>a .ui-icon {
    width: 13px;
    height: 13px
  }

  .hero-premium .hero-intro {
    grid-column: 1/-1;
    grid-row: 3;
    display: block;
    margin: 2px 0 0;
    padding: 0
  }

  .hero-premium .hero-asterisk {
    display: none
  }

  .hero-premium .hero-intro p {
    font-size: 12px;
    line-height: 1.7;
    max-width: none;
    margin: 0
  }

  .hero-premium .hero-copy>.actions {
    grid-column: 1/-1;
    grid-row: 4;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 2px 0 0;
    flex-wrap: nowrap
  }

  .hero-premium .hero-copy>.actions>.btn {
    flex: 1;
    justify-content: space-between;
    padding: 14px 18px;
    font-size: 11px;
    min-height: 45px;
    gap: 14px
  }

  .hero-premium .hero-services-link {
    padding: 12px 0 12px 8px;
    gap: 10px;
    font-size: 11px;
    white-space: nowrap
  }

  .hero-premium .hero-address {
    grid-column: 1/-1;
    grid-row: 5;
    margin: 0;
    padding: 0;
    font-size: 7px;
    line-height: 1.6;
    gap: 6px;
    color: #7d8b71
  }

  .hero-premium .hero-discover,
  .hero-premium .hero-foot,
  .hero-premium .hero-background-word {
    display: none
  }

  .brand-ribbon {
    padding: 16px 0
  }

  .brand-ribbon span {
    font-size: 17px
  }

  .ribbon-group {
    gap: 24px;
    padding-inline: 12px
  }

  .ribbon-group i .ui-icon {
    width: 18px;
    height: 18px
  }

  .team-chapter {
    padding: 55px 0
  }

  .team-chapter .section-head {
    margin-bottom: 26px
  }

  .team-chapter .section-head h2 {
    font-size: 38px
  }

  .team-stack {
    padding-bottom: 8px
  }

  .team-stack .team-card {
    height: 330px;
    min-height: 0;
    max-height: none;
    grid-template-columns: .43fr .57fr;
    grid-template-rows: 38px minmax(0, 1fr);
    margin-bottom: 22px;
    border-radius: 9px
  }

  .motion-stack .team-card {
    margin-bottom: 65px;
    top: calc(var(--stack-top, 88px) + var(--card-peek))
  }

  .motion-stack .team-card:last-child {
    margin-bottom: 0
  }

  .team-card-bar {
    font-size: 9px;
    padding-inline: 15px
  }

  .team-card-bar small {
    font-size: 7px
  }

  .team-card-portrait {
    grid-column: 1;
    grid-row: 2;
    height: 100%;
    border-radius: 0 0 0 8px
  }

  .team-stack .team-card .team-card-portrait img {
    object-position: center 18%
  }

  .team-card-info {
    grid-column: 2;
    grid-row: 2;
    padding: 22px 16px;
    justify-content: center
  }

  .team-stack .team-card h3 {
    font-size: 25px;
    line-height: 1.1;
    margin-bottom: 14px;
    letter-spacing: -.05em
  }

  .team-card-title {
    font-size: 9px;
    line-height: 1.75
  }

  .team-stack .team-card p {
    display: none
  }

  .team-card-cta {
    font-size: 9px;
    gap: 12px;
    line-height: 1.5;
    padding-bottom: 5px;
    margin-top: 24px
  }

  .team-card-cta .ui-icon {
    width: 14px;
    height: 14px
  }

  .reviews-compact {
    padding: 42px 0 32px
  }

  .reviews-compact .section-head {
    margin-bottom: 22px
  }

  .reviews-compact .section-head h2 {
    font-size: 32px;
    line-height: 1.15;
    margin-top: 12px;
    max-width: 300px
  }

  .reviews-compact .section-head .text-link {
    font-size: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 14px
  }

  .reviews-compact .review-slide {
    padding: 12px 0 8px
  }

  .reviews-compact .review-slide .quote {
    font-size: 45px
  }

  .reviews-compact .review-slide blockquote {
    font-size: 18px;
    line-height: 1.7;
    margin: 15px 0 10px;
    -webkit-line-clamp: 5
  }

  .reviews-compact .review-slide cite {
    font-size: 8px
  }

  .review-expand {
    font-size: 9px;
    margin-bottom: 12px
  }

  .reviews-compact .review-navigation {
    padding-top: 10px
  }

  .reviews-compact .partners {
    padding-top: 20px;
    margin-top: 24px;
    gap: 16px 25px
  }

  .reviews-compact .partners img {
    width: 78px;
    height: 30px
  }
}

@media(max-width:360px) {
  .hero-premium .hero-image {
    height: 210px
  }

  .hero-premium .hero-copy>h1 {
    font-size: 37px
  }

  .hero-premium .hero-intro p {
    font-size: 11px
  }

  .hero-premium .hero-doctor strong {
    font-size: 11px
  }

  .team-stack .team-card h3 {
    font-size: 23px
  }

  .team-card-info {
    padding: 20px 13px
  }
}

@media(max-height:619px) {
  .motion-stack .team-card {
    position: relative;
    top: auto;
    transform: none;
    margin-bottom: 22px
  }
}

@media(prefers-reduced-motion:reduce) {
  .reviews-compact .review-stage {
    transition: none
  }

  .motion-stack .team-card {
    position: relative;
    top: auto;
    transform: none;
    margin-bottom: 25px
  }
}

@media(max-width:720px) and (max-height:680px) {
  .hero-premium {
    padding-top: 16px;
    padding-bottom: 16px
  }

  .hero-premium .hero-grid {
    grid-template-rows: auto auto auto auto;
    gap: 10px
  }

  .hero-premium .hero-image {
    height: 195px
  }

  .hero-premium .hero-copy>h1 {
    font-size: clamp(36px, 10vw, 42px)
  }

  .hero-premium .hero-intro p {
    font-size: 11px;
    line-height: 1.6
  }

  .hero-premium .hero-address {
    display: none
  }
}

/* mobile-treatment.css */
/* Desktop uses the existing treatment explorer unchanged. */
.mobile-treatment-story {
  display: none
}

@media(max-width:720px) {
  .treatment-section .treatment-explorer {
    display: none
  }

  .mobile-treatment-story {
    display: block;
    position: relative;
    color: #193038
  }

  .mobile-treatment-story.is-pinned {
    height: 520svh
  }

  .mobile-treatment-screen {
    position: relative;
    background: #f4f5ed
  }

  .is-pinned .mobile-treatment-screen {
    position: sticky;
    top: calc(var(--mobile-header-height) + 12px);
    height: calc(100svh - var(--mobile-header-height) - var(--mobile-bar-height) - 24px);
    min-height: 390px;
    max-height: 760px;
    overflow: hidden;
    border: 1px solid #d0dac1;
    border-radius: 5px;
    box-shadow: 0 12px 28px #1930380a;
    display: grid;
    grid-template-rows: minmax(0, 1fr) 48px
  }

  .mt-frames {
    position: relative;
    min-height: 0
  }

  .mt-frame {
    margin-bottom: 25px;
    border: 1px solid #d0dac1;
    border-radius: 5px;
    overflow: hidden;
    background: #f7f7f0
  }

  .is-pinned .mt-frame {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    margin: 0;
    border: 0;
    border-radius: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    translate: 0 12px;
    transition: opacity .35s ease, translate .45s ease, visibility .35s
  }

  .is-pinned .mt-frame.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    translate: 0 0
  }

  .mt-image {
    position: relative;
    overflow: hidden;
    height: 240px;
    flex: 0 0 auto;
    background: #e1e8d9
  }

  .is-pinned .mt-image {
    height: 47%;
    min-height: 140px
  }

  .mt-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block
  }

  .is-pinned .mt-image img {
    transform: scale(1.025);
    transition: transform .7s ease
  }

  .is-pinned .mt-frame.active .mt-image img {
    transform: scale(1)
  }

  .mt-photo-label {
    position: absolute;
    left: 16px;
    bottom: 15px;
    background: #f7f7f0ed;
    color: #536b43;
    letter-spacing: .13em;
    font-size: 7px;
    padding: 7px 10px;
    border: 1px solid #ffffff60
  }

  .mt-copy {
    padding: 20px 22px;
    background: #f7f7f0;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 0
  }

  .mt-number {
    font-size: 8px;
    letter-spacing: .16em;
    color: #8b9b72;
    margin-bottom: 9px
  }

  .mt-copy h3 {
    font-family: Manrope, sans-serif;
    font-size: 27px;
    font-weight: 500;
    letter-spacing: -.045em;
    line-height: 1.12;
    margin: 0 0 12px;
    color: #193038;
    max-width: 100%
  }

  .mt-copy p {
    font-size: 12px;
    line-height: 1.7;
    color: #6d7d65;
    margin: 0 0 15px
  }

  .mt-copy>a {
    display: inline-flex;
    align-items: center;
    gap: 30px;
    border-bottom: 1px solid #b9c8a2;
    color: #536d3b;
    padding-bottom: 5px;
    font-size: 10px;
    margin-top: auto;
    line-height: 1.5;
    min-height: 25px
  }

  .mt-copy>a .ui-icon {
    height: 17px;
    width: 17px
  }

  .mt-navigation {
    display: none
  }

  .is-pinned .mt-navigation {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #f7f7f0;
    border-top: 1px solid #e1e7d7;
    padding: 0 15px 5px;
    position: relative;
    z-index: 2
  }

  .mt-steps {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 7px
  }

  .mt-step {
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer
  }

  .mt-step>span {
    height: 2px;
    width: 100%;
    overflow: hidden;
    background: #d5dec8
  }

  .mt-step i {
    display: block;
    height: 100%;
    width: 100%;
    background: #7b924e;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .12s linear
  }

  .mt-step[aria-pressed=true]>span {
    background: #b9c999
  }

  .mt-step:focus-visible {
    outline: 2px solid #7b924e;
    outline-offset: 1px
  }

  .mt-hint {
    font-size: 7px;
    text-align: center;
    letter-spacing: .03em;
    color: #8a9b77;
    line-height: 1
  }

  .treatment-extra {
    margin-top: 28px
  }
}

@media(max-width:720px) and (max-height:700px) {
  .is-pinned .mobile-treatment-screen {
    grid-template-rows: minmax(0, 1fr) 41px;
    min-height: 370px
  }

  .is-pinned .mt-image {
    height: 43%;
    min-height: 125px
  }

  .mt-copy {
    padding: 16px 19px
  }

  .mt-copy h3 {
    font-size: 24px;
    margin-bottom: 9px
  }

  .mt-copy p {
    font-size: 11px;
    line-height: 1.65;
    margin-bottom: 11px
  }

  .mt-number {
    font-size: 7px;
    margin-bottom: 7px
  }

  .mt-copy>a {
    font-size: 9px;
    min-height: 22px;
    padding-bottom: 3px
  }

  .mt-step {
    height: 22px
  }

  .mt-hint {
    font-size: 6px
  }

  .is-pinned .mt-navigation {
    padding-bottom: 4px
  }
}

@media(prefers-reduced-motion:reduce) {
  .mobile-treatment-story.is-pinned {
    height: auto
  }

  .is-pinned .mobile-treatment-screen {
    position: relative;
    top: auto;
    height: auto;
    max-height: none;
    overflow: visible;
    border: 0;
    display: block;
    box-shadow: none
  }

  .is-pinned .mt-frame {
    position: relative;
    opacity: 1;
    visibility: visible;
    translate: none;
    pointer-events: auto;
    margin-bottom: 25px;
    display: block
  }

  .is-pinned .mt-navigation {
    display: none
  }

  .is-pinned .mt-image {
    height: 240px
  }

  .is-pinned .mt-image img {
    transform: none
  }
}

@media print {
  .mobile-treatment-story {
    display: none
  }

  .treatment-section .treatment-explorer {
    display: grid
  }
}

/* horizontal-team.css */
/* One horizontal chapter, driven by normal vertical scrolling. */
.horizontal-team {
  padding: 65px 0;
  background: #f7f7f0;
  position: relative
}

.horizontal-team>.wrap {
  position: relative
}

.horizontal-team.is-horizontal-pinned {
  padding: 0;
  height: 280svh
}

.horizontal-team.is-horizontal-pinned>.wrap {
  position: sticky;
  top: var(--team-pin-top, 106px);
  height: var(--team-screen-height, 640px);
  display: flex;
  flex-direction: column;
  padding-top: 4px;
  padding-bottom: 8px;
  min-height: 0
}

.horizontal-team .section-head {
  flex: 0 0 auto;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 22px
}

.horizontal-team .section-head h2 {
  font-size: 45px;
  line-height: 1.1;
  margin-top: 12px
}

.horizontal-team .section-head .text-link {
  font-size: 11px;
  white-space: nowrap;
  margin: 0;
  padding: 5px 0
}

.team-horizontal-viewport {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  min-height: 0;
  border-radius: 10px;
  outline-offset: 3px
}

.team-horizontal-viewport::-webkit-scrollbar {
  display: none
}

.is-horizontal-pinned .team-horizontal-viewport {
  overflow: hidden;
  flex: 1;
  scroll-snap-type: none;
  touch-action: pan-y
}

.horizontal-team .team-horizontal-track {
  display: flex;
  gap: 24px;
  width: 100%;
  padding: 0;
  position: relative;
  isolation: auto;
  transform: translate3d(var(--team-x, 0px), 0, 0);
  will-change: transform
}

.is-horizontal-pinned .team-horizontal-track {
  height: 100%
}

.horizontal-team .team-stack .team-card {
  position: relative;
  top: auto;
  z-index: auto;
  flex: 0 0 calc(100% - 64px);
  height: 420px;
  max-height: none;
  min-height: 0;
  grid-template-columns: .85fr 1.15fr;
  grid-template-rows: 38px minmax(0, 1fr);
  transform: none;
  translate: none;
  opacity: 1;
  visibility: visible;
  scroll-snap-align: start;
  margin: 0 !important;
  box-shadow: none;
  border-radius: 10px;
  overflow: hidden
}

.horizontal-team.is-horizontal-pinned .team-stack .team-card {
  height: 100%
}

.horizontal-team .team-card-portrait {
  grid-column: 1;
  grid-row: 2;
  height: 100%
}

.horizontal-team .team-card-info {
  grid-column: 2;
  grid-row: 2;
  padding: 28px 38px
}

.horizontal-team .team-card-bar {
  font-size: 10px
}

.horizontal-team .team-stack .team-card h3 {
  font-size: clamp(30px, 3.2vw, 45px)
}

.horizontal-team .team-card-title {
  font-size: 11px
}

.horizontal-team .team-card-cta {
  margin-top: auto
}

.horizontal-team .team-stack .team-card p {
  font-size: 12px;
  line-height: 1.75;
  max-width: 390px;
  margin: 16px 0 20px
}

.team-horizontal-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex: 0 0 42px;
  margin-top: 13px
}

.team-scroll-note {
  font-size: 9px;
  color: #889973;
  letter-spacing: .02em
}

.team-horizontal-controls>div {
  display: flex;
  align-items: center;
  gap: 15px
}

.team-horizontal-controls button {
  width: 32px;
  height: 32px;
  border: 1px solid #cad7b8;
  background: none;
  border-radius: 50%;
  color: #4c6840;
  padding: 0;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .2s, color .2s
}

.team-horizontal-controls button .ui-icon {
  width: 15px;
  height: 15px
}

.team-horizontal-controls button:hover:enabled {
  background: #193038;
  color: #f7f7f0;
  border-color: #193038
}

.team-horizontal-controls button:disabled {
  opacity: .35;
  cursor: default
}

.team-scroll-count {
  font-size: 9px;
  letter-spacing: .1em;
  color: #7b8e63;
  min-width: 48px;
  text-align: center
}

@media(max-width:1000px) {
  .horizontal-team .team-card-info {
    padding: 25px
  }

  .horizontal-team .team-stack .team-card h3 {
    font-size: 32px
  }

  .horizontal-team .team-stack .team-card p {
    font-size: 11px
  }

  .horizontal-team .section-head h2 {
    font-size: 39px
  }
}

@media(max-width:720px) {
  .horizontal-team {
    padding: 45px 0
  }

  .horizontal-team.is-horizontal-pinned {
    height: 270svh;
    padding: 0
  }

  .horizontal-team.is-horizontal-pinned>.wrap {
    padding-top: 2px;
    padding-bottom: 3px
  }

  .horizontal-team .section-head {
    gap: 12px;
    margin-bottom: 17px;
    align-items: end
  }

  .horizontal-team .section-head h2 {
    font-size: 30px;
    line-height: 1.1;
    margin-top: 10px
  }

  .horizontal-team .section-head .eyebrow {
    font-size: 7px;
    letter-spacing: .12em;
    gap: 8px
  }

  .horizontal-team .section-head .text-link {
    font-size: 9px;
    margin: 0;
    padding-bottom: 3px;
    white-space: nowrap
  }

  .horizontal-team .section-head .text-link .ui-icon {
    width: 12px;
    height: 12px;
    margin-left: 2px
  }

  .horizontal-team .team-horizontal-track {
    gap: 12px
  }

  .horizontal-team .team-stack .team-card {
    flex-basis: calc(100% - 20px);
    height: 450px;
    grid-template-columns: 1fr;
    grid-template-rows: 34px minmax(0, 1fr) auto
  }

  .horizontal-team .team-card-bar {
    height: 34px;
    padding: 0 15px;
    font-size: 8px
  }

  .horizontal-team .team-card-bar small {
    font-size: 7px
  }

  .horizontal-team .team-card-portrait {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
    height: 100%;
    border-radius: 0
  }

  .horizontal-team .team-stack .team-card .team-card-portrait img {
    height: 100%;
    object-position: center 23%
  }

  .horizontal-team .team-card-info {
    grid-column: 1;
    grid-row: 3;
    padding: 16px 20px 18px;
    display: flex;
    flex-direction: column;
    justify-content: start
  }

  .horizontal-team .team-stack .team-card h3 {
    font-size: 26px;
    line-height: 1.08;
    margin: 0 0 9px;
    max-width: 100%
  }

  .horizontal-team .team-card-title {
    font-size: 9px;
    line-height: 1.6;
    max-width: 100%
  }

  .horizontal-team .team-stack .team-card p {
    display: none
  }

  .horizontal-team .team-card-cta {
    margin-top: 13px;
    font-size: 9px;
    gap: 24px;
    min-height: 19px;
    padding-bottom: 4px
  }

  .team-horizontal-controls {
    flex-basis: 34px;
    margin-top: 10px;
    gap: 10px
  }

  .team-horizontal-controls>div {
    gap: 9px
  }

  .team-horizontal-controls button {
    width: 29px;
    height: 29px
  }

  .team-horizontal-controls button .ui-icon {
    width: 13px;
    height: 13px
  }

  .team-scroll-count {
    font-size: 8px;
    min-width: 40px
  }

  .team-scroll-note {
    font-size: 7px;
    max-width: 160px;
    line-height: 1.5
  }
}

@media(max-width:720px) and (max-height:700px) {
  .horizontal-team .section-head {
    margin-bottom: 12px
  }

  .horizontal-team .section-head h2 {
    font-size: 27px
  }

  .horizontal-team .team-card-info {
    padding: 13px 17px 14px
  }

  .horizontal-team .team-stack .team-card h3 {
    font-size: 23px;
    margin-bottom: 7px
  }

  .horizontal-team .team-card-title {
    font-size: 8px
  }

  .horizontal-team .team-card-cta {
    margin-top: 10px;
    font-size: 8px
  }

  .horizontal-team .team-card-bar {
    height: 30px;
    font-size: 7px
  }

  .horizontal-team .team-stack .team-card {
    grid-template-rows: 30px minmax(0, 1fr) auto
  }
}

@media(prefers-reduced-motion:reduce) {
  .horizontal-team.is-horizontal-pinned {
    height: auto;
    padding: 45px 0
  }

  .horizontal-team.is-horizontal-pinned>.wrap {
    position: relative;
    top: auto;
    height: auto
  }

  .is-horizontal-pinned .team-horizontal-viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory
  }

  .horizontal-team .team-horizontal-track {
    transform: none;
    will-change: auto
  }

  .horizontal-team .team-stack .team-card {
    height: 420px;
    flex-basis: 100%
  }
}

@media print {
  .horizontal-team.is-horizontal-pinned {
    height: auto
  }

  .horizontal-team.is-horizontal-pinned>.wrap {
    position: relative;
    top: auto;
    height: auto
  }

  .horizontal-team .team-horizontal-viewport {
    overflow: visible
  }

  .horizontal-team .team-horizontal-track {
    display: block;
    transform: none
  }

  .horizontal-team .team-stack .team-card {
    height: 400px;
    margin-bottom: 20px !important
  }

  .team-horizontal-controls {
    display: none
  }
}

/* team-portraits.css */
/* Each portrait occupies one complete stage, with unclipped photography. */
.portrait-chapter {
  background: #f7f7f0;
  padding: 65px 0;
  position: relative
}

.portrait-chapter.is-horizontal-pinned {
  height: var(--team-runway, 400svh);
  padding: 0
}

.portrait-chapter.is-horizontal-pinned>.wrap {
  padding-top: 8px;
  padding-bottom: 0
}

.portrait-chapter .section-head {
  margin: 0 0 22px;
  gap: 20px;
  align-items: center
}

.portrait-chapter .section-head h2 {
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.05em;
  margin: 8px 0 0
}

.portrait-chapter .section-head h2 em {
  font-family: Georgia, serif;
  font-weight: 400;
  color: #758843
}

.portrait-chapter .section-head .eyebrow {
  font-size: 8px;
  letter-spacing: .15em
}

.portrait-introduction {
  max-width: 260px
}

.portrait-introduction>p {
  display: none
}

.portrait-chapter .section-head .text-link {
  font-size: 11px
}

.portrait-chapter .team-horizontal-viewport {
  border-radius: 0
}

.portrait-chapter .portrait-track {
  gap: 0;
  align-items: stretch
}

.portrait-chapter .team-portrait {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: stretch;
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  height: 620px;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  position: relative;
  color: #193038;
  text-decoration: none;
  opacity: 1;
  translate: none
}

.portrait-chapter.is-horizontal-pinned .team-portrait {
  height: 100%
}

.portrait-photo {
  position: relative;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: #e7e9e1
}

.portrait-chapter .team-portrait .portrait-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  border-radius: 0;
  transform: none;
  filter: none
}

.portrait-chapter .team-portrait:hover .portrait-photo img {
  transform: none;
  filter: none;
  border-radius: 0
}

.portrait-caption {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0;
  padding: 30px clamp(28px, 5vw, 90px)
}

.portrait-index {
  font-size: 10px;
  letter-spacing: .16em;
  color: #7d8b6b;
  margin-bottom: 30px
}

.portrait-chapter .team-portrait h3 {
  font-family: Manrope, sans-serif;
  font-size: clamp(32px, 3.8vw, 58px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.055em;
  margin: 0 0 20px;
  color: #193038
}

.portrait-chapter .team-portrait p {
  font-weight: 400;
  letter-spacing: 0;
  margin: 0
}

.portrait-chapter .team-portrait .portrait-specialty {
  font-size: 12px;
  line-height: 1.65;
  color: #718052
}

.portrait-chapter .team-portrait .portrait-bio {
  font-size: 14px;
  line-height: 1.85;
  color: #6c7871;
  margin: 25px 0 0;
  max-width: 380px
}

.portrait-cta {
  display: flex;
  align-items: center;
  gap: 25px;
  font-size: 11px;
  margin-top: 32px;
  border-bottom: 1px solid #cbd4bd;
  padding-bottom: 10px
}

.portrait-open {
  position: static;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  border-radius: 0;
  color: #60773f
}

.portrait-open .ui-icon {
  width: 19px;
  height: 19px
}

.portrait-chapter .team-horizontal-controls {
  flex: 0 0 46px;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #dbe2d0
}

.portrait-chapter .team-scroll-note {
  font-size: 10px;
  color: #7c8a70
}

.portrait-chapter .team-horizontal-controls button {
  width: 32px;
  height: 32px;
  background: none;
  border-color: #d5dfc6
}

.portrait-chapter .team-horizontal-controls button:hover:enabled {
  background: #193038;
  border-color: #193038
}

.portrait-chapter .team-scroll-count {
  font-size: 9px;
  color: #7c8e68
}

@media(max-width:720px) {
  .portrait-chapter {
    padding: 45px 0
  }

  .portrait-chapter.is-horizontal-pinned {
    padding: 0
  }

  .portrait-chapter .section-head {
    margin-bottom: 15px;
    display: block
  }

  .portrait-chapter .section-head h2 {
    font-size: 28px;
    margin-top: 6px
  }

  .portrait-chapter .section-head .eyebrow {
    font-size: 7px
  }

  .portrait-introduction {
    display: none
  }

  .portrait-chapter .team-portrait {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) auto;
    height: 650px
  }

  .portrait-chapter .portrait-photo {
    width: 100%;
    min-height: 0
  }

  .portrait-caption {
    padding: 16px 0 0;
    display: block
  }

  .portrait-index {
    display: none
  }

  .portrait-chapter .team-portrait h3 {
    font-size: 27px;
    margin: 0 0 7px;
    line-height: 1.08
  }

  .portrait-chapter .team-portrait .portrait-specialty {
    font-size: 10px;
    line-height: 1.5
  }

  .portrait-chapter .team-portrait .portrait-specialty br {
    display: none
  }

  .portrait-chapter .team-portrait .portrait-bio {
    font-size: 11px;
    line-height: 1.6;
    margin: 10px 0 0;
    max-width: 100%
  }

  .portrait-cta {
    display: inline-flex;
    gap: 18px;
    font-size: 10px;
    margin-top: 10px;
    padding-bottom: 5px
  }

  .portrait-open,
  .portrait-open .ui-icon {
    width: 16px;
    height: 16px
  }

  .portrait-chapter .team-horizontal-controls {
    flex-basis: 38px;
    margin-top: 10px;
    padding-top: 7px;
    gap: 10px
  }

  .portrait-chapter .team-scroll-note {
    font-size: 8px;
    max-width: 170px
  }

  .portrait-chapter .team-horizontal-controls>div {
    gap: 8px
  }

  .portrait-chapter .team-horizontal-controls button {
    width: 28px;
    height: 28px
  }
}

@media(max-width:720px) and (max-height:720px) {
  .portrait-chapter .section-head {
    margin-bottom: 10px
  }

  .portrait-chapter .section-head h2 {
    font-size: 24px
  }

  .portrait-caption {
    padding-top: 12px
  }

  .portrait-chapter .team-portrait h3 {
    font-size: 23px
  }

  .portrait-chapter .team-portrait .portrait-bio {
    font-size: 10px;
    line-height: 1.5;
    margin-top: 7px
  }

  .portrait-cta {
    margin-top: 7px
  }
}

@media(prefers-reduced-motion:reduce) {
  .portrait-chapter .portrait-track {
    transform: none;
    will-change: auto
  }
}

@media print {
  .portrait-chapter.is-horizontal-pinned {
    height: auto;
    padding: 40px 0
  }

  .portrait-chapter .portrait-track {
    display: block;
    transform: none
  }

  .portrait-chapter .team-portrait {
    height: 500px;
    break-inside: avoid;
    margin-bottom: 30px
  }

  .portrait-chapter .team-horizontal-controls {
    display: none
  }
}

/* photo-refresh.css */
/* Selected photographs remain faithful to the original composition. */
.hero-premium .hero-image>img {
  object-position: center 20%
}

.founder-photo>img {
  object-position: center 18%
}

.smile-results {
  background: #193038;
  color: #f7f7f0;
  padding: 90px 0
}

.smile-results-grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr);
  align-items: center;
  gap: clamp(35px, 5vw, 80px)
}

.smile-results .eyebrow {
  color: #bacb91;
  font-size: 9px
}

.smile-results h2 {
  font-size: clamp(38px, 4vw, 58px);
  line-height: 1.08;
  letter-spacing: -.05em;
  margin: 25px 0
}

.smile-results h2 em {
  font-family: Georgia, serif;
  font-weight: 400;
  color: #c4d69b
}

.smile-results-copy>p {
  font-size: 14px;
  line-height: 1.8;
  color: #c3cdc4;
  max-width: 310px
}

.smile-demo-badge {
  display: inline-block;
  font-size: 8px;
  letter-spacing: .12em;
  padding: 7px 10px;
  border: 1px solid #789078;
  margin-top: 22px;
  color: #d2dfba
}

.smile-results-copy>.smile-demo-note {
  font-size: 11px;
  line-height: 1.7;
  color: #aebcb1;
  margin: 12px 0 25px
}

.smile-results .text-link {
  font-size: 11px;
  color: #e4edcf;
  border-color: #647963;
  display: inline-flex;
  gap: 20px;
  align-items: center
}

.smile-results .text-link .ui-icon {
  width: 17px;
  height: 17px
}

.smile-figure {
  margin: 0;
  min-width: 0
}

.smile-compare {
  position: relative;
  aspect-ratio: 1.15;
  isolation: isolate;
  overflow: hidden;
  background: #c9997c;
  border-radius: 4px;
  user-select: none;
  -webkit-user-select: none
}

.smile-compare>img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  max-width: none;
  pointer-events: none
}

.smile-before {
  clip-path: inset(0 calc(100% - var(--reveal)) 0 0);
  z-index: 1
}

.smile-label {
  position: absolute;
  top: 18px;
  z-index: 2;
  font-size: 9px;
  letter-spacing: .12em;
  padding: 8px 12px;
  border-radius: 2px;
  background: #193038bb;
  color: #fff;
  pointer-events: none
}

.smile-label-before {
  left: 18px
}

.smile-label-after {
  right: 18px
}

.smile-divider {
  position: absolute;
  z-index: 3;
  left: var(--reveal);
  top: 0;
  height: 100%;
  width: 2px;
  transform: translateX(-50%);
  background: #f7f7f0;
  pointer-events: none;
  box-shadow: 0 0 12px #19303833
}

.smile-divider>span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #f7f7f0;
  color: #193038;
  box-shadow: 0 3px 20px #19303833
}

.smile-divider svg {
  width: 30px;
  height: 24px
}

.smile-range {
  position: absolute;
  inset: 0 0 0 -25px;
  z-index: 4;
  width: calc(100% + 50px);
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: ew-resize;
  appearance: none;
  -webkit-appearance: none;
  touch-action: pan-y;
  background: transparent
}

.smile-range::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  width: 50px;
  height: 50px
}

.smile-range::-moz-range-thumb {
  width: 50px;
  height: 50px;
  border: 0
}

.smile-compare:focus-within {
  outline: 3px solid #c4d69b;
  outline-offset: 5px
}

.smile-figure figcaption {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-top: 16px;
  font-size: 9px;
  color: #c3cdc4
}

.smile-figure figcaption>div {
  display: flex;
  align-items: center;
  gap: 10px
}

.smile-figure button {
  border: 0;
  background: none;
  padding: 6px 0;
  color: #d5e4b7;
  font-size: 9px;
  cursor: pointer;
  border-bottom: 1px solid #687e60
}

.smile-figure button:hover {
  color: #fff
}

.smile-figure figcaption>span {
  letter-spacing: .02em
}

@media(max-width:720px) {
  .smile-results {
    padding: 50px 0
  }

  .smile-results-grid {
    grid-template-columns: 1fr;
    gap: 28px
  }

  .smile-results h2 {
    font-size: 38px;
    margin: 18px 0
  }

  .smile-results-copy>p {
    max-width: 100%;
    font-size: 12px
  }

  .smile-demo-badge {
    margin-top: 10px
  }

  .smile-results-copy>.smile-demo-note {
    font-size: 10px;
    margin-bottom: 18px;
    max-width: 360px
  }

  .smile-compare {
    aspect-ratio: 1.1
  }

  .smile-label {
    font-size: 8px;
    top: 12px;
    padding: 6px 9px
  }

  .smile-label-before {
    left: 12px
  }

  .smile-label-after {
    right: 12px
  }

  .smile-divider>span {
    width: 44px;
    height: 44px
  }

  .smile-figure figcaption {
    font-size: 8px;
    flex-wrap: wrap
  }

  .smile-figure button {
    font-size: 8px;
    min-height: 32px
  }
}

.hero-premium .hero-image>img {
  object-position: center top;
  transform: none !important
}


/* Loaded AFTER main.css/home.css. Every new rule is scoped to this section. */
.smile-results.smile-results--real {
  --sr-bg: #193038;
  --sr-paper: #f7f7f0;
  --sr-green: #c4d69b;
  --sr-muted: #becac4;
  --sr-line: #ffffff24;
  background: var(--sr-bg);
  color: var(--sr-paper);
  padding: clamp(54px, 6.7vw, 100px) 0;
  position: relative;
  isolation: isolate;
  font-family: inherit
}

.smile-results--real *,
.smile-results--real *::before,
.smile-results--real *::after {
  box-sizing: border-box
}

.smile-results--real [hidden] {
  display: none !important
}

.smile-results--real .sr-wrap {
  width: min(1360px, calc(100% - 96px));
  margin: 0 auto
}

.smile-results--real .sr-layout {
  display: grid;
  grid-template-columns: minmax(240px, .72fr) minmax(0, 1.5fr);
  gap: clamp(35px, 5.5vw, 88px);
  align-items: start
}

.smile-results--real .sr-copy {
  padding-top: 12px
}

.smile-results--real .sr-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--sr-green);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .17em;
  line-height: 1.5;
  margin: 0 0 25px;
  text-transform: uppercase
}

.smile-results--real .sr-eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: currentColor
}

.smile-results--real .sr-title {
  font-family: inherit;
  color: var(--sr-paper);
  font-size: clamp(40px, 4.4vw, 64px);
  font-weight: 400;
  line-height: 1.07;
  letter-spacing: -.055em;
  margin: 0 0 24px
}

.smile-results--real .sr-title em {
  font-family: Georgia, serif;
  font-weight: 400;
  font-style: italic;
  color: var(--sr-green);
  letter-spacing: -.055em
}

.smile-results--real .sr-lead {
  font-size: 14px;
  line-height: 1.9;
  color: var(--sr-muted);
  max-width: 335px;
  margin: 0 0 27px
}

.smile-results--real .sr-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  color: var(--sr-paper);
  font-size: 12px;
  line-height: 1.7;
  text-decoration: none;
  padding: 0 0 11px;
  border-bottom: 1px solid #b9cc9290;
  transition: color .2s
}

.smile-results--real .sr-link:hover {
  color: var(--sr-green)
}

.smile-results--real svg {
  display: block;
  width: 20px;
  height: 20px;
  flex: none
}

.smile-results--real .sr-copy-note {
  margin: 28px 0 0;
  padding-top: 19px;
  border-top: 1px solid var(--sr-line);
  font-size: 11px;
  line-height: 1.85;
  color: var(--sr-muted);
  max-width: 320px
}

.smile-results--real .sr-viewer {
  min-width: 0
}

.smile-results--real .sr-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 15px;
  min-height: 36px
}

.smile-results--real .sr-current {
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 12px;
  letter-spacing: .01em
}

.smile-results--real .sr-current i {
  width: 6px;
  height: 6px;
  background: var(--sr-green);
  border-radius: 50%;
  flex: none
}

.smile-results--real .sr-nav {
  display: flex;
  align-items: center;
  gap: 7px
}

.smile-results--real .sr-counter {
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  letter-spacing: .12em;
  color: var(--sr-muted);
  margin-right: 10px
}

.smile-results--real .sr-icon-btn {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  background: transparent;
  color: var(--sr-paper);
  border: 1px solid var(--sr-line);
  border-radius: 50%;
  padding: 0;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
  font: inherit
}

.smile-results--real .sr-icon-btn:hover {
  background: var(--sr-green);
  color: var(--sr-bg);
  border-color: var(--sr-green)
}

.smile-results--real .sr-icon-btn svg {
  width: 16px;
  height: 16px
}

.smile-results--real .sr-panel {
  margin: 0;
  min-width: 0
}

.smile-results--real .sr-stage {
  position: relative;
  aspect-ratio: 1.65;
  overflow: hidden;
  border-radius: 3px;
  background: #10242b;
  isolation: isolate;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
  --sr-reveal: 50%
}

.smile-results--real .sr-stage>img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  display: block;
  object-fit: cover;
  object-position: var(--sr-focus, 50% 50%);
  pointer-events: none;
  -webkit-user-drag: none
}

.smile-results--real .sr-before {
  clip-path: inset(0 calc(100% - var(--sr-reveal)) 0 0);
  z-index: 1
}

.smile-results--real .sr-tag {
  position: absolute;
  top: 18px;
  z-index: 2;
  background: #193038cf;
  color: #fff;
  border: 1px solid #ffffff25;
  border-radius: 2px;
  padding: 7px 11px;
  font-size: 9px;
  line-height: 1.3;
  letter-spacing: .14em;
  pointer-events: none
}

.smile-results--real .sr-tag--before {
  left: 18px
}

.smile-results--real .sr-tag--after {
  right: 18px
}

.smile-results--real .sr-divider {
  position: absolute;
  z-index: 3;
  inset: 0 auto 0 var(--sr-reveal);
  width: 1px;
  background: #fff;
  transform: translateX(-50%);
  box-shadow: 0 0 12px #19303833;
  pointer-events: none
}

.smile-results--real .sr-grip {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--sr-paper);
  color: var(--sr-bg);
  box-shadow: 0 3px 20px #0003
}

.smile-results--real .sr-grip svg {
  width: 26px;
  height: 22px
}

.smile-results--real .sr-range {
  position: absolute;
  z-index: 4;
  inset: 0 auto 0 -23px;
  width: calc(100% + 46px);
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  appearance: none;
  -webkit-appearance: none;
  touch-action: pan-y;
  background: transparent;
  cursor: ew-resize;
  border: 0
}

.smile-results--real .sr-range::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  width: 46px;
  height: 46px;
  background: transparent;
  border: 0
}

.smile-results--real .sr-range::-moz-range-thumb {
  width: 46px;
  height: 46px;
  background: transparent;
  border: 0
}

.smile-results--real .sr-stage:focus-within {
  outline: 2px solid var(--sr-green);
  outline-offset: 4px
}

.smile-results--real .sr-caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 14px 0 18px;
  color: var(--sr-muted);
  font-size: 10px;
  line-height: 1.6
}

.smile-results--real .sr-help {
  display: flex;
  gap: 8px;
  align-items: center
}

.smile-results--real .sr-help svg {
  width: 15px;
  height: 15px;
  color: var(--sr-green)
}

.smile-results--real .sr-actions {
  display: flex;
  align-items: center;
  gap: 16px
}

.smile-results--real .sr-text-btn {
  font: inherit;
  font-size: 10px;
  color: var(--sr-muted);
  padding: 3px 0;
  border: 0;
  border-bottom: 1px solid transparent;
  background: none;
  cursor: pointer;
  text-decoration: none;
  line-height: 1.6;
  display: inline-flex;
  gap: 7px;
  align-items: center
}

.smile-results--real .sr-text-btn:hover {
  color: var(--sr-paper);
  border-bottom-color: var(--sr-green)
}

.smile-results--real .sr-text-btn svg {
  width: 13px;
  height: 13px
}

.smile-results--real .sr-picker {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid var(--sr-line)
}

.smile-results--real .sr-choice {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 5px 5px 9px;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  color: var(--sr-muted);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .2s, border-color .2s, color .2s
}

.smile-results--real .sr-choice[aria-pressed="true"] {
  border-color: #c4d69ba6;
  background: #ffffff08;
  color: var(--sr-paper)
}

.smile-results--real .sr-choice:hover {
  background: #ffffff0c;
  color: var(--sr-paper)
}

.smile-results--real .sr-thumb {
  display: block;
  position: relative;
  aspect-ratio: 1.9;
  overflow: hidden;
  border-radius: 1px;
  margin-bottom: 9px;
  background: #10242b
}

.smile-results--real .sr-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
  opacity: .7;
  transition: opacity .2s
}

.smile-results--real .sr-choice[aria-pressed="true"] .sr-thumb img,
.smile-results--real .sr-choice:hover .sr-thumb img {
  opacity: 1
}

.smile-results--real .sr-choice-label {
  display: flex;
  justify-content: space-between;
  gap: 5px;
  align-items: center;
  font-size: 10px;
  line-height: 1.5;
  padding: 0 3px
}

.smile-results--real .sr-choice-label svg {
  width: 13px;
  height: 13px;
  opacity: 0;
  color: var(--sr-green)
}

.smile-results--real .sr-choice[aria-pressed="true"] .sr-choice-label svg {
  opacity: 1
}

.smile-results--real .sr-note {
  margin: 18px 0 0;
  color: #aabbb3;
  font-size: 10px;
  line-height: 1.75;
  max-width: 740px
}

.smile-results--real button:focus-visible,
.smile-results--real a:focus-visible {
  outline: 2px solid var(--sr-green);
  outline-offset: 4px
}

.smile-results--real .sr-dialog {
  width: min(1180px, calc(100vw - 40px));
  max-width: none;
  max-height: 90dvh;
  padding: 24px;
  border: 1px solid #c4d69b40;
  border-radius: 6px;
  background: var(--sr-bg);
  color: var(--sr-paper);
  overflow: auto;
  overscroll-behavior: contain
}

.smile-results--real .sr-dialog::backdrop {
  background: #09181ee8;
  backdrop-filter: blur(5px)
}

.smile-results--real .sr-dialog-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 24px
}

.smile-results--real .sr-dialog h3 {
  font-family: inherit;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -.02em;
  margin: 0
}

.smile-results--real .sr-dialog-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px
}

.smile-results--real .sr-dialog figure {
  margin: 0
}

.smile-results--real .sr-dialog figcaption {
  font-size: 10px;
  letter-spacing: .14em;
  color: var(--sr-green);
  margin-bottom: 12px
}

.smile-results--real .sr-dialog img {
  width: 100%;
  height: auto;
  max-height: 64dvh;
  display: block;
  object-fit: contain;
  background: #10242b
}

@media(min-width:1500px) {
  .smile-results--real .sr-stage {
    aspect-ratio: 1.72
  }
}

@media(max-width:1050px) {
  .smile-results--real .sr-wrap {
    width: calc(100% - 56px)
  }

  .smile-results--real .sr-layout {
    grid-template-columns: minmax(220px, .75fr) minmax(0, 1.25fr);
    gap: 32px
  }

  .smile-results--real .sr-title {
    font-size: 44px
  }

  .smile-results--real .sr-actions {
    gap: 12px
  }

  .smile-results--real .sr-caption {
    align-items: flex-start
  }

  .smile-results--real .sr-actions {
    flex-wrap: wrap
  }
}

@media(max-width:760px) {
  .smile-results--real .sr-wrap {
    width: calc(100% - 40px)
  }

  .smile-results--real .sr-layout {
    grid-template-columns: 1fr;
    gap: 30px
  }

  .smile-results--real .sr-copy {
    padding-top: 0
  }

  .smile-results--real .sr-eyebrow {
    font-size: 9px;
    margin-bottom: 18px
  }

  .smile-results--real .sr-title {
    font-size: clamp(38px, 10.7vw, 56px);
    line-height: 1.05;
    margin: 0 0 18px
  }

  .smile-results--real .sr-lead {
    max-width: 500px;
    font-size: 13px;
    line-height: 1.85;
    margin-bottom: 18px
  }

  .smile-results--real .sr-link {
    font-size: 11px;
    padding-bottom: 9px
  }

  .smile-results--real .sr-copy-note {
    display: none
  }

  .smile-results--real .sr-stage {
    aspect-ratio: 1.5
  }

  .smile-results--real .sr-tag {
    top: 12px;
    padding: 6px 9px;
    font-size: 8px
  }

  .smile-results--real .sr-tag--before {
    left: 12px
  }

  .smile-results--real .sr-tag--after {
    right: 12px
  }

  .smile-results--real .sr-toolbar {
    margin-bottom: 12px
  }

  .smile-results--real .sr-caption {
    gap: 8px;
    padding: 12px 0 16px
  }

  .smile-results--real .sr-help {
    width: 100%;
    font-size: 9px
  }

  .smile-results--real .sr-actions {
    width: 100%;
    justify-content: space-between;
    gap: 10px
  }

  .smile-results--real .sr-text-btn {
    font-size: 10px;
    min-height: 32px
  }

  .smile-results--real .sr-picker {
    gap: 6px;
    padding-top: 14px
  }

  .smile-results--real .sr-choice {
    padding: 4px 4px 7px
  }

  .smile-results--real .sr-thumb {
    aspect-ratio: 1.3;
    margin-bottom: 7px
  }

  .smile-results--real .sr-choice-label {
    font-size: 9px;
    padding: 0
  }

  .smile-results--real .sr-choice-label svg {
    width: 10px;
    height: 10px
  }

  .smile-results--real .sr-note {
    font-size: 10px;
    margin-top: 15px
  }

  .smile-results--real .sr-dialog {
    width: calc(100vw - 20px);
    padding: 18px;
    max-height: 92dvh
  }

  .smile-results--real .sr-dialog-pair {
    grid-template-columns: 1fr;
    gap: 24px
  }

  .smile-results--real .sr-dialog img {
    max-height: none
  }

  .smile-results--real .sr-dialog h3 {
    font-size: 17px
  }
}

@media(prefers-reduced-motion:reduce) {
  .smile-results--real * {
    transition: none !important;
    scroll-behavior: auto !important
  }
}




/* FORM */

.form .field-error {
  display: block;
  margin-top: 6px;
  color: #b42318;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 400;
}

.form .field-error:empty {
  display: none;
}

.form input.is-invalid,
.form textarea.is-invalid {
  border-color: #b42318;
  box-shadow: 0 0 0 1px #b42318;
}

.form input.is-invalid:focus,
.form textarea.is-invalid:focus {
  outline: 2px solid rgb(180 35 24 / 18%);
  outline-offset: 2px;
}