/* A continuous thread beside the story, from the room to the invitation. */
.self-journey { position: relative; isolation: isolate; background: var(--paper); }
.journey-thread {
  position: absolute;
  top: 0;
  right: max(24px, calc((100% - 1200px) / 2));
  width: 88px;
  height: 100%;
  z-index: 2;
  overflow: visible;
  pointer-events: none;
}
.thread-track { stroke: #d3d7cb; stroke-width: 1.3; }
.thread-progress { stroke: #a17c48; stroke-width: 2.1; stroke-linecap: round; opacity: 0; }
.journey-enhanced .thread-progress { opacity: 1; }
.thread-knot { fill: var(--paper); stroke: #b8c1b0; stroke-width: 1.5; transition: fill .35s, stroke .35s; }
.thread-knot.is-active { fill: #a17c48; stroke: #dfd1b6; }
.thread-head { fill: #c4a371; stroke: #fffefa; stroke-width: 2; opacity: 0; filter: drop-shadow(0 0 4px #d4b48180); }
.journey-enhanced .thread-head { opacity: 1; }
.self-journey .wrap {
  width: min(1000px, calc(100% - 160px));
  margin-inline-start: max(120px, calc((100% - 1000px) / 2));
  margin-inline-end: auto;
}
.self-journey .quote-inner { max-width: 1000px; }
.journey-label { display: flex; align-items: center; gap: 10px; line-height: 1.9; }
.journey-index {
  display: inline-grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  padding-inline: 6px;
  flex: none;
  border: 1px solid #d6d8c8;
  border-radius: 50%;
  color: #8b6d44;
  font-size: 11px;
  background: #f7f6f2;
}
.journey-step { scroll-margin-top: 32px; }
.journey-enhanced .journey-step { transition: opacity .65s ease; }
.journey-enhanced .journey-step:not(.is-revealed):not(:focus-within) { opacity: 0; }
.self-journey .intro-band { padding-block: 78px 70px; }
.self-journey .intro-grid { grid-template-columns: .75fr 1.15fr 1.2fr; gap: 32px; }
.self-journey .intro-grid .journey-label { margin-top: 6px; }
.self-journey .home-about { gap: 70px; }
.self-journey .quote-band { padding-inline: 0; }
.self-journey .quote-inner .journey-label { justify-content: center; margin-bottom: 25px; color: #62786a; }
.self-journey .quote-inner>p:last-child { max-width: 650px; margin-inline: auto; line-height: 2.2; }
.self-journey .quote-inner blockquote { max-width: 760px; margin-inline: auto; }
.self-journey .closing-cta .journey-index { background: #456052; border-color: #8b9e87; color: #ead9b6; }
.self-journey .closing-cta .closing-inner { gap: 28px; }
.self-journey .closing-cta .button { flex: none; }

/* The same scroll value lights the room, brightens the copy, and warms the CTA. */
.therapy-hero { --room-focus: 0; }
.therapy-stage .hero-copy::before { opacity: calc(.94 + var(--room-focus) * .06); }
.therapy-stage .hero-copy h1 {
  text-shadow: 0 0 calc(10px + var(--room-focus) * 18px) rgb(255 252 235 / calc(.1 + var(--room-focus) * .45));
}
.therapy-stage .hero-copy h1 em {
  color: rgb(calc(98 - var(--room-focus) * 35) calc(120 - var(--room-focus) * 22) calc(106 - var(--room-focus) * 32));
}
.therapy-stage .hero-copy .lead {
  color: rgb(calc(72 - var(--room-focus) * 20) calc(89 - var(--room-focus) * 16) calc(80 - var(--room-focus) * 17));
}
.therapy-stage .hero-booking {
  position: relative;
  isolation: isolate;
  min-height: 48px;
  background-color: rgb(calc(58 - var(--room-focus) * 21) calc(81 + var(--room-focus) * 5) calc(71 - var(--room-focus) * 13));
  color: #fffefa;
  box-shadow: 0 calc(4px + var(--room-focus) * 8px) calc(12px + var(--room-focus) * 20px) rgb(147 104 45 / calc(.03 + var(--room-focus) * .22)),
    0 0 0 calc(var(--room-focus) * 1.5px) rgb(196 164 111 / calc(var(--room-focus) * .65));
  transform: scale(calc(1 + var(--room-focus) * .035));
  transform-origin: center;
  transition: box-shadow .18s ease, background-color .18s ease, transform .18s ease;
}
.therapy-stage .hero-booking::before {
  content: '';
  position: absolute;
  inset: -20px;
  z-index: -1;
  border-radius: 30px;
  background: radial-gradient(ellipse, #dcb77835, #eed8a414 48%, transparent 72%);
  opacity: var(--room-focus);
  pointer-events: none;
}
.therapy-stage .hero-booking:hover {
  transform: translateY(-2px) scale(calc(1.02 + var(--room-focus) * .035));
  background-color: #254b35;
}
.therapy-stage .hero-booking:focus-visible { outline: 3px solid #9aa88e; outline-offset: 5px; }

@media (max-width: 1000px) {
  .journey-thread { right: 14px; width: 70px; }
  .self-journey .wrap { width: calc(100% - 124px); margin-inline-start: 100px; }
  .self-journey .intro-grid { grid-template-columns: 1fr 1.2fr; gap: 22px; }
  .self-journey .intro-grid .journey-label { grid-column: 1 / -1; margin: 0; }
  .self-journey .home-about { gap: 40px; }
}
@media (max-width: 680px) {
  .journey-thread { right: 8px; width: 38px; }
  .self-journey .wrap { width: calc(100% - 82px); margin-inline-start: 60px; margin-inline-end: 22px; }
  .self-journey .intro-band { padding-block: 55px 48px; }
  .self-journey .intro-grid { grid-template-columns: 1fr; gap: 14px; }
  .self-journey .intro-grid h2 { font-size: 25px; }
  .self-journey .intro-grid .journey-label { grid-column: auto; }
  .journey-label { font-size: 10px; gap: 8px; }
  .journey-index { min-width: 26px; height: 26px; font-size: 10px; }
  .self-journey .home-about { gap: 32px; }
  .self-journey .home-about h2 { font-size: 25px; }
  .self-journey .section-heading h2 { font-size: 23px; }
  .self-journey .quote-inner .journey-label { justify-content: flex-start; }
  .self-journey .quote-inner blockquote { font-size: 21px; text-align: right; }
  .self-journey .quote-inner>p:last-child { text-align: right; }
  .self-journey .closing-inner { align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .journey-enhanced .journey-step { opacity: 1 !important; transition: none; }
  .thread-knot { transition: none; }
  .therapy-stage .hero-booking, .therapy-stage .hero-booking:hover { transform: none; transition: none; }
}
@media print {
  .journey-thread { display: none; }
  .journey-enhanced .journey-step { opacity: 1 !important; }
  .self-journey .wrap { width: 100%; margin-inline: 0; }
}
