/* ============================================================
   Project Human 2.0 — Public Brand Stylesheet (public.css)
   "Calm clinic meets warm kitchen."
   Warm cream canvas · botanical sage · honey accent · Fraunces + Inter.
   Public pages ONLY (landing + booking). Admin keeps ph.css (dark).
   Warm, welcoming, trustworthy, human. Apple-grade, never a terminal.
   ============================================================ */

/* Use local font fallbacks; public pages do not need a third-party font request. */

/* ----------------------------------------------------------
   1. TOKENS
   ---------------------------------------------------------- */
:root {
  /* FORGE tokens. This sheet's original warm-cream/sage theme is retired; the
     pages that link it (book, onboard) override :root inline with FORGE anyway,
     so these base values exist to make any un-overridden variable resolve to
     the live brand, never to the old spa palette. */
  --bg:            #0B0C0E;
  --surface:       #16181C;
  --surface-2:     #1F2228;

  --accent:        #21E6C1;
  --accent-hover:  #5CF0D6;
  --accent-ink:    #07120F;
  --accent-soft:   rgba(33, 230, 193, 0.12);
  --accent-line:   rgba(33, 230, 193, 0.34);

  /* Molten action accent (was honey) */
  --honey:         #FF4D2E;
  --honey-soft:    rgba(255, 77, 46, 0.08);

  --text:          #F2F4F7;
  --text-2:        #A7AEBA;
  --text-3:        #6B7280;

  --line:          #2A2E36;
  --line-strong:   #353A44;
  --shadow:        0 1px 2px rgba(0,0,0,0.4), 0 10px 30px rgba(0,0,0,0.45);
  --shadow-lift:   0 2px 6px rgba(0,0,0,0.45), 0 20px 50px rgba(0,0,0,0.55);

  --good:          #34E08A;
  --warn:          #FFB020;
  --bad:           #FF6B57;

  --hero-grad:     linear-gradient(160deg, #0B0C0E 0%, #101216 55%, #10161a 100%);

  --font:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display: 'Inter Tight', 'Inter', -apple-system, 'Segoe UI', sans-serif;

  /* Spacing scale: 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 */
  --s1: 8px;  --s2: 12px; --s3: 16px; --s4: 24px;
  --s5: 32px; --s6: 48px; --s7: 64px; --s8: 96px;

  /* Radius — rounded, organic */
  --r-sm:   14px;
  --r:      18px;
  --r-lg:   22px;
  --radius:    20px;
  --radius-lg: 24px;
  --r-pill: 999px;
  --radius-pill: 999px;

  /* Layout */
  --wrap: 1080px;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

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

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

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.7;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -0.006em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
}

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

::selection {
  background: var(--accent-soft);
  color: var(--accent-hover);
}

/* Soft sage focus — accessible, never a hard neon ring */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ----------------------------------------------------------
   3. TYPOGRAPHY — warm serif display, humanist sans body
   ---------------------------------------------------------- */
h1, h2, h3 {
  font-family: var(--display);
  color: var(--text);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-wrap: balance;
  font-optical-sizing: auto;
}

h4 {
  font-family: var(--font);
  color: var(--text);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

h1 {
  font-size: clamp(2.4rem, 6vw, 4rem);
  line-height: 1.05;
  letter-spacing: -0.022em;
  max-width: 16ch;
}

h2 {
  font-size: clamp(1.9rem, 4vw, 2.7rem);
  letter-spacing: -0.02em;
  max-width: 20ch;
}

h3 {
  font-size: clamp(1.35rem, 2.4vw, 1.7rem);
  line-height: 1.2;
}

h4 {
  font-size: 1.075rem;
}

p { color: var(--text-2); }
p + p { margin-top: var(--s3); }

.eyebrow {
  font-family: var(--font);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: none;
  color: var(--accent);
  display: inline-block;
  margin-bottom: var(--s2);
}

.lead {
  font-size: clamp(1.12rem, 2vw, 1.32rem);
  line-height: 1.6;
  color: var(--text-2);
  letter-spacing: -0.008em;
  max-width: 60ch;
}

.muted  { color: var(--text-2); }
.dim    { color: var(--text-3); }
.center { text-align: center; }

/* Honey-accented highlight word — one per section, never edge to edge */
.accent {
  color: var(--honey);
  font-style: normal;
}
/* Sage-accented variant for links/verdict ticks */
.accent-sage { color: var(--accent); }

a {
  color: var(--accent);
  text-decoration: none;
  transition: color 0.2s var(--ease);
}
a:hover { color: var(--accent-hover); }

a.link {
  color: var(--accent);
  border-bottom: 1px solid var(--accent-line);
  padding-bottom: 1px;
}
a.link:hover { border-color: var(--accent); }

/* ----------------------------------------------------------
   4. LAYOUT — calm, spacious, one idea per band
   ---------------------------------------------------------- */
.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--s5);
}

.wrap-narrow { max-width: 760px; margin-inline: auto; }

.section { padding-block: clamp(64px, 11vw, 96px); }
.section-sm { padding-block: clamp(48px, 8vw, 72px); }

/* Soft section rhythm — alternate cream and oat bands, no hard lines */
.band-oat  { background: var(--surface-2); }
.band-sage { background: var(--accent-soft); }

.head { max-width: 60ch; margin-bottom: var(--s6); }
.head.center { margin-inline: auto; text-align: center; }
.head .lead { margin-top: var(--s3); }

.stack   { display: flex; flex-direction: column; }
.stack-2 { gap: var(--s2); }
.stack-3 { gap: var(--s3); }
.stack-4 { gap: var(--s4); }
.stack-5 { gap: var(--s5); }
.stack-6 { gap: var(--s6); }

.grid { display: grid; gap: var(--s4); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }

/* Barely-there warm divider instead of a hard rule */
.divider { height: 1px; background: var(--line); border: 0; width: 100%; }

/* ----------------------------------------------------------
   5. NAV — light, airy, warm blur
   ---------------------------------------------------------- */
nav, .nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s4);
  padding: var(--s3) var(--s5);
  max-width: var(--wrap);
  margin-inline: auto;
  background: rgba(250, 246, 239, 0.78);
  backdrop-filter: saturate(140%) blur(18px);
  -webkit-backdrop-filter: saturate(140%) blur(18px);
  border-bottom: 1px solid var(--line);
}

