/* A magazine index, not a card grid: two pillar guides lead, then a dated list that reads like a contents page. */
.bhead{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(20px,5vw,80px);align-items:end;padding-block:clamp(48px,7vw,96px) clamp(28px,4vw,48px)}
.bhead>*{animation:rise var(--ds-dur-4) var(--ds-ease-out) both}.bhead>*:nth-child(2){animation-delay:90ms}
.bhead p{color:var(--ds-text-2);font-size:var(--ds-fs-lead);line-height:1.7}
.bmeta{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:10px;font-size:.875rem;color:var(--ds-text-3)}
.bmeta a{display:inline-flex;align-items:center;min-height:44px}
.lead-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(16px,2vw,24px)}
.story-a{display:flex;flex-direction:column;gap:14px;border-radius:var(--ds-radius-xl);padding:clamp(24px,4vw,52px);color:inherit;text-decoration:none;min-width:0;transition:transform var(--ds-dur-3) var(--ds-ease-out),box-shadow var(--ds-dur-3) var(--ds-ease-out)}
.story-a:hover{color:inherit;transform:translateY(-3px);box-shadow:var(--ds-shadow-float)}
.story-a.one{background-color:var(--ds-accent-wash)}
.story-a.two{background-color:var(--ds-surface-2)}
.kicker{font-size:.875rem;font-weight:600;color:var(--ds-accent)}
.story-a h2{font-size:clamp(1.5rem,1.2rem + 1.5vw,2.75rem)}
.story-a.two h2{font-size:clamp(1.25rem,1.1rem + .8vw,1.75rem)}
.story-a p{color:var(--ds-text-2);line-height:1.75;max-width:52ch}
.by{margin-top:auto;padding-top:12px;font-size:.875rem;color:var(--ds-text-3)}
.mini-p{background-color:var(--ds-surface);border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);padding:14px 16px;display:grid;gap:8px;font-size:.875rem}
.mini-p div{display:flex;justify-content:space-between;gap:12px}
.mini-p b{font-weight:600;font-variant-numeric:tabular-nums}
.mini-p .real{border-top:1px solid var(--ds-border);padding-top:8px;font-weight:600}
.mini-p .real b{font:600 1.5rem/1.1 var(--ds-font-display);color:var(--ds-accent)}
.cats{display:flex;flex-wrap:wrap;gap:6px;margin-block:clamp(36px,5vw,64px) 8px}
.cats a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding-inline:14px;border-radius:var(--ds-radius-md);color:var(--ds-text-2);text-decoration:none;font-size:.9375rem;font-weight:500;background-color:var(--ds-surface-2);transition:color var(--ds-dur-1) ease-out,background-color var(--ds-dur-1) ease-out}
.cats a:hover,.cats a[aria-current]{color:var(--ds-accent);background-color:var(--ds-accent-wash)}
.cats small{font-size:.8125rem;color:var(--ds-text-3)}
.plist{list-style:none;margin:0;padding:0}
.plist a{display:grid;grid-template-columns:110px minmax(0,1fr) 240px;gap:8px clamp(16px,3vw,48px);align-items:baseline;padding-block:22px;border-top:1px solid var(--ds-border);color:inherit;text-decoration:none}
.plist li:last-child a{border-bottom:1px solid var(--ds-border)}
.plist a:hover{color:inherit}
.plist time{font-size:.875rem;color:var(--ds-text-3)}
.plist h3{font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem);transition:color var(--ds-dur-1) ease-out}
.plist a:hover h3{color:var(--ds-accent)}
.plist .gl{display:block;margin-top:4px;font:400 .875rem/1.5 var(--ds-font-body);color:var(--ds-text-3)}
.plist .cm{font-size:.875rem;color:var(--ds-text-3);text-align:end}
.bend{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 40px;align-items:center;margin-top:clamp(40px,6vw,72px);padding:clamp(22px,3vw,36px);border:1px solid var(--ds-border);border-radius:var(--ds-radius)}
.bend h2{font-size:clamp(1.25rem,1.1rem + .6vw,1.625rem);margin-bottom:6px}.bend p{color:var(--ds-text-2)}
.in-ar{background-color:var(--ds-warn-soft);color:var(--ds-text);border-radius:var(--ds-radius-sm);padding:10px 14px;font-size:.9375rem}
@supports (animation-timeline:view()){.plist li,.bend{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 30%}}
@media (max-width:1020px){.bhead,.lead-grid,.bend{grid-template-columns:minmax(0,1fr)}}
@media (max-width:720px){.plist a{grid-template-columns:minmax(0,1fr)}.plist .cm{text-align:start}}
/* Arabic headlines on the English page must not inherit the tight Latin leading and tracking, which breaks letter joining */
.pg h1[lang="ar"],.pg h2[lang="ar"],.pg h3[lang="ar"],.pg .body[lang="ar"] h2{line-height:1.4;letter-spacing:0}

