/* ==========================================================================
   BodBei · The Self Companion · Homepage
   v1.0 · May 2026
   Anchored to Visual Foundation v0.1, Mode Bridge v1.0, Foundational Reference v1.0
   ========================================================================== */

/* ============ DESIGN TOKENS ============ */
:root {
  /* Pulse (dark) palette */
  --pulse-deep-ink-navy: #0F1B2D;
  --pulse-twilight-blue: #1A2B40;
  --pulse-inkwell-black: #0A0E14;
  --pulse-notebook-white: #FBFAF7;
  --pulse-magazine-cream: #F4F1EB;

  /* Page (light) palette */
  --page-magazine-cream: #F4F1EB;
  --page-aged-parchment: #EFE8D7;
  --page-warm-ink-black: #1A1A1A;
  --page-earth-brown: #5A4A3A;

  /* Cross-mode accents */
  --pulse-red: #E63946;
  --terra-red: #C1432B;
  --sunlight-amber: #F4A300;
  --muted-gold: #A8842D;
  --lab-blue: #1D4F7C;
  --forest-green: #3D6B5C;
  --forest-green-deep: #2D5648;
  --recovery-mint: #5DBFA9;
  --sage-green: #7A8B6F;
  --warm-grey: #BFB5A5;

  /* Typography */
  --font-serif: 'Libre Baskerville', Georgia, serif;
  --font-sans: 'DM Sans', system-ui, sans-serif;
  --font-hand: 'Caveat', cursive;

  /* Fluid type scale (clamped: min, vw-based, max) */
  --t1: clamp(2.5rem, 5.5vw, 4.25rem);   /* Hero headlines */
  --t2: clamp(2rem, 4.2vw, 3.25rem);     /* Section headlines */
  --t3: clamp(1.5rem, 2.8vw, 2.1rem);    /* Sub-headlines */
  --t4: clamp(1.1rem, 1.8vw, 1.35rem);   /* Insight lines */
  --t5: clamp(1rem, 1.5vw, 1.15rem);     /* Body */
  --t6: clamp(0.75rem, 1vw, 0.85rem);    /* Micro labels */

  /* Layout */
  --container: 1240px;
  --container-narrow: 920px;
  --gutter: clamp(1.5rem, 4vw, 4rem);
  --section-pad-y: clamp(5rem, 10vw, 8rem);

  /* Motion */
  --ease: cubic-bezier(0.22, 0.65, 0.34, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-base: 600ms;
}

/* ============ RESET ============ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-sans);
  font-size: var(--t5);
  line-height: 1.6;
  color: var(--page-warm-ink-black);
  background: var(--page-magazine-cream);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, svg { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

ul, ol { list-style: none; }

button { font: inherit; cursor: pointer; background: none; border: none; color: inherit; }

/* Selection */
::selection { background: var(--pulse-red); color: var(--pulse-notebook-white); }

/* ============ UTILITIES ============ */
.accent { color: var(--pulse-red); }
.accent-terra { color: var(--terra-red); }
.accent-gold { color: var(--muted-gold); }
.accent-amber { color: var(--sunlight-amber); font-style: italic; }

.bodybeing-term {
  color: var(--muted-gold);
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 700;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  transition: border-color 250ms var(--ease), color 250ms var(--ease);
}
a.bodybeing-term:hover {
  border-bottom-color: var(--muted-gold);
  color: var(--terra-red);
}

.fade-in { opacity: 1; }
.js-loaded .fade-in {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 900ms var(--ease), transform 900ms var(--ease);
}
.js-loaded .fade-in.is-visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  .js-loaded .fade-in { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* Link-out — section-level "Read more" affordance */
.link-out {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--t5);
  color: var(--pulse-red);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: gap 250ms var(--ease), border-color 250ms var(--ease);
}
.link-out:hover {
  gap: 0.8em;
  border-bottom-color: var(--pulse-red);
}
.link-out .arrow { transition: transform 250ms var(--ease); }
.link-out:hover .arrow { transform: translateX(4px); }

.link-out--light { color: var(--sunlight-amber); }
.link-out--light:hover { border-bottom-color: var(--sunlight-amber); }


/* ==========================================================================
   NAVIGATION
   ========================================================================== */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 1.25rem 0;
  transition: background 400ms var(--ease), padding 400ms var(--ease), backdrop-filter 400ms var(--ease);
  background: transparent;
}
.nav.is-scrolled {
  padding: 0.7rem 0;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.nav[data-theme="dark"].is-scrolled {
  background: rgba(15, 27, 45, 0.85);
  border-bottom: 1px solid rgba(244, 241, 235, 0.08);
}
.nav[data-theme="light"].is-scrolled {
  background: rgba(244, 241, 235, 0.92);
  border-bottom: 1px solid rgba(90, 74, 58, 0.1);
}

.nav__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.nav__brand {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--font-serif);
  font-size: 1.4rem;
  line-height: 1;
  letter-spacing: 0.005em;
}
.nav__mark { height: 40px; width: auto; transition: opacity 300ms var(--ease); }
.nav[data-theme="dark"] .nav__mark--dark,
.nav[data-theme="light"] .nav__mark--light { opacity: 1; display: block; }
.nav[data-theme="dark"] .nav__mark--light,
.nav[data-theme="light"] .nav__mark--dark { opacity: 0; display: none; }

.nav__wordmark { font-style: normal; transition: color 300ms var(--ease); }
.nav[data-theme="dark"] .nav__wordmark { color: var(--pulse-notebook-white); }
.nav[data-theme="light"] .nav__wordmark { color: var(--page-warm-ink-black); }

.nav__items {
  display: flex;
  align-items: center;
  gap: 2.25rem;
}
.nav__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
  position: relative;
  padding: 0.4rem 0;
  transition: color 300ms var(--ease);
}
.nav[data-theme="dark"] .nav__link { color: var(--pulse-magazine-cream); }
.nav[data-theme="light"] .nav__link { color: var(--page-warm-ink-black); }
.nav__link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 0; height: 1px;
  background: var(--pulse-red);
  transition: width 280ms var(--ease);
}
.nav__link:hover::after { width: 100%; }
.nav__link--dropdown::before {
  content: '▾';
  font-size: 0.65em;
  margin-right: 0.35em;
  display: inline-block;
  transform: translateY(-1px);
}

.nav__dropdown { position: relative; }
.nav__submenu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-8px);
  padding: 0.6rem 0;
  min-width: 200px;
  background: var(--page-magazine-cream);
  border: 1px solid rgba(90, 74, 58, 0.15);
  border-radius: 4px;
  box-shadow: 0 12px 32px rgba(15, 27, 45, 0.12);
  opacity: 0;
  visibility: hidden;
  transition: opacity 250ms var(--ease), transform 250ms var(--ease), visibility 250ms;
}
@media (hover: hover) and (pointer: fine) {
  .nav__dropdown:hover .nav__submenu,
  .nav__dropdown:focus-within .nav__submenu {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
}
.nav__submenu li a {
  display: block;
  padding: 0.55rem 1.2rem;
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--page-warm-ink-black);
  transition: background 200ms var(--ease), color 200ms var(--ease);
}
.nav__submenu li a:hover {
  background: var(--page-aged-parchment);
  color: var(--terra-red);
}

.nav__cta {
  display: inline-block;
  padding: 0.65rem 1.4rem;
  background: var(--pulse-red);
  color: var(--pulse-notebook-white) !important;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
  border-radius: 2px;
  transition: background 250ms var(--ease), transform 250ms var(--ease);
}
.nav__cta:hover {
  background: var(--terra-red);
  transform: translateY(-1px);
}
.nav__cta::after { display: none; }

.nav__toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 6px;
  position: relative;
  z-index: 110;
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: opacity 200ms var(--ease);
}
body.nav-open .nav__toggle { opacity: 0; pointer-events: none; }
.nav__toggle span {
  width: 24px;
  height: 1.5px;
  background: var(--pulse-magazine-cream);
  transition: background 250ms var(--ease), transform 300ms var(--ease), opacity 300ms var(--ease);
}
.nav[data-theme="light"] .nav__toggle span { background: var(--page-warm-ink-black); }
.nav__toggle.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2) { opacity: 0; }
.nav__toggle.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }


/* ==========================================================================
   SECTION 1 · HERO · Pulse 1b · Deep Ink Navy
   ========================================================================== */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: clamp(7rem, 12vw, 9rem) 0 clamp(4rem, 8vw, 6rem);
  background: var(--pulse-deep-ink-navy);
  color: var(--pulse-magazine-cream);
  overflow: hidden;
}

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero__portrait {
  position: absolute;
  top: 0; right: 0;
  width: 60%;
  height: 100%;
  object-fit: cover;
  object-position: center right;
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    var(--pulse-deep-ink-navy) 0%,
    var(--pulse-deep-ink-navy) 35%,
    rgba(15, 27, 45, 0.85) 50%,
    rgba(15, 27, 45, 0.45) 70%,
    rgba(15, 27, 45, 0.15) 100%
  );
}
.hero__grain {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(244, 241, 235, 0.04) 1px, transparent 0);
  background-size: 3px 3px;
  pointer-events: none;
}

.hero__content {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}
@media (min-width: 900px) {
  .hero__content { max-width: calc(var(--container)); }
  .hero__content > * { max-width: 58%; }
  .hero__ctas { max-width: 58% !important; }
}

.hero__micro {
  font-family: var(--font-sans);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: var(--t6);
  color: var(--warm-grey);
  margin-bottom: 0.5rem;
}

.hero__headline {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t1);
  line-height: 1.08;
  color: var(--pulse-notebook-white);
  letter-spacing: -0.005em;
  margin-bottom: 0.3em;
}

.hero__sub {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--t4);
  line-height: 1.45;
  color: var(--pulse-magazine-cream);
  margin-bottom: 0.35em;
}

.hero__third {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--t4);
  color: var(--sunlight-amber);
  margin-bottom: 2.5rem;
}

.hero__caveat {
  font-family: var(--font-hand);
  font-weight: 500;
  font-size: clamp(1.4rem, 2.4vw, 1.85rem);
  line-height: 1.4;
  color: var(--sunlight-amber);
  transform: rotate(-1.2deg);
  margin: 0 0 3rem;
  padding-left: 1.2rem;
  border-left: 2px solid var(--sunlight-amber);
  max-width: 540px !important;
}
.hero__caveat p { margin-bottom: 0.15em; }
.hero__caveat p:first-child { font-weight: 700; }

.hero__action {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.1rem;
}
.hero__action .cta--button {
  align-self: flex-start;
}
.hero__action-note {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--warm-grey);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: color 250ms var(--ease), border-color 250ms var(--ease);
}
.hero__action-note:hover {
  color: var(--sunlight-amber);
  border-bottom-color: var(--sunlight-amber);
}

.cta {
  display: flex;
  flex-direction: column;
  padding: 1.15rem 1.3rem 1.25rem;
  border-radius: 3px;
  transition: transform 300ms var(--ease), background 300ms var(--ease), border-color 300ms var(--ease);
  text-align: left;
}
.cta__label {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  margin-bottom: 0.4em;
  line-height: 1.2;
}
.cta__desc {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 0.88rem;
  line-height: 1.45;
  opacity: 0.85;
}

.cta--primary {
  background: var(--pulse-red);
  color: var(--pulse-notebook-white);
}
.cta--primary:hover {
  background: var(--terra-red);
  transform: translateY(-2px);
}

.cta--secondary {
  background: transparent;
  color: var(--pulse-magazine-cream);
  border: 1px solid rgba(244, 241, 235, 0.35);
}
.cta--secondary:hover {
  background: rgba(244, 241, 235, 0.06);
  border-color: var(--pulse-red);
  color: var(--pulse-notebook-white);
  transform: translateY(-2px);
}

.cta--button {
  align-items: center;
  flex-direction: row;
  justify-content: center;
  gap: 0.6em;
  padding: 1.1rem 2.5rem;
  background: var(--pulse-red);
  color: var(--pulse-notebook-white);
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  border-radius: 3px;
}
.cta--button:hover {
  background: var(--terra-red);
  transform: translateY(-2px);
}
.cta--button .arrow { transition: transform 250ms var(--ease); }
.cta--button:hover .arrow { transform: translateX(4px); }


