:root{
  --paper:#fff7ef;
  --ink:#1d1a17;
  --muted:#6f645b;
  --rule:#d6c8b8;
  --accent:#b0472d;
  --accent-dark:#742d1f;
  --blue:#15384f;
  --cream:#fffaf2;
  --panel:#f4eadc;
  --shadow:0 22px 70px rgba(79,50,23,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,'Times New Roman',serif;line-height:1.52}
a{color:inherit;text-decoration:none}
.progress{position:fixed;z-index:20;top:0;left:0;right:0;height:4px;background:rgba(0,0,0,.08)}
.progress span{display:block;height:100%;width:0;background:var(--accent)}
.masthead{padding:28px clamp(18px,5vw,68px) 72px;border-bottom:1px solid var(--rule);background:linear-gradient(180deg,#fff2e3,var(--paper))}
.nav{display:flex;justify-content:space-between;align-items:center;gap:24px;max-width:1180px;margin:0 auto 74px;font-family:Arial,Helvetica,sans-serif}
.brand{font-weight:800;letter-spacing:-.03em;font-size:22px;border-bottom:3px solid var(--accent);padding-bottom:3px}
.nav-links{display:flex;gap:22px;color:var(--muted);font-size:14px;font-weight:700}
.nav-links a:hover{color:var(--accent-dark)}
.hero{max-width:980px;margin:0 auto;text-align:center}
.label{font-family:Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:800;color:var(--accent);margin:0 0 18px}
h1{font-size:clamp(54px,8vw,108px);line-height:.92;letter-spacing:-.075em;margin:0 0 26px;font-weight:900}
.standfirst{font-size:clamp(22px,3vw,34px);line-height:1.18;color:#302a24;margin:0 auto 24px;max-width:900px}
.byline{font-family:Arial,Helvetica,sans-serif;font-size:14px;color:var(--muted)}
.article{max-width:900px;margin:0 auto;padding:62px clamp(18px,4vw,44px)}
.section{margin:0 0 66px}
.section p{font-size:21px;margin:0 0 22px;color:#2c2722}
.dropcap:first-letter{float:left;font-size:82px;line-height:.82;padding:8px 10px 0 0;color:var(--accent);font-weight:900}
h2{font-size:clamp(34px,4.5vw,56px);line-height:1;letter-spacing:-.055em;margin:0 0 24px;font-weight:900}
h3{font-size:24px;line-height:1.12;margin:0 0 12px;font-weight:900}
.pullquote{max-width:1100px;margin:14px auto 76px;padding:46px clamp(24px,5vw,68px);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);text-align:center}
.pullquote p{font-size:clamp(34px,5vw,64px);line-height:1.02;letter-spacing:-.06em;margin:0;font-weight:900;color:var(--accent-dark)}
.interactive{max-width:1100px;margin:0 auto 78px;padding:34px;background:var(--panel);border:1px solid var(--rule);box-shadow:var(--shadow);display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;align-items:stretch}
.interactive h2{margin-bottom:16px}
.interactive-copy p:not(.label){font-size:19px;color:#40382f;margin:0}
.panel{background:var(--cream);border:1px solid var(--rule);padding:26px;min-height:320px;display:flex;flex-direction:column}
.panel label{font-family:Arial,Helvetica,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--muted);margin-bottom:10px}
input[type=range]{width:100%;accent-color:var(--accent)}
.scale{display:flex;justify-content:space-between;font-family:Arial,Helvetica,sans-serif;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em;margin:6px 0 18px}
.choices{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.chip{font-family:Arial,Helvetica,sans-serif;border:1px solid var(--rule);background:#fff;border-radius:999px;padding:9px 12px;cursor:pointer;color:#3d342c;font-weight:700}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.result{border-left:4px solid var(--accent);background:#fff;padding:20px 20px 18px;flex:1;box-shadow:0 8px 24px rgba(56,35,15,.06)}
.result h3{font-size:28px;margin-bottom:8px;color:var(--accent-dark)}
.result p{font-size:19px;margin:0;color:#332b24}
.grid-section{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start;max-width:1100px;margin-left:50%;transform:translateX(-50%);width:min(1100px,calc(100vw - 36px))}
.note-card{background:var(--blue);color:#fff;padding:30px;border-radius:2px;position:sticky;top:28px;box-shadow:var(--shadow)}
.note-card p{color:#f3eadf;font-size:22px;margin:0}
.note-card h3{color:#fff;font-size:30px}
.nudge{background:#1e1a17;color:#fff;margin-left:50%;transform:translateX(-50%);width:min(1100px,calc(100vw - 36px));padding:42px;border-radius:2px;box-shadow:var(--shadow)}
.nudge p{color:#f1e7dc}
.nudge h2{color:#fff}
.closing{border-top:1px solid var(--ink);padding-top:42px}
.footer{border-top:1px solid var(--rule);padding:28px clamp(18px,5vw,68px);display:flex;justify-content:space-between;gap:20px;font-family:Arial,Helvetica,sans-serif;color:var(--muted);background:#fff2e3}
.footer p{margin:0}.footer a{font-weight:800;color:var(--accent-dark)}
@media(max-width:820px){.nav-links{display:none}.nav{margin-bottom:48px}.article{padding-top:42px}.interactive,.grid-section{grid-template-columns:1fr}.note-card{position:static}.section p{font-size:19px}.pullquote{margin-bottom:54px}.interactive{padding:22px}.nudge{padding:28px}h1{font-size:58px}.standfirst{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}