.nav .brand, .brand {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  font-family: var(--display);
  font-weight: 500;
  font-size: 1.12rem;
  letter-spacing: -0.01em;
  color: var(--text);
}

.brand .dot, .dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
  flex: none;
}

.nav-links { display: flex; align-items: center; gap: var(--s5); }
.nav-links a {
  font-family: var(--font);
  color: var(--text-2);
  font-size: 0.95rem;
  font-weight: 500;
}
.nav-links a:hover { color: var(--text); }
.nav-links a.btn:hover { color: var(--accent-ink); }

/* ----------------------------------------------------------
   6. BUTTONS — full pills, soft shadow, gentle lift
   ---------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s2);
  font-family: var(--font);
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1;
  padding: 15px 26px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.18s var(--ease),
              background 0.18s var(--ease),
              border-color 0.18s var(--ease),
              box-shadow 0.18s var(--ease),
              color 0.18s var(--ease),
              opacity 0.18s var(--ease);
  user-select: none;
}
.btn:active { transform: translateY(0) scale(0.98); }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }

.btn-primary {
  background: var(--accent);
  color: var(--accent-ink);
  box-shadow: var(--shadow);
}
.btn-primary:hover {
  background: var(--accent-hover);
  color: var(--accent-ink);
  transform: translateY(-1px);
  box-shadow: var(--shadow-lift);
}

.btn-secondary {
  background: transparent;
  color: var(--accent);
  border-color: var(--accent-line);
}
.btn-secondary:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-hover);
  transform: translateY(-1px);
}

.btn-ghost {
  background: transparent;
  color: var(--text-2);
  border-color: transparent;
}
.btn-ghost:hover { color: var(--text); background: rgba(42,39,36,0.04); }

.btn-honey {
  background: var(--honey);
  color: #3A2A12;
  box-shadow: var(--shadow);
}
.btn-honey:hover { filter: brightness(1.04); transform: translateY(-1px); box-shadow: var(--shadow-lift); }

.btn-sm { font-size: 0.86rem; padding: 10px 18px; }
.btn-block { width: 100%; }

.cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3);
  margin-top: var(--s5);
}

/* ----------------------------------------------------------
   7. CARDS — white lift off cream, big radius, soft shadow
   ---------------------------------------------------------- */
.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: var(--s6);
  box-shadow: var(--shadow);
}

.card-sm { padding: var(--s4); border-radius: var(--radius); }

.card-soft {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: var(--s5);
}

.card-hover { transition: border-color 0.25s var(--ease), transform 0.25s var(--ease), box-shadow 0.25s var(--ease); }
.card-hover:hover {
  border-color: var(--line-strong);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lift);
}

/* Sage-edged hero/value card — warm, not a neon ring */
.card-accent {
  border-color: var(--accent-line);
  box-shadow: var(--shadow);
}

/* ----------------------------------------------------------
   8. FORMS — rounded fields, warm sage focus
   ---------------------------------------------------------- */
label, .label {
  display: block;
  font-size: 0.86rem;
  font-weight: 500;
  color: var(--text-2);
  margin-bottom: var(--s1);
  letter-spacing: -0.003em;
}

input, select, textarea {
  width: 100%;
  font-family: var(--font);
  font-size: 1rem;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--r);
  padding: 14px 16px;
  line-height: 1.45;
  transition: border-color 0.18s var(--ease), box-shadow 0.18s var(--ease), background 0.18s var(--ease);
  appearance: none;
}

/* Native checkboxes/radios — appearance:none above breaks toggling if unset */
input[type="checkbox"],
input[type="radio"] {
  appearance: auto;
  -webkit-appearance: checkbox;
  width: 20px;
  height: 20px;
  min-width: 20px;
  max-width: 20px;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  flex: none;
}
input[type="radio"] { -webkit-appearance: radio; }
input[type="checkbox"]:focus,
input[type="radio"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px var(--accent-soft);
}

input::placeholder, textarea::placeholder { color: var(--text-3); }

/* Warm focus state — soft sage glow, no hard ring */
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--accent);
  background: var(--surface);
  box-shadow: 0 0 0 4px var(--accent-soft);
}

textarea { resize: vertical; min-height: 120px; }

select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235C564E' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  cursor: pointer;
}

.field { margin-bottom: var(--s4); }
.field.full { grid-column: 1 / -1; }

/* form group — two fields side by side */
.fg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s4);
}

.hint { font-size: 0.82rem; color: var(--text-3); margin-top: var(--s1); }

/* consent / agree checkbox row */
.agree {
  display: flex;
  align-items: flex-start;
  gap: var(--s2);
  font-size: 0.9rem;
  color: var(--text-2);
  line-height: 1.6;
  margin-bottom: var(--s4);
}
.agree input[type="checkbox"] {
  width: 20px; height: 20px;
  margin-top: 2px;
  accent-color: var(--accent);
  flex: none;
}

.formerr {
  font-size: 0.88rem;
  color: var(--bad);
  margin-top: var(--s3);
  min-height: 1.2em;
}

/* ----------------------------------------------------------
   9. TAGS / BADGES / PILLS
   ---------------------------------------------------------- */
.tag, .badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.005em;
  padding: 6px 12px;
  border-radius: var(--r-pill);
  background: var(--surface);
  border: 1px solid var(--line-strong);
  color: var(--text-2);
  line-height: 1;
}

.tag-accent, .badge-accent {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent-hover);
}
.badge-good { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent-hover); }
.badge-warn { background: var(--honey-soft); border-color: rgba(224,164,88,0.35); color: #9A6B26; }

.pill {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  padding: 8px 16px;
  border-radius: var(--r-pill);
  background: var(--surface);
  border: 1px solid var(--line-strong);
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--text-2);
  box-shadow: var(--shadow);
}
.pill b { color: var(--text); font-weight: 600; }

/* live status dot in hero pill — calm sage, gentle pulse */
.status-pill .live {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--accent);
  flex: none;
  animation: ph-pulse 2.4s var(--ease) infinite;
}
@keyframes ph-pulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--accent-line); }
  50%      { box-shadow: 0 0 0 5px rgba(63,107,82,0); }
}

/* ----------------------------------------------------------
   10. HERO — warmth in the first paint
   ---------------------------------------------------------- */
