/* ============================================================
   OpenPost Times — broadsheet theme · screen.css
   White, hairline rules, Newsreader serif. NYT tradition.
   ============================================================ */
:root{
  --ink:#121212;
  --white:#FFFFFF;
  --hair:#E2E2E2;
  --hair-dark:#CCCCCC;
  --grey:#5A5A5A;
  --faint:#999999;
  --blue:#1E56F0;
  --serif:'Newsreader', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, Helvetica, sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--white); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
a:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}
img{max-width:100%; height:auto; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
.wrap-article{max-width:720px;}
.wrap-figure{max-width:1060px;}

/* ============ MASTHEAD ============ */
.masthead{border-bottom:1px solid var(--ink);}
.topline{
  display:flex; justify-content:space-between; align-items:center;
  height:40px; font-size:12px; color:var(--grey);
  border-bottom:1px solid var(--hair);
}
.dateline{font-weight:500;}
.topline-actions{display:flex; align-items:center; gap:16px;}
.txt-btn{
  background:none; border:none; cursor:pointer;
  font-family:var(--sans); font-size:12px; font-weight:600; color:var(--ink);
  padding:4px 0;
}
.txt-btn:hover{color:var(--blue);}
.btn-sub{
  font-size:12px; font-weight:700;
  background:var(--ink); color:var(--white);
  padding:7px 16px; border-radius:2px;
}
.btn-sub:hover{background:var(--blue);}

.brandline{
  display:flex; flex-direction:column; align-items:center;
  padding:26px 0 20px;
}
.brand{display:flex; align-items:center; gap:12px;}
.wordmark{
  font-family:var(--serif); font-weight:800;
  font-size:52px; letter-spacing:-0.015em; line-height:1;
  color:var(--ink);
}
.aperture .ap-disc{fill:var(--ink);}
.aperture .ap-dot{fill:var(--blue);}
.brand .aperture{width:40px; height:40px;}
.brand-tag{
  font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--faint); margin-top:8px;
}

.navbar{border-top:1px solid var(--hair);}
.navbar-wrap{display:flex; justify-content:center; align-items:center; height:44px;}
.menu-toggle{display:none;}
.nav-links ul{display:flex; gap:4px; list-style:none;}
.nav-links a{
  font-size:13px; font-weight:600; color:var(--ink);
  padding:12px 14px; display:block;
  border-bottom:2px solid transparent;
}
.nav-links a:hover{border-bottom-color:var(--ink);}
.nav-links .nav-current a{border-bottom-color:var(--blue); color:var(--blue);}
.mobile-nav{display:none; border-top:1px solid var(--hair); padding:6px 24px 16px;}
.mobile-nav ul{list-style:none;}
.mobile-nav a{
  display:block; padding:12px 0;
  font-family:var(--serif); font-weight:600; font-size:20px;
  border-bottom:1px solid var(--hair);
}
@media(max-width:900px){
  .wordmark{font-size:38px;}
  .nav-links{display:none;}
  .menu-toggle{display:block;}
  .navbar-wrap{justify-content:flex-start;}
  .nav-open .mobile-nav{display:block;}
}

/* ============ TYPO UTILITIES ============ */
.kicker{
  display:inline-block;
  font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--blue); margin-bottom:8px;
}
.h-serif{
  font-family:var(--serif); font-weight:700;
  font-size:21px; line-height:1.18; letter-spacing:-0.005em;
}
.h-serif a:hover{color:var(--grey);}
.h-serif-sm{
  font-family:var(--serif); font-weight:600;
  font-size:17px; line-height:1.25;
}
.h-serif-sm a:hover{color:var(--grey);}
.h-italic{font-style:italic;}
.dek{
  font-family:var(--serif); font-size:15px; line-height:1.45; color:var(--grey);
  margin-top:6px;
}
.meta{font-size:11.5px; color:var(--faint); margin-top:8px;}
.section-rule{
  font-family:var(--sans); font-weight:700; font-size:13px;
  letter-spacing:0.1em; text-transform:uppercase;
  border-top:2px solid var(--ink);
  padding-top:10px; margin-bottom:26px;
}

/* ============ FRONT PAGE ============ */
.front{padding-top:34px;}
.front-grid{
  display:grid; grid-template-columns:1fr 320px; gap:0;
}
.col-lead{padding-right:34px; border-right:1px solid var(--hair);}
.col-rail{padding-left:34px;}
@media(max-width:900px){
  .front-grid{grid-template-columns:1fr;}
  .col-lead{padding-right:0; border-right:none;}
  .col-rail{padding-left:0; margin-top:40px;}
}

