@layer components {
    .content-width { width: min(1280px, calc(100% - 112px)); margin-inline: auto; }
    .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
    .site-navigation a { position: relative; font-size: 13px; font-weight: 650; padding: 14px 4px; }
    .site-navigation a::after { content: ''; position: absolute; left: 4px; right: 4px; bottom: 6px; height: 2px; background: var(--brand-red); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
    .site-navigation a:hover::after, .site-navigation a[aria-current="page"]::after { transform: scaleX(1); }
    .section-kicker { color: var(--muted); font-size: 10px; letter-spacing: .16em; font-weight: 750; margin-bottom: 13px; }
    .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 34px; }
    .section-heading h2 { font-weight: 550; font-size: clamp(28px, 3.1vw, 43px); letter-spacing: -.055em; line-height: 1.15; }
    .section-heading h2 > span, .editorial__heading h1 > span { color: var(--brand-red); }
    .activity { padding-block: 76px 68px; }
    .activity__date { font-size: 29px; font-weight: 650; letter-spacing: -.045em; text-align: right; color: var(--ink); }
    .activity__date > span { display: block; font-size: 10px; font-weight: 450; color: var(--muted); letter-spacing: 0; margin-top: 6px; }
    .activity__grid { display: grid; grid-template-columns: repeat(4, 1fr); border-block: 1px solid var(--line); padding-block: 28px; }
    .activity__item { position: relative; display: flex; flex-direction: column; gap: 19px; padding: 10px 24px 12px; border-left: 1px solid var(--line); }
    .activity__item:first-child { padding-left: 0; border: 0; }
    .activity__item > i { color: var(--accent); font-size: 16px; opacity: .8; }
    .activity__value { display: block; font-size: clamp(30px, 4.1vw, 57px); font-weight: 550; letter-spacing: -.065em; font-variant-numeric: tabular-nums; line-height: 1.15; }
    .activity__label { display: block; color: var(--muted); font-size: 12px; margin-top: 11px; }
    .page-news .site-footer { border-top: 1px solid var(--line); }
    .site-progress { font-size: 10px; display: flex; gap: 9px; align-items: center; color: var(--muted); padding-block: 17px; border-block: 1px solid var(--line); }
    .site-progress > span { width: 5px; height: 5px; background: var(--brand-red); border-radius: 50%; }
    .editorial { padding-bottom: 72px; }
    .editorial__heading { padding-block: 55px 43px; }
    .editorial__heading h1 { font-size: clamp(35px, 4.6vw, 66px); font-weight: 550; letter-spacing: -.065em; line-height: 1.1; max-width: 860px; }
    .editorial__heading > p:last-child { font-size: 14px; color: var(--muted); line-height: 1.8; margin-top: 20px; }
    .news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 27px; row-gap: 40px; }
    .news-card { min-width: 0; }
    .news-card__image { display: block; aspect-ratio: 16/9; background: var(--subtle); border-radius: 16px; overflow: hidden; }
    .news-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
    .news-card:hover .news-card__image img { transform: scale(1.025); }
    .news-card__date { font-size: 9px; color: var(--muted); line-height: 1.6; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-block: 19px 12px; }
    .news-card__date > span { color: var(--accent); font-size: 8px; font-weight: 750; letter-spacing: .08em; border-left: 1px solid var(--line); padding-left: 9px; }
    .news-card h2 { font-size: 21px; line-height: 1.4; font-weight: 650; letter-spacing: -.04em; }
    .news-card h2 a { color: var(--ink); text-decoration: none; }
    .news-card h2 a:hover { color: var(--accent); }
    .news-card__excerpt { color: var(--muted); line-height: 1.85; font-size: 12px; margin-top: 14px; }
    .text-link { display: inline-flex; align-items: center; gap: 15px; color: var(--ink); text-decoration: none; font-size: 11px; font-weight: 750; padding-block: 13px 7px; border-bottom: 1px solid var(--accent); margin-top: 12px; }
    .text-link > i { color: var(--accent); font-size: 11px; transition: transform .2s; }
    .text-link:hover > i { transform: translateX(3px); }
    .news-card--featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1.2fr 1fr; gap: 43px; align-items: center; padding-bottom: 39px; border-bottom: 1px solid var(--line); margin-bottom: 1px; }
    .news-card--featured .news-card__image { aspect-ratio: 16/10; border-radius: 20px; }
    .news-card--featured .news-card__date { margin-top: 0; }
    .news-card--featured h2 { font-size: clamp(25px, 2.5vw, 36px); font-weight: 600; line-height: 1.25; letter-spacing: -.05em; }
    .news-card--featured .news-card__excerpt { font-size: 13px; margin-top: 18px; }
    .pagination { display: flex; justify-content: center; gap: 8px; margin-top: 53px; }
    .pagination a { min-width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); color: var(--ink); text-decoration: none; border-radius: 50%; font-size: 12px; }
    .pagination a[aria-current="page"] { background: var(--ink); color: var(--page); border-color: var(--ink); }
    .pagination a:hover { border-color: var(--accent); }
    .breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 26px; color: var(--muted); font-size: 11px; }
    .breadcrumbs a { color: var(--muted); text-decoration: none; }
    .breadcrumbs a:hover { color: var(--accent); }
    .article-heading { max-width: 1040px; padding-block: 43px 34px; }
    .article-heading h1 { font-size: clamp(32px, 4.1vw, 57px); font-weight: 550; line-height: 1.17; letter-spacing: -.055em; text-wrap: pretty; }
    .article-heading__byline { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--muted); margin-top: 24px; }
    .article-heading__byline b { font-weight: 400; color: var(--brand-red); }
    .article-heading__updated { font-size: 10px; color: var(--muted); margin-top: 9px; }
    .article-cover { margin: 0 0 49px; width: 100%; aspect-ratio: 16/7; overflow: hidden; border-radius: 22px; background: var(--subtle); }
    .article-cover img { width: 100%; height: 100%; object-fit: cover; }
    .article-body { max-width: 780px; margin-inline: auto; color: var(--ink); font-size: 16px; line-height: 1.95; overflow-wrap: anywhere; }
    .article-body p, .article-body ul, .article-body ol, .article-body blockquote, .article-body table, .article-body figure { margin-block: 0 23px; }
    .article-body h2 { font-size: clamp(24px, 2.5vw, 32px); font-weight: 650; line-height: 1.4; letter-spacing: -.04em; margin-block: 43px 20px; }
    .article-body h3, .article-body h4 { font-size: 21px; font-weight: 650; line-height: 1.5; letter-spacing: -.025em; margin-block: 32px 15px; }
    .article-body strong, .article-body b { font-weight: 750; }
    .article-body a { color: var(--accent); text-underline-offset: 4px; }
    .article-body ul, .article-body ol { padding-left: 26px; }
    .article-body li { padding-left: 4px; margin-bottom: 9px; }
    .article-body li::marker { color: var(--brand-red); }
    .article-body img { height: auto; border-radius: 12px; margin: 25px auto; }
    .article-body blockquote { border-left: 3px solid var(--brand-red); padding: 8px 0 8px 24px; color: var(--muted); }
    .article-body table { display: block; overflow-x: auto; border-collapse: collapse; width: 100%; font-size: 13px; }
    .article-body th, .article-body td { padding: 12px; text-align: left; border-bottom: 1px solid var(--line); }
    .article-body th { background: var(--subtle); }
    .article-body hr { border: 0; border-top: 1px solid var(--line); margin-block: 33px; }
    .article-return { max-width: 780px; margin: 35px auto 0; padding-top: 12px; border-top: 1px solid var(--line); }
    .related-news { padding-top: 68px; }
    .error-page { min-height: 58vh; padding-block: 85px; }
    .error-page h1 { font-size: clamp(30px, 4vw, 54px); letter-spacing: -.055em; margin-bottom: 25px; }
    .error-page > p:not(.section-kicker) { color: var(--muted); line-height: 1.9; margin-bottom: 20px; }
}
@layer responsive {
    @media (max-width: 1000px) { .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.news-card--featured { gap: 27px; }.content-width { width: calc(100% - 70px); } }
    @media (max-width: 700px) {
        .site-header { grid-template-columns: 1fr auto; row-gap: 0; }
        .site-navigation { grid-column: 1 / -1; grid-row: 2; justify-content: center; gap: 20px; padding-top: 2px; }
        .site-navigation a { font-size: 12px; padding-block: 9px 12px; }
        .header-actions { grid-row: 1; }
        .content-width { width: calc(100% - 48px); }
        .activity { padding-block: 46px 35px; }
        .section-heading { align-items: start; gap: 15px; margin-bottom: 24px; }
        .section-kicker { font-size: 8px; line-height: 1.7; letter-spacing: .12em; }
        .section-heading h2 { font-size: 27px; }
        .activity__date { font-size: 24px; }
        .activity__date > span { font-size: 8px; max-width: 105px; line-height: 1.7; }
        .activity__grid { grid-template-columns: 1fr 1fr; gap: 25px 0; padding-block: 21px; }
        .activity__item { padding: 3px 0 6px 19px; gap: 12px; }
        .activity__item:nth-child(3) { border-left: 0; padding-left: 0; }
        .activity__value { font-size: 37px; }
        .activity__label { font-size: 10px; }
        .editorial { padding-bottom: 45px; }
        .editorial__heading { padding-block: 35px; }
        .editorial__heading h1 { font-size: 37px; }
        .editorial__heading > p:last-child { font-size: 12px; }
        .news-grid { grid-template-columns: 1fr; row-gap: 34px; }
        .news-card--featured { grid-template-columns: 1fr; gap: 0; padding-bottom: 30px; }
        .news-card--featured .news-card__image { aspect-ratio: 16/9; border-radius: 15px; }
        .news-card--featured .news-card__date { margin-top: 18px; }
        .news-card h2, .news-card--featured h2 { font-size: 23px; line-height: 1.4; }
        .news-card__excerpt, .news-card--featured .news-card__excerpt { font-size: 13px; }
        .article-heading { padding-top: 30px; }
        .article-heading h1 { font-size: 34px; }
        .article-cover { aspect-ratio: 16/10; border-radius: 15px; margin-bottom: 28px; }
        .article-body { font-size: 15px; line-height: 1.9; }
        .article-body h2 { font-size: 24px; }
        .article-body h3 { font-size: 20px; }
        .site-progress { font-size: 9px; line-height: 1.6; }
        .related-news { padding-top: 43px; }
    }
}
