/* 2026-10-28 responsive visual polish: presentation only; booking flows are unchanged. */
/* Use the original brand terracotta throughout; no darker alternate palette. */
.card-clay,
.booking-section,
.mobile-menu nav .mobile-menu-gift {
  background-color: var(--clay);
}
.mobile-test-sticky button:not(:disabled),
.mobile-test-time-grid button.is-selected {
  background-color: var(--clay);
}
.booking-copy .rate-note,
.visit-address small {
  opacity: .94;
}
.booking-copy .rate-note,
.rate-list span,
.visit-address small {
  font-size: 14px;
}

/* Readable booking labels, secondary instructions and progress states. */
.mobile-test-progress > div { font-size: 11px; }
.mobile-test-choice-header small { font-size: 11px; }
.mobile-test-choice-header > b { font-size: 12px; }
.mobile-test-choice-content > p,
.mobile-test-detail-card > p:not(.eyebrow):not(.mobile-test-privacy):not(.mobile-test-safe-note) {
  font-size: 14px;
  line-height: 1.6;
}
.mobile-test-first-available small,
.mobile-test-calendar-header small,
.mobile-test-calendar-weekdays span,
.mobile-test-time-heading small,
.mobile-test-appointment-summary small {
  font-size: 11px;
  line-height: 1.4;
}
.mobile-test-times-jump strong { font-size: 13px; }
.mobile-test-times-jump small,
.mobile-test-times-jump b,
.mobile-test-detail-card .mobile-test-welcome small,
.mobile-test-safe-note,
.mobile-test-privacy,
.mobile-test-email-suggestion > span {
  font-size: 12px;
  line-height: 1.5;
}
.mobile-test-phone-form label,
.mobile-test-details-form label,
.mobile-test-appointment-summary button,
.mobile-test-field-error,
.mobile-test-phone-form label > small,
.mobile-test-email-suggestion button {
  font-size: 13px;
  line-height: 1.45;
}
.mobile-test-identity-notice,
.mobile-test-email-help { font-size: 14px; }
.mobile-test-profile-actions button,
.mobile-test-profile-choices label { min-height: 44px; }
.mobile-test-email-suggestion button,
.mobile-test-empty-month button { min-height: 44px; }
.mobile-test-current-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-size: 13px;
}
.mobile-test-sticky-inner strong { font-size: 13px; }
.mobile-test-sticky-inner small { font-size: 12px; }
.mobile-test-sticky-inner { grid-template-columns: minmax(0, 1fr) auto; }

/* Visible keyboard focus on both the main website and the booking experience. */
.site-header a:focus-visible,
.mobile-menu summary:focus-visible,
.mobile-menu nav a:focus-visible,
.mobile-book:focus-visible,
.button:focus-visible,
.text-link:focus-visible,
.service-card a:focus-visible,
.therapist-row a:focus-visible,
.visit-links a:focus-visible,
.gift-strip a:focus-visible,
.mobile-test-booking button:focus-visible,
.mobile-test-booking input:focus-visible,
.mobile-test-booking textarea:focus-visible,
.mobile-test-header a:focus-visible,
.booking-security-fallback a:focus-visible {
  outline: 3px solid var(--deep-sage);
  outline-offset: 3px;
}
.mobile-test-sticky button:focus-visible,
.booking-section a:focus-visible,
.mobile-menu nav .mobile-menu-primary:focus-visible {
  outline-color: var(--cream);
}
.booking-security-fallback > a { background: var(--deep-sage); }

