.public-statistics-body {
    background: #fbfbf8;
}

.public-statistics-page {
    width: min(100% - 2rem, 72rem);
    margin-inline: auto;
    padding-block: clamp(2.5rem, 7vw, 6rem);
}

.public-statistics-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 2rem;
    padding: clamp(1.5rem, 5vw, 4rem);
    border-radius: 1.75rem;
    background:
        radial-gradient(circle at 90% 10%, rgba(99, 102, 241, .32), transparent 32%),
        linear-gradient(145deg, #101a2b 0%, #17233a 100%);
    color: #d7deea;
}

.public-statistics-hero .eyebrow,
.public-statistics-lessons .eyebrow {
    color: #aeb9ff;
}

.public-statistics-hero h1 {
    max-width: 48rem;
    margin: 0;
    color: #fff;
    font-size: clamp(2.45rem, 7vw, 5.25rem);
    letter-spacing: -.055em;
    line-height: .98;
}

.public-statistics-hero__lead {
    max-width: 43rem;
    margin: 1.35rem 0 0;
    color: #b9c3d2;
    font-size: clamp(1rem, 2vw, 1.15rem);
    line-height: 1.7;
}

.public-statistics-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.6rem;
}

.public-statistics-hero .button--ghost {
    border-color: #46536a;
    color: #f8fafc;
}

.public-statistics-source {
    max-width: 42rem;
    margin: 1.25rem 0 0;
    color: #8895a8;
    font-size: .74rem;
    line-height: 1.55;
}

.public-statistics-hero__result {
    align-self: end;
    padding: 1.4rem;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 1.2rem;
    background: rgba(255, 255, 255, .07);
    backdrop-filter: blur(12px);
}

.public-statistics-hero__number {
    display: block;
    color: #a7f3d0;
    font-size: clamp(3.2rem, 10vw, 5.7rem);
    font-weight: 780;
    letter-spacing: -.065em;
    line-height: .95;
}

.public-statistics-hero__result strong {
    display: block;
    margin-top: .65rem;
    color: #fff;
    font-size: 1.05rem;
}

.public-statistics-hero__result p {
    margin: .65rem 0 0;
    color: #aeb9c9;
    font-size: .86rem;
    line-height: 1.6;
}

.public-statistics-summary {
    display: grid;
    gap: 1px;
    overflow: hidden;
    margin-top: 1rem;
    border: 1px solid #e2e4e8;
    border-radius: 1.25rem;
    background: #e2e4e8;
}

.public-statistics-summary article {
    padding: 1.25rem;
    background: #fff;
}

.public-statistics-summary span {
    display: block;
    color: var(--brand-dark);
    font-size: 2.2rem;
    font-weight: 780;
    letter-spacing: -.05em;
}

.public-statistics-summary strong {
    display: block;
    margin-top: .25rem;
    color: var(--ink);
}

.public-statistics-summary p {
    margin: .5rem 0 0;
    color: var(--muted);
    font-size: .82rem;
    line-height: 1.55;
}

.public-statistics-section {
    padding-block: clamp(4rem, 8vw, 6.5rem);
}

.public-statistics-section--tinted {
    position: relative;
}

.public-statistics-section--tinted::before {
    position: absolute;
    z-index: -1;
    inset: 0 -50vw;
    border-block: 1px solid var(--line);
    background: #f3f4f7;
    content: "";
}

.public-statistics-section__heading {
    display: grid;
    gap: 1rem;
    margin-bottom: 2rem;
}

.public-statistics-section__heading h2,
.public-statistics-lessons h2,
.public-statistics-cta h2 {
    max-width: 42rem;
    margin: 0;
    font-size: clamp(2rem, 5vw, 3.5rem);
    letter-spacing: -.045em;
}

.public-statistics-section__heading > p {
    max-width: 35rem;
    margin: 0;
    color: var(--muted);
    line-height: 1.7;
}

.deadline-story,
.format-and-download-grid {
    display: grid;
    gap: 1rem;
}

.deadline-chart,
.deadline-takeaway,
.format-card,
.download-card,
.material-behaviour-card {
    padding: clamp(1.25rem, 4vw, 2rem);
    border: 1px solid var(--line);
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: var(--shadow-xs);
}

.deadline-chart {
    display: grid;
    gap: 1rem;
}

.deadline-chart__row {
    display: grid;
    grid-template-columns: minmax(6.8rem, auto) minmax(5rem, 1fr) 2.5rem;
    align-items: center;
    gap: .65rem;
    font-size: .8rem;
}

.deadline-chart__row > span {
    color: var(--ink-soft);
}

.deadline-chart__track {
    height: .7rem;
    overflow: hidden;
    border-radius: 999px;
    background: #eceef3;
}

