.quote-hero {
    padding:120px 0 65px;
    background:
        radial-gradient(
            circle at 82% 15%,
            rgba(255,105,0,.10),
            transparent 28%
        ),
        #f4f6f8;
}

.quote-hero h1 {
    max-width:920px;
    margin:0;
    font-size:clamp(48px,7vw,82px);
    line-height:.96;
    letter-spacing:-.055em;
}

.quote-hero p {
    max-width:750px;
    color:#637083;
    font-size:19px;
}

.quote-shell {
    padding:65px 0 100px;
}

.quote-layout {
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:45px;
    align-items:start;
}

.quote-progress {
    position:sticky;
    top:110px;
    display:grid;
    gap:8px;
}

.quote-progress-item {
    display:grid;
    grid-template-columns:35px 1fr;
    align-items:center;
    gap:11px;
    padding:11px;
    border-radius:10px;
    color:#778291;
    font-size:12px;
    font-weight:750;
}

.quote-progress-item span {
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border-radius:50%;
    border:1px solid #d9dfe6;
    background:white;
    font-size:10px;
}

.quote-progress-item.active {
    color:#07111f;
    background:#fff4ec;
}

.quote-progress-item.active span {
    border-color:#ff6900;
    background:#ff6900;
    color:white;
}

.quote-form {
    padding:37px;
    border:1px solid #dde2e8;
    border-radius:20px;
    background:white;
    box-shadow:0 24px 60px rgba(7,17,31,.07);
}

.quote-step {
    display:none;
}

.quote-step.active {
    display:block;
}

.quote-step-header {
    margin-bottom:30px;
}

.quote-step-header span {
    color:#ff6900;
    font-size:10px;
    font-weight:900;
    letter-spacing:.14em;
}

.quote-step-header h2 {
    margin:8px 0;
    font-size:37px;
    line-height:1.05;
    letter-spacing:-.04em;
}

.quote-step-header p {
    color:#697587;
}

.quote-options {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.quote-option {
    position:relative;
}

.quote-option input {
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.quote-option span {
    min-height:78px;
    display:flex;
    align-items:center;
    padding:18px;
    border:1px solid #dce2e8;
    border-radius:12px;
    cursor:pointer;
    font-weight:750;
    transition:.18s;
}

.quote-option input:checked + span {
    border-color:#ff6900;
    background:#fff5ee;
    box-shadow:0 0 0 2px rgba(255,105,0,.08);
}

.quote-field {
    display:grid;
    gap:7px;
    margin-bottom:18px;
    font-size:12px;
    font-weight:800;
}

.quote-field input,
.quote-field textarea,
.quote-field select {
    width:100%;
    padding:13px 14px;
    border:1px solid #ccd4dd;
    border-radius:9px;
    background:white;
    outline:0;
}

.quote-field input:focus,
.quote-field textarea:focus,
.quote-field select:focus {
    border-color:#ff6900;
}

.quote-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
}

.quote-actions {
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-top:30px;
}

.quote-next,
.quote-submit,
.quote-back {
    min-height:47px;
    padding:0 20px;
    border-radius:9px;
    font-weight:850;
    cursor:pointer;
}

.quote-next,
.quote-submit {
    margin-left:auto;
    border:1px solid #ff6900;
    background:#ff6900;
    color:white;
}

.quote-back {
    border:1px solid #ccd4dd;
    background:white;
    color:#07111f;
}

.quote-files {
    padding:18px;
    border:2px dashed #d5dce4;
    border-radius:12px;
    background:#fafbfc;
}

.quote-files small {
    display:block;
    margin-top:8px;
    color:#798492;
}

.quote-honeypot {
    position:absolute !important;
    left:-9999px !important;
}

.quote-status {
    margin-top:17px;
    min-height:25px;
    font-size:13px;
}

.quote-success {
    display:none;
    padding:45px 30px;
    text-align:center;
}

.quote-success.show {
    display:block;
}

.quote-success strong {
    display:block;
    margin:15px 0;
    color:#ff6900;
    font-size:24px;
}

.quote-form.complete .quote-step,
.quote-form.complete .quote-actions-global {
    display:none;
}

@media(max-width:850px) {

    .quote-layout {
        grid-template-columns:1fr;
    }

    .quote-progress {
        position:static;
        grid-template-columns:repeat(5,1fr);
        overflow:auto;
    }

    .quote-progress-item {
        display:flex;
        justify-content:center;
        padding:4px;
    }

    .quote-progress-item b {
        display:none;
    }
}

@media(max-width:580px) {

    .quote-hero {
        padding:92px 0 55px;
    }

    .quote-hero h1 {
        font-size:46px;
    }

    .quote-shell {
        padding:35px 0 70px;
    }

    .quote-form {
        padding:24px 17px;
        border-radius:14px;
    }

    .quote-options,
    .quote-row {
        grid-template-columns:1fr;
    }

    .quote-step-header h2 {
        font-size:31px;
    }

    .quote-actions {
        position:sticky;
        bottom:8px;
        padding:10px;
        border-radius:11px;
        background:rgba(255,255,255,.96);
        backdrop-filter:blur(12px);
        box-shadow:0 15px 35px rgba(7,17,31,.10);
    }
}