/* ==========================================================================
   SECTION 2 · THE SELF · Page 2b Editorial · Magazine Cream
   ========================================================================== */
.self {
  position: relative;
  padding: var(--section-pad-y) 0;
  background: var(--page-magazine-cream);
  color: var(--page-warm-ink-black);
  overflow: hidden;
}
.self::before {
  /* Paper texture overlay */
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(90, 74, 58, 0.04) 1px, transparent 0);
  background-size: 4px 4px;
  pointer-events: none;
}

.self__decor {
  position: absolute;
  pointer-events: none;
  opacity: 0.12;
  z-index: 0;
}
.self__decor--mandala {
  top: 4rem;
  right: -5rem;
  width: 320px; height: 320px;
}
.self__decor--leaf {
  bottom: 2rem;
  left: -3rem;
  width: 280px; height: 280px;
  opacity: 0.18;
}

.self__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.self__head { text-align: center; margin-bottom: clamp(3rem, 6vw, 5rem); }

.self__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t2);
  line-height: 1.15;
  letter-spacing: -0.005em;
  margin-bottom: 1.4em;
  max-width: 22ch;
  margin-inline: auto;
}

.self__body {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t4);
  line-height: 1.65;
  max-width: 60ch;
  margin-inline: auto;
  color: var(--page-earth-brown);
}

.vectors {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: clamp(3rem, 6vw, 4.5rem);
}
.vector {
  text-align: center;
  padding: 2rem 1rem;
  background: rgba(239, 232, 215, 0.4);
  border: 1px solid rgba(90, 74, 58, 0.12);
  border-radius: 4px;
  transition: transform 400ms var(--ease), background 400ms var(--ease), border-color 400ms var(--ease);
  position: relative;
}
.vector:hover {
  transform: translateY(-4px);
  background: rgba(239, 232, 215, 0.7);
  border-color: rgba(193, 67, 43, 0.35);
}
.vector__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 1.2rem;
}
.vector__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.2;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.35em;
}
.vector__desc {
  font-family: var(--font-sans);
  font-size: 0.94rem;
  line-height: 1.55;
  color: var(--page-earth-brown);
}

.self__foot { text-align: center; }
.self__closing {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--t4);
  line-height: 1.6;
  max-width: 56ch;
  margin: 0 auto 1.6rem;
  color: var(--page-warm-ink-black);
}


/* ==========================================================================
   SECTION 3 · THE BODYBEING JOURNEY · Page 2b Doctrinal · Aged Parchment
   ========================================================================== */
.journey {
  position: relative;
  padding: var(--section-pad-y) 0;
  background: var(--page-aged-parchment);
  color: var(--page-warm-ink-black);
  overflow: hidden;
}
.journey::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(90, 74, 58, 0.05) 1px, transparent 0);
  background-size: 4px 4px;
  pointer-events: none;
}
.journey__decor {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}
.journey__decor--mandala {
  top: 3rem;
  left: -4rem;
  width: 280px; height: 280px;
  opacity: 0.1;
}

.journey__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.journey__head { text-align: center; margin-bottom: clamp(3rem, 6vw, 5rem); }
.journey__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t2);
  line-height: 1.15;
  margin-bottom: 0.8em;
}
.journey__sub {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.55;
  max-width: 60ch;
  margin-inline: auto;
  color: var(--page-earth-brown);
}

.stages {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  justify-items: center;
  gap: 2.5rem;
  margin: 0 auto clamp(3rem, 6vw, 4.5rem);
  max-width: 1100px;
}
@media (min-width: 900px) {
  .stages {
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 1.5rem;
  }
}
.stage {
  text-align: center;
  max-width: 280px;
}
.stage__orb {
  width: clamp(140px, 18vw, 200px);
  margin: 0 auto 1.3rem;
}
.stage__orb img {
  -webkit-mask-image: radial-gradient(circle, black 38%, transparent 58%);
  mask-image: radial-gradient(circle, black 38%, transparent 58%);
}
.stage__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1.1;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.5em;
}
.stage__desc {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 1.02rem;
  line-height: 1.55;
  color: var(--page-warm-ink-black);
}
.stage__arrow {
  display: none;
  align-self: center;
  width: 80px;
  height: 20px;
  margin-top: 60px;
}
@media (min-width: 900px) {
  .stage__arrow { display: block; }
}

.journey__closing {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--t3);
  text-align: center;
  line-height: 1.4;
  color: var(--page-warm-ink-black);
}


/* ==========================================================================
   SECTION 4 · SERVICE LINES · Page 2a Illustrated · Magazine Cream
   ========================================================================== */
.services {
  position: relative;
  padding: var(--section-pad-y) 0;
  background: var(--page-magazine-cream);
  color: var(--page-warm-ink-black);
  overflow: hidden;
}
.services::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(90, 74, 58, 0.04) 1px, transparent 0);
  background-size: 4px 4px;
  pointer-events: none;
}

.services__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.services__head { text-align: center; margin-bottom: clamp(3rem, 6vw, 5rem); }
.services__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t2);
  line-height: 1.15;
  margin-bottom: 0.8em;
}
.services__sub {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.55;
  color: var(--page-earth-brown);
}

.service-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  margin-bottom: clamp(3rem, 6vw, 4.5rem);
}
@media (min-width: 800px) {
  .service-cards { grid-template-columns: repeat(3, 1fr); }
}

.service-card {
  display: flex;
  flex-direction: column;
  padding: 1.75rem 1.75rem 2rem;
  background: rgba(239, 232, 215, 0.5);
  border: 1px solid rgba(90, 74, 58, 0.18);
  border-radius: 6px;
  transition: transform 400ms var(--ease), box-shadow 400ms var(--ease), border-color 400ms var(--ease);
}
.service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -20px rgba(15, 27, 45, 0.18);
  border-color: rgba(193, 67, 43, 0.4);
}
.service-card__illustration {
  margin: -0.5rem -0.5rem 1.5rem;
  border-radius: 4px;
  overflow: hidden;
  background: var(--page-aged-parchment);
}
.service-card__illustration img { width: 100%; height: auto; display: block; }
.service-card__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 1.45rem;
  line-height: 1.2;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.6em;
}
.service-card__body {
  font-family: var(--font-serif);
  font-size: 1.02rem;
  line-height: 1.6;
  color: var(--page-earth-brown);
  flex: 1;
  margin-bottom: 1.4rem;
}

.services__closing {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--t3);
  text-align: center;
  line-height: 1.4;
  max-width: 28ch;
  margin: 0 auto;
}


/* ==========================================================================
   SECTION 5 · DR. RISHABH · Pulse 1b · Deep Ink Navy
   ========================================================================== */
.rishabh {
  position: relative;
  padding: var(--section-pad-y) 0;
  background: var(--pulse-deep-ink-navy);
  color: var(--pulse-magazine-cream);
  overflow: hidden;
}
.rishabh::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(244, 241, 235, 0.03) 1px, transparent 0);
  background-size: 3px 3px;
  pointer-events: none;
}

.rishabh__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.5rem, 5vw, 4rem);
  align-items: center;
}
@media (min-width: 900px) {
  .rishabh__inner { grid-template-columns: 5fr 6fr; }
}

.rishabh__portrait {
  position: relative;
}
.rishabh__portrait img {
  width: 100%;
  border-radius: 4px;
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.6);
}

.rishabh__text {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--pulse-magazine-cream);
}
.rishabh__text p { margin-bottom: 1.25em; }
.rishabh__text p:last-of-type { margin-bottom: 1.6em; }

.rishabh__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t2);
  line-height: 1.15;
  color: var(--pulse-notebook-white);
  margin-bottom: 1em;
}

.rishabh__signature {
  font-family: var(--font-hand);
  font-weight: 500;
  font-size: 1.85rem;
  color: var(--sunlight-amber);
  transform: rotate(-1.5deg);
  margin: 0.4em 0 1.4em !important;
}

.rishabh__caveat {
  font-family: var(--font-hand);
  font-weight: 500;
  font-size: clamp(1.3rem, 2vw, 1.65rem);
  line-height: 1.4;
  color: var(--sunlight-amber);
  transform: rotate(-1.2deg);
  margin: 1.8rem 0 2rem;
  padding-left: 1.1rem;
  border-left: 2px solid var(--sunlight-amber);
  max-width: 440px;
}
.rishabh__caveat p { margin-bottom: 0.1em; }


/* ==========================================================================
   SECTION 6 · FINAL CTA · Pulse 1c · Inkwell Black
   ========================================================================== */
.final-cta {
  position: relative;
  padding: var(--section-pad-y) 0;
  background: var(--pulse-inkwell-black);
  color: var(--pulse-magazine-cream);
  text-align: center;
  overflow: hidden;
}
.final-cta::before {
  /* Subtle radial glow behind the button */
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 700px;
  height: 700px;
  background: radial-gradient(circle, rgba(230, 57, 70, 0.06) 0%, transparent 65%);
  pointer-events: none;
}

.final-cta__decor {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  opacity: 0.18;
}
.final-cta__decor--yantra {
  top: 4rem; right: 3rem;
  width: 110px; height: 110px;
}
.final-cta__decor--anatomy {
  bottom: 4rem; left: 3rem;
  width: 110px; height: 110px;
}

.final-cta__inner {
  position: relative;
  z-index: 1;
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.final-cta__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t1);
  line-height: 1.1;
  color: var(--pulse-notebook-white);
  margin-bottom: 0.8em;
}
.final-cta__sub {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.6;
  color: var(--pulse-magazine-cream);
  max-width: 56ch;
  margin: 0 auto 2.5rem;
}
.final-cta__secondary {
  font-family: var(--font-sans);
  font-size: 0.95rem;
  color: var(--warm-grey);
  margin-top: 2rem;
}
.final-cta__secondary a {
  color: var(--pulse-magazine-cream);
  border-bottom: 1px solid rgba(244, 241, 235, 0.3);
  transition: color 250ms var(--ease), border-color 250ms var(--ease);
}
.final-cta__secondary a:hover {
  color: var(--sunlight-amber);
  border-bottom-color: var(--sunlight-amber);
}


/* ==========================================================================
   FOOTER · Pulse continuation · Inkwell Black
   ========================================================================== */
.footer {
  position: relative;
  background: var(--pulse-inkwell-black);
  color: var(--pulse-magazine-cream);
  padding: 0 0 2.5rem;
}
.footer__divider {
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(230, 57, 70, 0.4) 50%, transparent 100%);
  margin: 0 var(--gutter) 4rem;
}

.footer__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.footer__brand-line {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 1.4rem;
  color: var(--pulse-notebook-white);
}

.footer__cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 700px) {
  .footer__cols { grid-template-columns: 1fr 1fr; max-width: 720px; }
}

.footer__col-title {
  font-family: var(--font-sans);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: var(--t6);
  color: var(--warm-grey);
  margin-bottom: 1.2rem;
}
.footer__col ul li { margin-bottom: 0.7rem; }
.footer__col ul li a {
  font-family: var(--font-sans);
  font-size: 0.98rem;
  color: var(--pulse-magazine-cream);
  transition: color 250ms var(--ease);
}
.footer__col ul li a:hover { color: var(--sunlight-amber); }

.footer__legal {
  border-top: 1px solid rgba(244, 241, 235, 0.08);
  padding-top: 2rem;
  margin-top: 1rem;
}
.footer__legal p {
  font-family: var(--font-sans);
  font-size: 0.85rem;
  color: var(--warm-grey);
}


/* ==========================================================================
   MOBILE NAVIGATION
   ========================================================================== */
