
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Manrope:wght@300;400;500;600&display=swap');

:root{
  --teal:#0b7978;
  --gold:#b48d42;
  --ink:#112725;
  --muted:#6c7976;
  --line:#dfe5e2;
  --soft:#f6f7f5;
  --cream:#fbf7ef;
  --white:#fff;
  --max:1480px;
  --pad:clamp(22px,4vw,64px);
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  background:#fff;
}

body{
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:"Manrope",sans-serif;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body.menu-open{overflow:hidden}

a{
  color:inherit;
  text-decoration:none;
}

img{
  display:block;
  width:100%;
}

button,input,select,textarea{
  font:inherit;
}

button{cursor:pointer}

.shell{
  width:min(calc(100% - 52px),var(--max));
  margin:auto;
}

.grain{
  position:fixed;
  inset:0;
  z-index:999;
  pointer-events:none;
  opacity:.023;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}

.site-progress{
  position:fixed;
  z-index:1002;
  top:0;
  left:0;
  width:100%;
  height:2px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:left center;
}

.site-header{
  position:fixed;
  z-index:100;
  top:16px;
  left:50%;
  transform:translateX(-50%);
  width:min(calc(100% - 34px),1480px);
  height:68px;
  padding:8px 8px 8px 17px;
  display:grid;
  grid-template-columns:165px 1fr auto;
  align-items:center;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(17,39,37,.09);
  backdrop-filter:blur(20px);
  transition:.35s ease;
}

.site-header.scrolled{
  top:8px;
  height:60px;
  box-shadow:0 16px 55px rgba(20,50,46,.06);
}

.brand{width:124px}

.desktop-nav{
  justify-self:center;
  display:flex;
  gap:32px;
}

.desktop-nav a{
  position:relative;
  font-size:10px;
  font-weight:500;
}

.desktop-nav a:after{
  content:"";
  position:absolute;
  bottom:-7px;
  left:0;
  right:100%;
  height:1px;
  background:var(--teal);
  transition:.3s;
}

.desktop-nav a:hover:after,
.desktop-nav a.active:after{
  right:0;
}

.header-book{
  width:180px;
  height:50px;
  padding:0 17px;
  background:var(--teal);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:10px;
  font-weight:500;
}

.header-book i{
  font-style:normal;
  transition:.25s;
}

.header-book:hover i{
  transform:translate(3px,-3px);
}

.menu-button{
  display:none;
  width:44px;
  height:44px;
  border:0;
  background:transparent;
}

.menu-button span{
  display:block;
  width:22px;
  height:1px;
  margin:6px auto;
  background:var(--ink);
  transition:.3s;
}

.mobile-menu{
  display:none;
}


/* COMMON TYPOGRAPHY */

.section-index{
  display:flex;
  gap:13px;
  align-items:center;
  color:#899592;
  font-size:9px;
  font-weight:600;
  letter-spacing:.15em;
}

.section-index span{
  color:var(--teal);
}

.page-eyebrow,
.micro-heading{
  color:#87928f;
  font-size:9px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.underline-link{
  display:inline-flex;
  align-items:center;
  gap:28px;
  padding-bottom:7px;
  border-bottom:1px solid #bcc7c4;
  font-size:10px;
  font-weight:500;
}

.underline-link span{
  transition:.25s;
}

.underline-link:hover span{
  transform:translate(3px,-3px);
}


/* HOME HERO */

.home-hero{
  min-height:100vh;
  position:relative;
  padding:126px var(--pad) 34px;
  overflow:hidden;
  background:#fff;
}

.hero-backword{
  position:absolute;
  left:-1vw;
  bottom:2.7vw;
  color:rgba(11,121,120,.032);
  white-space:nowrap;
  font-size:13.5vw;
  font-weight:500;
  line-height:.7;
  letter-spacing:-.075em;
}

.hero-content{
  width:min(100%,1530px);
  min-height:calc(100vh - 190px);
  margin:auto;
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:3vw;
  align-items:center;
}

.hero-left{
  position:relative;
  z-index:3;
}

.eyebrow{
  margin-bottom:48px;
  display:flex;
  align-items:center;
  gap:13px;
  color:#7d8986;
  font-size:9px;
  font-weight:600;
  letter-spacing:.16em;
}

.eyebrow span{
  width:36px;
  height:1px;
  background:var(--gold);
}

.home-hero h1{
  margin:0;
  font-size:clamp(78px,8.9vw,162px);
  line-height:.76;
  letter-spacing:-.076em;
  font-weight:300;
}

.home-hero h1>span{
  display:block;
}

.hero-offset{
  padding-left:6%;
}

.home-hero .hero-script{
  padding-left:23%;
  color:var(--gold);
  font-family:"DM Serif Display",serif;
  font-style:italic;
  letter-spacing:-.04em;
}

.hero-copy-row{
  width:min(650px,95%);
  margin-top:58px;
  padding-top:25px;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr auto;
  gap:35px;
  align-items:center;
}

.hero-copy-row p{
  max-width:390px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}

.circle-cta,
.round-outline{
  width:114px;
  height:114px;
  border:1px solid #bcc6c3;
  border-radius:50%;
  padding:18px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:.35s;
}

.circle-cta:hover,
.round-outline:hover{
  color:#fff;
  background:var(--teal);
  border-color:var(--teal);
}

.circle-cta span,
.round-outline span{
  font-size:8px;
  font-weight:500;
  line-height:1.5;
}

.circle-cta i,
.round-outline i{
  align-self:flex-end;
  font-style:normal;
}

.hero-media{
  min-height:700px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}

.hero-photo{
  width:79%;
  height:min(73vh,760px);
  overflow:hidden;
  position:relative;
}

.hero-photo>img{
  height:100%;
  object-fit:cover;
  transform:scale(1.04);
}

.image-wipe{
  position:absolute;
  inset:0;
  background:var(--teal);
  transform-origin:right;
}

.hero-mini{
  position:absolute;
  z-index:4;
  left:1%;
  bottom:8%;
  width:31%;
  border:9px solid #fff;
  box-shadow:0 25px 70px rgba(20,50,46,.09);
}

.hero-mini img{
  aspect-ratio:4/5;
  object-fit:cover;
}

.hero-seal{
  position:absolute;
  z-index:5;
  right:-5px;
  top:14%;
  width:130px;
  height:130px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 18px 55px rgba(20,50,46,.09);
  display:grid;
  place-items:center;
  color:var(--teal);
}

.hero-seal svg{
  position:absolute;
  inset:7px;
  width:calc(100% - 14px);
  height:calc(100% - 14px);
  animation:seal-spin 19s linear infinite;
}

.hero-seal text{
  font:7px "Manrope",sans-serif;
  letter-spacing:1.25px;
  fill:var(--teal);
}

.hero-seal strong{
  font:400 26px "DM Serif Display",serif;
}

@keyframes seal-spin{
  to{transform:rotate(360deg)}
}

.hero-location{
  position:absolute;
  right:2%;
  bottom:7%;
  width:210px;
  padding:18px 18px 17px;
  background:#fff;
  border-top:2px solid var(--gold);
}

.hero-location small{
  display:block;
  margin-bottom:8px;
  color:var(--gold);
  font-size:8px;
  letter-spacing:.14em;
}

.hero-location span{
  font-size:10px;
}

.hero-foot{
  width:100%;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:17px;
  align-items:center;
  color:#8b9693;
  font-size:7px;
  letter-spacing:.15em;
}

.hero-foot i{
  height:1px;
  background:var(--line);
}


/* HOME STATEMENT */

.editorial-statement{
  padding:180px 0 210px;
  background:#fff;
}

.statement-layout{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
}

.statement-layout h2{
  margin:0;
  max-width:1050px;
  font-size:clamp(60px,6.5vw,105px);
  line-height:.93;
  letter-spacing:-.067em;
  font-weight:300;
}

.statement-layout h2 em{
  display:block;
  margin-left:12%;
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.statement-copy{
  width:65%;
  margin:65px 0 0 auto;
  padding-top:24px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:60px;
}

.statement-copy p{
  max-width:470px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}


/* SERVICE INDEX */

.service-index-section{
  padding:140px 0 180px;
  background:#fff;
}

.service-index-heading{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
  margin-bottom:70px;
}

.service-index-heading h2{
  margin:15px 0 0;
  max-width:1000px;
  font-size:clamp(56px,5.6vw,88px);
  line-height:.94;
  letter-spacing:-.062em;
  font-weight:300;
}

.service-index-heading h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.service-index-layout{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:5vw;
  align-items:start;
}

.service-list{
  border-top:1px solid var(--line);
}

.service-row{
  min-height:91px;
  display:grid;
  grid-template-columns:52px 1fr auto;
  align-items:center;
  border-bottom:1px solid var(--line);
  transition:.3s;
}

.service-row>span{
  color:var(--gold);
  font-size:9px;
}

.service-row strong{
  font-size:clamp(21px,2vw,30px);
  font-weight:300;
  letter-spacing:-.035em;
}

.service-row i{
  width:38px;
  height:38px;
  border:1px solid #cbd3d1;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-style:normal;
  transition:.3s;
}

.service-row:hover,
.service-row.active{
  padding-left:12px;
  color:var(--teal);
}

.service-row:hover i,
.service-row.active i{
  color:#fff;
  background:var(--teal);
  border-color:var(--teal);
  transform:rotate(45deg);
}

.services-all{
  margin-top:28px;
  display:inline-flex;
  gap:25px;
  align-items:center;
  font-size:10px;
  font-weight:500;
}

.service-visual{
  position:sticky;
  top:110px;
  height:600px;
  overflow:hidden;
  background:#f2f3f1;
}

.service-visual-panel{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transform:scale(1.03);
  transition:
    opacity .55s ease,
    visibility .55s,
    transform .7s cubic-bezier(.2,.8,.2,1);
}

.service-visual-panel.active{
  opacity:1;
  visibility:visible;
  transform:scale(1);
}

.service-visual-panel>img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.service-visual-panel:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(10,40,37,.45),transparent 55%);
  pointer-events:none;
}

.service-visual-panel p{
  position:absolute;
  z-index:3;
  left:24px;
  bottom:24px;
  margin:0;
  color:#fff;
  font-size:9px;
  letter-spacing:.1em;
}

.visual-number{
  position:absolute;
  z-index:4;
  right:20px;
  top:12px;
  color:rgba(255,255,255,.72);
  font-family:"DM Serif Display",serif;
  font-size:90px;
}

.abstract-panel:after{
  display:none;
}

.abstract-panel p{
  color:var(--ink);
}

.abstract-panel .visual-number{
  color:rgba(11,121,120,.12);
}

.abstract-teal{
  background:#f1f7f6;
}

.abstract-gold{
  background:#fbf7ef;
}

.abstract-soft{
  background:#f6f7f5;
}

.abstract-orbits,
.needle-art,
.naturo-art{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
}

.abstract-orbits i{
  grid-area:1/1;
  width:130px;
  height:130px;
  border:1px solid rgba(11,121,120,.32);
  border-radius:50%;
}

.abstract-orbits i:nth-child(2){
  width:250px;
  height:250px;
}

.abstract-orbits i:nth-child(3){
  width:390px;
  height:390px;
}

.needle-art i{
  grid-area:1/1;
  display:block;
  width:1px;
  height:340px;
  background:rgba(180,141,66,.55);
  transform:rotate(-30deg);
}

.needle-art i:nth-child(2){transform:translateX(-75px) rotate(-22deg)}
.needle-art i:nth-child(3){transform:translateX(75px) rotate(-38deg)}
.needle-art i:nth-child(4){transform:translateX(-145px) rotate(-15deg)}
.needle-art i:nth-child(5){transform:translateX(145px) rotate(-45deg)}

.naturo-art span{
  grid-area:1/1;
  width:230px;
  height:330px;
  border:1px solid rgba(11,121,120,.28);
  border-radius:50% 50% 50% 0;
  transform:rotate(38deg);
}

.naturo-art span:nth-child(2){
  transform:translate(-70px,45px) rotate(12deg) scale(.65);
}

.naturo-art span:nth-child(3){
  transform:translate(85px,70px) rotate(68deg) scale(.52);
}


/* BRAND STATEMENT */

.brand-statement{
  padding:190px 0 210px;
  overflow:hidden;
  background:#fff;
}

.brand-statement-line{
  padding-bottom:24px;
  border-bottom:1px solid var(--gold);
  display:flex;
  gap:14px;
  color:#8a9693;
  font-size:9px;
  letter-spacing:.15em;
}

.brand-statement-line span{
  color:var(--gold);
}

.brand-statement h2{
  margin:80px 0 0;
  font-size:clamp(64px,7.4vw,120px);
  line-height:.8;
  letter-spacing:-.073em;
  font-weight:300;
}

.brand-statement h2 span{
  display:block;
  padding-left:6%;
  color:var(--teal);
}

.brand-statement h2 em{
  display:block;
  padding-left:28%;
  color:var(--gold);
  font-family:"DM Serif Display",serif;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.04em;
}

.brand-statement-footer{
  width:63%;
  margin:70px 0 0 auto;
  display:flex;
  gap:70px;
  align-items:center;
}

.brand-statement-footer p{
  max-width:470px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}


/* CLINIC HOME */

.clinic-preview{
  padding:150px 0 190px;
  background:#fff;
}

.clinic-preview-head{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
  margin-bottom:65px;
}

.clinic-preview-head h2{
  margin:0;
  font-size:clamp(58px,6.3vw,100px);
  line-height:.92;
  letter-spacing:-.065em;
  font-weight:300;
}

.clinic-preview-head h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.clinic-collage{
  min-height:790px;
  position:relative;
}

.clinic-collage figure{
  margin:0;
  overflow:hidden;
}

.clinic-photo-large{
  width:72%;
  height:660px;
}

.clinic-photo-large img,
.clinic-photo-small img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.clinic-photo-small{
  position:absolute;
  width:31%;
  height:390px;
  right:0;
  top:120px;
  border:12px solid #fff;
}

.clinic-info-card{
  position:absolute;
  width:28%;
  right:2%;
  bottom:15px;
  padding-top:22px;
  border-top:1px solid var(--line);
}

.clinic-info-card>small{
  color:var(--gold);
  font-size:8px;
  letter-spacing:.14em;
}

.clinic-info-card>strong{
  display:block;
  margin:18px 0;
  font-size:18px;
  line-height:1.35;
  font-weight:400;
}

.hours-mini{
  margin:25px 0;
  display:grid;
  grid-template-columns:80px 1fr;
  gap:8px 16px;
  font-size:8px;
}

.hours-mini span{
  color:#8c9794;
}

.hours-mini b{
  font-weight:400;
}

.clinic-info-card>a{
  font-size:9px;
  font-weight:500;
}

.clinic-gold-ring{
  position:absolute;
  left:68%;
  top:36px;
  width:120px;
  height:120px;
  display:grid;
  place-items:center;
  background:#fff;
  border:1px solid var(--gold);
  border-radius:50%;
}

.clinic-gold-ring:after{
  content:"";
  position:absolute;
  inset:9px;
  border:1px dashed rgba(180,141,66,.45);
  border-radius:50%;
}

.clinic-gold-ring span{
  color:var(--gold);
  font:400 27px "DM Serif Display",serif;
}


/* HOME BOOKING */

.home-booking{
  position:relative;
  padding:170px 0 140px;
  overflow:hidden;
  background:#fff;
}

.home-booking-ghost{
  position:absolute;
  left:-1vw;
  bottom:-1vw;
  white-space:nowrap;
  color:rgba(11,121,120,.035);
  font-size:17vw;
  line-height:.7;
  font-weight:500;
  letter-spacing:-.08em;
}

.home-booking-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr auto;
  gap:80px;
  align-items:center;
}

