/* Next Version of Me - shared course styles (course/ pages).
   Adapted from the yourdivorceally programme-shared.css: cream paper,
   emerald accent, Fraunces display, Satoshi body, light/dark.
   Self-hosted fonts live at the site root in /fonts. */
@font-face{
  font-family:'Fraunces';
  src:url('../fonts/Fraunces.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Satoshi';
  src:url('../fonts/Satoshi-Variable.woff2') format('woff2');
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}

:root {
  --paper:#FAF8F1;
  --panel:#FFFDF6;
  --ink:#1E241F;
  --muted:#66705F;
  --line:#E4DFCE;
  --green:#10B981;
  --green-ink:#047857;
  --green-deep:#065F46;
  --green-tint:#E6F4EA;
  --green-line:#A9DFC3;
  --warm:#D97706;
  --warm-soft:#FEF3C7;
  --radius:14px;
  --maxw:660px;
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'Satoshi','Helvetica Neue',Arial,sans-serif;
}
[data-theme="dark"] {
  --paper:#141814;
  --panel:#1C211B;
  --ink:#E9EFE7;
  --muted:#9CA894;
  --line:#2A332B;
  --green:#34D399;
  --green-ink:#A7F3D0;
  --green-deep:#0B3B2C;
  --green-tint:#123527;
  --green-line:#1F4636;
  --warm:#FBBF24;
  --warm-soft:#332A10;
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:18px;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  transition:background .25s ease, color .25s ease;
}

/* top bar */
.bar {
  max-width:var(--maxw);
  margin:0 auto;
  padding:20px 22px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.wordmark {
  font-family:var(--serif);
  font-weight:600;
  font-size:20px;
  letter-spacing:-.01em;
  color:var(--green-ink);
  text-decoration:none;
}
[data-theme="dark"] .wordmark { color:var(--green); }
.wordmark span { color:var(--muted); font-style:italic; font-weight:400; font-size:15px; }
.toggle {
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  color:var(--muted);
  background:transparent;
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 13px;
  cursor:pointer;
  transition:border-color .2s ease, color .2s ease;
}
.toggle:hover { border-color:var(--green-line); color:var(--ink); }
.toggle:focus-visible { outline:2px solid var(--green); outline-offset:2px; }

.wrap { max-width:var(--maxw); margin:0 auto; padding:34px 22px 96px; }

.eyebrow {
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:11.5px;
  font-weight:700;
  color:var(--green-ink);
}
[data-theme="dark"] .eyebrow { color:var(--green); }
h1 {
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(29px,6vw,36px);
  line-height:1.16;
  letter-spacing:-.01em;
  margin:12px 0 14px;
}
.standfirst {
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  line-height:1.5;
  color:var(--muted);
  margin:0;
}

section { margin-top:40px; }
.eyebrow + h2 { margin-top:6px; }
h2 {
  font-family:var(--serif);
  font-weight:500;
  font-size:24px;
  line-height:1.24;
  margin:6px 0 14px;
}
h3 { font-family:var(--serif); font-weight:500; font-size:20px; margin:22px 0 10px; }
p { margin:0 0 19px; }
p:last-child { margin-bottom:0; }
strong { font-weight:700; }
em { font-style:italic; }
a { color:var(--green-ink); text-decoration:underline; text-underline-offset:2px; }
[data-theme="dark"] a { color:var(--green); }
ol, ul { margin:0 0 19px; padding-left:22px; }
li { margin-bottom:8px; }

/* soft callout card */
.card {
  background:var(--green-tint);
  border:1px solid var(--green-line);
  border-radius:var(--radius);
  padding:22px 24px;
  margin:26px 0;
}
.card .label {
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  font-weight:700;
  color:var(--green-ink);
  margin-bottom:8px;
}
[data-theme="dark"] .card .label { color:var(--green); }
.card h3 { margin:0 0 12px; }
.card p:last-child { margin-bottom:0; }
.card ol, .card ul { margin-bottom:0; }

/* do-it-now activity */
.activity {
  border:1px solid var(--green-line);
  border-radius:var(--radius);
  padding:22px 24px;
  margin:30px 0;
  background:var(--green-tint);
}
.activity .label {
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  font-weight:700;
  color:var(--green-ink);
  margin-bottom:10px;
  display:flex;
  gap:10px;
  align-items:baseline;
  flex-wrap:wrap;
}
[data-theme="dark"] .activity .label { color:var(--green); }
.activity .time {
  letter-spacing:.04em;
  color:var(--green-ink);
  border:1px solid var(--green-line);
  border-radius:999px;
  padding:2px 8px;
  font-size:10px;
}
[data-theme="dark"] .activity .time { color:var(--green); }
.activity h3 { margin:0 0 12px; font-size:21px; }
.activity ol, .activity ul { margin-bottom:12px; }

/* score-it callout (warm) */
.score {
  border:1px solid var(--warm);
  border-radius:var(--radius);
  padding:20px 24px;
  margin:26px 0;
  background:var(--warm-soft);
}
.score .label {
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  font-weight:700;
  color:var(--warm);
  margin-bottom:8px;
}
.score p { font-size:16.5px; }
.score p:last-child { margin-bottom:0; }

/* pull quote */
.pull {
  font-family:var(--serif);
  font-weight:500;
  font-style:italic;
  font-size:clamp(21px,4.4vw,24px);
  line-height:1.36;
  color:var(--ink);
  border-left:3px solid var(--green);
  padding:2px 0 2px 20px;
  margin:30px 0;
}

/* numbered steps */
.steps { margin:22px 0 8px; padding:0; list-style:none; counter-reset:s; }
.steps > li {
  position:relative;
  padding-left:52px;
  margin:0 0 20px;
}
.steps > li:before {
  counter-increment:s;
  content:counter(s);
  position:absolute; left:0; top:1px;
  width:34px; height:34px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-weight:500; font-size:16px;
  color:var(--green-deep);
  background:var(--green-tint);
  border:1px solid var(--green-line);
  border-radius:50%;
}
[data-theme="dark"] .steps > li:before { color:var(--green); }
.steps .s-title { font-weight:700; display:block; margin-bottom:3px; }

.closing { margin-top:34px; font-family:var(--serif); font-size:19px; line-height:1.55; }
.cta {
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px 24px; margin:34px 0 0; text-align:center;
}
.cta p { font-size:16px; }
.cta p:last-child { margin-bottom:0; }
.cta-btn {
  display:inline-block; background:var(--green); color:#fff; text-decoration:none;
  padding:13px 26px; border-radius:999px; font-family:var(--sans);
  font-size:15px; font-weight:600; margin:4px 6px;
}
.cta-btn:hover { background:var(--green-ink); }
[data-theme="dark"] .cta-btn { color:#0B1F17; }
.cta-btn.ghost { background:transparent; color:var(--green-ink); border:2px solid var(--green); }
[data-theme="dark"] .cta-btn.ghost { color:var(--green); }

.next {
  margin-top:34px; padding-top:20px; border-top:1px solid var(--line);
  font-size:16px; color:var(--muted);
}
.next a { font-weight:500; }
.disclaimer { margin-top:26px; font-size:14px; line-height:1.6; color:var(--muted); }

/* day-to-day footer navigation */
.stagenav {
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  font-family:var(--sans);
  font-size:15px;
}
.stagenav a { text-decoration:none; font-weight:500; }
.stagenav a:hover { text-decoration:underline; }
.stagenav a.map { color:var(--muted); text-decoration:underline; }
@media (max-width:520px){
  .stagenav { flex-direction:column; align-items:flex-start; gap:10px; }
}

/* contents page day list */
.toc { list-style:none; margin:26px 0 0; padding:0; }
.toc li { margin:0; border-bottom:1px solid var(--line); }
.toc li:first-child { border-top:1px solid var(--line); }
.toc a {
  display:flex; gap:18px; align-items:baseline;
  padding:15px 4px; text-decoration:none; color:var(--ink);
}
.toc a:hover { background:var(--green-tint); }
.toc .d {
  font-family:var(--serif); font-weight:600; color:var(--green-ink);
  min-width:86px; white-space:nowrap;
}
[data-theme="dark"] .toc .d { color:var(--green); }
.toc .t { font-size:16.5px; }
.toc .m { margin-left:auto; color:var(--muted); font-size:13.5px; white-space:nowrap; }

/* access gate */
[data-gated] .bar, [data-gated] .wrap { display:none; }
.gatebox {
  max-width:440px; margin:12vh auto; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--radius);
  padding:38px 34px; text-align:center; font-family:var(--sans);
}
.gatebox .eyebrow { display:block; margin-bottom:4px; }
.gatebox h1 { font-size:26px; margin:8px 0 10px; }
.gatebox p { font-size:15.5px; color:var(--muted); }
.gatebox input {
  width:100%; padding:12px; border:1px solid var(--line); border-radius:10px;
  font-size:16px; margin:12px 0; text-align:center; background:var(--paper);
  color:var(--ink); font-family:var(--sans);
}
.gatebox input:focus-visible { outline:2px solid var(--green); }
.gatebox .err { color:#B4231A; font-size:14px; display:none; margin:0 0 8px; }
[data-theme="dark"] .gatebox .err { color:#F87171; }
.gatebox .cta-btn { border:none; cursor:pointer; font-size:15px; }

@media (prefers-reduced-motion:reduce){ * { transition:none !important; } }

/* ---------------------------------------------------------------
   Course progress (progress.js): slim day indicator + toc markers
--------------------------------------------------------------- */
.dayprog {
  max-width:var(--maxw);
  margin:14px auto 0;
  padding:0 22px;
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--sans);
}
.dayprog .dp-label {
  font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--green-ink); white-space:nowrap;
}
[data-theme="dark"] .dayprog .dp-label { color:var(--green); }
.dayprog .dp-track { display:flex; gap:5px; flex:1; max-width:220px; }
.dayprog .seg {
  height:5px; flex:1; border-radius:99px;
  background:var(--line);
}
.dayprog .seg.done { background:var(--green-line); }
.dayprog .seg.now { background:var(--green); }
.dayprog .dp-map {
  font-size:13px; color:var(--muted); text-decoration:underline;
  text-underline-offset:2px; margin-left:auto; white-space:nowrap;
}
.toc .tick {
  margin-left:auto; color:var(--green); font-weight:700; font-size:15px;
  border:1.5px solid var(--green-line); border-radius:50%;
  width:22px; height:22px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0; background:var(--green-tint);
}
.toc .here {
  margin-left:auto; flex-shrink:0;
  font-family:var(--sans); font-size:10.5px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:#fff; background:var(--green);
  padding:3px 10px; border-radius:999px;
}
[data-theme="dark"] .toc .here { color:#0B1F17; }
.toc .tick + .m, .toc .here + .m { margin-left:12px; }