/* ============================================================================
   Home & Space Energy Cleansing - the flagship page in the light design (October 2026 preview).

   Loaded on /home-cleansing/ only, after site.css, and scoped to body[data-page="home-cleansing"].
   The approved homepage is the reference: full-width photographs where they tell the story, one deep
   teal signature band for Clear. Bless. Protect., ivory cards, gold numerals and line icons, and a
   refined price card. The owner's photographs are cropped by CSS only and never overlaid at a face
   (there are no people in them; the portrait is shown whole).
   ========================================================================== */

[data-page="home-cleansing"] main section { position: relative; }
[data-page="home-cleansing"] main p, [data-page="home-cleansing"] main li { max-width: none; }
.hc-intro { text-align: center; max-width: 46rem; margin: 0 auto; }
.hc-intro .lede { margin-inline: auto; }
.hc-leaves { position: absolute; color: #8a9a6e; opacity: .55; pointer-events: none; width: clamp(5rem, 9vw, 8.5rem); }
.hc-leaves-tr { right: -1rem; top: -1rem; transform: scaleX(-1); }
.hc-leaves-bl { left: -1.25rem; bottom: -1.25rem; transform: rotate(-10deg); }

/* ---------------------------------------------------------------- A. the opening */

[data-page="home-cleansing"] .hero {
  overflow: hidden; isolation: isolate;
  padding-block: clamp(3rem, 6vw, 5rem);
  background: var(--bg);
}
/* The owner's 1536x1024 photograph at its own 3:2 shape, never stretched or cropped: on a desktop it
   takes the right half of the screen to the edge (720x480 at 1440 wide, so a 2x screen still gets its
   full 1536 pixels), vertically centred beside the text, which keeps its own clean cream column. */
.hc-hero-photo { display: block; }
.hc-hero-photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; }
@media (min-width: 56rem) {
  [data-page="home-cleansing"] .hero { min-height: calc(50vw * 2 / 3 + 5rem); display: flex; align-items: center; }
  [data-page="home-cleansing"] .hero .hero-grid { width: min(100% - 2.5rem, var(--wrap)); }
  .hc-hero-photo { position: absolute; z-index: -1; right: 0; top: 50%; transform: translateY(-50%); width: 50vw; }
  .hc-hero-photo img { border-radius: 26px 0 0 26px; box-shadow: 0 30px 60px -30px rgba(80, 60, 20, .4); }
  [data-page="home-cleansing"] .hero .hero-grid > * { max-width: min(35rem, calc(50vw - max(1.25rem, (100vw - var(--wrap)) / 2) - 3.5rem)); }
}
[data-page="home-cleansing"] .hero .hero-grid { display: block; }
[data-page="home-cleansing"] .hero .hero-grid > * { margin-block: 0; }
@media (max-width: 55.999rem) { [data-page="home-cleansing"] .hero .hero-grid > * { max-width: 36rem; } }
[data-page="home-cleansing"] .hero h1 { font-size: clamp(2.3rem, 1.4rem + 2.6vw, 3.7rem); line-height: 1.07; letter-spacing: -0.02em; margin-bottom: .5em; }
[data-page="home-cleansing"] .hero .hero-body p { font-size: clamp(1.02rem, .98rem + .2vw, 1.14rem); line-height: 1.62; }
[data-page="home-cleansing"] .hero .btn-row { margin-top: 1.6rem; }
[data-page="home-cleansing"] .hero .cta-secondary { margin-top: .8rem; }
.hc-byline {
  margin-top: 1.6rem !important; display: inline-flex; align-items: center; gap: .9rem;
  padding: .55rem 1.1rem .55rem .55rem; border-radius: 999px;
  background: rgba(255, 253, 248, .92); border: 1px solid var(--border); box-shadow: var(--shadow);
}
[data-page="home-cleansing"] .hc-byline .portrait { width: 3.6rem; aspect-ratio: 1; border-radius: 50%; margin: 0; flex: none; box-shadow: 0 0 0 1px rgba(184, 137, 47, .45), 0 0 0 4px rgba(255, 253, 248, .9); }
[data-page="home-cleansing"] .hc-byline .portrait img { object-position: 50% 18%; }
[data-page="home-cleansing"] .hc-byline .hero-sign { margin: 0; font-size: .9rem; line-height: 1.4; color: var(--ink-soft); max-width: 19rem; }
@media (max-width: 55.999rem) {
  [data-page="home-cleansing"] .hero { padding-top: 0; }
  .hc-hero-photo { margin: 0 0 1.75rem; }
  .hc-byline { border-radius: 18px; }
}