.home-booking h2{
  margin:45px 0 28px;
  font-size:clamp(75px,8vw,130px);
  line-height:.77;
  letter-spacing:-.075em;
  font-weight:300;
}

.home-booking h2 em{
  display:block;
  padding-left:8%;
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.04em;
}

.home-booking p{
  max-width:420px;
  margin-left:9%;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}

.booking-orb{
  position:relative;
  width:280px;
  height:280px;
  border-radius:50%;
  background:var(--teal);
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
}

.booking-orb>span{
  text-align:center;
  font-size:11px;
  font-weight:500;
  line-height:1.5;
}

.booking-orb>i{
  margin-top:23px;
  font-size:22px;
  font-style:normal;
}

.booking-orb svg{
  position:absolute;
  inset:9px;
  width:calc(100% - 18px);
  height:calc(100% - 18px);
  fill:none;
  stroke:rgba(255,255,255,.45);
  stroke-width:.55;
  stroke-dasharray:3 5;
  animation:seal-spin 20s linear infinite;
}


/* INTERNAL PAGE HERO */

.page-hero{
  min-height:76vh;
  padding:190px 0 100px;
  display:flex;
  align-items:flex-end;
  background:#fff;
}

.compact-page-hero{
  min-height:68vh;
}

.page-hero-grid{
  display:grid;
  grid-template-columns:3fr 1fr;
  gap:6vw;
  align-items:end;
}

