.hero-title-natural {
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(52px,5vw,78px);
  line-height:1.08;
  letter-spacing:-.025em;
  color:#171411;
}

.hero-title-script {
  font-family:'Allura','Brush Script MT',cursive;
  font-size:clamp(68px,7vw,110px);
  line-height:1.15;
  color:#b77350;
  margin-top:5px;
}

@media(max-width:600px) {
  .hero-title-natural {
    font-size:clamp(39px,10.5vw,56px);
  }
  .hero-title-script {
    font-size:clamp(48px,14vw,76px);
    margin-top:4px;
  }
}

.hero:has(.hero-intro) {
  height:auto;
  min-height:800px;
}

.hero-intro {
  max-width:530px;
  margin:20px 0 26px;
}

.hero-intro h2 {
  font-size:clamp(27px,2.2vw,34px);
  line-height:1.2;
  color:var(--turquoise-dark);
  margin-bottom:17px;
}

.hero-intro p {
  font-size:13px;
  line-height:1.85;
}

.hero-intro p+p {
  margin-top:14px;
}

.hero-intro .hero-intro-signature {
  color:var(--turquoise-dark);
  font-weight:500;
}

@media(max-width:600px) {
  .hero:has(.hero-intro) {
    min-height:880px;
    padding-bottom:35px;
  }
  .hero:has(.hero-intro) .hero-wash {
    background:linear-gradient(90deg,#f8f1ebf5,#f8f1ebe8 60%,#f8f1ebc7);
  }
  .hero-intro {
    margin-top:17px;
    margin-bottom:23px;
  }
  .hero-intro h2 {
    font-size:28px;
  }
  .hero-intro p {
    font-size:12px;
    line-height:1.8;
  }
}

:root {
  --ivory:#f8f1eb;
  --pearl:#fcf8f4;
  --blush:#edddd2;
  --rose:#b77350;
  --rose-light:#d5a084;
  --turquoise:#376d6e;
  --turquoise-dark:#285455;
  --ink:#262421;
  --muted:#6d625c;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Montserrat',Arial,sans-serif;
  --script:'Allura','Brush Script MT',cursive;
  --header-height:110px;
  --content-width:1320px
}

*,*::before,*::after {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-height) + 20px)
}

body {
  margin:0;
  background:var(--pearl);
  color:var(--ink);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.75
}

body.dialog-open {
  overflow:hidden
}

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

button {
  font:inherit;
  color:inherit
}

button,a {
  -webkit-tap-highlight-color:transparent
}

button {
  cursor:pointer
}

img {
  display:block;
  max-width:100%;
  height:auto
}

h1,h2,h3,p {
  margin:0
}

h2,h3 {
  font-family:var(--serif);
  font-weight:400;
  line-height:1.1
}

h2 {
  font-size:clamp(38px,4vw,60px)
}

p+p {
  margin-top:14px
}

a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid var(--turquoise);
  outline-offset:5px
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}

.skip-link {
  position:fixed;
  top:12px;
  left:12px;
  z-index:100;
  padding:12px 20px;
  background:var(--turquoise-dark);
  color:white;
  transform:translateY(-150%)
}

.skip-link:focus {
  transform:translateY(0)
}

