/* Say It Just Once — The Broadsheet
   Token-driven palette (companion to Royalty Management Associates). */
:root{
  --paper:#FCFBF6; --ink:#191712; --ink-2:#4A463C; --ink-3:#8A8474;
  --line:#221F18; --hair:#D8D3C4; --accent:#8A2B2A; /* oxblood */
  --serif:"Playfair Display","Georgia","Times New Roman",serif;
  --body:"Charter","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:-apple-system,system-ui,"Segoe UI","Helvetica Neue",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.66;
  -webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:960px;margin:0 auto;padding:0 32px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;
  font-family:var(--sans);font-size:14px;padding:10px 16px;z-index:10}
.skip-link:focus{left:8px;top:8px}

/* ---- masthead ---- */
.masthead{text-align:center;padding:34px 0 0}
.kicker-top{font-family:var(--sans);font-size:11px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--accent);font-weight:700}
.title{font-family:var(--serif);font-weight:800;font-size:clamp(44px,8vw,84px);line-height:.96;
  letter-spacing:-.02em;margin:12px 0 10px}
.title a{text-decoration:none}
.subtitle{font-style:italic;font-size:19px;color:var(--ink-2)}
.rule-heavy{border-top:3px solid var(--line);border-bottom:1px solid var(--line);height:5px;margin:22px 0 0}
nav.masthead-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:0;
  border-bottom:1px solid var(--line)}
nav.masthead-nav a{font-family:var(--sans);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);text-decoration:none;padding:13px 22px;border-left:1px solid var(--hair)}
nav.masthead-nav a:first-child{border-left:none}
nav.masthead-nav a:hover,nav.masthead-nav a:focus-visible{color:var(--accent)}
nav.masthead-nav a.active{color:var(--accent);font-weight:700}
nav.masthead-nav a .ext{font-size:.9em}

/* ---- home: lead ---- */
.lead{padding:52px 0 40px;border-bottom:1px solid var(--hair);text-align:center}
.lead .dateline{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent);font-weight:700;margin-bottom:18px}
.lead .dateline a{text-decoration:none;border-bottom:1px solid var(--accent)}
.lead h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,4.4vw,44px);line-height:1.12;
  max-width:20ch;margin:0 auto 22px}
.lead p{color:var(--ink-2);font-size:19px;max-width:62ch;margin:0 auto 16px;text-align:left}
.lead .drop::first-letter{font-family:var(--serif);float:left;font-size:74px;line-height:.7;
  font-weight:800;padding:6px 12px 0 0;color:var(--accent)}

/* ---- home: article index ---- */
.index-label{text-align:center;font-family:var(--sans);font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ink-3);font-weight:700;padding:44px 0 6px}
.cols{columns:2;column-gap:56px;padding-bottom:24px}
@media(max-width:720px){.cols{columns:1}}
.entry{break-inside:avoid;padding:26px 0;border-top:1px solid var(--hair)}
.entry .no{font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:var(--accent);font-weight:700}
.entry h3{font-family:var(--serif);font-weight:700;font-size:24px;line-height:1.15;margin:8px 0 6px}
.entry a.h{text-decoration:none}
.entry:hover a.h,.entry a.h:focus-visible{color:var(--accent)}
.entry p{font-size:16px;color:var(--ink-2)}
.entry .pdf{font-family:var(--sans);font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent);text-decoration:none;font-weight:700;margin-top:10px;display:inline-block}
.entry .pdf:hover,.entry .pdf:focus-visible{text-decoration:underline}

/* ---- article page ---- */
.article{max-width:680px;margin:0 auto;padding:52px 0 8px}
.article .eyebrow{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent);font-weight:700;text-align:center;margin-bottom:16px}
.article h1{font-family:var(--serif);font-weight:800;font-size:clamp(30px,5vw,46px);line-height:1.08;
  letter-spacing:-.01em;text-align:center;margin:0 auto 14px;max-width:16ch}
.article .standfirst{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.4;
  color:var(--ink-2);text-align:center;max-width:34ch;margin:0 auto 26px}
.article .pdf-btn{display:inline-block;font-family:var(--sans);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;font-weight:700;color:var(--accent);text-decoration:none;
  border:1px solid var(--accent);border-radius:2px;padding:10px 18px}
.article .pdf-btn:hover,.article .pdf-btn:focus-visible{background:var(--accent);color:#fff}
.article .pdf-wrap{text-align:center;padding-bottom:20px;border-bottom:1px solid var(--hair);margin-bottom:38px}

.article p{margin:0 0 20px}
.article .body>p:first-of-type::first-letter{font-family:var(--serif);float:left;font-size:66px;
  line-height:.72;font-weight:800;padding:8px 12px 0 0;color:var(--accent)}
.article h2{font-family:var(--serif);font-weight:700;font-size:27px;line-height:1.2;
  margin:40px 0 14px;color:var(--ink)}
.article h3{font-family:var(--serif);font-weight:700;font-size:21px;margin:30px 0 10px}
.article ul,.article ol{margin:0 0 22px;padding-left:1.3em}
.article li{margin:0 0 10px}
.article blockquote{margin:26px 0;padding:6px 0 6px 24px;border-left:3px solid var(--accent);
  font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.4;color:var(--ink-2)}
.article blockquote cite{display:block;font-family:var(--sans);font-style:normal;font-size:13px;
  letter-spacing:.03em;color:var(--ink-3);margin-top:12px}
.article blockquote p{margin:0 0 8px}
.article .callout{font-family:var(--serif);font-weight:700;font-size:26px;line-height:1.25;
  text-align:center;color:var(--accent);margin:34px auto;max-width:26ch}
.article hr.sep{border:none;border-top:1px solid var(--hair);margin:34px 0}
.article .table-wrap{overflow-x:auto;margin:26px 0}
.article table{width:100%;border-collapse:collapse;font-size:16px}
.article th{font-family:var(--sans);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);text-align:left;padding:12px 14px;border-bottom:2px solid var(--line)}
.article td{padding:12px 14px;border-bottom:1px solid var(--hair);color:var(--ink-2)}
.article table tr td:first-child,.article table th:first-child{border-right:1px solid var(--hair)}
.article .figure{margin:34px 0;text-align:center}
.article .figure svg{max-width:100%;height:auto}
.article .figure figcaption{font-family:var(--sans);font-size:13px;color:var(--ink-3);margin-top:12px}

/* email-folder diagram (Underwhelmed) */
.folders{list-style:none;padding:0;margin:26px 0;border-top:1px solid var(--hair)}
.folders li{display:flex;gap:14px;align-items:baseline;padding:14px 4px;border-bottom:1px solid var(--hair);
  margin:0}
.folders .name{font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--accent);min-width:9.5em;flex-shrink:0}
.folders .desc{font-size:16px;color:var(--ink-2)}

/* article footer nav */
.article-foot{max-width:680px;margin:20px auto 0;padding-top:24px;border-top:3px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;
  font-family:var(--sans);font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;font-weight:700}
.article-foot a{color:var(--accent);text-decoration:none}
.article-foot a:hover,.article-foot a:focus-visible{text-decoration:underline}

footer{border-top:3px solid var(--line);text-align:center;padding:30px 0;margin-top:56px;
  font-family:var(--sans);font-size:12px;letter-spacing:.06em;color:var(--ink-3)}
footer a{color:var(--accent);text-decoration:none}
footer a:hover,footer a:focus-visible{text-decoration:underline}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