.page-hero h1{
  margin:40px 0 0;
  font-size:clamp(76px,8vw,130px);
  line-height:.78;
  letter-spacing:-.073em;
  font-weight:300;
}

.page-hero h1 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
  font-style:italic;
  letter-spacing:-.04em;
}

.page-hero-grid>p{
  max-width:330px;
  margin:0 0 5px;
  padding-top:22px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:12px;
  line-height:1.75;
}


/* ABOUT / CONTENT */

.content-section{
  padding:150px 0;
  background:#fff;
}

.split-editorial{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
}

.rich-copy{
  max-width:950px;
}

.rich-copy h2{
  margin:0 0 55px;
  font-size:clamp(54px,5.6vw,88px);
  line-height:.94;
  letter-spacing:-.062em;
  font-weight:300;
}

.rich-copy h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.rich-copy p{
  max-width:650px;
  margin:0 0 24px;
  color:var(--muted);
  font-size:14px;
  line-height:1.9;
}

.rich-copy .underline-link{
  margin-top:20px;
}

.large-image-section{
  padding:30px 0 120px;
}

.wide-image{
  height:min(72vw,760px);
  margin:0;
  overflow:hidden;
}

.wide-image img{
  height:110%;
  object-fit:cover;
}


/* SERVICES DETAIL */