@media (max-width: 900px) {
  .nav__toggle { display: flex; }

  /* Backdrop behind the slide-in menu */
  .nav__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(8, 14, 24, 0.55);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    z-index: 85;
    opacity: 0;
    visibility: hidden;
    transition: opacity 300ms var(--ease), visibility 0s linear 300ms;
  }
  .nav__backdrop.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity 300ms var(--ease), visibility 0s linear 0s;
  }
  body.nav-open { overflow: hidden; }

  .nav__items {
    position: fixed;
    top: 0; right: 0;
    z-index: 90;
    height: 100vh; height: 100svh;
    width: min(82%, 360px);
    flex-direction: column;
    justify-content: flex-start;
    padding: 5rem 2rem 2rem;
    gap: 1.5rem;
    background: var(--pulse-deep-ink-navy);
    border-left: 1px solid rgba(244, 241, 235, 0.08);
    transform: translateX(100%);
    visibility: hidden;
    transition: transform 400ms var(--ease), visibility 0s linear 400ms;
    align-items: flex-start;
    box-shadow: -20px 0 40px rgba(0, 0, 0, 0.3);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .nav__items.is-open {
    transform: translateX(0);
    visibility: visible;
    transition: transform 400ms var(--ease), visibility 0s linear 0s;
  }

  /* Visible X close button inside the open menu (top-right) */
  .nav__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 38px;
    height: 38px;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .nav__close span {
    position: absolute;
    width: 22px;
    height: 1.5px;
    background: var(--pulse-magazine-cream);
    transition: background 250ms var(--ease);
  }
  .nav__close span:nth-child(1) { transform: rotate(45deg); }
  .nav__close span:nth-child(2) { transform: rotate(-45deg); }
  .nav__close:hover span { background: var(--sunlight-amber); }

  .nav__items .nav__link,
  .nav__items .nav__cta {
    font-size: 1.15rem;
    color: var(--pulse-magazine-cream) !important;
  }

  .nav__submenu {
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0.4rem 0 0 1rem;
    min-width: 0;
  }
  .nav__submenu li a {
    padding: 0.55rem 0;
    color: var(--warm-grey);
    position: relative;
    z-index: 2;
    touch-action: manipulation;
  }
  .nav__submenu li a:hover { background: transparent; color: var(--sunlight-amber); }

  .nav__cta { align-self: stretch; text-align: center; margin-top: 1rem; }
}

/* Hide the in-menu X on desktop */
@media (min-width: 901px) {
  .nav__close { display: none; }
  .nav__backdrop { display: none; }
}

@media (max-width: 720px) {
  .hero {
    min-height: auto;
    padding-top: 0;
    padding-bottom: clamp(3rem, 8vw, 4rem);
    display: block;
  }
  .hero__bg {
    position: relative;
    inset: auto;
    width: 100%;
    height: 60vh;
    height: 60svh;
    max-height: 540px;
    overflow: hidden;
  }
  .hero__portrait {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
  }
  .hero__overlay {
    background: linear-gradient(
      180deg,
      rgba(15, 27, 45, 0.35) 0%,
      rgba(15, 27, 45, 0.15) 35%,
      rgba(15, 27, 45, 0.55) 75%,
      var(--pulse-deep-ink-navy) 100%
    );
  }
  .hero__content {
    margin-top: -3rem;
    padding-top: 2rem;
  }
  .hero__caveat { font-size: 1.3rem; }
  .hero__content > * { max-width: 100% !important; }
  .hero__action { width: 100%; }
  .hero__action .cta--button {
    width: 100%;
    justify-content: center;
    padding: 1.2rem 1.5rem;
  }
}

/* Reduce decorative load on small screens */
@media (max-width: 600px) {
  .self__decor, .journey__decor, .final-cta__decor { opacity: 0.06; }
}

/* ==========================================================================
   ABOUT PAGE — narrative editorial layout, single Pulse moment at Section 8
   ========================================================================== */

/* ABOUT HERO (Page mode) */
.about-hero {
  background: var(--page-magazine-cream);
  padding: 3rem 0 5rem;
  position: relative;
  overflow: hidden;
}
.about-hero__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
.about-hero__text { order: 2; }
.about-hero__media { order: 1; }
.about-hero__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--page-earth-brown);
  margin-bottom: 1.2rem;
}
.about-hero__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(2.4rem, 6vw, 3.8rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  margin-bottom: 0.6rem;
  color: var(--page-warm-ink-black);
}
.about-hero__creds {
  font-family: var(--font-sans);
  font-style: italic;
  font-size: 1rem;
  color: var(--page-earth-brown);
  margin-bottom: 2rem;
}
.about-hero__opener {
  font-family: var(--font-serif);
  font-size: clamp(1.15rem, 1.6vw, 1.35rem);
  line-height: 1.6;
  color: var(--page-warm-ink-black);
  max-width: 540px;
}
.about-hero__opener p + p { margin-top: 0.6rem; }
.about-hero__photo {
  width: 100%;
  aspect-ratio: 4 / 5;
  background: var(--page-aged-parchment);
  overflow: hidden;
  position: relative;
  box-shadow: 0 30px 60px -25px rgba(26, 26, 26, 0.18);
  border-radius: 2px;
}
.about-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (min-width: 880px) {
  .about-hero { padding: 5rem 0; }
  .about-hero__inner { grid-template-columns: 1fr 1fr; gap: 5rem; }
  .about-hero__text { order: 1; }
  .about-hero__media { order: 2; }
  .about-hero__photo { max-width: 480px; margin-left: auto; }
}

/* ABOUT NARRATIVE SECTIONS (Page mode) */
.about-section {
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  background: var(--page-magazine-cream);
}
.about-section__inner {
  max-width: 680px;
  margin: 0 auto;
  padding: 0 var(--gutter);
  position: relative;
}
.about-section__heading {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--t2);
  line-height: 1.2;
  letter-spacing: -0.005em;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.75rem;
  max-width: 540px;
}
.about-section__body {
  font-family: var(--font-serif);
  font-size: 1.06rem;
  line-height: 1.85;
  color: var(--page-warm-ink-black);
}
.about-section__body p + p { margin-top: 1.3rem; }
.about-section__body em { font-style: italic; color: var(--page-earth-brown); }

.about-divider {
  width: 60px;
  height: 1px;
  background: var(--page-earth-brown);
  opacity: 0.35;
  margin: 0 auto;
}

/* DECORATIVE SVG positioning */
.deco {
  position: absolute;
  pointer-events: none;
  opacity: 0.18;
  z-index: 1;
}
.deco--top-right { top: -10px; right: -20px; width: 130px; }
.deco--bottom-left { bottom: -20px; left: -30px; width: 150px; }
.deco--bridge {
  position: relative;
  width: 180px;
  margin: 1.75rem auto;
  opacity: 0.55;
  display: block;
}
@media (max-width: 880px) {
  .deco--top-right { width: 90px; top: -5px; right: -10px; }
  .deco--bottom-left { width: 100px; bottom: -10px; left: -15px; }
}

/* CORP STRIP */
.corp-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem 2rem;
  margin: 1.75rem 0;
  padding: 1rem 0;
  border-top: 1px solid rgba(90, 74, 58, 0.2);
  border-bottom: 1px solid rgba(90, 74, 58, 0.2);
}
.corp-strip__item {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--page-earth-brown);
}

/* PULL QUOTE */
.pull-quote {
  margin: 3rem 0 1.75rem;
  padding-left: 1.5rem;
  border-left: 3px solid var(--terra-red);
}
.pull-quote p {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  line-height: 1.5;
  color: var(--page-warm-ink-black);
}

/* CAVEAT LINE — Page mode uses Lab Blue */
.caveat-line {
  font-family: var(--font-hand);
  font-weight: 500;
  font-size: clamp(1.55rem, 2.6vw, 1.95rem);
  line-height: 1.4;
  color: var(--lab-blue);
  margin: 1.75rem 0 1.75rem 1rem;
  display: block;
}

/* FORGOTTEN TWICE */
.forgotten-twice { margin: 1.75rem 0; }
.forgotten-twice p {
  font-family: var(--font-serif);
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--page-warm-ink-black);
  padding: 0.8rem 0;
}
.forgotten-twice p:first-child {
  border-bottom: 1px solid rgba(90, 74, 58, 0.25);
}

.tradition-emphasis {
  color: var(--muted-gold);
  font-style: italic;
}

/* ABOUT PULSE SECTION */
.about-pulse {
  background: var(--pulse-deep-ink-navy);
  color: var(--pulse-magazine-cream);
  padding: clamp(5rem, 10vw, 7rem) 0;
  position: relative;
  overflow: hidden;
}
.about-pulse::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at center, transparent 0%, rgba(10, 14, 20, 0.6) 100%),
    radial-gradient(circle at 30% 40%, rgba(244, 163, 0, 0.04) 0%, transparent 50%);
  pointer-events: none;
}
.about-pulse__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
  position: relative;
  z-index: 2;
}
.about-pulse__media { order: 1; }
.about-pulse__text { order: 2; max-width: 680px; }
.about-pulse__heading {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(1.8rem, 3.5vw, 2.4rem);
  line-height: 1.2;
  color: var(--pulse-notebook-white);
  margin-bottom: 1.75rem;
}
.about-pulse__body {
  font-family: var(--font-serif);
  font-size: 1.06rem;
  line-height: 1.85;
  color: var(--pulse-magazine-cream);
}
.about-pulse__body p + p { margin-top: 1.3rem; }
.about-pulse__body strong { color: var(--muted-gold); font-weight: 700; }
.about-pulse__photo {
  width: 100%;
  aspect-ratio: 4 / 5;
  background: var(--pulse-inkwell-black);
  overflow: hidden;
  position: relative;
  box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.5);
  border-radius: 2px;
}
.about-pulse__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (min-width: 880px) {
  .about-pulse__inner { grid-template-columns: 1fr 1.15fr; gap: 5rem; }
  .about-pulse__photo { max-width: 480px; }
}

/* JOURNEY ARC */
.about-journey-arc {
  margin: 1.75rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.about-journey-arc__line {
  font-family: var(--font-serif);
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--pulse-magazine-cream);
  padding: 0.4rem 0 0.4rem 1.5rem;
  position: relative;
}
.about-journey-arc__line::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.95rem;
  width: 8px;
  height: 1px;
  background: var(--sunlight-amber);
  opacity: 0.7;
}
.about-journey-arc__line em {
  font-style: normal;
  color: var(--sunlight-amber);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 0.78em;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 0.1rem;
}

/* ABOUT CTA */
.about-cta {
  background: var(--page-aged-parchment);
  padding: clamp(5rem, 10vw, 7rem) 0;
  text-align: center;
}
.about-cta__inner {
  max-width: 620px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.about-cta__heading {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(1.85rem, 3.6vw, 2.45rem);
  line-height: 1.2;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.75rem;
}

/* ==========================================================================
   SERVICES PAGE v3 — Tinted parchment territories + SVG symbolic illustrations
   ========================================================================== */

/* SERVICES HERO */
.services-hero {
  background: var(--page-magazine-cream);
  padding: clamp(5rem, 10vw, 7rem) 0 clamp(3rem, 6vw, 4rem);
}
.services-hero__inner {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.services-hero__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--page-earth-brown);
  margin-bottom: 1.4rem;
}
.services-hero__headline {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  line-height: 1.12;
  letter-spacing: -0.015em;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.4rem;
}
.services-hero__headline em {
  font-style: italic;
  color: var(--terra-red);
}
.services-hero__sub-line {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.08rem, 1.6vw, 1.25rem);
  line-height: 1.5;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.5rem;
  max-width: 580px;
}
.services-hero__body {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--page-warm-ink-black);
  max-width: 600px;
  opacity: 0.92;
}

/* TINTED PARCHMENT TERRITORIES */
.svc-territory {
  width: 100%;
  padding: clamp(4rem, 8vw, 6rem) 0;
}
.svc-territory--consultation  { background: #DFE8E2; }  /* sage parchment */
.svc-territory--companionship { background: #F3E7CB; }  /* honey parchment */
.svc-territory--workshop      { background: #E2E6EB; }  /* slate parchment */

/* FLOATING CARD on parchment */
.svc-card {
  background: var(--page-magazine-cream);
  width: 92%;
  max-width: 960px;
  margin: 0 auto;
  border-radius: 18px;
  box-shadow:
    0 24px 50px -22px rgba(90, 74, 58, 0.22),
    0 6px 14px -6px rgba(90, 74, 58, 0.08);
  padding: clamp(2rem, 4vw, 2.6rem);
  position: relative;
}
@media (min-width: 880px) {
  .svc-card { width: 82%; padding: 3rem; }
}

/* CARD GRID — text left, illustration right on desktop */
.svc-card__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  align-items: center;
}
@media (min-width: 880px) {
  .svc-card__grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(220px, 290px);
    gap: 3rem;
  }
}

/* ILLUSTRATION SLOT */
.svc-card__illustration {
  display: block;
  width: 170px;
  aspect-ratio: 1 / 1;
  margin: 1.5rem auto 0;
}
@media (min-width: 880px) {
  .svc-card__illustration {
    width: 100%;
    max-width: 290px;
    margin: 0;
    justify-self: center;
  }
}
.svc-card__illustration svg {
  width: 100%;
  height: 100%;
}

/* TOP ROW — heading block, then CTA stacked below (always) */
.svc-card__top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.1rem;
  margin-bottom: 1.3rem;
}
.svc-card__heading-block { width: 100%; min-width: 0; }
.svc-card__name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(1.8rem, 3.4vw, 2.3rem);
  line-height: 1.12;
  letter-spacing: -0.015em;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.5rem;
}
.svc-card__meta {
  font-family: var(--font-sans);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.82;
}