.eyebrow {
  text-transform:uppercase;
  letter-spacing:.32em;
  font-size:13px;
  font-weight:400;
  color:var(--muted)
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:19px;
  min-height:54px;
  padding:12px 34px;
  border:1px solid var(--rose-light);
  border-radius:40px;
  background:linear-gradient(178deg,#648c89 0%,var(--turquoise) 78%);
  color:#fff;
  font-size:12px;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
  transition:background .2s,box-shadow .2s
}

.button:hover {
  background:var(--turquoise-dark);
  box-shadow:0 4px 18px #28545524
}

.arrow {
  font-size:23px;
  font-family:Arial,sans-serif;
  font-weight:400;
  line-height:1
}

.button-small {
  min-height:44px;
  padding:10px 29px;
  font-size:11px
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:15px;
  font-size:12px;
  color:var(--turquoise-dark);
  border-bottom:1px solid var(--rose-light);
  padding-bottom:5px
}

.text-link:hover {
  color:var(--rose)
}

.site-header {
  height:var(--header-height);
  padding:0 clamp(26px,5.4vw,88px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  background:#f7eee7f2;
  position:sticky;
  top:0;
  z-index:30;
  backdrop-filter:blur(16px)
}

.brand {
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  flex-shrink:0;
  line-height:1
}

.brand-logo {
  display:block;
  width:clamp(220px,25vw,350px);
  height:auto;
}

.footer-brand .brand-logo {
  width:230px;
}

.brand-name {
  font-family:var(--serif);
  font-size:clamp(31px,3.25vw,48px);
  font-weight:400;
  letter-spacing:.2em;
  color:#7c6d65
}

.brand-subtitle {
  font-size:10px;
  letter-spacing:.43em;
  color:var(--rose);
  margin-top:8px;
  padding-left:4px
}

.brand-a {
  position:relative
}

.brand-star {
  position:absolute;
  left:50%;
  top:-.48em;
  transform:translateX(-50%);
  font-size:.7em;
  color:var(--rose-light);
  font-family:Georgia,serif;
  letter-spacing:0
}

.main-navigation {
  display:flex;
  align-items:center;
  gap:clamp(19px,2.1vw,34px)
}

.main-navigation>a:not(.button) {
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  position:relative;
  white-space:nowrap
}

.main-navigation>a:not(.button)::after {
  content:'';
  height:1px;
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  background:var(--rose);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s
}

.main-navigation>a.active::after,.main-navigation>a:hover::after {
  transform:scaleX(1)
}

.menu-toggle {
  display:none
}

.hero {
  min-height:650px;
  height:clamp(600px,49vw,790px);
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  overflow:hidden
}

.hero-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 45%;
  z-index:-3
}

.hero-wash {
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(90deg,#f7f0e9ed 0%,#f7f0e9b8 29%,#f7f0e92e 51%,transparent 64%)
}

.hero-content {
  padding:42px 0 58px clamp(30px,5.8vw,94px);
  width:55%;
  max-width:760px
}

.hero-eyebrow {
  font-size:clamp(15px,1.7vw,23px);
  letter-spacing:.42em;
  margin-bottom:4px
}

.hero h1 {
  display:flex;
  flex-direction:column;
  font-weight:400;
  line-height:1
}

.hero-natural {
  font-family:var(--serif);
  text-transform:uppercase;
  font-size:clamp(74px,8.3vw,132px);
  font-weight:400;
  letter-spacing:.035em;
  color:#171411
}

.hero-beauty {
  font-family:var(--script);
  font-size:clamp(94px,11.4vw,174px);
  font-weight:400;
  color:var(--rose);
  margin-top:-.25em;
  margin-left:.06em;
  line-height:.98
}

.hero-services {
  font-size:10px;
  letter-spacing:.23em;
  text-transform:uppercase;
  margin-top:31px;
  white-space:nowrap
}

.hero-services span {
  display:inline-block;
  margin:0 9px;
  color:var(--rose)
}

.hero-description {
  max-width:405px;
  line-height:1.85;
  font-size:15px;
  letter-spacing:.025em;
  margin:16px 0 23px
}

.service-strip {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  background:var(--ivory);
  padding:16px clamp(22px,4.4vw,70px) 24px
}

.service-tile {
  display:block;
  min-width:0
}

.service-image {
  aspect-ratio:1.62;
  overflow:hidden;
  background:var(--blush)
}

.service-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s;
  object-position:center 50%
}

.extension-crop { position:relative; }
.extension-crop img { width:100%; height:100%; object-fit:contain; object-position:center; transform:none; }

.brow-crop img { width:100%; height:100%; object-fit:contain; object-position:center; transform:none; }

.service-tile:hover img {
  transform:scale(1.07)
}

.service-tile:hover .extension-crop img { transform:none; }

.service-tile:hover .brow-crop img { transform:none; }

.service-tile>span {
  display:flex;
  align-items:center;
  gap:13px;
  padding:11px 17px;
  background:#e9d7cb99;
  font-size:10px;
  line-height:1.6;
  text-transform:uppercase;
  letter-spacing:.13em
}

.service-tile>span>span {
  color:var(--rose);
  font-size:19px;
  line-height:1
}

.why-section {
  display:grid;
  grid-template-columns:55% 45%;
  background:var(--pearl)
}

.studio-photo {
  position:relative;
  min-height:650px;
  overflow:hidden
}

.studio-photo>img {
  width:100%;
  height:100%;
  position:absolute;
  object-fit:cover;
  object-position:center 58%
}

.photo-note {
  position:absolute;
  bottom:14px;
  left:18px;
  color:#fff;
  background:#263c39c9;
  font-size:10px;
  letter-spacing:.08em;
  padding:3px 9px
}

.why-content {
  padding:40px clamp(25px,5vw,78px) 38px clamp(30px,5vw,76px);
  align-self:center
}

.why-content>.eyebrow {
  font-size:21px;
  letter-spacing:.36em
}

.why-content h2 {
  font-size:48px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#736660;
  margin-top:1px
}

.benefits {
  list-style:none;
  padding:0;
  margin:20px 0 0;
  display:grid;
  gap:17px
}

.benefits li {
  display:flex;
  align-items:center;
  gap:22px
}

.benefit-icon {
  width:66px;
  height:66px;
  flex:0 0 66px;
  border-radius:50%;
  background:#eddfd4;
  display:grid;
  place-items:center;
  color:var(--rose)
}

.benefit-icon svg {
  width:38px;
  height:38px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.3;
  stroke-linecap:round;
  stroke-linejoin:round
}

.benefits h3 {
  font:400 11px/1.5 var(--sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#655b56
}

.benefits p {
  font-size:11px;
  color:var(--muted);
  line-height:1.6;
  margin-top:3px;
  letter-spacing:.02em
}

.confidence {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  text-align:center;
  padding:47px 20px 44px;
  background:radial-gradient(ellipse at 5% 85%,#79a7a6b0,transparent 37%),radial-gradient(ellipse at 96% 15%,#78a7a7b0,transparent 38%),linear-gradient(115deg,#dce6df 2%,#faf3e9 38%,#f7f0e8 65%,#d2e4df);
  min-height:265px
}

.confidence .eyebrow {
  font-size:20px;
  letter-spacing:.42em
}

.confidence h2 {
  font-family:var(--script);
  font-size:clamp(64px,8vw,116px);
  line-height:1.2;
  color:var(--rose);
  margin-top:4px
}

.rose-rule {
  display:block;
  height:1px;
  width:90px;
  background:var(--rose);
  margin:18px auto 0
}

.marble-vein {
  position:absolute;
  z-index:-1;
  width:500px;
  height:500px;
  border:2px solid #b97a5155;
  border-radius:43% 57% 61% 39%;
  transform:rotate(40deg);
  box-shadow:12px 0 0 #faf5eb5e,16px 0 0 #c1906744,-20px 0 25px #fff8
}

.vein-one {
  left:-315px;
  top:-185px
}

.vein-two {
  right:-300px;
  bottom:-170px
}

.section-space {
  padding:90px max(28px,calc((100% - var(--content-width))/2 + 45px))
}

.section-heading {
  text-align:center;
  max-width:700px;
  margin:0 auto 42px
}

.section-heading h2 {
  margin-top:8px
}

.section-heading>p:last-child {
  font-size:13px;
  color:var(--muted);
  margin-top:17px
}

.service-details-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:45px
}

.service-detail {
  position:relative;
  border-top:1px solid #d7c5b8;
  padding-top:25px;
  scroll-margin-top:140px
}

.detail-number {
  color:var(--rose);
  font-family:var(--serif);
  font-size:25px
}

.service-detail h3 {
  font-size:33px;
  margin:8px 0 16px
}

.service-detail p {
  font-size:13px;
  line-height:1.9;
  color:var(--muted);
  margin-bottom:24px
}

.service-detail .text-link {
  font-size:11px
}

.education-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--ivory);
  align-items:stretch
}

