:root {
  --ink:#17232a;
  --paper:#f7f9f9;
  --white:#fff;
  --gulf:#0e4b59;
  --signal:#8fd3e8;
  --muted:#66737a;
  --line:#d5dfe1;
  --soft:#e9f3f6;
  --serif:Georgia,'Times New Roman',serif;
  --sans:'Avenir Next',Avenir,'Segoe UI',Arial,Helvetica,sans-serif;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
a { color:inherit; }
.wrap { width:min(1180px,calc(100% - 48px)); margin:0 auto; }
.utility { background:var(--gulf); color:white; font-size:13px; }
.utility .wrap { min-height:40px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
header { background:white; border-bottom:1px solid var(--line); }
.masthead { min-height:112px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { display:flex; align-items:center; gap:14px; text-decoration:none; }
.brand-mark { width:42px; height:31px; flex:0 0 42px; border-top:7px solid var(--signal); border-bottom:5px solid var(--gulf); transform:skewX(-14deg); position:relative; }
.brand-mark::after { content:""; position:absolute; width:23px; height:5px; right:0; top:7px; background:var(--signal); }
.brand-name { font-weight:900; font-size:clamp(29px,4vw,45px); letter-spacing:-.055em; white-space:nowrap; }
.brand-name strong { color:var(--gulf); }
nav { display:flex; gap:22px; align-items:center; font-size:14px; font-weight:800; }
nav a { color:var(--gulf); text-decoration:none; padding:7px 0; }
nav a:hover,nav a:focus { box-shadow:inset 0 -3px var(--signal); outline:none; }
.story-hero { background:var(--white); }
.story-hero.image { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); }
.story-hero-copy { padding:clamp(42px,6vw,78px); display:flex; flex-direction:column; justify-content:center; }
.kicker { display:flex; align-items:center; gap:9px; color:var(--gulf); font-size:12px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.kicker::before { content:""; width:30px; height:3px; background:var(--signal); }
h1 { font-size:clamp(44px,6vw,76px); line-height:.99; letter-spacing:-.055em; margin:20px 0; }
.deck { font-family:var(--serif); font-size:21px; line-height:1.52; color:#3f4a50; }
.byline { margin-top:24px; color:var(--muted); font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.story-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.story-tags a { display:inline-flex; align-items:center; min-height:32px; padding:6px 11px; border:1px solid #a9c7cf; border-radius:999px; background:var(--soft); color:var(--gulf); font-size:13px; font-weight:800; line-height:1.2; text-decoration:none; }
.story-tags a:hover,.story-tags a:focus { background:var(--gulf); border-color:var(--gulf); color:white; outline:none; }
.hero-image { min-height:610px; position:relative; overflow:hidden; background:#dfe6e8; }
.hero-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.credit { position:absolute; left:16px; bottom:16px; background:rgba(7,38,45,.86); color:white; padding:7px 9px; font-size:11px; }
.data-hero { background:var(--ink); color:white; padding:clamp(55px,8vw,100px) 0; }
.data-hero .kicker { color:var(--signal); }
.data-hero h1 { max-width:900px; }
.data-hero .deck { max-width:800px; color:#dbe8ea; }
.data-hero .byline { color:#bacacc; }
.data-hero .story-tags a { background:rgba(143,211,232,.12); border-color:rgba(143,211,232,.7); color:white; }
.data-hero .story-tags a:hover,.data-hero .story-tags a:focus { background:var(--signal); border-color:var(--signal); color:var(--ink); }
.article { width:min(790px,calc(100% - 48px)); margin:0 auto; padding:65px 0 85px; }
.article p,.article li { font-family:var(--serif); font-size:19px; line-height:1.75; }
.article p { margin:0 0 25px; }
.article .lead::first-letter { float:left; color:var(--gulf); font-family:var(--sans); font-size:78px; font-weight:900; line-height:.8; padding:10px 10px 0 0; }
.article h2 { font-size:31px; line-height:1.1; letter-spacing:-.03em; margin:50px 0 18px; }
.number-callout { margin:38px 0; padding:27px 29px; background:var(--soft); border-left:7px solid var(--signal); }
.number-callout strong { display:block; color:var(--gulf); font-size:clamp(40px,7vw,65px); letter-spacing:-.05em; line-height:1; }
.number-callout span { display:block; margin-top:10px; font-family:var(--serif); font-size:18px; line-height:1.55; }
.sources { margin-top:52px; border-top:1px solid var(--line); padding-top:22px; color:var(--muted); font-size:13px; line-height:1.65; }
.sources strong { color:var(--ink); }
.sources a { color:var(--gulf); font-weight:800; }
.listicle { width:min(900px,calc(100% - 48px)); }
.listicle-item { display:grid; grid-template-columns:220px minmax(0,1fr); gap:42px; padding:44px 0; border-bottom:1px solid var(--line); }
.listicle-number { align-self:start; border-top:7px solid var(--gulf); padding-top:15px; }
.listicle-number span { display:block; color:var(--muted); font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.listicle-number strong { display:block; color:var(--gulf); font-size:54px; line-height:.95; letter-spacing:-.045em; margin-top:11px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.listicle-copy { min-width:0; }
.listicle-copy h2 { margin:0 0 20px; font-size:clamp(28px,4vw,39px); line-height:1.06; }
.listicle-copy .data-note { border-left:4px solid var(--signal); padding:12px 0 12px 17px; color:var(--muted); font-family:var(--sans); font-size:14px; line-height:1.55; }
.conclusion { margin-top:50px; }
.related-reading { margin-top:45px; padding:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-family:var(--serif); font-size:17px; line-height:1.65; }
.related-reading a { color:var(--gulf); font-weight:800; }
.page-intro { padding:65px 0 35px; }
.page-intro h1 { max-width:850px; }
.page-intro p { max-width:720px; color:#445158; font-family:var(--serif); font-size:20px; line-height:1.55; }
.search-panel { background:white; border-top:7px solid var(--gulf); padding:25px; display:grid; grid-template-columns:1fr 220px; gap:18px; }
.search-panel label { display:block; color:var(--gulf); font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; }
.search-panel input,.search-panel select { width:100%; min-height:48px; border:1px solid #aebcc0; background:white; color:var(--ink); padding:10px 12px; font:inherit; font-size:16px; }
.topic-hubs { display:flex; flex-wrap:wrap; gap:10px; padding:22px 0 0; }
.topic-hubs a { display:inline-flex; align-items:center; min-height:38px; padding:8px 13px; border:1px solid #a9c7cf; border-radius:999px; background:white; color:var(--gulf); font-size:14px; font-weight:800; text-decoration:none; }
.topic-hubs a:hover,.topic-hubs a:focus { background:var(--gulf); border-color:var(--gulf); color:white; outline:none; }
.archive-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; padding:35px 0 80px; }
.archive-card { background:white; border-top:6px solid var(--gulf); padding:28px; }
.archive-card[data-featured="true"] { grid-column:1 / -1; display:grid; grid-template-columns:1.1fr .9fr; gap:35px; align-items:center; }
.archive-card img { width:100%; height:240px; object-fit:cover; }
.archive-card .category { color:var(--gulf); font-size:11px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.archive-card h2 { font-size:clamp(28px,4vw,42px); line-height:1.04; letter-spacing:-.04em; margin:12px 0; }
.archive-card p { color:#4d5b61; font-family:var(--serif); font-size:17px; line-height:1.55; }
.archive-card .meta { color:var(--muted); font-size:12px; margin:15px 0 20px; }
.archive-card .read { display:inline-block; background:var(--gulf); color:white; padding:11px 14px; font-weight:900; text-decoration:none; }
.archive-card[hidden] { display:none; }
.empty { display:none; padding:40px 0 80px; color:var(--muted); font-size:18px; }
.about-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr); gap:70px; padding:65px 0 85px; }
.about-grid article p { font-family:var(--serif); font-size:20px; line-height:1.7; }
.about-grid article h2 { color:var(--ink); font-size:30px; line-height:1.1; letter-spacing:-.025em; margin:44px 0 14px; }
.about-grid article h2:first-child { margin-top:0; }
.publisher-note { margin-top:48px; padding:23px 25px; background:var(--soft); border-left:6px solid var(--signal); }
.publisher-note strong { display:block; color:var(--gulf); font-size:12px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.publisher-note p { margin:10px 0 0; font-size:17px !important; line-height:1.6 !important; }
.about-grid aside { border-top:7px solid var(--gulf); padding-top:20px; }
.about-grid aside h2 { color:var(--gulf); font-size:14px; letter-spacing:.1em; text-transform:uppercase; }
.about-grid aside li { margin-bottom:10px; line-height:1.5; }
.newsletter-signup { background:var(--ink); color:white; padding:44px 0; border-top:8px solid var(--signal); }
.newsletter-signup .wrap { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); gap:58px; align-items:center; }
.newsletter-kicker { color:var(--signal); font-size:11px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.newsletter-signup h2 { max-width:620px; margin:11px 0 12px; font-size:clamp(32px,4.2vw,50px); line-height:1.02; letter-spacing:-.045em; }
.newsletter-signup p { max-width:610px; margin:0; color:#d4e3e6; font-family:var(--serif); font-size:17px; line-height:1.55; }
.signup-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; }
.signup-form label { grid-column:1 / -1; color:#d4e3e6; font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.signup-form input[type="email"] { width:100%; min-height:52px; margin-top:8px; border:2px solid transparent; border-radius:0; background:white; color:var(--ink); padding:12px 14px; font:inherit; font-size:16px; }
.signup-form input[type="email"]:focus { border-color:var(--signal); outline:3px solid rgba(143,211,232,.25); outline-offset:2px; }
.signup-form button { min-height:52px; border:0; border-radius:0; background:var(--signal); color:var(--ink); padding:12px 19px; font:inherit; font-weight:900; cursor:pointer; }
.signup-form button:hover,.signup-form button:focus { background:white; outline:3px solid var(--signal); outline-offset:2px; }
.signup-note { grid-column:1 / -1; color:#a9c4ca !important; font-family:var(--sans) !important; font-size:12px !important; line-height:1.4 !important; }
.signup-result { grid-column:1 / -1; width:100%; height:0; border:0; color-scheme:light; transition:height .2s ease; }
.signup-form.has-submitted .signup-result { height:72px; }
.hp-field { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; overflow:hidden !important; opacity:0 !important; pointer-events:none !important; }
footer { background:var(--gulf); color:white; padding:42px 0; }
footer .wrap { display:flex; justify-content:space-between; gap:25px; align-items:end; }
footer strong { font-size:29px; }
footer span { color:#c8e0e5; font-size:12px; }
@media (max-width:900px) {
  .masthead { display:block; padding:25px 0; }
  nav { margin-top:20px; flex-wrap:wrap; }
  .story-hero.image,.about-grid { grid-template-columns:1fr; }
  .hero-image { min-height:500px; grid-row:1; }
  .archive-card[data-featured="true"] { grid-template-columns:1fr; }
  .listicle-item { grid-template-columns:190px minmax(0,1fr); gap:30px; }
  .listicle-number strong { font-size:47px; }
  .newsletter-signup .wrap { grid-template-columns:1fr; gap:28px; }
}
@media (max-width:650px) {
  .wrap,.article { width:min(100% - 28px,1180px); }
  .utility span:first-child { display:none; }
  .brand-name { font-size:27px; }
  .brand-mark { display:none; }
  nav { gap:12px 17px; font-size:13px; }
  .story-hero-copy { padding:35px 22px 45px; }
  h1 { font-size:44px; }
  .deck { font-size:19px; }
  .article { padding-top:42px; }
  .article p,.article li { font-size:18px; }
  .search-panel { grid-template-columns:1fr; }
  .archive-grid { grid-template-columns:1fr; }
  .archive-card[data-featured="true"] { grid-column:auto; }
  .listicle { width:min(100% - 28px,900px); }
  .listicle-item { grid-template-columns:1fr; gap:20px; padding:38px 0; }
  .listicle-number { width:100%; }
  .newsletter-signup { padding:40px 0; }
  .signup-form { grid-template-columns:1fr; }
  .signup-form button { width:100%; }
  footer .wrap { display:block; }
  footer span { display:block; margin-top:10px; }
}