/* PRIMARY CTA */
.svc-card__cta {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  font-family: var(--font-sans);
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.85rem 1.4rem;
  border-radius: 10px;
  white-space: nowrap;
  transition: transform 180ms var(--ease), box-shadow 220ms var(--ease);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
.svc-card__cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.14);
}
.svc-card__cta .arrow { transition: transform 180ms var(--ease); }
.svc-card__cta:hover .arrow { transform: translateX(3px); }
@media (max-width: 599px) {
  .svc-card__cta { width: 100%; justify-content: center; padding: 1rem 1.5rem; }
}

/* Color per service — accents stay LOUD on quiet parchment */
.svc-card--consultation .svc-card__cta   { background: var(--forest-green); color: #FFFFFF; }
.svc-card--consultation .svc-card__cta:hover { background: var(--forest-green-deep); }
.svc-card--consultation .svc-card__meta  { color: var(--forest-green); }

.svc-card--companionship .svc-card__cta  { background: var(--page-warm-ink-black); color: var(--page-magazine-cream); }
.svc-card--companionship .svc-card__cta:hover { background: var(--page-earth-brown); }
.svc-card--companionship .svc-card__meta { color: #8B5A05; }

.svc-card--workshop .svc-card__cta       { background: var(--lab-blue); color: #FFFFFF; }
.svc-card--workshop .svc-card__cta:hover { background: #163D62; }
.svc-card--workshop .svc-card__meta      { color: var(--lab-blue); }

/* FELT PURPOSE */
.svc-card__felt {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.08rem, 1.8vw, 1.28rem);
  line-height: 1.5;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.3rem;
  max-width: 520px;
  padding-bottom: 1.3rem;
  border-bottom: 1px solid rgba(90, 74, 58, 0.16);
}

/* Workshop felt — two-line emphasized statement */
.svc-card__felt--stacked {
  font-style: normal;
  max-width: 560px;
}
.svc-card__felt--stacked .felt-lead {
  display: block;
  font-style: normal;
  font-weight: 700;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.4rem;
}
.svc-card__felt--stacked .felt-sub {
  display: block;
  font-style: italic;
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  line-height: 1.45;
  color: var(--lab-blue);
}

/* BODY */
.svc-card__body {
  font-family: var(--font-sans);
  font-size: 0.98rem;
  line-height: 1.7;
  color: var(--page-warm-ink-black);
  opacity: 0.92;
  margin-bottom: 1.4rem;
}

/* CONSULTATION — Come with / Leave with clusters (full-width below grid) */
.svc-card__clusters {
  margin-top: 0.4rem;
}
.cluster-label {
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--forest-green);
  margin-bottom: 0.85rem;
}
.svc-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.6rem;
}
.svc-tag {
  font-family: var(--font-sans);
  font-size: 0.83rem;
  font-weight: 500;
  color: var(--page-earth-brown);
  background: transparent;
  border: 1px solid rgba(90, 74, 58, 0.32);
  padding: 0.4rem 0.85rem;
  border-radius: 24px;
  white-space: nowrap;
}
.svc-card__hinge {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  line-height: 1.55;
  color: var(--page-warm-ink-black);
  margin: 0 0 1.6rem;
  padding: 1.3rem 0;
  border-top: 1px solid rgba(90, 74, 58, 0.16);
  border-bottom: 1px solid rgba(90, 74, 58, 0.16);
  max-width: 620px;
}
.svc-outcomes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.svc-outcome {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--forest-green-deep);
  background: rgba(61, 107, 92, 0.1);
  padding: 0.35rem 0.75rem;
  border-radius: 24px;
  white-space: nowrap;
}

/* COMPANIONSHIP — quiet end CTA, right-aligned at card bottom */
.svc-card__end-cta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  margin-top: 1.3rem;
  text-decoration: none;
  font-family: var(--font-sans);
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #8B5A05;
  transition: color 180ms var(--ease);
}
.svc-card__end-cta .arrow {
  transition: transform 180ms var(--ease);
}
.svc-card__end-cta:hover {
  color: #5A3A03;
}
.svc-card__end-cta:hover .arrow {
  transform: translateX(4px);
}

/* COMPANIONSHIP — editorial inside card */
.svc-card__comp-lead {
  margin: 1.3rem 0 1.5rem;
  text-align: center;
  border-bottom: 1px solid rgba(90, 74, 58, 0.16);
  padding: 0 0 1.4rem;
}
.svc-card__comp-lead p {
  font-family: var(--font-serif);
  font-size: clamp(1rem, 1.5vw, 1.1rem);
  line-height: 1.5;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.35rem;
}
.svc-card__comp-lead p:last-child { margin-bottom: 0; }
.svc-card__comp-lead em { font-style: italic; color: var(--terra-red); }

.svc-card__sessions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
  margin: 0 0 1.2rem;
}
@media (min-width: 760px) {
  .svc-card__sessions { grid-template-columns: 1fr 1fr; }
  .svc-card__sessions .svc-session--support { grid-column: 1 / -1; }
}
.svc-session {
  background: var(--page-aged-parchment);
  padding: 1.3rem 1.3rem 1.4rem;
  border-radius: 10px;
}
.svc-session__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.svc-session__num {
  font-family: var(--font-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #8B5A05;
}
.svc-session__time {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  color: var(--page-earth-brown);
  font-style: italic;
}
.svc-session__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.3;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.4rem;
}
.svc-session__desc {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--page-warm-ink-black);
  opacity: 0.9;
}
.svc-session--support {
  background: transparent;
  border: 1px dashed rgba(139, 90, 5, 0.45);
}
.svc-session--support .svc-session__num {
  color: var(--page-warm-ink-black);
  letter-spacing: 0.02em;
  text-transform: none;
  font-size: 0.98rem;
  font-weight: 700;
  font-family: var(--font-serif);
}
.svc-card__closing {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--page-earth-brown);
  margin-top: 1.1rem;
  max-width: 560px;
}

/* SERVICES CLOSE (cream) */
.services-close {
  background: var(--page-magazine-cream);
  padding: clamp(4.5rem, 9vw, 6.5rem) 0;
  text-align: center;
}
.services-close__inner {
  max-width: 620px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.services-close__heading {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(1.65rem, 3.2vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.9rem;
}
.services-close__body {
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--page-warm-ink-black);
  opacity: 0.85;
  margin-bottom: 1.8rem;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}
.services-close__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  text-decoration: none;
  font-family: var(--font-sans);
  font-size: 0.95rem;
  font-weight: 600;
  padding: 1rem 2rem;
  border-radius: 8px;
  background: var(--page-warm-ink-black);
  color: var(--page-magazine-cream);
  transition: background 220ms var(--ease), transform 150ms var(--ease);
  margin-bottom: 1rem;
}
.services-close__btn:hover {
  background: var(--page-earth-brown);
  transform: translateY(-1px);
}
.services-close__sub {
  font-family: var(--font-sans);
  font-size: 0.85rem;
  color: var(--page-earth-brown);
}
.services-close__sub a {
  color: var(--page-earth-brown);
  text-decoration: underline;
  text-decoration-color: rgba(90, 74, 58, 0.4);
  text-underline-offset: 3px;
}
.services-close__sub a:hover { color: var(--page-warm-ink-black); }

