/* US In News — 2022-structure news layout.
   Hard edges (90deg), zero-blur offset shadows, WCAG AA contrast, light+dark. */

:root {
  --ink:      #16150f;
  --ink-2:    #494741;
  --ink-3:    #6f6c64;
  --paper:    #ffffff;
  --paper-2:  #f4f2ed;
  --rule:     #d8d4cb;
  --accent:   #a8261b;   /* masthead red — 6.1:1 on white */
  --accent-2: #7d1a12;
  --strip:    #16150f;
  --strip-ink:#f4f2ed;
  --shadow:   3px 3px 0 var(--ink);
}
@media (prefers-color-scheme: dark) {
  :root {
    --ink: #eeebe4; --ink-2: #bdb9b0; --ink-3: #8e8a82;
    --paper: #14130f; --paper-2: #1d1c17; --rule: #34322c;
    --accent: #e8624f; --accent-2: #f08b7b;
    --strip: #0b0a08; --strip-ink: #eeebe4;
    --shadow: 3px 3px 0 #000;
  }
}
:root[data-theme="dark"] {
  --ink: #eeebe4; --ink-2: #bdb9b0; --ink-3: #8e8a82;
  --paper: #14130f; --paper-2: #1d1c17; --rule: #34322c;
  --accent: #e8624f; --accent-2: #f08b7b;
  --strip: #0b0a08; --strip-ink: #eeebe4; --shadow: 3px 3px 0 #000;
}
:root[data-theme="light"] {
  --ink: #16150f; --ink-2: #494741; --ink-3: #6f6c64;
  --paper: #ffffff; --paper-2: #f4f2ed; --rule: #d8d4cb;
  --accent: #a8261b; --accent-2: #7d1a12;
  --strip: #16150f; --strip-ink: #f4f2ed; --shadow: 3px 3px 0 var(--ink);
}

