/* ═══════════════════════════════════════════════════════════
   WISER MINDS — "EVERGREEN REFINED" OVERLAY (v2)
   Loaded AFTER main.css. Refines the existing design toward
   BetterHelp / Two Chairs / Zocdoc / MyCareSpace patterns:
   more breathing room, badge-pill trust signals, editorial
   headings with hand-drawn accents, softer premium shadows,
   clearer wayfinding. v2 adds: strong contrast fixes (darker
   text vars, larger small type), restructured service cards
   (white body + coloured accent bar replaces low-contrast
   pastel wash), and bolder section presentation.
   No copy or imagery changes.
═══════════════════════════════════════════════════════════ */

:root{
  --canvas:#FBF8F2;
  --shadow-soft:0 18px 44px -18px rgba(20,52,43,.14);
  --shadow-card:0 8px 28px -10px rgba(20,52,43,.1);
  --shadow-lift:0 22px 48px -16px rgba(20,52,43,.18);
  /* CONTRAST FIX: deepen secondary text colours site-wide.
     main.css: --soft #4F5D56 / --muted #6B7A70 were too light
     on tinted backgrounds. */
  --soft:#3D4B44;
  --muted:#54655B;
}

/* ── Global rhythm: slightly larger, airier body ── */
body{font-size:16.5px;line-height:1.75}
.sec{padding:5.25rem 0}
@media(max-width:680px){.sec{padding:3.5rem 0}}
.wrap{max-width:1040px}

/* ── Headings: Two Chairs editorial confidence ── */
h1{line-height:1.12;letter-spacing:-.02em}
h2{font-size:clamp(1.65rem,3.1vw,2.2rem);line-height:1.2}
.lead{font-size:1.08rem;line-height:1.85}