.service-detail-list{
  padding:40px 0 130px;
}

.service-detail{
  padding:100px 0;
  border-top:1px solid var(--line);
}

.service-detail-grid{
  display:grid;
  grid-template-columns:65px 1fr 38%;
  gap:4vw;
  align-items:center;
}

.service-detail-number{
  align-self:start;
  padding-top:7px;
  color:var(--gold);
  font-size:9px;
}

.service-detail small{
  color:var(--teal);
  font-size:8px;
  letter-spacing:.15em;
  font-weight:600;
}

.service-detail h2{
  margin:25px 0;
  font-size:clamp(48px,5vw,76px);
  line-height:.91;
  letter-spacing:-.06em;
  font-weight:300;
}

.service-detail h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.service-detail p{
  max-width:560px;
  margin:0 0 30px;
  color:var(--muted);
  font-size:12px;
  line-height:1.85;
}

.service-detail figure{
  height:440px;
  margin:0;
  overflow:hidden;
}

.service-detail figure img{
  height:100%;
  object-fit:cover;
}

.detail-art{
  height:440px;
  position:relative;
  overflow:hidden;
  background:#f4f7f5;
}

.detail-orbit{
  display:grid;
  place-items:center;
}

.detail-orbit i{
  grid-area:1/1;
  width:120px;
  height:120px;
  border:1px solid rgba(11,121,120,.27);
  border-radius:50%;
}

