/* WOC 2026 — custom editorial identity, not a Guardian skin.
   The Guardian reference informed placement only: navigation LEFT, large panda logo RIGHT.
   Own art direction: warm mineral paper, ink, WOC red, DM Sans + Newsreader. */
:root {
  --ink:#262629;
  --muted:#626265;
  --line:#ded9d1;
  --soft:#f3f0e9;
  --paper:#fbfaf7;
  --red:#bf1730;
  --red-dark:#981329;
  --navy:#282c31;
  --cream:#f1ede4;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
html,body {background:var(--paper);color:var(--ink)}
.site-header{background:#f5f2ec;border-bottom:1px solid #d9d1c5}
.site-header .utility-row {
  max-width:1320px;background:transparent;color:#74716e;
  border-bottom:1px solid #e4dfd7;
  font-family:var(--sans);font-size:11px;letter-spacing:.005em;
}
.site-header .utility-row a{font-size:11px}
.site-header .masthead-band {
  background:#f5f2ec!important;
  color:#24252a!important;
  border-top:0;border-bottom:1px solid #cec6ba;
}
.site-header .masthead-inner {
  max-width:1320px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(264px,316px);
  gap:30px;
  min-height:176px;
  padding:13px 18px;
  align-items:center;
}
.site-header .masthead-logo {
  grid-column:2;grid-row:1;
  justify-self:end;align-self:center;
  max-width:316px;width:100%;
  margin:0;padding:0;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0;
}
.site-header .masthead-logo img{
  display:block;width:100%;height:auto!important;
  max-height:none!important;
  object-fit:contain;object-position:center;
  mix-blend-mode:darken;
}
.site-header .main-nav.masthead-navigation{
  grid-column:1;grid-row:1;align-self:center;
  display:flex;flex-direction:column;
  max-width:none;width:100%;min-width:0;
  background:transparent!important;color:var(--ink)!important;
  overflow:visible;white-space:normal;box-shadow:none;clip-path:none;
  margin:0;padding:0;border:0;
}
.site-header .masthead-primary{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:0;min-width:0;
  border-bottom:1px solid #c8c0b4;
}
.site-header .masthead-primary a{
  display:inline-flex;align-items:center;
  font-family:var(--sans);
  font-size:clamp(15px,1.27vw,18px);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.15;
  padding:15px 11px 16px;
  white-space:nowrap;
  border:0!important;
  color:var(--ink)!important;
  text-decoration:none;
  position:relative;
  background:transparent!important;
}
.site-header .masthead-primary a:first-child{padding-left:0}
.site-header .masthead-primary a:not(:last-child)::after{
  content:"";position:absolute;top:16px;bottom:16px;right:0;
  width:1px;background:#ded6ca;
}
.site-header .masthead-primary .nav-home{
  color:var(--red)!important;
  text-decoration:none;
}
.site-header .masthead-primary .nav-home::before{
  content:"";position:absolute;bottom:-2px;left:0;right:10px;height:3px;
  background:var(--red);
}
.site-header .masthead-primary a:hover,
.site-header .masthead-secondary a:hover{
  color:var(--red)!important;
  background:transparent!important;
}
.site-header .masthead-secondary{
  display:flex;align-items:center;flex-wrap:wrap;min-height:35px;gap:0;
}
.site-header .masthead-secondary a{
  display:inline-flex;align-items:center;
  padding:10px 9px 8px;
  font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:.005em;line-height:1.2;
  text-decoration:none;
  color:#595a5c!important;
  background:transparent!important;
}
.site-header .masthead-secondary a:first-child{padding-left:0}
.site-header .mobile-menu-button{display:none}
.site-header .trending{
  background:#ece7df!important;color:#404041;
  border-top:0!important;border-bottom:1px solid #d7cec2;
}
.site-header .trending-track{max-width:1320px}
.site-header .trend-label{
  background:var(--red);color:#fff;font-family:var(--sans);
  padding:10px 14px;font-size:10px;letter-spacing:.13em
}
.site-header .trending a{
  color:#424349!important;
  border-right:1px solid #d7cec2;
  min-width:175px;max-width:260px;
  font-size:11px;font-weight:650;
  background:transparent;
}
.site-header .trending a:hover{background:#e2dbd0;color:var(--red)!important}

/* Type hierarchy: modern sans UI, editorial serif headlines. */
.lead-copy h1,
.article-head h1,
.section-head h2,
.section-hero h1,.page-header h1,
.card h3,.article-body,.topic-lead h2,
.media-lead h3,.media-rail-card h3 {
  font-family:var(--serif)
}
.lead-copy h1{font-weight:650;letter-spacing:-.025em;line-height:1.04}
.card h3{letter-spacing:-.014em;font-weight:680}
.article-body{font-size:19px;line-height:1.64}
.section-head h2{font-weight:670;letter-spacing:-.018em}
.eyebrow,.kicker{font-family:var(--sans);font-weight:850;letter-spacing:.085em}
.site-footer{background:#24262a}
.multimedia-section{background:#242629}
.topics-band{background:#2b2d30}

/* At midsize widths reduce nav gently without orphaning labels. */
@media(min-width:1021px) and (max-width:1200px){
  .site-header .masthead-inner{grid-template-columns:minmax(0,1fr) 292px;gap:16px}
  .site-header .masthead-primary a{font-size:15px;padding:12px 8px 13px}
  .site-header .masthead-secondary a{font-size:10px;padding:9px 7px}
}

/* Responsive masthead: same identity, no dark 'mini-Guardian' */
@media(max-width:1020px){
  .site-header .masthead-inner{
    min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;
    align-items:center;gap:12px;padding:10px 14px;
  }
  .site-header .masthead-logo{
    grid-row:1;grid-column:1;
    justify-self:start;width:min(225px,100%);
    max-width:225px;align-self:center;margin:0;padding:0;
  }
  .site-header .mobile-menu-button{
    grid-row:1;grid-column:2;display:flex;
    align-items:center;justify-content:center;gap:7px;
    width:auto;min-width:88px;
    border:1px solid #bbb3a9;
    background:transparent;color:var(--ink);
    border-radius:3px;padding:10px 12px;
    font:800 12px/1.2 var(--sans);
  }
  .site-header .mobile-menu-button:hover{background:#eae3da}
  .site-header .mobile-menu-button .menu-symbol{font-size:18px;line-height:1}
  .site-header .main-nav.masthead-navigation{
    grid-row:2;grid-column:1/-1;
    display:none;
    border-top:1px solid #d0c8bd;
    margin-top:5px;padding-top:7px;
    background:transparent!important;
  }
  .site-header .main-nav.masthead-navigation.is-open{display:flex}
  .site-header .masthead-primary,.site-header .masthead-secondary{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;min-height:0;
  }
  .site-header .masthead-primary{padding-bottom:9px}
  .site-header .masthead-secondary{padding:6px 0}
  .site-header .masthead-primary a,.site-header .masthead-secondary a{
    font-family:var(--sans);font-size:13px;font-weight:750;
    padding:12px 8px;white-space:normal;
    border:0;border-bottom:1px solid #e2dcd4!important;
    line-height:1.3;
  }
  .site-header .masthead-primary a:first-child,
  .site-header .masthead-secondary a:first-child{padding-left:8px}
  .site-header .masthead-primary a::after,
  .site-header .masthead-primary .nav-home::before{display:none}
  .site-header .masthead-primary .nav-home{border-left:3px solid var(--red)!important}
}
@media(max-width:480px){
  .site-header .masthead-inner{padding:9px 12px}
  .site-header .masthead-logo{width:min(200px,100%);max-width:200px}
  .site-header .mobile-menu-button{padding:8px 10px;min-width:80px}
  .site-header .trending a{min-width:160px}
}

/* Fixed late CSS override: footer belongs to one-column mobile flow */
@media(max-width:780px){
  .site-footer .footer-top{grid-template-columns:minmax(0,1fr);gap:25px;padding-inline:18px}
  .site-footer .footer-top>div{min-width:0}
  .site-footer .footer-bottom{width:100%}
}

/* Explicit flex stretching prevents inherited .main-nav align-items:center from
   collapsing both mobile menu columns into a narrow block. */
@media(max-width:1020px){
  .site-header .main-nav.masthead-navigation{
    align-items:stretch;
    width:100%;
    max-width:100%;
    min-width:0;
    justify-content:stretch;
  }
  .site-header .masthead-primary,
  .site-header .masthead-secondary{width:100%;min-width:0}
}