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

body {
    margin:0;
    min-height:100vh;
    background:#fff;
    color:#1d2c42;
    font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif
}

button,input,select {
    font:inherit
}

button {
    cursor:pointer
}

a {
    color:inherit
}

.wrap {
    width:min(1220px,calc(100% - 48px));
    margin:auto
}

.intro {
    padding:48px 0 34px
}

.kicker {
    font-size:11px;
    letter-spacing:.12em;
    font-weight:750;
    color:#2a629e
}

.title-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px 24px;
    margin:9px 0 11px
}

.intro h1 {
    color:#142541;
    font-size:clamp(28px,3vw,39px);
    letter-spacing:-.025em;
    line-height:1.12;
    margin:0
}

.si-drivers .return-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:8px 17px;
    border:1px solid #b8cbe1;
    border-radius:4px;
    color:#174b82;
    background:#fff;
    font-size:13px;
    font-weight:700;
    text-decoration:none;
    white-space:nowrap
}

.si-drivers .return-link:hover {
    background:#f1f6fc;
    border-color:#2a629e
}

.si-drivers .return-link:focus-visible {
    outline:3px solid #2a629e;
    outline-offset:3px
}

.intro p {
    margin:0;
    color:#56677e;
    font-size:16px
}

.filters {
    display:grid;
    grid-template-columns:minmax(220px,1fr) 240px;
    gap:14px;
    background:#fff;
    border:1px solid #dce3ed;
    padding:17px;
    border-radius:6px;
    margin-bottom:24px
}

.filters label {
    display:flex;
    flex-direction:column;
    gap:6px;
    color:#4a5e79;
    font-size:12px;
    font-weight:700
}

.filters input,.filters select {
    min-height:43px;
    width:100%;
    border:1px solid #cbd5e1;
    border-radius:4px;
    padding:9px 12px;
    color:#1d2c42;
    background:#fff;
    outline:0;
    font-weight:400
}

.filters input:focus,.filters select:focus {
    border-color:#2b64ad;
    box-shadow:0 0 0 3px rgba(43,100,173,.12)
}

.layout {
    display:grid;
    grid-template-columns:224px minmax(0,1fr);
    align-items:start;
    gap:27px;
    padding-bottom:65px
}

.sidebar {
    background:#fff;
    border:1px solid #dce3ed;
    border-radius:6px;
    padding:14px 0
}

.sidebar-title {
    display:block;
    color:#7890ac;
    font-size:10px;
    font-weight:800;
    letter-spacing:.09em;
    padding:3px 18px 13px
}

.sidebar button {
    display:flex;
    justify-content:space-between;
    width:100%;
    align-items:center;
    border:0;
    border-left:3px solid transparent;
    background:transparent;
    padding:10px 16px 10px 15px;
    text-align:left;
    color:#425673;
    font-weight:600
}

.sidebar button:hover {
    background:#f6f9fc
}

.sidebar button.active {
    background:#edf3fb;
    color:#17467a;
    border-left-color:#2866b2
}

.sidebar button span {
    font-size:11px;
    color:#8090a5
}

.content {
    min-width:0
}

.content-head {
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:15px;
    border-bottom:1px solid #d8e0ea;
    padding:1px 0 14px;
    margin-bottom:17px
}

.content-head h2 {
    font-size:22px;
    margin:4px 0 0;
    color:#172d4c
}

.content-head>span {
    font-size:12px;
    color:#667991;
    white-space:nowrap
}

.modelbar {
    display:flex;
    gap:7px;
    overflow-x:auto;
    margin-bottom:21px
}

.modelbar:empty {
    display:none
}

.modelbar button {
    border:1px solid #cad5e2;
    border-radius:4px;
    background:#fff;
    padding:6px 11px;
    color:#436182;
    white-space:nowrap;
    font-size:12px;
    font-weight:650
}

.modelbar button.active {
    color:#fff;
    border-color:#245991;
    background:#245991
}

.brand-section {
    margin-bottom:35px
}

.brand-section h3 {
    margin:0 0 14px;
    color:#173357;
    font-size:18px
}

.model-section {
    margin-bottom:28px
}

.model-head {
    display:flex;
    gap:10px;
    align-items:baseline;
    margin-bottom:12px
}

.model-head h4 {
    margin:0;
    color:#2d425f;
    font-size:15px
}

.model-head span {
    color:#7c8da2;
    font-size:11px
}

.driver-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px
}

.driver-card {
    display:flex;
    flex-direction:column;
    min-height:185px;
    border:1px solid #dce3ed;
    border-radius:6px;
    background:#fff;
    padding:18px
}

.tag {
    align-self:flex-start;
    color:#245e9b;
    background:#e9f1fa;
    padding:3px 6px;
    border-radius:3px;
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em
}

.driver-card h5 {
    margin:11px 0 5px;
    color:#1f3654;
    font-size:16px;
    line-height:1.3
}

.driver-card p {
    color:#66768d;
    font-size:12px;
    margin:0 0 12px
}

.card-foot {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:8px;
    align-items:center;
    border-top:1px solid #e7ebf0;
    margin-top:auto;
    padding-top:12px
}

.card-foot>span {
    color:#718198;
    font-size:11px;
    overflow-wrap:anywhere
}

.card-foot a {
    color:#215b99;
    text-decoration:none;
    font-size:12px;
    font-weight:750
}

.card-foot a:hover {
    text-decoration:underline
}

.empty {
    border:1px solid #dce3ed;
    border-radius:5px;
    padding:30px;
    background:#fff;
    color:#5e7088;
    margin-bottom:55px
}

[hidden] {
    display:none!important
}

footer {
    border-top:1px solid #dce3ed;
    background:#fff;
    color:#8492a5;
    font-size:12px;
    padding:18px 0
}

@media(max-width:900px) {
    .layout {
        grid-template-columns:190px minmax(0,1fr);
        gap:18px
    }
}

@media(max-width:700px) {
    .wrap {
        width:min(100% - 28px,1220px)
    }
    .intro {
        padding:34px 0 25px
    }
    .intro p {
        font-size:14px
    }
    .filters {
        grid-template-columns:1fr;
        padding:13px
    }
    .layout {
        display:block
    }
    .sidebar {
        display:flex;
        overflow-x:auto;
        margin-bottom:22px;
        padding:10px 0
    }
    .sidebar-title {
        display:none
    }
    .sidebar button {
        display:inline-flex;
        width:auto;
        border-left:0;
        border-bottom:2px solid transparent;
        padding:9px 11px;
        white-space:nowrap
    }
    .sidebar button.active {
        border-bottom-color:#2866b2
    }
    .sidebar button span {
        margin-left:8px
    }
    .driver-grid {
        grid-template-columns:1fr
    }
}