.detail-orbit i:nth-child(2){
  width:240px;
  height:240px;
}

.detail-orbit i:nth-child(3){
  width:370px;
  height:370px;
}

.detail-orbit strong{
  grid-area:1/1;
  color:var(--teal);
  font:400 48px "DM Serif Display",serif;
}

.acupuncture-art{
  background:var(--cream);
}

.acupuncture-art span{
  position:absolute;
  left:50%;
  top:50%;
  width:1px;
  height:340px;
  background:rgba(180,141,66,.5);
  transform:translate(-50%,-50%) rotate(-30deg);
}

.acupuncture-art span:nth-child(2){transform:translate(-120%,-50%) rotate(-23deg)}
.acupuncture-art span:nth-child(3){transform:translate(20%,-50%) rotate(-37deg)}
.acupuncture-art span:nth-child(4){transform:translate(-240%,-50%) rotate(-16deg)}
.acupuncture-art span:nth-child(5){transform:translate(140%,-50%) rotate(-44deg)}

.naturo-detail{
  display:grid;
  place-items:center;
}

.naturo-detail i{
  grid-area:1/1;
  display:block;
  width:190px;
  height:270px;
  border:1px solid rgba(11,121,120,.28);
  border-radius:50% 50% 50% 0;
  transform:rotate(35deg);
}

.naturo-detail i:nth-child(2){
  transform:translate(-70px,40px) rotate(5deg) scale(.65);
}

.naturo-detail i:nth-child(3){
  transform:translate(80px,55px) rotate(70deg) scale(.5);
}


/* PRICING */

.pricing-section{
  padding:50px 0 140px;
}

.pricing-list{
  border-top:1px solid var(--line);
}

.price-group{
  padding:55px 0 65px;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:6vw;
}

.price-title{
  display:flex;
  gap:30px;
  align-items:flex-start;
}

.price-title span{
  padding-top:7px;
  color:var(--gold);
  font-size:9px;
}

.price-title h2{
  margin:0;
  font-size:clamp(34px,3vw,48px);
  line-height:1;
  font-weight:300;
  letter-spacing:-.045em;
}

.price-items>div{
  min-height:66px;
  display:grid;
  grid-template-columns:1fr 120px 100px;
  gap:20px;
  align-items:center;
  border-bottom:1px solid #edf0ef;
}

.price-items>div:last-child{
  border-bottom:0;
}

.price-items strong{
  font-size:11px;
  font-weight:400;
}

.price-items span{
  color:var(--muted);
  font-size:10px;
}

.price-items b{
  text-align:right;
  color:var(--teal);
  font:400 22px "DM Serif Display",serif;
}


/* APPROACH PAGE */

.approach-story{
  padding:80px 0 160px;
}

.approach-story-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:8vw;
}

.approach-sticky{
  position:sticky;
  top:130px;
  align-self:start;
}

.approach-sticky h2{
  margin:40px 0 25px;
  font-size:clamp(54px,5.5vw,86px);
  line-height:.92;
  letter-spacing:-.062em;
  font-weight:300;
}

.approach-sticky h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.approach-sticky p{
  max-width:340px;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}

.approach-steps{
  border-top:1px solid var(--line);
}

.approach-steps article{
  min-height:330px;
  padding:38px 0 50px;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:45px 1fr;
}

.approach-steps article>span{
  color:var(--gold);
  font-size:9px;
}

.approach-steps small{
  color:var(--teal);
  font-size:8px;
  letter-spacing:.15em;
}

.approach-steps h3{
  margin:25px 0 18px;
  font-size:clamp(38px,4vw,58px);
  line-height:.95;
  letter-spacing:-.05em;
  font-weight:300;
}

.approach-steps p{
  max-width:500px;
  color:var(--muted);
  font-size:11px;
  line-height:1.8;
}


/* FAQ */

.faq-section{
  padding:50px 0 150px;
}

.faq-layout{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
}

.accordion{
  border-top:1px solid var(--line);
}

.faq-item{
  border-bottom:1px solid var(--line);
}

.faq-item button{
  width:100%;
  min-height:90px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ink);
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:center;
  text-align:left;
}

.faq-item button span{
  font-size:clamp(18px,2vw,27px);
  font-weight:300;
}

.faq-item button i{
  font-style:normal;
  color:var(--teal);
  font-size:20px;
}

.faq-answer{
  display:none;
  padding:0 70px 30px 0;
}

.faq-item.open .faq-answer{
  display:block;
}

.faq-answer p{
  max-width:690px;
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}


/* CONTACT */

.contact-section{
  padding:60px 0 150px;
}

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:8vw;
  padding-top:45px;
  border-top:1px solid var(--gold);
}

.contact-primary{
  display:flex;
  flex-direction:column;
}

.contact-primary small,
.contact-secondary small{
  margin:0 0 10px;
  color:#899592;
  font-size:8px;
  letter-spacing:.15em;
}

