.content-page {
    padding: var(--sp-7) 0 var(--sp-12);
}

.content-page__card {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.94), rgba(255,255,255,0.98)),
        var(--c-surface);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: var(--r-lg);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08);
    color: var(--c-text);
    margin: 0 auto;
    max-width: min(100%, 1180px);
    overflow: hidden;
}

.content-page__header {
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
    padding: clamp(24px, 4vw, 44px) clamp(20px, 5vw, 64px) clamp(18px, 3vw, 30px);
    text-align: center;
}

.content-page__title {
    font-size: clamp(1.5rem, 2.4vw, 2.35rem);
    line-height: var(--lh-tight);
    margin: 0;
}

.content-page__body {
    line-height: var(--lh-relaxed);
    padding: clamp(22px, 5vw, 64px);
}

.content-page__body :where(h1, h2, h3, h4) {
    margin: var(--sp-7) 0 var(--sp-3);
}

.content-page__body :where(p, ul, ol) {
    margin-bottom: var(--sp-4);
}

.content-page__body :where(p, li) {
    color: color-mix(in srgb, var(--c-text) 82%, var(--c-text-muted));
    font-size: var(--text-base);
}

.content-page__body :where(ul, ol) {
    padding-left: 1.25rem;
}

.content-page__body :where(a) {
    color: var(--c-primary);
    font-weight: var(--fw-semi);
}

.content-page__body :where(img, iframe) {
    max-width: 100%;
}

@media (max-width: 700px) {
    .content-page {
        padding-top: var(--sp-4);
    }

    .content-page .container {
        padding-left: var(--sp-3);
        padding-right: var(--sp-3);
    }
}