
:root {
    --ink: #172033;
    --blue: #315ee8;
    --cyan: #6ee7f9
}

body {
    color: var(--ink)
}

.brand {
    font-weight: 800;
    letter-spacing: .03em
}

.mark {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    margin-right: .55rem;
    border-radius: .65rem;
    color: white;
    background: linear-gradient(135deg,var(--blue),#172f83);
    font-size: .85rem
}

.hero {
    color: white;
    background: radial-gradient(circle at 85% 20%,rgba(110,231,249,.23),transparent 30%),linear-gradient(130deg,#101a35,#1b3475 60%,#315ee8)
}

.eyebrow {
    color: var(--cyan);
    font-size: .78rem;
    letter-spacing: .16em;
    font-weight: 800;
    text-transform: uppercase
}

.hero h1 {
    max-width: 850px;
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1.06
}

.hero .lead {
    max-width: 740px;
    color: #e0e8ff
}

.btn-ordo {
    background: var(--cyan);
    border-color: var(--cyan);
    color: #172033;
    font-weight: 750
}

.btn-ordo:hover {
    background: #a4f2fc;
    border-color: #a4f2fc;
    color: #172033
}

.kicker {
    color: var(--blue);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase
}

.feature {
    height: 100%;
    border: 1px solid #e4e9f2;
    border-radius: 1rem;
    box-shadow: 0 8px 24px #182a500a
}

.num {
    display: grid;
    place-items: center;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: .8rem;
    background: #edf2ff;
    color: var(--blue);
    font-weight: 800
}

.model {
    background: #f5f7fb;
    border: 1px solid #e5eaf4;
    border-radius: 1.2rem
}

.step {
    background: white;
    border: 1px solid #dce4f2;
    border-radius: .8rem;
    padding: 1rem .5rem;
    text-align: center;
    font-weight: 750
}

.step small {
    display: block;
    color: #596579;
    font-weight: 400
}

.cta {
    background: #f5f7fb;
    border: 1px solid #e3e9f5;
    border-radius: 1.25rem
}

footer {
    border-top: 1px solid #edf0f5;
    color: #596579
}

a:focus-visible {
    outline: 3px solid #f7c948;
    outline-offset: 3px
}