/* ==========================================================================
   CONSULTATIONS PAGE — deep page for the One-Time Consultations service
   ========================================================================== */

    /* ============================================================
    ============================================================ */

    /* ---- BACK TO SERVICES BREADCRUMB ---- */
    .cons-back {
      background: var(--page-magazine-cream);
      padding: 90px var(--gutter) 1rem;
    }
    .cons-back__inner {
      max-width: var(--container);
      margin: 0 auto;
    }
    .cons-back__link {
      display: inline-flex;
      align-items: center;
      gap: 0.4em;
      font-family: var(--font-sans);
      font-size: 0.88rem;
      font-weight: 500;
      color: var(--forest-green);
      transition: gap 220ms var(--ease), color 220ms var(--ease);
    }
    .cons-back__link:hover { gap: 0.65em; color: var(--forest-green-deep); }
    .cons-back__arrow { transition: transform 220ms var(--ease); }
    .cons-back__link:hover .cons-back__arrow { transform: translateX(-3px); }

    /* ---- HERO IMAGE ---- */
    .cons-hero-img {
      width: 100%;
      display: block;
      overflow: hidden;
      background: var(--page-aged-parchment);
    }
    .cons-hero-img img {
      width: 100%;
      height: auto;
      aspect-ratio: 16 / 9;
      object-fit: cover;
      object-position: center center;
      display: block;
    }
    @media (max-width: 600px) {
      .cons-hero-img img { aspect-ratio: 4 / 3; }
    }

    /* ---- HERO TEXT (below image) ---- */
    .cons-hero-text {
      background: var(--page-magazine-cream);
      padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);
    }
    .cons-hero-text__inner {
      max-width: var(--container-narrow);
      margin: 0 auto;
      padding: 0 var(--gutter);
    }
    .cons-hero-text__strip {
      font-family: var(--font-sans);
      font-size: 0.74rem;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--forest-green);
      margin-bottom: 1.2rem;
    }
    .cons-hero-text__headline {
      font-family: var(--font-serif);
      font-weight: 700;
      font-size: var(--t2);
      line-height: 1.12;
      letter-spacing: -0.005em;
      color: var(--page-warm-ink-black);
      margin-bottom: 1rem;
    }
    .cons-hero-text__sub {
      font-family: var(--font-sans);
      font-size: var(--t4);
      font-weight: 400;
      line-height: 1.55;
      color: var(--page-earth-brown);
      max-width: 54ch;
    }
    .cons-hero-cta {
      display: inline-flex;
      align-items: center;
      gap: 0.7rem;
      margin-top: clamp(1.8rem, 3vw, 2.4rem);
      font-family: var(--font-sans);
      font-weight: 600;
      font-size: 0.95rem;
      letter-spacing: 0.02em;
      color: var(--forest-green);
      background: transparent;
      border: 1.5px solid var(--forest-green);
      padding: 0.95rem 1.9rem;
      border-radius: 8px;
      text-decoration: none;
      transition: background 240ms var(--ease), color 240ms var(--ease),
                  transform 180ms var(--ease);
    }
    .cons-hero-cta__price {
      font-weight: 500;
      opacity: 0.62;
      padding-left: 0.7rem;
      border-left: 1px solid currentColor;
    }
    .cons-hero-cta .arrow {
      color: var(--pulse-red);
      transition: transform 220ms var(--ease);
    }
    .cons-hero-cta:hover {
      background: var(--forest-green);
      color: #FFFFFF;
      transform: translateY(-2px);
    }
    .cons-hero-cta:hover .cons-hero-cta__price { opacity: 0.78; }
    .cons-hero-cta:hover .arrow {
      color: #FFFFFF;
      transform: translateX(4px);
    }
    @media (max-width: 520px) {
      .cons-hero-cta { width: 100%; justify-content: center; }
    }

    /* ---- S2 — WHAT HAPPENS ---- */
    .cons-process {
      background: var(--page-aged-parchment);
      padding: var(--section-pad-y) 0;
      position: relative;
    }
    .cons-process::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(circle at 1px 1px, rgba(90,74,58,0.035) 1px, transparent 0);
      background-size: 4px 4px;
      pointer-events: none;
    }
    .cons-process__inner {
      position: relative;
      z-index: 1;
      max-width: var(--container);
      margin: 0 auto;
      padding: 0 var(--gutter);
    }
    .cons-process__grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 2rem;
    }
    @media (min-width: 760px) {
      .cons-process__grid {
        grid-template-columns: 1fr 1fr 1fr;
        gap: clamp(2.5rem, 5vw, 5rem);
      }
    }
    .cons-step {
      padding-top: 1.5rem;
      border-top: 1px solid rgba(61,107,92,0.28);
    }
    @media (max-width: 759px) {
      .cons-step + .cons-step { margin-top: 2.2rem; }
    }
    .cons-step__label {
      font-family: var(--font-sans);
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--forest-green);
      margin-bottom: 1rem;
    }
    .cons-step__body {
      font-family: var(--font-sans);
      font-size: var(--t5);
      line-height: 1.72;
      color: var(--page-warm-ink-black);
      opacity: 0.92;
    }

    /* ---- S3 — FIVE CATEGORIES ---- */
    .cons-categories {
      background: var(--page-magazine-cream);
      padding: var(--section-pad-y) 0;
    }
    .cons-categories__inner {
      max-width: var(--container-narrow);
      margin: 0 auto;
      padding: 0 var(--gutter);
    }
    .cons-categories__intro {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: clamp(1.15rem, 2vw, 1.4rem);
      line-height: 1.5;
      color: var(--page-earth-brown);
      text-align: center;
      margin-bottom: clamp(2.5rem, 5vw, 3.8rem);
    }
    .cons-cat-list {
      border-top: 1px solid rgba(90,74,58,0.14);
    }
    .cons-cat {
      display: grid;
      grid-template-columns: 2.4rem 1fr;
      gap: 1.5rem;
      padding: 1.5rem 0;
      border-bottom: 1px solid rgba(90,74,58,0.14);
      align-items: start;
    }
    @media (max-width: 480px) {
      .cons-cat { grid-template-columns: 1.8rem 1fr; gap: 1rem; }
    }
    .cons-cat__numeral {
      font-family: var(--font-sans);
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      color: var(--forest-green);
      padding-top: 0.2rem;
      line-height: 1;
    }
    .cons-cat__name {
      font-family: var(--font-serif);
      font-weight: 700;
      font-size: clamp(1.05rem, 1.6vw, 1.18rem);
      line-height: 1.2;
      color: var(--page-warm-ink-black);
      margin-bottom: 0.4rem;
    }
    .cons-cat__desc {
      font-family: var(--font-sans);
      font-size: 0.92rem;
      line-height: 1.65;
      color: var(--page-earth-brown);
      opacity: 0.9;
    }

    /* ---- S5 — WHAT THIS IS NOT ---- */
    .cons-not {
      background: var(--page-aged-parchment);
      padding: clamp(3.5rem, 7vw, 5rem) 0;
      position: relative;
    }
    .cons-not::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(circle at 1px 1px, rgba(90,74,58,0.035) 1px, transparent 0);
      background-size: 4px 4px;
      pointer-events: none;
    }
    .cons-not__inner {
      position: relative;
      z-index: 1;
      max-width: 680px;
      margin: 0 auto;
      padding: 0 var(--gutter);
    }
    .cons-not__label {
      font-family: var(--font-sans);
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--page-earth-brown);
      opacity: 0.65;
      text-align: center;
      margin-bottom: 1.4rem;
    }
    .cons-not__intro {
      font-family: var(--font-serif);
      font-style: italic;
      font-size: 1.05rem;
      line-height: 1.65;
      color: var(--page-warm-ink-black);
      text-align: center;
      margin-bottom: 2rem;
    }
    .cons-not__list {
      display: flex;
      flex-direction: column;
      gap: 0.8rem;
    }
    .cons-not__item {
      display: flex;
      gap: 0.9rem;
      align-items: flex-start;
    }
    .cons-not__dash {
      font-family: var(--font-serif);
      color: var(--forest-green);
      font-size: 1rem;
      line-height: 1.65;
      flex-shrink: 0;
    }
    .cons-not__text {
      font-family: var(--font-sans);
      font-size: 0.97rem;
      line-height: 1.65;
      color: var(--page-earth-brown);
    }

    /* ---- S6 — BOOK ---- */
    .cons-book {
      background: var(--page-magazine-cream);
      padding: clamp(5rem, 10vw, 7rem) 0;
      text-align: center;
    }
    .cons-book__inner {
      max-width: 560px;
      margin: 0 auto;
      padding: 0 var(--gutter);
    }
    .cons-book__strip {
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--page-earth-brown);
      opacity: 0.72;
      margin-bottom: 1.8rem;
    }
    .cons-book__cta {
      display: inline-flex;
      align-items: center;
      gap: 0.6rem;
      font-family: var(--font-sans);
      font-weight: 600;
      font-size: 1rem;
      letter-spacing: 0.02em;
      color: #FFFFFF;
      background: var(--forest-green);
      padding: 1.1rem 2.4rem;
      border-radius: 8px;
      text-decoration: none;
      transition: background 220ms var(--ease), transform 180ms var(--ease), box-shadow 220ms var(--ease);
      box-shadow: 0 2px 8px rgba(61,107,92,0.22);
      margin-bottom: 1.1rem;
    }
    .cons-book__cta:hover {
      background: var(--forest-green-deep);
      transform: translateY(-2px);
      box-shadow: 0 6px 18px rgba(61,107,92,0.28);
    }
    .cons-book__cta .arrow { transition: transform 220ms var(--ease); }
    .cons-book__cta:hover .arrow { transform: translateX(4px); }
    @media (max-width: 520px) {
      .cons-book__cta { width: 100%; justify-content: center; }
    }
    .cons-book__sub {
      font-family: var(--font-sans);
      font-size: 0.88rem;
      color: var(--page-earth-brown);
      margin-bottom: 2rem;
    }
    .cons-book__sub a {
      color: var(--page-earth-brown);
      text-decoration: underline;
      text-decoration-color: rgba(90,74,58,0.4);
      text-underline-offset: 3px;
      transition: color 200ms var(--ease);
    }
    .cons-book__sub a:hover { color: var(--page-warm-ink-black); }

    .cons-book__back {
      display: inline-flex;
      align-items: center;
      gap: 0.4em;
      font-family: var(--font-sans);
      font-size: 0.88rem;
      font-weight: 500;
      color: var(--forest-green);
      transition: gap 220ms var(--ease), color 220ms var(--ease);
    }
    .cons-book__back:hover { gap: 0.65em; color: var(--forest-green-deep); }
    .cons-book__back .cons-back__arrow { transition: transform 220ms var(--ease); }
    .cons-book__back:hover .cons-back__arrow { transform: translateX(-3px); }
  

  /* ============================================================
     COMPANIONSHIPS PAGE  ·  /companionships
     ============================================================ */

  /* ---------- S1 · HERO + COMPANIONSHIP PLAN — Pulse dark ---------- */
  .cmp-hero {
    position: relative;
    overflow: hidden;
    background: var(--pulse-deep-ink-navy);
    color: var(--pulse-notebook-white);
    padding: clamp(7rem, 14vw, 11rem) var(--gutter) clamp(4.5rem, 9vw, 7rem);
  }
  .cmp-hero__bridge {
    position: absolute;
    top: 50%;
    right: clamp(-220px, -8vw, -60px);
    transform: translateY(-50%);
    width: clamp(440px, 52vw, 760px);
    aspect-ratio: 1;
    opacity: 0.5;
    pointer-events: none;
  }
  .cmp-hero__bridge svg { width: 100%; height: 100%; display: block; }
  .cmp-bridge__yantra {
    opacity: 0.62;
    transform-origin: 300px 300px;
    animation: cmp-yantra-turn 140s linear infinite;
  }
  .cmp-bridge__anatomy { opacity: 0.78; }
  @keyframes cmp-yantra-turn { to { transform: rotate(360deg); } }

  .cmp-hero__grain {
    position: absolute; inset: 0;
    background-image: radial-gradient(circle at 1px 1px, rgba(244,241,235,0.045) 1px, transparent 0);
    background-size: 3px 3px;
    pointer-events: none;
  }
  .cmp-hero__vignette {
    position: absolute; inset: 0;
    background:
      radial-gradient(120% 90% at 30% 35%, transparent 40%, rgba(8,12,20,0.55) 100%),
      linear-gradient(180deg, rgba(8,12,20,0.30) 0%, transparent 22%);
    pointer-events: none;
  }
  .cmp-hero__inner {
    position: relative;
    z-index: 2;
    max-width: var(--container);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: clamp(2.5rem, 6vw, 6rem);
    align-items: center;
  }
  .cmp-hero__headline {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--t1);
    line-height: 1.16;
    letter-spacing: -0.012em;
    color: var(--pulse-notebook-white);
    margin-bottom: clamp(1.6rem, 3vw, 2.3rem);
  }
  .cmp-hero__headline-2 { color: var(--sunlight-amber); }
  .cmp-hero__sub {
    max-width: 40ch;
    margin-bottom: clamp(2rem, 4vw, 2.8rem);
  }
  .cmp-hero__sub p {
    font-family: var(--font-sans);
    font-size: var(--t4);
    line-height: 1.62;
    color: rgba(244,241,235,0.82);
  }
  .cmp-hero__sub p + p { margin-top: 1.05em; }
  .cmp-hero__sub p:last-child {
    color: var(--pulse-notebook-white);
    font-style: italic;
    font-family: var(--font-serif);
  }
  .cmp-hero__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-family: var(--font-sans);
    font-weight: 500;
    font-size: 1.02rem;
    letter-spacing: 0.01em;
    color: var(--sunlight-amber);
    text-decoration: none;
    padding-bottom: 3px;
    border-bottom: 1.5px solid rgba(244,163,0,0.42);
    transition: border-color 240ms var(--ease), gap 240ms var(--ease);
  }
  .cmp-hero__cta .arrow { transition: transform 240ms var(--ease); }
  .cmp-hero__cta:hover { border-color: var(--sunlight-amber); gap: 0.85rem; }
  .cmp-hero__cta:hover .arrow { transform: translateX(3px); }

  /* --- Companionship Plan — the self-drawing thread --- */
  .cmp-plan {
    position: relative;
    padding: clamp(1.8rem, 3vw, 2.6rem) clamp(1.6rem, 3vw, 2.4rem);
    background: rgba(26,43,64,0.55);
    border: 1px solid rgba(244,163,0,0.16);
    border-radius: 14px;
    backdrop-filter: blur(2px);
  }
  .cmp-plan__title {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: var(--t6);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--sunlight-amber);
    margin-bottom: clamp(1.5rem, 3vw, 2.1rem);
  }
  .cmp-plan__track { position: relative; }
  .cmp-plan__thread {
    position: absolute;
    left: 11px;
    top: 10px;
    bottom: 10px;
    width: 2px;
    background: rgba(29,79,124,0.45);
    border-radius: 2px;
    overflow: hidden;
  }
  .cmp-plan__thread-fill {
    position: absolute;
    left: 0; top: 0;
    width: 100%;
    height: 0%;
    background: linear-gradient(180deg, var(--lab-blue) 0%, var(--sunlight-amber) 100%);
    box-shadow: 0 0 10px rgba(244,163,0,0.4);
    transition: height 2200ms var(--ease);
  }
  .cmp-plan.is-drawing .cmp-plan__thread-fill { height: 100%; }

  .cmp-plan__phases { list-style: none; display: flex; flex-direction: column; gap: clamp(1.4rem, 2.6vw, 2rem); }
  .cmp-phase {
    position: relative;
    padding-left: 2.6rem;
    opacity: 0.38;
    transform: translateX(6px);
    transition: opacity 620ms var(--ease), transform 620ms var(--ease);
  }
  .cmp-phase.is-lit { opacity: 1; transform: translateX(0); }
  .cmp-phase__node {
    position: absolute;
    left: 3px;
    top: 4px;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: var(--pulse-deep-ink-navy);
    border: 2px solid rgba(29,79,124,0.6);
    transition: border-color 500ms var(--ease), box-shadow 500ms var(--ease), background 500ms var(--ease);
  }
  .cmp-phase.is-lit .cmp-phase__node {
    border-color: var(--sunlight-amber);
    background: var(--sunlight-amber);
    box-shadow: 0 0 0 4px rgba(244,163,0,0.16), 0 0 14px rgba(244,163,0,0.5);
  }
  .cmp-phase__step {
    display: block;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--sunlight-amber);
    margin-bottom: 0.32em;
  }
  .cmp-phase__name {
    display: block;
    font-family: var(--font-serif);
    font-size: clamp(1.12rem, 1.7vw, 1.32rem);
    line-height: 1.32;
    color: var(--pulse-notebook-white);
  }
  .cmp-phase__meta {
    display: block;
    margin-top: 0.4em;
    font-family: var(--font-sans);
    font-size: 0.84rem;
    color: var(--warm-grey);
  }

  /* ---------- S2 · THREE COMPANIONSHIPS — Page light ---------- */
  .cmp-three {
    background: var(--page-magazine-cream);
    color: var(--page-warm-ink-black);
    padding: var(--section-pad-y) var(--gutter);
  }
  .cmp-three__inner { max-width: var(--container); margin: 0 auto; }
  .cmp-three__head {
    max-width: 30ch;
    margin-bottom: clamp(3rem, 6vw, 4.5rem);
  }
  .cmp-three__eyebrow {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: var(--t6);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--sunlight-amber);
    margin-bottom: 1.1rem;
  }
  .cmp-three__heading {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--t2);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-bottom: 1.3rem;
  }
  .cmp-three__price {
    font-family: var(--font-sans);
    font-size: var(--t5);
    color: var(--page-earth-brown);
  }
  .cmp-three__price strong {
    color: var(--page-warm-ink-black);
    font-weight: 700;
  }

  .cmp-card-list { display: flex; flex-direction: column; gap: clamp(1.2rem, 2.4vw, 1.8rem); }
  .cmp-card {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: clamp(1.4rem, 3vw, 2.6rem);
    align-items: start;
    padding: clamp(1.9rem, 3.6vw, 2.9rem);
    background: #FBFAF7;
    border: 1px solid rgba(90,74,58,0.16);
    border-radius: 13px;
    cursor: pointer;
    outline: none;
    transition: transform 340ms var(--ease), box-shadow 340ms var(--ease), border-color 340ms var(--ease);
  }
  .cmp-card::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--sunlight-amber);
    border-radius: 13px 0 0 13px;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 380ms var(--ease);
  }
  .cmp-card:hover,
  .cmp-card:focus-visible {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px -22px rgba(45,40,30,0.4);
    border-color: rgba(244,163,0,0.4);
  }
  .cmp-card:hover::before,
  .cmp-card:focus-visible::before { transform: scaleY(1); }
  .cmp-card:active { transform: translateY(-1px) scale(0.997); }

  .cmp-card__numeral {
    font-family: var(--font-serif);
    font-size: clamp(2.1rem, 4vw, 3rem);
    line-height: 1;
    color: rgba(244,163,0,0.55);
    font-style: italic;
  }
  .cmp-card__name {
    font-family: var(--font-serif);
    font-weight: 700;
    font-size: clamp(1.25rem, 2.3vw, 1.6rem);
    line-height: 1.28;
    margin-bottom: 0.85rem;
  }
  .cmp-card__who {
    font-family: var(--font-sans);
    font-size: var(--t5);
    line-height: 1.62;
    color: var(--page-earth-brown);
  }
  .cmp-card__who + .cmp-card__who { margin-top: 0.8rem; }
  .cmp-card__pills {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.25rem;
  }
  .cmp-card__pills li {
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--page-earth-brown);
    padding: 0.42em 0.95em;
    background: var(--page-aged-parchment);
    border: 1px solid rgba(90,74,58,0.14);
    border-radius: 999px;
    transition: background 260ms var(--ease), color 260ms var(--ease);
  }
  .cmp-card:hover .cmp-card__pills li { background: rgba(244,163,0,0.12); }

  /* --- handwritten doctor's-pen CTA --- */
  .cmp-note-cta {
    position: relative;
    display: block;
    max-width: 560px;
    margin: clamp(3rem, 6vw, 4.5rem) auto 0;
    padding: clamp(2rem, 4vw, 2.8rem) clamp(1.8rem, 4vw, 3rem) clamp(1.6rem, 3vw, 2.1rem);
    background: linear-gradient(165deg, #FBFAF7 0%, var(--page-aged-parchment) 100%);
    border: 1.5px solid rgba(244,163,0,0.4);
    border-radius: 16px;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 14px 34px -24px rgba(45,40,30,0.5);
    transition: transform 320ms var(--ease), box-shadow 320ms var(--ease), border-color 320ms var(--ease);
  }
  .cmp-note-cta::before {
    content: "";
    position: absolute;
    inset: 6px;
    border: 1px dashed rgba(244,163,0,0.32);
    border-radius: 11px;
    pointer-events: none;
  }
  .cmp-note-cta__hand {
    display: block;
    font-family: var(--font-hand);
    font-weight: 500;
    font-size: clamp(1.5rem, 3.2vw, 2.05rem);
    line-height: 1.35;
    color: var(--page-warm-ink-black);
  }
  .cmp-note-cta__sign {
    display: block;
    margin-top: 0.5rem;
    font-family: var(--font-hand);
    font-weight: 700;
    font-size: clamp(1.2rem, 2.4vw, 1.5rem);
    color: var(--terra-red);
    transform: rotate(-2deg);
  }
  .cmp-note-cta__tap {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.4rem;
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
    color: #FFFFFF;
    background: var(--forest-green);
    padding: 0.8rem 1.6rem;
    border-radius: 999px;
    transition: background 260ms var(--ease);
  }
  .cmp-note-cta__tap svg { width: 17px; height: 17px; }
  .cmp-note-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 44px -22px rgba(45,40,30,0.55);
    border-color: var(--sunlight-amber);
  }
  .cmp-note-cta:hover .cmp-note-cta__tap { background: var(--forest-green-deep); }
  .cmp-note-cta:active { transform: translateY(-1px) scale(0.995); }

  /* ---------- S3 · DYNAMIC SELF PROFILE — Page doctrinal, parchment ---------- */
  .cmp-profile {
    background: var(--page-aged-parchment);
    color: var(--page-warm-ink-black);
    padding: var(--section-pad-y) var(--gutter);
  }
  .cmp-profile__inner {
    max-width: var(--container-narrow);
    margin: 0 auto;
  }
  .cmp-profile__frame {
    max-width: 60ch;
    margin: 0 auto clamp(3rem, 6vw, 4.5rem);
    text-align: center;
  }
  .cmp-profile__heading {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--t2);
    line-height: 1.22;
    letter-spacing: -0.01em;
    margin-bottom: 1.8rem;
  }
  .cmp-profile__text p {
    font-family: var(--font-sans);
    font-size: var(--t5);
    line-height: 1.7;
    color: var(--page-earth-brown);
    text-align: left;
  }
  .cmp-profile__text p + p { margin-top: 1rem; }

  .cmp-vectors {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: rgba(90,74,58,0.18);
    border: 1px solid rgba(90,74,58,0.18);
    border-radius: 12px;
    overflow: hidden;
  }
  .cmp-vector {
    display: flex;
    gap: 1rem;
    padding: clamp(1.4rem, 3vw, 2rem);
    background: var(--page-aged-parchment);
  }
  .cmp-vector__index {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    color: rgba(244,163,0,0.85);
    padding-top: 0.25em;
  }
  .cmp-vector__name {
    font-family: var(--font-serif);
    font-weight: 700;
    font-size: clamp(1.08rem, 1.8vw, 1.3rem);
    margin-bottom: 0.3rem;
  }
  .cmp-vector__gloss {
    font-family: var(--font-sans);
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--page-earth-brown);
  }
  .cmp-vector--wide { grid-column: 1 / -1; }
  .cmp-vector--deep {
    grid-column: 1 / -1;
    background: var(--pulse-deep-ink-navy);
  }
  .cmp-vector--deep .cmp-vector__name { color: var(--pulse-notebook-white); }
  .cmp-vector--deep .cmp-vector__gloss {
    color: var(--sunlight-amber);
    font-style: italic;
    font-family: var(--font-serif);
    font-size: 1.02rem;
  }
  .cmp-vector--deep .cmp-vector__index { color: var(--sunlight-amber); }

  /* ---------- S4 · WHAT THIS IS NOT — Page light ---------- */
  .cmp-not {
    background: var(--page-magazine-cream);
    color: var(--page-warm-ink-black);
    padding: var(--section-pad-y) var(--gutter);
  }
  .cmp-not__inner { max-width: var(--container-narrow); margin: 0 auto; }
  .cmp-not__label {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: var(--t6);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--page-earth-brown);
    margin-bottom: 1.4rem;
  }
  .cmp-not__intro {
    font-family: var(--font-serif);
    font-size: var(--t3);
    line-height: 1.4;
    max-width: 30ch;
    margin-bottom: clamp(2rem, 4vw, 3rem);
  }
  .cmp-not__list { display: flex; flex-direction: column; gap: 1.2rem; }
  .cmp-not__item { display: flex; gap: 1rem; align-items: baseline; }
  .cmp-not__dash { color: var(--sunlight-amber); font-weight: 700; }
  .cmp-not__text {
    font-family: var(--font-sans);
    font-size: var(--t5);
    line-height: 1.6;
    color: var(--page-earth-brown);
  }

  /* ---------- S5 · BOOK — Pulse dark ---------- */
  .cmp-book {
    position: relative;
    overflow: hidden;
    background: var(--pulse-inkwell-black);
    color: var(--pulse-notebook-white);
    padding: clamp(5.5rem, 11vw, 9rem) var(--gutter);
    text-align: center;
  }
  .cmp-book__decor { position: absolute; opacity: 0.5; pointer-events: none; }
  .cmp-book__decor svg { width: 100%; height: 100%; }
  .cmp-book__decor--yantra { width: clamp(90px, 14vw, 160px); top: 12%; left: 7%; }
  .cmp-book__decor--anatomy { width: clamp(80px, 12vw, 140px); bottom: 12%; right: 8%; }
  .cmp-book__inner { position: relative; z-index: 2; max-width: 620px; margin: 0 auto; }
  .cmp-book__strip {
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: var(--t3);
    color: var(--sunlight-amber);
    margin-top: 0.4rem;
    margin-bottom: clamp(2rem, 4vw, 2.8rem);
  }
  .cmp-book__heading {
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--t2);
    line-height: 1.2;
    margin-bottom: 1rem;
  }
  .cmp-book__sub {
    font-family: var(--font-sans);
    font-size: var(--t5);
    line-height: 1.6;
    color: rgba(244,241,235,0.78);
    max-width: 38ch;
    margin: 0 auto;
  }
  .cmp-book__cta { display: inline-flex; }
  .cmp-book__secondary {
    margin-top: 1.6rem;
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: var(--warm-grey);
  }
  .cmp-book__secondary a { color: var(--sunlight-amber); text-decoration: none; }
  .cmp-book__secondary a:hover { text-decoration: underline; }
  .cmp-book__back {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 2.4rem;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    color: var(--warm-grey);
    text-decoration: none;
    transition: color 220ms var(--ease);
  }
  .cmp-book__back:hover { color: var(--pulse-notebook-white); }
  .cmp-book__back-arrow { transition: transform 220ms var(--ease); }
  .cmp-book__back:hover .cmp-book__back-arrow { transform: translateX(-3px); }

  /* ---------- RESPONSIVE — phone-first behaviour ---------- */
  @media (max-width: 860px) {
    .cmp-hero__inner { grid-template-columns: 1fr; gap: clamp(2.6rem, 7vw, 3.6rem); }
    .cmp-hero__bridge {
      width: clamp(380px, 90vw, 540px);
      right: auto;
      left: 50%;
      top: 24%;
      transform: translate(-50%, -50%);
      opacity: 0.26;
    }
    .cmp-vectors { grid-template-columns: 1fr; }
  }
  @media (max-width: 560px) {
    .cmp-card {
      grid-template-columns: 1fr;
      gap: 0.5rem;
    }
    .cmp-card__numeral { font-size: 2rem; }
    .cmp-note-cta { margin-left: 0; margin-right: 0; }
    .cmp-book__decor--yantra { left: -3%; opacity: 0.32; }
    .cmp-book__decor--anatomy { right: -3%; opacity: 0.32; }
  }

  @media (prefers-reduced-motion: reduce) {
    .cmp-bridge__yantra { animation: none; }
    .cmp-plan__thread-fill { transition: none; }
    .cmp-phase { transition: none; }
  }


  /* ============================================================
     HOMEPAGE · JOURNEY — alive moment (mobile-only, additive)
     ============================================================ */
  .stages__thread { display: none; }

  @media (max-width: 899px) {
    .stages {
      position: relative;
      padding-left: 2.6rem;
      justify-items: stretch;
    }
    .stage--anim { max-width: none; text-align: left; }
    .stage__orb { margin-left: 0; margin-right: 0; }

    .stages__thread {
      display: block;
      position: absolute;
      left: 13px;
      top: 8px;
      bottom: 8px;
      width: 2px;
      background: rgba(29,79,124,0.22);
      border-radius: 2px;
      overflow: hidden;
    }
    .stages__thread-fill {
      position: absolute;
      left: 0; top: 0;
      width: 100%;
      height: 0%;
      background: linear-gradient(180deg, var(--lab-blue) 0%, var(--muted-gold) 100%);
      box-shadow: 0 0 9px rgba(168,132,45,0.45);
      transition: height 2100ms var(--ease);
    }
    .stages.is-drawing .stages__thread-fill { height: 100%; }

    .stage--anim {
      position: relative;
      opacity: 0.32;
      transform: translateY(14px);
      transition: opacity 620ms var(--ease), transform 620ms var(--ease);
    }
    .stage--anim::before {
      content: "";
      position: absolute;
      left: calc(-2.6rem + 5px);
      top: 6px;
      width: 18px; height: 18px;
      border-radius: 50%;
      background: var(--page-magazine-cream);
      border: 2px solid rgba(29,79,124,0.4);
      transition: border-color 500ms var(--ease), box-shadow 500ms var(--ease), background 500ms var(--ease);
      z-index: 2;
    }
    .stage--anim.is-lit { opacity: 1; transform: translateY(0); }
    .stage--anim.is-lit::before {
      border-color: var(--muted-gold);
      background: var(--muted-gold);
      box-shadow: 0 0 0 4px rgba(168,132,45,0.14), 0 0 12px rgba(168,132,45,0.5);
    }
    .stage--anim .stage__orb {
      transform: scale(0.92);
      transition: transform 700ms var(--ease);
    }
    .stage--anim.is-lit .stage__orb { transform: scale(1); }
  }

  /* ============================================================
     HOMEPAGE · SIX VECTORS — cascade reveal + soft touch press
     ============================================================ */
  .vector--anim {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 560ms var(--ease), transform 560ms var(--ease);
  }
  .vector--anim .vector__icon {
    transform: scale(0.84);
    transition: transform 620ms var(--ease);
  }
  .vector--anim.is-lit { opacity: 1; transform: translateY(0); }
  .vector--anim.is-lit .vector__icon { transform: scale(1); }

  @media (hover: none) and (pointer: coarse) {
    .vector--anim {
      -webkit-tap-highlight-color: transparent;
      cursor: pointer;
      transition: opacity 560ms var(--ease),
                  transform 420ms var(--ease-soft),
                  background 420ms var(--ease-soft),
                  border-color 420ms var(--ease-soft);
    }
    .vector--anim.is-pressed {
      transform: scale(0.97);
      background: rgba(239, 232, 215, 0.62);
      border-color: rgba(193, 67, 43, 0.28);
      transition: transform 130ms var(--ease-soft),
                  background 130ms var(--ease-soft),
                  border-color 130ms var(--ease-soft);
    }
  }

  /* ============================================================
     HOMEPAGE · SERVICE CARDS — soft touch press
     ============================================================ */
  @media (hover: none) and (pointer: coarse) {
    .service-card--anim {
      -webkit-tap-highlight-color: transparent;
      cursor: pointer;
      transition: transform 420ms var(--ease-soft),
                  box-shadow 420ms var(--ease-soft),
                  border-color 420ms var(--ease-soft);
    }
    .service-card--anim.is-pressed {
      transform: scale(0.975);
      box-shadow: 0 14px 30px -20px rgba(15, 27, 45, 0.22);
      border-color: rgba(193, 67, 43, 0.32);
      transition: transform 130ms var(--ease-soft),
                  box-shadow 130ms var(--ease-soft),
                  border-color 130ms var(--ease-soft);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .stages__thread-fill { transition: none; }
    .stage--anim, .stage--anim .stage__orb { transition: none; }
    .vector--anim, .vector--anim .vector__icon { transition: none; }
  }


  /* ============================================================
     CONSULTATIONS · S3 FIVE CATEGORIES — alive moment (additive)
     Cascade reveal + soft touch press. Page-mode forest-green
     accent. Zero text / layout change.
     ============================================================ */
  .cons-cat--anim {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 560ms var(--ease), transform 560ms var(--ease);
  }
  .cons-cat--anim .cons-cat__numeral {
    transform: scale(0.8);
    transition: transform 620ms var(--ease), color 400ms var(--ease);
  }
  .cons-cat--anim.is-lit {
    opacity: 1;
    transform: translateY(0);
  }
  .cons-cat--anim.is-lit .cons-cat__numeral { transform: scale(1); }

  /* soft touch press — mobile only, forest-green tint */
  @media (hover: none) and (pointer: coarse) {
    .cons-cat--anim {
      -webkit-tap-highlight-color: transparent;
      cursor: pointer;
      border-radius: 8px;
      transition: opacity 560ms var(--ease),
                  transform 420ms var(--ease-soft),
                  background 420ms var(--ease-soft);
    }
    .cons-cat--anim.is-pressed {
      transform: scale(0.985);
      background: rgba(61, 107, 92, 0.07);
      transition: transform 130ms var(--ease-soft),
                  background 130ms var(--ease-soft);
    }
    .cons-cat--anim.is-pressed .cons-cat__numeral {
      color: var(--forest-green);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .cons-cat--anim,
    .cons-cat--anim .cons-cat__numeral { transition: none; }
  }
/* ==========================================================================
   WORKSHOPS PAGE · /workshops
   Service Line 3 · Page register (light editorial) · accent: Lab Blue
   Append-only block — no existing rule touched.
   ========================================================================== */

/* ---------- Shared: section label (used on S1 + S5 only) ---------- */
.wsp-label {
  font-family: var(--font-sans);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lab-blue);
  margin-bottom: 1.3rem;
}

/* ---------- Shared: CTA system (three weights by position) ---------- */
.wsp-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-decoration: none;
  cursor: pointer;
}
.wsp-cta .arrow {
  display: inline-block;
  transition: transform 220ms var(--ease);
}
.wsp-cta:hover .arrow,
.wsp-cta:active .arrow { transform: translateX(4px); }

