/* BK news article pages + linked news cards (2026-11-10 SEO). Loaded after site.css; uses its tokens.
   Built by build_news_pages.py. Kept separate from site.css on purpose. */

/* cards: title links to the article page */
.card .card-link{color:inherit;text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .3s var(--ease),color .2s}
.card .card-link:hover{color:var(--green);background-size:100% 1px}
.card .out-in{color:var(--crimson)}
.card .out-in:after{content:" →"}

/* article header */
.art-head{background:var(--deep);color:#fff;position:relative;overflow:hidden}
.art-head:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 140% at 100% 0%,rgba(217,183,126,.14),rgba(4,41,26,0) 55%)}
.art-wrap{max-width:860px}
.art-head .wrap{position:relative;padding-top:var(--s8);padding-bottom:var(--s6)}
.art-crumb{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:#b9cbc1;margin-bottom:var(--s3)}
.art-crumb a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.4)}
.art-head h1{font-size:38px;line-height:1.3;letter-spacing:-.03em;margin:var(--s2) 0 var(--s2)}
.art-meta{display:flex;flex-wrap:wrap;gap:4px 0;font-size:14px;color:#cfdcd4}
.art-meta span:before{content:"·";margin:0 10px;color:#8fa99a}

/* article body */
.art-body{padding-top:var(--s6)}
.art-after{padding-bottom:var(--s10)}
.art-main .art-sec,.art-main .art-rel{padding:0}  /* site.css pads every <section> 128px */
.art-sec{margin-bottom:var(--s5)}
.art-note{padding:var(--s4)!important}
.art-sec h2{font-size:20px;line-height:1.4;margin:0 0 var(--s2);letter-spacing:-.02em}
.art-sec p{font-size:17px;line-height:1.85;color:var(--ink2)}
.art-note{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--crimson);border-radius:var(--r2);padding:var(--s4)}
.art-note h2{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.art-badge{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.02em;color:#fff;background:var(--crimson);padding:4px 10px;border-radius:999px}
.art-fine{font-size:13.5px!important;line-height:1.7!important;color:var(--sub)!important;margin-top:var(--s2)}
.art-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.art-links a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:700;color:var(--green);text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(7,64,40,.35)}
.art-links a:hover{text-decoration-color:var(--green)}
.art-guide{font-size:15px!important;margin-top:var(--s2)}
.art-guide a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* prev / next */
.art-pn{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);border-top:1px solid var(--line);padding-top:var(--s4);margin-top:var(--s2)}
.art-pn a{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:var(--r1);padding:var(--s2) var(--s3);transition:border-color .2s,box-shadow .2s}
.art-pn a:hover{border-color:var(--green);box-shadow:var(--shadow)}
.art-pn .pn-next{text-align:right}
.art-pn small{font-size:12.5px;font-weight:700;color:var(--sub)}
.art-pn b{font-size:15px;line-height:1.5;color:var(--ink)}

/* related */
.art-rel{margin-top:var(--s6)}
.art-rel h2{font-size:20px;margin:0 0 var(--s2)}
.art-rel ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.art-rel li{border-bottom:1px solid var(--line)}
.art-rel a{display:grid;grid-template-columns:118px 1fr;gap:6px 16px;padding:14px 0;align-items:baseline}
.art-rel time{font-size:13.5px;color:var(--sub);font-variant-numeric:tabular-nums}
.art-rel b{font-size:16px;line-height:1.55;color:var(--ink)}
.art-rel a:hover b{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.art-back{margin-top:var(--s2)}

@media (max-width:760px){
  .art-head .wrap{padding-top:var(--s5);padding-bottom:var(--s4)}
  .art-head h1{font-size:26px}
  .art-sec p{font-size:16px}
  .art-note{padding:var(--s3)!important}
  .art-pn{grid-template-columns:1fr}
  .art-pn .pn-next{text-align:left}
  .art-rel a{grid-template-columns:1fr}
}
@media (max-width:640px){.art-body{padding-top:var(--s4)}}