.lead{padding-bottom:28px; border-bottom:1px solid var(--hair);}
.lead-title{
  font-family:var(--serif); font-weight:800;
  font-size:clamp(30px, 3.8vw, 44px); line-height:1.05; letter-spacing:-0.01em;
  margin-bottom:16px;
}
.lead-title a:hover{color:var(--grey);}
.lead-fig{display:block; margin:6px 0 14px;}
.lead-deck{
  font-family:var(--serif); font-size:18px; line-height:1.5; color:var(--grey);
}
.duo{
  display:grid; grid-template-columns:1fr 1fr; gap:28px;
  padding-top:26px;
}
@media(max-width:640px){ .duo{grid-template-columns:1fr;} }
.duo-item + .duo-item{border-left:1px solid var(--hair); padding-left:28px;}
@media(max-width:640px){
  .duo-item + .duo-item{border-left:none; padding-left:0; border-top:1px solid var(--hair); padding-top:22px;}
}

/* rail */
.rail-block{margin-bottom:36px;}
.rail-head{
  font-family:var(--sans); font-weight:700; font-size:13px;
  letter-spacing:0.1em; text-transform:uppercase;
  border-top:2px solid var(--ink); padding-top:10px; margin-bottom:6px;
}
.rail-item{padding:14px 0; border-bottom:1px solid var(--hair);}
.rail-item:last-child{border-bottom:none;}
.rail-opinion .rail-head{border-top-color:var(--blue); color:var(--blue);}
.op-author{
  font-size:11px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--ink); margin-bottom:4px;
}

/* more news */
.more{margin-top:46px;}
.more-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:32px;
}
@media(max-width:900px){ .more-grid{grid-template-columns:1fr;} }
.more-item{
  padding-bottom:24px; border-bottom:1px solid var(--hair);
}
.more-fig{display:block; margin-bottom:12px;}
.more-fig img{aspect-ratio:16/9; object-fit:cover; width:100%;}

/* pagination */
.pagination{
  display:flex; justify-content:space-between; align-items:center;
  margin:34px 0 10px; font-size:13px; font-weight:600;
}
.pagination a{border-bottom:2px solid var(--ink); padding-bottom:2px;}
.pagination a:hover{color:var(--blue); border-color:var(--blue);}
.page-number{color:var(--faint);}