.contact-primary>a{
  margin:0 0 55px;
  font-size:clamp(26px,3vw,44px);
  line-height:1.2;
  letter-spacing:-.04em;
}

.contact-secondary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:35px;
}

.contact-secondary p,
.contact-secondary a{
  color:var(--muted);
  font-size:11px;
  line-height:1.75;
}

.contact-secondary div>a{
  color:var(--ink);
}


/* BOOKING */

.booking-page-section{
  padding:40px 0 150px;
}

.booking-page-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:8vw;
}

.booking-information h2{
  margin:40px 0 25px;
  font-size:clamp(52px,5.5vw,84px);
  line-height:.93;
  letter-spacing:-.06em;
  font-weight:300;
}

.booking-information h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.booking-information>p{
  max-width:370px;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}

.booking-information>p a{
  color:var(--teal);
}

.booking-hours{
  margin-top:50px;
  border-top:1px solid var(--line);
}

.booking-hours>div{
  padding:15px 0;
  border-bottom:1px solid var(--line);
  display:flex;
  justify-content:space-between;
}

.booking-hours span{
  color:#899592;
  font-size:8px;
}

.booking-hours strong{
  font-size:10px;
  font-weight:400;
}

.appointment-form{
  padding:35px;
  border:1px solid var(--line);
}

.appointment-form label{
  display:block;
  margin-bottom:28px;
}

.appointment-form label>span{
  display:block;
  margin-bottom:9px;
  color:#899592;
  font-size:8px;
  letter-spacing:.14em;
}

.appointment-form input,
.appointment-form select,
.appointment-form textarea{
  width:100%;
  padding:0 0 13px;
  color:var(--ink);
  border:0;
  border-bottom:1px solid #ccd4d2;
  outline:0;
  background:transparent;
  font-size:13px;
}

.appointment-form textarea{
  min-height:100px;
  resize:vertical;
}

.appointment-form input:focus,
.appointment-form select:focus,
.appointment-form textarea:focus{
  border-color:var(--teal);
}

.appointment-form button{
  width:100%;
  height:58px;
  padding:0 18px;
  border:0;
  background:var(--teal);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:10px;
  font-weight:500;
}


/* LOCATION */

.location-section{
  padding:60px 0 130px;
}

.location-grid{
  padding-top:45px;
  border-top:1px solid var(--gold);
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:8vw;
}

.location-address small{
  color:#899592;
  font-size:8px;
  letter-spacing:.15em;
}

.location-address h2{
  margin:25px 0 40px;
  font-size:clamp(40px,5vw,70px);
  line-height:1.03;
  letter-spacing:-.055em;
  font-weight:300;
}

.location-details{
  border-top:1px solid var(--line);
}

.location-details>div{
  padding:22px 0;
  border-bottom:1px solid var(--line);
}

.location-details small{
  display:block;
  margin-bottom:9px;
  color:#899592;
  font-size:8px;
  letter-spacing:.15em;
}

.location-details strong,
.location-details a{
  font-size:12px;
  font-weight:400;
}


/* POLICIES */

.policy-section{
  padding:50px 0 150px;
}

.policy-list{
  border-top:1px solid var(--line);
}

.policy-list article{
  padding:48px 0;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:100px 1fr;
}

.policy-list article>span{
  color:var(--gold);
  font-size:9px;
}

.policy-list h2{
  margin:0 0 20px;
  font-size:clamp(30px,3vw,44px);
  font-weight:300;
  letter-spacing:-.04em;
}

.policy-list p{
  max-width:700px;
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.85;
}


/* PRIVACY */

.privacy-section{
  padding:40px 0 160px;
}

.privacy-copy{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:7vw;
  padding-top:45px;
  border-top:1px solid var(--line);
}

.privacy-copy h2{
  max-width:900px;
  margin:0 0 40px;
  font-size:clamp(44px,4.5vw,70px);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:300;
}

.privacy-copy p{
  max-width:700px;
  color:var(--muted);
  font-size:12px;
  line-height:1.85;
}


/* GENERIC CTA */

.simple-cta{
  padding:150px 0;
  border-top:1px solid var(--line);
}

.simple-cta-grid{
  display:grid;
  grid-template-columns:1.5fr .5fr;
  gap:8vw;
  align-items:end;
}

.simple-cta h2{
  margin:0;
  font-size:clamp(58px,6vw,96px);
  line-height:.87;
  letter-spacing:-.065em;
  font-weight:300;
}

.simple-cta h2 em{
  color:var(--teal);
  font-family:"DM Serif Display",serif;
  font-weight:400;
}

.simple-cta p{
  margin:0 0 28px;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}


/* FOOTER */

.footer{
  padding:90px 0 28px;
  border-top:1px solid var(--line);
  background:#fff;
}

.footer-top{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:6vw;
}

.footer-brand img{
  width:150px;
}

.footer-brand p{
  margin:23px 0 0;
  color:var(--muted);
  font-size:10px;
}

