@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&display=swap');

/* High-end editorial system shared across the complete website. */
:root {
  --color-orange: #ce6338;
  --color-orange-600: #b64f27;
  --color-orange-700: #863417;
  --color-orange-100: #f6d9ca;
  --color-orange-50: #fff6f0;
  --color-purple: #5b3b68;
  --color-purple-600: #44264f;
  --color-purple-700: #2a172f;
  --color-purple-100: #e9dfea;
  --color-purple-50: #f7f1f6;
  --color-bg: #f7f2ec;
  --color-bg-alt: #eee5dc;
  --color-surface: #fffdf9;
  --color-charcoal: #271f27;
  --color-border: #dfd2c7;
  --color-border-soft: #eee5dd;
  --font-heading: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Manrope', 'Nunito Sans', sans-serif;
  --fs-h1: clamp(3.6rem, 2.4rem + 4.8vw, 7.3rem);
  --fs-h2: clamp(2.75rem, 2rem + 2.8vw, 5rem);
  --fs-h3: clamp(1.75rem, 1.4rem + 1.1vw, 2.55rem);
  --lh-heading: .92;
  --ls-tight: -.04em;
  --container-max: 1360px;
  --radius-sm: 3px;
  --radius-md: 7px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --shadow-sm: 0 10px 28px rgba(45, 25, 43, .055);
  --shadow-md: 0 22px 54px rgba(45, 25, 43, .10);
  --shadow-lg: 0 34px 80px rgba(45, 25, 43, .16);
  --shadow-xl: 0 50px 120px rgba(32, 17, 31, .22);
}