.education-section>img {
  height:100%;
  max-height:490px;
  width:100%;
  object-fit:cover
}

.education-section>div {
  align-self:center;
  padding:55px clamp(30px,7vw,105px)
}

.education-section h2 {
  margin:12px 0 23px
}

.education-section p:not(.eyebrow) {
  font-size:13px;
  color:var(--muted);
  margin-bottom:27px
}

.education-section .button {
  font-size:10px
}

.gallery-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px
}

.gallery-item {
  padding:0;
  border:0;
  background:none;
  text-align:left;
  overflow:hidden
}

.gallery-item>img {
  width:100%;
  height:290px;
  object-fit:cover;
  transition:filter .2s
}

.gallery-item:hover>img {
  filter:brightness(.94)
}

.gallery-item>span {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:13px 0;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase
}

.gallery-item>span>span {
  font-size:20px;
  color:var(--rose)
}

.faq-section {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:90px;
  background:var(--ivory)
}

.faq-heading h2 {
  margin-top:14px
}

.faq-heading>p:not(.eyebrow) {
  font-size:13px;
  color:var(--muted);
  margin:23px 0 20px
}

.faq-list details {
  border-bottom:1px solid #d8c9be
}

.faq-list details:first-child {
  border-top:1px solid #d8c9be
}

.faq-list summary {
  list-style:none;
  cursor:pointer;
  font-size:13px;
  line-height:1.7;
  padding:22px 32px 22px 0;
  position:relative
}

.faq-list summary::-webkit-details-marker {
  display:none
}

.faq-list summary::after {
  content:'+';
  position:absolute;
  right:3px;
  top:17px;
  font-size:22px;
  color:var(--rose);
  font-weight:400
}

.faq-list details[open] summary::after {
  content:'−'
}