.footer-column{
  display:flex;
  flex-direction:column;
  gap:10px;
  font-size:10px;
}

.footer-column small{
  margin-bottom:10px;
  color:#8a9592;
  font-size:8px;
  letter-spacing:.15em;
}

.footer-column p{
  margin:0;
  color:var(--muted);
  line-height:1.7;
}

.footer-word{
  margin-top:105px;
  color:var(--teal);
  font-size:clamp(85px,13vw,200px);
  line-height:.72;
  letter-spacing:-.075em;
  font-weight:400;
}

.footer-word em{
  color:var(--gold);
  font-family:"DM Serif Display",serif;
  font-style:italic;
  font-weight:400;
}

.footer-bottom{
  margin-top:50px;
  padding-top:20px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:#8d9895;
  font-size:7px;
  letter-spacing:.1em;
}


/* TABLET */

@media(max-width:1100px){

  .site-header{
    grid-template-columns:1fr auto;
  }

  .desktop-nav{
    display:none;
  }

  .hero-content{
    grid-template-columns:1fr;
  }

  .hero-media{
    margin-top:30px;
  }

  .service-index-layout{
    grid-template-columns:1fr;
  }

  .service-visual{
    position:relative;
    top:auto;
  }

  .approach-story-grid{
    grid-template-columns:1fr;
  }

  .approach-sticky{
    position:relative;
    top:auto;
  }

}


/* MOBILE */

