/* =====================================================================
   "News" archive + single article. Scoped under .nws so it never touches the
   shared header/footer or other pages. Global Instrument Sans (inherited) +
   brand palette. No animation library. Prototype colours mapped to the brand.
   ===================================================================== */
.nws{
  --nws-ink:#051026;      /* headings */
  --nws-blue:#183962;     /* links, accents */
  --nws-gold:#d3bf5d;     /* accent divider / active */
  --nws-body:#33415a;     /* body text */
  --nws-muted:#5b6b76;    /* dates, excerpts */
  --nws-line:#e3e8f0;     /* borders */
  --nws-surface:#fff;
  --nws-bg:#f5f5f7;
  --nws-ph:#dde3ea;       /* image fallback */
  --header-h:113px;
  background:var(--nws-bg);
}
html{scroll-padding-top:113px}
.nws *,.nws *::before,.nws *::after{box-sizing:border-box}
.nws a{text-decoration:none}

/* ---------- Hero (CASE B: fixed overlay header, below the nav) ---------- */
.nws-hero{position:relative;text-align:center;color:#fff;padding:calc(var(--header-h) + 96px) 20px 81px;
  background:linear-gradient(180deg,rgba(2,16,29,.3),rgba(2,16,29,.52)),linear-gradient(180deg,#0e5aa7 0%,#0a3f86 50%,#072a5c 100%)}
.nws-hero__title{margin:0;color:#fff;font-weight:600;line-height:1.05;font-size:clamp(34px,5vw,64px);max-width:900px;margin-inline:auto;overflow-wrap:break-word}
.nws-hero__rule{display:block;width:72px;height:3px;background:var(--nws-gold);margin:22px auto}
.nws-hero__intro{max-width:680px;margin:0 auto;font-size:17px;line-height:1.65;color:rgba(255,255,255,.88)}
.nws-hero__date{margin:0;font-size:15px;color:rgba(255,255,255,.8)}

/* ---------- container ---------- */
.nws-wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* ---------- Year tabs ---------- */
.nws-years{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:90px 0 8px}
.nws-year{min-height:44px;min-width:64px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--nws-blue);border-radius:999px;font-weight:600;font-size:15px;color:var(--nws-blue);background:var(--nws-surface);transition:background .2s,color .2s,border-color .2s}
.nws-year:hover{background:rgba(24,57,98,.07)}
.nws-year.is-on{background:var(--nws-blue);border-color:var(--nws-blue);color:#fff}
.nws-year.is-on::before{content:"\2713";margin-right:8px;font-size:13px}
.nws-year:focus-visible{outline:2px solid var(--nws-gold);outline-offset:2px}

/* ---------- Card grid ---------- */
.nws-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:32px 0 24px}
.nws-card{background:var(--nws-surface);border:1px solid var(--nws-line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}
.nws-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(5,16,38,.12)}
.nws-card__imgwrap{display:block;aspect-ratio:16/10;background:var(--nws-ph);overflow:hidden}
.nws-card__img{width:100%;height:100%;object-fit:cover;display:block}
.nws-card__ph{display:block;width:100%;height:100%;background:linear-gradient(135deg,#e7edf3,#d7dfe8)}
.nws-card__body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.nws-card__date{font-size:13px;font-weight:600;color:var(--nws-muted);letter-spacing:.04em;text-transform:uppercase}
.nws-card__title{margin:0;font-size:24px;font-weight:600;line-height:1.2em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nws-card__title a{color:var(--nws-ink)}
.nws-card__title a:hover{color:var(--nws-blue)}
.nws-card__excerpt{margin:0;font-size:18px;line-height:1.6;color:var(--nws-muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nws-card__more{margin-top:auto;padding-top:6px;font-weight:600;font-size:15px;color:var(--nws-blue)}
.nws-card__more:hover{text-decoration:underline}
.nws-empty{grid-column:1/-1;text-align:center;padding:56px 0;color:var(--nws-muted);font-size:17px}

/* ---------- Pagination ---------- */
.nws-archive{padding-bottom:90px}
.nws-pagination{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:16px 0 0}
.nws-page{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--nws-line);border-radius:8px;background:var(--nws-surface);color:var(--nws-ink);font-weight:600;padding:0 14px}
.nws-page:hover{border-color:var(--nws-blue)}
.nws-page.is-on{background:var(--nws-blue);border-color:var(--nws-blue);color:#fff}
.nws-page:focus-visible{outline:2px solid var(--nws-gold);outline-offset:2px}

/* ---------- Single article ---------- */
.nws-article{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;padding:90px 0;align-items:start}
.nws-main{background:var(--nws-surface);border:1px solid var(--nws-line);border-radius:14px;padding:40px}
.nws-main__img{aspect-ratio:16/9;border-radius:10px;overflow:hidden;margin-bottom:32px;background:var(--nws-ph)}
.nws-main__imgel{width:100%;height:100%;object-fit:cover;display:block}
.nws-content{color:var(--nws-body);font-size:18px;line-height:1.75}
.nws-content p{margin:0 0 20px}
.nws-content h2{font-size:28px;color:var(--nws-ink);font-weight:600;line-height:1.25;margin:32px 0 14px}
.nws-content h3{font-size:22px;color:var(--nws-ink);font-weight:600;margin:28px 0 12px}
.nws-content ul,.nws-content ol{margin:0 0 20px;padding-left:24px}
.nws-content li{margin-bottom:8px}
.nws-content a{color:var(--nws-blue);text-decoration:underline}
.nws-content img{max-width:100%;height:auto;border-radius:8px}
.nws-content blockquote{margin:0 0 20px;padding:4px 0 4px 20px;border-left:3px solid var(--nws-gold);color:var(--nws-ink)}
.nws-back{display:inline-block;margin-top:28px;font-weight:600;color:var(--nws-blue)}
.nws-back:hover{text-decoration:underline}

/* Recent Post sidebar (sticky on desktop) */
.nws-side__inner{position:sticky;top:calc(var(--header-h) + 20px);background:var(--nws-surface);border:1px solid var(--nws-line);border-radius:14px;padding:28px}
.nws-side__title{margin:0 0 8px;font-size:24px;font-weight:600;color:var(--nws-ink);padding-bottom:14px;border-bottom:3px solid var(--nws-gold);display:inline-block}
.nws-rp{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--nws-line)}
.nws-rp:last-child{border-bottom:0}
.nws-rp__thumb{flex:0 0 84px;width:84px;height:64px;border-radius:6px;overflow:hidden;background:var(--nws-ph)}
.nws-rp__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.nws-rp__ph{display:block;width:100%;height:100%;background:linear-gradient(135deg,#e7edf3,#d7dfe8)}
.nws-rp__body{min-width:0}
.nws-rp__date{display:block;font-size:12px;font-weight:600;color:var(--nws-muted);text-transform:uppercase;letter-spacing:.04em}
.nws-rp__title{display:block;margin-top:4px;font-size:16px;font-weight:600;line-height:1.35;color:var(--nws-ink)}
.nws-rp:hover .nws-rp__title{color:var(--nws-blue)}
.nws-rp__empty{color:var(--nws-muted);font-size:14px;margin:12px 0 0}

/* ---------- a11y helper ---------- */
.nws .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Responsive ---------- */
@media (max-width:1024px){.nws-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){
  .nws-hero{padding:calc(var(--header-h) + 64px) 20px 62px}
  .nws-article{grid-template-columns:1fr;gap:28px;padding:32px 0 56px}
  .nws-main{padding:24px}
  .nws-side__inner{position:static}
}
@media (max-width:620px){.nws-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  .nws-card,.nws-year,.nws-page{transition:none}
  .nws-card:hover{transform:none}
}