/* outline — quiet (S1 hero) */
.wsp-cta--outline {
  margin-top: clamp(1.9rem, 3vw, 2.5rem);
  font-size: 0.95rem;
  color: var(--lab-blue);
  background: transparent;
  border: 1.5px solid var(--lab-blue);
  padding: 0.95rem 1.95rem;
  border-radius: 8px;
  transition: background 240ms var(--ease), color 240ms var(--ease),
              transform 180ms var(--ease);
}
.wsp-cta--outline:hover,
.wsp-cta--outline:active {
  background: var(--lab-blue);
  color: #FFFFFF;
  transform: translateY(-2px);
}

/* underline — personal (S3 doctor) */
.wsp-cta--underline {
  margin-top: 1.9rem;
  font-size: 1.02rem;
  font-weight: 500;
  color: var(--lab-blue);
  padding-bottom: 3px;
  border-bottom: 1.5px solid rgba(29, 79, 124, 0.45);
  transition: border-color 240ms var(--ease), gap 240ms var(--ease);
}
.wsp-cta--underline:hover,
.wsp-cta--underline:active {
  border-bottom-color: var(--lab-blue);
  gap: 0.95rem;
}

/* solid — decisive (S5 close) */
.wsp-cta--solid {
  font-size: 1rem;
  color: #FFFFFF;
  background: var(--lab-blue);
  padding: 1.1rem 2.4rem;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(29, 79, 124, 0.22),
              0 0 38px -8px rgba(29, 79, 124, 0.30);
  transition: background 220ms var(--ease), transform 180ms var(--ease),
              box-shadow 240ms var(--ease);
}
.wsp-cta--solid:hover,
.wsp-cta--solid:active {
  background: #163D62;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(29, 79, 124, 0.28),
              0 0 52px -4px rgba(29, 79, 124, 0.42);
}