@media(max-width:720px){

  .shell{
    width:calc(100% - 36px);
  }

  .site-header{
    top:8px;
    width:calc(100% - 16px);
    height:58px;
    padding:6px 7px 6px 11px;
    grid-template-columns:1fr auto auto;
    gap:8px;
  }

  .site-header.scrolled{
    top:6px;
    height:56px;
  }

  .brand{
    width:103px;
  }

  .header-book{
    width:130px;
    height:44px;
    padding:0 12px;
  }

  .header-book i{
    display:none;
  }

  .menu-button{
    display:block;
  }

  .mobile-menu{
    position:fixed;
    z-index:95;
    inset:0;
    padding:100px 24px 30px;
    background:#fff;
    opacity:0;
    visibility:hidden;
    display:block;
    transition:.35s;
  }

  body.menu-open .mobile-menu{
    opacity:1;
    visibility:visible;
  }

  .mobile-menu-inner{
    display:flex;
    flex-direction:column;
  }

  .mobile-menu small{
    margin-bottom:35px;
    color:var(--gold);
    font-size:8px;
    letter-spacing:.15em;
  }

  .mobile-menu a{
    padding:13px 0;
    border-bottom:1px solid var(--line);
    font-size:30px;
    letter-spacing:-.04em;
  }

  .mobile-menu .mobile-book{
    margin-top:25px;
    padding:18px;
    border:0;
    background:var(--teal);
    color:#fff;
    font-size:13px;
  }

  body.menu-open .menu-button span:first-child{
    transform:translateY(3.5px) rotate(45deg);
  }

  body.menu-open .menu-button span:last-child{
    transform:translateY(-3.5px) rotate(-45deg);
  }


  .home-hero{
    min-height:auto;
    padding:112px 18px 25px;
  }

  .hero-backword{
    display:none;
  }

  .hero-content{
    display:block;
    min-height:auto;
  }

  .eyebrow{
    margin-bottom:40px;
  }

  .home-hero h1{
    font-size:clamp(65px,19.5vw,104px);
    line-height:.79;
  }

  .hero-offset{
    padding-left:1%;
  }

  .home-hero .hero-script{
    padding-left:12%;
  }

  .hero-copy-row{
    width:100%;
    display:block;
  }

  .circle-cta{
    margin-top:28px;
  }

  .hero-media{
    min-height:560px;
    margin-top:40px;
  }

  .hero-photo{
    width:92%;
    height:125vw;
  }

  .hero-mini{
    width:40%;
    bottom:2%;
  }

  .hero-seal{
    width:95px;
    height:95px;
  }

  .hero-location{
    width:165px;
    right:0;
    bottom:7%;
  }

  .hero-foot{
    display:none;
  }


  .editorial-statement,
  .brand-statement,
  .clinic-preview,
  .home-booking{
    padding:115px 0;
  }

  .statement-layout,
  .service-index-heading,
  .clinic-preview-head,
  .split-editorial,
  .faq-layout,
  .privacy-copy{
    display:block;
  }

  .statement-layout>div:last-child,
  .service-index-heading>div:last-child,
  .clinic-preview-head h2,
  .rich-copy{
    margin-top:35px;
  }

  .statement-layout h2,
  .service-index-heading h2,
  .clinic-preview-head h2{
    font-size:49px;
  }

  .statement-layout h2 em{
    margin-left:0;
  }

  .statement-copy{
    width:100%;
    display:block;
    margin-top:40px;
  }

  .statement-copy .underline-link{
    margin-top:25px;
  }


  .service-index-section{
    padding:105px 0 115px;
  }

  .service-index-heading{
    margin-bottom:45px;
  }

  .service-row{
    min-height:78px;
  }

  .service-row strong{
    font-size:20px;
  }

  .service-visual{
    height:115vw;
    margin-top:55px;
  }

  .visual-number{
    font-size:65px;
  }


  .brand-statement h2{
    font-size:57px;
    line-height:.84;
  }

  .brand-statement h2 span{
    padding-left:0;
  }

  .brand-statement h2 em{
    padding-left:9%;
  }

  .brand-statement-footer{
    width:100%;
    margin-top:45px;
    display:block;
  }

  .round-outline{
    margin-top:30px;
  }


  .clinic-collage{
    min-height:auto;
  }

  .clinic-photo-large{
    width:100%;
    height:115vw;
  }

  .clinic-photo-small{
    position:relative;
    width:56%;
    height:72vw;
    top:auto;
    right:auto;
    margin:-70px 15px 0 auto!important;
  }

  .clinic-info-card{
    position:relative;
    width:100%;
    right:auto;
    bottom:auto;
    margin-top:35px;
  }

  .clinic-gold-ring{
    width:90px;
    height:90px;
    left:5px;
    top:78vw;
  }


  .home-booking-layout{
    display:block;
  }

  .home-booking h2{
    font-size:67px;
  }

  .home-booking h2 em{
    padding-left:0;
  }

  .home-booking p{
    margin-left:0;
  }

  .booking-orb{
    width:215px;
    height:215px;
    margin:55px 0 0 auto;
  }


  .page-hero{
    min-height:auto;
    padding:150px 0 90px;
  }

  .page-hero-grid{
    display:block;
  }

  .page-hero h1{
    font-size:65px;
  }

  .page-hero-grid>p{
    margin-top:45px;
  }


  .content-section{
    padding:100px 0;
  }

  .rich-copy h2{
    font-size:48px;
  }

  .wide-image{
    height:115vw;
  }


  .service-detail{
    padding:75px 0;
  }

  .service-detail-grid{
    grid-template-columns:35px 1fr;
  }

  .service-detail-grid>figure,
  .service-detail-grid>.detail-art{
    grid-column:2;
    width:100%;
    height:95vw;
    margin-top:25px;
  }

  .service-detail h2{
    font-size:46px;
  }


  .price-group{
    display:block;
  }

  .price-title{
    margin-bottom:30px;
  }

  .price-items>div{
    grid-template-columns:1fr auto;
    padding:15px 0;
  }

  .price-items span{
    grid-column:1;
  }

  .price-items b{
    grid-column:2;
    grid-row:1/3;
  }


  .approach-story{
    padding:60px 0 100px;
  }

  .approach-sticky h2{
    font-size:49px;
  }


  .faq-section{
    padding-top:20px;
  }

  .accordion{
    margin-top:45px;
  }

  .faq-item button{
    min-height:80px;
  }


  .contact-grid,
  .location-grid,
  .booking-page-grid,
  .simple-cta-grid{
    display:block;
  }

  .contact-secondary{
    grid-template-columns:1fr;
    margin-top:55px;
  }

  .appointment-form{
    margin-top:60px;
    padding:24px;
  }

  .location-details{
    margin-top:60px;
  }

  .simple-cta h2{
    font-size:56px;
  }

  .simple-cta-grid>div{
    margin-top:40px;
  }


  .policy-list article{
    grid-template-columns:45px 1fr;
  }


  .footer-top{
    grid-template-columns:1fr 1fr;
    gap:45px 25px;
  }

  .footer-brand{
    grid-column:1/-1;
  }

  .footer-word{
    margin-top:80px;
    font-size:24vw;
  }

  .footer-bottom{
    display:block;
  }

  .footer-bottom span{
    display:block;
    margin-top:8px;
  }

}


@media(prefers-reduced-motion:reduce){
  *,
  *:before,
  *:after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }
}

/* =========================================================
   VITA — SERVICE NAME TITLE FIX
   ========================================================= */

.service-detail .service-name-title{
  max-width:780px;

  margin:
    10px
    0
    26px;

  color:#132725;

  font-size:
    clamp(
      52px,
      5.3vw,
      88px
    );

  font-weight:300;

  line-height:.94;

  letter-spacing:-.055em;

  text-wrap:balance;
}

.service-detail .service-name-title span{
  display:inline-block;

  margin-left:.14em;

  color:#0b7978;

  font-family:"DM Serif Display", Georgia, serif;

  font-size:.56em;

  font-style:italic;

  font-weight:400;

  letter-spacing:-.025em;
}

.service-detail > .shell > div small,
.service-detail-grid > div small{
  color:#b48d42;

  font-size:9px;

  font-weight:650;

  letter-spacing:.18em;
}

@media(max-width:720px){

  .service-detail .service-name-title{
    margin:
      8px
      0
      20px;

    font-size:
      clamp(
        40px,
        12vw,
        58px
      );

    line-height:.96;
  }

  .service-detail .service-name-title span{
    display:block;

    margin:
      7px
      0
      0;

    font-size:.56em;
  }

}

