/* ==========================================================================
   Prism v2 skin for the "Problems We Solve" topic pages (/topics/*.html).
   Loaded after each page's own <style>, so it restyles the existing markup
   to match the welcome2-v2 landing page: Inter at light weights, pill section
   labels, white and cream sections framed by hairline rails, thin gold line
   icons in hairline circles, soft white cards.
   ========================================================================== */

:root{
  /* the pages' own tokens, remapped to the landing palette */
  --bg:#F5F2EB;
  --bg-alt:#F5F2EB;
  --card:#FFFFFF;
  --ink:#1F2B27;
  --ink-soft:#5C6261;
  --ink-faint:#7E8784;
  --teal:#6F7F7A;
  --teal-deep:#1F2B27;
  --teal-pale:#EEF0EE;
  --gold:#C9A36A;
  --gold-deep:#AF8A54;
  --gold-pale:#F6EEDF;
  --line:#ECE7DE;
  --radius:16px;

  --v2-sans:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --v2-slate:#1F2B27;
  --v2-body:#3E4A45;
  --v2-soft-head:#8A9590;
  --v2-hair:#ECE7DE;
  --v2-card-shadow:0 10px 30px rgba(31,43,39,.06);
  --v2-card-shadow-hover:0 18px 44px rgba(31,43,39,.10);
  --v2-card-border:rgba(31,43,39,.08);
  --v2-railw:min(1240px, calc(100vw - 64px));
  --v2-ease:cubic-bezier(.22,.9,.3,1);
}

