*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --blue: #051c5d;
    --blue-dark: #2f4686;
    --red: #9F1316;
    --red-dark: #7a0e10;
    --green: #108D61;
    --green-dark: #094530;
    --text-dark: #1a1a1a;
    --text-mid: #444;
    --text-white: #fff;
    --bg-light: #F4F4F2;
    --gray: #d6d9eb;
    --font-h: 'Montserrat', sans-serif;
    --font-b: 'Open Sans', sans-serif;
    --section-y: clamp(4rem, 2.7rem + 4.8vw, 7rem);
    --section-y-tight: clamp(3rem, 2.15rem + 3vw, 5rem);
    --section-y-compact: clamp(2.5rem, 1.95rem + 2.1vw, 4rem);
    --section-x: clamp(1rem, 0.5rem + 2vw, 2.25rem);
    --section-x-wide: clamp(1.5rem, 6vw, 7.375rem);
    --section-hero-y: clamp(5.75rem, 4.5rem + 5vw, 9.375rem);
    --layout-gap: clamp(1.5rem, 1rem + 2vw, 3rem);
    --layout-gap-wide: clamp(2.625rem, 1.5rem + 5vw, 9.375rem);
    --panel-padding: clamp(2rem, 1.35rem + 2.5vw, 3.25rem);
    --panel-padding-wide: clamp(2.625rem, 2rem + 3vw, 5.5rem);
    --radius-panel: 24px;
    --radius-card: 12px;
    --shadow-card: 0 16px 36px rgba(28, 35, 48, 0.14);
    --control-y: clamp(0.75rem, 0.62rem + 0.6vw, 1.125rem);
    --control-x: clamp(1.5rem, 1.05rem + 2vw, 3.25rem);
    --icon-button-size: clamp(1.875rem, 3vw, 2.5rem);
    --icon-size: clamp(0.875rem, 1.4vw, 1.125rem);
    --type-display: clamp(3rem, 2rem + 4vw, 5.5rem);
    --type-h1: clamp(2.5rem, 1.7rem + 3vw, 4.25rem);
    --type-h2: clamp(1.9rem, 1.45rem + 1.8vw, 2.75rem);
    --type-h3: clamp(1.25rem, 1rem + 0.9vw, 1.75rem);
    --type-h4: clamp(0.9rem, 0.8rem + 0.35vw, 1.05rem);
    --type-body: clamp(1rem, 0.94rem + 0.28vw, 1.16rem);
    --type-body-sm: clamp(0.88rem, 0.82rem + 0.22vw, 1rem);
    --type-caption: clamp(0.75rem, 0.7rem + 0.18vw, 0.88rem);
    --type-button: clamp(0.75rem, 0.68rem + 0.3vw, 0.9375rem);
    --type-nav: clamp(0.8125rem, 0.76rem + 0.25vw, 1rem);
    --type-footer: clamp(0.78rem, 0.72rem + 0.2vw, 0.92rem);
    --type-footer-label: clamp(0.7rem, 0.65rem + 0.18vw, 0.82rem);
    --type-about-hero: clamp(2.55rem, 5.2vw, 4.8rem);
    --type-vm-title: clamp(1.5rem, 2.1vw, 2.75rem);
    --type-vm-body: clamp(0.5rem, 1.3vw, 1.375rem);
    --type-divider-title: clamp(1.375rem, 4vw, 3.5rem);
    --type-divider-copy: clamp(0.75rem, 1.25vw, 1.25rem);
    --type-chart-title: clamp(0.9375rem, 1.65vw, 1.5625rem);
    --type-chart-label: clamp(0.75rem, 0.95vw, 0.9375rem);
    --weight-heading: 800;
    --weight-heading-heavy: 900;
    --weight-body: 500;
    --weight-ui: 600;
    --weight-body-bold: 700;
    --leading-heading: 1.08;
    --leading-title: 1.15;
    --leading-body: 1.55;
    --leading-tight: 1.25;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: var(--font-b);
    color: var(--text-dark);
    background: #fff;
    overflow-x: hidden;
    max-width: 100%;
}

