/* ===========================================================
   The Pause Worthy Project™ — shared design system
   "Editorial Bold" (Concept A)
   Fonts: Fraunces (display serif) + Archivo (body)
   =========================================================== */

:root{
  --paper:#FBF6EC; --paper2:#F3EADA; --paper3:#F7EFE0;
  --ink:#1A1613; --ink2:#4A4239; --ink3:#6B6253;
  --terra:#C2461F; --terra-dk:#9E3717; --terra-soft:#F0D9CE;
  --sage:#5C6E50; --sage-soft:#E4E9DD;
  --line:#E3D6C2; --line2:#EDE3D2;
  --maxw:1200px;
  --r:4px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);
  font-family:"Archivo",system-ui,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:var(--terra);color:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.narrow{max-width:760px}
.skip{position:absolute;left:-9999px}
.skip:focus{position:fixed;top:10px;left:10px;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:var(--r);z-index:100}

/* ---------- Nav ---------- */
.site-nav{position:sticky;top:0;z-index:50;background:rgba(251,246,236,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:var(--maxw);margin:0 auto;padding:18px 32px;gap:20px}
.brand{font-family:"Fraunces",serif;font-weight:900;font-size:21px;letter-spacing:-.02em;white-space:nowrap}
.brand sup{font-size:9px;font-weight:600;vertical-align:super}
.nav-links{display:flex;gap:21px;font-size:14px;font-weight:500;align-items:center}
.nav-links a{position:relative;padding:4px 0;color:var(--ink2);transition:color .2s}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--terra);transition:width .25s ease}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{width:100%}
.nav-cta{font-weight:600;font-size:14px;background:var(--ink);color:var(--paper)!important;padding:11px 20px;border-radius:var(--r);transition:.2s;white-space:nowrap}
.nav-cta::after{display:none!important}
.nav-cta:hover{background:var(--terra)}
.nav-toggle{display:none}

/* responsive nav (no-JS, uses <details>) */
@media(max-width:1000px){
  .nav-desktop{display:none}
  .nav-toggle{display:block;position:relative}
  .nav-toggle summary{list-style:none;cursor:pointer;font-weight:600;font-size:14px;color:var(--ink);padding:9px 14px;border:1px solid var(--line);border-radius:var(--r)}
  .nav-toggle summary::-webkit-details-marker{display:none}
  .nav-toggle[open] .nav-drop{display:flex}
  .nav-drop{display:none;position:absolute;right:0;top:calc(100% + 10px);flex-direction:column;gap:2px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:8px;min-width:200px;box-shadow:0 16px 40px rgba(26,22,19,.12)}
  .nav-drop a{padding:11px 14px;border-radius:var(--r);font-size:15px;color:var(--ink2)}
  .nav-drop a:hover,.nav-drop a[aria-current="page"]{background:var(--paper2);color:var(--ink)}
}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--terra);font-weight:700;margin-bottom:22px;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:34px;height:2px;background:var(--terra);flex:none}
.serif{font-family:"Fraunces",serif}
h1,h2,h3,h4{font-family:"Fraunces",serif;letter-spacing:-.02em;line-height:1.08}
em.tw{font-style:italic;font-weight:500;color:var(--terra)}

/* ---------- Home hero ---------- */
.hero{padding:80px 0 60px;border-bottom:1px solid var(--line)}
.hero h1{font-weight:900;font-size:clamp(44px,7.5vw,98px);line-height:.96;letter-spacing:-.03em;max-width:15ch}
.hero h1 em{font-style:italic;font-weight:500;color:var(--terra)}
.lede{font-size:clamp(18px,2.2vw,22px);color:var(--ink2);max-width:56ch;margin:32px 0 0;line-height:1.5}
.routes{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}

/* ---------- Inner page hero ---------- */
.page-hero{padding:64px 0 44px;border-bottom:1px solid var(--line)}
.page-hero h1{font-weight:900;font-size:clamp(38px,5.6vw,68px);line-height:1.0;max-width:18ch}
.page-hero h1 em{font-style:italic;font-weight:500;color:var(--terra)}
.page-hero .lede{margin-top:24px;max-width:62ch;font-size:clamp(17px,2vw,20px)}