/* ── TYPE: one family everywhere (icon fonts excluded) ── */
body,
body :where(h1,h2,h3,h4,h5,h6,p,span,a,button,li,div,summary,label,input,textarea,select,strong,em,small,b,td,th,figcaption,blockquote,text,tspan){
  font-family:var(--v2-sans) !important;
}
body{background:#fff;color:var(--v2-slate);-webkit-font-smoothing:antialiased;}

h1,h2,h3{color:var(--v2-slate);}
.hero h1,
section .hero h1,
h1{
  font-weight:400 !important;
  letter-spacing:-.035em;
  line-height:1.06;
}
.hero h1{font-size:clamp(40px,5.4vw,66px);}
h1 em,.hero h1 em{font-style:normal;color:var(--v2-soft-head);background:none;-webkit-text-fill-color:currentColor;}

h2{font-weight:400 !important;letter-spacing:-.03em;line-height:1.14;}
.section-head h2{font-size:clamp(30px,3.8vw,44px);margin-top:4px;}
.section-head p{color:var(--ink-soft);line-height:1.7;}
h3{font-weight:500 !important;letter-spacing:-.012em;}
h4{font-weight:500 !important;letter-spacing:-.01em;}
strong,b{font-weight:600;}

.hero-sub{color:var(--ink-soft);line-height:1.65;}
.hero-note,.web-caption,.dash-title,.dash-live,.metric-label,.cause-num,.bar-tag,.flow-pill,.flow-result{
  letter-spacing:.02em;
}
.hero-note{color:var(--ink-faint);font-size:13px;}

/* ── LABELS: section eyebrows become the landing page's pill labels ── */
.section-head .eyebrow,
.hero .eyebrow{
  display:inline-block;
  padding:6px 14px;
  border:1px solid rgba(31,43,39,.14);
  border-radius:999px;
  font-size:11px !important;
  font-weight:500 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase;
  color:#5E6C66 !important;
  background:transparent;
  margin-bottom:14px;
}
.hero .eyebrow{margin-bottom:22px;}
/* smaller in-card eyebrows (callouts etc.) */
.eyebrow{font-size:11.5px;font-weight:600;letter-spacing:.12em;}

/* ── SECTIONS: white base, cream alternates, hairline rails ── */
section{background-color:#fff;}
section.alt{background-color:#F5F2EB;}
section + section{border-top:1px solid var(--v2-hair);}
.hero{background-color:#fff;}
section{
  background-image:linear-gradient(var(--v2-hair),var(--v2-hair)),linear-gradient(var(--v2-hair),var(--v2-hair));
  background-size:1px 100%,1px 100%;
  background-repeat:no-repeat;
  background-position:calc(50% - var(--v2-railw) / 2) 0,calc(50% + var(--v2-railw) / 2) 0;
}
.hero{
  background-image:
    radial-gradient(ellipse 60% 55% at 50% 0%,rgba(201,163,106,.10) 0%,transparent 70%),
    linear-gradient(var(--v2-hair),var(--v2-hair)),linear-gradient(var(--v2-hair),var(--v2-hair));
  background-size:100% 100%,1px 100%,1px 100%;
  background-position:0 0,calc(50% - var(--v2-railw) / 2) 0,calc(50% + var(--v2-railw) / 2) 0;
}
@media (max-width:900px){
  section{background-image:none;}
  .hero{background-image:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(201,163,106,.10) 0%,transparent 70%);background-size:100% 100%;}
}

/* ── BUTTONS ── */
.btn-primary,
a.btn-primary{
  background:var(--gold);
  border:1px solid var(--gold-deep);
  color:#1f1f1f;
  font-weight:700 !important;
  font-size:15px;
  letter-spacing:.01em;
  text-transform:none;
  border-radius:10px;
  padding:15px 28px;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
  transition:background .18s,transform .06s,box-shadow .18s;
}
.btn-primary:hover{background:var(--gold-deep);color:#1f1f1f;transform:translateY(-2px);box-shadow:0 14px 36px rgba(0,0,0,.14);}
.btn-secondary,
a.btn-secondary{
  background:#fff;
  border:1px solid rgba(31,43,39,.14);
  color:var(--v2-slate);
  font-weight:500 !important;
  font-size:15px;
  letter-spacing:-.005em;
  text-transform:none;
  border-radius:999px;
  padding:14px 26px;
  transition:border-color .18s,background .18s;
}
.btn-secondary:hover{border-color:var(--gold);background:#fff;}
@media (max-width:600px){
  .btn-primary,.btn-secondary{padding:13px 20px;font-size:14px;}
}

/* ── CARDS: soft white, hairline border, gentle shadow ── */
.symptom-card,.symptom-panel,.cause-card,.cause-detail,.result-card,.dash,.mid-cta,.web-card,.callout,
.research-card,.root-card,.cond-panel,.split-card,.compare-card,.myth-row,.pillar-card,.harm-card,
.driver-card,.stage-card,.found-card,.noct-card,.checklist,.kit-card,.balance-col,.final-cta{
  border-color:var(--v2-card-border);
}
.symptom-card,.symptom-panel,.cause-card,.result-card,.dash,.mid-cta,.web-card,.cause-detail{
  border-radius:16px;
  box-shadow:var(--v2-card-shadow);
}
.symptom-card:hover,.result-card:hover{box-shadow:var(--v2-card-shadow-hover);}
.cause-card:hover{border-color:rgba(175,138,84,.45);}
.cause-card[open]{border-color:rgba(175,138,84,.45);box-shadow:0 14px 36px rgba(31,43,39,.08);}
body .research-card{border-radius:16px;border-color:var(--v2-card-border);box-shadow:var(--v2-card-shadow);}
body .research-card:hover{border-color:rgba(175,138,84,.35);box-shadow:var(--v2-card-shadow-hover);transform:translateY(-3px);}
body .research-card h3{font-weight:500;letter-spacing:-.012em;color:var(--v2-slate);}
body .research-kind{font-weight:500;color:var(--gold-deep);}
body .research-more{font-size:13px;letter-spacing:.02em;}
.callout{border-left-width:1px;border-radius:16px;box-shadow:var(--v2-card-shadow);}
.callout .eyebrow{color:var(--gold-deep);}

/* tabs inside cards */
.symptom-tab{font-weight:500;}
.symptom-tab.active{color:var(--v2-slate);box-shadow:inset 0 -2px 0 var(--gold);}

/* tiles */
.icon-tile{background:#fff;border-color:var(--v2-hair);border-radius:12px;}
.icon-tile:hover,.icon-tile.open{border-color:rgba(175,138,84,.5);}
.icon-tile span{color:var(--v2-body);}

/* ── ICONS: thin gold line icons in a hairline circle (no fill) ── */
.card-icon,.cause-icon,.upload-icon,
.cond-tab .ct-ico,.root-ico,
.found-ico,.horm-tab .ht-ico,.lesser-ico,.stage-ico,
.compare-icon,.harm-icon,.myth-icon,.pillar-icon,
.driver-ico,
.cause-ico,.noct-ico,.noct-intro-ico,.split-icon,
.checklist-intro-icon{
  background:#fff !important;
  border:1px solid rgba(175,138,84,.4) !important;
  border-radius:50% !important;
  color:var(--gold-deep) !important;
  box-shadow:none !important;
}
.card-icon svg,.cause-icon svg,.root-ico svg,.found-ico svg,.stage-ico svg,.lesser-ico svg,
.compare-icon svg,.harm-icon svg,.myth-icon svg,.pillar-icon svg,.driver-ico svg,
.cause-ico svg,.noct-ico svg,.split-icon svg,.ct-ico svg,.ht-ico svg{
  stroke-width:1.6;
}
.myth-row .chevron,.chevron{
  background:#fff !important;
  border:1px solid var(--v2-hair) !important;
  color:var(--ink-faint) !important;
}

/* numbered steps: outline circle instead of a filled gold disc */
.steps li::before{
  background:#fff !important;
  border:1px solid rgba(175,138,84,.45);
  color:var(--gold-deep) !important;
  font-weight:500 !important;
  box-shadow:none !important;
  font-family:var(--v2-sans) !important;
}
.steps h4{font-weight:500;}

/* flow pills */
.flow-pill{background:#fff;border-color:var(--v2-hair);font-weight:500;}
.flow-result{font-weight:600;}

/* ── DIAGRAMS ── */
.node text{font-weight:500;}
.center-circle{fill:#1F2B27;}
.chord{stroke:var(--gold);}
.orbit-center{background:#1F2B27;}

/* ── RESULTS ── */
.result-num{font-weight:400 !important;letter-spacing:-.035em;color:#9A7238;}
.ring-progress{stroke:#B8883E;}
.ring-track{stroke:#EFEAE0;}

/* ── CTA BANDS ── */
.cta-band,div.final-cta{
  background:
    radial-gradient(ellipse 70% 90% at 100% 0%,rgba(201,163,106,.18) 0%,transparent 60%),
    linear-gradient(135deg,#1a231e 0%,#2b3a34 100%);
  border-radius:22px;
}
.cta-band h2,div.final-cta h2{font-weight:400 !important;letter-spacing:-.03em;color:#fff;}
.cta-band-lead{font-weight:500;}
.cta-band .btn-primary{box-shadow:0 10px 30px rgba(0,0,0,.25);}

/* ── MOTION: same easing and travel as the landing page ── */
.reveal{transform:translateY(20px);transition:opacity .6s ease,transform .6s var(--v2-ease);}
.reveal.visible{transform:none;}
.hero-anim{transition:opacity .8s var(--v2-ease),transform .8s var(--v2-ease);transform:translateY(14px);}
.hero-anim.show{transform:none;}

/* ── FOOTER (shared partial) ── */
body > footer{background:#2a2a2a;color:#cfd3cf;padding:64px clamp(20px,5vw,64px) 32px;}
body > footer .footer-inner{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:48px;max-width:1160px;margin:0 auto;padding:0;}
body > footer h3{font-size:15px;font-weight:600 !important;color:#fff;letter-spacing:.01em;margin:0 0 18px;}
body > footer p{font-size:13px;line-height:1.7;color:rgba(255,255,255,.6);opacity:1;margin:0 0 12px;}
body > footer .footer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
body > footer .footer-links li{margin:0;}
body > footer a{font-size:13px;color:rgba(255,255,255,.6);}
body > footer a:hover{color:#fff;}
body > footer .footer-social{display:flex;gap:16px;margin-top:20px;}
body > footer .footer-social a{color:rgba(255,255,255,.45);}
body > footer .footer-social a:hover{color:var(--gold);}
body > footer .prism-newsletter-form input{border-radius:8px !important;border:1px solid rgba(255,255,255,.14) !important;background:rgba(255,255,255,.06) !important;color:#fff !important;font-size:14px !important;}
body > footer .prism-newsletter-form input::placeholder{color:rgba(255,255,255,.45);}
body > footer .prism-newsletter-form button{border-radius:8px !important;font-weight:600 !important;font-size:13px;letter-spacing:.04em;color:#1f1f1f !important;background:var(--gold) !important;border:1px solid var(--gold-deep) !important;}
body > footer .footer-inner + .footer-inner{display:block;}
body > footer .footer-bottom{max-width:1160px;margin:40px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
body > footer .footer-bottom p,body > footer .footer-bottom a{font-size:12px;color:rgba(255,255,255,.35);margin:0;}
body > footer .footer-bottom a:hover{color:rgba(255,255,255,.7);}
@media (max-width:960px){body > footer .footer-inner{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){body > footer .footer-inner{grid-template-columns:1fr;gap:32px;}body > footer .footer-bottom{flex-direction:column;align-items:flex-start;}}

/* ── POLISH ── */
/* nav call-to-action reads the same as on the landing page */
.nav-wrap .btn{padding:12px 20px;border-radius:8px;font-size:13px;font-weight:700 !important;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 6px 16px rgba(0,0,0,.08);}

/* stat-band titles */
.highlight-stat-title{font-weight:400 !important;letter-spacing:-.025em;color:var(--v2-slate);}

/* plus marks on collapsible steps and callouts, like the landing page */
.steps h4::after,.callout .eyebrow::after{
  content:'+' !important;font-size:20px !important;font-weight:300;line-height:1;top:-2px !important;
  color:var(--teal) !important;transition:transform .25s ease !important;
}
.steps li.open h4::after,.callout.open .eyebrow::after{transform:rotate(45deg) !important;}

/* tracker numbers */
.metric-value{font-weight:500 !important;letter-spacing:-.02em;}
.dash-title,.metric-label{letter-spacing:.06em;}
@media (max-width:600px){
  .hero h1{font-size:clamp(31px,8.6vw,38px);letter-spacing:-.03em;}
  .section-head h2{font-size:clamp(26px,7vw,32px);}
  .hero .eyebrow{margin-bottom:16px;}
}

/* ── DIAGRAM ICONS: gold line icons, slate when selected ── */
.node .node-icon{color:var(--gold-deep) !important;}
.node:hover .node-icon,.node.active .node-icon{color:var(--v2-slate) !important;}
.node:hover circle{stroke-width:2;}
.center-icon{color:#fff !important;}
.icon-tile svg,.mchip svg,.orbit-node svg{color:var(--gold-deep);}
.orbit-node svg{width:20px !important;height:20px !important;}