/* style.css */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
  --ink:#152c30;
  --teal:#247f83;
  --pale:#eff6f4;
  --cream:#faf9f5;
  --line:#dce5e1
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'DM Sans',sans-serif;
  line-height:1.7
}
h1,h2,h3 {
  font-family:Manrope,sans-serif;
  font-weight:500;
  line-height:1.12;
  letter-spacing:-.045em
}
h1 {
  font-size:clamp(48px,6.8vw,104px);
  margin:20px 0 30px
}
h2 {
  font-size:clamp(36px,4.3vw,66px);
  margin:14px 0 28px
}
h3 {
  font-size:25px
}
p {
  color:#5a6b6d
}
a {
  color:inherit;
  text-decoration:none
}
button,input,textarea {
  font:inherit
}
button,a,input,textarea {
  outline-offset:5px
}
button {
  cursor:pointer
}
img {
  max-width:100%;
  display:block
}
section {
  padding:100px 0
}
.wrap {
  max-width:1330px;
  margin:auto;
  padding:0 48px
}
.eyebrow {
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.23em;
  font-weight:700;
  color:var(--teal);
  display:flex;
  align-items:center;
  gap:12px
}
.eyebrow:before {
  content:'';
  width:26px;
  height:1px;
  background:currentColor
}
.topbar {
  background:var(--ink);
  color:#e1eae6;
  font-size:11px;
  letter-spacing:.035em;
  padding:9px 0
}
.topbar .wrap {
  display:flex;
  justify-content:space-between
}
.header {
  position:sticky;
  top:0;
  background:#faf9f5f5;
  backdrop-filter:blur(16px);
  z-index:20;
  border-bottom:1px solid var(--line)
}
.nav {
  height:92px;
  display:flex;
  align-items:center;
  gap:32px
}
.logo {
  width:170px;
  margin-right:auto
}
.logo img {
  max-height:66px;
  object-fit:contain
}
.navlinks {
  display:flex;
  gap:26px;
  align-items:center;
  font-size:13px
}
.navlinks a:hover {
  color:var(--teal)
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:26px;
  padding:16px 24px;
  background:var(--teal);
  color:white;
  border:1px solid var(--teal);
  border-radius:4px;
  font-size:13px;
  font-weight:600;
  transition:.25s
}
.btn:hover {
  background:var(--ink);
  transform:translateY(-2px)
}
.btn.light {
  background:transparent;
  color:var(--ink);
  border-color:#cbd6d2
}
.btn.white {
  background:white;
  color:var(--ink);
  border-color:white
}
.arrow {
  font-size:20px
}
.menu-toggle {
  display:none;
  border:0;
  background:transparent;
  font-size:24px
}
.hero {
  padding:54px 0 0;
  overflow:hidden
}
.hero-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  align-items:center
}
.hero-copy {
  padding:24px 0 50px
}
.hero h1 em {
  font-family:Georgia,serif;
  font-weight:400;
  color:var(--teal)
}
.hero-copy p {
  max-width:430px;
  font-size:15px
}
.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:32px
}
.hero-image {
  height:650px;
  position:relative;
  background:#dbe6e2;
  border-radius:180px 180px 5px 5px;
  overflow:hidden
}
.hero-image>img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 25%
}
.photo-label {
  position:absolute;
  bottom:28px;
  left:28px;
  right:28px;
  background:#fffef6ed;
  padding:18px 22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-radius:4px
}
.photo-label strong {
  display:block;
  font-size:15px
}
.photo-label small {
  font-size:11px;
  color:#596e6b
}
.seal {
  position:absolute;
  top:26px;
  right:25px;
  width:94px;
  height:94px;
  background:var(--cream);
  border-radius:50%;
  display:grid;
  place-content:center;
  text-align:center;
  font-size:10px;
  line-height:1.8;
  letter-spacing:.1em
}
.seal span {
  font-size:24px;
  color:var(--teal)
}
.hero-foot {
  display:flex;
  gap:40px;
  padding:24px 0;
  border-top:1px solid var(--line);
  font-size:12px
}
.hero-foot span {
  color:#687775
}
.hero-foot b {
  font-weight:500;
  margin-right:8px
}
.split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center
}
.intro-photo {
  height:540px;
  object-fit:cover;
  width:100%;
  border-radius:5px
}
.points {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  border-top:1px solid var(--line);
  padding-top:24px;
  margin-top:30px
}
.points h3 {
  font-size:17px;
  letter-spacing:-.025em;
  margin:0 0 8px
}
.points p {
  font-size:12px
}
.soft {
  background:var(--pale)
}
.section-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:45px
}
.section-head h2 {
  max-width:650px;
  margin-bottom:0
}
.section-head p {
  max-width:330px;
  font-size:14px
}
.services {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0 30px
}
.service {
  display:block;
  padding:28px 0;
  border-top:1px solid #cad8d4;
  position:relative;
  transition:.2s
}
.service:hover {
  padding-left:9px;
  color:var(--teal)
}
.service .num {
  font-size:11px;
  color:#6a8581
}
.service h3 {
  font-size:24px;
  margin:15px 25px 12px 0
}
.service p {
  font-size:13px;
  max-width:290px
}
.service .arrow {
  position:absolute;
  right:0;
  top:56px
}
.feature {
  background:var(--ink);
  color:white
}
.feature p {
  color:#c0d1cd
}
.feature .eyebrow {
  color:#92c6be
}
.feature img {
  width:100%;
  height:450px;
  object-fit:cover;
  border-radius:5px
}
.text-link {
  display:inline-block;
  padding:10px 0;
  border-bottom:1px solid currentColor;
  font-size:13px
}
.team {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px
}
.person img {
  width:100%;
  height:390px;
  object-fit:cover;
  object-position:top;
  background:#dde9e4;
  border-radius:5px
}
.person h3 {
  font-size:23px;
  margin:22px 0 8px
}
.person p {
  font-size:12px;
  margin:0
}
.tour {
  position:relative;
  padding:130px 0;
  color:white;
  background:#284a4e
}
.tour:before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#122e30e8,#122e3060)
}
.tour .wrap {
  position:relative
}
.tour h2 {
  max-width:650px
}
.tour p {
  color:#d0dfda;
  max-width:420px
}
.reviews {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:30px
}
.review {
  padding:30px;
  border-top:1px solid var(--line)
}
.quote {
  font:60px Georgia;
  color:var(--teal);
  line-height:1
}
.review blockquote {
  margin:16px 0 24px;
  font-size:17px;
  line-height:1.8
}
.review cite {
  font-style:normal;
  font-size:12px;
  color:#6d7e79
}
.partners {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding-top:45px;
  border-top:1px solid var(--line);
  margin-top:60px
}
.partners img {
  width:130px;
  height:60px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.6
}
.contact {
  background:#e7efeb
}
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px
}
.contact-list {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px
}
.contact-list small {
  display:block;
  color:#697d76;
  margin-bottom:8px
}
.contact-list a {
  display:block
}
.form {
  background:var(--cream);
  padding:36px;
  border-radius:5px
}
.form label {
  display:block;
  font-size:12px;
  margin-bottom:15px
}
.form input,.form textarea {
  display:block;
  width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid #bdccc5;
  padding:10px 0;
  border-radius:0
}
.form textarea {
  height:100px;
  resize:vertical
}
.form p {
  font-size:11px
}
.footer {
  padding:50px 0 30px;
  background:var(--ink);
  color:#dce8e3
}
.footer-grid {
  display:flex;
  justify-content:space-between;
  gap:40px
}
.footer a {
  font-size:13px
}
.footer h3 {
  margin-top:0
}
.footer-bottom {
  border-top:1px solid #365052;
  margin-top:40px;
  padding-top:20px;
  font-size:11px;
  display:flex;
  justify-content:space-between
}
.subhero {
  padding:70px 0;
  background:var(--pale)
}
.subhero h1 {
  font-size:clamp(42px,5vw,76px);
  max-width:1000px
}
.breadcrumb {
  font-size:12px;
  color:#5f7d73
}
.article {
  max-width:850px;
  margin:auto
}
.article p {
  font-size:16px;
  white-space:pre-line
}
.article h3 {
  font-size:28px;
  line-height:1.4;
  margin:35px 0 14px
}
.gallery {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:45px
}
.gallery button {
  padding:0;
  border:0;
  background:#e9efeb
}
.gallery img {
  width:100%;
  height:260px;
  object-fit:cover;
  border-radius:4px
}
.lightbox {
  border:0;
  padding:35px;
  background:#102628ee;
  width:95vw;
  max-width:1200px;
  color:white
}
.lightbox::backdrop {
  background:#102628db
}
.lightbox img {
  max-height:80vh;
  margin:auto;
  object-fit:contain
}
.close-lightbox {
  position:absolute;
  right:10px;
  top:0;
  border:0;
  background:none;
  color:white;
  font-size:30px
}
.mobilebar {
  display:none
}
.loader {
  position:fixed;
  inset:0;
  background:var(--ink);
  z-index:100;
  display:grid;
  place-content:center;
  transition:transform .8s cubic-bezier(.76,0,.24,1);
  text-align:center
}
.loader img {
  width:220px;
  background:white;
  padding:20px;
  border-radius:3px;
  animation:logo-in .9s both
}
.loader-line {
  height:1px;
  width:220px;
  background:#43635e;
  margin-top:30px;
  overflow:hidden
}
.loader-line:after {
  content:'';
  display:block;
  height:100%;
  background:#d5eee7;
  animation:load 1.3s forwards
}
.loader.done {
  transform:translateY(-101%)
}
@keyframes load {
  from {
    width:0
  }
  to {
    width:100%
  }
}
@keyframes logo-in {
  from {
    opacity:0;
    transform:translateY(12px);
    clip-path:inset(100% 0 0)
  }
  to {
    opacity:1;
    transform:none;
    clip-path:inset(0)
  }
}
.reveal {
  animation:logo-in .8s both
}
.dropdown {
  position:relative
}
.dropdown summary {
  cursor:pointer;
  list-style:none
}
.dropdown div {
  position:absolute;
  top:30px;
  left:-20px;
  background:var(--cream);
  box-shadow:0 12px 40px #152c3020;
  min-width:250px;
  padding:15px;
  border:1px solid var(--line)
}
.dropdown a {
  display:block;
  padding:8px;
  font-size:12px
}
.map {
  width:100%;
  height:350px;
  border:0;
  display:block
}
.notice {
  font-size:13px;
  color:var(--teal)
}
@media(min-width:1600px) {
  .wrap {
    max-width:1480px
  }
  .hero-image {
    height:720px
  }
}
@media(max-width:1000px) {
  .wrap {
    padding:0 26px
  }
  .navlinks {
    gap:15px
  }
  .nav>.btn {
    display:none
  }
  .split,.contact-grid {
    gap:40px
  }
  .hero-image {
    height:570px
  }
  .hero h1 {
    font-size:65px
  }
  .hero-foot {
    gap:15px
  }
  .person img {
    height:320px
  }
  .services {
    grid-template-columns:repeat(2,1fr)
  }
}
@media(max-width:720px) {
  section {
    padding:65px 0
  }
  .wrap {
    padding:0 22px
  }
  .topbar {
    display:none
  }
  .nav {
    height:76px
  }
  .logo {
    width:145px
  }
  .menu-toggle {
    display:block
  }
  .navlinks {
    display:none;
    position:absolute;
    top:76px;
    left:0;
    right:0;
    background:var(--cream);
    padding:24px;
    box-shadow:0 15px 20px #152c3010;
    max-height:75vh;
    overflow:auto
  }
  .navlinks.open {
    display:flex;
    align-items:stretch;
    flex-direction:column;
    gap:20px
  }
  .dropdown div {
    position:static;
    box-shadow:none;
    margin-top:10px
  }
  .hero {
    padding-top:30px
  }
  .hero-grid,.split,.contact-grid {
    grid-template-columns:1fr;
    gap:30px
  }
  .hero h1 {
    font-size:64px
  }
  .hero-copy {
    padding-bottom:10px
  }
  .hero-image {
    height:480px;
    border-radius:140px 140px 4px 4px
  }
  .hero-foot {
    flex-wrap:wrap;
    margin-top:25px;
    gap:10px 20px
  }
  .section-head {
    display:block
  }
  .section-head p {
    margin-top:25px
  }
  .intro-photo {
    height:380px
  }
  .services {
    grid-template-columns:1fr
  }
  .service h3 {
    font-size:27px
  }
  .team {
    grid-template-columns:1fr;
    gap:40px
  }
  .person img {
    height:460px
  }
  .feature img {
    height:300px
  }
  .reviews {
    grid-template-columns:1fr
  }
  .review {
    padding:25px 0
  }
  .tour {
    padding:85px 0
  }
  .partners {
    justify-content:center
  }
  .partners img {
    width:100px
  }
  .contact-list {
    gap:25px 15px
  }
  .form {
    padding:25px
  }
  .footer-grid {
    flex-direction:column
  }
  .footer-bottom {
    display:block;
    padding-bottom:65px
  }
  .mobilebar {
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:18;
    display:grid;
    grid-template-columns:1fr 1fr;
    background:var(--cream);
    border-top:1px solid var(--line);
    padding:8px 16px calc(8px + env(safe-area-inset-bottom));
    gap:10px
  }
  .mobilebar a {
    padding:10px;
    font-size:12px;
    text-align:center
  }
  .gallery {
    grid-template-columns:1fr 1fr;
    gap:10px
  }
  .gallery img {
    height:180px
  }
  .subhero {
    padding:45px 0
  }
  .subhero h1 {
    overflow-wrap:anywhere
  }
  .photo-label {
    left:18px;
    right:18px;
    bottom:18px
  }
  .seal {
    width:78px;
    height:78px;
    font-size:8px
  }
  .article p {
    font-size:15px
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}
:root {
  --ink:#182f3d;
  --teal:#607d28;
  --pale:#f0f3e9;
  --line:#dce2d3
}
.hero h1 em {
  color:#718a32
}
.btn {
  background:#6b822c;
  border-color:#6b822c
}
.loader {
  background:#182f3d
}
.logo img {
  width:170px
}
.feature .eyebrow {
  color:#c1d48e
}
/* Initial markup renders the intro before deferred JavaScript. */
.loader {
  display:none
}
.intro-loading .loader {
  display:grid
}
.loader.done {
  display:grid;
  pointer-events:none
}
.intro-loading {
  overflow:hidden
}
.loader-brand {
  width:min(340px,80vw);
  text-align:center
}
.loader-brand img {
  width:100%;
  padding:28px;
  background:#fff;
  border-radius:5px
}
.loader-line {
  width:100%;
  margin-top:32px;
  height:2px
}
.loader-line:after {
  animation-duration:2.3s
}
.loader-brand p {
  color:#d0dfc5;
  font-size:9px;
  letter-spacing:.2em;
  margin-top:22px
}
.loader {
  z-index:2147483640
}
.loader.done {
  transition:transform .85s cubic-bezier(.76,0,.24,1)
}
/* Scroll reveals: short distances, staggered groups and photographic masks. */
[data-scroll] {
  transition:opacity .85s cubic-bezier(.2,.65,.3,1),translate .85s cubic-bezier(.2,.65,.3,1),clip-path 1.15s cubic-bezier(.2,.65,.3,1);
  transition-delay:var(--reveal-delay,0ms)
}
[data-scroll="rise"]:not(.in-view) {
  opacity:0;
  translate:0 32px
}
[data-scroll="photo"]:not(.in-view) {
  opacity:0;
  clip-path:inset(10% 0 0 0 round 5px);
  translate:0 22px
}
[data-scroll].in-view {
  opacity:1;
  translate:0 0;
  clip-path:inset(0 0 0 0)
}
.hero-copy.reveal {
  animation:none
}
.hero-image[data-scroll].in-view {
  clip-path:none
}
.scroll-photo {
  overflow:hidden;
  border-radius:5px;
  isolation:isolate
}
.scroll-photo img {
  width:100%;
  transform:translateY(var(--photo-shift,0px)) scale(1.09);
  transition:transform .18s linear;
  will-change:transform
}
.split>.scroll-photo {
  min-width:0
}
.feature .scroll-photo img {
  height:450px;
  object-fit:cover
}
.reading-progress {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:3px;
  background:#b5cc69;
  transform:scaleX(0);
  transform-origin:left;
  z-index:80;
  pointer-events:none
}
.header {
  transition:box-shadow .3s,background .3s
}
.header.scrolled {
  box-shadow:0 8px 28px #182f3d0b;
  background:#faf9f5fc
}
.back-to-top {
  position:fixed;
  right:24px;
  bottom:25px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid #dce2d3;
  background:#faf9f5;
  color:var(--ink);
  font-size:22px;
  box-shadow:0 5px 20px #182f3d16;
  opacity:0;
  visibility:hidden;
  translate:0 12px;
  transition:.3s;
  z-index:19
}
.back-to-top.visible {
  opacity:1;
  visibility:visible;
  translate:0 0
}
.back-to-top:hover {
  background:var(--ink);
  color:white
}
.service {
  transition:padding .3s,color .3s,opacity .85s,translate .85s;
  transition-delay:0s,0s,var(--reveal-delay,0ms),var(--reveal-delay,0ms)
}
.service:after {
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:var(--teal);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .45s
}
.service:hover:after {
  transform:scaleX(1)
}
.service .arrow {
  transition:transform .3s
}
.service:hover .arrow {
  transform:translate(4px,-4px)
}
.person {
  display:block
}
.person img {
  transition:filter .5s,border-radius .5s
}
.person:hover img {
  filter:brightness(1.05);
  border-radius:45px 5px 5px 5px
}
.person h3 {
  transition:color .3s
}
.person:hover h3 {
  color:var(--teal)
}
.gallery-item {
  overflow:hidden;
  border-radius:5px
}
.gallery-item img {
  transition:transform .6s
}
.gallery-item:hover img {
  transform:scale(1.06)
}
.text-link {
  position:relative;
  transition:color .25s
}
.text-link:hover {
  color:var(--teal)
}
.form {
  transition:box-shadow .3s,opacity .85s,translate .85s
}
.form:focus-within {
  box-shadow:0 20px 60px #182f3d0c
}
.form input,.form textarea {
  transition:border-color .3s
}
.form input:focus,.form textarea:focus {
  border-bottom-color:var(--teal)
}
@media(max-width:720px) {
  [data-scroll="rise"]:not(.in-view) {
    translate:0 22px
  }
  [data-scroll] {
    transition-duration:.65s,.65s,.9s;
    transition-delay:calc(var(--reveal-delay,0ms)*.65)
  }
  .back-to-top {
    right:16px;
    bottom:90px;
    width:40px;
    height:40px
  }
  .feature .scroll-photo img {
    height:300px
  }
  .scroll-photo img {
    transform:translateY(var(--photo-shift,0px)) scale(1.07)
  }
}
@media(prefers-reduced-motion:reduce) {
  [data-scroll] {
    opacity:1!important;
    translate:none!important;
    clip-path:none!important
  }
  .scroll-photo img {
    transform:none;
    will-change:auto
  }
}
@media print {
  [data-scroll] {
    opacity:1!important;
    translate:none!important;
    clip-path:none!important
  }
  .back-to-top,.reading-progress {
    display:none
  }
}
/* Native pinned story: the screen stays, the chapters change with scroll. */
.pin-section {
  --pin-top:92px;
  padding:0;
  background:#152e36;
  color:#fff;
  position:relative
}
.pin-screen {
  padding:30px max(4vw,24px) 28px;
  max-width:1600px;
  margin:auto;
  background:#152e36;
  display:flex;
  flex-direction:column;
  min-height:700px;
  overflow:hidden
}
.pin-section.pin-enabled {
  height:440svh
}
.pin-enabled .pin-screen {
  position:sticky;
  top:var(--pin-top);
  height:calc(100svh - var(--pin-top));
  min-height:540px
}
.pin-topline {
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:#b7c9c9;
  font-size:9px;
  letter-spacing:.16em;
  border-bottom:1px solid #ffffff20;
  padding-bottom:19px
}
.pin-topline a {
  font-size:10px;
  letter-spacing:.02em;
  color:#d5e3bf
}
.pin-layout {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:6%;
  flex:1;
  min-height:0;
  align-items:center;
  padding:26px 0
}
.pin-copy {
  position:relative;
  height:100%;
  min-height:380px;
  display:grid;
  align-items:center
}
.pin-copy-slide {
  grid-area:1/1;
  position:relative;
  z-index:2;
  opacity:0;
  visibility:hidden;
  transform:translateY(30px);
  transition:opacity .5s,transform .65s cubic-bezier(.22,.61,.36,1),visibility .5s;
  pointer-events:none
}
.pin-copy-slide.active {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto
}
.pin-copy h2 {
  font-size:clamp(35px,4.2vw,70px);
  line-height:1.06;
  max-width:590px;
  letter-spacing:-.055em;
  color:#f7f8f0;
  margin:22px 0
}
.pin-kicker {
  font-size:9px;
  font-weight:600;
  letter-spacing:.2em;
  color:#c5d99a
}
.pin-copy p {
  color:#bac9c9;
  font-size:14px;
  max-width:360px;
  line-height:1.8
}
.pin-link {
  display:inline-flex;
  gap:30px;
  align-items:center;
  margin-top:12px;
  border-bottom:1px solid #7d9390;
  padding-bottom:8px;
  font-size:12px
}
.pin-link span {
  color:#c5d99a;
  font-size:21px;
  transition:transform .3s
}
.pin-link:hover span {
  transform:translate(4px,-4px)
}
.pin-ghost {
  position:absolute;
  bottom:-50px;
  left:-10px;
  font:300 clamp(160px,18vw,280px)/1 Manrope,sans-serif;
  -webkit-text-stroke:1px #ffffff10;
  color:transparent;
  pointer-events:none;
  letter-spacing:-.1em
}
.pin-visual {
  height:100%;
  min-height:340px;
  max-height:650px;
  position:relative;
  overflow:hidden;
  border-radius:5px 70px 5px 5px;
  background:#203c42
}
.pin-image-slide {
  position:absolute;
  inset:0;
  opacity:0;
  transform:scale(1.07);
  transition:opacity .8s,transform 1.2s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform
}
.pin-image-slide.active {
  opacity:1;
  transform:scale(1)
}
.pin-image-slide img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center
}
.pin-image-slide[data-frame="1"] img {
  object-position:center 32%
}
.pin-photo-index {
  position:absolute;
  bottom:20px;
  right:22px;
  font-size:11px;
  letter-spacing:.15em;
  background:#152e3680;
  backdrop-filter:blur(10px);
  padding:8px 12px;
  border:1px solid #ffffff30
}
.pin-photo-corner {
  position:absolute;
  left:22px;
  top:16px;
  color:#eff7df;
  font-size:36px;
  line-height:1
}
.pin-bottom {
  display:flex;
  align-items:center;
  gap:40px;
  padding-top:15px
}
.pin-steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  flex:1
}
.pin-step {
  border:0;
  color:#a2b7b7;
  padding:8px 0;
  background:none;
  text-align:left;
  cursor:pointer
}
.pin-step-track {
  display:block;
  height:2px;
  background:#ffffff25;
  overflow:hidden;
  margin-bottom:12px
}
.pin-step-track i {
  display:block;
  width:100%;
  height:100%;
  background:#c5d99a;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .15s linear
}
.pin-step.active {
  color:#f5f7ee
}
.pin-step-label {
  font-size:10px;
  display:flex;
  gap:12px;
  align-items:center
}
.pin-step-label small {
  font-size:9px;
  color:#8fa6a5
}
.pin-scroll-hint {
  font-size:10px;
  color:#b5c5bd;
  display:flex;
  align-items:center;
  gap:20px;
  white-space:nowrap
}
.pin-scroll-hint span {
  font-size:22px;
  animation:pin-arrow 1.5s infinite
}
@keyframes pin-arrow {
  0%,100% {
    translate:0 0
  }
  50% {
    translate:0 5px
  }
}
@media(max-width:1000px) {
  .pin-copy h2 {
    font-size:45px
  }
  .pin-scroll-hint {
    display:none
  }
  .pin-layout {
    gap:5%
  }
  .pin-topline {
    font-size:8px
  }
}
@media(max-width:720px) {
  .pin-section {
    --pin-top:76px
  }
  .pin-section.pin-enabled {
    height:360svh
  }
  .pin-enabled .pin-screen {
    height:calc(100svh - 76px);
    min-height:420px
  }
  .pin-screen {
    padding:17px 20px 14px;
    min-height:620px
  }
  .pin-topline {
    padding-bottom:12px;
    letter-spacing:.06em;
    font-size:7px;
    gap:10px
  }
  .pin-topline a {
    font-size:8px;
    white-space:nowrap
  }
  .pin-layout {
    position:relative;
    display:block;
    padding:0;
    margin:16px 0 8px;
    isolation:isolate
  }
  .pin-visual {
    position:absolute;
    inset:0;
    height:100%;
    min-height:0;
    border-radius:4px 45px 4px 4px;
    z-index:-2;
    max-height:none
  }
  .pin-visual:after {
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#102a3130 0%,#102a3115 15%,#102a31b5 47%,#102a31f5 100%);
    z-index:1;
    pointer-events:none
  }
  .pin-image-slide img {
    object-position:center 35%
  }
  .pin-image-slide[data-frame="1"] img {
    object-position:center 24%
  }
  .pin-copy {
    height:100%;
    min-height:0;
    padding:24px 22px;
    align-items:end
  }
  .pin-copy-slide {
    padding-top:90px
  }
  .pin-copy h2 {
    font-size:clamp(31px,8.5vw,43px);
    margin:12px 0;
    max-width:330px
  }
  .pin-kicker {
    font-size:7px;
    letter-spacing:.15em
  }
  .pin-copy p {
    font-size:12px;
    line-height:1.65;
    margin:0;
    max-width:290px;
    color:#d2dedb
  }
  .pin-link {
    font-size:11px;
    margin-top:13px;
    padding-bottom:4px
  }
  .pin-photo-index {
    top:16px;
    bottom:auto;
    right:16px;
    z-index:3;
    font-size:8px;
    padding:6px 9px
  }
  .pin-photo-corner {
    top:18px;
    left:18px;
    font-size:27px;
    z-index:3
  }
  .pin-ghost {
    display:none
  }
  .pin-bottom {
    padding-top:0;
    gap:0
  }
  .pin-steps {
    gap:10px
  }
  .pin-step-track {
    margin-bottom:8px
  }
  .pin-step-label {
    font-size:8px;
    display:block;
    line-height:1.4;
    min-height:25px
  }
  .pin-step-label small {
    display:block;
    font-size:7px;
    margin-bottom:3px
  }
  .pin-step {
    padding:4px 0
  }
}
@media(max-height:650px) and (min-width:721px) {
  .pin-enabled .pin-screen {
    min-height:380px;
    padding-top:12px;
    padding-bottom:12px
  }
  .pin-copy {
    min-height:230px
  }
  .pin-copy h2 {
    font-size:38px;
    margin:12px 0
  }
  .pin-layout {
    padding:15px 0
  }
  .pin-visual {
    min-height:230px
  }
  .pin-copy p {
    font-size:12px
  }
  .pin-topline {
    padding-bottom:10px
  }
}
@media(prefers-reduced-motion:reduce) {
  .pin-section {
    height:auto!important
  }
  .pin-screen {
    position:relative!important;
    height:auto!important;
    min-height:0
  }
  .pin-copy {
    display:block
  }
  .pin-copy-slide {
    position:relative;
    opacity:1;
    visibility:visible;
    transform:none;
    margin:25px 0 40px
  }
  .pin-visual {
    min-height:400px
  }
  .pin-bottom {
    display:none
  }
  .pin-ghost {
    display:none
  }
}
@media print {
  .pin-section {
    height:auto!important
  }
  .pin-screen {
    position:static!important;
    height:auto!important
  }
  .pin-copy-slide {
    opacity:1;
    visibility:visible;
    transform:none
  }
  .pin-bottom {
    display:none
  }
}
@media(max-width:720px) and (max-height:600px) {
  .pin-screen {
    padding:10px 15px
  }
  .pin-topline {
    padding-bottom:7px
  }
  .pin-layout {
    margin:8px 0
  }
  .pin-copy {
    padding:14px 18px
  }
  .pin-copy h2 {
    font-size:28px;
    margin:9px 0
  }
  .pin-copy p {
    font-size:11px
  }
  .pin-copy-slide {
    padding-top:65px
  }
  .pin-link {
    margin-top:8px
  }
  .pin-step-label {
    min-height:20px
  }
  .pin-enabled .pin-screen {
    min-height:340px
  }
}
@media(max-width:720px) {
  .pin-enabled .pin-screen {
    height:calc(100svh - 148px - env(safe-area-inset-bottom,0px));
    min-height:360px
  }
}
@media(max-width:720px) and (max-height:600px) {
  .pin-enabled .pin-screen {
    min-height:300px
  }
  .pin-kicker {
    font-size:6px
  }
  .pin-copy h2 {
    font-size:26px
  }
  .pin-copy p {
    font-size:10px
  }
  .pin-copy-slide {
    padding-top:35px
  }
}
/* premium.css */
/* Dental Hodžić — editorial direction: ink, ivory and a botanical accent. */
:root {
  --cream:#f7f7f0;
  --ink:#193038;
  --teal:#5d742d;
  --pale:#edf0e5;
  --accent:#d0e18e
}
body {
  background:var(--cream)
}
.btn {
  border-radius:0;
  padding:17px 25px;
  font-weight:500;
  letter-spacing:.01em
}
.btn:hover {
  background:#243c39;
  border-color:#243c39
}
.eyebrow {
  font-size:9px;
  letter-spacing:.19em
}
.section-head h2 em,.founder-copy h2 em,.cinema-section h2 em,.closing-section h2 em {
  font-family:Georgia,serif;
  font-weight:400;
  color:#758843
}
.section-head {
  margin-bottom:55px
}
.section-head p {
  font-size:13px;
  line-height:1.8
}
.nav {
  height:88px
}
.logo {
  width:156px
}
.logo img {
  width:156px;
  max-height:60px
}
.navlinks {
  font-size:12px;
  gap:28px
}
.topbar {
  background:#193038;
  font-size:10px
}
.header.scrolled {
  box-shadow:0 4px 22px #1930380a
}
.dropdown {
  position:static
}
.dropdown summary>span {
  display:inline-block;
  transition:rotate .3s;
  margin-left:3px
}
.dropdown[open] summary>span {
  rotate:180deg
}
.dropdown .mega-menu {
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  width:min(1000px,calc(100vw - 70px));
  min-width:0;
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:45px;
  padding:36px;
  background:#f7f7f0;
  box-shadow:0 25px 40px #19303816;
  border:1px solid #dde2d3;
  animation:mega-enter .25s both
}
.dropdown .mega-menu .mega-intro,.dropdown .mega-menu .mega-links {
  position:static;
  background:none;
  box-shadow:none;
  min-width:0;
  border:0;
  padding:0
}
.mega-intro>span {
  font-size:8px;
  letter-spacing:.18em;
  color:#6b7d6b
}
.mega-intro h3 {
  font-size:34px;
  margin:16px 0 24px
}
.mega-intro img {
  height:150px;
  width:100%;
  object-fit:cover
}
.dropdown .mega-menu .mega-intro>a {
  padding:17px 0 0;
  font-size:11px
}
.dropdown .mega-links>a {
  display:flex;
  align-items:center;
  gap:18px;
  padding:16px 0;
  border-bottom:1px solid #dce2d3;
  font-size:13px
}
.mega-links a small {
  font-size:9px;
  color:#7b8d6e
}
.mega-links a>span {
  margin-left:auto
}
.mega-links a:hover {
  padding-left:6px
}
@keyframes mega-enter {
  from {
    opacity:0;
    translate:0 -8px
  }
  to {
    opacity:1;
    translate:0 0
  }
}
.hero-premium {
  position:relative;
  padding-top:36px;
  background:#f7f7f0;
  isolation:isolate
}
.hero-premium .hero-grid {
  grid-template-columns:1.05fr .95fr;
  gap:20px;
  position:relative;
  min-height:630px
}
.hero-premium .hero-copy {
  position:relative;
  z-index:2;
  padding:35px 25px 40px 0
}
.hero-premium h1 {
  font-size:clamp(64px,7.8vw,118px);
  letter-spacing:-.065em;
  line-height:.99;
  margin:25px -70px 30px 0;
  position:relative;
  z-index:3
}
.hero-premium h1 em {
  font-family:Georgia,serif;
  font-weight:400;
  color:#71853a;
  letter-spacing:-.065em;
  white-space:nowrap
}
.hero-intro {
  display:flex;
  gap:20px;
  align-items:start
}
.hero-asterisk {
  font-size:40px;
  line-height:1;
  color:#7d914b;
  padding-top:10px
}
.hero-intro p {
  font-size:13px;
  max-width:315px;
  margin:5px 0 0;
  line-height:1.85
}
.hero-premium .hero-image {
  height:640px;
  width:100%;
  border-radius:0;
  position:relative
}
.hero-premium .hero-image>img {
  object-fit:cover;
  object-position:center 26%;
  height:100%;
  width:100%
}
.hero-photo-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,#10282ce8 0%,#10282c20 33%,transparent 50%);
  pointer-events:none
}
.hero-photo-tag {
  position:absolute;
  top:24px;
  left:24px;
  writing-mode:vertical-rl;
  rotate:180deg;
  font-size:8px;
  letter-spacing:.2em;
  color:white
}
.hero-doctor {
  position:absolute;
  bottom:30px;
  left:28px;
  right:28px;
  color:#fff
}
.hero-doctor>span {
  font-size:7px;
  letter-spacing:.18em;
  color:#d0dfba
}
.hero-doctor strong {
  display:block;
  font-family:Manrope,sans-serif;
  font-size:25px;
  font-weight:500;
  letter-spacing:-.04em;
  margin:9px 0
}
.hero-doctor small {
  font-size:10px;
  color:#c5d3cf;
  line-height:1.7;
  display:block
}
.hero-doctor>a {
  position:absolute;
  right:0;
  bottom:0;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border:1px solid #ffffff50;
  border-radius:50%;
  font-size:22px;
  transition:.3s
}
.hero-doctor>a:hover {
  background:#c9db91;
  color:var(--ink);
  border-color:#c9db91
}
.hero-services-link {
  display:flex;
  align-items:center;
  gap:26px;
  font-size:12px;
  padding:15px 8px
}
.hero-services-link span {
  font-size:18px
}
.hero-address {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:9px;
  color:#7a8579;
  letter-spacing:.02em;
  margin-top:35px
}
.availability-dot {
  width:5px;
  height:5px;
  background:#7c9840;
  border-radius:50%
}
.hero-background-word {
  position:absolute;
  left:-1vw;
  bottom:55px;
  font:600 22vw/.8 Manrope,sans-serif;
  letter-spacing:-.09em;
  color:#ecefe1;
  z-index:-1;
  white-space:nowrap
}
.hero-discover {
  position:absolute;
  z-index:4;
  width:100px;
  height:100px;
  left:calc(52% - 60px);
  bottom:54px;
  border-radius:50%;
  background:#d0e18e;
  color:#253c2d;
  display:grid;
  place-content:center;
  text-align:center;
  box-shadow:0 0 0 8px #f7f7f0;
  transition:rotate .4s
}
.hero-discover>span {
  font-size:7px;
  letter-spacing:.12em;
  line-height:1.6
}
.hero-discover b {
  font-size:24px;
  font-weight:400;
  margin-top:4px
}
.hero-discover:hover {
  rotate:-8deg
}
.hero-premium .hero-foot {
  justify-content:space-between;
  padding:21px 0;
  margin-top:30px;
  font-size:9px;
  letter-spacing:.09em;
  color:#6e7d70
}
.hero-premium .hero-foot a {
  letter-spacing:.01em;
  font-size:11px;
  color:#354a3b
}
.brand-ribbon {
  padding:26px 0;
  background:#e9eedc;
  color:#687d3b;
  overflow:hidden;
  border-top:1px solid #d6dfc0;
  border-bottom:1px solid #d6dfc0
}
.brand-ribbon>div {
  display:flex;
  align-items:center;
  gap:48px;
  width:max-content;
  animation:ribbon 50s linear infinite
}
.brand-ribbon span {
  font-family:Manrope,sans-serif;
  font-size:25px;
  letter-spacing:-.04em;
  white-space:nowrap
}
.brand-ribbon i {
  font-size:27px;
  font-style:normal
}
.brand-ribbon:hover>div {
  animation-play-state:paused
}
@keyframes ribbon {
  to {
    transform:translateX(-50%)
  }
}
.pin-section {
  --pin-top:88px
}
.pin-section.pin-enabled {
  height:390svh
}
.pin-screen {
  background:#193038
}
.pin-topline {
  font-size:8px
}
.pin-kicker {
  color:#c9db91
}
.pin-visual {
  border-radius:0
}
.pin-copy h2 {
  letter-spacing:-.06em
}
.pin-copy p {
  max-width:330px
}
.pin-section+.wrap {
  margin-top:0
}
.treatment-section {
  padding:110px 0 90px;
  background:#f4f5ed
}
.treatment-explorer {
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:8%;
  align-items:start
}
.treatment-visual {
  position:sticky;
  top:120px;
  height:610px;
  overflow:hidden;
  background:#dce5da
}
.treatment-photo {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  scale:1.06;
  transition:opacity .55s,scale .8s;
  pointer-events:none
}
.treatment-photo.active {
  opacity:1;
  scale:1
}
.treatment-visual:after {
  content:'';
  position:absolute;
  inset:40% 0 0;
  background:linear-gradient(transparent,#143131b0);
  pointer-events:none
}
.treatment-photo-badge {
  position:absolute;
  bottom:30px;
  left:28px;
  font-size:8px;
  letter-spacing:.2em;
  color:white;
  line-height:2;
  z-index:2
}
.treatment-photo-badge b {
  font-weight:400;
  font-size:7px;
  color:#d9e4c9
}
.treatment-photo-count {
  position:absolute;
  top:24px;
  left:24px;
  background:#f7f7f0e5;
  color:#314832;
  font-size:9px;
  padding:7px 12px;
  letter-spacing:.12em
}
.treatment-row {
  border-bottom:1px solid #cbd3c0
}
.treatment-row:first-child {
  border-top:1px solid #cbd3c0
}
.treatment-row summary {
  list-style:none;
  display:grid;
  grid-template-columns:30px 1fr 20px;
  gap:16px;
  align-items:start;
  padding:25px 0;
  cursor:pointer;
  font-family:Manrope,sans-serif;
  font-size:22px;
  line-height:1.3;
  letter-spacing:-.04em;
  transition:color .25s
}
.treatment-row summary::-webkit-details-marker {
  display:none
}
.treatment-no {
  font:9px 'DM Sans',sans-serif;
  color:#8c9b78;
  letter-spacing:0;
  padding-top:8px
}
.treatment-row summary>b {
  font:300 24px 'DM Sans',sans-serif;
  text-align:right;
  color:#728644;
  transition:rotate .3s
}
.treatment-row[open] summary {
  color:#617937
}
.treatment-row[open] summary>b {
  rotate:45deg
}
.treatment-description {
  padding:0 30px 24px 46px;
  animation:treatment-enter .35s both
}
.treatment-description p {
  font-size:12px;
  margin:0 0 16px;
  line-height:1.9
}
.treatment-description a {
  display:inline-flex;
  align-items:center;
  gap:25px;
  font-size:10px;
  border-bottom:1px solid #abb99a;
  padding-bottom:6px
}
.treatment-description a span {
  font-size:18px
}
.treatment-extra {
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding-top:35px;
  margin-top:40px;
  border-top:1px solid #cbd3c0;
  font-size:10px;
  color:#6b7c64
}
.treatment-extra>div {
  display:flex;
  gap:24px
}
.treatment-extra a {
  border-bottom:1px solid #cbd3c0;
  padding-bottom:4px
}
@keyframes treatment-enter {
  from {
    opacity:0;
    translate:0 -6px
  }
  to {
    opacity:1;
    translate:0 0
  }
}
.founder-section {
  padding:120px 0;
  background:#f7f7f0
}
.founder-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:11%;
  align-items:center
}
.founder-photo {
  position:relative;
  padding:0 0 28px
}
.founder-photo img {
  width:100%;
  height:610px;
  object-fit:cover;
  object-position:center top
}
.founder-photo>span {
  font-size:8px;
  letter-spacing:.15em;
  position:absolute;
  bottom:0;
  left:0;
  color:#7a8975
}
.founder-photo:before {
  content:'';
  position:absolute;
  inset:25px -25px 55px 25px;
  border:1px solid #becba9;
  z-index:-1
}
.founder-copy h2 {
  font-size:clamp(40px,4.6vw,72px)
}
.founder-copy p {
  font-size:13px;
  line-height:1.9;
  max-width:460px
}
.founder-copy .founder-lead {
  font-size:18px;
  color:#344a3c;
  letter-spacing:-.035em
}
.founder-facts {
  display:flex;
  gap:50px;
  border-top:1px solid #d7dfcc;
  padding-top:24px;
  margin:30px 0
}
.founder-facts strong {
  display:block;
  font:400 37px Manrope,sans-serif;
  letter-spacing:-.07em
}
.founder-facts span {
  display:block;
  font-size:9px;
  color:#819071;
  margin-top:6px
}
.founder-copy .text-link {
  font-size:11px
}
.founder-copy .text-link span {
  padding-left:45px
}
.person img {
  border-radius:0
}
.person:hover img {
  border-radius:0;
  filter:brightness(1.07)
}
.person h3 {
  font-size:21px
}
.person p {
  font-size:11px
}
.team .person {
  position:relative
}
.team .person:after {
  content:'↗';
  position:absolute;
  top:18px;
  right:18px;
  background:#f7f7f0e8;
  color:#31472e;
  width:35px;
  height:35px;
  border-radius:50%;
  display:grid;
  place-items:center;
  transition:rotate .3s
}
.team .person:hover:after {
  rotate:45deg
}
.feature {
  background:#193038
}
.feature .scroll-photo {
  border-radius:0
}
.immersive-tour {
  min-height:610px;
  display:flex;
  align-items:center;
  margin:0 4vw;
  padding:100px 0;
  border-radius:2px;
  overflow:hidden
}
.immersive-tour:before {
  background:linear-gradient(90deg,#162c30e8,#162c3070)
}
.immersive-tour h2 {
  font-size:clamp(42px,5vw,78px)
}
.immersive-tour .btn {
  margin-top:20px
}
.immersive-tour .wrap {
  width:100%
}
.review-stage {
  overflow:hidden
}
.review-track {
  display:flex;
  gap:0;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  overscroll-behavior-x:contain
}
.review-track::-webkit-scrollbar {
  display:none
}
.review-slide {
  flex:0 0 100%;
  padding:35px 8% 30px;
  text-align:center;
  scroll-snap-align:start;
  border:0
}
.review-slide .quote {
  font:90px/.65 Georgia,serif;
  color:#8b9e58
}
.review-slide blockquote {
  font-family:Georgia,serif;
  font-size:clamp(22px,2.6vw,35px);
  line-height:1.55;
  letter-spacing:-.015em;
  max-width:950px;
  margin:30px auto
}
.review-slide cite {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.14em
}
.review-navigation {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  padding-top:10px
}
.review-navigation>div {
  display:flex;
  gap:8px
}
.review-navigation button {
  background:transparent;
  border:1px solid #c8d2ba;
  border-radius:50%;
  width:43px;
  height:43px;
  color:var(--ink);
  font-size:18px;
  transition:.25s
}
.review-navigation button:hover {
  background:#193038;
  color:white;
  border-color:#193038
}
.review-counter {
  font-size:10px;
  letter-spacing:.1em;
  color:#7c8d69
}
.partners img {
  filter:grayscale(1);
  opacity:.65;
  transition:.4s
}
.partners img:hover {
  filter:none;
  opacity:1
}
.cinema-section {
  background:#f7f7f0;
  padding-bottom:110px
}
.cinema-poster {
  position:relative;
  display:block;
  width:100%;
  height:570px;
  overflow:hidden;
  padding:0;
  border:0;
  text-align:left;
  background:#193038;
  color:white
}
.cinema-poster>img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:scale 1s;
  filter:brightness(.7)
}
.cinema-poster:hover>img {
  scale:1.04
}
.cinema-play {
  position:absolute;
  top:50%;
  left:50%;
  translate:-50% -50%;
  width:90px;
  height:90px;
  display:grid;
  place-items:center;
  border:1px solid #ffffff90;
  border-radius:50%;
  font-size:18px;
  background:#ffffff10;
  backdrop-filter:blur(8px);
  transition:.4s;
  padding-left:4px
}
.cinema-poster:hover .cinema-play {
  background:#d0e18e;
  color:#193038;
  scale:1.08;
  border-color:#d0e18e
}
.cinema-caption {
  position:absolute;
  bottom:32px;
  left:35px;
  display:grid;
  gap:10px
}
.cinema-caption small {
  font-size:8px;
  letter-spacing:.18em;
  color:#e3eccf
}
.cinema-caption strong {
  font:400 32px Manrope,sans-serif;
  letter-spacing:-.05em
}
.cinema-duration {
  position:absolute;
  bottom:40px;
  right:35px;
  font-size:8px;
  letter-spacing:.14em
}
.closing-section {
  background:#dce7ba;
  padding:95px 0 50px;
  position:relative;
  overflow:hidden
}
.closing-section .eyebrow {
  color:#596c3f
}
.closing-section h2 {
  font-size:clamp(70px,10.5vw,155px);
  line-height:.98;
  letter-spacing:-.065em;
  margin:35px 0 48px;
  max-width:75%
}
.closing-section h2 em {
  color:#536a34
}
.closing-cta {
  position:absolute;
  right:max(calc((100vw - 1234px)/2),5vw);
  top:50%;
  translate:0 -50%;
  height:160px;
  width:160px;
  background:#193038;
  color:#eef2e1;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  transition:rotate .5s,background .3s
}
.closing-cta>span {
  font-size:12px
}
.closing-cta b {
  font-size:43px;
  font-weight:400;
  line-height:1
}
.closing-cta:hover {
  rotate:-9deg;
  background:#45613f
}
.closing-info {
  border-top:1px solid #aeba93;
  display:flex;
  justify-content:space-between;
  padding-top:25px;
  font-size:9px;
  letter-spacing:.12em
}
.closing-info a {
  font-size:12px;
  letter-spacing:.02em
}
.contact {
  background:#eef1e5
}
.form {
  border:1px solid #dae1cd;
  border-radius:0
}
.contact h2 {
  font-size:clamp(35px,4.1vw,60px)
}
.footer {
  background:#193038
}
.footer h3 {
  font-size:30px;
  letter-spacing:-.05em
}
.footer p {
  font-size:12px;
  color:#a8bab0
}
.footer a {
  font-size:11px
}
.footer-bottom {
  font-size:9px;
  color:#a9b7ac
}
.footer-grid {
  gap:35px
}
.footer-grid a {
  display:inline-block;
  transition:color .25s
}
.footer-grid a:hover {
  color:#d0e18e
}
/* Accessible overlays: one purpose per panel. */
body.modal-open {
  overflow:hidden
}
.profile-dialog,.film-dialog,.booking-sheet {
  border:0;
  background:var(--cream);
  color:var(--ink);
  padding:0
}
.profile-dialog::backdrop,.film-dialog::backdrop,.booking-sheet::backdrop {
  background:#10292ed9;
  backdrop-filter:blur(7px)
}
.profile-dialog {
  width:min(1040px,calc(100vw - 60px));
  max-width:1040px;
  max-height:86dvh;
  overflow:auto;
  animation:dialog-enter .4s both
}
.dialog-close {
  position:absolute;
  top:18px;
  right:20px;
  z-index:5;
  width:40px;
  height:40px;
  border:1px solid #d0d8c4;
  background:#f7f7f0f2;
  color:#193038;
  border-radius:50%;
  font-size:25px;
  display:grid;
  place-items:center;
  line-height:1
}
.profile-layout {
  display:grid;
  grid-template-columns:.8fr 1.2fr
}
.profile-portrait {
  position:sticky;
  top:0;
  width:100%;
  height:650px;
  object-fit:cover;
  object-position:top
}
.profile-content {
  padding:65px 45px 45px
}
.profile-content h2 {
  font-size:36px;
  line-height:1.2
}
.profile-content p {
  font-size:12px;
  line-height:1.9;
  margin:14px 0
}
.profile-content .profile-subtitle {
  font-size:8px;
  letter-spacing:.16em;
  color:#6c8446
}
.film-dialog {
  width:min(1100px,95vw);
  max-width:1100px;
  background:#10292e
}
.film-dialog video {
  display:block;
  width:100%;
  max-height:85dvh
}
.film-dialog .dialog-close {
  background:#10292ecc;
  color:white;
  border-color:#ffffff60
}
.booking-sheet {
  position:fixed;
  inset:0 0 0 auto;
  margin:0;
  width:min(510px,100vw);
  max-width:100vw;
  height:100dvh;
  max-height:100dvh;
  overflow-y:auto;
  animation:sheet-enter .4s both
}
.booking-inner {
  padding:75px 38px 35px
}
.booking-inner h2 {
  font-size:45px;
  margin:18px 0
}
.booking-inner>p {
  font-size:12px;
  line-height:1.8
}
.booking-direct {
  display:flex;
  gap:12px;
  margin:25px 0
}
.booking-direct a {
  flex:1;
  border:1px solid #c9d2bc;
  padding:14px;
  text-align:center;
  font-size:10px
}
.booking-form label {
  display:block;
  font-size:10px;
  margin:18px 0
}
.booking-form input,.booking-form select,.booking-form textarea {
  display:block;
  width:100%;
  background:none;
  border:0;
  border-bottom:1px solid #c0ccb1;
  border-radius:0;
  padding:10px 0;
  color:var(--ink);
  font:13px 'DM Sans',sans-serif
}
.booking-form select {
  padding-right:12px
}
.booking-form textarea {
  min-height:80px;
  resize:vertical
}
.booking-form .btn {
  width:100%;
  margin-top:12px
}
.booking-form small {
  display:block;
  font-size:9px;
  color:#7c8d70;
  margin-top:15px;
  line-height:1.8
}
.booking-form .booking-status {
  font-size:11px;
  color:#526a2c;
  margin-top:15px
}
.booking-inner .eyebrow {
  font-size:8px
}
@keyframes dialog-enter {
  from {
    opacity:0;
    transform:translateY(20px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
@keyframes sheet-enter {
  from {
    opacity:0;
    transform:translateX(50px)
  }
  to {
    opacity:1;
    transform:translateX(0)
  }
}
@media(min-width:1600px) {
  .hero-premium .hero-image {
    height:720px
  }
  .hero-premium h1 {
    font-size:130px
  }
  .hero-premium .hero-grid {
    min-height:720px
  }
}
@media(max-width:1050px) {
  .navlinks {
    gap:15px
  }
  .hero-premium .hero-image {
    height:590px
  }
  .hero-premium h1 {
    font-size:88px
  }
  .hero-premium .hero-grid {
    min-height:590px
  }
  .hero-address {
    font-size:8px;
    flex-wrap:wrap
  }
  .hero-discover {
    left:calc(52% - 45px);
    width:80px;
    height:80px
  }
  .hero-discover span {
    font-size:6px
  }
  .treatment-visual {
    height:540px
  }
  .treatment-explorer {
    gap:6%
  }
  .treatment-row summary {
    font-size:20px;
    padding:22px 0;
    gap:10px;
    grid-template-columns:25px 1fr 18px
  }
  .treatment-description {
    padding-left:35px
  }
  .founder-grid {
    gap:8%
  }
  .founder-photo img {
    height:540px
  }
  .founder-facts {
    gap:30px
  }
  .cinema-poster {
    height:480px
  }
  .closing-cta {
    width:130px;
    height:130px
  }
  .closing-cta>span {
    font-size:11px
  }
}
@media(max-width:720px) {
  .nav {
    height:76px
  }
  .logo,.logo img {
    width:145px
  }
  .navlinks {
    top:76px;
    padding:25px
  }
  .dropdown .mega-menu {
    position:static;
    transform:none;
    width:100%;
    padding:8px 0 0;
    display:block;
    border:0;
    box-shadow:none;
    animation:none
  }
  .mega-intro {
    display:none!important
  }
  .dropdown .mega-links>a {
    font-size:12px;
    padding:14px 0
  }
  .mega-links a small {
    font-size:8px
  }
  .hero-premium {
    padding-top:30px
  }
  .hero-premium .hero-grid {
    display:flex;
    flex-direction:column;
    gap:26px;
    min-height:0;
    align-items:stretch
  }
  .hero-premium .hero-copy {
    padding:0
  }
  .hero-premium h1 {
    font-size:clamp(62px,16.7vw,90px);
    margin:22px 0 25px;
    line-height:.99;
    letter-spacing:-.07em
  }
  .hero-premium h1 em {
    white-space:normal
  }
  .hero-intro {
    gap:15px
  }
  .hero-asterisk {
    font-size:34px
  }
  .hero-intro p {
    font-size:12px;
    max-width:285px
  }
  .hero-premium .actions {
    margin-top:25px;
    gap:12px
  }
  .hero-premium .btn {
    padding:15px 21px;
    font-size:11px;
    gap:16px
  }
  .hero-services-link {
    font-size:11px;
    gap:15px
  }
  .hero-address {
    font-size:8px;
    margin-top:24px;
    gap:6px
  }
  .hero-premium .hero-image {
    height:500px;
    border-radius:0
  }
  .hero-premium .hero-image>img {
    object-position:center 24%
  }
  .hero-doctor {
    left:22px;
    right:22px;
    bottom:22px
  }
  .hero-doctor strong {
    font-size:24px
  }
  .hero-doctor small {
    font-size:9px
  }
  .hero-photo-tag {
    top:20px;
    left:15px;
    font-size:7px
  }
  .hero-discover {
    left:auto;
    right:-8px;
    bottom:440px;
    width:77px;
    height:77px;
    box-shadow:0 0 0 6px #f7f7f0
  }
  .hero-discover b {
    font-size:22px
  }
  .hero-discover span {
    font-size:5px
  }
  .hero-premium .hero-foot {
    margin-top:22px;
    padding:17px 0;
    font-size:7px;
    gap:12px;
    flex-direction:column
  }
  .hero-premium .hero-foot a {
    font-size:10px
  }
  .hero-background-word {
    font-size:27vw;
    bottom:500px
  }
  .brand-ribbon {
    padding:20px 0
  }
  .brand-ribbon>div {
    gap:30px
  }
  .brand-ribbon span {
    font-size:19px
  }
  .brand-ribbon i {
    font-size:22px
  }
  .pin-section {
    --pin-top:76px
  }
  .pin-section.pin-enabled {
    height:340svh
  }
  .section-head {
    margin-bottom:30px
  }
  .section-head h2 {
    font-size:42px
  }
  .treatment-section {
    padding:65px 0
  }
  .treatment-explorer {
    display:flex;
    flex-direction:column;
    gap:25px
  }
  .treatment-visual {
    position:relative;
    top:auto;
    width:100%;
    height:300px;
    order:0
  }
  .treatment-list {
    width:100%
  }
  .treatment-row summary {
    font-size:21px;
    padding:20px 0;
    grid-template-columns:22px 1fr 18px;
    gap:12px
  }
  .treatment-no {
    font-size:8px;
    padding-top:6px
  }
  .treatment-description {
    padding-left:34px;
    padding-right:18px
  }
  .treatment-description p {
    font-size:12px
  }
  .treatment-extra {
    flex-direction:column;
    padding-top:25px;
    margin-top:25px;
    gap:18px
  }
  .treatment-extra>div {
    gap:15px;
    flex-wrap:wrap;
    font-size:9px
  }
  .founder-section {
    padding:70px 0
  }
  .founder-grid {
    grid-template-columns:1fr;
    gap:40px
  }
  .founder-photo {
    padding-bottom:24px;
    margin-right:15px
  }
  .founder-photo img {
    height:490px
  }
  .founder-photo:before {
    inset:18px -15px 45px 18px
  }
  .founder-photo>span {
    font-size:7px
  }
  .founder-copy h2 {
    font-size:46px
  }
  .founder-copy p {
    font-size:12px
  }
  .founder-copy .founder-lead {
    font-size:17px
  }
  .founder-facts {
    gap:35px;
    padding-top:20px;
    margin:25px 0
  }
  .founder-facts strong {
    font-size:34px
  }
  .founder-facts span {
    font-size:8px
  }
  .immersive-tour {
    margin:0 12px;
    min-height:540px;
    padding:60px 0
  }
  .immersive-tour .wrap {
    padding:0 25px
  }
  .immersive-tour h2 {
    font-size:46px
  }
  .immersive-tour p {
    font-size:12px
  }
  .review-slide {
    padding:25px 5px;
    flex-basis:100%
  }
  .review-slide blockquote {
    font-size:23px;
    line-height:1.65;
    margin:25px 0
  }
  .review-slide .quote {
    font-size:80px
  }
  .review-slide cite {
    font-size:9px
  }
  .partners {
    gap:20px;
    margin-top:45px
  }
  .partners img {
    width:90px;
    height:48px
  }
  .cinema-section {
    padding:65px 0
  }
  .cinema-section h2 {
    font-size:40px
  }
  .cinema-poster {
    height:420px
  }
  .cinema-play {
    height:70px;
    width:70px;
    font-size:14px
  }
  .cinema-caption {
    left:22px;
    bottom:48px;
    gap:8px
  }
  .cinema-caption strong {
    font-size:25px;
    max-width:240px;
    line-height:1.2
  }
  .cinema-caption small {
    font-size:7px
  }
  .cinema-duration {
    left:22px;
    right:auto;
    bottom:24px;
    font-size:7px
  }
  .closing-section {
    padding:65px 0 35px
  }
  .closing-section h2 {
    font-size:clamp(61px,17vw,90px);
    max-width:100%;
    margin:28px 0 35px
  }
  .closing-cta {
    position:relative;
    right:auto;
    top:auto;
    translate:none;
    width:100px;
    height:100px;
    margin-left:auto;
    margin-bottom:30px;
    margin-top:-5px
  }
  .closing-cta>span {
    font-size:9px
  }
  .closing-cta b {
    font-size:32px
  }
  .closing-info {
    font-size:7px;
    gap:15px;
    flex-wrap:wrap;
    align-items:center;
    padding-top:20px
  }
  .closing-info a {
    font-size:10px
  }
  .contact h2 {
    font-size:38px
  }
  .footer h3 {
    font-size:30px
  }
  .profile-dialog {
    width:calc(100vw - 24px);
    max-height:90dvh
  }
  .profile-layout {
    grid-template-columns:1fr
  }
  .profile-portrait {
    position:relative;
    height:340px;
    object-position:center 20%
  }
  .profile-content {
    padding:30px 24px
  }
  .profile-content h2 {
    font-size:29px
  }
  .profile-content p {
    font-size:12px
  }
  .dialog-close {
    right:12px;
    top:12px;
    width:36px;
    height:36px;
    font-size:24px
  }
  .booking-inner {
    padding:65px 25px 30px
  }
  .booking-inner h2 {
    font-size:40px
  }
  .booking-sheet {
    padding-bottom:env(safe-area-inset-bottom)
  }
  .film-dialog {
    width:100vw;
    max-width:100vw
  }
  .film-dialog video {
    max-height:75dvh
  }
  .pin-enabled .pin-screen {
    height:calc(100svh - 148px - env(safe-area-inset-bottom,0px))
  }
}
@media(prefers-reduced-motion:reduce) {
  .brand-ribbon>div {
    animation:none
  }
  .brand-ribbon {
    overflow:hidden
  }
  .treatment-photo {
    scale:1
  }
  .profile-dialog,.booking-sheet,.treatment-description {
    animation:none
  }
  .cinema-poster>img {
    scale:1!important
  }
}
.immersive-tour {
  margin-left:var(--tour-inset,4vw);
  margin-right:var(--tour-inset,4vw);
  border-radius:var(--tour-radius,0px);
  transition:margin .12s linear,border-radius .12s linear
}
.premium-reveal {
  opacity:0;
  clip-path:inset(8% 0 0);
  transition:opacity .8s,clip-path 1s cubic-bezier(.2,.65,.3,1)
}
.premium-reveal.premium-visible {
  opacity:1;
  clip-path:inset(0)
}
@media(max-width:720px) {
  .treatment-visual {
    position:sticky;
    top:76px;
    height:225px;
    z-index:3;
    box-shadow:0 10px 0 #f4f5ed
  }
  .treatment-explorer {
    gap:20px
  }
  .treatment-photo-badge {
    bottom:18px;
    left:20px;
    font-size:7px
  }
  .treatment-photo-count {
    top:16px;
    left:16px;
    font-size:8px
  }
  .immersive-tour {
    margin-left:12px!important;
    margin-right:12px!important
  }
}
@media(prefers-reduced-motion:reduce) {
  .premium-reveal {
    opacity:1;
    clip-path:none
  }
  .immersive-tour {
    margin-left:0;
    margin-right:0;
    border-radius:0;
    transition:none
  }
}
@media print {
  .premium-reveal {
    opacity:1;
    clip-path:none
  }
  .review-track {
    display:block;
    overflow:visible
  }
  .review-slide {
    break-inside:avoid
  }
  .review-navigation,.brand-ribbon,.closing-cta {
    display:none
  }
  .pin-section {
    height:auto!important
  }
}
.subhero-editorial {
  padding:45px 0 55px;
  background:#edf0e5
}
.subhero-editorial>.wrap {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:7%;
  align-items:center
}
.subhero-copy h1 {
  font-size:clamp(43px,5vw,75px);
  line-height:1.05;
  letter-spacing:-.06em;
  margin:20px 0 25px
}
.subhero-copy p {
  font-size:13px;
  line-height:1.8
}
.subhero-photo {
  height:350px;
  overflow:hidden
}
.subhero-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 28%
}
.subhero .breadcrumb {
  font-size:9px
}
.article {
  max-width:850px
}
.article>p {
  font-size:15px;
  line-height:1.95
}
.gallery {
  gap:18px
}
.gallery button,.gallery img {
  border-radius:0
}
.gallery img {
  height:300px
}
.gallery button {
  overflow:hidden
}
.article div[id^="doktor-"] {
  clear:both;
  border-top:1px solid #d4ddc6;
  margin-top:50px
}
.article div[id^="doktor-"]:first-child {
  margin-top:0
}
.article div[id^="doktor-"] img {
  border-radius:0!important
}
.article div[id^="doktor-"] h2 {
  padding-top:12px;
  font-size:34px!important;
  line-height:1.2
}
.subhero:not(.subhero-editorial) h1 {
  letter-spacing:-.06em
}
.services .service h3 {
  font-size:23px
}
.services .service p {
  font-size:12px
}
@media(max-width:720px) {
  .subhero-editorial {
    padding:30px 0 35px
  }
  .subhero-editorial>.wrap {
    grid-template-columns:1fr;
    gap:25px
  }
  .subhero-copy h1 {
    font-size:43px;
    overflow-wrap:normal;
    hyphens:auto
  }
  .subhero-photo {
    height:275px
  }
  .subhero-copy p {
    font-size:12px
  }
  .gallery img {
    height:200px
  }
  .gallery {
    gap:10px
  }
  .article>p {
    font-size:14px;
    line-height:1.9
  }
  .article div[id^="doktor-"] img {
    float:none!important;
    margin:0 0 25px!important;
    width:100%!important;
    max-height:450px;
    object-fit:cover;
    object-position:top
  }
  .article div[id^="doktor-"] h2 {
    font-size:31px!important
  }
  .article div[id^="doktor-"] {
    margin-top:40px;
    padding-top:30px!important
  }
  .article h3 {
    font-size:24px
  }
  .subhero-copy .eyebrow {
    margin-top:25px!important
  }
}
/* Equal complete groups include their trailing spacing, so -50% is exactly one cycle. */
.brand-ribbon>.ribbon-track {
  display:flex;
  align-items:center;
  gap:0;
  width:max-content;
  animation:ribbon-seamless 42s linear infinite;
  will-change:transform
}
.ribbon-group {
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:48px;
  flex:0 0 auto;
  width:max-content;
  min-width:100vw;
  padding:0 24px;
  box-sizing:border-box
}
.ribbon-group>* {
  flex:0 0 auto
}
@keyframes ribbon-seamless {
  from {
    transform:translate3d(0,0,0)
  }
  to {
    transform:translate3d(-50%,0,0)
  }
}
@media(max-width:720px) {
  .ribbon-group {
    gap:30px;
    padding-inline:15px
  }
}
@media(prefers-reduced-motion:reduce) {
  .brand-ribbon>.ribbon-track {
    animation:none;
    transform:none;
    will-change:auto;
    width:100%
  }
  .ribbon-group {
    width:100%;
    min-width:0;
    flex-wrap:wrap;
    justify-content:center;
    gap:15px;
    padding:0 20px
  }
  .ribbon-group+.ribbon-group {
    display:none
  }
}
/* Preserve the entire supplied team portrait in biography dialogs. */
.profile-dialog .profile-portrait {
  object-fit:contain;
  object-position:center;
  background:#e7e9e1
}
/* gallery.css */
/* Inline galleries: native swipe and snap, with explicit desktop controls. */
.gallery.gallery-rail {
  display:flex;
  gap:18px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  margin-top:20px;
  padding-bottom:4px;
  -webkit-overflow-scrolling:touch
}
.gallery-rail::-webkit-scrollbar {
  display:none
}
.gallery.gallery-rail .gallery-item {
  flex:0 0 calc((100% - 36px)/3);
  scroll-snap-align:start;
  position:relative;
  min-width:0;
  isolation:isolate
}
.gallery.gallery-rail img {
  width:100%;
  height:310px;
  object-fit:cover
}
.gallery-rail .gallery-item:after {
  content:'↗';
  position:absolute;
  right:14px;
  bottom:14px;
  width:35px;
  height:35px;
  border-radius:50%;
  background:#f7f7f0e8;
  color:#193038;
  display:grid;
  place-items:center;
  font-size:18px;
  pointer-events:none;
  opacity:0;
  transition:opacity .25s
}
.gallery-rail .gallery-item:hover:after,.gallery-rail .gallery-item:focus-visible:after {
  opacity:1
}
.gallery-toolbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  border-top:1px solid #d3ddc5;
  padding-top:26px;
  margin-top:45px
}
.gallery-toolbar>div {
  display:flex;
  align-items:center;
  gap:15px
}
.gallery-inline-label {
  font-size:9px;
  letter-spacing:.17em;
  color:#65794c
}
.gallery-inline-count {
  font-size:10px;
  color:#8c9a7e;
  letter-spacing:.08em
}
.gallery-toolbar button {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid #cbd6bb;
  border-radius:50%;
  background:transparent;
  color:#193038;
  font-size:19px;
  transition:.2s
}
.gallery-toolbar button:hover:enabled {
  background:#193038;
  color:#fff;
  border-color:#193038
}
.gallery-toolbar button:disabled {
  opacity:.3;
  cursor:default
}
/* The full-screen viewer overrides the earlier simple lightbox. */
.lightbox.gallery-dialog {
  position:fixed;
  inset:0;
  margin:auto;
  width:100vw;
  max-width:100vw;
  height:100dvh;
  max-height:100dvh;
  border:0;
  padding:0;
  background:#10262cf7;
  color:#f7f7f0;
  overflow:hidden
}
.gallery-dialog::backdrop {
  background:#10262c;
  backdrop-filter:blur(10px)
}
.gallery-viewer {
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  padding:20px 30px 16px;
  gap:12px
}
.gallery-viewer-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  position:relative;
  z-index:2
}
.gallery-viewer-top>div {
  display:flex;
  align-items:center;
  gap:25px
}
#gallery-title {
  font-size:9px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#c8d5c3
}
.gallery-position {
  font-size:11px;
  letter-spacing:.15em;
  color:#b2c4bd
}
.gallery-close {
  border:1px solid #ffffff40;
  border-radius:50%;
  background:none;
  color:white;
  width:42px;
  height:42px;
  font-size:28px;
  line-height:1;
  display:grid;
  place-items:center
}
.gallery-close:hover {
  background:#ffffff15
}
.gallery-canvas {
  position:relative;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center
}
.gallery-stage {
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 75px;
  touch-action:pan-y pinch-zoom;
  user-select:none;
  -webkit-user-select:none
}
.lightbox.gallery-dialog .gallery-large {
  width:100%;
  height:100%;
  max-height:100%;
  object-fit:contain;
  margin:0;
  opacity:1;
  transition:opacity .18s,transform .22s;
  user-select:none;
  -webkit-user-drag:none
}
.gallery-stage.is-changing .gallery-large {
  opacity:.5;
  transform:scale(.99)
}
.gallery-prev,.gallery-next {
  position:absolute;
  top:50%;
  translate:0 -50%;
  width:48px;
  height:48px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#ffffff08;
  border:1px solid #ffffff40;
  color:white;
  font-size:24px;
  transition:.25s;
  z-index:3
}
.gallery-prev {
  left:5px
}
.gallery-next {
  right:5px
}
.gallery-prev:hover,.gallery-next:hover {
  background:#d0e18e;
  color:#193038;
  border-color:#d0e18e
}
.gallery-viewer-bottom {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
  min-height:0;
  background:none;
  padding:0
}
.gallery-caption {
  font-size:11px;
  color:#c4d4cb;
  line-height:1.4;
  margin:0;
  text-align:center
}
.gallery-thumbnails {
  position:relative;
  display:flex;
  gap:9px;
  max-width:100%;
  overflow-x:auto;
  scrollbar-width:none;
  padding:3px 0;
  min-height:0;
  overscroll-behavior-x:contain
}
.gallery-thumbnails::-webkit-scrollbar {
  display:none
}
.gallery-thumb {
  flex:0 0 68px;
  width:68px;
  height:49px;
  padding:2px;
  border:1px solid transparent;
  background:none;
  opacity:.45;
  transition:opacity .25s,border-color .25s
}
.gallery-thumb.selected {
  opacity:1;
  border-color:#d0e18e
}
.gallery-thumb:hover {
  opacity:1
}
.lightbox.gallery-dialog .gallery-thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  max-height:none;
  margin:0
}
.gallery-help {
  font-size:9px;
  letter-spacing:.04em;
  color:#8ca39b
}
.gallery-load-error {
  position:absolute;
  bottom:10px;
  left:10%;
  right:10%;
  text-align:center;
  background:#10262cdd;
  color:#e7eddc;
  padding:10px;
  font-size:12px
}
.gallery-dialog [hidden] {
  display:none!important
}
.gallery-dialog button:focus-visible {
  outline:2px solid #d0e18e;
  outline-offset:3px
}
@media(max-width:1000px) {
  .gallery.gallery-rail .gallery-item {
    flex-basis:calc((100% - 18px)/2)
  }
}
@media(max-width:720px) {
  .gallery.gallery-rail {
    gap:12px
  }
  .gallery.gallery-rail .gallery-item {
    flex-basis:86%
  }
  .gallery.gallery-rail img {
    height:290px
  }
  .gallery-rail .gallery-item:after {
    opacity:1;
    width:30px;
    height:30px;
    font-size:16px;
    bottom:12px;
    right:12px
  }
  .gallery-toolbar {
    margin-top:35px;
    padding-top:20px
  }
  .gallery-toolbar button {
    width:38px;
    height:38px;
    font-size:18px
  }
  .gallery-inline-label {
    font-size:8px
  }
  .gallery-inline-count {
    font-size:9px
  }
  .gallery-toolbar>div {
    gap:10px
  }
  .gallery-viewer {
    padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px));
    gap:10px
  }
  .gallery-viewer-top {
    padding-top:env(safe-area-inset-top,0px)
  }
  .gallery-viewer-top>div {
    display:block
  }
  #gallery-title {
    display:block;
    font-size:8px;
    margin-bottom:6px
  }
  .gallery-position {
    font-size:10px
  }
  .gallery-close {
    width:38px;
    height:38px;
    font-size:26px
  }
  .gallery-stage {
    padding:0 2px 35px
  }
  .gallery-prev,.gallery-next {
    top:auto;
    bottom:0;
    translate:0 0;
    width:37px;
    height:37px;
    font-size:20px;
    background:#10262ce0
  }
  .gallery-prev {
    left:calc(50% - 45px)
  }
  .gallery-next {
    right:calc(50% - 45px)
  }
  .gallery-caption {
    font-size:10px;
    max-width:90%;
    line-height:1.4
  }
  .gallery-viewer-bottom {
    gap:9px
  }
  .gallery-thumbnails {
    gap:6px
  }
  .gallery-thumb {
    flex-basis:54px;
    width:54px;
    height:41px
  }
  .gallery-help {
    font-size:8px
  }
  .gallery-load-error {
    bottom:40px;
    font-size:10px
  }
}
@media(max-height:500px) {
  .gallery-help,.gallery-caption {
    display:none
  }
  .gallery-thumb {
    height:35px;
    width:50px;
    flex-basis:50px
  }
  .gallery-viewer {
    padding:8px 18px;
    gap:5px
  }
  .gallery-close {
    width:30px;
    height:30px;
    font-size:22px
  }
  .gallery-stage {
    padding:0 55px
  }
  .gallery-prev,.gallery-next {
    top:50%;
    bottom:auto;
    translate:0 -50%;
    width:34px;
    height:34px
  }
  .gallery-prev {
    left:4px
  }
  .gallery-next {
    right:4px
  }
}
@media(prefers-reduced-motion:reduce) {
  .gallery-large,.gallery-thumb,.gallery-toolbar button {
    transition:none!important
  }
  .gallery-stage.is-changing .gallery-large {
    transform:none
  }
}
@media print {
  .gallery.gallery-rail {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    overflow:visible
  }
  .gallery-toolbar {
    display:none
  }
  .gallery-dialog {
    display:none!important
  }
}
/* ios.css */
/* Draw UI controls as vectors; iOS never substitutes emoji/font glyphs. */
.ui-icon {
  display:inline-block;
  vertical-align:-.15em;
  width:1em;
  height:1em;
  min-width:1em;
  flex:0 0 auto;
  overflow:visible;
  pointer-events:none;
  stroke-width:1.5;
  fill:none;
  stroke:currentColor
}
.menu-toggle,.gallery-close,.gallery-prev,.gallery-next,.dialog-close,.back-to-top,.review-navigation button,.gallery-toolbar button,.hero-doctor>a,.mobile-call {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  padding:0;
  -webkit-appearance:none;
  appearance:none
}
.menu-toggle .ui-icon {
  width:22px;
  height:22px
}
.btn .ui-icon {
  width:19px;
  height:19px
}
.arrow .ui-icon {
  width:20px;
  height:20px
}
.cinema-play .ui-icon {
  width:25px;
  height:25px;
  fill:currentColor;
  stroke-width:1
}
.hero-asterisk .ui-icon {
  width:38px;
  height:38px;
  stroke-width:1
}
.ribbon-group i .ui-icon {
  width:26px;
  height:26px;
  stroke-width:1.2
}
.gallery-close .ui-icon,.dialog-close .ui-icon {
  width:20px;
  height:20px
}
.gallery-prev .ui-icon,.gallery-next .ui-icon {
  width:21px;
  height:21px
}
.gallery-toolbar button .ui-icon,.review-navigation button .ui-icon {
  width:18px;
  height:18px
}
.mobile-call {
  display:none
}
.hero-discover b,.closing-cta b {
  display:flex;
  align-items:center;
  justify-content:center
}
.hero-doctor>a .ui-icon {
  width:19px;
  height:19px
}
.dropdown summary .ui-icon {
  width:12px;
  height:12px
}
.hero-services-link>span {
  display:inline-flex
}
.pin-photo-corner .ui-icon {
  width:30px;
  height:30px;
  stroke-width:1
}
.pin-link>span {
  display:inline-flex
}
.hero-foot a>.ui-icon,.text-link>.ui-icon,.footer a>.ui-icon,.treatment-extra a>.ui-icon {
  width:14px;
  height:14px;
  margin-left:4px
}
.gallery-thumb img {
  pointer-events:none
}
/* Pseudo-elements use the same vector arrow. */
.team .person:after,.gallery-rail .gallery-item:after {
  content:'';
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23193038' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M6 6h12v12'/%3E%3C/svg%3E");
  background-size:17px 17px;
  background-repeat:no-repeat;
  background-position:center
}
@media(min-width:721px) {
  .menu-toggle {
    display:none
  }
}
/* A fixed mobile header avoids Safari sticky/compositing drift entirely. */
@media(max-width:720px) {
  :root {
    --mobile-header-height:calc(70px + env(safe-area-inset-top,0px));
    --mobile-bar-height:calc(66px + env(safe-area-inset-bottom,0px))
  }
  html {
    scroll-padding-top:calc(var(--mobile-header-height) + 16px)
  }
  body {
    padding-top:var(--mobile-header-height)
  }
  body.navigation-open {
    overflow:hidden
  }
  .topbar {
    display:none
  }
  body>.header,body>.header.scrolled {
    position:fixed!important;
    inset:0 0 auto 0!important;
    top:0!important;
    bottom:auto!important;
    width:100%;
    height:var(--mobile-header-height);
    padding-top:env(safe-area-inset-top,0px);
    margin:0;
    z-index:1000;
    background:#f7f7f0!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    transform:none!important;
    translate:none!important;
    filter:none!important;
    isolation:isolate;
    border-bottom:1px solid #dce2d3;
    box-shadow:0 3px 15px #19303808;
    overflow:visible
  }
  .header .nav {
    height:70px;
    width:100%;
    min-height:70px;
    display:flex;
    align-items:center;
    gap:10px;
    padding-left:max(20px,env(safe-area-inset-left,0px));
    padding-right:max(20px,env(safe-area-inset-right,0px))
  }
  .header .logo {
    width:140px;
    flex:0 0 140px;
    margin-right:auto;
    display:flex;
    align-items:center
  }
  .header .logo img {
    width:140px;
    height:auto;
    max-height:54px;
    object-fit:contain
  }
  .header .menu-toggle,.header .mobile-call {
    display:inline-flex;
    flex:0 0 40px;
    width:40px;
    height:40px;
    border:1px solid #d4deca;
    border-radius:50%;
    background:none;
    color:#193038;
    margin:0
  }
  .header .mobile-call .ui-icon {
    width:18px;
    height:18px
  }
  .header .menu-toggle[aria-expanded="true"] {
    background:#193038;
    color:#f7f7f0;
    border-color:#193038
  }
  .header .navlinks {
    position:absolute;
    top:100%;
    left:0;
    right:0;
    width:100%;
    margin:0;
    padding:25px max(22px,env(safe-area-inset-left,0px)) 30px;
    background:#f7f7f0;
    max-height:calc(100dvh - var(--mobile-header-height) - var(--mobile-bar-height));
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    box-shadow:0 16px 25px #19303814;
    border-bottom:1px solid #d4deca
  }
  .header .navlinks>a,.header .navlinks>details>summary {
    font-size:15px;
    min-height:35px;
    display:flex;
    align-items:center;
    justify-content:space-between
  }
  .header .dropdown .mega-menu {
    position:static;
    transform:none;
    width:100%;
    max-width:100%;
    padding:0;
    margin-top:14px
  }
  .header .dropdown .mega-links>a {
    padding:13px 0;
    font-size:12px
  }
  .pin-section {
    --pin-top:var(--mobile-header-height)
  }
  .pin-enabled .pin-screen {
    top:var(--mobile-header-height);
    height:calc(100svh - var(--mobile-header-height) - var(--mobile-bar-height));
    min-height:340px
  }
  .treatment-visual {
    top:var(--mobile-header-height)
  }
  .mobilebar {
    z-index:900;
    min-height:var(--mobile-bar-height);
    padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));
    padding-left:max(16px,env(safe-area-inset-left,0px));
    padding-right:max(16px,env(safe-area-inset-right,0px))
  }
  .mobilebar a {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-size:11px;
    min-height:40px
  }
  .mobilebar .ui-icon {
    width:14px;
    height:14px
  }
  .back-to-top {
    bottom:calc(var(--mobile-bar-height) + 15px);
    z-index:950
  }
  .hero-discover b .ui-icon {
    width:22px;
    height:22px
  }
  .hero-asterisk .ui-icon {
    width:32px;
    height:32px
  }
  .ribbon-group i .ui-icon {
    width:22px;
    height:22px
  }
  .pin-photo-corner .ui-icon {
    width:25px;
    height:25px
  }
  .booking-form input,.booking-form select,.booking-form textarea,.form input,.form textarea {
    font-size:16px
  }
}
@media(max-width:350px) {
  .header .logo,.header .logo img {
    width:125px
  }
  .header .logo {
    flex-basis:125px
  }
  .header .nav {
    padding-left:16px;
    padding-right:16px;
    gap:8px
  }
}
@media print {
  body {
    padding-top:0
  }
  .header {
    position:static!important
  }
  .mobile-call {
    display:none
  }
}
@media(max-width:720px) {
  .reading-progress {
    z-index:1100
  }
}