.hero {
  position: relative;
  padding-block: clamp(56px, 11vw, 104px) clamp(48px, 9vw, 88px);
  text-align: left;
  overflow: hidden;
}
/* Subtle cream to oat to sage organic atmosphere */
.hero::before {
  content: "";
  position: absolute;
  inset: -10% -20% auto -20%;
  height: 140%;
  background: var(--hero-grad);
  z-index: -2;
}
/* Soft organic blob behind the headline */
.hero::after {
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  width: min(46vw, 460px);
  height: min(46vw, 460px);
  background: radial-gradient(circle at 50% 50%, var(--accent-soft) 0%, rgba(231,239,231,0) 70%);
  border-radius: 50%;
  z-index: -1;
  pointer-events: none;
}
.hero h1 { margin-top: var(--s4); }
.hero .lead { margin-top: var(--s4); max-width: 56ch; }
.hero-note {
  margin-top: var(--s4);
  font-size: 0.9rem;
  color: var(--text-3);
}

/* ----------------------------------------------------------
   11. CONTENT BLOCKS — points / steps / principles / results
   ---------------------------------------------------------- */
.points, .principles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s4);
}
.point, .principle {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--s5);
  box-shadow: var(--shadow);
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.point:hover, .principle:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.point h4, .principle h4 { margin-bottom: var(--s2); }
.point p, .principle p { font-size: 0.96rem; }

/* numbered how-it-works steps */
.steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--s4);
}
.step {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--s5);
  box-shadow: var(--shadow);
}
.step .n {
  font-family: var(--display);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--honey);
  margin-bottom: var(--s2);
}
.step h4 { margin-bottom: var(--s1); }
.step p { font-size: 0.94rem; }

/* outcome results */
.results {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--s4);
}
.result {
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  border-radius: var(--radius);
  padding: var(--s5);
}
.result .big {
  font-family: var(--display);
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--accent-hover);
  margin-bottom: var(--s1);
}
.result p { font-size: 0.92rem; }

/* ----------------------------------------------------------
   12. VALUE STACK
   ---------------------------------------------------------- */
.value-rows { display: flex; flex-direction: column; }
.vrow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--s4);
  padding: var(--s4) 0;
  border-bottom: 1px solid var(--line);
}
.vrow:first-child { padding-top: 0; }
.vmain h4 { margin-bottom: 4px; }
.vmain p { font-size: 0.95rem; }
.vworth {
  flex: none;
  font-size: 0.85rem;
  color: var(--text-3);
  white-space: nowrap;
  text-align: right;
}
.vworth b { color: var(--accent-hover); font-weight: 600; }

.value-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--s4);
  flex-wrap: wrap;
  margin-top: var(--s5);
  padding-top: var(--s5);
  border-top: 1px solid var(--line-strong);
}
.vf-small { font-size: 0.88rem; color: var(--text-3); }
.vf-worth { font-size: 0.92rem; color: var(--text-2); margin-top: 4px; }
.vf-left s, .vf-small s, .vf-worth s { color: var(--text-3); }
.vf-right { text-align: right; }
.vf-label {
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--accent);
}
.vf-amt {
  font-family: var(--display);
  font-size: clamp(2.2rem, 5vw, 3rem);
  font-weight: 600;
  color: var(--text);
  line-height: 1;
}
.vf-amt span { font-family: var(--font); font-size: 1rem; font-weight: 500; color: var(--text-3); }

/* ----------------------------------------------------------
   13. VS COMPARISON — them vs us
   ---------------------------------------------------------- */
.vs { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
.vcol {
  border-radius: var(--radius-lg);
  padding: var(--s5);
  border: 1px solid var(--line);
}
.vcol h4 { margin-bottom: var(--s3); }
.vcol ul { list-style: none; display: flex; flex-direction: column; gap: var(--s2); }
.vcol li {
  font-size: 0.95rem;
  color: var(--text-2);
  padding-left: 28px;
  position: relative;
  line-height: 1.5;
}
.vcol.them {
  background: var(--surface-2);
}
.vcol.them li::before {
  content: "·";
  position: absolute; left: 8px; top: -1px;
  color: var(--text-3);
  font-weight: 700;
  font-size: 1.2rem;
}
.vcol.us {
  background: var(--surface);
  border-color: var(--accent-line);
  box-shadow: var(--shadow);
}
.vcol.us h4 { color: var(--accent-hover); }
/* sage tick replaces the old em-dash bullet */
.vcol.us li::before {
  content: "";
  position: absolute; left: 4px; top: 7px;
  width: 6px; height: 10px;
  border: solid var(--accent);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* ----------------------------------------------------------
   14. MEMBER CONVERSATION BLOCK
   ---------------------------------------------------------- */
.card.member-context {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--s6);
  align-items: start;
}
.card.member-context ul { list-style: none; display: flex; flex-direction: column; gap: var(--s2); margin-top: var(--s4); }
.card.member-context li {
  font-size: 0.95rem;
  color: var(--text-2);
  padding-left: 26px;
  position: relative;
}
.card.member-context li::before {
  content: "";
  position: absolute; left: 2px; top: 7px;
  width: 6px; height: 10px;
  border: solid var(--accent);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.convo {
  display: flex;
  flex-direction: column;
  gap: var(--s3);
  border-left: 3px solid var(--accent-line);
}
.convo .q {
  font-family: var(--font);
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--accent-hover);
}
.convo .a {
  font-size: 0.92rem;
  color: var(--text-2);
  line-height: 1.6;
  padding-bottom: var(--s2);
}
.convo .a:not(:last-child) { border-bottom: 1px solid var(--line); }

/* ----------------------------------------------------------
   15. PRICING CARD
   ---------------------------------------------------------- */
.card.price { text-align: center; }
.card.price .vf-label { display: block; }
.card.price .vf-amt { margin: var(--s2) 0; }
.card.price .note { font-size: 0.9rem; color: var(--text-3); margin-bottom: var(--s4); }
.card.price ul {
  list-style: none;
  display: inline-flex;
  flex-direction: column;
  gap: var(--s2);
  text-align: left;
  margin: 0 auto var(--s5);
}
.card.price li {
  font-size: 0.96rem;
  color: var(--text-2);
  padding-left: 26px;
  position: relative;
}
.card.price li::before {
  content: "";
  position: absolute; left: 2px; top: 7px;
  width: 6px; height: 10px;
  border: solid var(--accent);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.member-line { font-size: 0.86rem; color: var(--text-3); margin-top: var(--s3); }

/* ----------------------------------------------------------
   16. BOOKING — screen-box / checks / success
   ---------------------------------------------------------- */
.screen-box {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--s5);
}
.screen-box .t { font-weight: 600; color: var(--text); margin-bottom: 4px; }
.screen-box .st { font-size: 0.9rem; color: var(--text-3); margin-bottom: var(--s4); }

.checks { display: flex; flex-direction: column; gap: var(--s2); }
/* Checkbox-first row. No decorative tick — the only "ticked" affordance is the real
   checkbox, so an unchecked condition never looks pre-selected on this safety screen. */
.cl {
  display: flex;
  align-items: center;
  gap: var(--s2);
  font-size: 0.95rem;
  color: var(--text-2);
  cursor: pointer;
}
.cl .hflag {
  width: 20px; height: 20px;
  accent-color: var(--accent);
  flex: none;
  margin: 0;
}

/* warm "you're in good hands" confirmation */
.success {
  background: var(--honey-soft);
  border: 1px solid rgba(224,164,88,0.32);
  border-radius: var(--radius-lg);
  padding: var(--s6);
  text-align: center;
  box-shadow: var(--shadow);
}
.success .big {
  font-family: var(--display);
  font-size: clamp(1.6rem, 4vw, 2.2rem);
  font-weight: 600;
  color: #8A5A1E;
  margin-bottom: var(--s2);
}
.success p { color: #6E5736; }

/* ----------------------------------------------------------
   17. FOOTER
   ---------------------------------------------------------- */
.foot-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s4);
  flex-wrap: wrap;
  padding-bottom: var(--s5);
}
.foot-links { display: flex; gap: var(--s5); flex-wrap: wrap; }
.foot-links a { color: var(--text-2); font-size: 0.92rem; font-weight: 500; }
.foot-links a:hover { color: var(--accent); }