/* Hand-drawn underline accent for hero + key em words */
.hero h1{position:relative}
h1 em,h2 em{position:relative;white-space:nowrap}
h1 em::after,h2 em::after{content:'';position:absolute;left:-.02em;right:-.02em;bottom:-.12em;height:.34em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 9 C 25 3, 60 2, 118 6' fill='none' stroke='%232E7D4F' stroke-width='2.6' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") no-repeat center/100% 100%;pointer-events:none}

/* Eyebrow labels: leaf glyph for warmth */
.lbl{gap:.45rem;letter-spacing:.14em;padding:.52rem 1rem}
.lbl::before{content:'✳';font-size:.7rem;color:var(--green);line-height:1}

/* ── Nav: cleaner, always-legible, premium bar ── */
#nav{height:76px;background:rgba(251,248,242,.9);backdrop-filter:blur(12px)}
#nav.scrolled{box-shadow:0 1px 0 var(--border),0 8px 30px -18px rgba(20,52,43,.18)}
.nav-links{gap:2rem}
.nav-links a{font-size:.94rem}
.nav-links a.on{position:relative}
.nav-links a.on:not(.nav-cta)::after{content:'';position:absolute;left:0;right:0;bottom:-8px;height:2.5px;border-radius:99px;background:var(--green)}
.nav-cta{box-shadow:0 6px 18px rgba(46,125,79,.25)}
.page{padding-top:79px}

/* ── Buttons: crisper press feedback ── */
.btn{transition:transform .16s var(--ease),box-shadow .2s var(--ease),opacity .18s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:scale(.97)}
.btn-g{box-shadow:0 10px 26px -8px rgba(46,125,79,.45)}
.btn-g:hover{box-shadow:0 14px 30px -8px rgba(46,125,79,.5);opacity:1}

/* ── Hero: airier, illustration gently framed ── */
.hero.hero-art{padding:4.25rem 0 4rem}
.hero-eye{background:var(--white);border:1px solid var(--border);box-shadow:0 4px 14px -8px rgba(20,52,43,.12)}
.hero-eye::before{content:'●';font-size:.5rem;color:var(--green)}
.hero-sub{font-size:1.08rem}
.hero-micro{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;align-items:center}
.hero-illus::before{background:#DEEBD8}

/* ── Trust band → Zocdoc badge pills on deep evergreen ── */
.trust-band{position:relative}
.trust-band-inner{padding-top:2rem;padding-bottom:2rem;gap:1rem}
.trust-cell{background:rgba(255,253,249,.07);border:1px solid rgba(255,253,249,.14);border-radius:18px;padding:.85rem 1rem;transition:background .2s,border-color .2s}
.trust-cell:hover{background:rgba(255,253,249,.12);border-color:rgba(255,253,249,.28)}
.trust-ico{background:var(--green-soft);color:var(--teal);width:26px;height:26px;font-size:.78rem}

/* ── Quiz block: premium card, clearer affordance ── */
.quiz-green-inner{border-radius:36px;padding:3rem;box-shadow:var(--shadow-soft)}
.quiz-green-card{border-radius:26px;padding:2rem;box-shadow:0 18px 44px -14px rgba(20,52,43,.16)}
.hq-opt{padding:1rem 1.4rem;font-size:.94rem;display:flex;align-items:center;justify-content:space-between;background:var(--white)}
.hq-opt::after{content:'→';color:var(--green);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s}
.hq-opt:hover::after,.hq-opt.selected::after{opacity:1;transform:none}
.hq-opt:hover{border-color:var(--green);box-shadow:0 6px 16px -8px rgba(46,125,79,.3)}

/* ── Bridges: quieter, with more room ── */
.bridge{padding:3rem 2rem}
.bridge-txt{font-size:1.35rem}

/* ── Flow steps: MyCareSpace dotted connector ── */
.flow-track::before{background:none;border-top:2px dashed var(--green-soft);height:0;opacity:.8}
.flow-badge{box-shadow:0 0 0 7px var(--illus-cream),0 8px 18px -6px rgba(46,125,79,.4)}
.flow-node h3{font-size:1.14rem;margin-top:.15rem}
.flow-node p{font-size:.9rem;line-height:1.7}

/* ── Vignette cards: lifted, staggered, premium ── */
.vignette{border-radius:26px;box-shadow:var(--shadow-card);border-color:transparent;background:var(--white)}
.vignette:hover{box-shadow:var(--shadow-lift);transform:translateY(-4px)}
.vignette-pad{padding:1.7rem 1.8rem 1.85rem}
.vignette-cat{display:inline-flex;align-items:center;gap:.4rem;background:var(--teal-faint);color:var(--teal);padding:.32rem .75rem;border-radius:999px;margin-bottom:.9rem}
.vignette-body{font-size:1.05rem;line-height:1.6}

/* ── Recognition list → two-column chip-card grid (Zocdoc "common reasons") ── */
.svc-fit-list{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;max-width:none!important}
.svc-fit-list li{background:var(--white);border:1px solid var(--border)!important;border-radius:18px;padding:1rem 1.15rem 1rem 2.9rem;line-height:1.65;transition:border-color .2s,box-shadow .2s,transform .2s}
.svc-fit-list li:hover{border-color:var(--green-soft)!important;box-shadow:0 8px 22px -10px rgba(46,125,79,.25);transform:translateY(-2px)}
.svc-fit-list li::before{left:1rem;top:1.05rem}
@media(max-width:720px){.svc-fit-list{grid-template-columns:1fr}}

/* ── Services grid: bigger radius, arrow slide, tag polish ── */
/* v2 REDESIGN: the pastel-wash cards (#EAF2E6 / #F4ECDD) made
   text hard to read. Cards are now crisp white with a coloured
   top accent bar (mint/sand rotation preserved as the accent,
   so the colour identity stays without sacrificing legibility). */
.services-grid{gap:1.5rem}
.svc-card{background:var(--white,#FFFDF9)!important;border-radius:24px;padding:2.1rem 2.1rem 1.9rem;box-shadow:0 3px 14px -6px rgba(20,52,43,.1);border:1px solid rgba(20,52,43,.07);position:relative;overflow:hidden}
.svc-card::before{content:'';position:absolute;top:0;left:0;right:0;height:7px;background:#BCD9BF}
.services-grid .svc-card:nth-child(2)::before,.services-grid .svc-card:nth-child(3)::before{background:#E4CE9F}
.services-grid .svc-card:nth-child(4)::before{background:#9FC5BC}
.services-grid .svc-card:nth-child(5)::before{background:#E4CE9F}
.services-grid .svc-card:nth-child(6)::before{background:#9FC5BC}
.services-grid .svc-card:nth-child(7)::before{background:#BCD9BF}
.svc-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);border-color:rgba(46,125,79,.28)}
.svc-card h3{font-size:1.34rem;color:var(--ink);margin-top:.35rem}
.svc-card p{font-size:.95rem;color:var(--soft);line-height:1.72}
.svc-tag{font-size:.76rem;font-weight:700;color:var(--teal);background:var(--teal-faint,#E7F0EC);box-shadow:none;border:1px solid rgba(27,77,67,.12);padding:.45rem .9rem}
.svc-arr{box-shadow:0 4px 12px -4px rgba(20,52,43,.18)}
.svc-card:hover .svc-arr{background:var(--green);color:#fff;transform:translateX(4px)}
.svc-num{color:rgba(20,52,43,.1)}

/* ── Section blocks: rounded stage panels breathe more ── */
@supports selector(:has(*)){
  .sec-cream:has(> .wrap > .svc-fit-list)>.wrap{border-radius:36px;padding:3.25rem;box-shadow:var(--shadow-soft)}
  .sec-cream:has(.flow--path)>.wrap{border-radius:36px;padding:3.25rem;box-shadow:0 24px 60px -22px rgba(18,50,43,.45)}
  @media(max-width:820px){
    .sec-cream:has(> .wrap > .svc-fit-list)>.wrap,
    .sec-cream:has(.flow--path)>.wrap{padding:2rem;border-radius:28px}
  }
}

/* ── FAQ: BetterHelp-style bordered accordion cards ── */
.faq-item{border:1px solid var(--border)!important;border-radius:18px;margin-bottom:.65rem;background:var(--white);padding:0 1.25rem;transition:border-color .2s,box-shadow .2s}
.faq-item:first-of-type{border-top:1px solid var(--border)}
.faq-item:hover{border-color:var(--border-2)!important}
.faq-item.open{border-color:var(--green-soft)!important;box-shadow:0 10px 26px -14px rgba(46,125,79,.3)}
.faq-q{padding:1.1rem 0;font-size:1rem;color:var(--ink)}
.faq-ico{width:26px;height:26px;border-radius:999px;background:var(--teal-faint);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.faq-a{font-size:.94rem;color:var(--soft);line-height:1.75}
.faq-item.open .faq-a{padding-bottom:1.1rem}

/* ── Fee tables: softer premium framing ── */
.fee-table-wrap,.fees-table{border-radius:22px;box-shadow:var(--shadow-card);border-color:transparent}
.fee-teaser{border-radius:26px;box-shadow:var(--shadow-card);border-color:transparent;padding:1.85rem 2rem}
.fee-teaser-v{font-size:1.15rem}

/* ── Service blocks / landing pages ── */
.svc-block{border-radius:26px;padding:2.5rem;box-shadow:0 2px 10px -6px rgba(20,52,43,.06)}
.svc-block:hover{box-shadow:var(--shadow-card)}
.svc-hero{padding:5rem 0}
@media(max-width:860px){.svc-hero{padding:3rem 0 2.5rem}}

/* ── About page ── */
.pull-quote{border-radius:26px;box-shadow:inset 0 0 0 1px rgba(27,77,67,.08);font-size:1.38rem}
.about-photo{box-shadow:var(--shadow-lift)}
.cred-block{border-radius:18px;box-shadow:var(--shadow-card);border-color:transparent}

/* ── Resources: cards get lift + read cue ── */
.res-card{border-radius:20px;padding:1.5rem;box-shadow:0 2px 8px -6px rgba(20,52,43,.08)}
.res-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-card);border-color:var(--green-soft)}
.res-card-read{transition:gap .18s}
.res-card:hover .res-card-read{gap:.5rem}
.yt-card{border-radius:26px;box-shadow:0 20px 50px -20px rgba(18,50,43,.5)}
.tool-card{border-radius:22px;box-shadow:var(--shadow-card);border-color:transparent}

/* ── Reading pages: comfortable measure ── */
.reading-article{max-width:700px}
.reading-article p{font-size:1rem;line-height:1.9}
.reading-article .reading-intro{font-size:1.12rem}
.reading-cta,.svc-funnel,.series-next{border-radius:26px;box-shadow:var(--shadow-card)}

/* ── Contact & multi-step form: premium card ── */
.msf{border-radius:26px;box-shadow:var(--shadow-soft);border-color:transparent;padding:2.5rem}
@media(max-width:640px){.msf{padding:1.6rem}}
.msf-question{font-size:1.4rem}
.msf-option{border-radius:16px;background:var(--white)}
.msf-option:hover{box-shadow:0 6px 16px -8px rgba(46,125,79,.25);border-color:var(--green-soft)}
.msf-next{box-shadow:0 10px 26px -8px rgba(46,125,79,.45)}
.form-input{border-radius:14px}
.form-input:focus{box-shadow:0 0 0 4px rgba(46,125,79,.12);border-color:var(--green)}
.contact-hero-illus .illus,.about-hero-illus .illus{box-shadow:var(--shadow-soft);border-radius:26px}

/* ── Seek-help + crisis blocks ── */
.seek-block{border-radius:26px;box-shadow:0 20px 50px -20px rgba(18,50,43,.5)}
.seek-item{border-radius:16px}

/* ── Footer: slightly airier ── */
footer{padding:4rem 2rem 2.25rem}

/* ── Mobile bottom bar: Zocdoc-style persistent CTA ── */
#mbar{box-shadow:0 -8px 30px -16px rgba(20,52,43,.25);padding:.75rem 1.25rem}

/* ── Scroll reveal: keep, slightly gentler ── */
.rv,.rvl,.rvr{transition-duration:.6s}

/* ═══ v2 ADDITIONS: contrast & legibility floor ═══ */

/* Small-type floor: raise sub-.75rem UI text that was straining */
.hero-eye{font-size:.72rem}
.lbl{font-size:.74rem}
.hq-prog-lbl,.quiz-green-dis{font-size:.74rem}
.hq-back{font-size:.82rem}
.hero-micro{font-size:.82rem;color:var(--muted)}

/* Vignette + bridge copy darker for confident reading */
.vignette-body{color:var(--ink)}
.vignette p,.vignette-follow{color:var(--soft)}
.bridge-txt{color:var(--teal)}

/* Lead paragraphs step up in presence */
.lead,.hero-sub{color:#2E3F37}

/* Fee tables: zebra stripes + stronger header for scannability */
.fees-table tr:nth-child(even) td,.fee-table-wrap tr:nth-child(even) td{background:rgba(46,125,79,.045)}
.fees-table th,.fee-table-wrap th{background:var(--teal);color:#FFFDF9;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}

/* Service hero: bolder editorial entrance */
.svc-hero{background:linear-gradient(180deg,#EDF3EA 0%,var(--canvas) 92%)}
.svc-hero h1{font-size:clamp(2.1rem,4.4vw,3rem)}
.svc-hero .lead{font-size:1.12rem}

/* Section heading scale-up for clearer hierarchy */
h2{font-size:clamp(1.75rem,3.4vw,2.4rem)}
.sec .lbl+h2,.sec h2{margin-bottom:1.1rem}

/* Quiz panel sits on LIGHT mint (--teal-bg): keep disclaimer dark & legible */
.quiz-green-dis{color:#4A5A51}
.quiz-green-sub{color:var(--soft)}
/* Dark panels (seek-block, yt-card): ensure light text sufficiency */
.seek-block p,.yt-card p{color:rgba(255,253,249,.88)}

/* Footer fine print: lift from faint to legible on evergreen */
.footer-legal-notice,.footer-bottom,.footer-creds,.footer-loc{color:rgba(255,253,249,.74)}
.footer-brand-desc,.footer-crisis p,.footer-contact{color:rgba(255,253,249,.86)}

/* Watermark numbers on cards: quieter so text wins */
.svc-num{font-size:2.6rem}

/* ── Focus visibility (accessibility) ── */
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:2.5px solid var(--green);outline-offset:3px;border-radius:6px}

/* ── Selection color: brand touch ── */
::selection{background:var(--green-soft);color:var(--ink)}


/* ═══ v3 ADDITIONS — SEMANTIC MARKERS & ENGAGEMENT (design review r1) ═══ */

/* ── Semantic list markers: one meaning per mark ──────────────
   .svc-fit-list            ✓ green — fit / eligibility / included
   .svc-fit-list.list-x     ✕ clay  — exclusions: quiet hairline rows
   .svc-fit-list.list-step  → teal  — process steps & deliverables
   .svc-fit-list.list-dot   ● sand  — neutral topics (difficulties, domains) */
.svc-fit-list.list-x{display:block}
.svc-fit-list.list-x li{background:none;border:none!important;border-bottom:1px solid rgba(20,52,43,.09)!important;border-radius:0;box-shadow:none;padding:.6rem 0 .6rem 1.8rem;font-size:.88rem;color:var(--muted)}
.svc-fit-list.list-x li:last-child{border-bottom:none!important}
.svc-fit-list.list-x li:hover{transform:none;box-shadow:none}
.svc-fit-list.list-x li::before{content:'✕';left:0;top:.66rem;width:18px;height:18px;background:none;border:1.5px solid rgba(168,98,47,.55);color:var(--amber);font-size:.55rem}
.svc-fit-list.list-step li::before{content:'→';background:var(--teal-bg);color:var(--teal);font-size:.72rem}
.svc-fit-list.list-dot li::before{content:'●';background:var(--canvas-2);color:var(--amber);font-size:.42rem}

/* Exclusions eyebrow + compact heading */
.lbl-x{background:#F7EEE5;color:var(--amber)}
.lbl-x::before{content:'✕';color:var(--amber);font-size:.6rem}
.h-sm{font-size:1.32rem;line-height:1.32}
#fit .svc-two-col{grid-template-columns:1.15fr .85fr}
@media(max-width:860px){#fit .svc-two-col{grid-template-columns:1fr}}

/* ── Sticky on-page nav ── */
html{scroll-padding-top:140px}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
#pagenav{position:sticky;top:75px;z-index:300;background:rgba(251,248,242,.94);backdrop-filter:blur(10px);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:.55rem 2rem;display:flex;gap:.5rem;align-items:center;overflow-x:auto;scrollbar-width:none}
#pagenav::-webkit-scrollbar{display:none}
#pagenav .pn-lbl{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);flex:none;margin-right:.25rem}
#pagenav a{flex:none;padding:.4rem .85rem;border-radius:999px;font-size:.78rem;font-weight:600;color:var(--soft);text-decoration:none;border:1px solid var(--border-2);background:var(--white);transition:background .15s,color .15s,border-color .15s}
#pagenav a:hover{color:var(--teal);border-color:var(--green-soft);background:var(--white)}
#pagenav a.on{background:var(--green);border-color:transparent;color:var(--white)}

/* ── Eligibility self-check ── */
.wmck-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start;margin-top:1.75rem}
@media(max-width:860px){.wmck-grid{grid-template-columns:1fr;gap:2rem}}
.ck-card{background:var(--white);border-radius:20px;padding:1.5rem 1.6rem 1.2rem;box-shadow:0 14px 34px -14px rgba(20,52,43,.18)}
.ck-prog{display:flex;align-items:center;gap:6px;margin-bottom:1rem}
.ck-dot{width:7px;height:7px;border-radius:50%;background:#D8D2C4;transition:background .2s}
.ck-dot.on{background:var(--green)}
.ck-plabel{margin-left:8px;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:600}
.ck-q{font-size:1rem;font-weight:600;color:var(--ink);margin-bottom:.8rem;font-family:var(--sans)}
.ck-opts{display:flex;flex-direction:column;gap:.5rem}
.ck-opt{display:flex;align-items:center;justify-content:space-between;background:var(--white);border:1px solid var(--border-2);border-radius:13px;padding:.85rem 1rem;font-family:var(--sans);font-size:.9rem;font-weight:500;color:var(--ink);cursor:pointer;text-align:left;min-height:44px;transition:border-color .18s,box-shadow .18s}
.ck-opt::after{content:'→';color:var(--green);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s}
.ck-opt:hover{border-color:var(--green);box-shadow:0 6px 16px -8px rgba(46,125,79,.3)}
.ck-opt:hover::after{opacity:1;transform:none}
.ck-link{margin-top:.8rem;background:none;border:none;font-family:var(--sans);font-size:.8rem;color:var(--soft);cursor:pointer;padding:.25rem 0}
.ck-link:hover{color:var(--teal)}
.ck-verdict{border-radius:16px;padding:1.1rem 1.2rem;border:1px solid var(--border)}
.ck-verdict.ck-yes{background:#EDF5EC;border-color:var(--green-soft)}
.ck-verdict.ck-no{background:#F7EEE5;border-color:#E3C6AC}
.ck-verdict.ck-call{background:#EDF3F0;border-color:#BFD5CC}
.ck-vrow{display:flex;gap:.8rem;align-items:flex-start}
.ck-vicon{flex:none;width:26px;height:26px;border-radius:50%;color:var(--white);font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;background:var(--green)}
.ck-no .ck-vicon{background:var(--amber)}
.ck-call .ck-vicon{background:var(--teal)}
.ck-vtitle{font-size:.95rem;font-weight:700;color:var(--ink);line-height:1.45}
.ck-vbody{font-size:.85rem;color:var(--soft);line-height:1.7;margin-top:.3rem}
.ck-vcta{margin-top:.9rem;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.ck-vcta .btn{padding:.75rem 1.4rem;font-size:.88rem}
.ck-note{margin-top:.9rem;font-size:.72rem;color:var(--faint);line-height:1.6}

/* ── At-a-glance fact tiles ── */
.glance-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
@media(max-width:560px){.glance-grid{grid-template-columns:1fr}}
.glance-tile{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:1rem 1.1rem}
.glance-tile.gl-x{background:#F9F1E9;border-color:#E5CDB4}
.glance-k{font-size:.64rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:.3rem}
.glance-v{font-size:.92rem;font-weight:600;color:var(--ink);line-height:1.45}
.glance-v .gv-yes{color:var(--green)}
.glance-v .gv-no{color:var(--amber)}

/* ── Single-CTA reassurance note ── */
.cta-note{font-size:.85rem;color:var(--soft);align-self:center;line-height:1.5}
.cta-note strong{color:var(--ink)}
