:root{
--ink:#12202E;
--ink-soft:#42535F;
--paper:#F4F6F5;
--card:#FFFFFF;
--rule:#CBD5D3;
--rule-soft:#E3E9E7;
--brass:#A9761F;
--brass-soft:#F2E7CE;
--mint:#16705B;
--link:#0E5A78;
--font-display:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--font-body:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;
--font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
}

*,*::before,*::after{box-sizing:border-box}

html,body{
max-width:100%;
overflow-x:hidden;
overscroll-behavior-x:none;
}

body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:var(--font-body);
font-size:18px;
line-height:1.65;
-webkit-text-size-adjust:100%;
}

img{max-width:100%;height:auto;display:block}

a{color:var(--link);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--brass)}
a:focus-visible,summary:focus-visible,.cta:focus-visible{outline:3px solid var(--brass);outline-offset:2px}

.wrap{width:100%;max-width:960px;margin:0 auto;padding:0 20px}

.masthead{background:var(--ink);border-bottom:1px solid #22384A}
.masthead__in{display:flex;align-items:center;gap:14px;min-height:60px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:#FFFFFF;font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;font-size:15px}
.brand img{border-radius:6px}
.brand:hover{color:var(--brass-soft)}
.masthead__nav{display:flex;gap:20px;margin-left:auto;font-family:var(--font-display);font-size:14px;font-weight:600}
.masthead__nav a{color:#C6D2DA;text-decoration:none}
.masthead__nav a:hover{color:#FFFFFF}

.btn{
display:inline-block;
font-family:var(--font-display);
font-weight:700;
font-size:16px;
text-decoration:none;
padding:14px 26px;
border-radius:999px;
border:2px solid transparent;
text-align:center;
}
.btn--primary{background:var(--brass);color:#12202E;border-color:var(--brass)}
.btn--primary:hover{background:#C48C2C;color:#12202E}
.btn--ghost{background:transparent;color:#FFFFFF;border-color:#4A6072}
.btn--ghost:hover{background:#1C3145;color:#FFFFFF;border-color:#7C93A5}
.btn--sm{padding:9px 18px;font-size:14px}

.btn-mini{
display:block;
width:fit-content;
margin-top:9px;
font-family:var(--font-display);
font-size:11.5px;
font-weight:700;
letter-spacing:.02em;
text-decoration:none;
color:#12202E;
background:var(--brass);
padding:5px 12px;
border-radius:999px;
white-space:nowrap;
}
.btn-mini:hover{background:#C48C2C;color:#12202E}

.hero{background:var(--ink);color:#EDF1F4;padding:38px 0 42px}
.hero__in{display:grid;grid-template-columns:1fr;gap:24px;align-items:center}
.hero__text{min-width:0}

h1{
font-family:var(--font-display);
font-size:clamp(28px,5.6vw,42px);
line-height:1.12;
letter-spacing:-.022em;
font-weight:800;
margin:0 0 14px;
color:var(--ink);
}
.hero h1{color:#FFFFFF}

.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0}
.chips li{
font-family:var(--font-mono);
font-size:12px;
letter-spacing:.03em;
color:var(--brass-soft);
background:#1B3044;
border:1px solid #2E4759;
border-radius:999px;
padding:6px 13px;
}

.lede{margin:0 0 14px;font-size:17px;line-height:1.6;color:#D5DEE5}

.byline{
margin:0 0 20px;
font-family:var(--font-mono);
font-size:12.5px;
line-height:1.5;
letter-spacing:.01em;
color:#93A6B4;
padding-top:13px;
border-top:1px solid #2E4759;
}

.cta-row{margin:0;display:flex;flex-wrap:wrap;gap:12px}

.hero__media{margin:0}
.hero__media img{
width:100%;
aspect-ratio:1/1;
object-fit:cover;
border-radius:16px;
border:1px solid #2E4759;
}

.fig{margin:6px 0 20px;width:100%;max-width:340px}
.fig img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--rule);border-radius:10px;display:block}

.toc{
background:var(--card);
border:1px solid var(--rule);
border-left:3px solid var(--brass);
border-radius:2px;
padding:0 16px;
margin:0 0 34px;
}
.toc summary{
cursor:pointer;
font-family:var(--font-mono);
font-size:12px;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--ink-soft);
padding:13px 0;
}
.toc ol{margin:0 0 14px;padding-left:22px;font-size:15.5px}
.toc li{margin:6px 0}

.prose{padding-bottom:40px}
.legal{padding-top:36px;padding-bottom:56px}
.legal h1{margin-bottom:10px}
.legal h2{font-size:clamp(20px,3vw,25px)}
.legal p{max-width:72ch}
.legal strong{font-weight:700}

.updated{
font-family:var(--font-mono);
font-size:12px;
letter-spacing:.04em;
text-transform:uppercase;
color:var(--ink-soft);
padding-bottom:16px;
margin:0 0 8px;
border-bottom:1px solid var(--rule);
}

.author--page{margin:0 0 8px}
.prose h2,.prose h3,.table-wrap,.author,.prose .cta-row{clear:both}
.prose h2{
font-family:var(--font-display);
font-size:clamp(22px,3.6vw,29px);
line-height:1.2;
letter-spacing:-.017em;
font-weight:800;
margin:44px 0 14px;
padding-top:18px;
border-top:2px solid var(--ink);
}
.prose h3{
font-family:var(--font-display);
font-size:19px;
line-height:1.3;
letter-spacing:-.008em;
font-weight:700;
margin:30px 0 10px;
color:#22384A;
}
.prose p{margin:0 0 16px;max-width:66ch}
.prose .cta-row{margin:28px 0 0}
.prose .btn--primary{background:var(--ink);color:#FFFFFF;border-color:var(--ink)}
.prose .btn--primary:hover{background:#1B2F42;color:#FFFFFF}

.table-wrap{
overflow-x:auto;
overscroll-behavior-x:contain;
-webkit-overflow-scrolling:touch;
margin:20px 0 22px;
border:1px solid var(--rule);
border-radius:2px;
background:var(--card);
}
table{border-collapse:collapse;width:100%;font-family:var(--font-display);font-size:14.5px;line-height:1.45}
caption{text-align:left}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--rule-soft);vertical-align:top}
thead th{
background:var(--ink);
color:#FFFFFF;
font-family:var(--font-mono);
font-size:11px;
letter-spacing:.07em;
text-transform:uppercase;
font-weight:600;
border-bottom:none;
}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:none}
tbody th{font-weight:600}

.t-formats td{font-family:var(--font-mono);font-size:13px;letter-spacing:.02em;white-space:nowrap}
.t-formats .yes{color:var(--mint);font-weight:600}
.t-formats .no{color:#9AA7AD}

.t-bands td{min-width:230px}
.t-bands b{font-family:var(--font-mono);font-size:13.5px;font-weight:600;display:block;margin-top:7px;letter-spacing:.01em}
.band{display:block;position:relative;height:7px;background:var(--brass-soft);border-radius:1px}
.band i{position:absolute;top:0;bottom:0;background:var(--brass);border-radius:1px}
.band-a i{left:55.6%;width:44.4%}
.band-b i{left:27.8%;width:27.8%}
.band-c i{left:11.1%;width:27.8%}
.band-d i{left:0;width:22.2%}

.t-compare{font-size:13.5px}
.t-compare th[scope="row"]{font-family:var(--font-display);font-weight:700;white-space:nowrap}
.t-compare .num{font-family:var(--font-mono);font-size:13px;white-space:nowrap}
.t-compare td{min-width:120px}
.t-compare tbody tr.is-focus{background:var(--brass-soft)}
.t-compare tbody tr.is-focus th[scope="row"]{box-shadow:inset 3px 0 0 var(--brass)}

.t-swot td{min-width:190px}
.t-swot td:first-child{color:var(--mint)}
.t-swot td:nth-child(2){color:#8A3B24}
.t-swot td:last-child{color:var(--ink-soft)}

.faq h3{
margin:26px 0 8px;
padding-left:14px;
border-left:3px solid var(--brass);
}

.author{
display:grid;
grid-template-columns:1fr;
gap:18px;
background:var(--card);
border:1px solid var(--rule);
border-radius:2px;
padding:20px;
margin-top:8px;
}
.author__photo{
width:112px;
height:112px;
border-radius:50%;
object-fit:cover;
border:2px solid var(--brass-soft);
}
.author__body p{margin:0 0 12px}
.author__name{font-family:var(--font-display);font-size:16px}
.verified{
font-family:var(--font-mono);
font-size:12px;
color:var(--ink-soft);
letter-spacing:.01em;
margin-bottom:0;
}

.foot{border-top:1px solid var(--rule);background:var(--card);padding:22px 0 30px}
.foot__in{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;justify-content:space-between}
.foot__nav{display:flex;flex-wrap:wrap;gap:10px 20px;font-family:var(--font-display);font-size:14px}
.foot__note{margin:0;font-family:var(--font-mono);font-size:12px;color:var(--ink-soft)}

@media (min-width:800px){
.fig{width:240px;max-width:240px;margin-top:7px;margin-bottom:10px}
.fig--right{float:right;margin-left:32px}
.fig--left{float:left;margin-right:32px}
}

@media (max-width:799px){
.fig{max-width:300px;margin:18px auto 22px}
}

@media (min-width:860px){
.hero{padding:52px 0 56px}
.hero__in{max-width:1120px;grid-template-columns:400px minmax(0,1fr);gap:52px;align-items:center}
h1{font-size:clamp(30px,3.4vw,38px)}
.hero__media{grid-column:1;grid-row:1}
.hero__text{grid-column:2;grid-row:1}
.lede{font-size:18px}
.author{grid-template-columns:112px 1fr;gap:24px;padding:26px}
}

@media (max-width:640px){
.masthead__nav{display:none}
.masthead .btn--sm{margin-left:auto}
}

@media (max-width:520px){
body{font-size:17px}
.lede{font-size:16.5px;line-height:1.55}
.hero{padding:20px 0 24px}
.hero__in{gap:20px}
h1{margin-bottom:12px}
.chips{margin-bottom:14px;gap:6px}
.chips li{font-size:11px;padding:5px 10px}
.byline{margin-bottom:16px;padding-top:11px}
.btn{display:block;width:100%;padding:15px 18px}
.masthead .btn--sm{display:inline-block;width:auto;padding:8px 15px;font-size:13px;border-width:1px}
.masthead__in{min-height:54px;gap:10px}
.hero__media img{max-width:250px;margin:0 auto;border-radius:12px}
.prose h2,.prose h3,.table-wrap,.author,.prose .cta-row{clear:both}
.prose h2{margin-top:34px}
}

@media (max-width:380px){
h1{font-size:25px}
.lede{font-size:15.5px;line-height:1.5}
.hero{padding:16px 0 20px}
.masthead__in{min-height:52px}
.brand span{font-size:14px}
.masthead .btn--sm{padding:7px 12px;font-size:12.5px}
}

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