.disclaimer {
  font-size: 0.82rem;
  color: var(--text-3);
  line-height: 1.7;
  max-width: 82ch;
  border-top: 1px solid var(--line);
  padding-top: var(--s4);
}
.disclaimer b { color: var(--text-2); font-weight: 600; }

.copyr {
  font-family: var(--font);
  font-size: 0.78rem;
  color: var(--text-3);
  letter-spacing: 0.02em;
  margin-top: var(--s4);
}

/* ----------------------------------------------------------
   18. TOAST
   ---------------------------------------------------------- */
.toast {
  position: fixed;
  bottom: var(--s5);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  padding: 14px 22px;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-pill);
  color: var(--text);
  font-size: 0.93rem;
  font-weight: 500;
  box-shadow: var(--shadow-lift);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s var(--ease), transform 0.3s var(--ease);
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto; }
.toast::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent); flex: none;
}
.toast.toast-bad::before  { background: var(--bad); }
.toast.toast-warn::before { background: var(--warn); }

/* ----------------------------------------------------------
   19. SPINNER
   ---------------------------------------------------------- */
.spin {
  display: inline-block;
  width: 18px; height: 18px;
  border: 2px solid var(--line-strong);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: ph-spin 0.7s linear infinite;
}
.spin-lg { width: 28px; height: 28px; border-width: 3px; }
@keyframes ph-spin { to { transform: rotate(360deg); } }

/* ----------------------------------------------------------
   20. SCROLL REVEAL — gentle, calm rise
   ---------------------------------------------------------- */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
  will-change: opacity, transform;
}
.reveal.in { opacity: 1; transform: translateY(0); }

/* ----------------------------------------------------------
   21. RESPONSIVE — mobile first refinements
   ---------------------------------------------------------- */
@media (max-width: 920px) {
  .steps, .results { grid-template-columns: repeat(2, 1fr); }
  .points, .principles { grid-template-columns: repeat(2, 1fr); }
  .card.member-context { grid-template-columns: 1fr; gap: var(--s5); }
}

@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { padding-inline: var(--s4); }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .points, .principles, .steps, .results { grid-template-columns: 1fr; }
  .vs { grid-template-columns: 1fr; }
  .fg { grid-template-columns: 1fr; }
  .nav-links { display: none; }
  .nav-links.open {
    display: flex;
    position: absolute;
    top: 100%; left: 0; right: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--s3);
    padding: var(--s4) var(--s4) var(--s5);
    background: rgba(250, 246, 239, 0.96);
    backdrop-filter: saturate(140%) blur(18px);
    -webkit-backdrop-filter: saturate(140%) blur(18px);
    border-bottom: 1px solid var(--line);
  }
  .card, .card-soft { padding: var(--s4); }
  .section { padding-block: clamp(48px, 12vw, 72px); }
  .vrow { flex-direction: column; gap: var(--s1); }
  .vworth { text-align: left; }
  .value-foot { flex-direction: column; align-items: flex-start; }
  .vf-right { text-align: left; }
  .foot-top { flex-direction: column; align-items: flex-start; }
}

/* ----------------------------------------------------------
   22. MOTION PREFERENCE
   ---------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
  .status-pill .live { animation: none; }
}

/* ----------------------------------------------------------
   23. UTILITIES
   ---------------------------------------------------------- */