.faq-list details p {
  font-size:12px;
  color:var(--muted);
  padding:0 27px 23px 0;
  line-height:1.9
}

.faq-list details a {
  text-decoration:underline;
  text-underline-offset:3px;
  color:var(--turquoise-dark)
}

.contact-section {
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:60px;
  align-items:center;
  background:var(--turquoise-dark);
  color:var(--pearl)
}

.contact-section .eyebrow {
  color:#e4c2ad
}

.contact-section h2 {
  margin:13px 0 29px
}

.contact-section .button {
  background:var(--pearl);
  color:var(--turquoise-dark)
}

.contact-section .button:hover {
  background:#eddad0
}

.contact-details {
  padding-left:65px;
  border-left:1px solid #b5d0c74d;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:13px
}

.contact-details h3 {
  font-size:29px
}

.contact-details address {
  font-style:normal;
  font-size:13px;
  line-height:1.8
}

.contact-details>a:not(.text-link) {
  font-size:14px
}

.contact-details .text-link {
  color:var(--pearl)
}

.contact-details p {
  font-size:11px;
  color:#d6e0dc
}

.site-footer {
  padding:35px 5vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  color:var(--muted);
  font-size:10px
}

.footer-brand .brand-name {
  font-size:26px
}

.footer-brand .brand-subtitle {
  font-size:7px;
  margin-top:4px
}

.site-footer>a:last-child {
  color:var(--turquoise-dark)
}

.imagery-disclosure {
  font-size:9px
}

.gallery-dialog {
  padding:0;
  border:0;
  max-width:min(880px,92vw);
  max-height:92dvh;
  background:var(--pearl);
  color:var(--ink);
  overflow:auto
}

.gallery-dialog::backdrop {
  background:#1d3231c9;
  backdrop-filter:blur(5px)
}

.dialog-content {
  position:relative;
  padding:18px
}

.dialog-content>img {
  max-height:72dvh;
  width:100%;
  object-fit:contain
}

.dialog-content>p {
  font-size:12px;
  text-align:center;
  margin:14px 35px 3px;
  color:var(--muted)
}

.dialog-close {
  position:absolute;
  right:25px;
  top:25px;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:var(--pearl);
  color:var(--turquoise-dark);
  font-size:29px;
  line-height:1;
  box-shadow:0 3px 14px #0002
}

@media(min-width:1600px) {
  .hero-content {
    margin-left:max(0px,calc((100vw - 1600px)/2));
    width:700px
  }
  .hero-image {
    object-position:center 48%
  }
  .why-content {
    max-width:650px
  }
  .studio-photo {
    min-height:710px
  }
}

@media(max-width:1150px) {
  :root {
    --header-height:96px
  }
  .site-header {
    padding-inline:30px;
    gap:24px
  }
  .brand-name {
    font-size:36px
  }
  .main-navigation {
    gap:18px
  }
  .main-navigation>a:not(.button) {
    font-size:10px
  }
  .button-small {
    padding-inline:21px
  }
  .hero {
    min-height:595px
  }
  .hero-content {
    width:58%;
    padding-left:45px
  }
  .hero-services {
    font-size:9px;
    letter-spacing:.15em
  }
  .hero-services span {
    margin-inline:6px
  }
  .why-content {
    padding:35px
  }
  .why-content>.eyebrow {
    font-size:17px
  }
  .benefits {
    gap:18px
  }
  .benefits li {
    gap:17px
  }
  .benefit-icon {
    width:58px;
    height:58px;
    flex-basis:58px
  }
  .benefits h3 {
    font-size:10px
  }
  .benefits p {
    font-size:10px
  }
  .studio-photo {
    min-height:585px
  }
  .service-tile>span {
    font-size:9px;
    padding-inline:12px;
    letter-spacing:.08em
  }
  .section-space {
    padding:70px 40px
  }
  .faq-section {
    gap:55px
  }
}