/* newsletter */
.nl{margin:60px 0 70px; border-top:2px solid var(--ink); border-bottom:1px solid var(--hair);}
.nl-inner{max-width:560px; margin:0 auto; text-align:center; padding:44px 20px 48px;}
.nl-inner .aperture{width:34px; height:34px; margin-bottom:12px;}
.nl-inner h3{font-family:var(--serif); font-weight:800; font-size:30px; margin-bottom:8px;}
.nl-inner p{font-family:var(--serif); font-size:16px; color:var(--grey); margin-bottom:22px;}
.nl-form{display:flex; gap:8px;}
.nl-form input{
  flex:1; font-family:var(--sans); font-size:14px;
  padding:12px 14px; border:1px solid var(--hair-dark); border-radius:2px;
}
.nl-form input:focus{outline:2px solid var(--blue); border-color:transparent;}
.nl-form button{
  font-family:var(--sans); font-size:13px; font-weight:700;
  background:var(--ink); color:#fff; border:none; border-radius:2px;
  padding:12px 22px; cursor:pointer;
}
.nl-form button:hover{background:var(--blue);}
.nl-ok{color:#0E7B4F; font-weight:600; margin-top:12px;}

/* ============ ARTICLE ============ */
.a-head{padding:40px 0 6px;}
.a-title{
  font-family:var(--serif); font-weight:800;
  font-size:clamp(30px, 4.6vw, 46px); line-height:1.06; letter-spacing:-0.01em;
  margin:10px 0 14px;
}
.a-standfirst{
  font-family:var(--serif); font-size:20px; line-height:1.5; color:var(--grey);
  margin-bottom:20px;
}
.a-byline{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
  font-size:13px; color:var(--grey);
  padding:14px 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
}
.a-byline b a:hover{color:var(--blue);}
.a-fig{margin:26px 0;}
.a-fig figcaption{font-size:12px; color:var(--faint); margin-top:8px;}

.gh-content{font-family:var(--serif); font-size:19px; line-height:1.75;}
.gh-content > * + *{margin-top:1.3em;}
.gh-content p:first-of-type::first-letter{
  font-weight:800; font-size:3.1em; float:left;
  line-height:.82; padding:6px 10px 0 0;
}
.gh-content h2{font-weight:700; font-size:28px; margin-top:1.7em;}
.gh-content h3{font-weight:700; font-size:23px; margin-top:1.5em;}
.gh-content a{color:var(--ink); text-decoration:underline; text-decoration-color:var(--blue); text-decoration-thickness:1.5px; text-underline-offset:3px;}
.gh-content a:hover{color:var(--blue);}
.gh-content blockquote{
  border-left:2px solid var(--ink); padding-left:20px;
  font-style:italic; font-size:21px;
}
.gh-content ul,.gh-content ol{padding-left:1.3em;}
.gh-content hr{border:none; border-top:1px solid var(--hair); margin:2.2em 0;}
.gh-content table{width:100%; border-collapse:collapse; font-family:var(--sans); font-size:14px;}
.gh-content th,.gh-content td{border:1px solid var(--hair); padding:9px 11px; text-align:left;}
.gh-content code{font-size:.85em; background:#F4F4F4; padding:.15em .35em; border-radius:3px; font-family:monospace;}
.gh-content pre{background:#121212; color:#eee; padding:16px 18px; overflow-x:auto; font-size:14px; border-radius:4px;}
.gh-content pre code{background:none;}
.kg-card{margin:1.8em 0;}
.kg-card figcaption{font-size:12px; color:var(--faint); text-align:center; margin-top:8px; font-family:var(--sans);}
.kg-width-wide{margin-left:-120px; margin-right:-120px;}
@media(max-width:1000px){ .kg-width-wide{margin-left:0; margin-right:0;} }
.kg-embed-card iframe{max-width:100%;}
.kg-bookmark-card a{display:flex; border:1px solid var(--hair); font-family:var(--sans);}
.kg-bookmark-content{padding:16px; flex:1;}
.kg-bookmark-title{font-weight:700; font-size:14px;}
.kg-bookmark-description{font-size:12.5px; color:var(--grey); margin-top:4px;}
.kg-bookmark-metadata{font-size:11.5px; color:var(--faint); margin-top:8px;}
.kg-bookmark-thumbnail img{width:170px; height:100%; object-fit:cover;}
.kg-btn{display:inline-block; background:var(--ink); color:#fff !important; font-family:var(--sans); font-weight:700; font-size:14px; padding:11px 22px; text-decoration:none !important;}

.a-tags{display:flex; gap:14px; flex-wrap:wrap; margin:34px 0 0; font-size:12px;}
.tag-link{font-weight:600; color:var(--grey); border-bottom:1px solid var(--hair-dark);}
.tag-link:hover{color:var(--blue); border-color:var(--blue);}
.a-share{
  display:flex; gap:16px; align-items:center;
  margin:22px 0 0; padding:14px 0;
  border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
  font-size:12.5px; color:var(--faint);
}
.a-share a{font-weight:700; color:var(--ink); border-bottom:2px solid var(--blue);}
.a-author{
  display:flex; gap:16px; margin:36px 0 56px;
  padding-top:20px; border-top:2px solid var(--ink);
}
.a-author-img{width:64px; height:64px; border-radius:50%; object-fit:cover;}
.a-author-name{font-family:var(--serif); font-weight:700; font-size:18px;}
.a-author-name:hover{color:var(--blue);}
.a-author-bio{font-size:14px; color:var(--grey); margin-top:5px;}
.related{margin:24px auto 60px;}

/* ============ ARCHIVES ============ */
.arch-head{padding:40px 0 26px; border-bottom:2px solid var(--ink); margin-bottom:30px;}
.arch-title{font-family:var(--serif); font-weight:800; font-size:clamp(30px,4.5vw,46px);}
.arch-desc{font-family:var(--serif); font-size:17px; color:var(--grey); margin-top:8px; max-width:60ch;}
.author-head{display:flex; gap:22px; align-items:center;}
.author-img{width:84px; height:84px; border-radius:50%; object-fit:cover;}
.arch-grid{margin-bottom:20px;}

/* ============ FOOTER ============ */
.site-footer{border-top:2px solid var(--ink); margin-top:40px; padding:34px 0 30px;}
.foot-brand{display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:18px;}
.foot-brand .wordmark{font-size:26px;}
.foot-brand .aperture{width:22px; height:22px;}
.foot-nav ul{display:flex; justify-content:center; gap:22px; list-style:none; flex-wrap:wrap;}
.foot-nav a{font-size:12.5px; font-weight:600; color:var(--grey);}
.foot-nav a:hover{color:var(--ink);}
.foot-legal{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
  margin-top:22px; padding-top:16px; border-top:1px solid var(--hair);
  font-size:11.5px; color:var(--faint);
}
.foot-legal a:hover{color:var(--ink);}