/* ---------- Shared: emphasis lift inside body copy ---------- */
.wsp-em {
  font-family: var(--font-serif);
  font-style: italic;
  color: var(--page-warm-ink-black);
}
.wsp-em--strong {
  font-weight: 700;
  color: var(--lab-blue);
}

/* ---------- S0 · Back to Services ---------- */
.wsp-back {
  background: var(--page-magazine-cream);
  padding: clamp(5.5rem, 9vw, 7rem) 0 0;
}
.wsp-back__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 1.4rem var(--gutter) 0;
}
.wsp-back__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-sans);
  font-size: var(--t6);
  letter-spacing: 0.04em;
  color: var(--page-earth-brown);
  text-decoration: none;
  transition: color 200ms var(--ease);
}
.wsp-back__arrow { transition: transform 220ms var(--ease); }
.wsp-back__link:hover,
.wsp-back__link:active { color: var(--lab-blue); }
.wsp-back__link:hover .wsp-back__arrow { transform: translateX(-3px); }

/* ---------- S1 · Hero ---------- */
.wsp-hero {
  position: relative;
  overflow: hidden;
  background: var(--page-magazine-cream);
  padding: clamp(2.6rem, 5vw, 4rem) 0 var(--section-pad-y);
}
.wsp-hero::before {
  content: "";
  position: absolute;
  top: -8%;
  left: 50%;
  width: min(820px, 130vw);
  height: 480px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse at center,
              rgba(29, 79, 124, 0.07) 0%,
              rgba(29, 79, 124, 0.03) 42%,
              transparent 72%);
  pointer-events: none;
  z-index: 0;
}
.wsp-hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.wsp-hero__headline {
  font-family: var(--font-serif);
  font-size: var(--t1);
  line-height: 1.16;
  color: var(--page-warm-ink-black);
  max-width: 18ch;
  margin-bottom: 1.5rem;
}
.wsp-hero__sub {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.7;
  color: var(--page-earth-brown);
  max-width: 60ch;
}

/* ---------- S2 · What a desk day quietly costs ---------- */
.wsp-config {
  background: var(--page-aged-parchment);
  padding: var(--section-pad-y) 0;
}
.wsp-config__inner {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.wsp-config__h {
  font-family: var(--font-serif);
  font-size: var(--t2);
  line-height: 1.22;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.4rem;
  max-width: 20ch;
}
.wsp-config__framing {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.7;
  color: var(--page-earth-brown);
  max-width: 62ch;
}

/* cost-paired lines */
.wsp-cost-list {
  margin-top: clamp(2.4rem, 5vw, 3.4rem);
}
.wsp-cost {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.72;
  color: var(--page-earth-brown);
  padding: clamp(1.3rem, 2.6vw, 1.7rem) 0;
  border-bottom: 1px solid rgba(90, 74, 58, 0.20);
}
.wsp-cost:first-child { padding-top: 0; }
.wsp-cost:last-child { border-bottom: none; padding-bottom: 0; }
.wsp-cost--anim {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 620ms var(--ease), transform 620ms var(--ease);
}
.wsp-cost--anim.is-lit {
  opacity: 1;
  transform: translateY(0);
}

/* bridge line — "You don't notice it in a day..." */
.wsp-config__bridge {
  font-family: var(--font-serif);
  font-size: var(--t3);
  line-height: 1.5;
  color: var(--page-warm-ink-black);
  text-align: center;
  max-width: 34ch;
  margin: clamp(3rem, 6vw, 4.6rem) auto;
}

/* trajectory block — the divergence set-piece */
.wsp-traj {
  background: var(--page-magazine-cream);
  border: 1px solid rgba(90, 74, 58, 0.18);
  border-radius: 14px;
  padding: clamp(1.8rem, 4vw, 2.8rem);
}
.wsp-traj__heading {
  font-family: var(--font-serif);
  font-size: var(--t3);
  color: var(--page-warm-ink-black);
  text-align: center;
  margin-bottom: clamp(1.8rem, 4vw, 2.6rem);
}
.wsp-traj__cols {
  display: flex;
  flex-direction: column;
}
.wsp-traj__divider {
  height: 1px;
  background: rgba(90, 74, 58, 0.20);
  margin: 1.6rem 0;
}
.wsp-traj__col {
  border: 1px solid transparent;
  border-radius: 10px;
  padding: clamp(1.1rem, 2.4vw, 1.5rem);
  transition: transform 700ms var(--ease), opacity 700ms var(--ease),
              background-color 700ms var(--ease), border-color 700ms var(--ease),
              box-shadow 700ms var(--ease);
}
.wsp-traj__tag {
  font-family: var(--font-sans);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--page-earth-brown);
  margin-bottom: 0.85rem;
  transition: color 700ms var(--ease);
}
.wsp-traj__body {
  font-family: var(--font-sans);
  font-size: var(--t5);
  line-height: 1.72;
  color: var(--page-earth-brown);
  transition: color 700ms var(--ease);
}
/* the divergence — triggered */
.wsp-traj.is-diverged .wsp-traj__col--left {
  transform: translateY(8px);
  opacity: 0.45;
}
.wsp-traj.is-diverged .wsp-traj__col--right {
  transform: translateY(-8px);
  background: #FBF8EE;
  border-color: rgba(29, 79, 124, 0.65);
  box-shadow: 0 0 40px -8px rgba(29, 79, 124, 0.28),
              0 14px 36px -16px rgba(90, 74, 58, 0.30);
}
.wsp-traj.is-diverged .wsp-traj__col--right .wsp-traj__tag {
  color: var(--lab-blue);
}
.wsp-traj.is-diverged .wsp-traj__col--right .wsp-traj__body {
  color: var(--page-warm-ink-black);
}
.wsp-traj.is-diverged .wsp-traj__col--right .wsp-em {
  color: var(--lab-blue);
  font-weight: 700;
}