@media(max-width:900px) {
  :root {
    --header-height:86px
  }
  .site-header {
    padding-inline:26px
  }
  .brand-name {
    font-size:34px
  }
  .brand-subtitle {
    font-size:8px
  }
  .menu-toggle {
    display:flex;
    gap:10px;
    align-items:center;
    padding:12px 0 12px 12px;
    border:0;
    background:none;
    min-height:44px
  }
  .menu-label {
    font-size:11px;
    letter-spacing:.1em;
    text-transform:uppercase
  }
  .menu-lines,.menu-lines::before {
    display:block;
    width:23px;
    height:1px;
    background:var(--turquoise-dark);
    transition:transform .2s
  }
  .menu-lines {
    position:relative;
    transform:translateY(-3px)
  }
  .menu-lines::before {
    content:'';
    position:absolute;
    top:6px
  }
  .menu-toggle[aria-expanded=true] .menu-lines {
    transform:rotate(45deg)
  }
  .menu-toggle[aria-expanded=true] .menu-lines::before {
    top:0;
    transform:rotate(-90deg)
  }
  .main-navigation {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    padding:20px 28px 26px;
    background:var(--pearl);
    box-shadow:0 12px 16px #46372a0d;
    flex-direction:column;
    align-items:stretch;
    gap:0
  }
  .main-navigation.is-open {
    display:flex
  }
  .main-navigation>a:not(.button) {
    padding:12px 0;
    font-size:12px
  }
  .main-navigation>a:not(.button)::after {
    bottom:9px;
    right:auto;
    width:28px
  }
  .main-navigation>.button {
    align-self:flex-start;
    margin-top:13px
  }
  .hero {
    height:600px;
    min-height:0
  }
  .hero-content {
    padding-left:34px;
    width:66%
  }
  .hero-natural {
    font-size:82px
  }
  .hero-beauty {
    font-size:124px
  }
  .hero-image {
    object-position:58% center
  }
  .hero-wash {
    background:linear-gradient(90deg,#f7f0e9f5,#f7f0e9d4 34%,#f7f0e940 65%,transparent)
  }
  .hero-description {
    max-width:340px;
    font-size:13px
  }
  .hero-services {
    white-space:normal;
    max-width:365px;
    line-height:2
  }
  .hero .button {
    font-size:10px;
    padding-inline:25px
  }
  .service-strip {
    gap:13px;
    padding:16px 24px 22px;
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .service-tile>span {
    font-size:11px
  }
  .service-image {
    aspect-ratio:2
  }
  .why-section {
    grid-template-columns:1fr 1fr
  }
  .why-content {
    padding:32px 24px
  }
  .why-content h2 {
    font-size:42px
  }
  .why-content>.eyebrow {
    font-size:14px
  }
  .benefits li {
    gap:12px
  }
  .benefit-icon {
    height:46px;
    width:46px;
    flex-basis:46px
  }
  .benefit-icon svg {
    width:29px;
    height:29px
  }
  .benefits h3 {
    font-size:9px;
    letter-spacing:.06em
  }
  .benefits p {
    font-size:10px
  }
  .studio-photo {
    min-height:550px
  }
  .confidence {
    padding-block:40px;
    min-height:235px
  }
  .confidence .eyebrow {
    font-size:14px
  }
  .service-details-grid {
    gap:25px
  }
  .service-detail h3 {
    font-size:29px
  }
  .service-detail p {
    font-size:12px
  }
  .education-section>div {
    padding:35px
  }
  .education-section h2 {
    font-size:40px
  }
  .gallery-item>img {
    height:235px
  }
  .faq-section {
    gap:30px
  }
  .contact-details {
    padding-left:35px
  }
  .site-footer {
    flex-wrap:wrap
  }
  .imagery-disclosure {
    order:5;
    width:100%;
    text-align:center
  }
}

@media(max-width:600px) {
  .brand-logo {
    width:min(235px,calc(100vw - 140px));
  }
  .footer-brand .brand-logo {
    width:210px;
    max-width:100%;
  }
  body {
    font-size:14px
  }
  .site-header {
    padding-inline:22px;
    gap:12px
  }
  .hero {
    height:700px;
    align-items:flex-start
  }
  .hero-image {
    height:100%;
    object-fit:cover;
    object-position:66% center
  }
  .hero-wash {
    background:linear-gradient(180deg,#f8f1ebf5 0%,#f8f1ebef 26%,#f8f1eb95 46%,#f8f1eb05 70%),linear-gradient(90deg,#f8f1eb44,transparent)
  }
  .hero-content {
    padding:37px 25px 0;
    width:100%;
    max-width:100%
  }
  .hero-eyebrow {
    font-size:14px;
    letter-spacing:.4em
  }
  .hero-natural {
    font-size:clamp(54px,15vw,88px)
  }
  .hero-beauty {
    font-size:clamp(94px,24vw,130px);
    line-height:.95;
    margin-top:-.19em;
    margin-left:0
  }
  .hero-services {
    margin-top:15px;
    max-width:100%;
    font-size:8px;
    letter-spacing:.13em
  }
  .hero-services span {
    margin-inline:5px
  }
  .hero-description {
    font-size:12px;
    line-height:1.85;
    max-width:290px;
    margin:10px 0 16px
  }
  .hero .button {
    min-height:47px;
    padding-inline:21px;
    font-size:9px;
    gap:15px
  }
  .service-strip {
    gap:12px;
    padding:16px 16px 20px
  }
  .service-image {
    aspect-ratio:1.6
  }
  .service-tile>span {
    font-size:8px;
    padding:9px 9px;
    gap:6px;
    letter-spacing:.06em
  }
  .service-tile>span>span {
    font-size:16px
  }
  .why-section {
    grid-template-columns:1fr
  }
  .studio-photo {
    min-height:0;
    aspect-ratio:1.13
  }
  .studio-photo>img {
    object-position:center 50%
  }
  .why-content {
    padding:33px 29px 39px
  }
  .why-content>.eyebrow {
    font-size:16px
  }
  .why-content h2 {
    font-size:44px
  }
  .benefits {
    gap:17px;
    margin-top:23px
  }
  .benefits li {
    gap:18px
  }
  .benefit-icon {
    width:56px;
    height:56px;
    flex-basis:56px
  }
  .benefit-icon svg {
    width:34px;
    height:34px
  }
  .benefits h3 {
    font-size:10px;
    letter-spacing:.08em
  }
  .benefits p {
    font-size:11px
  }
  .confidence {
    padding:35px 18px;
    min-height:205px
  }
  .confidence .eyebrow {
    font-size:12px;
    letter-spacing:.33em
  }
  .confidence h2 {
    font-size:58px;
    margin-top:14px
  }
  .rose-rule {
    margin-top:16px;
    width:65px
  }
  .section-space {
    padding:55px 25px
  }
  .section-heading {
    margin-bottom:32px
  }
  .eyebrow {
    font-size:10px
  }
  .section-heading h2 {
    font-size:40px
  }
  .section-heading>p:last-child {
    font-size:12px
  }
  .service-details-grid {
    grid-template-columns:1fr;
    gap:29px
  }
  .service-detail {
    padding-top:19px
  }
  .service-detail h3 {
    font-size:32px;
    margin:2px 0 12px
  }
  .detail-number {
    font-size:21px
  }
  .service-detail p {
    margin-bottom:18px
  }
  .education-section {
    grid-template-columns:1fr
  }
  .education-section>img {
    max-height:280px;
    aspect-ratio:1.5
  }
  .education-section>div {
    padding:36px 25px 41px
  }
  .education-section h2 {
    font-size:41px;
    margin-bottom:15px
  }
  .education-section p:not(.eyebrow) {
    font-size:12px
  }
  .gallery-grid {
    grid-template-columns:1fr;
    gap:20px
  }
  .gallery-item>img {
    height:280px
  }
  .gallery-item>span {
    font-size:10px
  }
  .faq-section {
    grid-template-columns:1fr;
    gap:28px
  }
  .faq-heading h2 {
    font-size:41px
  }
  .faq-heading>p:not(.eyebrow) {
    margin-top:15px
  }
  .faq-list summary {
    font-size:12px;
    padding-block:19px
  }
  .faq-list details p {
    font-size:12px
  }
  .contact-section {
    grid-template-columns:1fr;
    gap:35px
  }
  .contact-section h2 {
    font-size:42px
  }
  .contact-section .button {
    font-size:10px
  }
  .contact-details {
    padding:27px 0 0;
    border-left:0;
    border-top:1px solid #b5d0c74d;
    gap:11px
  }
  .contact-details h3 {
    font-size:28px
  }
  .site-footer {
    padding:30px 25px;
    justify-content:space-between;
    gap:22px
  }
  .site-footer>p {
    font-size:9px
  }
  .footer-brand .brand-name {
    font-size:24px
  }
  .site-footer>a:last-child {
    font-size:10px
  }
  .imagery-disclosure {
    width:auto;
    text-align:left;
    order:initial
  }
  .dialog-content {
    padding:12px
  }
  .dialog-content>p {
    font-size:10px;
    margin:11px 12px 3px
  }
  .dialog-close {
    right:20px;
    top:20px
  }
}

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


/* About: personal introduction and compact, two-column benefits. */
#about {
  grid-template-columns:42% 58%;
}

#about .studio-photo {
  min-height:0;
  aspect-ratio:auto;
}

#about .why-content {
  align-self:start;
  max-width:none;
  padding:30px clamp(28px,4vw,64px);
}