/* Tablet-sized content retains the original editorial layout with less empty space. */
@media (min-width: 561px) and (max-width: 899px) {
  .hero-visual { min-height: 430px; }
  .service-card { min-height: 330px; }
  .therapists { padding-block: 90px; }
  .gift-amount-card { min-height: 245px; }
}
@media (min-width: 700px) and (max-width: 899px) {
  .mobile-test-shell { width: min(calc(100% - 32px), 700px); }
  .mobile-test-time-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Mobile: preserve the same order and navigation while reducing oversized gaps. */
@media (max-width: 560px) {
  .hero { padding-top: 42px; padding-bottom: 54px; }
  .hero h1 { font-size: clamp(42px, 12vw, 52px); line-height: 1; }
  .hero-lede { margin-block: 23px; font-size: 16px; line-height: 1.65; }
  .hero-proof { margin-top: 32px; }
  .hero-visual { min-height: clamp(300px, 85vw, 375px); }
  .intro { padding-top: 65px; padding-bottom: 45px; }
  .intro h2 { font-size: clamp(42px, 11vw, 52px); }
  .service-grid { padding-bottom: 76px; }
  .service-card { min-height: 310px; }
  .studio-gallery { padding-block: 68px; }
  .therapists { padding-block: 68px; }
  .section-heading h2 { font-size: clamp(43px, 11vw, 58px); }
  .testimonial { padding-block: 68px; }
  .testimonial-stage { min-height: 260px; }
  .testimonial blockquote { font-size: clamp(38px, 10vw, 46px); }
  .booking-copy,
  .visit-card { padding-block: 60px; }
  .booking-copy h2 { font-size: clamp(53px, 13vw, 64px); }
  .gift-amounts { padding-top: 68px; padding-bottom: 55px; }
  .gift-amount-card { min-height: 205px; }
  .mobile-test-shell { padding-inline: 10px; }
  .mobile-test-sticky button { min-width: 104px; padding-inline: 15px; }
}
@media (max-width: 400px) {
  .site-header { padding-inline: 12px; gap: 5px; }
  .brand { gap: 7px; min-width: 0; }
  .site-header .brand-logo { width: 36px; height: 36px; }
  .site-header .brand strong { font-size: 14px; }
  .site-header .brand small { font-size: 7px; letter-spacing: .12em; }
  .mobile-header-book { padding: 10px 11px; margin-right: 5px; }
  .mobile-menu summary { min-width: 44px; min-height: 44px; padding-inline: 12px; gap: 0; font-size: 0; }
  .mobile-menu .menu-icon { flex: 0 0 17px; }
  .mobile-test-header .brand strong { font-size: 14px; }
  .mobile-test-current-link { max-width: 95px; text-align: right; font-size: 11px; }
}
@media (max-width: 330px) {
  /* Booking remains available via the menu and the existing fixed mobile action. */
  .mobile-header-book { display: none; }
}

/* Desktop booking: focused 760px hybrid layout. Mobile and tablet remain unchanged. */
@media (min-width: 900px) {
  .mobile-test-shell {
    width: min(calc(100% - 48px), 760px);
    padding-top: 28px;
  }
  .mobile-test-sections { gap: 18px; }
  .mobile-test-choice-header { padding: 16px 24px; }
  .mobile-test-choice-content { padding: 0 28px 28px; }
  .mobile-test-detail-card { padding: 28px; }
  /* Three services read best as complete, even-width rows (no orphan tile). */
  .mobile-test-session-options {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  .mobile-test-session-options > button {
    min-height: 72px;
    padding: 13px 18px;
  }
  /* Four therapist portraits remain a balanced 2x2 selection. */
  .mobile-test-therapist-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .mobile-test-therapist-options > button { min-height: 82px; }
  .mobile-test-time-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mobile-test-calendar { max-width: 680px; margin-inline: auto; }
  .mobile-test-sticky { padding-inline: max(24px, calc((100vw - 760px) / 2)); }
}


/* Desktop polish: preserve original two-column layout while reducing excessive page length. */
@media (min-width: 901px) {
  .hero { min-height: 660px; padding-top: clamp(64px, 5vw, 84px); padding-bottom: 60px; }
  .hero-visual { min-height: 510px; }
  .hero-proof { margin-top: 42px; }
  .intro { padding-top: 94px; padding-bottom: 52px; }
  .service-grid { padding-bottom: 92px; }
  .service-card { min-height: 400px; }
  .studio-gallery { padding-top: 76px; padding-bottom: 76px; }
  .therapists { padding-top: 98px; padding-bottom: 98px; }
  .testimonial { padding-top: 98px; padding-bottom: 98px; }
  .booking-copy, .visit-card { padding-top: 96px; padding-bottom: 96px; }
}


/* 2026-10-28 complete public-page polish: therapists and gift cards.
   Visual presentation only: preserve original photos, copy, prices and links. */
.therapists-page-hero {
  min-height: 0;
  padding-block: clamp(74px, 7.2vw, 110px);
}
.therapists-page-hero-inner { gap: clamp(30px, 6vw, 88px); }
.therapists-page-hero-inner > p { max-width: 540px; font-size: 17px; line-height: 1.7; }
.profile-section,
.profile-section-reverse {
  padding-block: clamp(64px, 6.5vw, 92px);
  grid-template-columns: minmax(235px, 315px) minmax(0, 1fr);
  gap: clamp(36px, 6vw, 84px);
  scroll-margin-top: 102px;
}
.profile-photo { max-width: 315px; }
.profile-copy { padding-top: 8px; }
.profile-copy h2 { font-size: clamp(49px, 5vw, 76px); line-height: .99; }
.profile-copy > p:not(.eyebrow):not(.profile-intro) {
  margin-top: 16px;
  font-size: 16px;
  line-height: 1.72;
}
.profile-copy .profile-intro {
  margin: 20px 0 23px;
  font-size: clamp(25px, 2.35vw, 35px);
  line-height: 1.23;
}
.profile-specialties { margin-top: 27px; padding-top: 21px; }
.profile-specialties h3 { margin-bottom: 12px; font-size: 11px; }
.profile-specialties ul { gap: 8px; }
.profile-specialties li {
  padding: 9px 12px;
  font-size: 12px;
  line-height: 1.4;
}
.profile-review {
  margin-top: 27px;
  padding: 22px 25px;
  font-size: clamp(23px, 2.15vw, 31px);
}
.profile-review cite { font-size: 10px; line-height: 1.5; }
.profile-actions { margin-top: 24px; flex-wrap: wrap; gap: 14px 24px; }
.profile-actions .button { min-height: 48px; }
.therapist-guidance {
  padding-block: clamp(68px, 6vw, 90px);
  gap: clamp(28px, 6vw, 95px);
  background: var(--clay);
}
.therapist-guidance > div:last-child > p { font-size: 16px; line-height: 1.7; }

/* Gifts: readable two-up amount choices on phone rather than four tall tiles. */
.gift-page-hero {
  min-height: 620px;
  padding-block: clamp(66px, 7vw, 100px);
  gap: clamp(34px, 6vw, 110px);
}
.gift-page-copy > p:not(.eyebrow) {
  margin-block: 23px;
  font-size: 17px;
  line-height: 1.7;
}
.gift-page-actions { flex-wrap: wrap; gap: 12px 24px; }
.gift-page-actions small { font-size: 12px; line-height: 1.5; }
.gift-card-visual { min-height: 365px; }
.gift-amounts { padding-block: 82px 52px; }
.gift-amounts-heading { margin-bottom: 34px; gap: clamp(20px, 5vw, 72px); }
.gift-amounts-heading > p { font-size: 16px; line-height: 1.68; }
.gift-amount-grid { gap: 12px; }
.gift-amount-card {
  min-height: 258px;
  padding: 22px;
}
.gift-amount-grid small { font-size: 10px; line-height: 1.4; letter-spacing: .13em; }
.gift-amount-grid strong { margin-bottom: 15px; font-size: clamp(43px, 4.3vw, 64px); }
.gift-session { min-height: 42px; padding-top: 10px; font-size: 13px; }
.gift-tile-link { margin-top: 12px; padding-top: 12px; font-size: 12px; }
.gift-amount-action { padding-top: 25px; gap: 17px 32px; }
.gift-benefits { padding-bottom: 78px; gap: 12px; }
.gift-benefits article { min-height: 235px; padding: 27px; }
.gift-benefits h2 { margin-top: 28px; font-size: clamp(34px, 3.1vw, 48px); }
.gift-benefits p { min-height: 0; line-height: 1.65; opacity: 1; }
.gift-benefits article:nth-child(3) { background: var(--clay); }
.gift-how { padding-block: 82px; gap: clamp(30px, 6vw, 100px); }
.gift-how li { padding-block: 22px; gap: 16px; }
.gift-how strong { font-size: 26px; }
.gift-purchase { padding-block: 86px; background: var(--clay); }
.gift-purchase > p:not(.eyebrow) { line-height: 1.7; }
.gift-purchase .button,
.therapist-guidance .button { min-height: 48px; }

/* Keep the editorial two-column therapist directory comfortable on tablets. */
@media (min-width: 561px) and (max-width: 900px) {
  .therapists-page-hero { padding-block: 70px; }
  .profile-section,
  .profile-section-reverse {
    grid-template-columns: minmax(210px, .55fr) minmax(0, 1fr);
    gap: 30px;
    padding-block: 65px;
  }
  .profile-photo { max-width: 300px; }
  .profile-copy h2 { font-size: clamp(42px, 6vw, 58px); }
  .profile-copy .profile-intro { font-size: clamp(23px, 3.2vw, 30px); }
  .gift-page-hero { min-height: 0; padding-block: 70px; }
  .gift-card-visual { min-height: 340px; }
  .gift-amounts { padding-top: 70px; }
  .gift-amount-card { min-height: 230px; }
  .gift-benefits article { min-height: 0; padding: 25px; }
  .gift-benefits h2 { margin-top: 18px; }
  .gift-how { padding-block: 72px; }
}

/* Phone typography and predictable, high-value vertical rhythm. */
@media (max-width: 560px) {
  .therapists-page-hero {
    padding: 48px 22px 55px;
  }
  .therapists-page-hero h1 {
    font-size: clamp(43px, 11.7vw, 56px);
    line-height: 1;
  }
  .therapists-page-hero-inner { gap: 19px; }
  .therapists-page-hero-inner > p {
    max-width: 38ch;
    margin: 0;
    font-size: 15px;
    line-height: 1.67;
  }
  .therapist-directory { padding-inline: 22px; }
  .profile-section,
  .profile-section-reverse {
    grid-template-columns: minmax(0, 1fr);
    gap: 23px;
    padding-block: 54px;
    scroll-margin-top: 82px;
  }
  .profile-photo {
    width: min(100%, 360px);
    max-width: 100%;
    aspect-ratio: 5 / 4;
    border-radius: 3px;
  }
  .profile-photo img { object-position: 50% 33%; }
  .profile-copy { padding-top: 0; }
  .profile-copy h2 { font-size: clamp(43px, 11.4vw, 55px); }
  .profile-copy .profile-intro {
    margin: 14px 0 19px;
    font-size: clamp(24px, 6.4vw, 29px);
    line-height: 1.22;
  }
  .profile-copy > p:not(.eyebrow):not(.profile-intro) {
    margin-top: 13px;
    font-size: 15px;
    line-height: 1.65;
  }
  .profile-specialties { margin-top: 24px; padding-top: 18px; }
  .profile-specialties ul { gap: 7px; }
  .profile-specialties li { padding: 8px 11px; font-size: 11px; }
  .profile-review {
    margin-top: 23px;
    padding: 18px 20px;
    font-size: 24px;
  }
  .profile-review cite { margin-top: 10px; }
  .profile-actions { margin-top: 20px; gap: 10px 16px; }
  .profile-actions .button { min-height: 48px; }
  .therapist-guidance {
    padding: 66px 22px 80px;
    gap: 20px;
  }
  .therapist-guidance h2 { font-size: clamp(44px, 11vw, 56px); }
  .therapist-guidance > div:last-child > p { margin-bottom: 22px; font-size: 15px; }

  .gift-page-hero {
    min-height: 0;
    padding: 50px 22px 60px;
    gap: 28px;
  }
  .gift-page-copy h1 {
    font-size: clamp(44px, 11.6vw, 57px);
    line-height: .98;
  }
  .gift-page-copy > p:not(.eyebrow) {
    margin-block: 20px;
    font-size: 15px;
    line-height: 1.66;
  }
  .gift-page-actions { gap: 11px; }
  .gift-card-visual { min-height: 260px; }
  .gift-card-visual::before { max-width: 82%; }
  .gift-card-mockup { width: min(92%, 355px); }
  .gift-amounts { padding: 66px 22px 40px; }
  .gift-amounts-heading { margin-bottom: 26px; gap: 20px; }
  .gift-amounts-heading h2 { font-size: clamp(43px, 11vw, 56px); }
  .gift-amounts-heading > p { font-size: 15px; line-height: 1.65; }
  .gift-amount-grid { grid-template-columns: 1fr; gap: 10px; }
  .gift-amount-card { min-height: 166px; padding: 19px 20px; }
  .gift-amount-grid strong { margin-top: 16px; margin-bottom: 10px; font-size: 46px; }
  .gift-session { min-height: 34px; padding-top: 9px; font-size: 12px; }
  .gift-tile-link { margin-top: 10px; padding-top: 10px; font-size: 11px; }
  .gift-amount-action { gap: 17px; padding-top: 22px; }
  .gift-amount-action p { font-size: 13px; }
  .gift-benefits { padding: 0 22px 63px; gap: 10px; }
  .gift-benefits article { min-height: 0; padding: 21px; }
  .gift-benefits h2 { margin: 22px 0 8px; font-size: 37px; }
  .gift-benefits p { font-size: 14px; line-height: 1.65; }
  .gift-how { padding: 64px 22px; gap: 24px; }
  .gift-how-heading h2 { font-size: clamp(43px, 11vw, 58px); }
  .gift-how li { padding-block: 20px; gap: 13px; }
  .gift-how strong { font-size: 24px; }
  .gift-how li p { font-size: 14px; }
  .gift-purchase { padding: 71px 22px calc(87px + env(safe-area-inset-bottom)); }
  .gift-purchase h2 { font-size: clamp(48px, 12vw, 66px); }
  .gift-purchase > p:not(.eyebrow) { font-size: 15px; }
}

/* Preserve readable amounts and tap-worthy tiles at small phone widths. */
@media (min-width: 360px) and (max-width: 560px) {
  .gift-amount-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .gift-amount-card { min-height: 216px; padding: 16px 15px; }
  .gift-amount-grid small { font-size: 9px; letter-spacing: .11em; }
  .gift-amount-grid strong {
    margin: 20px 0 12px;
    font-size: clamp(38px, 10vw, 46px);
  }
  .gift-session { min-height: 42px; font-size: 12px; }
  .gift-tile-link { margin-top: 10px; padding-top: 10px; font-size: 10.5px; }
  .gift-tile-link > span { font-size: 15px; }
}

/* Comfortable phone booking actions while retaining the existing links. */
@media (max-width: 359px) {
  .gift-amount-card { min-height: 164px; }
  .gift-amount-grid strong { font-size: 42px; }
}
