/* ============================================================
   Article pages + article index
   ============================================================ */
.art-body{background:var(--paper)}
.art{padding-block:clamp(36px,5vw,64px) clamp(48px,7vw,88px)}
.art__wrap{max-width:720px}

.art__kicker{
  font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--alarm-deep); margin:0 0 16px;
}
.art__h1{font-size:clamp(28px,4.4vw,44px); line-height:1.08; letter-spacing:-.026em; margin:0 0 20px; text-wrap:balance}
.art__standfirst{
  font-family:var(--f-display); font-size:clamp(17px,2.2vw,21px); line-height:1.55;
  color:var(--ink); margin:0 0 20px;
}
.art__meta{font-size:13.5px; color:var(--mute); margin:0 0 clamp(28px,4vw,40px); padding-bottom:22px; border-bottom:1px solid var(--line)}

.art article h2{font-size:clamp(21px,2.8vw,28px); margin:clamp(34px,4.5vw,48px) 0 14px; letter-spacing:-.018em}
.art article p{font-size:17px; line-height:1.75; margin:0 0 1.05em; color:var(--body)}
.art article strong{color:var(--ink); font-weight:600}
.art article em{font-style:italic}
.art article a{color:var(--accent-ink); text-decoration:underline; text-underline-offset:2px}
.art article a:hover{color:var(--alarm-deep)}

.art article ul,.art article ol{margin:0 0 1.2em; padding:0; display:flex; flex-direction:column; gap:10px}
.art article ul li{position:relative; padding-left:24px; font-size:17px; line-height:1.7; color:var(--body)}
.art article ul li::before{content:""; position:absolute; left:2px; top:.62em; width:7px; height:7px; border-radius:50%; background:var(--accent)}
.art article ol{counter-reset:n}
.art article ol li{counter-increment:n; position:relative; padding-left:32px; font-size:17px; line-height:1.7; color:var(--body)}
.art article ol li::before{
  content:counter(n) "."; position:absolute; left:0; top:0;
  font-family:var(--f-display); font-weight:600; color:var(--accent-ink);
}
.art blockquote{
  margin:1.4em 0; padding:16px 22px; border-left:3px solid var(--accent);
  background:rgba(95,168,208,.07); border-radius:0 var(--r) var(--r) 0;
  font-family:var(--f-display); font-size:18.5px; line-height:1.55; color:var(--ink);
}

.art__cta{
  margin:clamp(40px,5.5vw,60px) 0 0; padding:clamp(26px,3.6vw,34px);
  background:var(--ink); border-radius:var(--r);
  background-image:radial-gradient(560px 300px at 85% 0%, rgba(95,168,208,.16), transparent 66%);
}
.art__cta-k{font-family:var(--f-display); font-size:20px; color:#F7FAFD; margin:0 0 10px; font-weight:600}
.art__cta-t{font-size:15.5px; line-height:1.65; color:var(--body-dark); margin:0 0 22px; max-width:52ch}

.art__related{margin-top:clamp(36px,5vw,52px); padding-top:26px; border-top:1px solid var(--line)}
.art__related h2{font-size:16px; font-family:var(--f-ui); font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--mute); margin:0 0 14px}
.art__related ul{display:flex; flex-direction:column; gap:10px; margin:0; padding:0}
.art__related a{
  display:inline-flex; align-items:center; min-height:44px;
  font-family:var(--f-display); font-size:18px; color:var(--ink);
  text-decoration:none; border-bottom:1px solid transparent;
}
.art__related a:hover{color:var(--accent-ink); border-bottom-color:currentColor}

.art__disc{
  margin-top:clamp(36px,5vw,52px); padding:20px 24px;
  border:1px solid var(--line); border-radius:var(--r); background:var(--paper-2);
  font-size:14.5px; line-height:1.68; color:var(--body);
}
.art__disc strong{color:var(--ink)}

/* ── index of articles ─────────────────────────────────── */
.idx__head{max-width:620px; margin-bottom:clamp(36px,5vw,52px)}
.idx__h1{font-size:clamp(30px,4.6vw,46px); letter-spacing:-.026em; margin:0 0 16px}
.idx__lede{font-size:clamp(16px,1.8vw,18.5px); line-height:1.7; color:var(--body); margin:0}
.idx__grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px}
.idx__card{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:var(--r); padding:clamp(22px,3vw,28px); text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.idx__card:hover{transform:translateY(-3px); box-shadow:0 16px 34px -22px rgba(26,29,40,.4); border-color:#B9C4D2}
.idx__k{font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--alarm-deep); margin:0 0 10px}
.idx__t{font-family:var(--f-display); font-size:21px; line-height:1.25; color:var(--ink); margin:0 0 10px; letter-spacing:-.015em}
.idx__d{font-size:14.5px; line-height:1.6; color:var(--body); margin:0; flex:1}
.idx__go{margin-top:16px; font-size:14px; font-weight:600; color:var(--accent-ink)}