html { background: #271f27; }
body { background: var(--color-bg); }
h1, h2, h3, h4, h5, h6 { font-weight: 500; }
h1, h2 { text-wrap: balance; }
p { line-height: 1.75; }
.eyebrow { font-family: var(--font-body); font-size: .68rem; font-weight: 700; letter-spacing: .22em; color: var(--color-orange-700); }
.eyebrow.eyebrow--on-dark {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .3rem .62rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 3px;
  background: rgba(31,17,31,.28);
  color: #ffd9c7;
  text-shadow: 0 1px 12px rgba(0,0,0,.52);
  box-shadow: 0 7px 20px rgba(0,0,0,.11);
  backdrop-filter: blur(8px);
}
.lede { font-size: clamp(1rem, .94rem + .24vw, 1.18rem); line-height: 1.8; }

/* Floating image-led navigation */
.site-header { height: 94px; position: sticky; top: 0; background: rgba(250,247,243,.94); border-bottom: 1px solid rgba(223,210,199,.7); backdrop-filter: blur(18px) saturate(1.15); }
.site-header__bar { height: 100%; padding-block: 1rem; }
.site-header__logo { position: relative; z-index: 1; padding: 0; border: 1px solid transparent; border-radius: 8px; background: transparent; }
.site-header__logo img { display: block; height: 48px; width: auto; mix-blend-mode: normal; object-fit: contain; }
.site-nav { gap: clamp(1.25rem, 2.6vw, 3rem); }
.site-nav__list { gap: clamp(.9rem, 1.6vw, 1.7rem); }
.site-nav__list a { font-family: var(--font-body); font-size: .71rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.site-nav__list a::after { bottom: -8px; height: 1px; background: var(--color-orange); }
.site-header.is-scrolled { height: 76px; background: rgba(250,247,243,.97); box-shadow: 0 12px 35px rgba(38,21,37,.09); }
.site-header, .site-header__logo, .site-header__logo img { transition: height .4s var(--ease-out), padding .35s var(--ease-out), background .4s var(--ease-out), border-color .35s ease, box-shadow .4s var(--ease-out), filter .3s ease; }
.site-header.is-scrolled .site-header__logo img { height: 42px; }

body:has(.hero) .site-header:not(.is-scrolled) { position: absolute; inset: 0 0 auto; z-index: var(--z-header); background: linear-gradient(180deg, rgba(22,13,23,.42), transparent); border-color: rgba(255,255,255,.16); color: white; }
body:has(.hero) .site-header:not(.is-scrolled) .site-header__bar { padding-top: 1.15rem; }
body:has(.hero) .site-header:not(.is-scrolled) .site-header__logo { padding: .42rem .62rem; background: rgba(29,16,30,.18); border-color: rgba(255,255,255,.18); box-shadow: 0 14px 38px rgba(0,0,0,.16); backdrop-filter: blur(14px) saturate(1.15); }
body:has(.hero) .site-header:not(.is-scrolled) .site-header__logo img { content: url('../images/logo/logo-reversed.webp'); filter: drop-shadow(0 2px 10px rgba(0,0,0,.18)); }
body:has(.hero) .site-header:not(.is-scrolled) .site-nav__list a { color: white; text-shadow: 0 1px 12px rgba(0,0,0,.35); }
body:has(.hero) .site-header:not(.is-scrolled) .cart-toggle { color: white; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.26); }

.btn { min-height: 48px; padding: .9rem 1.45rem; border-radius: 3px; font-family: var(--font-body); font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.btn-primary { background: var(--color-orange); box-shadow: 0 14px 32px rgba(178,72,36,.25); }
.btn-primary:hover { background: var(--color-orange-600); box-shadow: 0 18px 42px rgba(178,72,36,.34); }
.btn-secondary { color: var(--color-purple); border-color: var(--color-purple); }
.btn-ghost { color: var(--color-purple); font-family: var(--font-body); font-size: .69rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.cart-toggle, .menu-toggle { border-radius: 3px; }

/* Immersive hero */
.hero { min-height: 100svh !important; display: flex; align-items: center; isolation: isolate; padding-block: 10rem 6rem; }
.hero__bg { background-position: center; transform: scale(1.035); animation: hero-settle 1.6s var(--ease-out) both; }
.hero__bg::after { background:none; }
.hero::before { content: ''; position: absolute; z-index: 1; inset: 0; background: radial-gradient(circle at 14% 50%, rgba(207,98,55,.05), transparent 30%), linear-gradient(180deg, transparent 74%, rgba(23,13,23,.26)); pointer-events: none; }
.hero::after { content: 'SCROLL TO DISCOVER'; position: absolute; z-index: 2; right: 2rem; bottom: 3.6rem; writing-mode: vertical-rl; color: rgba(255,255,255,.68); font-family: var(--font-body); font-size: .57rem; font-weight: 700; letter-spacing: .22em; }
.hero__content { max-width: 780px; padding-top: 3rem; }
.hero__content::before { content: ''; display: block; width: 72px; height: 1px; margin-bottom: 1.45rem; background: linear-gradient(90deg, #ec956e, transparent); }
.hero h1 { max-width: 760px; margin-bottom: 1.5rem; color: #fffaf5; font-weight: 500; letter-spacing: -.055em; -webkit-text-stroke: .25px rgba(34,17,35,.32); text-shadow: 0 2px 3px rgba(20,10,20,.42), 0 12px 34px rgba(20,10,20,.38); }
.hero p { max-width: 600px; color: rgba(255,255,255,.88); text-shadow: 0 2px 10px rgba(20,10,20,.58); }
.hero .eyebrow, .hero__microproof { text-shadow: 0 1px 7px rgba(20,10,20,.68); }
.hero__ctas { gap: .8rem; margin-top: 2rem; }
.hero .btn-primary { background: #e37a4b; }
.hero .btn-on-dark { border-color: rgba(255,255,255,.62); }
.hero__microproof { display: flex; flex-wrap: wrap; gap: 1.2rem 2rem; max-width: 720px; margin-top: 2.6rem; padding-top: 1.45rem; border-top: 1px solid rgba(255,255,255,.20); color: rgba(255,255,255,.75); font-size: .61rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.hero__microproof li { display: inline-flex; align-items: center; gap: .65rem; }
.hero__microproof li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #ef936a; box-shadow: 0 0 0 4px rgba(239,147,106,.12); }
@keyframes hero-settle { from { transform: scale(1.10); opacity: .55; } to { transform: scale(1.035); opacity: 1; } }

/* Shorter inner-page heroes */
.hero--page { min-height: 620px !important; padding-block: 11rem 7rem; }
.hero--page .hero__bg::after { background: linear-gradient(90deg, rgba(39,20,43,.35), rgba(77,40,68,.18)); }
.hero--page .hero__content { max-width: 820px; }
.hero--center .hero__content { max-width: 820px; }
.hero--center p { margin-inline: auto; }

/* Inner-page hero titles settle on one or two lines, never three (the home hero is
   not .hero--page, so it is untouched). A wider measure and a calmer size do it. */
.hero.hero--page .hero__content { max-width: 1120px; }
.hero.hero--page h1 { max-width: 1040px; font-size: clamp(2rem, 1.36rem + 4.19vw, 5.4rem); }
.hero.hero--page.hero--center h1 { margin-inline: auto; }
.service-detail-hero .service-detail-hero__content { max-width: 1120px; }
.service-detail-hero .service-detail-hero__content h1 { max-width: 1040px; font-size: clamp(2rem, 1.36rem + 4.19vw, 5.4rem); }
/* Event Hosting: hero copy starts on the same left edge as the sections below it
   (the narrower centred measure used by other inner heroes pushed it ~130px right). */
.page-event-hosting .hero.hero--page .hero__content { max-width: var(--container-max); }

/* Event Hosting reuses the bright home property photo: a soft wash weighted to the
   text side keeps the left-aligned title and copy crisp without darkening the house. */
.page-event-hosting .hero--page .hero__bg::after {
  background:
    linear-gradient(90deg, rgba(34,18,38,.58) 0%, rgba(40,22,44,.34) 46%, rgba(40,22,44,.08) 78%, rgba(40,22,44,0) 100%),
    linear-gradient(180deg, rgba(34,18,38,.22) 0%, rgba(34,18,38,0) 32%);
}
@media (max-width: 760px) {
  .page-event-hosting .hero--page .hero__bg::after { background: linear-gradient(180deg, rgba(34,18,38,.42), rgba(34,18,38,.50)); }
}
@media (max-width: 400px) {
  .hero.hero--page h1,
  .service-detail-hero .service-detail-hero__content h1 { font-size: clamp(1.8rem, 9vw, 2.1rem); }
}

/* Editorial section rhythm */
.section { position: relative; padding-block: clamp(5.5rem, 9vw, 9rem); }
.section--sm { padding-block: clamp(3.5rem, 6vw, 6rem); }
.section--tint { background: #efe6dd; }
.section-head { max-width: 780px; margin-bottom: clamp(3rem, 5vw, 5rem); }
.section-head--center { text-align: left; margin-left: 0; }
.section-head--center::after { content: ''; display: block; width: 82px; height: 1px; margin-top: 1.5rem; background: var(--color-orange); }
.section-head--center p { max-width: 630px; }
.split { gap: clamp(3rem, 8vw, 8.5rem); }
.split__body { max-width: 580px; }
.split__media { position: relative; }
.split__media::before { content: ''; position: absolute; width: 45%; height: 38%; right: -24px; bottom: -24px; border: 1px solid rgba(98,57,73,.34); z-index: 0; }
.split__media::after { content: 'KING CITY · ONTARIO'; position: absolute; z-index: 2; left: -34px; bottom: 54px; transform: rotate(-90deg); transform-origin: left bottom; font-size: .58rem; font-weight: 700; letter-spacing: .19em; color: var(--color-purple); }
.split__media img { position: relative; z-index: 1; min-height: 520px; border-radius: 2px; box-shadow: var(--shadow-lg); }

/* Treatments — cream section with deep-plum cards.
   The section keeps the same cream as the "Wellness Edit" section (.home-products in home.css).
   The cards use the same plum glass as the footer "Visit Us" panel
   (#39273c → #322334, hairline white border, 8px radius) with light type and peach accents. */
#offer { overflow: hidden; background: #f7f2ec; color: var(--color-charcoal); }
#offer::before { content: ''; position: absolute; width: 640px; height: 640px; border: 1px solid transparent; border-radius: 50%; left: -280px; top: -310px; pointer-events: none; }

/* Header: title on the left, intro on the right — the same composition as the Wellness Edit header */
@media (min-width: 901px) {
  #offer .section-head--center { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); column-gap: clamp(2rem, 6vw, 7rem); align-items: end; max-width: none; }
  #offer .section-head--center .eyebrow { grid-column: 1; grid-row: 1; justify-self: start; }
  #offer .section-head--center h2 { grid-column: 1; grid-row: 2; margin-bottom: 0; }
  #offer .section-head--center p { grid-column: 2; grid-row: 2; align-self: end; max-width: 470px; margin: 0; padding-bottom: .45rem; }
  #offer .section-head--center::after { grid-column: 1 / -1; grid-row: 3; justify-self: start; }
}

.offer-card { min-height: 390px; justify-content: flex-end; align-items: flex-start; text-align: left; padding: 2rem !important; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 8px !important; background: linear-gradient(165deg, #3a283d 0%, #322334 100%) !important; color: #fffaf5; box-shadow: inset 0 1px rgba(255,255,255,.06), 0 26px 46px -22px rgba(39,22,41,.55) !important; }
.offer-card::before { height: 2px !important; background: linear-gradient(90deg, var(--color-orange), #b48bc4) !important; }
.offer-card:hover { transform: translateY(-10px); border-color: rgba(240,161,122,.45) !important; box-shadow: inset 0 1px rgba(255,255,255,.08), 0 40px 64px -22px rgba(39,22,41,.62) !important; }
.offer-card__icon { width: 64px !important; height: 64px !important; margin-bottom: auto !important; border: 1px solid rgba(255,255,255,.16); border-radius: 50% !important; background: rgba(255,255,255,.07) !important; color: #f0a17a; box-shadow: none !important; transition: transform var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out); }
.offer-card:hover .offer-card__icon { background: var(--color-orange) !important; border-color: var(--color-orange); color: #fff; }
.offer-card .badge { display: none !important; }
.offer-card__title { color: #fffaf5; font-size: 1.65rem !important; line-height: 1.05; }
.offer-card__desc { color: rgba(255,255,255,.74); }
.offer-card__link { align-self: stretch; margin-top: 1.4rem; padding: 1.05rem 0 0 !important; border-radius: 0 !important; border: 0 !important; border-top: 1px solid rgba(255,255,255,.14) !important; color: #f0a17a; background: transparent !important; font-family: var(--font-body); font-size: .64rem; letter-spacing: .13em !important; text-transform: uppercase !important; transition: color var(--dur-base) var(--ease-out); }
.offer-card:hover .offer-card__link { color: #ffb994; }

/* Elevated cards and directories */
.card { border: 0; border-radius: 3px; background: var(--color-surface); box-shadow: var(--shadow-sm); }
.card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); }
.card__media { background: #ece3db; }
.card__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 65%, rgba(44,26,39,.12)); pointer-events: none; }
.card__body { padding: 1.6rem; }
.card__title { font-family: var(--font-heading); font-size: 1.42rem; font-weight: 500; }
.badge { border-radius: 2px; font-family: var(--font-body); font-size: .58rem; letter-spacing: .11em; }
.practitioner-card .card__media { border-radius: 0; }
.practitioner-card__role { font-family: var(--font-body); font-size: .59rem; letter-spacing: .13em; color: var(--color-orange-700); }
.practitioner-card { overflow: visible; align-items: center; padding-top: 2.6rem; border: 1px solid rgba(223,210,199,.68); }
.practitioner-card .card__media,
.practitioner-card--featured .card__media,
.practitioner-card.is-expanded .card__media {
  position: relative;
  width: clamp(150px, 13vw, 190px);
  height: clamp(150px, 13vw, 190px);
  min-height: 0;
  aspect-ratio: 1;
  margin: 0 auto;
  border-radius: 50%;
  overflow: visible;
  background: transparent;
  box-shadow: 0 18px 42px rgba(54,32,49,.14);
  animation: portrait-float 6s ease-in-out infinite;
}
.practitioner-card .card__media::after,
.practitioner-card--featured .card__media::after,
.practitioner-card.is-expanded .card__media::after {
  content: '';
  position: absolute;
  inset: -10px;
  border: 1px solid rgba(205,98,56,.38);
  border-radius: 50%;
  background: none;
  pointer-events: none;
  transition: inset .45s var(--ease-out), border-color .45s ease, transform .65s var(--ease-out);
}
.practitioner-card .card__media img,
.practitioner-card--featured .card__media img,
.practitioner-card.is-expanded .card__media img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 5px solid #fffdf9;
  border-radius: 50%;
  transition: transform .65s var(--ease-out), filter .45s ease;
}
.practitioner-card:hover .card__media::after { inset: -16px; border-color: rgba(91,59,104,.55); transform: rotate(12deg); }
.practitioner-card:hover .card__media img { transform: scale(1.035); filter: saturate(1.06) contrast(1.02); }
.practitioner-card .practitioner-card__placeholder {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 34% 28%, #b98762 0, #8b526f 28%, #4d314f 72%, #2b1a2b 100%);
  color: #fffaf5;
}
.practitioner-card .practitioner-card__placeholder::before {
  content: '';
  position: absolute;
  width: 115%;
  height: 115%;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 48% 52% 46% 54%;
  transform: rotate(-24deg);
}
.practitioner-card__monogram {
  position: relative;
  z-index: 1;
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3vw, 2.9rem) !important;
  font-weight: 500 !important;
  letter-spacing: .06em;
  line-height: 1;
}
.practitioner-card .card__body { width: 100%; padding-top: 1.8rem; }
.practitioner-card.is-expanded { padding-top: 2.6rem; }
.practitioner-card.is-expanded .card__media { align-self: start; }
@keyframes portrait-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.product-card { border: 0; }
.product-card .card__media { background: #f2ebe4; }
.product-card__price, .modal__price { font-family: var(--font-body); color: var(--color-orange-700); }
.event-card__date { background: var(--color-purple-700); color: white; border-radius: 2px; }
.event-card__date .month { color: #f2a581; }

/* Search and filters */
.directory-toolbar, .toolbar { margin-bottom: 2rem; padding: 1rem; border: 1px solid var(--color-border); border-radius: 3px; background: rgba(255,253,249,.92); box-shadow: var(--shadow-sm); }
.directory-toolbar__search input, .toolbar__search input, .toolbar__select { border-radius: 2px; }
.chip { border-radius: 2px; font-family: var(--font-body); font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }
.chip[aria-pressed='true'] { background: var(--color-purple); border-color: var(--color-purple); }

/* Founder and social tiles */
.quote-block { max-width: 700px; padding: 1.4rem 0 0 2rem; border-left: 1px solid var(--color-orange); }
.quote-block::before { display: none; }
.quote-block blockquote { font-family: var(--font-heading); font-size: clamp(1.45rem, 1.2rem + .65vw, 2rem); font-weight: 500; line-height: 1.2; color: var(--color-purple-700); }
.instagram-swiper .card { border-radius: 2px; }
.instagram-swiper .card::after { content: 'VIEW ON INSTAGRAM ↗'; position: absolute; inset: auto 1rem 1rem; z-index: 2; color: white; font-size: .53rem; font-weight: 700; letter-spacing: .15em; opacity: 0; transform: translateY(6px); transition: .3s ease; }
.instagram-swiper .card:hover::after { opacity: 1; transform: none; }
.instagram-swiper .card img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-out); }
.instagram-swiper .card:hover img { transform: scale(1.06); }

/* Conversion surfaces */
.newsletter { border: 0; border-radius: 3px; padding: clamp(2.5rem, 5vw, 4.5rem); background: #2e2035; box-shadow: var(--shadow-lg); }
.newsletter h3 { color: white; }
.newsletter p { color: rgba(255,255,255,.63); }
.newsletter .eyebrow { color: #ee9a72; }
.newsletter input[type='email'] { min-height: 52px; border-radius: 2px; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: white; }
.newsletter input::placeholder { color: rgba(255,255,255,.50); }
.cta-band { min-height: 460px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: clamp(3.2rem, 7vw, 6.5rem); border-radius: 3px; background: linear-gradient(100deg, rgba(36,19,39,.90), rgba(65,32,56,.58)), url('../images/hero/garden.webp') center/cover; box-shadow: var(--shadow-lg); }
.cta-band::after { content: ''; position: absolute; inset: 18px; border: 1px solid rgba(255,255,255,.22); pointer-events: none; }
.cta-band > * { position: relative; z-index: 1; }
.cta-band h2 { max-width: 780px; color: white; font-size: clamp(3rem, 2.1rem + 3vw, 5.3rem); }
.cta-band .btn-primary { background: white; color: var(--color-purple-700); box-shadow: none; }
.cta-band .btn-secondary { color: white; border-color: rgba(255,255,255,.56); }

/* Footer */
.site-footer {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 88% 18%, rgba(111,68,122,.22), transparent 26%), linear-gradient(135deg, #1d131f, #28182a 62%, #211421);
  border-top: 1px solid rgba(239,160,122,.22);
}
.site-footer::before {
  content: '';
  position: absolute;
  width: 620px;
  height: 620px;
  left: -300px;
  top: -390px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 50%;
  box-shadow: 0 0 0 90px rgba(255,255,255,.015), 0 0 0 180px rgba(255,255,255,.01);
}
.site-footer::after { content: ''; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent 4%, #d66c43 28%, rgba(214,108,67,.12) 70%, transparent); }
.site-footer__top, .site-footer__bottom { position: relative; }
.site-footer__top {
  grid-template-columns: minmax(280px, 1.55fr) .7fr .8fr minmax(250px, 1fr);
  gap: clamp(2.5rem, 5vw, 6rem);
  padding-block: clamp(4.5rem, 8vw, 7.5rem) clamp(3.5rem, 6vw, 5.5rem);
  border-bottom-color: rgba(255,255,255,.13);
}
.site-footer__top > div { position: relative; }
.site-footer__top > div:first-child p { max-width: 420px; margin-top: 1.15rem; font-size: .94rem; line-height: 1.85; }
.site-footer__top > div:last-child { align-self: start; padding: 1.55rem 1.65rem; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; background: rgba(255,255,255,.045); box-shadow: inset 0 1px rgba(255,255,255,.06); }
.site-footer__brand { display: inline-flex; align-items: center; gap: .8rem; color: #fffaf5; font-family: var(--font-heading); font-size: clamp(2.15rem, 3vw, 3.15rem); font-weight: 500; letter-spacing: -.035em; }
.site-footer__brand::before { content: ''; width: 28px; height: 1px; background: #e88255; box-shadow: 0 0 18px rgba(232,130,85,.55); }
.site-footer h4 { margin-bottom: 1.25rem; color: #f0a17a; font-family: var(--font-body); font-size: .62rem; font-weight: 700; letter-spacing: .19em; }
.site-footer__top ul li { margin-bottom: .78rem; font-size: .88rem; line-height: 1.65; }
.site-footer a { color: rgba(255,255,255,.9); transition: color .25s ease, transform .25s ease; }
.site-footer a:hover { color: #f3aa86; }
.site-footer__top > div:nth-child(2) a,
.site-footer__top > div:nth-child(3) a { display: inline-block; }
.site-footer__top > div:nth-child(2) a:hover,
.site-footer__top > div:nth-child(3) a:hover { transform: translateX(4px); }
.site-footer p,
.site-footer li,
.site-footer__top li,
.site-footer__bottom { color: rgba(255,255,255,.78) !important; }
.site-footer__social { gap: .7rem; margin-top: 1.55rem; }
.site-footer__social a { width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.065); }
.site-footer__social a:hover { color: white; background: var(--color-orange); border-color: var(--color-orange); transform: translateY(-3px); }
.site-footer__bottom { min-height: 82px; padding-block: 1.35rem; border-color: rgba(255,255,255,.13); font-size: .69rem; letter-spacing: .025em; }
.site-footer__bottom span:last-child { color: rgba(255,255,255,.53); text-align: right; }

@media (max-width: 1000px) {
  .site-footer__top { grid-template-columns: 1.2fr .8fr .8fr; }
  .site-footer__top > div:last-child { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
  .site-footer__top { grid-template-columns: 1fr 1fr; gap: 2.5rem 2rem; }
  .site-footer__top > div:first-child,
  .site-footer__top > div:last-child { grid-column: 1 / -1; }
  .site-footer__bottom { align-items: flex-start; flex-direction: column; }
  .site-footer__bottom span:last-child { text-align: left; }
}

@media (max-width: 480px) {
  .site-footer__top { grid-template-columns: 1fr; }
  .site-footer__top > div:first-child,
  .site-footer__top > div:last-child { grid-column: auto; }
}

@media (max-width: 1000px) {
  .site-nav__list { gap: .8rem; }
  body:has(.hero) .site-header:not(.is-scrolled) .menu-toggle { background: rgba(255,255,255,.92); }
}

@media (max-width: 900px) {
  .site-header { height: 76px; }
  .site-nav {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100dvh;
    max-width: none;
    padding: 7.5rem 2rem 2.25rem;
    gap: 2.2rem;
    background: radial-gradient(circle at 90% 10%, rgba(206,99,56,.20), transparent 32%), #241827;
    box-shadow: none;
    overflow-y: auto;
  }
  .site-nav::before { content: 'MENU'; position: absolute; top: 2rem; left: 2rem; color: #ee9a72; font-size: .62rem; font-weight: 700; letter-spacing: .22em; }
  .site-nav__list { align-items: stretch; gap: 0; }
  .site-nav__list li { border-bottom: 1px solid rgba(255,255,255,.12); }
  .site-nav__list a,
  body:has(.hero) .site-header:not(.is-scrolled) .site-nav__list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .72rem 0;
    color: #fffaf5;
    font-family: var(--font-heading);
    font-size: clamp(2rem, 9vw, 3rem);
    font-weight: 500;
    letter-spacing: -.025em;
    line-height: 1;
    text-transform: none;
    text-shadow: none;
  }
  .site-nav__list a::after { position: static; width: auto !important; height: auto; background: none; content: '↗'; color: rgba(255,255,255,.35); font-family: var(--font-body); font-size: .8rem; }
  .site-nav__list a[aria-current='page'],
  body:has(.hero) .site-header:not(.is-scrolled) .site-nav__list a[aria-current='page'] { color: #ef9a72; }
  .site-nav__list a:focus-visible { outline: 0; background: rgba(255,255,255,.055); }
  .site-nav .btn-primary { min-height: 54px; margin-top: auto; background: #d7683d; }
  .menu-toggle { position: relative; z-index: calc(var(--z-header) + 4); transition: background .3s ease, transform .3s ease; }
  .menu-toggle[aria-expanded='true'] { position: fixed; top: 1.1rem; right: 1.25rem; background: rgba(255,255,255,.10) !important; border: 1px solid rgba(255,255,255,.24); }
  .menu-toggle[aria-expanded='true'] span { background: white; }
  .menu-toggle[aria-expanded='true'] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded='true'] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  body:has(.menu-toggle[aria-expanded='true']) .site-header__logo,
  body:has(.menu-toggle[aria-expanded='true']) .cart-toggle { opacity: 0; pointer-events: none; }
  .nav-overlay { display: none; }
  .hero { min-height: 820px !important; }
  .hero--page { min-height: 560px !important; }
  .hero::after { display: none; }
  .split__media img { min-height: 390px; }
}

@media (max-width: 640px) {
  :root { --fs-h1: clamp(3.15rem, 2.3rem + 5vw, 4.5rem); }
  body:has(.hero) .site-header:not(.is-scrolled) .site-header__logo { padding: .35rem .55rem; }
  .site-header__logo img { width: clamp(135px, 45vw, 175px); height: auto; }
  .hero { min-height: 760px !important; align-items: flex-end; padding-block: 8rem 4.5rem; }
  .hero__bg { background-position: 61% center; }
  .hero__bg::after { background: linear-gradient(180deg, rgba(30,16,31,.08), rgba(30,16,31,.43) 55%, rgba(26,14,27,.62)); }
  .hero__content { padding-top: 8rem; }
  .hero__microproof { display: grid; gap: .75rem; margin-top: 1.7rem; }
  .hero.hero--page { min-height: 0 !important; align-items: flex-start; padding-block: 6.5rem 3rem; }
  .hero.hero--page .hero__content { padding-top: 0; }
  .section { padding-block: 5rem; }
  .section-head--center { text-align: left; }
  .split__media::before { right: -10px; bottom: -10px; }
  .split__media::after { display: none; }
  .split__media img { min-height: 320px; }
  .offer-card { min-height: 340px; }
  .practitioner-card { padding-top: 2.1rem; }
  .practitioner-card .card__media,
  .practitioner-card--featured .card__media,
  .practitioner-card.is-expanded .card__media { width: 148px; height: 148px; }
  .site-footer__top { gap: 2rem; }
  .site-footer__brand { font-size: 2rem; }
  .cta-band { min-height: 400px; padding-inline: 1.5rem; }
  .cta-band::after { inset: 10px; }
}

/* On directory pages, keep the search field available on phones without
   pinning the category filters or the main navigation. */
@media (max-width: 900px) {
  .page-treatments .site-header,
  .page-practitioners .site-header { position: static; }

  body.page-treatments:has(.hero) .site-header:not(.is-scrolled),
  body.page-practitioners:has(.hero) .site-header:not(.is-scrolled) { position: static; }
}

@media (max-width: 640px) {
  .directory-toolbar { align-items: stretch; }
  .directory-toolbar .chip-row { flex: 0 0 100%; }
  .directory-toolbar__search { width: 100%; flex: 0 0 100%; }
  .directory-toolbar__search-spacer { flex: 0 0 100%; width: 100%; }

  .directory-toolbar__search.is-sticky {
    position: fixed;
    inset: 0 0 auto;
    z-index: 110;
    width: auto;
    margin: 0;
    padding: .6rem var(--container-pad);
    background: rgba(255, 253, 249, .97);
    border-bottom: 1px solid rgba(91, 59, 104, .18);
    box-shadow: 0 9px 24px rgba(45, 30, 42, .12);
  }

  .directory-toolbar__search.is-sticky svg { left: calc(var(--container-pad) + 1rem); }
  .directory-toolbar__search.is-sticky input {
    background: #fff;
    box-shadow: 0 0 0 1px rgba(111, 80, 134, .18);
  }
}

/* Events has two destinations: the event calendar and event hosting. */
.site-nav__item--events { position: relative; display: flex; align-items: center; gap: .1rem; }
.site-nav__submenu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.45rem;
  height: 1.45rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: currentColor;
}
.site-nav__submenu-toggle svg { width: .85rem; height: .85rem; transition: transform var(--dur-fast) var(--ease-out); }
.site-nav__item--events:hover .site-nav__submenu-toggle svg,
.site-nav__item--events:focus-within .site-nav__submenu-toggle svg,
.site-nav__item--events.is-submenu-open .site-nav__submenu-toggle svg { transform: rotate(180deg); }
/* Desktop: lay Events out inline like the other nav links so its label sits on the same line. */
@media (min-width: 901px) {
  .site-nav__item--events { display: list-item; white-space: nowrap; }
  .site-nav__submenu-toggle { vertical-align: middle; margin-left: .1rem; }
}
.event-nav-menu {
  position: absolute;
  top: 100%;
  left: -.85rem;
  z-index: calc(var(--z-header) + 2);
  display: grid;
  width: 15.5rem;
  padding: 1.2rem .45rem .45rem;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(42, 24, 43, .97);
  box-shadow: 0 16px 38px rgba(28,15,29,.22);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-.45rem);
  transition: opacity var(--dur-fast) ease, transform var(--dur-fast) var(--ease-out);
}
.site-nav__item--events:hover .event-nav-menu,
.site-nav__item--events:focus-within .event-nav-menu,
.site-nav__item--events.is-submenu-open .event-nav-menu { opacity: 1; pointer-events: auto; transform: translateY(0); }
.event-nav-menu a,
body:has(.hero) .site-header:not(.is-scrolled) .event-nav-menu a {
  display: block;
  padding: .8rem .9rem;
  color: white;
  text-shadow: none;
  transition: background var(--dur-fast) ease;
}
.event-nav-menu a:hover,
body:has(.hero) .site-header:not(.is-scrolled) .event-nav-menu a:hover { background: rgba(255,255,255,.09); }
.event-nav-menu a::after { display: none !important; }
.event-nav-menu span { display: block; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.event-nav-menu small { display: block; margin-top: .16rem; color: rgba(255,255,255,.64); font-family: var(--font-body); font-size: .71rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
body:has(.hero) .site-header:not(.is-scrolled) .site-nav__submenu-toggle { color: white; }

@media (max-width: 900px) {
  /* The mobile navigation must sit above isolated heroes, fixed filters and
     the sticky booking bar on every page. Some directory headers intentionally
     scroll with the page, so the menu itself owns this top-level layer. */
  body:has(.menu-toggle[aria-expanded='true']) .site-header {
    position: fixed !important;
    inset: 0 0 auto;
    z-index: calc(var(--z-modal) + 20) !important;
    width: 100%;
  }
  .site-nav { z-index: calc(var(--z-modal) + 20); }
  .menu-toggle[aria-expanded='true'] { z-index: calc(var(--z-modal) + 21); }

  .site-nav__item--events { width: 100%; flex-wrap: wrap; }
  .site-nav__item--events > a { flex: 1; }
  .site-nav__submenu-toggle { width: 2.25rem; height: 2.25rem; border: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.9); }
  .event-nav-menu {
    position: static;
    display: none;
    width: 100%;
    margin: .15rem 0 .55rem;
    padding: .3rem;
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.06);
    box-shadow: none;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }
  .site-nav__item--events.is-submenu-open .event-nav-menu { display: grid; }
  .event-nav-menu a,
  body:has(.hero) .site-header:not(.is-scrolled) .event-nav-menu a { padding: .62rem .7rem; font-size: .85rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hero__bg { animation: none; }
  .practitioner-card .card__media { animation: none; }
}