.hide { display: none !important; }
.flex { display: flex; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.gap-2 { gap: var(--s2); }
.gap-3 { gap: var(--s3); }
.gap-4 { gap: var(--s4); }
.mt-3 { margin-top: var(--s3); }
.mt-4 { margin-top: var(--s4); }
.mt-6 { margin-top: var(--s6); }
.full { width: 100%; }

/* ----------------------------------------------------------
   DESKTOP SCALE-UP
   The site is built mobile-first; without this a large screen
   renders a phone-width column floating in empty space. Type is
   rem/clamp-based, so raising the root size scales the whole
   system (headings, leads, cards, buttons) proportionally, and
   widening --wrap lets sections use the screen. Placed last so
   it wins the cascade.
   ---------------------------------------------------------- */
@media (min-width: 1360px) {
  html { font-size: 17.5px; }
  body { font-size: 18px; }
  :root { --wrap: 1220px; }
}
@media (min-width: 1750px) {
  html { font-size: 19px; }
  body { font-size: 19.5px; }
  :root { --wrap: 1380px; }
}


/* Project Human landing page. Scoped to preserve existing member/booking layouts. */
body.landing{--ph-paper:#f6f5f0;--ph-ink:#242821;--ph-muted:#62675f;--ph-line:#d7dbd0;--ph-green:#334d39;margin:0;background:var(--ph-paper);color:var(--ph-ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;font-size:17px;line-height:1.65;letter-spacing:-.012em;-webkit-font-smoothing:antialiased}
.landing *{box-sizing:border-box}.landing :is(h1,h2,h3,p){margin-top:0}.landing :is(h1,h2,h3){font-family:inherit;color:inherit;font-weight:500;text-wrap:balance;letter-spacing:-.055em}.landing p{color:var(--ph-muted)}.landing a{color:inherit}.landing a:focus-visible,.landing button:focus-visible,.landing summary:focus-visible{outline:3px solid #a36f2b;outline-offset:5px}.landing ::selection{background:#d7e0ca;color:#242821}.landing img{max-width:100%}.landing button{font:inherit}.landing .ph-wrap{width:min(1180px,calc(100% - 80px));margin-inline:auto}.landing .ph-skip{position:fixed;top:-100px;left:20px;z-index:200;padding:10px 20px;background:#fff;color:#222}.landing .ph-skip:focus{top:10px}.landing .ph-section{padding-top:112px;padding-bottom:112px}.landing .ph-eyebrow{margin-bottom:22px;font-size:11px;line-height:1.5;letter-spacing:.13em;text-transform:uppercase;font-weight:650;color:var(--ph-green)}
.landing .ph-nav{display:block;max-width:none;padding:0;margin:0;backdrop-filter:none;-webkit-backdrop-filter:none;position:relative;z-index:10;border-bottom:1px solid var(--ph-line);background:var(--ph-paper)}.landing .ph-nav-inner{display:flex;height:90px;align-items:center;gap:30px}.landing .ph-wordmark{display:inline-flex;align-items:center;gap:9px;font-size:19px;font-weight:600;letter-spacing:-.06em;text-decoration:none;white-space:nowrap}.landing .ph-wordmark img{width:27px;height:27px;filter:brightness(0);opacity:.85}.landing .ph-nav-links{display:flex;align-items:center;gap:27px;margin-left:auto;font-size:12px}.landing .ph-nav-links a{text-decoration:none}.landing .ph-nav-links a:hover{text-decoration:underline;text-underline-offset:5px}.landing .ph-button{display:inline-flex;min-height:54px;align-items:center;justify-content:center;gap:28px;padding:15px 25px;border:1px solid var(--ph-green);border-radius:3px;background:var(--ph-green);color:#fff;font-weight:500;font-size:14px;line-height:1.3;text-decoration:none;cursor:pointer;transition:background .15s}.landing .ph-button:hover{background:#253c2b}.landing .ph-button:disabled{cursor:default;background:#e2e6dc;border-color:#cbd2c2;color:#485142;opacity:1}.landing .ph-button-small{min-height:44px;padding:10px 16px;font-size:12px;gap:18px}
.landing .ph-hero{display:grid;grid-template-columns:1.08fr 1fr;gap:60px;align-items:center;padding-top:75px;padding-bottom:80px}.landing .ph-hero h1{font-size:clamp(50px,5.8vw,78px);line-height:1.02;margin-bottom:25px}.landing .ph-hero h1 span{color:#78866e}.landing .ph-intro{max-width:420px;font-size:18px;line-height:1.6;color:#4c5548;margin-bottom:20px}.landing .ph-hero-service{max-width:390px;font-size:14px;line-height:1.7;margin-bottom:26px}.landing .ph-hero-actions{display:flex;gap:23px;align-items:center}.landing .ph-price-inline{font-size:12px;line-height:1.45;color:#585e53}.landing .ph-price-inline strong{font-size:18px;font-weight:500;color:var(--ph-ink)}.landing .ph-price-inline small{font-size:11px;color:var(--ph-muted)}.landing .ph-opening{font-size:10px;line-height:1.7;margin-top:20px;max-width:370px;color:#6c7365}
.landing .ph-life{background:#dfe5d7;min-height:600px;position:relative;padding:29px 34px 35px;display:flex;flex-direction:column;overflow:hidden;border-radius:2px}.landing .ph-life-top{display:flex;justify-content:space-between;font-size:10px;color:#53634c;gap:15px}.landing .ph-life-title{font-size:38px;line-height:1.12;font-weight:400;letter-spacing:-.05em;margin:36px 0 32px;color:#3e5137}.landing .ph-life-title i{font-style:normal;color:#6a7e5e}.landing .ph-plan-sample{background:#fbfcf8;border:1px solid rgba(59,80,46,.12);padding:23px 25px 18px;box-shadow:0 13px 28px rgba(52,66,42,.045);margin-top:auto}.landing .ph-sample-heading{display:flex;gap:16px;justify-content:space-between;align-items:center;font-size:10px;color:#57644e;margin-bottom:20px}.landing .ph-sample-heading small{font-size:9px;color:#6d7864;white-space:nowrap}.landing .ph-plan-sample h2{font-size:25px;line-height:1.2;letter-spacing:-.045em;margin-bottom:10px}.landing .ph-plan-sample>p{font-size:11px;line-height:1.7;margin-bottom:10px}.landing .ph-plan-sample ol{padding:0;list-style:none;margin:0}.landing .ph-plan-sample li{border-bottom:1px solid #e4e7de;padding:12px 0;font-size:11px;line-height:1.5;color:#4d5946}.landing .ph-plan-sample li span{display:block;font-size:9px;color:#75816c;margin-bottom:3px}.landing .ph-reviewed{font-size:9px;line-height:1.6;color:#6b7861;margin-top:14px}.landing .ph-promise{border-top:1px solid var(--ph-line);border-bottom:1px solid var(--ph-line);padding:24px 0}.landing .ph-promise p{font-size:14px;margin:0;text-align:center;color:#7a8172}.landing .ph-promise strong{font-weight:500;color:#414b3a}
.landing .ph-section-heading{max-width:650px}.landing .ph-section-heading h2,.landing .ph-founder h2{font-size:clamp(35px,4vw,52px);line-height:1.08;margin-bottom:24px}.landing .ph-section-heading>p:not(.ph-eyebrow){font-size:16px;max-width:510px;line-height:1.7}.landing .ph-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:31px;margin-top:55px}.landing .ph-steps article{border-top:1px solid #aeb8a3;padding-top:18px}.landing .ph-steps article>span{font-size:10px;color:#7e8d70;display:block;margin-bottom:28px}.landing .ph-steps h3{font-size:20px;line-height:1.2;margin-bottom:13px;letter-spacing:-.035em}.landing .ph-steps p{font-size:14px;line-height:1.8;margin-bottom:0}.landing .ph-method{background:#e8ece2}.landing .ph-method-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:100px}.landing .ph-inputs>div{display:grid;grid-template-columns:26px 1fr;column-gap:17px;border-top:1px solid #c3ccba;padding:18px 0}.landing .ph-inputs>div:last-child{border-bottom:1px solid #c3ccba}.landing .ph-inputs span{grid-row:span 2;font-size:10px;color:#7f8b73;align-self:start;padding-top:4px}.landing .ph-inputs h3{font-size:20px;line-height:1.3;letter-spacing:-.03em;margin-bottom:4px}.landing .ph-inputs p{font-size:13px;line-height:1.6;margin:0}.landing .ph-founder{display:grid;grid-template-columns:1fr 1.06fr;gap:90px;align-items:center}.landing .ph-founder-media{display:flex;flex-direction:column;justify-content:space-between;min-height:530px;padding:36px;background:#d4dacb;color:#384b31}.landing .ph-founder-media>div>p{font-size:42px;letter-spacing:-.06em;line-height:1.1;color:#3c4f35;margin-bottom:8px}.landing .ph-founder-media>div>span:last-child{font-size:13px}.landing .ph-media-note{font-size:11px;line-height:1.8;margin-bottom:0;color:#59694f}.landing .ph-founder-copy>p:not(.ph-eyebrow){font-size:15px;line-height:1.85}.landing .ph-signature{display:flex;flex-direction:column;margin-top:32px}.landing .ph-signature strong{color:#35432e;font-size:16px;font-weight:500}.landing .ph-signature span{font-size:11px}.landing p.ph-scope{font-size:11px!important;border-top:1px solid var(--ph-line);padding-top:20px;margin-top:25px}
.landing .ph-demo{background:#222d23;color:#f3f3e9}.landing .ph-demo .ph-eyebrow{color:#b3c3a5}.landing .ph-demo .ph-section-heading>p:not(.ph-eyebrow){color:#bfc8b8}.landing .ph-demo-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:95px;align-items:center;margin-top:44px}.landing .ph-chat{background:#f5f6ef;border-radius:5px;padding:27px;color:#2e3d26}.landing .ph-demo-label{display:flex;gap:16px;justify-content:space-between;padding-bottom:22px;border-bottom:1px solid #dce2d3;font-size:10px;color:#657559}.landing .ph-demo-label span:last-child{font-size:9px;white-space:nowrap}.landing .ph-chat-member{background:#e3e9dc;color:#3c4e32;border-radius:12px 12px 2px 12px;margin:23px 0 23px 40px;padding:15px 17px;font-size:13px;line-height:1.6}.landing .ph-chat-coach>span{font-size:9px;color:#728265;display:block;margin-bottom:12px}.landing .ph-chat-coach>p{color:#4e5d43;font-size:13px;line-height:1.85}.landing .ph-chat-foot{padding-top:16px;border-top:1px solid #dce2d3;display:flex;gap:15px;justify-content:space-between;font-size:9px;color:#738369}.landing .ph-chat-foot span{color:#3f5635}.landing .ph-evolution h3{font-size:30px;line-height:1.15;margin-bottom:24px}.landing .ph-evolution ol{padding-left:18px;margin-bottom:25px}.landing .ph-evolution li{color:#bfc8b8;font-size:13px;line-height:1.8;padding-left:7px;margin-bottom:12px}.landing .ph-evolution>p:last-child{font-size:11px;color:#bdc8b6}
.landing .ph-pricing{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.landing .ph-pricing .ph-section-heading{padding-top:30px}.landing .ph-price-card{background:#fff;border:1px solid #d3d9cb;border-radius:3px;padding:36px 38px}.landing .ph-price-card h3{font-size:52px;line-height:1.15;margin-bottom:6px;letter-spacing:-.065em}.landing .ph-price-card h3 small{font-size:14px;color:#77826d;margin-left:8px;letter-spacing:-.01em}.landing .ph-price-card>p{font-size:12px}.landing .ph-price-card ul{list-style:none;padding:20px 0;margin:18px 0 20px;border-block:1px solid #e5e9df}.landing .ph-price-card li{font-size:14px;line-height:1.7;padding:6px 0;color:#536047}.landing .ph-price-card li:before{content:'+';margin-right:12px;color:#8b9b7d}.landing .ph-price-card .ph-button{width:100%;font-size:13px}.landing p.ph-checkout-status{font-size:10px;margin:12px 0 0;line-height:1.7;color:#68775b}.landing p.ph-error{color:#9d3426}.landing p.ph-refund{border-top:1px solid #e5e9df;padding-top:18px;margin-top:22px;font-size:10px;line-height:1.8;color:#78826f}.landing .ph-faq{border-top:1px solid var(--ph-line)}.landing .ph-faq-layout{display:grid;grid-template-columns:.8fr 1fr;gap:100px}.landing .ph-faq details{background:transparent;border:0;border-bottom:1px solid var(--ph-line);border-radius:0;margin:0;padding:0;box-shadow:none}.landing .ph-faq details:first-child{border-top:1px solid var(--ph-line)}.landing .ph-faq summary{position:relative;cursor:pointer;font-size:15px;line-height:1.6;list-style:none;padding:20px 30px 20px 0;color:#38482f;font-weight:400}.landing .ph-faq summary::-webkit-details-marker{display:none}.landing .ph-faq summary:after{content:'+';position:absolute;right:0;font-size:18px;top:17px;color:#7a8b6c}.landing .ph-faq details[open] summary:after{content:'−'}.landing .ph-faq details p{font-size:13px;line-height:1.9;max-width:95%;padding-bottom:16px;margin-bottom:0}.landing .ph-footer{padding:45px 0 25px;background:#e8ece2;border-top:1px solid #d1d9c9}.landing .ph-footer-top{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:35px}.landing .ph-footer-top p{font-size:12px;margin:0}.landing .ph-footer-links{display:flex;flex-wrap:wrap;gap:17px 25px;font-size:10px;margin-bottom:35px}.landing .ph-footer-links a{text-decoration:none}.landing .ph-footer-links a:hover{text-decoration:underline}.landing .ph-footer-bottom{border-top:1px solid #cbd5c1;padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:9px;color:#77836b}.landing .ph-cancel-note{background:#e5eadc;padding:16px;text-align:center;font-size:13px}.landing .ph-cancel-note button{background:none;border:0;text-decoration:underline;cursor:pointer;color:inherit}
@media(min-width:1450px){.landing .ph-wrap{width:min(1250px,calc(100% - 100px))}.landing .ph-hero{gap:85px}.landing .ph-life{min-height:640px}.landing .ph-life-title{font-size:44px}}
@media(max-width:1000px){.landing .ph-wrap{width:calc(100% - 56px)}.landing .ph-nav-links{gap:17px}.landing .ph-nav-inner{gap:22px}.landing .ph-hero{gap:35px;padding-top:55px}.landing .ph-hero h1{font-size:58px}.landing .ph-life{padding:24px;min-height:590px}.landing .ph-life-title{font-size:34px;margin-top:30px}.landing .ph-plan-sample{padding:20px}.landing .ph-section{padding-top:85px;padding-bottom:85px}.landing .ph-founder,.landing .ph-method-layout,.landing .ph-demo-layout,.landing .ph-pricing,.landing .ph-faq-layout{gap:45px}.landing .ph-founder-media{min-height:500px}.landing .ph-steps{gap:22px}.landing .ph-steps h3{font-size:18px}.landing .ph-price-card{padding:30px}}
@media(max-width:760px){.landing .ph-wrap{width:calc(100% - 40px)}.landing .ph-nav-inner{height:72px;gap:14px;justify-content:space-between}.landing .ph-nav-links{display:flex;gap:0;margin-left:auto;font-size:11px}.landing .ph-nav-links a:not(:last-child),.landing .ph-nav .ph-wide,.landing .ph-nav .ph-wordmark img{display:none}.landing .ph-member-link{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;white-space:nowrap}.landing .ph-wordmark{font-size:18px}.landing .ph-nav .ph-button{font-size:10px;gap:14px;min-height:44px;padding:10px 12px}.landing .ph-hero{grid-template-columns:1fr;padding-top:45px;padding-bottom:40px;gap:36px}.landing .ph-hero h1{font-size:clamp(50px,10.5vw,70px);line-height:1.03;margin-bottom:24px}.landing .ph-hero .ph-eyebrow{margin-bottom:24px}.landing .ph-intro{font-size:16px;max-width:420px}.landing .ph-hero-service{font-size:13px;max-width:390px}.landing .ph-hero-actions{gap:22px}.landing .ph-opening{font-size:10px;margin-top:20px;margin-bottom:0}.landing .ph-life{min-height:0;padding:25px 25px 28px}.landing .ph-life-title{font-size:34px;margin:28px 0 25px}.landing .ph-plan-sample{padding:21px 22px}.landing .ph-plan-sample h2{font-size:25px}.landing .ph-plan-sample>p{font-size:12px}.landing .ph-plan-sample li{font-size:12px}.landing .ph-plan-sample li span{font-size:10px}.landing .ph-promise{padding:22px 0}.landing .ph-promise p{max-width:340px;font-size:12px;line-height:1.9;margin:auto}.landing .ph-section{padding-top:65px;padding-bottom:65px}.landing .ph-section-heading h2,.landing .ph-founder h2{font-size:38px}.landing .ph-section-heading>p:not(.ph-eyebrow){font-size:14px}.landing .ph-eyebrow{font-size:10px;margin-bottom:20px}.landing .ph-steps{grid-template-columns:1fr 1fr;gap:32px 23px;margin-top:36px}.landing .ph-steps article>span{margin-bottom:18px}.landing .ph-steps h3{font-size:20px}.landing .ph-steps p{font-size:12px}.landing .ph-method-layout,.landing .ph-founder,.landing .ph-demo-layout,.landing .ph-pricing,.landing .ph-faq-layout{grid-template-columns:1fr;gap:32px}.landing .ph-method .ph-section-heading{max-width:480px}.landing .ph-inputs h3{font-size:19px}.landing .ph-inputs p{font-size:12px}.landing .ph-founder-media{min-height:360px;padding:30px}.landing .ph-founder-media>div>p{font-size:39px}.landing .ph-founder-copy>p:not(.ph-eyebrow){font-size:14px}.landing .ph-founder-copy .ph-eyebrow{margin-top:8px}.landing .ph-demo-layout{margin-top:32px;gap:36px}.landing .ph-chat{padding:22px}.landing .ph-chat-member{font-size:13px;margin-left:24px}.landing .ph-chat-coach>p{font-size:13px}.landing .ph-chat-foot{font-size:9px}.landing .ph-evolution h3{font-size:28px}.landing .ph-pricing .ph-section-heading{padding-top:0}.landing .ph-price-card{padding:30px 27px}.landing .ph-price-card h3{font-size:51px}.landing .ph-price-card li{font-size:12px}.landing .ph-faq-layout{gap:15px}.landing .ph-faq details p{font-size:12px}.landing .ph-faq summary{font-size:13px}.landing .ph-footer{padding-top:32px}.landing .ph-footer-top{display:block;margin-bottom:26px}.landing .ph-footer-top p{margin-top:8px;font-size:11px}.landing .ph-footer-links{display:grid;grid-template-columns:1fr 1fr;font-size:10px;gap:15px;margin-bottom:25px}.landing .ph-footer-bottom{display:block;line-height:1.8}.landing .ph-footer-bottom>span{display:block}}
@media(max-width:360px){.landing .ph-wrap{width:calc(100% - 32px)}.landing .ph-nav-inner{gap:10px}.landing .ph-nav .ph-wordmark{font-size:16px}.landing .ph-nav .ph-button{gap:10px;padding-inline:10px}.landing .ph-nav .ph-wordmark img{display:none}.landing .ph-hero h1{font-size:47px}.landing .ph-button{padding-inline:20px;gap:20px}.landing .ph-life{padding:21px 18px}.landing .ph-plan-sample{padding:18px}.landing .ph-sample-heading{gap:8px}.landing .ph-steps{gap:25px 19px}.landing .ph-steps h3{font-size:18px}.landing .ph-chat{padding:18px}.landing .ph-demo-label{gap:10px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.landing *{scroll-behavior:auto!important;transition:none!important}}

/* Founder-led offer and pre-launch interest. Scoped to this existing landing page. */
.landing .ph-perspective{display:grid;grid-template-columns:1fr 1fr;gap:85px;border-bottom:1px solid var(--ph-line)}
.landing .ph-perspective-copy{padding-top:38px;max-width:475px}
.landing .ph-perspective-copy>p{font-size:16px;line-height:1.8;margin-bottom:18px}
.landing .ph-perspective-copy .ph-principle{margin-top:26px;margin-bottom:0;font-size:22px;line-height:1.5;letter-spacing:-.04em}
.landing .ph-principle strong{font-weight:500;color:var(--ph-green)}
.landing .ph-founder{align-items:start}
.landing .ph-founder-media{min-height:610px;justify-content:space-between;background:#dfe5d7}
.landing .ph-founder-media blockquote{margin:60px 0 65px;padding:0;border:0;font-size:clamp(25px,2.6vw,36px);font-weight:400;line-height:1.4;letter-spacing:-.035em;color:#3f5138;max-width:380px}
.landing .ph-founder-more{border:0;border-top:1px solid var(--ph-line);border-bottom:1px solid var(--ph-line);background:transparent;border-radius:0;box-shadow:none;padding:0;margin:25px 0}
.landing .ph-founder-more summary{cursor:pointer;padding:17px 25px 17px 0;font-size:14px;list-style:none;position:relative;color:var(--ph-green)}
.landing .ph-founder-more summary::-webkit-details-marker{display:none}
.landing .ph-founder-more summary:after{content:'+';position:absolute;right:2px;top:15px;font-size:20px}
.landing .ph-founder-more[open] summary:after{content:'−'}
.landing .ph-founder-more>div{padding-top:4px;padding-bottom:5px}
.landing .ph-founder-more p{font-size:14px;line-height:1.9;margin-bottom:18px}
.landing .ph-demo-choices{display:flex;gap:7px;flex-wrap:wrap;margin:22px 0 25px}
.landing .ph-demo-choices button{font:inherit;font-size:11px;border:1px solid #d2dac9;border-radius:3px;background:transparent;color:#4b5841;padding:9px 10px;min-height:40px;cursor:pointer}
.landing .ph-demo-choices button[aria-pressed=true]{background:#dfe6d7;border-color:#9caa8e;color:#293b26}
.landing .ph-evolution .ph-ai-note{font-size:11px;line-height:1.8;margin-top:22px;max-width:390px}
.landing .ph-interest-link{display:inline-block;font-size:12px;color:var(--ph-green);text-underline-offset:4px;margin:0 0 22px}
.landing .ph-interest{background:#e8ece2;border-top:1px solid #d1d9c9;border-bottom:1px solid #d1d9c9}
.landing .ph-interest-layout{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}
.landing .ph-interest .ph-section-heading>p:not(.ph-eyebrow){font-size:14px;max-width:435px}
.landing #interestForm{position:relative;padding-top:12px;max-width:510px}
.landing .ph-interest-fields{display:grid;grid-template-columns:1fr;gap:17px;margin-bottom:22px}
.landing .ph-interest-fields label{display:block;font-size:12px;font-weight:500;letter-spacing:0;color:#3f4d38;margin:0}
.landing .ph-interest-fields input{display:block;width:100%;min-height:52px;margin-top:7px;border:1px solid #a8b49f;border-radius:3px;background:#f8faf4;padding:12px 14px;font:inherit;font-size:16px;color:#242821;box-shadow:none}
.landing .ph-interest-fields input:focus-visible,.landing #interestAck:focus-visible{outline:3px solid #a36f2b;outline-offset:3px}
.landing .ph-interest-consent{display:flex;align-items:flex-start;gap:12px;font-size:12px;line-height:1.8;color:#44513c;font-weight:400;letter-spacing:0;cursor:pointer}
.landing .ph-interest-consent input{width:18px;height:18px;min-width:18px;margin:3px 0 0;accent-color:#334d39;cursor:pointer}
.landing .ph-interest-privacy{font-size:11px;line-height:1.8;margin:14px 0 23px;color:#53614b}
.landing .ph-interest-privacy a{text-underline-offset:3px}
.landing .ph-interest-status{min-height:24px;font-size:12px;line-height:1.8;margin:15px 0 0;color:#334d39;max-width:440px}
.landing .ph-interest-status[role=alert]{color:#8a3b29}
.landing .ph-contact-intro{font-size:16px;line-height:1.8;max-width:440px;margin:12px 0 26px}
.landing #interestForm[hidden],.landing #interestContact[hidden]{display:none!important}
.landing .ph-honeypot{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
@media(max-width:1000px){.landing .ph-perspective,.landing .ph-interest-layout{gap:45px}.landing .ph-founder-media{min-height:570px}}
@media(max-width:760px){.landing .ph-perspective,.landing .ph-interest-layout{grid-template-columns:1fr;gap:20px}.landing .ph-perspective-copy{padding-top:0}.landing .ph-perspective-copy>p{font-size:14px}.landing .ph-perspective-copy .ph-principle{font-size:22px}.landing .ph-founder-media{min-height:380px}.landing .ph-founder-media blockquote{font-size:27px;margin:35px 0 40px;max-width:320px}.landing .ph-founder-more p{font-size:14px}.landing .ph-demo-choices button{min-height:44px;font-size:10px;padding:9px}.landing .ph-interest-layout{gap:22px}.landing #interestForm{padding-top:0;max-width:none}.landing .ph-interest-consent{font-size:12px}.landing #interestBtn{width:100%}.landing .ph-hero-actions{gap:16px}.landing .ph-hero-actions .ph-button{font-size:12px;padding-inline:17px;gap:16px}}

.landing .ph-founder-media .ph-credentials{font-size:12px;line-height:1.8;letter-spacing:0;font-weight:400;margin:15px 0 0;max-width:330px;color:#44533b}