* { box-sizing: border-box; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font: 400 17px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
a { color: inherit; }
.vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip {
  position:absolute; left:-9999px; top:0; background:var(--accent); color:#fff;
  padding:10px 16px; z-index:100;
}
.skip:focus { left:0; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

/* ---------- topic strip ---------- */
.topic-strip { background: var(--strip); color: var(--strip-ink); font-size: 13px; }
.topic-strip .wrap { display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:38px; flex-wrap:wrap; }
.topic-strip ul { display:flex; gap:18px; list-style:none; margin:0; padding:0; flex-wrap:wrap; }
.topic-strip a { text-decoration:none; opacity:.88; }
.topic-strip a:hover { opacity:1; text-decoration:underline; }
.topic-strip .today { color:#a5a099; white-space:nowrap; }

/* ---------- masthead ---------- */
.masthead { border-bottom: 1px solid var(--rule); background: var(--paper); }
.masthead .wrap { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-top:22px; padding-bottom:22px; flex-wrap:wrap; }
.logo {
  font: 800 40px/1 Georgia, "Times New Roman", serif;
  letter-spacing:-.02em; text-decoration:none; color:var(--ink);
}
.logo span { color: var(--accent); }
.search { display:flex; gap:0; }
.search input {
  border:2px solid var(--ink); background:var(--paper); color:var(--ink);
  padding:9px 12px; font-size:14px; min-width:210px; border-radius:0;
}
.search button {
  border:2px solid var(--ink); border-left:0; background:var(--ink); color:var(--paper);
  padding:9px 16px; font-size:14px; font-weight:600; cursor:pointer; border-radius:0;
}

/* ---------- primary nav ---------- */
.primary { background: var(--accent); border-bottom: 3px solid var(--accent-2); }
.primary > .wrap { padding:0; }
.primary ul { display:flex; list-style:none; margin:0; padding:0; flex-wrap:wrap; }
.primary li { position:relative; }
.primary > .wrap > ul > li > a {
  display:block; padding:13px 15px; color:#fff; text-decoration:none;
  font-size:14px; font-weight:600; letter-spacing:.02em; text-transform:uppercase;
}
.primary > .wrap > ul > li > a:hover,
.primary > .wrap > ul > li > a[aria-current="page"] { background: var(--accent-2); }
.primary .sub {
  display:none; position:absolute; left:0; top:100%; z-index:40;
  background: var(--paper); border:2px solid var(--ink); box-shadow: var(--shadow);
  min-width:210px; padding:6px 0;
}
.primary li:hover > .sub, .primary li:focus-within > .sub { display:block; }
.primary .sub li a {
  display:block; padding:8px 14px; font-size:14px; text-decoration:none; color:var(--ink);
}
.primary .sub li a:hover { background: var(--paper-2); color: var(--accent); }

/* ---------- home layout ---------- */
.lead-grid { display:grid; grid-template-columns: 2fr 1fr; gap:32px; margin:28px 0 8px; }
.module { margin: 34px 0; }
.module > h2 {
  font: 800 15px/1 -apple-system, BlinkMacSystemFont, sans-serif;
  text-transform:uppercase; letter-spacing:.09em; margin:0 0 16px;
  padding-bottom:9px; border-bottom:3px solid var(--ink);
}
.module > h2 a { text-decoration:none; }
.cards { display:grid; grid-template-columns: repeat(auto-fill, minmax(250px,1fr)); gap:26px; }

.card a.thumb { display:block; background:var(--paper-2); border:1px solid var(--rule); aspect-ratio:16/9; }
.card h3 { font:700 18px/1.32 Georgia, serif; margin:11px 0 6px; }
.card h3 a { text-decoration:none; }
.card h3 a:hover { color:var(--accent); }
.card .meta { font-size:12.5px; color:var(--ink-3); }
.cat-badge {
  display:inline-block; background:var(--accent); color:#fff; font-size:11px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; text-decoration:none;
}

.newsfeed { list-style:none; margin:0; padding:0; }
.newsfeed li { display:flex; gap:13px; padding:13px 0; border-bottom:1px solid var(--rule); }
.newsfeed li:last-child { border-bottom:0; }
.newsfeed .n { font:800 20px/1 Georgia,serif; color:var(--accent); min-width:26px; }
.newsfeed h3 { font:600 15px/1.35 -apple-system,sans-serif; margin:0 0 3px; }
.newsfeed h3 a { text-decoration:none; }
.newsfeed h3 a:hover { color:var(--accent); }
.newsfeed .meta { font-size:12px; color:var(--ink-3); }

/* ---------- empty state (no fake data) ---------- */
.empty {
  border:2px dashed var(--rule); padding:34px 26px; text-align:center; color:var(--ink-2);
}
.empty strong { display:block; font:700 17px/1.3 Georgia,serif; color:var(--ink); margin-bottom:7px; }

/* ---------- article ---------- */
.article { max-width: 720px; margin: 30px auto; }
.article h1 { font:800 clamp(30px,4.6vw,44px)/1.14 Georgia,serif; letter-spacing:-.015em; margin:12px 0 14px; text-wrap:balance; }
.article .dek { font-size:20px; line-height:1.5; color:var(--ink-2); margin:0 0 18px; }
.article .byline { display:flex; gap:14px; flex-wrap:wrap; font-size:13.5px; color:var(--ink-3); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:12px 0; margin-bottom:24px; }
.article .body > * { margin: 0 0 22px; }
.article .body p { font-size:18.5px; line-height:1.68; }
.article .body h2 { font:700 26px/1.28 Georgia,serif; margin-top:38px; }
.article .body h3 { font:700 21px/1.3 Georgia,serif; margin-top:30px; }
.breadcrumb { font-size:13px; color:var(--ink-3); }
.breadcrumb a { color:var(--ink-3); }

/* ---------- footer ---------- */
.site-footer { background: var(--strip); color: var(--strip-ink); margin-top:56px; padding:40px 0 26px; }
.site-footer .cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:30px; }
.site-footer h2 { font:800 13px/1 sans-serif; text-transform:uppercase; letter-spacing:.09em; margin:0 0 13px; color:#fff; }
.site-footer ul { list-style:none; margin:0; padding:0; }
.site-footer li { margin-bottom:7px; font-size:14px; }
.site-footer a { color:#cfcac2; text-decoration:none; }
.site-footer a:hover { color:#fff; text-decoration:underline; }
.site-footer p { color:#a5a099; font-size:14px; margin:0; }
.copyright { border-top:1px solid #2e2c26; margin-top:28px; padding-top:18px; font-size:13px; }

@media (max-width: 860px) {
  .lead-grid { grid-template-columns:1fr; gap:24px; }
  .logo { font-size:32px; }
  .primary > .wrap > ul > li > a { padding:11px 12px; font-size:13px; }
  .primary .sub { position:static; display:block; border:0; box-shadow:none; background:transparent; padding:0; }
  .primary .sub li a { color:#fff; padding-left:30px; opacity:.9; }
}
@media print {
  .site-header, .site-footer, .search, .skip { display:none; }
  body { color:#000; background:#fff; }
}

/* ---------- HTML site index ---------- */
.sitemap-list { list-style:none; margin:0 0 26px; padding:0; }
.sitemap-list li { padding:7px 0; border-bottom:1px solid var(--rule); font-size:15px; }
.sitemap-list li:last-child { border-bottom:0; }
.sitemap-list a { text-decoration:none; }
.sitemap-list a:hover { color:var(--accent); text-decoration:underline; }
.sitemap-list .meta { color:var(--ink-3); font-size:12.5px; margin-left:8px; }
.module section h2 { font:700 17px/1.3 Georgia,serif; text-transform:none; letter-spacing:0;
  border-bottom:2px solid var(--rule); margin:26px 0 10px; padding-bottom:7px; }
.module section h2 a { text-decoration:none; }

/* ---------- author card ---------- */
.author-card {
  display:flex; gap:18px; align-items:flex-start;
  border:2px solid var(--ink); background:var(--paper-2);
  box-shadow:var(--shadow); padding:20px; margin:36px 0 10px;
}
.author-card .avatar {
  flex:none; width:62px; height:62px; background:var(--accent); color:#fff;
  font:800 22px/62px Georgia,serif; text-align:center; letter-spacing:.02em;
}
.author-card h2 { font:700 19px/1.25 Georgia,serif; margin:0 0 3px; text-transform:none; letter-spacing:0; border:0; padding:0; }
.author-card h2 a { text-decoration:none; }
.author-card h2 a:hover { color:var(--accent); }
.author-meta { font:600 11.5px/1 ui-monospace,Menlo,monospace; letter-spacing:.07em;
  text-transform:uppercase; color:var(--ink-3); margin:0 0 10px; }
.author-bio { font-size:14.5px; line-height:1.6; color:var(--ink-2); margin:0 0 8px; }
.author-method { font-size:13.5px; line-height:1.55; color:var(--ink-3); margin:0;
  border-top:1px solid var(--rule); padding-top:9px; }
@media (max-width:600px){ .author-card { flex-direction:column; } }
.cred-list { list-style:none; margin:0 0 20px; padding:0; }
.cred-list li { padding:7px 0 7px 18px; border-bottom:1px solid var(--rule); font-size:14.5px; position:relative; }
.cred-list li::before { content:"—"; position:absolute; left:0; color:var(--accent); }
.cred-list li:last-child { border-bottom:0; }
.author-resp { font-size:15px; line-height:1.6; color:var(--ink-2); border-left:3px solid var(--accent);
  padding:2px 0 2px 16px; margin:0 0 24px; }

/* ---------- article video ---------- */
.article-video { margin:26px 0 30px; border:2px solid var(--ink); box-shadow:var(--shadow); background:var(--ink); }
.article-video video { display:block; width:100%; height:auto; max-height:70vh; object-fit:contain; background:#000; }
.article-video figcaption { font:500 12.5px/1.5 ui-monospace,Menlo,monospace; color:var(--ink-3);
  background:var(--paper-2); padding:9px 13px; border-top:2px solid var(--ink); }

/* ---------- article photo ---------- */
.article-photo { margin:22px 0 26px; border:2px solid var(--ink); box-shadow:var(--shadow); background:var(--paper-2); }
.article-photo img { display:block; width:100%; height:auto; }
.article-photo figcaption { font:500 12px/1.5 ui-monospace,Menlo,monospace; color:var(--ink-3);
  padding:9px 13px; border-top:2px solid var(--ink); background:var(--paper-2); }
.card a.thumb.has-img { padding:0; border:1px solid var(--rule); overflow:hidden; }
.card a.thumb.has-img img { display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:16/9; }
.article.policy { max-width:740px; }
.article.policy .body h2 { font:700 22px/1.3 Georgia,serif; margin-top:34px; }
.article.policy .body p { font-size:17px; line-height:1.68; }
.policy-updated { font:500 12.5px/1 ui-monospace,Menlo,monospace; color:var(--ink-3);
  border-bottom:1px solid var(--rule); padding-bottom:14px; margin:0 0 24px; }
