:root { --blue: #58483e; --cream: #faf6ef; --border: #58483e65; --copper: #dfbf96; --line: #58483e25; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 32px; }
body { margin: 0; color: var(--blue); background: var(--cream); font-family: Jost, Arial, sans-serif; font-size: 18px; font-weight: 400; line-height: 1.67; letter-spacing: .3px; }
a { color: inherit; text-decoration: none; }
a:hover { color: inherit; }
button { font: inherit; }
img { display: block; width: 100%; object-fit: cover; }
h1, h2, h3 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; line-height: 1.2; letter-spacing: 0; margin: 0; }
h1 { font-size: 48px; }
h2 { font-size: 40px; }
h3 { font-size: 24px; }
p { margin: 0; }
.container { width: 100%; max-width: 1280px; padding-right: 24px; padding-left: 24px; }
.content-section { margin: 80px 0; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.section-heading h2::after { content: ''; display: block; width: 35px; height: 1px; background: #b18d67; margin-top: 12px; }
.button { display: inline-flex; align-items: center; justify-content: center; padding: 14px 24px; min-height: 48px; background: var(--blue); border: 1px solid var(--blue); color: var(--cream); font-size: 14px; font-weight: 600; line-height: 1.4; text-transform: uppercase; letter-spacing: .3px; transition: background .2s, color .2s; }
.button:hover { color: var(--blue); background: var(--cream); }
.button-outline { background: transparent; border-color: var(--border); color: var(--blue); }
.button-outline:hover { background: var(--blue); color: var(--cream); }
.button-book { min-width: 165px; background: var(--copper); color: #30271f; border: 2px solid var(--copper); font-weight: 700; box-shadow: none; }
.button-book:hover { background: #f1d6b3; border-color: #f1d6b3; color: #30271f; }
a:focus-visible, button:focus-visible, .massage-card:focus-visible { outline: 2px solid #9a836c; outline-offset: 5px; }
.skip-link { position: absolute; top: -100px; left: 15px; z-index: 100; padding: 10px; background: var(--cream); }
.skip-link:focus { top: 10px; }
.site-header { position: absolute; top: 0; left: 0; width: 100%; z-index: 20; color: var(--cream); background: rgba(36,29,25,.62); border-bottom: 1px solid #ffffff26; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.navbar { min-height: 80px; padding-top: 12px; padding-bottom: 12px; }
.brand { display: inline-flex; flex-direction: column; align-items: center; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 43px; line-height: .9; font-weight: 400; letter-spacing: -1px; }
.brand span { margin-top: 7px; font-family: Jost, Arial, sans-serif; font-size: 7px; line-height: 1.3; font-weight: 600; letter-spacing: 2px; }
.navbar-nav { gap: 24px; align-items: center; }
.navbar .nav-link { color: white; padding: 10px 0 !important; text-transform: uppercase; font-size: 16px; font-weight: 600; }
.navbar .nav-link:hover { color: var(--copper); text-decoration: underline; text-underline-offset: 5px; }
.header-book { margin-left: 24px; }
.navbar-toggler { border: 0; color: white; padding: 8px 0; box-shadow: none !important; }
.navbar-toggler span { display: block; width: 25px; height: 2px; background: currentColor; margin: 5px 0; }
.hero { position: relative; height: 100svh; min-height: 600px; display: flex; align-items: center; justify-content: center; color: white; }
.hero-image, .hero-overlay { position: absolute; inset: 0; }
.hero-image img { width: 100%; height: 100%; object-position: center; }
.hero-image { overflow: hidden; background: #31251e; }
.hero-image img, .hero-video { position: absolute; inset: 0; }
.hero-video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; transition: opacity .6s; pointer-events: none; }
.hero-video.is-playing { opacity: 1; }
.hero-overlay { background: linear-gradient(180deg, #20150f55, #281b146e 45%, #20150f88); }
.hero-content { position: relative; text-align: center; }
.hero-content h1 { max-width: 1100px; margin: 0 auto; }
.hero-content p { margin: 20px auto 35px; max-width: 1100px; font-size: 18px; }
.hero-content .hero-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 3px; color: #f3dfc6; margin: 0 0 24px; }
.hero-book { min-height: 56px; min-width: 180px; }
.video-toggle { position: absolute; bottom: 25px; right: max(24px, calc((100% - 1232px) / 2)); display: inline-flex; align-items: center; gap: 14px; border: 1px solid #ffffff60; background: #221a1360; color: var(--cream); padding: 7px 13px; font-size: 11px; letter-spacing: .5px; }
.video-toggle:hover { background: #221a1390; }
.video-toggle[hidden] { display: none; }
.video-toggle span { font-size: 15px; line-height: 1; }
.middle-section { padding: 104px 0; }
.middle-section h2, .membership-section h2 { font-size: 52px; line-height: 1.08; letter-spacing: -.7px; }
.middle-section h2 em, .membership-section h2 em { font-weight: 400; }
.section-kicker { font-size: 10px; line-height: 1.5; font-weight: 600; letter-spacing: 2.1px; margin-bottom: 22px; }
.editorial-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; border-bottom: 1px solid var(--border); padding-bottom: 7px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.editorial-link span { font-size: 20px; line-height: 1; transition: transform .2s; }
.editorial-link:hover span { transform: translate(3px, -3px); }
.massages { padding: 104px 0; }
.ritual-services { display: flex; width: 100%; height: 580px; gap: 14px; }
.ritual-service { position: relative; flex: 1 1 0; min-width: 0; height: 100%; overflow: hidden; border-radius: 4px; cursor: pointer; transition: flex-grow .6s cubic-bezier(.22,.61,.36,1); }
.ritual-service.is-expanded { flex-grow: 1.8; }
.ritual-service:focus-visible { outline: 2px solid #9a836c; outline-offset: 7px; }
.service-photo { position: absolute; inset: 0; }
.service-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #21170e18 30%, #21170e40 62%, #21170ee6); }
.service-photo img { width: 100%; height: 100%; transition: transform .5s ease; }
.ritual-service.is-expanded img { transform: scale(1.1); }
.service-index { position: absolute; top: 22px; left: 22px; width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid #ffffff70; border-radius: 50%; color: var(--cream); font-size: 10px; }
.service-info { position: absolute; inset: 0; padding: 32px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; text-align: left; color: var(--cream); }
.service-info h3 { position: relative; font-size: 32px; margin: 0; white-space: nowrap; }
.service-info > p { display: none; font-size: 15px; line-height: 1.7; margin-top: 14px; max-width: 400px; color: #f3e8da; }
.ritual-service.is-expanded .service-info > p { display: block; }
.enhancements { background: #eee5d8; }
.enhancement-layout { display: grid; grid-template-columns: .8fr 1.55fr; gap: 70px; align-items: stretch; }
.enhancement-feature { position: relative; margin: 0; min-height: 600px; }
.enhancement-feature img { position: absolute; width: 100%; height: 100%; object-position: 45% center; }
.enhancement-feature figcaption { position: absolute; left: 24px; bottom: 24px; font-size: 9px; letter-spacing: 2px; background: var(--cream); padding: 12px 17px; }
.enhancement-copy .section-intro { font-size: 15px; line-height: 1.85; max-width: 620px; margin: 24px 0 30px; }
.enhancement-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 24px; row-gap: 28px; margin-bottom: 32px; }
.enhancement-item { display: flex; align-items: flex-start; gap: 9px; border-top: 1px solid var(--line); padding-top: 13px; }
.enhancement-number { flex: 0 0 17px; font-size: 9px; margin-top: 5px; color: #8e7056; }
.enhancement-item h3 { font-size: 23px; margin-bottom: 10px; }
.enhancement-item p { font-size: 12px; line-height: 1.7; }
.membership-section { background: var(--blue); color: var(--cream); padding: 88px 0; }
.membership-feature { display: grid; grid-template-columns: .9fr 1.25fr; align-items: stretch; gap: 80px; }
.membership-photo { position: relative; min-height: 640px; }
.membership-photo img { position: absolute; inset: 0; width: 100%; height: 100%; }
.membership-caption { position: absolute; left: 25px; right: 25px; bottom: 26px; border: 1px solid #ffffff60; background: #392a2070; padding: 20px; color: white; font-size: 10px; letter-spacing: 3px; line-height: 1.8; }
.membership-story .section-kicker { color: var(--copper); }
.membership-story > p:not(.section-kicker) { font-size: 15px; line-height: 1.85; color: #ede1d4; margin: 24px 0 30px; }
.membership-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.membership-plans a { position: relative; border: 1px solid #ffffff50; padding: 21px 18px 26px; transition: background .2s; }
.membership-plans a:hover { color: var(--cream); background: #ffffff0c; }
.membership-plans a > span:first-child { font-size: 8px; font-weight: 600; letter-spacing: 1.4px; }
.membership-plans h3 { font-size: 48px; margin: 16px 0 7px; }
.membership-plans h3 em { font-size: 22px; }
.membership-plans p { max-width: 145px; font-size: 11px; color: #ede1d4; }
.plan-arrow { position: absolute; right: 18px; bottom: 21px; font-size: 23px; }
.membership-benefits { list-style: none; padding: 0; margin: 28px 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; row-gap: 12px; }
.membership-benefits li { display: flex; align-items: flex-start; gap: 9px; font-size: 12px; line-height: 1.6; color: #ede1d4; }
.membership-benefits li span { color: var(--copper); }
.gift-feature { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; background: #eee5d8; }
.gift-visual { position: relative; min-height: 460px; display: flex; align-items: center; justify-content: center; padding: 45px; overflow: hidden; }
.gift-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; filter: brightness(.88); }
.gift-ticket { position: relative; width: 350px; max-width: 100%; min-height: 235px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 8px solid var(--cream); outline: 1px solid #a8866080; outline-offset: -16px; background: var(--cream); box-shadow: 0 18px 45px #30231a35; transform: rotate(-7deg); }
.gift-ticket > span { font-size: 7px; font-weight: 600; letter-spacing: 2px; line-height: 1.5; }
.gift-ticket strong { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: 59px; line-height: 1; letter-spacing: -1px; margin: 18px 0 10px; }
.gift-ticket em { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 23px; margin-bottom: 22px; }
.gift-story { padding: 55px 50px; }
.gift-story > p:not(.section-kicker) { font-size: 15px; line-height: 1.85; margin: 24px 0 30px; max-width: 420px; }
.favorites { padding-top: 0; }
.essentials-layout { display: grid; grid-template-columns: .75fr 1.8fr; gap: 70px; align-items: start; }
.essentials-intro { padding-top: 15px; }
.essentials-intro > p:not(.section-kicker) { font-size: 15px; line-height: 1.85; margin: 25px 0; max-width: 280px; }
.essentials-footnote { display: block; font-size: 8px; letter-spacing: 1.7px; line-height: 1.9; margin-top: 65px; color: #8c7563; }
.essentials-rail { min-width: 0; padding-top: 15px; }
.essentials-slider { width: 100%; overflow: hidden; }
.essentials-slider .swiper-wrapper { align-items: stretch; }
.essential-item { min-width: 0; height: auto; user-select: none; }
.essential-item img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.essential-item > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-top: 13px; }
.essential-item h3 { font-size: 21px; line-height: 1.3; }
.essential-item span { font-size: 12px; white-space: nowrap; }
.essentials-controls { display: flex; align-items: center; gap: 16px; margin-top: 30px; }
.essentials-controls button { background: none; color: var(--blue); border: 0; padding: 0; font-family: Georgia, serif; font-size: 36px; line-height: 1; width: 44px; flex-shrink: 0; }
.essentials-controls .swiper-button-disabled { opacity: .3; cursor: default; }
.essentials-progress { position: relative !important; flex: 1; height: 1px !important; background: var(--line) !important; }
.essentials-progress .swiper-pagination-progressbar-fill { background: var(--blue) !important; height: 2px !important; }
.essentials-drag-hint { font-size: 8px; letter-spacing: 1.8px; color: #8c7563; margin-top: 13px; text-align: center; }
.gallery-slider { overflow: hidden; }
.gallery-slider > .swiper-wrapper { display: flex; gap: 16px; }
.gallery-slider figure { flex: 1; width: 0; margin: 0; }
.gallery-slider img { aspect-ratio: 1; }
.gallery-slider h3 { font-size: 18px; line-height: 1.5; letter-spacing: 0; margin-top: 8px; }
.gallery-label { display: inline-block; font-size: 12px; font-weight: 600; text-decoration: underline; margin-top: 14px; }
.gallery-progress { display: none; }
.values-band { padding: 80px 0; text-align: center; color: var(--cream); background: #58483e; border-top: 3px solid var(--copper); }
.values-band h2 { font-size: 36px; margin-bottom: 48px; }
.values-row { display: flex; align-items: center; justify-content: space-around; gap: 25px; }
.values-row span { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 28px; line-height: 1.1; }
.contact > .container > h2 { margin-bottom: 40px; }
.contact-columns p { font-size: 16px; margin: 0 0 24px; }
.contact-columns h3 { font-size: 24px; margin: 26px 0 16px; }
.hours { font-size: 16px; margin-bottom: 24px; }
.hours > div { display: flex; justify-content: space-between; gap: 20px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.hours dt { font-weight: 400; }
.hours dd { margin: 0; white-space: nowrap; }
.contact .location-note { margin: 16px 0 0; font-size: 12px; }
.map-frame { height: 560px; background: #efede5; }
.map-frame iframe { display: block; width: 100%; height: 100%; border: none; }
.map-link { display: block; text-align: right; margin-top: 12px; font-size: 14px; text-decoration: underline; }
.site-footer { padding-top: 48px; }
.footer-content { display: flex; align-items: center; justify-content: space-between; gap: 50px; padding-bottom: 80px; }
.footer-content h3 { font-size: 32px; margin-bottom: 12px; }
.footer-content p { font-size: 16px; }
.footer-brand { font-size: 70px; padding: 20px 30px; }
.footer-brand span { font-size: 10px; letter-spacing: 3px; }
.footer-legal { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); padding-top: 20px; padding-bottom: 24px; font-size: 12px; }
@media (min-width: 1536px) { .container { max-width: 1536px; } }
@media (max-width: 1024px) {
  .container { max-width: 1024px; }
  .service-info { padding: 22px; }
  .service-info h3 { font-size: 26px; white-space: normal; }
  .gallery-slider > .swiper-wrapper { gap: 0; }
  .gallery-slider figure { flex: 0 0 auto; width: auto; }
  .gallery-progress { display: block; position: relative !important; height: 1px !important; margin-top: 24px; background: var(--line) !important; }
  .gallery-progress .swiper-pagination-progressbar-fill { background: var(--blue); }
  .enhancement-layout, .membership-feature, .essentials-layout { gap: 40px; }
  .enhancement-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gift-story { padding: 40px 30px; }
  .gift-ticket strong { font-size: 48px; }
}
@media (max-width: 991px) {
  .navbar { min-height: 70px; }
  .navbar-toggler { order: -1; }
  .brand { margin-right: auto; margin-left: auto; }
  .navbar-collapse { flex-basis: 100%; width: 100%; padding: 20px 0; }
  .site-header:has(.navbar-collapse.show), .site-header:has(.navbar-collapse.collapsing) { background: rgba(36,29,25,.97); }
  .navbar-nav { align-items: flex-start; gap: 6px; }
  .navbar .nav-link { font-size: 16px; }
  .header-book { margin: 15px 0 0; }
  .membership-feature { grid-template-columns: .8fr 1.2fr; gap: 30px; }
  .membership-plans { gap: 12px; }
  .membership-plans a { padding-left: 13px; padding-right: 13px; }
  .membership-benefits { grid-template-columns: 1fr; }
  .essentials-layout { grid-template-columns: .8fr 1.5fr; gap: 35px; }
  .values-row span { font-size: 23px; }
  .map-frame { height: 440px; }
}
@media (max-width: 767px) {
  body { font-size: 16px; }
  .container { padding-left: 24px; padding-right: 24px; }
  .content-section { margin: 48px 0; }
  h1 { font-size: 34px; }
  h2 { font-size: 28px; }
  .section-heading { margin-bottom: 24px; gap: 15px; }
  .section-heading .button { padding: 12px 15px; font-size: 12px; }
  .brand { font-size: 36px; }
  .brand span { font-size: 6px; letter-spacing: 1.7px; }
  .hero { min-height: 650px; }
  .hero-content h1 { max-width: 560px; }
  .hero-content p { font-size: 16px; margin: 18px 0 30px; }
  .hero-content .hero-eyebrow { font-size: 9px; letter-spacing: 2px; margin-bottom: 20px; }
  .video-toggle { bottom: 20px; right: 24px; }
  .middle-section { padding: 65px 0; }
  .middle-section h2, .membership-section h2 { font-size: 42px; }
  .section-kicker { font-size: 9px; letter-spacing: 1.7px; margin-bottom: 19px; }
  .massages { padding: 65px 0; }
  .ritual-services { flex-direction: column; height: auto; gap: 12px; }
  .ritual-service, .ritual-service.is-expanded { flex: none; width: 100%; height: 180px; min-height: 0; transition: height .6s ease; }
  .ritual-service.is-expanded { height: 360px; }
  .service-info { padding: 23px; }
  .service-index { top: 18px; left: 18px; }
  .service-info h3 { font-size: 25px; }
  .service-info > p { font-size: 15px; }
  .enhancement-layout { grid-template-columns: 1fr; gap: 35px; }
  .enhancement-feature { min-height: 0; height: 330px; }
  .enhancement-copy .section-intro { font-size: 14px; margin: 22px 0 28px; }
  .enhancement-grid { column-gap: 20px; row-gap: 24px; }
  .enhancement-item { gap: 6px; }
  .enhancement-item h3 { font-size: 22px; }
  .enhancement-item p { font-size: 12px; }
  .membership-section { padding: 55px 0; }
  .membership-feature { grid-template-columns: 1fr; gap: 38px; }
  .membership-photo { min-height: 0; height: 390px; }
  .membership-story > p:not(.section-kicker) { font-size: 14px; }
  .membership-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
  .membership-benefits li { font-size: 11px; gap: 6px; }
  .membership-plans h3 { font-size: 44px; }
  .membership-plans h3 em { font-size: 19px; }
  .membership-plans a > span:first-child { font-size: 7px; letter-spacing: .6px; }
  .membership-plans p { max-width: 100px; font-size: 10px; }
  .plan-arrow { right: 12px; bottom: 19px; }
  .gift-feature { grid-template-columns: 1fr; }
  .gift-visual { min-height: 350px; padding: 40px; }
  .gift-ticket { min-height: 215px; }
  .gift-story { padding: 35px 25px 40px; }
  .gift-story > p:not(.section-kicker) { font-size: 14px; }
  .favorites { padding-top: 0; }
  .essentials-layout { grid-template-columns: 1fr; gap: 35px; }
  .essentials-intro { padding-top: 0; }
  .essentials-intro > p:not(.section-kicker) { max-width: none; font-size: 14px; margin: 23px 0; }
  .essentials-footnote { display: none; }
  .essentials-rail { padding-top: 0; }
  .essential-item > div { display: block; }
  .essential-item h3 { font-size: 21px; margin-bottom: 5px; }
  .values-band { padding: 48px 0; }
  .values-band h2 { font-size: 28px; margin-bottom: 30px; }
  .values-row { flex-wrap: wrap; gap: 25px; }
  .values-row span { font-size: 23px; }
  .contact .row.g-5 { --bs-gutter-x: 2rem; }
  .map-frame { height: 350px; }
  .footer-content { align-items: flex-start; flex-direction: column; gap: 35px; padding-bottom: 45px; }
  .footer-content h3 { font-size: 27px; }
  .footer-brand { margin-left: 0; font-size: 55px; padding: 0; }
  .footer-legal { flex-direction: column; gap: 8px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
