:root{
    --ink:#152238;
    --muted:#657286;
    --blue:#154f88;
    --blue-dark:#103b6b;
    --blue-soft:#eaf2f9;
    --bg:#f4f6f8;
    --line:#e2e7ec;
    --white:#ffffff;
    --radius:22px;
    --radius-large:32px;
    --shadow:0 18px 50px rgba(21,45,75,.08);
}

html{scroll-behavior:smooth}

body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:Arial,Helvetica,sans-serif;
    -webkit-font-smoothing:antialiased;
}

body *{box-sizing:border-box}

header{
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.90);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(220,226,233,.75);
}

h1,h2,h3{letter-spacing:-.025em}

.card,
.step,
.future,
.statement{
    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        box-shadow .35s ease,
        border-color .35s ease;
}

.card:hover,
.step:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow);
    border-color:#d2dce6;
}

.btn,
.button,
button{
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.btn:hover,
.button:hover,
button:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 22px rgba(17,61,105,.16);
}

.reveal{
    opacity:0;
    transform:translateY(28px);
    transition:
        opacity .75s cubic-bezier(.2,.8,.2,1),
        transform .75s cubic-bezier(.2,.8,.2,1);
}

.reveal.is-visible{
    opacity:1;
    transform:none;
}

.reveal-stagger > *{
    opacity:0;
    transform:translateY(25px);
    transition:
        opacity .65s ease,
        transform .65s cubic-bezier(.2,.8,.2,1);
}

.reveal-stagger.is-visible > *{
    opacity:1;
    transform:none;
}

.reveal-stagger.is-visible > *:nth-child(1){transition-delay:.04s}
.reveal-stagger.is-visible > *:nth-child(2){transition-delay:.09s}
.reveal-stagger.is-visible > *:nth-child(3){transition-delay:.14s}
.reveal-stagger.is-visible > *:nth-child(4){transition-delay:.19s}
.reveal-stagger.is-visible > *:nth-child(5){transition-delay:.24s}
.reveal-stagger.is-visible > *:nth-child(6){transition-delay:.29s}

.feature-panel{
    border-radius:var(--radius-large);
    padding:clamp(30px,5vw,70px);
    overflow:hidden;
}

.feature-panel.blue{
    background:var(--blue-dark);
    color:#fff;
}

.feature-panel.light{
    background:#fff;
}

.arrow-link::after{
    content:"→";
    display:inline-block;
    margin-left:9px;
    transition:transform .25s ease;
}

.arrow-link:hover::after{
    transform:translateX(6px);
}

@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}

    *,
    *::before,
    *::after{
        transition:none !important;
        animation:none !important;
    }

    .reveal,
    .reveal-stagger > *{
        opacity:1 !important;
        transform:none !important;
    }
}
