/* ===== SECTION HEADERS ===== */
  .band{padding:50px 0}
  .band-head{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; padding-bottom:14px; border-bottom:2px solid var(--ink)}
  .band-head h2{font-size:clamp(21px,2.6vw,30px); font-weight:800; letter-spacing:-.01em; color:var(--ink)}
  .band-head .eyebrow{margin-bottom:8px}
  .band-head .head-note{font-size:13px; color:var(--grey-700); max-width:300px; text-align:right}

  /* ===== CARD GRID ===== */
  .grid{display:grid; gap:30px 26px}
  .grid-4{grid-template-columns:repeat(4,1fr)}
  .grid-2{grid-template-columns:repeat(2,1fr)}
  .card{display:flex; flex-direction:column; background:var(--paper); transition:transform .25s}
  .card:hover{transform:translateY(-5px)}
  .card-media{aspect-ratio:16/11; border-radius:5px}
  .card-media .motif{width:56%; max-width:160px}
  .card-body{padding:16px 2px 2px}
  .card-kicker{font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--ign-red); margin-bottom:8px; display:block}
  .card-kicker.green{color:var(--forest)}
  .card-title{font-size:19px; font-weight:700; line-height:1.18; letter-spacing:-.01em; color:var(--ink); margin-bottom:8px; transition:color .2s}
  .card:hover .card-title{color:var(--ign-red)}
  .card-dek{font-size:14px; color:var(--grey-800); line-height:1.5; margin-bottom:12px}
  .card-meta{font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-700); margin-top:auto}

  /* ===== BY THE NUMBERS ===== */
  .numbers{background:var(--forest); color:#fff; position:relative; overflow:hidden}
  .numbers::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px); background-size:40px 40px}
  .numbers .wrap{position:relative; padding:46px 24px}
  .numbers-head{text-align:center; margin-bottom:34px}
  .numbers-head .eyebrow{color:#fff; justify-content:center}
  .numbers-head .eyebrow::before{background:var(--ign-yellow)}
  .numbers-head h2{font-size:clamp(20px,2.4vw,28px); font-weight:800; margin-top:10px; letter-spacing:-.01em}
  .numbers-head p{font-size:14px; color:rgba(255,255,255,.78); margin-top:8px}
  .stats{display:flex; flex-wrap:wrap; justify-content:center; gap:0}
  .stat{flex:1 1 0; min-width:150px; text-align:center; padding:8px 18px; position:relative}
  .stat + .stat::before{content:""; position:absolute; left:0; top:14%; height:72%; width:1px; background:rgba(255,255,255,.22)}
  .stat-num{font-size:clamp(32px,4vw,50px); font-weight:900; letter-spacing:-.03em; line-height:1; color:#fff}
  .stat-num .u{color:var(--ign-yellow)}
  .stat-label{font-size:12px; color:rgba(255,255,255,.82); margin-top:10px; line-height:1.4}

  /* ===== CURRENT ISSUE / IN THIS ISSUE ===== */
  .issue{padding:54px 0; background:var(--grey-100); border-top:1px solid var(--grey-300)}
  .issue-grid{display:grid; grid-template-columns:.82fr 1.18fr; gap:44px; align-items:start}

  /* cover plate */
  .cover{position:sticky; top:80px}
  .cover-plate{aspect-ratio:3/4; border-radius:6px; box-shadow:0 18px 44px rgba(30,30,45,.22); display:flex; flex-direction:column; justify-content:space-between; padding:30px 26px; color:#fff}
  .cover-plate .motif{width:70%; max-width:230px; right:-10%; bottom:18%}
  .cover-top{position:relative; z-index:2}
  .cover-mark{font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; opacity:.9}
  .cover-wm{font-size:34px; font-weight:800; letter-spacing:-.02em; line-height:.94; margin-top:14px}
  .cover-theme{position:relative; z-index:2; font-size:13.5px; line-height:1.4; max-width:200px; font-style:italic; opacity:.95}
  .cover-bottom{position:relative; z-index:2; display:flex; justify-content:space-between; align-items:flex-end; border-top:1px solid rgba(255,255,255,.4); padding-top:14px}
  .cover-bottom .vol{font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase}
  .cover-bottom .yr{font-size:22px; font-weight:900; letter-spacing:-.02em}
  .cover-cap{font-size:11px; color:var(--grey-700); text-align:center; margin-top:14px; line-height:1.5}

  /* real cover image + download */
  .cover-shot{display:block; border-radius:6px; overflow:hidden; box-shadow:0 18px 44px rgba(30,30,45,.22); aspect-ratio:1131/1600; background:var(--ink)}
  .cover-shot img{width:100%; height:100%; object-fit:cover; display:block}
  .cover-shot:focus-visible{outline:3px solid var(--ign-red); outline-offset:3px}
  .issue-dl{display:block; text-align:center; margin-top:16px; background:var(--ign-red); color:#fff; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:14px 18px; border-radius:5px; transition:filter .15s, transform .15s}
  .issue-dl:hover{filter:brightness(1.07); transform:translateY(-1px)}
  .issue-dl:focus-visible{outline:3px solid var(--ink); outline-offset:2px}

  /* contents list */
  .contents-head h2{font-size:clamp(24px,3vw,34px); font-weight:800; letter-spacing:-.02em; color:var(--ink)}
  .contents-head .eyebrow{margin-bottom:10px}
  .contents-head p{font-size:14.5px; color:var(--grey-800); margin-top:10px; max-width:520px; line-height:1.6}
  .toc-group{margin-top:30px}
  .toc-glabel{font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ign-red); padding-bottom:10px; border-bottom:1px solid var(--grey-300); margin-bottom:4px}
  .toc-glabel.dept{color:var(--ink)}
  .toc-row{display:grid; grid-template-columns:46px 1fr; gap:16px; align-items:baseline; padding:13px 10px 13px 6px; border-bottom:1px solid var(--grey-300); border-radius:4px; transition:background .18s}
  .toc-row:hover{background:#fff}
  .toc-pg{font-size:15px; font-weight:900; color:var(--ign-red); letter-spacing:-.02em; font-variant-numeric:tabular-nums}
  .toc-feature .toc-title{font-size:19px}
  .toc-title{font-size:15.5px; font-weight:700; color:var(--ink); line-height:1.25; transition:color .18s}
  .toc-row:hover .toc-title{color:var(--ign-red)}
  .toc-dek{font-size:13px; color:var(--grey-800); line-height:1.45; margin-top:4px}
  .toc-byline{font-size:11.5px; font-style:italic; color:var(--grey-700); margin-top:4px}

  /* ===== FOOTER ===== */
  .footer{background:var(--ink); color:#fff; padding:52px 0 0}
  .footer-top{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.14)}
  .f-brand .f-mark{display:inline-flex; align-items:center; gap:10px; color:#fff}
  .f-brand .f-mark svg{width:26px; height:26px}
  .f-brand .f-wm{font-size:24px; font-weight:800; letter-spacing:-.02em}
  .f-brand p{font-size:13px; color:rgba(255,255,255,.7); line-height:1.6; margin-top:14px; max-width:280px}
  .f-col h4{font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ign-yellow); margin-bottom:14px}
  .f-col a{display:block; font-size:13.5px; color:rgba(255,255,255,.82); padding:5px 0}
  .f-col a:hover{color:#fff; padding-left:3px; transition:padding .15s}
  .footer-bot{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding:20px 0 26px}
  .footer-bot span{font-size:12px; color:rgba(255,255,255,.6)}
  .footer-bot .url{font-weight:700; color:rgba(255,255,255,.85); letter-spacing:.04em}

  /* ===== REVEAL ===== */
  @media (prefers-reduced-motion: no-preference){
    .reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
    .reveal.in{opacity:1; transform:none}
  }

  /* scroll offset for sticky nav */
  section[id]{scroll-margin-top:74px}

  /* ===== RESPONSIVE ===== */
  @media (max-width:980px){
    .grid-4{grid-template-columns:repeat(2,1fr)}
    .footer-top{grid-template-columns:1fr 1fr}
    .f-brand{grid-column:1 / -1}
  }
  @media (max-width:820px){
    .lead-grid{grid-template-columns:1fr}
    .lead-media{min-height:260px}
    .issue-grid{grid-template-columns:1fr; gap:32px}
    .cover{position:static; max-width:360px; margin:0 auto}
    .band-head{flex-direction:column; align-items:flex-start}
    .band-head .head-note{text-align:left; max-width:none}
  }
  @media (max-width:540px){
    .grid-4{grid-template-columns:1fr}
    .grid-2{grid-template-columns:1fr}
    .stat{flex-basis:50%; min-width:0}
    .stat:nth-child(3)::before{display:none}
    .util-left a:nth-child(n+3){display:none}
    .lead-copy{padding:30px 24px}
  }


  /* ====== ARTICLE VIEWS ====== */
/* ===== ARTICLE ===== */
  .article{padding:34px 0 6px}
  .art-wrap{max-width:960px; margin:0 auto; padding:0 24px}
  .art-head{max-width:780px; margin:0 auto; text-align:center}
  .art-kicker{font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--grey-700); margin-bottom:18px}
  .art-kicker a{color:var(--ign-red)}
  .art-kicker .sep{margin:0 9px; color:var(--grey-300)}
  .art-title{font-size:clamp(29px,4.3vw,49px); font-weight:800; letter-spacing:-.02em; line-height:1.05; color:var(--ink); margin-bottom:20px}
  .art-deck{font-size:clamp(17px,2vw,21px); color:var(--grey-800); line-height:1.46; font-style:italic; margin-bottom:26px}
  .art-byline{font-size:14px; color:var(--ink); font-weight:700}
  .art-byline a{color:var(--ign-red)}
  .art-issue{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-700); margin-top:8px}
  .art-share{display:flex; justify-content:center; align-items:center; gap:9px; margin:24px 0 2px; flex-wrap:wrap}
  .art-share .share-label{font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--grey-700); margin-right:2px}
  .sh{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--grey-300); border-radius:50%; color:var(--grey-800); transition:background .18s,border-color .18s,color .18s,transform .18s; cursor:pointer; background:none}
  .sh:hover{background:var(--ign-red); border-color:var(--ign-red); color:#fff; transform:translateY(-2px)}
  .sh svg{width:16px; height:16px; fill:currentColor}
  .copied{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--forest); opacity:0; transition:opacity .2s}
  .copied.show{opacity:1}

  /* figures */
  .art-figure{margin:34px auto}
  .art-figure img{width:100%; border-radius:5px}
  .art-figure figcaption{font-size:13px; color:var(--grey-700); line-height:1.5; margin-top:11px; font-style:italic}
  .art-figure figcaption b{font-style:normal; color:var(--ink)}
  .fig-portrait img{max-width:430px; margin:0 auto}
  .fig-portrait figcaption{text-align:center; max-width:430px; margin-left:auto; margin-right:auto}
  .fig-duo{display:grid; grid-template-columns:1fr 1fr; gap:20px}
  .fig-duo figure{margin:0}
  .fig-duo img{height:100%; object-fit:cover}

  /* body layout */
  .art-body{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:50px; align-items:start; margin-top:36px}
  .prose{max-width:690px; font-size:17.5px; line-height:1.72; color:#26262e}
  .prose p{margin-bottom:22px}
  .prose p.dropcap::first-letter{float:left; font-size:62px; line-height:.82; font-weight:800; color:var(--ign-red); padding:6px 11px 0 0}
  .prose figure{margin:30px 0}
  .pull{margin:34px 0; padding:26px 28px; background:var(--ign-red); color:#fff; border-radius:6px}
  .pull .pq{font-size:22px; font-weight:800; line-height:1.32; letter-spacing:-.01em; display:block}
  .pull .pull-by{font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin-top:15px; opacity:.92}

  /* snapshot sidebar */
  .snapshot{position:sticky; top:74px; background:var(--grey-100); border-top:3px solid var(--ign-red); border-radius:4px; padding:22px 22px 10px}
  .snapshot h3{font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--ink); margin-bottom:14px}
  .snap-row{padding:11px 0; border-bottom:1px solid var(--grey-300)}
  .snap-row:last-child{border-bottom:none}
  .snap-row .k{font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-700); margin-bottom:3px}
  .snap-row .v{font-size:14px; font-weight:700; color:var(--ink); line-height:1.35}
  .snap-row .v a{color:var(--ign-red)}

  /* article end */
  .art-end{max-width:690px; margin:6px 0 0}
  .subject-note{font-size:15px; font-style:italic; color:var(--grey-800); line-height:1.65; margin:14px 0 26px}
  .art-credit{font-size:14px; color:var(--grey-800); line-height:1.65; padding:20px 0; border-top:1px solid var(--grey-300); border-bottom:1px solid var(--grey-300)}
  .art-credit .hl{font-weight:700; color:var(--ink)}
  .read-more{display:inline-block; margin-top:20px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ign-red)}
  .read-more::after{content:" \2192"}
  .topics{margin-top:32px}
  .topics h4{font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--grey-700); margin-bottom:14px}
  .topic-tags{display:flex; flex-wrap:wrap; gap:10px}
  .topic-tags a{font-size:13px; font-weight:700; color:var(--ink); background:var(--grey-100); border:1px solid var(--grey-300); padding:8px 14px; border-radius:4px; transition:background .15s,border-color .15s,color .15s}
  .topic-tags a:hover{background:var(--ign-red); border-color:var(--ign-red); color:#fff}

  /* you might also like */
  .also{background:var(--grey-100); border-top:1px solid var(--grey-300); margin-top:56px; padding:50px 0}
  .also h2{font-size:clamp(20px,2.4vw,26px); font-weight:800; letter-spacing:-.01em; margin-bottom:26px}
  .grid{display:grid; gap:30px 26px}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .card{display:flex; flex-direction:column; background:var(--paper); transition:transform .25s}
  .card:hover{transform:translateY(-5px)}
  .media{position:relative; overflow:hidden; background:linear-gradient(135deg,var(--g1,#1C5B43),var(--g2,#3E9472)); color:#fff}
  .media::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px); background-size:24px 24px}
  .media::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22))}
  .motif{position:absolute; right:-6%; bottom:-8%; width:56%; max-width:160px; opacity:.9; z-index:1}
  .media-chip{position:absolute; top:14px; left:14px; z-index:2; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35); padding:5px 10px; border-radius:3px; backdrop-filter:blur(2px)}
  .card-media{aspect-ratio:16/11; border-radius:5px}
  .card-body{padding:16px 2px 2px}
  .card-kicker{font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--ign-red); margin-bottom:8px; display:block}
  .card-kicker.green{color:var(--forest)}
  .card-title{font-size:19px; font-weight:700; line-height:1.18; letter-spacing:-.01em; color:var(--ink); margin-bottom:8px; transition:color .2s}
  .card:hover .card-title{color:var(--ign-red)}
  .card-dek{font-size:14px; color:var(--grey-800); line-height:1.5; margin-bottom:12px}
  .card-meta{font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--grey-700); margin-top:auto}

  /* ===== RESPONSIVE ===== */
  @media (max-width:860px){
    .art-body{grid-template-columns:1fr; gap:0}
    .snapshot{position:static; order:-1; margin-bottom:34px}
    .prose{max-width:none}
    .grid-3{grid-template-columns:repeat(2,1fr)}
    .footer-top{grid-template-columns:1fr 1fr}
    .f-brand{grid-column:1 / -1}
  }
  @media (max-width:540px){
    .fig-duo{grid-template-columns:1fr}
    .grid-3{grid-template-columns:1fr}
    .prose{font-size:16.5px}
    .util-left a:nth-child(n+3){display:none}
  }
  [hidden]{display:none !important}
  button.cover-shot{border:0; padding:0; width:100%; cursor:pointer; font:inherit}
  .subject-meta{font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--grey-700); margin-top:10px}
  .card-media.has-photo::before, .card-media.has-photo::after{display:none}
  .card-photo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; display:block}
  .media-credit{position:absolute; right:9px; bottom:8px; z-index:2; font-size:9px; font-weight:600; letter-spacing:.02em; color:rgba(255,255,255,.95); background:rgba(0,0,0,.46); padding:3px 7px; border-radius:3px; text-transform:none}
  .art-body.no-aside{grid-template-columns:minmax(0,1fr)}
  .art-body.no-aside .prose{max-width:760px; margin:0 auto}
  .art-standfirst{font-style:italic; font-size:18px; line-height:1.5; color:#3a3a48; margin:0 0 20px}
  .cap-credit{display:block; margin-top:3px; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:#9a9aa5}
  .profile-box{background:#f4f4f6; border-top:3px solid #DF2033; padding:18px 20px; margin:28px 0; border-radius:4px}
  .profile-eyebrow{font-size:13px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#1E1E2D}
  .profile-sub{font-style:italic; color:#55555f; margin:3px 0 14px; font-size:13.5px}
  .profile-photo{margin:0 0 12px} .profile-photo img{width:100%; border-radius:3px; display:block}
  .profile-photo figcaption{font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:#9a9aa5; margin-top:5px}
  .profile-bio p{font-size:14px; line-height:1.62; margin:0 0 10px}
  .profile-compiled{font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:#9a9aa5; margin-top:4px}