/* Brand and motion direction, revision 4. */
.smallbrand{position:relative;display:flex;align-items:center;width:198px;height:76px;overflow:visible;flex-shrink:0;clip-path:none;mix-blend-mode:normal;background:transparent}
.smallbrand img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;background:transparent}
.hero{isolation:isolate}
.hero>img{animation:hero-film 16s ease-in-out infinite alternate;translate:0 calc(var(--hero-progress,0)*-12px)}
.hero h1{translate:0 calc(var(--hero-progress,0)*-35px)}
.hero-copy{translate:0 calc(var(--hero-progress,0)*-15px)}
.hero-meta{z-index:2}
.glow-seal{position:absolute;width:116px;height:116px;bottom:36px;left:45%;color:#6c3c22;pointer-events:none;opacity:.85;z-index:2}
.glow-seal svg{width:100%;height:100%;animation:seal-spin 24s linear infinite;overflow:visible}
.glow-seal text{font:9px var(--sans);letter-spacing:2.3px;fill:currentColor}
.glow-seal>span{position:absolute;inset:0;display:grid;place-items:center;font-size:46px;font-weight:300;animation:seal-spin 16s linear infinite reverse}
.care-ribbon{padding:28px 0 16px;overflow:hidden;color:var(--rust)}
.ribbon-track{display:flex;width:max-content;animation:ribbon-travel 30s linear infinite;will-change:transform}
.ribbon-track>span{display:flex;align-items:center;gap:35px;font:400 clamp(24px,3.8vw,54px)/1.4 var(--serif);letter-spacing:-.03em;white-space:nowrap;padding-right:35px}
.ribbon-track i{font:32px var(--sans);font-style:normal;animation:seal-spin 12s linear infinite;display:inline-block}
.care-ribbon:hover .ribbon-track{animation-play-state:paused}
.visit-grid figure img{height:auto;aspect-ratio:auto;object-fit:contain}
.motion-v4 .hero h1 span,.motion-v4 .hero h1 em{animation:none}
.word-wrap{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.18em;margin-bottom:-.18em;line-height:inherit}
.word-ink{display:inline-block;transform:translate3d(0,112%,0) rotate(5deg);opacity:0;transition:transform 1.15s var(--ease),opacity .65s;transition-delay:var(--word-delay,0s);transform-origin:left bottom}
.split-heading.is-visible .word-ink{transform:translate3d(0,0,0) rotate(0);opacity:1}
.motion-v4 .reveal{transition-duration:1.25s;transform:translate3d(0,45px,0)}
.motion-v4 .diptych-photo.reveal{transform:translate3d(-50px,45px,0) rotate(-2deg);transform-origin:center;opacity:0}
.motion-v4 .experience-photo.reveal{transform:translate3d(45px,45px,0) rotate(2deg);opacity:0}
.motion-v4 .visit-grid>figure.reveal{transform:translate3d(0,65px,0) rotate(-2deg);opacity:0}
.motion-v4 .treatment-card.reveal:nth-child(odd){transform:translate3d(0,60px,0) rotate(-1.5deg)}
.motion-v4 .treatment-card.reveal:nth-child(even){transform:translate3d(0,85px,0) rotate(1.5deg)}
.motion-v4 .reveal.is-visible{transform:translate3d(0,0,0) rotate(0);opacity:1}
.motion-v4 .visit-grid>figure.reveal.is-visible,.motion-v4 .treatment-card.reveal.is-visible{transform:translate3d(0,0,0) rotate(0);opacity:1}
.section-label{position:relative;border-top:0}
.section-label:before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease)}
.section-label.is-visible:before,html:not(.motion-v4) .section-label:before{transform:scaleX(1)}
.pill{overflow:hidden;isolation:isolate}
.pill:after{content:'';position:absolute;left:-55%;top:-100%;width:35%;height:300%;transform:rotate(25deg);background:#ffffff29;z-index:-1;transition:left .8s var(--ease);pointer-events:none}
.pill:hover:after{left:130%}
.image-link{perspective:1200px}
.image-link:hover img{transform:scale(1.035)}
.photo-cursor{position:absolute;left:50%;top:50%;width:88px;height:88px;border-radius:50%;background:#fbf8f2ec;color:var(--rust);display:grid;place-items:center;font:500 12px var(--sans);pointer-events:none;opacity:0;transform:translate(-50%,-30%) scale(.5);transition:opacity .3s,transform .5s var(--ease);backdrop-filter:blur(6px);z-index:4}
.image-link:hover .photo-cursor{opacity:1;transform:translate(-50%,-50%) scale(1)}
.image-link:hover .image-arrow{opacity:0}
.treatment-card:nth-child(1){view-transition-name:facial-card}
.treatment-card:nth-child(2){view-transition-name:crystal-card}
.treatment-card:nth-child(3){view-transition-name:needling-card}
.treatment-card:nth-child(4){view-transition-name:pdt-card}
::view-transition-group(*){animation-duration:.65s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(root),::view-transition-new(root){animation:none}
::view-transition{pointer-events:none}
.concerns button{position:relative;overflow:hidden;isolation:isolate}
.concerns button:before{content:'';position:absolute;inset:0;background:#fbf8f2;z-index:-1;transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.concerns button:hover:before,.concerns button[aria-pressed=true]:before{transform:scaleX(1)}
.experience li{position:relative;transition:padding .7s var(--ease),color .6s}
.experience li:before{content:'';position:absolute;left:0;top:-1px;height:2px;width:100%;background:#a7653c;transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease)}
.experience li.step-active:before{transform:scaleX(1)}
.experience li.step-active h3{color:var(--rust)}
.experience li>.mono{transition:transform .6s var(--ease),color .6s}
.experience li.step-active>.mono{transform:translateY(3px);color:var(--rust)}
#mobile-menu:not([hidden]){animation:menu-unfold .65s var(--ease)}
#mobile-menu:not([hidden]) a{animation:menu-link-in .6s var(--ease) both}
#mobile-menu a:nth-child(2){animation-delay:.05s}#mobile-menu a:nth-child(3){animation-delay:.1s}#mobile-menu a:nth-child(4){animation-delay:.15s}
dialog[open]{animation:dialog-cinematic .65s var(--ease)}
@keyframes hero-film{from{transform:scale(1.06)}to{transform:scale(1.105)}}
@keyframes seal-spin{to{rotate:360deg}}
@keyframes ribbon-travel{to{transform:translateX(-50%)}}
@keyframes menu-unfold{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes menu-link-in{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
@keyframes dialog-cinematic{from{opacity:0;transform:translateY(30px) scale(.95);clip-path:inset(12% 0 0 0 round 12px)}to{opacity:1;transform:translateY(0) scale(1);clip-path:inset(0 0 0 0 round 12px)}}
@media(max-width:1100px) and (min-width:701px){.glow-seal{width:92px;height:92px;left:43%;bottom:32px}.glow-seal>span{font-size:36px}}
@media(max-width:700px){
 .smallbrand{width:165px;height:62px;clip-path:none}.smallbrand img{width:100%;height:100%;position:static}
 .glow-seal{width:68px;height:68px;left:auto;right:15px;bottom:30px;opacity:.7}.glow-seal>span{font-size:25px}
 .hero-bottom{right:94px}.hero-bottom>a{display:none}.hero-bottom p{font-size:17px}
 .hero>img{animation:hero-film 18s ease-in-out infinite alternate;translate:none}
 .hero h1,.hero-copy{translate:none}
 .ribbon-track>span{font-size:26px;gap:22px;padding-right:22px}.ribbon-track i{font-size:23px}
 .care-ribbon{padding-top:22px}.intro{padding-top:45px}
 .motion-v4 .diptych-photo.reveal,.motion-v4 .experience-photo.reveal{transform:translate3d(0,35px,0) rotate(-1deg)}
 .motion-v4 .reveal.is-visible{transform:none}
 #mobile-menu a{font-size:31px}
}
@media(prefers-reduced-motion:reduce){
 .word-ink{transform:none!important;opacity:1!important}.hero h1,.hero-copy,.hero>img{translate:none!important;transform:none!important}
 .ribbon-track,.ribbon-track i,.glow-seal svg,.glow-seal>span{animation:none!important}
 .care-ribbon{overflow:hidden}.motion-ready .reveal{transform:none!important;opacity:1!important;clip-path:none!important}
 .photo-cursor{display:none}.section-label:before{transform:scaleX(1)}
}
.motion-disabled .word-ink{opacity:1;transform:none}.motion-disabled .reveal{opacity:1;transform:none}
