.spa-room-page {
    --spa-room-heading: var(--pool-dome-navy);
    --spa-room-text: var(--pool-dome-text);
    --spa-room-link: var(--pool-dome-blue);
    --spa-room-button: var(--pool-dome-copper);
    --spa-room-hover: color-mix(in srgb, var(--pool-dome-copper) 70%, var(--pool-dome-navy));
    --spa-room-border: var(--pool-dome-border);
    --spa-room-grid-divider: color-mix(in srgb, var(--spa-room-heading) 55%, var(--spa-room-border));
    --spa-room-neutral: color-mix(in srgb, var(--bs-gray-300) 94%, var(--pool-dome-copper));
    --spa-room-section-surface: color-mix(in srgb, var(--spa-room-neutral) 55%, white);
}
body.pool-dome-page.spa-room-page { background: #fff; }
.spa-room-page #rightNav :focus-visible { outline: 3px solid var(--spa-room-heading); outline-offset: -3px; }
.spa-room-page #rightNav [aria-current="page"]:focus-visible { outline-color: #fff; }
.spa-room-page .pool-dome-skip-link { background: var(--spa-room-heading); }
.spa-room-shell { width: calc(100% - 2rem); max-width: 1320px; margin-inline: auto; padding: 1.5rem 0 3rem; }
.spa-room-breadcrumbs { margin-bottom: 1.5rem; font-size: 1rem; line-height: 1.5; }
.spa-room-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.spa-room-breadcrumbs li + li::before { content: "/"; margin-right: .5rem; color: var(--spa-room-heading); }
.spa-room-content { min-width: 0; color: var(--spa-room-text); font-size: 1.125rem; line-height: 1.65; overflow-wrap: break-word; }
/* The shared header supplies sticky clearance; keep only a small reading gap here. */
.spa-room-content, .spa-room-content [id] { scroll-margin-top: 1rem; }
.spa-room-content :is(h1, h2, h3, dt) { color: var(--spa-room-heading); font-weight: 700; text-wrap: balance; }
.spa-room-content h1 { margin: 0; font-size: clamp(2rem, 3.1vw, 2.6rem); line-height: 1.15; text-align: center; }
.spa-room-content h2 { margin: 0 0 1.5rem; font-size: clamp(1.6rem, 2.4vw, 2rem); line-height: 1.25; text-align: center; }
.spa-room-content h3, .spa-room-facts dt { margin: 0 0 .75rem; font-size: 1.25rem; line-height: 1.35; text-align: center; }
.spa-room-content > section { margin-top: 1.5rem; padding: 1.5rem; border: 1px solid var(--spa-room-border); background: #fff; }
.spa-room-content > section:first-child { margin-top: 0; }
.spa-room-content > section:nth-of-type(even):not(.spa-room-hero) { border-top: 3px solid var(--spa-room-button); background: var(--spa-room-section-surface); }
.spa-room-content > section > p { text-align: center; }
.spa-room-content p { margin: 0 0 1rem; }
.spa-room-content :is(section, aside, .spa-room-columns > div, .spa-room-reading, .spa-room-facts dd) > :last-child { margin-bottom: 0; }
.spa-room-content a, .spa-room-breadcrumbs a { color: var(--spa-room-link); text-underline-offset: .2em; }
.spa-room-content a:not(.cta-button):hover, .spa-room-breadcrumbs a:hover { color: var(--spa-room-hover); text-decoration-thickness: 2px; }
.spa-room-shell :focus-visible { outline: 3px solid var(--spa-room-button); outline-offset: 3px; }
.spa-room-shell :is(a, summary) { touch-action: manipulation; }
.spa-room-content figure { margin: 0; }
.spa-room-content img { max-width: 100%; height: auto; }
.spa-room-content figure img { display: block; }
.spa-room-content figcaption, .spa-room-company-links { font-size: 1rem; line-height: 1.5; text-align: center; }

/* Keep the heading and lead before the photo on phones, without duplicating copy. */
.spa-room-content > .spa-room-hero {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(1.5rem, 1fr) auto auto auto minmax(1.5rem, 1fr);
    grid-template-areas: ". photo" "title photo" "lead photo" "copy photo" ". photo";
    min-height: 410px;
    padding: 0;
    overflow: hidden;
    border-radius: 8px;
    border-bottom: 4px solid var(--spa-room-button);
    background: var(--spa-room-heading);
    color: #fff;
}
.spa-room-hero > h1 { grid-area: title; margin: 0 1.75rem 1rem; }
.spa-room-intro { display: contents; }
.spa-room-intro > .spa-room-lead { grid-area: lead; margin: 0 1.75rem 1rem; font-size: 1.25rem; line-height: 1.5; text-align: center; }
.spa-room-hero-copy { grid-area: copy; min-width: 0; padding-inline: 1.75rem; text-align: center; }
.spa-room-hero-photo { grid-area: photo; position: relative; min-width: 0; min-height: 0; }
.spa-room-hero-photo > a, .spa-room-hero-photo picture { display: block; height: 100%; }
.spa-room-hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.spa-room-hero-photo > a:focus-visible { outline-offset: -5px; }
.spa-room-hero :is(h1, .spa-room-price data, a:not(.cta-button)),
.spa-room-details .spa-room-reading :is(h2, a),
.spa-room-project-help :is(h2, a:not(.cta-button)) { color: #fff; }
.spa-room-hero a:not(.cta-button):hover,
.spa-room-details .spa-room-reading a:hover,
.spa-room-project-help a:not(.cta-button):hover { color: #fff; text-decoration-thickness: 2px; }
:is(.spa-room-hero, .spa-room-project-help, .spa-room-details .spa-room-reading) :focus-visible { outline-color: #fff; }

.spa-room-actions { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: .75rem; margin: 1.25rem 0 0; }
.spa-room-actions .cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    max-width: 100%;
    min-height: 52px;
    margin: 0;
    padding: .75rem 1.25rem;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    box-shadow: none;
    transform: none;
    transition: background-color .15s ease, border-color .15s ease;
}
.spa-room-actions .cta-button-primary { background: var(--spa-room-button); border-color: var(--spa-room-button); color: #fff; }
.spa-room-actions .cta-button-primary:hover { background: var(--spa-room-hover); border-color: var(--spa-room-hover); color: #fff; }
.spa-room-actions .cta-button-secondary { background: var(--spa-room-link); border-color: var(--spa-room-link); color: #fff; }
.spa-room-actions .cta-button-secondary:hover { background: var(--spa-room-button); border-color: var(--spa-room-button); color: #fff; }
:is(.spa-room-hero, .spa-room-project-help) .cta-button { border-color: #fff; }
.spa-room-cta-label { min-width: 0; }
.spa-room-cta-arrow { display: flex; flex: 0 0 1.5rem; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; font-size: 1.5rem; line-height: 1; }
.spa-room-cta-arrow::before { display: block; line-height: 1; vertical-align: 0; }
.spa-room-schedule-value { display: block; margin-top: .5rem; font-size: 2rem; font-weight: 700; line-height: 1.25; }
.spa-room-content .spa-room-text-link { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; font-weight: 700; text-decoration: none; }
.spa-room-text-link:hover { text-decoration: none; }
.spa-room-price { text-align: center; }
.spa-room-price data { color: var(--spa-room-heading); font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.25; font-variant-numeric: tabular-nums; }
.spa-room-price span { white-space: nowrap; }
.spa-room-hero .spa-room-price span { display: block; margin-top: .5rem; font-size: 1rem; line-height: 1.5; }

.spa-room-columns, .spa-room-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; gap: 0; }
.spa-room-columns > div, .spa-room-facts > div { min-width: 0; padding: 1.5rem; background: #fff; }
.spa-room-columns > div:nth-child(odd), .spa-room-facts > div:nth-child(odd) { background: var(--spa-room-neutral); }
.spa-room-columns > div:nth-child(even), .spa-room-facts > div:nth-child(even) { border-left: 1px solid var(--spa-room-grid-divider); }
.spa-room-columns > div:nth-child(n+3), .spa-room-facts > div:nth-child(n+3) { border-top: 1px solid var(--spa-room-grid-divider); }
.spa-room-facts dd { margin: 0; text-align: center; }
.spa-room-columns > div { display: flex; flex-direction: column; text-align: center; }
.spa-room-columns > div > .spa-room-text-link { align-self: center; margin-top: auto; }
.spa-room-content > section > :is(.spa-room-facts, .spa-room-columns) + p { margin-top: 1.25rem; }
.spa-room-facts-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.spa-room-facts-three > div:nth-child(n) { border: 0; }
.spa-room-facts-three > div:not(:nth-child(3n+1)) { border-left: 1px solid var(--spa-room-grid-divider); }
.spa-room-facts-three > div:nth-child(n+4) { border-top: 1px solid var(--spa-room-grid-divider); }
.spa-room-content > .spa-room-details { padding: 0; }
.spa-room-details-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spa-room-details .spa-room-reading { padding: 1.75rem; background: var(--spa-room-heading); color: #fff; }
/* Share title/body tracks so paired items align even when a title wraps. */
.spa-room-details .spa-room-facts { grid-template-rows: auto 1fr auto 1fr; }
.spa-room-details .spa-room-facts > div { display: grid; grid-row: span 2; grid-template-rows: auto 1fr; grid-template-rows: subgrid; row-gap: .75rem; align-items: start; }
.spa-room-details .spa-room-facts dt { margin-bottom: 0; }
.spa-room-reading { min-width: 0; margin-inline: auto; }
.spa-room-content > .spa-room-planning { padding: 0; }
.spa-room-planning > h2 { margin: 0; padding: 1.25rem 1.5rem; background: var(--spa-room-heading); color: #fff; }
.spa-room-planning .spa-room-columns > div:first-child { border-top: 1px solid var(--spa-room-border); }
.spa-room-planning .spa-room-columns > div { padding: 1.5rem 2rem; }
.spa-room-conditions .spa-room-columns > div { text-align: left; }
.spa-room-feature-list { width: fit-content; max-width: 100%; margin: 0 auto; padding-left: 1.3rem; text-align: left; }
.spa-room-feature-list li { margin-bottom: .75rem; }
.spa-room-feature-list li:last-child { margin-bottom: 0; }
.spa-room-checklist { width: fit-content; max-width: 100%; margin: 1.25rem auto; padding-left: 1.75rem; }
.spa-room-checklist li { padding: .5rem 0 .5rem .25rem; }
.spa-room-checklist li::marker { color: var(--spa-room-heading); font-weight: 700; }
.spa-room-follow-up { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.spa-room-follow-up > .spa-room-checklist { margin-block: 0; }
.spa-room-follow-up > div { min-width: 0; text-align: center; }
.spa-room-follow-up .spa-room-note { margin-top: 0; }
.spa-room-note, .spa-room-warranty-activation { margin: 1.5rem auto; padding: 1rem 1.25rem; border-left: 4px solid var(--spa-room-button); background: var(--pool-dome-warm); }
.spa-room-warranty-activation { text-align: center; }
.spa-room-page-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem 0; margin: 0; padding: .75rem 0; border-bottom: 1px solid var(--spa-room-border); background: var(--spa-room-section-surface); font-size: 1rem; line-height: 1.5; }
.spa-room-page-links :is(span, a) { padding: .25rem 1rem; }
.spa-room-page-links span { font-weight: 700; }
.spa-room-page-links a { display: inline-flex; align-items: center; min-height: 44px; border-left: 1px solid var(--spa-room-border); }
.spa-room-content .spa-room-legal > p { text-align: left; }
.spa-room-legal .spa-room-columns p { text-align: left; }
.spa-room-package-price { text-align: center; }

.spa-room-project-help { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.5rem 2rem; align-items: center; margin-top: 1.5rem; padding: 1.5rem 2rem 1rem; border-top: 4px solid var(--spa-room-button); border-radius: 0 0 8px 8px; background: var(--spa-room-heading); color: #fff; }
.spa-room-project-help h2 { margin-bottom: .75rem; font-size: 1.6rem; }
.spa-room-help-copy { text-align: center; }
.spa-room-help-actions { min-width: 0; text-align: center; }
.spa-room-help-actions .spa-room-actions { margin: 0; }
.spa-room-help-actions > p { margin-top: 1rem; }
.spa-room-company-links { margin-bottom: 0; }
.spa-room-project-help > .spa-room-company-links { grid-column: 1 / -1; padding-top: 1rem; border-top: 1px solid var(--spa-room-border); }
.spa-room-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.spa-room-gallery figure { overflow: hidden; border: 1px solid var(--spa-room-border); border-radius: 8px; }
.spa-room-gallery figcaption { margin: 0; padding: 1rem; background: var(--spa-room-neutral); }
.spa-room-gallery a { display: block; }
.spa-room-gallery figure:focus-within { outline: 3px solid var(--spa-room-button); outline-offset: 3px; }
.spa-room-gallery img { width: 100%; }
.spa-room-qa { border-top: 1px solid var(--spa-room-border); }
.spa-room-qa details { border-bottom: 1px solid var(--spa-room-border); }
.spa-room-qa summary { display: flex; justify-content: space-between; gap: 1rem; align-items: center; min-height: 52px; padding: 1rem; background: var(--spa-room-neutral); color: var(--spa-room-heading); cursor: pointer; list-style: none; }
.spa-room-qa summary::-webkit-details-marker { display: none; }
.spa-room-qa summary:hover { background: var(--spa-room-hover); color: #fff; }
.spa-room-qa summary > span:first-child { flex: 1; min-width: 0; font-size: 1.25rem; line-height: 1.4; font-weight: 700; text-align: center; text-wrap: balance; }
.spa-room-qa-toggle { flex: 0 0 1.5rem; font-size: 1.5rem; line-height: 1; text-align: center; }
.spa-room-qa-toggle::before { content: "+"; }
.spa-room-qa details[open] .spa-room-qa-toggle::before { content: "−"; }
.spa-room-qa-answer { padding: 1rem 1rem 1.5rem; text-align: left; }
.spa-room-qa-answer p { margin: 0; }
.spa-room-qa-answer p + p { margin-top: .75rem; }

@media (max-width: 1023px) {
    /* Keep reading passages left-aligned; shared headings and cards stay centered. */
    .spa-room-content { text-align: left; }
    .spa-room-content > .spa-room-hero { display: block; min-height: 0; padding-top: 1.5rem; }
    .spa-room-hero > h1 { margin-inline: 1.5rem; }
    .spa-room-intro { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "lead" "photo" "copy"; gap: 0; }
    .spa-room-intro > .spa-room-lead { margin: 0 1.5rem 1.5rem; }
    .spa-room-hero-photo img { position: static; height: auto; }
    .spa-room-hero-copy { padding: 1.5rem; }
    .spa-room-details-layout, .spa-room-project-help, .spa-room-legal .spa-room-columns { grid-template-columns: minmax(0, 1fr); }
    .spa-room-legal .spa-room-columns > div:nth-child(even) { border-left: 0; border-top: 1px solid var(--spa-room-grid-divider); }
    .spa-room-facts-three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .spa-room-facts-three > div:nth-child(n) { border: 0; }
    .spa-room-facts-three > div:nth-child(even) { border-left: 1px solid var(--spa-room-grid-divider); }
    .spa-room-facts-three > div:nth-child(n+3) { border-top: 1px solid var(--spa-room-grid-divider); }

    /* Equal topic cells replace uneven, wrapped inline links on smaller screens. */
    .spa-room-page-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: .5rem; padding: .75rem; border: 1px solid var(--spa-room-border); }
    .spa-room-page-links > span { grid-column: 1 / -1; padding: 0 .5rem .25rem; text-align: center; }
    .spa-room-page-links a { justify-content: center; min-width: 0; min-height: 64px; padding: .5rem .75rem; border: 1px solid var(--spa-room-border); border-radius: 4px; background: #fff; font-weight: 700; line-height: 1.4; text-align: center; text-decoration: none; text-wrap: balance; }
    .spa-room-page-links a:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
    .spa-room-content .spa-room-page-links a:hover { background: var(--spa-room-heading); color: #fff; }
    .spa-room-page-links a:focus-visible { outline-offset: -3px; }
}
@media (max-width: 767px) {
    .spa-room-shell { width: calc(100% - 1rem); padding-top: 1rem; }
    .spa-room-breadcrumbs { margin-bottom: 1rem; }
    .spa-room-content h1 { font-size: 1.875rem; line-height: 1.2; }
    .spa-room-content h2 { margin-bottom: 1rem; font-size: 1.5rem; line-height: 1.3; }
    .spa-room-content > section { padding: 1rem; }
    .spa-room-content > section, .spa-room-project-help { margin-top: 1rem; }
    .spa-room-content > .spa-room-hero { padding-top: 1rem; }
    .spa-room-hero > h1 { margin-inline: 1rem; }
    .spa-room-intro > .spa-room-lead { margin: 0 1rem 1rem; font-size: 1.125rem; line-height: 1.65; }
    .spa-room-hero-copy { padding: 1rem; }
    .spa-room-gallery, .spa-room-columns, .spa-room-facts, .spa-room-follow-up { grid-template-columns: minmax(0, 1fr); }
    .spa-room-columns > div, .spa-room-facts > div { padding: 1rem; }
    .spa-room-columns > div:nth-child(n), .spa-room-facts > div:nth-child(n) { border-left: 0; border-top: 0; }
    .spa-room-columns > div:nth-child(n+2), .spa-room-facts > div:nth-child(n+2) { border-top: 1px solid var(--spa-room-grid-divider); }
    /* Let cells reach their section edges instead of doubling the reading inset. */
    .spa-room-content > section:not(.spa-room-planning):not(.spa-room-details) > :is(.spa-room-columns, .spa-room-facts, .spa-room-qa) { margin-inline: -1rem; }
    .spa-room-content > section > .spa-room-columns:only-child { margin-block: -1rem; }
    .spa-room-details .spa-room-reading { padding: 1rem; }
    .spa-room-details .spa-room-facts { grid-template-rows: none; }
    .spa-room-details .spa-room-facts > div { display: block; grid-row: auto; }
    .spa-room-details .spa-room-facts dt { margin-bottom: .75rem; }
    .spa-room-planning > h2 { margin-bottom: 0; padding: 1rem; }
    .spa-room-planning .spa-room-columns > div, .spa-room-project-help { padding: 1rem; }
    .spa-room-columns > div > .spa-room-text-link { margin-top: 0; }
    .spa-room-note, .spa-room-warranty-activation { padding-inline: .75rem; }
    .spa-room-actions { flex-direction: column; }
    .spa-room-actions .cta-button { width: 100%; padding-inline: .75rem; }
    .spa-room-qa summary { padding: 1rem; }
    .spa-room-qa-answer { padding: 1rem; }
    .spa-room-project-help > .spa-room-company-links { display: flex; flex-direction: column; align-items: center; gap: .25rem; }
    .spa-room-project-help > .spa-room-company-links a { display: inline-flex; align-items: center; min-height: 44px; }
    .spa-room-project-help > .spa-room-company-links span[aria-hidden="true"] { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .spa-room-actions .cta-button { transition: none; }
}