/* ---------------------------------------------------------------- B. what you may be experiencing */

.hc-why { padding-block: clamp(3.25rem, 6vw, 5rem); background: linear-gradient(180deg, #fffaf1, var(--bg)); overflow: hidden; }
.hc-situations {
  list-style: none; padding: 0; margin: clamp(1.75rem, 3vw, 2.5rem) 0 0;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem;
}
.hc-situations li {
  grid-column: span 2; display: flex; gap: 1rem; align-items: flex-start;
  background: var(--ivory); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow);
  padding: 1.35rem 1.3rem; font-size: 1.02rem; line-height: 1.55; color: var(--ink-soft);
}
.hc-situations li:nth-child(4) { grid-column: 2 / span 2; }
.hc-situations svg { flex: none; width: 2.4rem; height: 2.4rem; color: var(--gold); margin-top: .1rem; }
.hc-reassure { text-wrap: balance; max-width: 42rem; margin: clamp(2.25rem, 4vw, 3.25rem) auto 0; text-align: center; }
.hc-reassure p { margin: 0 0 .9rem; color: var(--ink-soft); }
.hc-reassure .hc-reassure-lead { font-family: var(--font-head); font-size: clamp(1.25rem, 1.1rem + .6vw, 1.55rem); line-height: 1.35; color: var(--ink); margin-bottom: .35rem; }
.hc-reassure .hc-reassure-lead + p:not(.hc-reassure-lead) { margin-top: 1.1rem; }
@media (max-width: 63.999rem) {
  .hc-situations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hc-situations li, .hc-situations li:nth-child(4) { grid-column: auto; }
  .hc-situations li:last-child { grid-column: 1 / -1; }
}
@media (max-width: 39.999rem) {
  .hc-situations { grid-template-columns: 1fr; gap: .75rem; }
  .hc-situations li { padding: 1.1rem; }
}

/* ---------------------------------------------------------------- C. Clear. Bless. Protect. */

/* The one deep band on the page: the signature of the work. Gold on deep teal, as in the footer,
   with the owner's lotus photograph glowing beside the three stages. */
.hc-signature {
  padding-block: clamp(3.5rem, 7vw, 5.75rem);
  background:
    radial-gradient(ellipse 55% 70% at 22% 45%, rgba(230, 196, 124, .16), rgba(230, 196, 124, 0) 70%),
    radial-gradient(ellipse 70% 90% at 90% 10%, #16505a, rgba(22, 80, 90, 0) 70%),
    var(--teal);
  color: #dce6e5;
}
.hc-signature-grid { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hc-lotus { position: relative; isolation: isolate; }
.hc-lotus::before { content: ""; position: absolute; inset: -8%; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(246, 220, 156, .35), rgba(246, 220, 156, 0) 68%); }
.hc-lotus img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 28px; box-shadow: 0 0 0 1px rgba(230, 196, 124, .35), 0 30px 60px -24px rgba(0, 0, 0, .55); }
.hc-signature .eyebrow { color: var(--gold-bright); }
.hc-signature h2 { color: #f3dca5; font-size: clamp(2.2rem, 1.6rem + 2.4vw, 3.4rem); letter-spacing: -0.015em; margin-bottom: .4em; }
.hc-signature .lede { color: #dce6e5; font-size: clamp(1.05rem, 1rem + .25vw, 1.2rem); max-width: 34rem; }
.hc-signature .stages { grid-template-columns: 1fr; gap: 0; margin-top: 1.75rem; }
.hc-signature .stages li { border-top: 1px solid rgba(230, 196, 124, .28); padding: 1.25rem 0 1.15rem; }
.hc-signature .stages li:last-child { border-bottom: 1px solid rgba(230, 196, 124, .28); }
.hc-signature .stages h3 { color: #f3dca5; font-size: clamp(1.35rem, 1.2rem + .5vw, 1.6rem); margin-bottom: .35rem; }
.hc-signature .stages h3::before { width: 2.3rem; height: 2.3rem; font-size: 1rem; }
.hc-signature .stages p { color: #d7e2e0; font-size: 1.03rem; line-height: 1.6; max-width: 34rem; padding-left: 3rem; }
.hc-signature-close { margin-top: clamp(2.5rem, 5vw, 3.75rem); text-align: center; }
[data-page="home-cleansing"] .hc-signature-close .pull-line { color: #f3dca5; font-style: italic; font-size: clamp(1.45rem, 1.15rem + 1.2vw, 2.1rem); max-width: 40rem; margin: 0 auto 1rem; }
[data-page="home-cleansing"] .hc-signature-close p { color: #c9d6d4; max-width: 40rem; margin: 0 auto; }
@media (max-width: 55.999rem) {
  .hc-signature-grid { grid-template-columns: 1fr; }
  .hc-lotus { max-width: 24rem; margin: 0 auto; }
  .hc-signature .stages p { padding-left: 0; }
}

/* ---------------------------------------------------------------- D. the experience */

.hc-facts { padding-block: clamp(3rem, 5.5vw, 4.25rem); background: var(--ivory); border-bottom: 1px solid var(--border); }
.hc-fact-list { list-style: none; padding: 0; margin: clamp(1.75rem, 3vw, 2.25rem) 0 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
.hc-fact-list li { text-align: center; padding: .4rem 1.1rem; border-left: 1px solid var(--border); }
.hc-fact-list li:first-child { border-left: 0; }
.hc-fact-list svg { display: block; width: 2.8rem; height: 2.8rem; margin: 0 auto .8rem; color: var(--gold); }
.hc-fact-list strong { display: block; font-family: var(--font-head); font-size: 1.18rem; color: var(--ink); margin-bottom: .3rem; }
.hc-fact-list span { display: block; font-size: .95rem; line-height: 1.5; color: var(--muted); }
@media (max-width: 63.999rem) {
  .hc-fact-list { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 1.75rem; }
  .hc-fact-list li { grid-column: span 2; }
  .hc-fact-list li:nth-child(4) { grid-column: 2 / span 2; border-left: 0; }
  .hc-fact-list li:nth-child(5) { grid-column: 4 / span 2; }
}
@media (max-width: 39.999rem) {
  .hc-fact-list { grid-template-columns: 1fr 1fr; }
  .hc-fact-list li, .hc-fact-list li:nth-child(4), .hc-fact-list li:nth-child(5) { grid-column: auto; border-left: 0; padding: .3rem .4rem; }
  .hc-fact-list li:last-child { grid-column: 1 / -1; }
}

/* ---------------------------------------------------------------- E. receiving */

.hc-receive { overflow: hidden; isolation: isolate; padding-block: clamp(3.5rem, 7vw, 6rem); }
.hc-receive-art, .hc-receive-art img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.hc-receive-art img { object-fit: cover; object-position: 50% 50%; }
.hc-receive-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 250, 238, .35), rgba(255, 250, 238, .15) 60%, rgba(251, 246, 236, .6)); }
.hc-receive-card {
  max-width: 44rem; margin: 0 auto; padding: clamp(1.75rem, 4vw, 2.75rem);
  background: rgba(255, 253, 248, .9); border: 1px solid rgba(234, 223, 202, .9); border-radius: 22px;
  box-shadow: 0 24px 60px -30px rgba(80, 60, 20, .35); backdrop-filter: blur(2px);
}
.hc-receive-card h2 { text-align: center; font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.7rem); margin-bottom: .2em; }
.hc-receive-sub { text-align: center; font-family: var(--font-head); font-style: italic; color: var(--gold-text); font-size: 1.15rem; margin: 0 0 1.25rem; }
.hc-receive-card > p { color: var(--ink-soft); }
.hc-breath { list-style: none; counter-reset: breath; padding: 0; margin: 1.2rem 0; display: grid; gap: .9rem; }
.hc-breath li { counter-increment: breath; position: relative; padding-left: 3rem; color: var(--ink-soft); line-height: 1.6; }
.hc-breath li::before {
  content: counter(breath); position: absolute; left: 0; top: -.05rem; width: 2.1rem; height: 2.1rem; border-radius: 50%;
  display: grid; place-items: center; font-family: var(--font-head); font-weight: 600; color: #fff; font-size: .95rem;
  background: radial-gradient(circle at 35% 30%, #d5b06a, var(--gold) 70%); box-shadow: 0 1px 3px rgba(120, 85, 20, .3); text-shadow: 0 1px 1px rgba(90, 60, 10, .45);
}
.hc-receive-note { margin: 1.25rem 0 0; text-align: center; font-family: var(--font-head); font-size: 1.12rem; color: var(--ink); }
@media (max-width: 39.999rem) { .hc-receive-art img { object-position: 15% 50%; } }

/* ---------------------------------------------------------------- F. a new beginning */

.hc-newhome { padding-block: clamp(3.5rem, 7vw, 5.75rem); background: linear-gradient(180deg, var(--bg), #f8efdf); overflow: hidden; }
.hc-newhome-grid { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hc-house { margin: 0; }
.hc-house img {
  width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 22px; display: block;
  box-shadow: 0 0 0 1px rgba(184, 137, 47, .35), 0 0 0 8px rgba(255, 253, 248, .85), 0 0 0 9px rgba(184, 137, 47, .2), 0 28px 56px -24px rgba(80, 60, 20, .35);
}
.hc-newhome-copy p { color: var(--ink-soft); }
.hc-newhome-copy .lede { font-family: var(--font-head); color: var(--ink); font-size: clamp(1.2rem, 1.08rem + .5vw, 1.42rem); line-height: 1.4; }
.hc-newhome-copy .pull-line { margin-top: 1.5rem; padding-left: 1.1rem; border-left: 2px solid var(--gold); font-style: italic; font-size: clamp(1.2rem, 1.1rem + .45vw, 1.42rem); }
@media (max-width: 55.999rem) {
  .hc-newhome-grid { grid-template-columns: 1fr; }
  .hc-house { max-width: 30rem; margin: 0 auto; }
}

/* ---------------------------------------------------------------- G. booking */

.hc-price { padding-block: clamp(3.5rem, 7vw, 5.5rem); background: radial-gradient(ellipse 60% 80% at 50% 0%, #fff6e3, rgba(255, 246, 227, 0) 70%), linear-gradient(180deg, #f8efdf, var(--bg)); }
.hc-price-card {
  display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); max-width: 62rem; margin: 0 auto;
  background: var(--ivory); border: 1px solid rgba(184, 137, 47, .45); border-radius: 26px; overflow: hidden;
  box-shadow: 0 0 0 6px rgba(255, 253, 248, .7), 0 0 0 7px rgba(184, 137, 47, .18), 0 36px 70px -36px rgba(80, 60, 20, .45);
}
.hc-price-head {
  text-align: center; padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.25rem);
  background: radial-gradient(ellipse 80% 70% at 50% 30%, #fff8e8, #f6ead2); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.hc-price-mark { width: 3.4rem; height: 2.2rem; color: var(--gold); margin-bottom: .8rem; }
.hc-price-head h2 { font-size: clamp(1.45rem, 1.25rem + .8vw, 1.85rem); margin-bottom: .2rem; }
.hc-price .price-panel { display: block; margin: .6rem 0 0; max-width: none; }
.hc-price .price-figure, .hc-price .price-figure.lead { border: 0; background: none; box-shadow: none; padding: 0; text-align: center; }
.hc-price .price-amt { font-size: clamp(3.4rem, 2.6rem + 3vw, 4.6rem); line-height: 1; color: var(--ink); letter-spacing: -0.02em; margin: .3rem 0 .35rem; }
.hc-price .price-note { color: var(--muted); font-size: .95rem; }
.hc-price-meta { margin: 1rem 0 0; font-size: .93rem; color: var(--gold-text); letter-spacing: .02em; text-wrap: balance; }
.hc-price-body { padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3.5vw, 2.75rem); }
.hc-includes { list-style: none; padding: 0; margin: 0 0 1.4rem; display: grid; gap: .85rem; }
.hc-includes li { position: relative; padding-left: 2.1rem; color: var(--ink); line-height: 1.5; }
.hc-includes li::before {
  content: ""; position: absolute; left: 0; top: .15rem; width: 1.3rem; height: 1.3rem; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #d5b06a, var(--gold) 70%);
}
.hc-includes li::after { content: ""; position: absolute; left: .42rem; top: .42rem; width: .3rem; height: .55rem; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.hc-price-body .stack p { color: var(--ink-soft); font-size: .98rem; }
.hc-price-body .btn-row { margin-top: 1.5rem; }
.hc-price-body .btn-lg { width: 100%; text-align: center; }
.hc-price-fine { margin: 1rem 0 0; font-size: .85rem; color: var(--muted); text-align: center; }
.hc-price-fine a { color: var(--muted); }
@media (max-width: 55.999rem) {
  .hc-price-card { grid-template-columns: 1fr; }
  .hc-price-head { border-right: 0; border-bottom: 1px solid var(--border); }
}

/* ---------------------------------------------------------------- H. questions and trust */

.hc-together { padding-block: clamp(3rem, 6vw, 4.5rem); }
.hc-together-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.75rem, 5vw, 4rem); align-items: start; max-width: 64rem; margin-inline: auto; }
.hc-together-mark { width: 3rem; height: 2rem; color: var(--gold); margin-bottom: .6rem; }
.hc-together .pull-line { margin-top: .6rem; text-wrap: balance; }
.hc-together .stack p { color: var(--ink-soft); }
@media (max-width: 55.999rem) { .hc-together-grid { grid-template-columns: 1fr; } }
[data-page="home-cleansing"] #questions .disclaimer { margin-top: 2.25rem; }

.hc-trust { padding-block: clamp(3.5rem, 7vw, 5.5rem); background: linear-gradient(180deg, #f6ecd9, var(--bg-warm)); }
.hc-trust-grid { display: grid; grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; max-width: 64rem; margin-inline: auto; }
.hc-trust-photo { margin: 0 auto; width: min(22rem, 100%); position: relative; isolation: isolate; }
.hc-trust-photo::before { content: ""; position: absolute; inset: -12%; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(230, 196, 124, .45), rgba(230, 196, 124, 0) 68%); }
.hc-trust-photo img {
  display: block; width: 100%; height: auto; border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(184, 137, 47, .4), 0 0 0 8px rgba(255, 253, 248, .85), 0 0 0 9px rgba(184, 137, 47, .22), 0 24px 48px -20px rgba(80, 60, 20, .35);
}
.hc-trust-copy h2 { font-size: clamp(1.9rem, 1.45rem + 1.6vw, 2.6rem); }
.hc-trust-copy p { color: var(--ink-soft); }
.hc-trust-copy .lede { font-family: var(--font-head); color: var(--ink); font-size: clamp(1.2rem, 1.08rem + .5vw, 1.4rem); }
.hc-trust-copy .signature { margin-top: 1.75rem; }
@media (max-width: 55.999rem) {
  .hc-trust-grid { grid-template-columns: 1fr; text-align: center; }
  .hc-trust-photo { width: min(18rem, 76vw); }
  .hc-trust-copy .btn-row { justify-content: center; }
}

/* The "receive" art is a 2000x486 panorama. Filling the whole (much taller) section with it enlarged
   it about 1.7x on a desktop. It now keeps its own proportions across the top of the section and
   fades into the cream below, so it is never shown larger than its pixels. */
.hc-receive-art img { height: auto; bottom: auto; object-fit: initial;
  -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); }
@media (max-width: 39.999rem) {
  .hc-receive-art img { height: 18rem; object-fit: cover; }
}