/* ---------- S3 · The doctor ---------- */
.wsp-doctor {
  position: relative;
  overflow: hidden;
  background: var(--page-magazine-cream);
}
.wsp-doctor__media {
  display: block;
  width: 100%;
}
.wsp-doctor__media img {
  display: block;
  width: 100%;
  height: auto;
}
/* the "develop" settle — overrides .fade-in translate with a scale */
.wsp-doctor__media.wsp-develop {
  opacity: 0;
  transform: scale(1.03);
  transition: opacity 800ms var(--ease), transform 1100ms var(--ease);
}
.wsp-doctor__media.wsp-develop.is-visible {
  opacity: 1;
  transform: scale(1);
}
.wsp-doctor__scrim { display: none; }
.wsp-doctor__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--section-pad-y) var(--gutter);
}
.wsp-doctor__h {
  font-family: var(--font-serif);
  font-size: var(--t2);
  line-height: 1.22;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.4rem;
  max-width: 18ch;
}
.wsp-doctor__body {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.74;
  color: var(--page-earth-brown);
  max-width: 46ch;
  margin-bottom: 1.15rem;
}

/* ---------- S4 · The workshops ---------- */
.wsp-approach {
  background: var(--page-aged-parchment);
  padding: var(--section-pad-y) 0;
}
.wsp-approach__inner {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.wsp-approach__h {
  font-family: var(--font-serif);
  font-size: var(--t2);
  line-height: 1.22;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.4rem;
}
.wsp-approach__intro {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.7;
  color: var(--page-earth-brown);
  max-width: 60ch;
  margin-bottom: 1rem;
}
.wsp-approach__intro:last-of-type { margin-bottom: 0; }

/* bridge line — "We currently offer two workshops." */
.wsp-approach__bridge {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: var(--t3);
  line-height: 1.4;
  color: var(--page-warm-ink-black);
  text-align: center;
  margin: clamp(3rem, 6vw, 4.4rem) auto clamp(2rem, 4vw, 2.8rem);
}

/* the two Workshop boxes */
.wsp-boxes {
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}
.wsp-box {
  background: var(--page-magazine-cream);
  border: 1px solid rgba(29, 79, 124, 0.32);
  border-radius: 12px;
  padding: clamp(1.8rem, 4vw, 2.4rem);
  transition: border-color 520ms var(--ease), transform 200ms var(--ease),
              box-shadow 520ms var(--ease);
}
.wsp-box--anim.is-lit {
  border-color: rgba(29, 79, 124, 0.55);
  box-shadow: 0 6px 26px -14px rgba(29, 79, 124, 0.24);
}
.wsp-box.is-pressed { transform: scale(0.985); }
.wsp-box__mark {
  width: 52px;
  height: 52px;
  color: var(--lab-blue);
  opacity: 0.75;
  margin-bottom: 1.2rem;
}
.wsp-box__name {
  font-family: var(--font-serif);
  font-size: var(--t3);
  line-height: 1.3;
  color: var(--page-warm-ink-black);
  margin-bottom: 0.7rem;
}
.wsp-box__sub {
  font-family: var(--font-sans);
  font-size: var(--t5);
  line-height: 1.66;
  color: var(--page-earth-brown);
}
.wsp-box__rule {
  height: 1px;
  background: rgba(29, 79, 124, 0.22);
  margin: 1.4rem 0;
}
.wsp-box__tags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.wsp-box__tags li {
  font-family: var(--font-sans);
  font-size: var(--t6);
  letter-spacing: 0.01em;
  color: var(--lab-blue);
  background: transparent;
  border: 1px solid rgba(29, 79, 124, 0.42);
  border-radius: 999px;
  padding: 0.42rem 0.85rem;
}

/* ---------- S5 · Bring this to your team ---------- */
.wsp-close {
  background: var(--page-magazine-cream);
  padding: var(--section-pad-y) 0;
}
.wsp-close__inner {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
  text-align: center;
}
.wsp-close__h {
  font-family: var(--font-serif);
  font-size: var(--t2);
  line-height: 1.22;
  color: var(--page-warm-ink-black);
  margin-bottom: 1.3rem;
}
.wsp-close__body {
  font-family: var(--font-sans);
  font-size: var(--t4);
  line-height: 1.7;
  color: var(--page-earth-brown);
  max-width: 54ch;
  margin: 0 auto clamp(2.2rem, 4.5vw, 3rem);
}
.wsp-close__sub {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--page-earth-brown);
  margin-top: 1.5rem;
}
.wsp-close__sub a {
  color: var(--lab-blue);
  text-decoration: none;
}
.wsp-close__sub a:hover { text-decoration: underline; }
.wsp-close__pathway {
  font-family: var(--font-sans);
  font-size: var(--t5);
  line-height: 1.7;
  color: var(--page-earth-brown);
  max-width: 50ch;
  margin: clamp(2.6rem, 5vw, 3.4rem) auto 0;
  padding-top: clamp(1.8rem, 3.5vw, 2.4rem);
  border-top: 1px solid rgba(90, 74, 58, 0.20);
}
.wsp-close__back {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: clamp(2.4rem, 5vw, 3rem);
  font-family: var(--font-sans);
  font-size: 0.9rem;
  color: var(--page-earth-brown);
  text-decoration: none;
  transition: color 220ms var(--ease);
}
.wsp-close__back:hover { color: var(--lab-blue); }
.wsp-close__back:hover .wsp-back__arrow { transform: translateX(-3px); }

/* ==========================================================================
   WORKSHOPS · DESKTOP  (≥ 861px)
   ========================================================================== */
@media (min-width: 861px) {

  /* S2 · trajectory — side-by-side columns */
  .wsp-traj__cols {
    flex-direction: row;
    align-items: stretch;
    gap: 0;
  }
  .wsp-traj__col { flex: 1; }
  .wsp-traj__divider {
    width: 1px;
    height: auto;
    margin: 0 clamp(1.4rem, 3vw, 2.4rem);
  }

  /* S3 · doctor — full-bleed image, text over cream-scrim empty zone */
  .wsp-doctor { min-height: clamp(560px, 70vh, 720px); }
  .wsp-doctor__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .wsp-doctor__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
  }
  .wsp-doctor__scrim {
    display: block;
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
                var(--page-magazine-cream) 0%,
                rgba(244, 241, 235, 0.96) 28%,
                rgba(244, 241, 235, 0.55) 50%,
                transparent 66%);
    z-index: 1;
  }
  .wsp-doctor__inner {
    position: relative;
    z-index: 2;
    min-height: inherit;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .wsp-doctor__h,
  .wsp-doctor__body { max-width: 27rem; }

  /* S4 · two Workshop boxes — equal-width pair */
  .wsp-boxes {
    flex-direction: row;
    gap: 1.6rem;
  }
  .wsp-box {
    flex: 1;
    display: flex;
    flex-direction: column;
  }
  .wsp-box__tags { margin-top: auto; }
}

/* ---------- Small phone — full-width CTAs ---------- */
@media (max-width: 520px) {
  .wsp-cta--outline,
  .wsp-cta--solid {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   WORKSHOPS · REDUCED MOTION
   JS supplies end-state classes; here we strip all transition/transform.
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .wsp-cost--anim,
  .wsp-traj__col,
  .wsp-traj__tag,
  .wsp-traj__body,
  .wsp-box,
  .wsp-doctor__media.wsp-develop,
  .wsp-cta,
  .wsp-cta .arrow {
    transition: none !important;
  }
  .wsp-cost--anim {
    opacity: 1 !important;
    transform: none !important;
  }
  .wsp-doctor__media.wsp-develop {
    opacity: 1 !important;
    transform: none !important;
  }
  /* trajectory holds its resolved end-state, no movement */
  .wsp-traj.is-diverged .wsp-traj__col--left,
  .wsp-traj.is-diverged .wsp-traj__col--right {
    transform: none !important;
  }
}
/* ==========================================================================
   TESTIMONIALS · tst- prefix · Parchment background · All three pages
   Append-only · June 2026
   ========================================================================== */

.tst {
  background: var(--page-aged-parchment);
  padding: var(--section-pad-y) 0;
  position: relative;
  overflow: hidden;
}
.tst::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(90,74,58,0.04) 1px, transparent 0);
  background-size: 4px 4px;
  pointer-events: none;
}

.tst__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.tst__head {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.tst__eyebrow {
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--page-earth-brown);
  opacity: 0.6;
  margin-bottom: 0.8rem;
}
.tst__heading {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t3);
  line-height: 1.2;
  color: var(--page-warm-ink-black);
}

/* Grid — default 2-col for index (4 cards), single col for others */
.tst__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 3vw, 2rem);
}
@media (min-width: 680px) {
  .tst__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .tst__grid--four { grid-template-columns: repeat(4, 1fr); }
  .tst__grid--three { grid-template-columns: repeat(3, 1fr); }
}

/* Card */
.tst__card {
  background: var(--page-magazine-cream);
  border: 1px solid rgba(90,74,58,0.12);
  border-radius: 3px;
  padding: clamp(1.5rem, 3vw, 2rem);
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  transition: transform 400ms var(--ease), box-shadow 400ms var(--ease);
}
.tst__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px -12px rgba(26,26,26,0.12);
}

/* Opening mark */
.tst__mark {
  font-family: var(--font-serif);
  font-size: 3rem;
  line-height: 1;
  color: var(--terra-red);
  opacity: 0.55;
  margin-bottom: -0.6rem;
  user-select: none;
}

/* Quote body */
.tst__quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(0.95rem, 1.4vw, 1.05rem);
  line-height: 1.75;
  color: var(--page-warm-ink-black);
  flex: 1;
}

/* Attribution row */
.tst__attr {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(90,74,58,0.1);
}
.tst__name {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--page-warm-ink-black);
  letter-spacing: 0.01em;
}
.tst__meta {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  color: var(--page-earth-brown);
  opacity: 0.75;
}
.tst__tag {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.2rem 0.55rem;
  border-radius: 2px;
  margin-top: 0.3rem;
  width: fit-content;
}
.tst__tag--companionship {
  background: rgba(61,107,92,0.1);
  color: var(--forest-green);
}
.tst__tag--consultation {
  background: rgba(29,79,124,0.1);
  color: var(--lab-blue);
}

/* Single featured card variant — consultations page */
.tst__grid--single {
  max-width: 680px;
  margin: 0 auto;
}
.tst__grid--single .tst__card {
  padding: clamp(2rem, 4vw, 2.8rem);
}
.tst__grid--single .tst__quote {
  font-size: clamp(1rem, 1.6vw, 1.15rem);
}

@media (prefers-reduced-motion: reduce) {
  .tst__card { transition: none; }
}