ul {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
    transition: all .3s ease;
}

h1 {
    font-family: var(--font-h);
    font-size: var(--type-h1);
    font-weight: var(--weight-heading);
    line-height: var(--leading-heading);
    color: var(--text-dark);
    text-transform: uppercase;
    letter-spacing: 0;
}

h2 {
    font-family: var(--font-h);
    font-size: var(--type-h2);
    font-weight: var(--weight-heading);
    line-height: var(--leading-title);
    color: var(--text-dark);
    text-transform: uppercase;
}

h3 {
    font-family: var(--font-h);
    font-size: var(--type-h3);
    font-weight: var(--weight-heading);
    line-height: var(--leading-title);
    color: var(--text-dark);
    text-transform: uppercase;
}

h4 {
    font-family: var(--font-h);
    font-size: var(--type-h4);
    font-weight: var(--weight-heading);
    line-height: var(--leading-tight);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
}

p {
    font-family: var(--font-b);
    font-size: var(--type-body);
    color: var(--text-mid);
    line-height: var(--leading-body);
    font-weight: var(--weight-body);
}

strong {
    font-family: var(--font-h);
    font-size: var(--type-caption);
    font-weight: var(--weight-body-bold);
    line-height: var(--leading-tight);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-dark);
    display: block;
}

span {
    font-family: var(--font-h);
    font-size: var(--type-caption);
    font-weight: var(--weight-ui);
    display: block;
    line-height: 1.3;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

.section {
    padding: var(--section-y) var(--section-x);
}

.section-flush-x {
    padding-left: 0;
    padding-right: 0;
}

.panel-pad {
    padding: var(--panel-padding);
}

.panel-pad-wide {
    padding: var(--panel-padding-wide);
}

.rich-text strong {
    display: inline;
    color: var(--blue-dark);
    font-family: var(--font-b);
    font-size: inherit;
    font-weight: var(--weight-heading);
    line-height: inherit;
    letter-spacing: 0;
    text-transform: none;
}

.section-title {
    position: relative;
    width: fit-content;
    margin-inline: auto;
    margin-bottom: clamp(1.75rem, 2vw, 2.5rem);
    text-align: center;
    color: var(--blue);
}

.section-title::after {
    content: "";
    display: block;
    width: clamp(4.5rem, 8vw, 6rem);
    height: 4px;
    margin: clamp(0.9rem, 1.5vw, 1.2rem) auto 0;
    border-radius: 999px;
    background: var(--blue);
}

.section-subtitle {
    width: min(100%, 860px);
    margin:
        calc(clamp(1.75rem, 2vw, 2.5rem) * -0.35)
        auto
        clamp(2.75rem, 2rem + 3vw, 4rem);

    text-align: center;
    color: var(--text-dark);
    font-size: var(--type-body);
    line-height: 1.6;
}


@media (max-width: 820px) {
    html {
        scrollbar-width: none;
    }

    body::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    :root {
        --section-y: clamp(2.875rem, 2.3rem + 4vw, 4.25rem);
        --section-y-tight: clamp(2.25rem, 1.85rem + 2.5vw, 3.25rem);
        --section-y-compact: clamp(2rem, 1.7rem + 2vw, 2.75rem);
        --section-x: clamp(1rem, 4vw, 1.5rem);
        --section-x-wide: var(--section-x);
        --section-hero-y: clamp(5.5rem, 4.5rem + 4vw, 7rem);
        --layout-gap-wide: clamp(2rem, 1.25rem + 4vw, 4.5rem);
    }
}

@media (max-width: 560px) {
    :root {
        --section-y: clamp(2.35rem, 2rem + 4vw, 3.25rem);
        --section-y-tight: clamp(1.875rem, 1.65rem + 2.5vw, 2.5rem);
        --section-y-compact: clamp(1.75rem, 1.45rem + 2vw, 2.2rem);
        --section-x: 1rem;
        --section-x-wide: var(--section-x);
        --section-hero-y: clamp(5rem, 4.5rem + 3vw, 6rem);
        --panel-padding: 1.375rem;
    }
}