/* ---------- Buttons ---------- */
.btn{font-family:"Archivo",sans-serif;font-weight:600;font-size:16px;border:1.5px solid var(--ink);padding:15px 26px;border-radius:var(--r);transition:.2s;display:inline-flex;align-items:center;gap:10px;background:transparent;color:var(--ink);cursor:pointer}
.btn .arr{transition:transform .25s}
.btn:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px)}
.btn:hover .arr{transform:translateX(5px)}
.btn.primary{background:var(--terra);border-color:var(--terra);color:#fff}
.btn.primary:hover{background:var(--terra-dk);border-color:var(--terra-dk)}
.btn.small{font-size:14.5px;padding:11px 20px}

/* ---------- Stat band ---------- */
.statband{background:var(--ink);color:var(--paper);padding:72px 0}
.statgrid{display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:center}
.bignum{font-family:"Fraunces",serif;font-weight:900;font-size:clamp(90px,16vw,190px);line-height:.82;letter-spacing:-.04em;color:var(--terra)}
.bignum span{display:block;font-size:.16em;color:var(--paper);letter-spacing:.16em;text-transform:uppercase;font-weight:700;font-family:"Archivo";margin-top:18px}
.statgrid p{font-family:"Fraunces",serif;font-weight:400;font-size:clamp(22px,3vw,33px);line-height:1.3;max-width:24ch}
.statgrid p b{color:var(--terra);font-weight:600}
@media(max-width:760px){.statgrid{grid-template-columns:1fr;gap:24px}}

/* ---------- Generic section ---------- */
.section{padding:88px 0}
.section.tight{padding:64px 0}
.sec-head{font-size:clamp(30px,4vw,46px);font-weight:800;margin-bottom:10px}
.sec-head em{font-style:italic;font-weight:500;color:var(--terra)}
.sec-sub{color:var(--ink2);font-size:17px;margin-bottom:46px;max-width:54ch}

/* ---------- Editorial cards (3-up) ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line)}
.card{padding:38px 30px 38px 0;border-bottom:1px solid var(--line);transition:background .25s}
.card:not(:last-child){border-right:1px solid var(--line);padding-right:30px}
.card .n{font-family:"Fraunces",serif;font-size:15px;color:var(--terra);font-weight:700;margin-bottom:18px}
.card h3{font-size:25px;font-weight:700;margin-bottom:12px}
.card p{color:var(--ink2);font-size:15.5px}
.card a.more{display:inline-block;margin-top:14px;font-weight:600;font-size:14.5px;color:var(--terra)}
.card:hover{background:var(--paper2)}
@media(max-width:760px){.cards{grid-template-columns:1fr}.card{border-right:none!important;padding-right:0}}

/* ---------- Tiled cards (boxed) ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.tile{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px 26px;transition:.25s}
.tile:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(26,22,19,.08);border-color:var(--terra)}
.tile h3{font-size:22px;font-weight:700;margin-bottom:8px}
.tile p{color:var(--ink2);font-size:15px}
.tile .more{display:inline-block;margin-top:14px;font-weight:600;font-size:14px;color:var(--terra)}

/* ---------- Prose (content pages) ---------- */
.prose{max-width:760px}
.prose > *+*{margin-top:20px}
.prose h2{font-size:clamp(26px,3.2vw,36px);font-weight:800;margin-top:52px;letter-spacing:-.02em}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:21px;font-weight:700;margin-top:34px}
.prose p{font-size:17px;color:var(--ink2);line-height:1.65}
.prose strong{color:var(--ink);font-weight:700}
.prose ul,.prose ol{padding-left:0;list-style:none;display:flex;flex-direction:column;gap:11px;margin-top:8px}
.prose li{position:relative;padding-left:30px;font-size:16.5px;color:var(--ink2);line-height:1.55}
.prose li::before{content:"";position:absolute;left:6px;top:.62em;width:8px;height:8px;background:var(--terra);border-radius:50%}
.prose a:not(.btn){color:var(--terra);font-weight:600;border-bottom:1px solid var(--terra-soft)}
.prose a:not(.btn):hover{border-bottom-color:var(--terra)}

/* ---------- Callout box ---------- */
.callout{background:var(--terra-soft);border-left:4px solid var(--terra);border-radius:0 var(--r) var(--r) 0;padding:22px 26px;margin:32px 0}
.callout p{font-size:16px;color:var(--ink);margin:0;line-height:1.55}
.callout strong{font-weight:700}
.callout.sage{background:var(--sage-soft);border-left-color:var(--sage)}

/* ---------- "Talk to a clinician" prompt ---------- */
.clinician-prompt{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;margin-top:24px;font-size:15.5px;color:var(--ink2)}
.clinician-prompt .mk{font-family:"Fraunces",serif;font-weight:900;color:var(--terra);font-size:22px;line-height:1.2;flex:none}

/* ---------- Option / model list (treatments, telehealth) ---------- */
.optlist{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);margin-top:14px}
.optlist .opt{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.optlist .opt b{font-family:"Fraunces",serif;font-weight:700;font-size:18px;color:var(--ink)}
.optlist .opt p{font-size:15.5px;color:var(--ink2);margin:0}
@media(max-width:680px){.optlist .opt{grid-template-columns:1fr;gap:6px}}

/* ---------- Promise band ---------- */
.promise{background:var(--paper2);padding:80px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.promise-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}
.promise-grid h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;line-height:1.12}
.promise-grid h2 em{font-style:italic;color:var(--terra);font-weight:500}
.promise-grid .trust{font-size:16px;color:var(--ink2);line-height:1.6;border-left:3px solid var(--terra);padding-left:22px}
@media(max-width:760px){.promise-grid{grid-template-columns:1fr;gap:28px}}

