html, body {
    background: var(--site-body-bg, var(--bg));
    color: var(--site-body-text, var(--text));
    font-family: var(--site-font-family, Inter, Arial, sans-serif);
}

.site-header {
    background: var(--site-header-bg, var(--surface));
    border-bottom: 1px solid color-mix(in srgb, var(--site-header-text, var(--text)) 20%, transparent);
    position: sticky;
    top: 0;
    z-index: 10;
}
.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 76px;
    gap: 1rem;
}
.site-logo { font-size: 1.24rem; font-weight: 700; color: var(--site-header-text, var(--text)); }
.site-top-nav { display: flex; gap: 1rem; }
.site-top-nav a { color: color-mix(in srgb, var(--site-header-text, var(--text)) 78%, white 22%); font-weight: 500; }
.site-top-nav a:hover { color: var(--site-header-text, var(--text)); }

.public-main {
    padding: var(--space-6) 0 var(--space-7);
}
.public-main .container {
    width: min(1480px, calc(100% - 3rem));
}
.public-grid {
    display: grid;
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
    gap: clamp(1.2rem, 2.4vw, 2.2rem);
    align-items: start;
}
.site-sidebar {
    padding: var(--space-4);
    position: sticky;
    top: 96px;
    background: var(--site-sidebar-bg, var(--surface));
    color: var(--site-sidebar-text, var(--site-body-text, var(--text)));
}
.site-sidebar__title {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 700;
    color: color-mix(in srgb, var(--site-sidebar-text, var(--site-body-text, var(--text))) 72%, transparent);
    margin-bottom: .7rem;
}
.site-nav-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.site-nav-list a {
    display: block;
    color: var(--site-sidebar-text, var(--site-body-text, var(--text)));
    border-radius: 8px;
    padding: .5rem .65rem;
}
.site-nav-list a:hover {
    background: color-mix(in srgb, var(--site-sidebar-text, var(--site-body-text, var(--text))) 12%, transparent);
    color: var(--site-sidebar-text, var(--site-body-text, var(--text)));
}
.site-nav-list a.is-active {
    background: color-mix(in srgb, var(--site-sidebar-text, var(--site-body-text, var(--text))) 18%, transparent);
    color: var(--site-sidebar-text, var(--site-body-text, var(--text)));
    font-weight: 700;
}

.hero {
    position: relative;
    min-height: clamp(340px, 36vw, 460px);
    background-size: cover;
    background-position: center;
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: var(--space-6);
}
.hero__overlay { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(7,12,22,.62), rgba(7,12,22,.3)); }
.hero__content { position: relative; z-index: 1; color: #fff; max-width: 820px; padding: clamp(1.4rem, 4.2vw, 3.3rem); }
.hero__eyebrow { margin: 0 0 .6rem 0; text-transform: uppercase; font-size: .82rem; letter-spacing: .06em; opacity: .8; }
.hero h1 { font-size: clamp(2rem, 4vw, 3.25rem); margin: 0 0 .4rem 0; line-height: 1.12; }
.hero p { margin: 0; font-size: clamp(1rem, 1.3vw, 1.15rem); }

.content-column { display: grid; gap: var(--space-5); }
.news-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: var(--space-4);
}
.news-card {
    padding: var(--space-5);
    display: grid;
    align-content: start;
}
.news-card__meta { color: var(--text-muted); font-size: .9rem; margin-bottom: .35rem; }
.news-card h3 { margin: 0 0 .45rem 0; }
.news-card p { margin: 0 0 .9rem 0; color: color-mix(in srgb, var(--site-body-text, var(--text)) 86%, transparent); }

.article {
    padding: clamp(1.4rem, 2.6vw, 2.2rem);
}
.article > h1,
.article > .article__meta,
.article > .content-block,
.article > .block-image,
.article > .link-list {
    max-width: 86ch;
}
.article__meta { color: var(--text-muted); margin: .35rem 0 1rem; font-size: .92rem; }
.article__featured {
    width: min(100%, 1100px);
    max-height: 520px;
    object-fit: cover;
    border-radius: var(--radius-md);
    margin-bottom: 1.2rem;
}

.content-block { margin-bottom: 1.2rem; }
.content-block h1, .content-block h2, .content-block h3 { margin: 0 0 .45rem; line-height: 1.25; }
.content-block h1 { font-size: 2rem; }
.content-block h2 { font-size: 1.55rem; }
.content-block h3 { font-size: 1.28rem; }
.content-block p, .content-block li { max-width: 72ch; color: color-mix(in srgb, var(--site-body-text, var(--text)) 92%, transparent); }
.content-block p { margin: .35rem 0 .95rem; }
.content-block ul, .content-block ol { padding-left: 1.1rem; }
.content-block a { font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }

.block-image img { width: 100%; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.block-image figcaption { margin-top: .5rem; color: var(--text-muted); font-size: .88rem; }
.block-image.align-left { max-width: 52%; }
.block-image.align-center { max-width: min(88%, 1000px); margin: 0 auto; }
.block-image.align-right { max-width: 52%; margin-left: auto; }
.block-image.align-full_width { max-width: min(100%, 1150px); }

.link-list { background: var(--surface-muted); border: 1px solid #e0e7f2; border-radius: var(--radius-md); padding: var(--space-4); }
.link-list h3 { margin: 0 0 .7rem; }
.link-list ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.link-list a { display: flex; justify-content: space-between; align-items: center; background: var(--site-sidebar-bg, var(--surface)); color: var(--site-body-text, var(--text)); border: 1px solid color-mix(in srgb, var(--site-body-text, var(--text)) 16%, transparent); border-radius: 8px; padding: .6rem .7rem; }
.link-list a::after { content: "→"; color: color-mix(in srgb, var(--site-body-text, var(--text)) 58%, transparent); }

@media (max-width: 1080px) {
    .public-main .container { width: calc(100% - 1.5rem); }
    .public-grid { grid-template-columns: 1fr; }
    .site-sidebar { position: static; }
    .article > h1,
    .article > .article__meta,
    .article > .content-block,
    .article > .block-image,
    .article > .link-list { max-width: 100%; }
    .block-image.align-left,
    .block-image.align-right,
    .block-image.align-center { max-width: 100%; }
}