#about .why-content>.eyebrow {
  font-size:15px;
  letter-spacing:.3em;
}

#about .why-content h2 {
  font-size:42px;
}

#about .about-introduction {
  margin-top:15px;
}

#about .about-introduction h3 {
  color:var(--turquoise-dark);
  font-size:28px;
  line-height:1.2;
  margin-bottom:13px;
}

#about .about-introduction p {
  font-size:14px;
  line-height:1.3;
  color:var(--muted);
}

#about .about-introduction p+p {
  margin-top:8px;
}

#about .benefits {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:17px 22px;
  margin-top:23px;
}

#about .benefits li {
  align-items:flex-start;
  gap:12px;
  min-width:0;
}

#about .benefit-icon {
  width:42px;
  height:42px;
  flex:0 0 42px;
}

#about .benefit-icon svg {
  width:26px;
  height:26px;
}

#about .benefits h3 {
  font-size:10px;
  letter-spacing:.07em;
}

#about .benefits p {
  font-size:10.5px;
  line-height:1.65;
}

@media(max-width:1000px) {
  #about {
    grid-template-columns:35% 65%;
  }
  #about .why-content {
    padding:28px;
  }
  #about .benefits {
    gap:18px 16px;
  }
  #about .benefits li {
    flex-direction:column;
    gap:8px;
  }
}

