/* Jessica Endicott, Integrative NeuroWellness
   Palette, type and layout carried from mock/home-reflow.html.
   Contrast decisions settled by JP 2026-07-29:
     filled gold buttons keep #c8974b with #213038 text (5.17:1)
     gold text on white becomes #996f2d (4.50:1)
     decorative gold unchanged */

:root{
  --teal:#1c6b73;
  --teal-deep:#134a50;
  --gold:#c8974b;
  --gold-text:#996f2d;   /* AA-safe gold for text on light backgrounds */
  --gold-soft:#e0b877;
  --cream:#f5efe4;
  --ink:#213038;
  --muted:#5c6b6f;
  --line:#e6ddce;
  --shell:#1a2230;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* the header is sticky at 72px, so an anchor jump would land under it */
[id]{scroll-margin-top:92px}
body{
  margin:0;
  font-family:Manrope,system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.serif{
  font-family:"Playfair Display",Georgia,serif;
  font-weight:600;
  line-height:1.14;
  letter-spacing:.2px;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}

.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.narrow{max-width:820px}

.skip{
  position:absolute;left:-9999px;top:0;background:var(--teal-deep);color:#fff;
  padding:12px 18px;z-index:100;border-radius:0 0 8px 0;
}
.skip:focus{left:0}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;background:var(--gold);color:var(--ink);font-weight:700;
  padding:15px 30px;border-radius:999px;font-size:1.02rem;letter-spacing:.2px;
  box-shadow:0 8px 22px rgba(200,151,75,.32);
  transition:transform .12s ease,box-shadow .12s ease;
  border:2px solid transparent;cursor:pointer;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(200,151,75,.38)}
.btn:focus-visible{outline:3px solid var(--teal-deep);outline-offset:3px}
.btn-ghost{
  background:transparent;color:var(--teal-deep);border:2px solid var(--teal);
  box-shadow:none;
}
.btn-ghost:hover{background:rgba(28,107,115,.07);box-shadow:none}
.btn-light{background:#fff;color:var(--teal-deep);box-shadow:0 8px 22px rgba(0,0,0,.16)}

.eyebrow{
  display:block;font-size:.78rem;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-text);
}
.eyebrow-light{color:var(--gold-soft)}

/* ---------- header ---------- */
header{
  position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:72px;gap:16px}
.brand img{height:44px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links ul{
  display:flex;gap:26px;list-style:none;margin:0;padding:0;
  font-weight:600;font-size:.95rem;
}
.nav-links ul li{white-space:nowrap}
.nav-links ul a{padding:6px 2px;border-bottom:2px solid transparent}
.nav-links ul a:hover,.nav-links ul a:focus-visible{border-bottom-color:var(--gold)}
.nav-links ul a[aria-current="page"]{border-bottom-color:var(--teal)}
.nav .btn{padding:11px 22px;font-size:.9rem}
.hamburger{
  display:none;background:none;border:0;color:var(--teal-deep);cursor:pointer;
  padding:6px;line-height:0;
}
#mobile-nav{display:none;border-top:1px solid var(--line);background:#fff}
#mobile-nav.open{display:block}
#mobile-nav ul{list-style:none;margin:0;padding:10px 0}
#mobile-nav a{display:block;padding:13px 28px;font-weight:600}
#mobile-nav .btn{margin:10px 28px 20px}

@media(max-width:1000px){
  .nav-links ul,.nav-links .btn{display:none}
  .hamburger{display:block}
  .brand img{height:34px}
}

/* ---------- hero ---------- */
.hero{
  background:
    radial-gradient(1200px 500px at 88% -10%, #eaf1f0 0, transparent 60%),
    linear-gradient(180deg,#fbf8f2 0,#fff 70%);
  padding:64px 0 40px;
}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.hero h1{font-size:3.15rem;margin:.35em 0 .28em;color:var(--ink)}
.hero p.lead{font-size:1.22rem;color:var(--muted);max-width:34ch;margin:0 0 28px}
.hero-cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.hero-cta .sub{font-weight:600;color:var(--teal-deep);border-bottom:1px solid transparent}
.hero-cta .sub:hover{border-bottom-color:var(--teal-deep)}
/* Her source portraits are ~2:3. At full column width the photo alone is ~745px
   tall, which drives the whole hero row and pushes the text column down the page.
   Cap the container instead of the image so the blob stays registered to it, and
   never touch the image's own ratio. */
.photo{position:relative;width:100%;max-width:420px;margin-left:auto}
.photo .blob{
  position:absolute;inset:14px -14px -18px 26px;border-radius:26px;
  background:linear-gradient(160deg,var(--teal) 0,var(--teal-deep) 100%);opacity:.14;
}
.photo img{
  position:relative;width:100%;height:auto;border-radius:22px;display:block;
  box-shadow:0 26px 60px rgba(19,74,80,.22);
}
.hero-sub{background:linear-gradient(180deg,#fff 0,#fbf8f2 100%);padding:0 0 54px}
.hero-sub p{font-size:1.12rem;color:var(--muted);max-width:60ch;margin:0 auto;text-align:center}

@media(max-width:820px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero h1{font-size:2.25rem}
  .hero{padding:40px 0 24px}
  .hero p.lead{max-width:none}
}

/* ---------- sections ---------- */
section{padding:66px 0}
.section-head{max-width:46ch;margin:0 auto 42px;text-align:center}
.section-head h2{font-size:2.15rem;margin:.1em 0 .3em}
.section-head p{color:var(--muted);font-size:1.05rem;margin:0}
.lotus-mark{display:block;margin:0 auto 14px;height:52px;width:auto}
.page-head{background:linear-gradient(180deg,#fbf8f2 0,#fff 100%);padding:58px 0 44px}
.page-head h1{font-size:2.7rem;margin:.25em 0 .2em;max-width:22ch}
.page-head p{color:var(--muted);font-size:1.12rem;max-width:60ch;margin:0}
@media(max-width:820px){
  section{padding:48px 0}
  .section-head h2{font-size:1.8rem}
  .page-head h1{font-size:2rem}
}

/* ---------- teal panel ---------- */
.panel-teal{
  background-image:linear-gradient(160deg,var(--teal) 0,var(--teal-deep) 100%);
  color:#e4efee;
}
.panel-teal h2,.panel-teal h3{color:#fff}
.signals{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;
  margin:0;padding:0;
}
.signals li{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:16px;padding:22px 24px;font-size:1rem;color:#dcebea;
}
.reassure{
  text-align:center;margin:38px 0 0;font-family:"Playfair Display",Georgia,serif;
  font-size:1.5rem;color:#fff;
}
@media(max-width:900px){.signals{grid-template-columns:1fr}}

/* ---------- story ---------- */
.story{background:#faf6ee}
.story blockquote{
  margin:0;font-family:"Playfair Display",Georgia,serif;font-size:1.35rem;
  line-height:1.5;color:var(--teal-deep);
}
.story p{color:var(--muted);font-size:1.06rem}
.story .more{
  display:inline-block;margin-top:10px;font-weight:700;color:var(--teal-deep);
  border-bottom:2px solid var(--gold);padding-bottom:2px;
}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.step{
  border:1px solid var(--line);border-radius:20px;padding:34px 32px;
  background:#fdfbf6;display:flex;flex-direction:column;
}
.step .tag{
  font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-text);
}
.step h3{font-size:1.7rem;margin:.25em 0 .12em;color:var(--ink)}
.step .price{color:var(--teal-deep);font-weight:700;margin:0 0 14px}
.step p{color:var(--muted);margin:0 0 22px}
.step .btn{align-self:flex-start;margin-top:auto}
@media(max-width:820px){.steps{grid-template-columns:1fr}}

/* ---------- chips ---------- */
.chips{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:820px;margin:0 auto;
  list-style:none;padding:0;
}
.chip{
  background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 18px;
  font-weight:600;font-size:.92rem;color:var(--ink);
}
.chip::before{content:"\2713";color:var(--gold-text);font-weight:800;margin-right:8px}
.panel-cream{background:#faf6ee}

/* qualification lines: authored mixed case, uppercased by CSS only */
.fit-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;list-style:none;margin:0;padding:0;
}
.fit-list li{
  border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px 20px;
  text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:.86rem;
  color:var(--ink);line-height:1.45;
}
@media(max-width:900px){.fit-list{grid-template-columns:1fr}}

/* ---------- testimonials ---------- */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tcard{
  border:1px solid var(--line);border-radius:18px;padding:26px 26px 24px;background:#fff;
  display:flex;flex-direction:column;
}
.stars{color:var(--gold);letter-spacing:3px;font-size:1rem;margin-bottom:12px}
.tcard p{margin:0 0 16px;color:var(--muted);font-size:.99rem}
.tcard .who{margin-top:auto;font-weight:700;color:var(--ink);font-size:.95rem}
@media(max-width:960px){.tgrid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.tgrid{grid-template-columns:1fr}}

.pullquote{max-width:820px;margin:0 auto;text-align:center}
.pullquote blockquote{
  font-family:"Playfair Display",Georgia,serif;font-size:1.85rem;line-height:1.36;
  color:var(--teal-deep);margin:0 0 18px;
}
.pullquote .cite{color:var(--muted);font-weight:700;letter-spacing:.04em}
@media(max-width:820px){.pullquote blockquote{font-size:1.4rem}}

/* ---------- approach / numbered ---------- */
.approach{display:grid;gap:20px}
.approach-item{
  display:grid;grid-template-columns:64px 1fr;gap:22px;align-items:start;
  border:1px solid var(--line);border-radius:18px;padding:26px 28px;background:#fdfbf6;
}
.approach-item .num{
  font-family:"Playfair Display",Georgia,serif;font-size:2rem;color:var(--gold-text);
  line-height:1;
}
.approach-item h3{font-size:1.28rem;margin:0 0 .35em}
.approach-item p{margin:0;color:var(--muted)}
@media(max-width:680px){
  .approach-item{grid-template-columns:1fr;gap:8px}
}

/* ---------- beliefs ---------- */
.beliefs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.belief{border-left:3px solid var(--gold);padding:6px 0 6px 22px}
.belief h3{font-size:1.2rem;margin:0 0 .4em}
.belief p{margin:0;color:var(--muted);font-size:.99rem}
@media(max-width:900px){.beliefs{grid-template-columns:1fr}}

/* ---------- timeline ---------- */
.timeline{max-width:820px;margin:0 auto;display:grid;gap:18px}
.tl-item{border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.tl-item summary{
  cursor:pointer;padding:22px 26px;list-style:none;display:flex;gap:18px;
  align-items:baseline;font-weight:600;
}
.tl-item summary::-webkit-details-marker{display:none}
.tl-item summary::after{
  content:"+";margin-left:auto;color:var(--gold-text);font-size:1.4rem;line-height:1;
  font-weight:700;
}
.tl-item[open] summary::after{content:"\2212"}
.tl-item summary:hover{background:#fdfbf6}
.tl-item summary:focus-visible{outline:3px solid var(--teal);outline-offset:-3px}
.tl-year{
  font-family:"Playfair Display",Georgia,serif;color:var(--teal-deep);font-size:1.15rem;
  white-space:nowrap;
}
.tl-lede{color:var(--muted);font-weight:500}
.tl-body{padding:0 26px 24px;color:var(--muted)}
.tl-body p{margin:0 0 1em}
.tl-body p:last-child{margin-bottom:0}
@media(max-width:680px){
  .tl-item summary{flex-direction:column;gap:6px;position:relative;padding-right:52px}
  .tl-item summary::after{position:absolute;right:24px;top:20px;margin:0}
}

/* ---------- prose (legal + long copy) ---------- */
.prose{max-width:820px;margin:0 auto;color:#33424a}
.prose h2{font-size:1.35rem;margin:2.2em 0 .5em;color:var(--ink)}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.08rem;margin:1.6em 0 .4em}
.prose p{margin:0 0 1.05em}
.prose ul{margin:0 0 1.2em;padding-left:1.3em}
.prose li{margin:0 0 .45em}
.prose .updated{color:var(--muted);font-size:.94rem;margin-bottom:2em}
.prose strong{color:var(--ink)}

/* ---------- form ---------- */
.formcard{
  max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:14px 14px 6px;box-shadow:0 18px 44px rgba(19,74,80,.08);
}
.formcard iframe{width:100%;border:none;display:block;min-height:640px}
.formnote{
  max-width:760px;margin:16px auto 0;color:var(--muted);font-size:.9rem;text-align:center;
}

/* ---------- final cta ---------- */
.final{
  background:linear-gradient(120deg,var(--teal-deep) 0,var(--teal) 55%,var(--gold) 135%);
  color:#fff;text-align:center;
}
.final h2{color:#fff;font-size:2.4rem;margin:0 0 12px}
.final p{color:#e8f2f0;margin:0 0 28px;font-size:1.1rem}
@media(max-width:820px){.final h2{font-size:1.8rem}}

/* ---------- connect ---------- */
.connect{background:#faf6ee;text-align:center}
.connect a.mail{font-weight:700;color:var(--teal-deep);border-bottom:2px solid var(--gold)}
.connect .where{color:var(--muted);margin:.6em 0 0}
.social{display:flex;gap:18px;justify-content:center;margin-top:24px}
.social a{
  width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--teal-deep);
}
.social a:hover{background:var(--teal-deep);color:#fff;border-color:var(--teal-deep)}
.social svg{width:20px;height:20px;fill:currentColor}

/* ---------- footer ---------- */
footer{background:var(--shell);color:#c3ccd6;font-size:.9rem;padding:44px 0 30px}
footer .cols{
  display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:22px;
}
footer a{color:#e7d9bd}
footer a:hover{text-decoration:underline}
footer .fnav{display:flex;gap:18px;flex-wrap:wrap}
footer img{height:34px;width:auto;filter:brightness(1.6)}
.disc{
  color:#8b96a3;font-size:.8rem;line-height:1.55;border-top:1px solid #2b3547;
  padding-top:18px;margin:0;
}
.disc + .disc{border-top:0;padding-top:10px}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}