/* ---------- CTA strip ---------- */
.cta-strip{text-align:center;padding:70px 0}
.cta-strip h2{font-size:clamp(28px,3.6vw,42px);font-weight:800;max-width:20ch;margin:0 auto 10px}
.cta-strip h2 em{font-style:italic;color:var(--terra);font-weight:500}
.cta-strip p{color:var(--ink2);font-size:17px;max-width:50ch;margin:0 auto 28px}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- Sources note ---------- */
.sources{margin-top:48px;padding-top:22px;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink3);line-height:1.6}
.sources b{color:var(--ink2)}

/* ---------- Footer ---------- */
.site-footer{padding:56px 0 44px;background:var(--paper)}
.foot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:36px;border-bottom:1px solid var(--line)}
.foot-brand .brand{font-size:20px}
.foot-brand p{color:var(--ink3);font-size:14px;margin-top:12px;max-width:34ch}
.foot-col h4{font-family:"Archivo";font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);font-weight:700;margin-bottom:14px}
.foot-col a{display:block;color:var(--ink2);font-size:15px;margin-bottom:9px;transition:color .2s}
.foot-col a:hover{color:var(--terra)}
.disc{font-size:13px;color:var(--ink3);max-width:84ch;line-height:1.6;margin-top:28px}
.disc b{color:var(--terra)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:24px;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--ink3)}
@media(max-width:760px){.foot-cols{grid-template-columns:1fr;gap:28px}}

/* ---------- Breadcrumb ---------- */
.crumb{font-size:13px;letter-spacing:.04em;color:var(--ink3);margin-bottom:18px;font-weight:500}
.crumb a{color:var(--terra);font-weight:600}
.crumb a:hover{text-decoration:underline}
.crumb .sep{margin:0 8px;color:var(--line)}

/* ---------- Clinical marker note ---------- */
.marker-note{background:var(--paper3);border:1px solid var(--line);border-radius:var(--r);padding:18px 22px;margin-top:28px;font-size:14px;color:var(--ink3);line-height:1.55}
.marker-note b{font-family:"Archivo";letter-spacing:.1em;text-transform:uppercase;font-size:11px;color:var(--ink2);display:block;margin-bottom:6px}

/* ---------- Articles ---------- */
.article-meta{font-size:13.5px;color:var(--ink3);margin-top:18px;letter-spacing:.02em}
.article-meta b{color:var(--terra);font-weight:600}
.article-list{border-top:1px solid var(--line);margin-top:6px}
.article-list .row{display:grid;grid-template-columns:auto 1fr auto;gap:26px;align-items:baseline;padding:32px 0;border-bottom:1px solid var(--line);transition:background .2s}
.article-list .row:hover{background:var(--paper2)}
.article-list .idx{font-family:"Fraunces",serif;font-size:17px;color:var(--terra);font-weight:700}
.article-list .body h3{font-family:"Fraunces",serif;font-size:26px;font-weight:700;margin-bottom:8px;letter-spacing:-.01em;line-height:1.12}
.article-list .body p{color:var(--ink2);font-size:16px;max-width:66ch}
.article-list .go{font-weight:600;font-size:14.5px;color:var(--terra);white-space:nowrap;align-self:center}
.article-list .row:hover .go{text-decoration:underline}
@media(max-width:680px){.article-list .row{grid-template-columns:1fr;gap:8px}.article-list .go{align-self:start}}

/* ---------- Pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:16px}
.pricecard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 26px;display:flex;flex-direction:column}
.pricecard.feature{border-color:var(--terra);box-shadow:0 16px 40px rgba(194,70,31,.10)}
.pricecard .tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--terra);margin-bottom:10px}
.pricecard h3{font-size:21px;font-weight:700;margin-bottom:4px}
.pricecard .price{font-family:"Fraunces",serif;font-weight:700;font-size:30px;color:var(--terra);margin:6px 0 2px}
.pricecard .per{font-size:13px;color:var(--ink3);margin-bottom:16px}
.pricecard p.lead{font-size:15px;color:var(--ink2);margin-bottom:16px}
.pricecard ul{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:8px}
.pricecard li{font-size:14.5px;color:var(--ink2);padding-left:18px;position:relative;line-height:1.45}
.pricecard li::before{content:"\2013";position:absolute;left:2px;color:var(--terra)}
.pricecard .btn{margin-top:auto;justify-content:center}

/* ---------- Glossary note ---------- */
.gloss-note{font-size:15px;color:var(--ink2);background:var(--paper3);border-left:3px solid var(--sage);padding:10px 16px;border-radius:0 var(--r) var(--r) 0;margin-top:10px}
.gloss-note b{color:var(--ink)}

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