.deadline-chart__track i {
    display: block;
    height: 100%;
    min-width: .35rem;
    border-radius: inherit;
    background: linear-gradient(90deg, #6568d8, #8b8de8);
}

.deadline-chart__row strong {
    text-align: right;
}

.deadline-chart > p {
    margin: .35rem 0 0;
    color: var(--faint);
    font-size: .74rem;
}

.deadline-takeaway {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-color: #d8dbfb;
    background: #f2f2ff;
}

.deadline-takeaway__label {
    color: var(--brand-dark);
    font-size: .7rem;
    font-weight: 760;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.deadline-takeaway > strong {
    margin-top: .8rem;
    color: var(--ink);
    font-size: 1.4rem;
    letter-spacing: -.025em;
    line-height: 1.25;
}

.deadline-takeaway p {
    margin: .8rem 0 0;
    color: var(--muted);
    font-size: .9rem;
    line-height: 1.65;
}

.deadline-takeaway__metric {
    margin-top: 1.25rem;
    color: var(--brand-dark);
    font-size: .76rem;
    font-weight: 680;
}

.material-behaviour-grid {
    display: grid;
    gap: 1rem;
}

.material-behaviour-card--accent {
    border-color: #cfd2fa;
    background: #ededff;
}

.material-behaviour-card__number {
    color: var(--brand-dark);
    font-size: 2.4rem;
    font-weight: 780;
    letter-spacing: -.055em;
}

.material-behaviour-card h3 {
    margin: .6rem 0 0;
}

.material-behaviour-card p,
.download-card p {
    margin: .7rem 0 0;
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.65;
}

.format-card__bar {
    overflow: hidden;
    display: flex;
    height: 1.1rem;
    border-radius: 999px;
    background: #eceef3;
}

.format-card__segment--1,
.format-card__key--1 {
    background: #6366d8;
}

.format-card__segment--2,
.format-card__key--2 {
    background: #77b6a4;
}

.format-card__segment--3,
.format-card__key--3 {
    background: #d4aa63;
}

.format-card ul {
    display: grid;
    gap: .7rem;
    padding: 0;
    margin: 1.25rem 0 0;
    list-style: none;
}

.format-card li {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .55rem;
    font-size: .87rem;
}

.format-card__key {
    width: .65rem;
    height: .65rem;
    border-radius: 50%;
}

.download-card {
    background: var(--navy);
    color: #d7deea;
}

.download-card .eyebrow {
    color: #aeb9ff;
}

.download-card > strong {
    display: block;
    max-width: 30rem;
    color: #fff;
    font-size: 1.45rem;
    letter-spacing: -.025em;
    line-height: 1.3;
}

.download-card p:not(.eyebrow) {
    color: #adb8c8;
}

.public-statistics-lessons {
    display: grid;
    gap: 2rem;
    padding: clamp(1.5rem, 5vw, 3.5rem);
    border-radius: 1.5rem;
    background: var(--navy);
    color: #d7deea;
}

.public-statistics-lessons h2 {
    color: #fff;
}

.public-statistics-lessons ol {
    display: grid;
    gap: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}

.public-statistics-lessons li {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .9rem;
    padding-block: 1rem;
    border-top: 1px solid #2d394d;
}

.public-statistics-lessons li > span {
    color: #8f9bae;
    font-size: .72rem;
    font-weight: 760;
}

.public-statistics-lessons li strong {
    color: #fff;
}

.public-statistics-lessons li p {
    margin: .35rem 0 0;
    color: #aeb8c7;
    font-size: .84rem;
    line-height: 1.55;
}

.public-statistics-cta {
    display: grid;
    gap: 1.5rem;
    align-items: center;
    margin-top: 1rem;
    padding: clamp(1.5rem, 5vw, 3.5rem);
    border: 1px solid #d8daf4;
    border-radius: 1.5rem;
    background: linear-gradient(135deg, #eeeefe, #f8f7f1);
}

.public-statistics-cta p:not(.eyebrow) {
    max-width: 42rem;
    margin: .8rem 0 0;
    color: var(--muted);
    line-height: 1.65;
}

@media (min-width: 40rem) {
    .public-statistics-page {
        width: min(100% - 3rem, 72rem);
    }

    .public-statistics-summary,
    .material-behaviour-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-statistics-summary article:last-child,
    .material-behaviour-card:last-child {
        grid-column: 1 / -1;
    }

    .deadline-story,
    .format-and-download-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr);
    }

    .public-statistics-section__heading,
    .public-statistics-lessons,
    .public-statistics-cta {
        grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr);
    }

    .public-statistics-section__heading {
        align-items: end;
    }

    .public-statistics-cta .button {
        justify-self: end;
    }
}

@media (min-width: 60rem) {
    .public-statistics-hero {
        grid-template-columns: minmax(0, 1.45fr) minmax(18rem, .55fr);
        align-items: end;
    }

    .public-statistics-summary {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .public-statistics-summary article:last-child,
    .material-behaviour-card:last-child {
        grid-column: auto;
    }

    .material-behaviour-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
