/* TheraJoy — shared base styles for internal pages
   (Landing.html has its own inline version; keep in sync if tokens change) */
:root{
  --paper:#FBF8F3;
  --paper-2:#F3EEE4;
  --bone:#EFE8DA;
  --bone-2:#EFE9DD;
  --ink:#1E2420;
  --ink-2:#2B322E;
  --mute:#6B6F68;
  --mute-2:#9FA39C;
  --line:rgba(30,36,32,0.10);
  --line-2:rgba(30,36,32,0.06);
  --forest:#2F4A3F;
  --forest-2:#3F5F51;
  --sage:#C8D4C9;
  --sage-2:#DEE6DC;
  --clay:#C97B5B;
  --amber:#E0B872;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.55}
.serif{font-family:'Instrument Serif',serif;font-weight:400;letter-spacing:-0.01em}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;padding:0}
img,svg{display:block;max-width:100%}
.container{max-width:1200px;margin:0 auto;padding:0 28px}
.container-narrow{max-width:760px;margin:0 auto;padding:0 28px}
.container-mid{max-width:960px;margin:0 auto;padding:0 28px}

/* NAV */
nav.site-nav{position:sticky;top:0;z-index:50;background:rgba(251,248,243,0.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line-2)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.wordmark{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-0.4px}
.wordmark-dot{width:22px;height:22px;border-radius:50%;background:var(--forest);position:relative;overflow:hidden;flex-shrink:0}
.wordmark-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,0.4),transparent 60%)}
.nav-links{display:flex;gap:32px;font-size:14px;color:var(--mute)}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-cta{display:flex;align-items:center;gap:14px}
.nav-cta .login{font-size:14px;color:var(--mute)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;font-size:14px;font-weight:500;transition:all .2s;white-space:nowrap}
.btn-primary{background:var(--forest);color:#fff}
.btn-primary:hover{background:var(--forest-2)}
.btn-ghost{background:var(--paper-2);color:var(--ink)}
.btn-ghost:hover{background:var(--bone)}
.btn-outline{border:1px solid var(--line);color:var(--ink)}
.btn-outline:hover{background:var(--paper-2)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#000}
@media(max-width:840px){.nav-links{display:none}}

/* Page header (title + kicker for internal pages) */
.page-head{padding:88px 0 56px;border-bottom:1px solid var(--line-2)}
.page-kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:var(--mute);letter-spacing:0.5px;text-transform:uppercase;font-weight:500;margin-bottom:22px}
.page-kicker::before{content:"";display:inline-block;width:22px;height:1px;background:var(--mute-2)}
.page-title{font-family:'Instrument Serif',serif;font-weight:400;font-size:clamp(48px,7vw,88px);line-height:0.98;letter-spacing:-0.025em;max-width:860px}
.page-title em{font-style:italic;color:var(--forest)}
.page-lede{font-size:18px;color:var(--mute);max-width:580px;margin-top:24px;line-height:1.55}
.page-meta{display:flex;gap:18px;margin-top:28px;font-size:13px;color:var(--mute);flex-wrap:wrap}
.page-meta .dot{color:var(--mute-2)}

/* Shared typography for long-form pages */
.prose h2{font-family:'Instrument Serif',serif;font-weight:400;font-size:clamp(30px,3.6vw,46px);line-height:1.05;letter-spacing:-0.02em;margin-top:72px;margin-bottom:20px}
.prose h2 em{font-style:italic;color:var(--forest)}
.prose h3{font-size:17px;font-weight:600;letter-spacing:-0.2px;margin-top:40px;margin-bottom:10px;color:var(--ink)}
.prose p{font-size:16px;line-height:1.7;color:var(--ink-2);margin-bottom:16px}
.prose p + p{margin-top:0}
.prose a{color:var(--forest);border-bottom:1px solid rgba(47,74,63,0.3)}
.prose a:hover{border-color:var(--forest)}
.prose ul, .prose ol{margin:16px 0 16px 24px}
.prose li{font-size:16px;line-height:1.7;color:var(--ink-2);margin-bottom:8px}
.prose blockquote{font-family:'Instrument Serif',serif;font-size:28px;line-height:1.35;color:var(--ink);border-left:2px solid var(--forest);padding:8px 0 8px 28px;margin:40px 0;font-style:italic}
.prose hr{border:none;border-top:1px solid var(--line-2);margin:56px 0}
.prose .note{background:var(--paper-2);border:1px solid var(--line-2);border-radius:18px;padding:22px 26px;margin:28px 0;font-size:14px;color:var(--ink-2);line-height:1.6}
.prose .note strong{color:var(--ink);font-weight:600;display:block;margin-bottom:6px}

/* Footer (shared) */
footer.site-foot{border-top:1px solid var(--line-2);padding:56px 0 40px;background:var(--paper);margin-top:120px}
.foot-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:48px;margin-bottom:48px}
@media(max-width:840px){.foot-grid{grid-template-columns:1fr 1fr;gap:32px}}
.foot-col h6{font-size:11px;letter-spacing:0.5px;text-transform:uppercase;color:var(--mute);font-weight:500;margin-bottom:18px}
.foot-col a{display:block;font-size:14px;color:var(--ink);padding:6px 0}
.foot-col a:hover{color:var(--forest)}
.foot-intro{max-width:320px}
.foot-intro p{font-size:13px;color:var(--mute);margin-top:14px;line-height:1.55}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:28px;border-top:1px solid var(--line-2);flex-wrap:wrap;gap:16px}
.foot-note{font-size:12px;color:var(--mute);max-width:680px;line-height:1.5}
.foot-meta{display:flex;gap:20px;font-size:12px;color:var(--mute)}
