:root {
    --color-navy-950: #06111f;
    --color-navy-900: #0a1728;
    --color-navy-850: #0d1c30;
    --color-navy-800: #12243a;

    --color-blue-600: #1769e0;
    --color-blue-500: #2f80ed;
    --color-blue-400: #5aa2ff;

    --color-white: #ffffff;
    --color-gray-50: #f7f9fc;
    --color-gray-100: #edf1f6;
    --color-gray-300: #c9d2df;
    --color-gray-500: #7a8798;
    --color-gray-700: #3d4858;
    --color-gray-900: #151d29;

    --border-dark: rgba(255, 255, 255, 0.12);
    --border-light: #dce3ec;

    --shadow-soft:
        0 20px 60px rgba(4, 15, 30, 0.10);

    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 28px;

    --container-width: 1180px;

    --font-sans:
        Inter,
        ui-sans-serif,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}


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


html {
    scroll-behavior: smooth;
}


body {
    margin: 0;
    font-family: var(--font-sans);
    background: var(--color-white);
    color: var(--color-gray-900);
    line-height: 1.6;
}


a {
    color: inherit;
    text-decoration: none;
}


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


.container {
    width: min(
        calc(100% - 48px),
        var(--container-width)
    );
    margin-inline: auto;
}


.section {
    padding: 120px 0;
}


.section--light {
    background: #f4f6f9;
    color: var(--color-navy-950);
}

.section--dark {
    background: var(--color-navy-950);
    color: var(--color-white);
}


.eyebrow {
    margin-bottom: 20px;
    color: var(--color-blue-600);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}


.eyebrow--light {
    color: var(--color-blue-400);
}


h1,
h2,
h3,
p {
    margin-top: 0;
}


h1,
h2,
h3 {
    line-height: 1.1;
    letter-spacing: -0.035em;
}


h2 {
    font-size: clamp(
        2.2rem,
        5vw,
        4.2rem
    );
}


h2 span {
    color: var(--color-blue-500);
}