@media(max-width:700px) {
  #about {
    grid-template-columns:1fr;
  }
  #about .studio-photo {
    aspect-ratio:1.8;
  }
  #about .why-content {
    padding:25px 22px 28px;
  }
  #about .why-content h2 {
    font-size:38px;
  }
  #about .about-introduction h3 {
    font-size:27px;
  }
  #about .benefits {
    gap:20px 17px;
  }
  #about .benefit-icon {
    width:36px;
    height:36px;
    flex-basis:36px;
  }
  #about .benefit-icon svg {
    width:23px;
    height:23px;
  }
  #about .benefits h3 {
    font-size:10px;
  }
  #about .benefits p {
    font-size:11px;
  }
}


/* Service information popups. */
button.service-tile {
  width:100%;
  border:0;
  padding:0;
  background:none;
  text-align:left;
}

.service-dialog {
  width:680px;
  max-width:calc(100vw - 32px);
  max-height:90dvh;
  padding:0;
  border:1px solid var(--blush);
  background:var(--pearl);
  color:var(--ink);
  overflow:auto;
}

.service-dialog::backdrop {
  background:#1d3231bd;
  backdrop-filter:blur(5px);
}

.service-dialog-content {
  position:relative;
  padding:40px 42px 36px;
}

.service-dialog-content>.eyebrow {
  padding-right:40px;
  font-size:10px;
}

.service-dialog h2 {
  font-size:46px;
  margin:10px 36px 19px 0;
  color:var(--turquoise-dark);
}

.service-dialog p {
  font-size:14px;
  line-height:1.7;
}

.service-dialog p+p {
  margin-top:15px;
}

.service-dialog .service-dialog-lead {
  font-family:var(--serif);
  font-size:25px;
  line-height:1.3;
  color:var(--rose);
  margin-bottom:20px;
}

.service-dialog .service-dialog-signature {
  font-family:var(--serif);
  font-size:25px;
  line-height:1.3;
  color:var(--turquoise-dark);
  margin-top:23px;
}

.service-dialog .dialog-close {
  top:16px;
  right:16px;
}

@media(max-width:600px) {
  .service-dialog-content {
    padding:30px 23px;
  }
  .service-dialog h2 {
    font-size:35px;
    margin-right:30px;
  }
  .service-dialog p {
    font-size:13px;
  }
  .service-dialog .service-dialog-lead,
  .service-dialog .service-dialog-signature {
    font-size:23px;
  }
}


.service-dialog-section h3 {
  font-size:29px;
  line-height:1.2;
  color:var(--turquoise-dark);
  margin:0 0 12px;
}

.service-dialog-section+.service-dialog-section {
  border-top:1px solid var(--blush);
  margin-top:25px;
  padding-top:25px;
}


.education-dialog {
  width:760px;
}

.service-dialog-toolbar {
  position:sticky;
  top:0;
  height:0;
  z-index:2;
}

.education-dialog .education-training {
  border-top:1px solid var(--blush);
  margin-top:25px;
  padding-top:25px;
}

.education-dialog ul {
  margin:14px 0 20px;
  padding-left:21px;
  font-size:14px;
  line-height:1.7;
}

.education-dialog li+li {
  margin-top:10px;
}

.education-dialog li::marker {
  color:var(--rose);
}

.education-dialog strong {
  font-weight:600;
}

.education-inquiry {
  margin-top:23px;
  max-width:100%;
  text-align:center;
  font-size:10px;
  line-height:1.7;
  padding-inline:22px;
}

@media(max-width:600px) {
  .education-dialog ul {
    font-size:13px;
  }
}

.lift-crop { position:relative; }
.lift-crop img { position:static; width:100%; height:100%; object-fit:contain; object-position:center; transform:none; }
.service-tile:hover .lift-crop img { transform:none; }

.service-image { aspect-ratio:4 / 3; }

/* Photo slideshow: retain each photograph's original proportions. */
.gallery-dialog { width:min(1100px, 96vw); max-width:96vw; max-height:94dvh; border-radius:8px; }
.gallery-dialog .dialog-content { padding:18px; }
.gallery-dialog .dialog-close { top:26px; right:26px; z-index:2; }
.gallery-stage { position:relative; height:min(62dvh, 640px); display:flex; align-items:center; justify-content:center; background:#e9e0d7; border-radius:4px; overflow:hidden; }
.gallery-stage img { width:100%; height:100%; object-fit:contain; }
.gallery-stage img:not([src]) { display:none; }
.gallery-dialog #gallery-caption { margin:10px 50px; font-size:13px; }
.gallery-dialog #gallery-status { position:absolute; bottom:12px; left:12px; right:12px; margin:0; padding:8px 12px; border-radius:4px; background:#faf7f2ed; color:var(--ink); font-size:12px; text-align:center; pointer-events:none; }
.gallery-dialog #gallery-status:empty { display:none; }
.gallery-navigation { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.gallery-navigation button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:8px 18px; border:1px solid var(--turquoise); border-radius:24px; background:var(--turquoise-dark); color:white; font:inherit; font-size:12px; }
.gallery-navigation button:disabled { opacity:.4; cursor:default; }
.gallery-preview-label { margin:10px 0 6px; color:var(--muted); font-size:11px; letter-spacing:.1em; }
#gallery-thumbnails { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(60px, 1fr); gap:8px; overflow-x:auto; padding:3px 2px 8px; }
.gallery-thumbnail { position:relative; height:65px; padding:0; border:1px solid var(--rose); border-radius:4px; overflow:hidden; background:#e9e0d7; }
.gallery-thumbnail img { width:100%; height:100%; object-fit:contain; }
.gallery-thumbnail span { position:absolute; bottom:0; right:0; padding:0 4px; background:#173c3dd9; color:#fff; font-size:10px; }
.gallery-thumbnail:hover { border-color:var(--turquoise-dark); }
.gallery-dialog button:focus-visible { outline:3px solid var(--turquoise); outline-offset:2px; }
@media(max-width:600px) {
 .gallery-dialog .dialog-content { padding:10px; }
 .gallery-dialog .dialog-close { top:16px; right:16px; }
 .gallery-stage { height:52dvh; }
 #gallery-thumbnails { grid-auto-columns:62px; gap:6px; }
 .gallery-thumbnail { height:52px; }
 .gallery-navigation button { padding:8px 12px; }
}

/* Team portraits are displayed without editing, rotation, or zoom. */
.team-section { background:var(--ivory); }
.team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(20px,3vw,42px); max-width:1200px; margin:0 auto; }
.team-card { min-width:0; display:flex; flex-direction:column; border-bottom:1px solid var(--rose); }
.team-portrait { position:relative; aspect-ratio:4 / 5; background:var(--pearl); }
.team-portrait img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; }
.team-card-content { padding:24px 2px 26px; display:flex; flex-direction:column; flex:1; align-items:flex-start; }
.team-card h3 { font-family:var(--font-serif, 'Cormorant Garamond',serif); font-size:clamp(28px,2.4vw,36px); font-weight:400; margin:0 0 10px; line-height:1.1; }
.team-role { margin:0 0 22px; font-size:11px; line-height:1.9; color:var(--muted); letter-spacing:.04em; }
button.team-story { margin-top:auto; background:none; border-top:0; border-left:0; border-right:0; padding:0 0 8px; font:inherit; font-size:12px; color:var(--turquoise-dark); }
.team-dialog .team-bio-role { color:var(--turquoise-dark); padding-bottom:20px; margin-bottom:24px; border-bottom:1px solid var(--rose); font-size:12px; line-height:1.8; letter-spacing:.04em; }
@media(min-width:701px) and (max-width:1000px) {
 .team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
}
@media(max-width:700px) {
 .team-grid { grid-template-columns:1fr; max-width:390px; gap:34px; }

 .team-card-content { padding:20px 2px 24px; }
}

.gallery-item[data-service-dialog=studio-policies-dialog]>img { object-fit:contain; background:var(--ivory); }

.team-portrait img[src$="/Angie.PNG"],
.team-portrait img[src$="/Monica.PNG"] {
  object-fit:cover;
  object-position:center top;
}

#lash-extensions-dialog h4 { font-family:var(--serif); font-size:24px; font-weight:400; line-height:1.25; color:var(--turquoise-dark); margin:0 0 10px; }

/* Keep biography and booking links together at the foot of each card. */
.team-actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; width:100%; margin-top:auto; }
.team-actions .team-story { margin-top:0; }
.team-actions .team-booking { padding-bottom:8px; }