/* ── Carousel ─────────────────────────────────────────────── */
.baner img { width: 100%; }

/* ── About / Stats ────────────────────────────────────────── */
.about_section {
    background: url(../img/vendor/lines.png);
    background-size: cover;
    padding: 20px 0 45px;
}
.intro-description {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    color: #225994;
    text-align: center;
    margin-bottom: 40px;
}
.description-co > .col-md-3 {
    padding-left: 3%;
    font-size: 20px;
    color: #00406e;
}
.description-co > .col-md-3 > p { text-align: center; }
.co-text { color: #00406e; font-size: 15px; text-align: center; }
.co-text > span { color: #00406e; font-size: 50px; }

/* ── Advantages ───────────────────────────────────────────── */
.advantages {
    height: 301px;
    background: url(../img/vendor/we-advantages.png) no-repeat;
    background-size: cover;
    position: relative;
}
.advantages > .container > p {
    color: white;
    font-size: 22px;
    font-weight: bold;
    padding-top: 110px;
    padding-left: 180px;
    position: absolute;
}
.advantages ul {
    padding-left: 217px;
    padding-top: 160px;
}
.advantages ul li {
    list-style-image: url(../img/vendor/li-bullet.png);
    padding-left: 30px;
    color: white;
    font-size: 18px;
    letter-spacing: 2px;
}

/* ── Parts ────────────────────────────────────────────────── */
.parts {
    background: url(../img/vendor/parts.png) no-repeat;
    background-size: contain;
    background-position: right;
    height: 301px;
    position: relative;
}
.parts > div.text {
    font-size: 24px;
    color: #636363;
    padding-left: 70px;
    padding-top: 20px;
    font-weight: bold;
}

/* ── Become client button ─────────────────────────────────── */
.become-client {
    background: #007ec0;
    height: 73px;
    cursor: pointer;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}
.become-client:hover { background: #0b6aa2; }
.become-client > div {
    text-align: center;
    color: #ffffff;
    font-weight: 700;
    font-size: 24px;
    padding-top: 20px;
    cursor: pointer;
}

/* ── Section title ────────────────────────────────────────── */
.title > p {
    color: #00406e;
    font-size: 21px;
    font-weight: bold;
    text-align: center;
    background: url(../img/vendor/lines.png);
    background-size: cover;
    padding: 30px 0;
    margin: 0;
}

/* ── Order steps ──────────────────────────────────────────── */
.order_section {
    background: url(../img/vendor/lines.png);
    background-size: cover;
    padding: 20px 0 30px;
}
.order_section .title > p { background: none; color: #666666; }
.orders_wrap { max-width: 650px; margin: 0 auto; }
.orders { min-width: 180px; text-align: center; }
.orders .titler { padding-right: 0; }
.arrow, .arrow-2 { padding-top: 80px; float: left; }
.titler {
    font-size: 18px;
    font-weight: 700;
    color: #666666;
    padding-top: 10px;
    padding-right: 5px;
}
.buy-step { padding-top: 50px; }

/* ── Provider row ─────────────────────────────────────────── */
.provider-row { display: flex; align-items: center; }
.provider-row .handshake { overflow: hidden; }
.provider-row .handshake img { width: 100%; min-height: 225px; max-height: 225px; }
.handshake { padding: 0; }
.providers {
    background: url(../img/vendor/providers-background.png);
    position: relative;
    min-height: 225px;
    padding-bottom: 73px;
    display: flex;
    align-items: center;
}
.providers > div.text {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    padding-left: 90px;
}

/* ── Map / Address ────────────────────────────────────────── */
.contact-address-wrapper {
    width: 387px;
    height: 157px;
    position: absolute;
    background-color: white;
    margin-left: 9px;
    z-index: 1;
}
.contact-address { position: relative; }
.contact-address > p { padding-left: 45px; padding-top: 10px; color: #00406e; font-size: 14px; }
.contact-address-close {
    position: absolute;
    width: 17px;
    height: 17px;
    transform: rotate(45deg);
    right: 0;
    top: 0;
    cursor: pointer;
}
.contact-address-close::before { content: '+'; font-size: 50px; color: #dde2e7; top: 0; right: 0; }

/* ── Mobile-only intro ────────────────────────────────────── */
.mobile-providers { padding-top: 20px; text-align: center; }
.mobile-providers p { font-size: 16px; margin: 0; text-align: center; }
.mobile-providers p:nth-child(2) { font-weight: bold; }
.mobile-client-button {
    text-align: center;
    color: white;
    font-weight: bold;
    background: #007ec0;
    padding: 10px 0;
    cursor: pointer;
}
.mobile-handshake img { vertical-align: middle; width: 100%; }
.mobile-invite-providers { background: #00406e; color: white; font-weight: bold; padding: 30px; }

/* ── Responsive overrides ─────────────────────────────────── */
@media (max-width: 767px) {
    .about_section { background: #dee6ec; padding: 10px 0 20px; }
    .description-co > .col-md-3 { font-size: 14px; }
    .co-text > span { font-size: 35px; }

    .advantages {
        height: auto;
        min-height: 200px;
        background-size: cover;
    }
    .advantages > .container > p {
        position: static;
        padding: 20px 15px 5px;
        font-size: 14px;
    }
    .advantages ul { padding: 5px 15px 15px 40px; }
    .advantages ul li { font-size: 14px; letter-spacing: 0; padding-left: 10px; }

    .parts {
        height: auto;
        min-height: 200px;
        background-size: cover;
        background-position: center;
    }
    .parts > div.text { padding-left: 20px; font-size: 18px; padding-bottom: 80px; }

    .become-client > div { font-size: 18px; }

    .orders_wrap { max-width: 100%; }
    .orders { min-width: 100px; }
    .arrow, .arrow-2 { display: none; }

    .provider-row { flex-direction: column; }
    .provider-row .handshake img { min-height: 150px; max-height: 150px; }
    .providers { min-height: 150px; padding-bottom: 73px; }
    .providers > div.text { padding-left: 20px; font-size: 16px; }

    .address-row { display: block; }
}

@media (max-width: 1200px) {
    .advantages > .container > p { padding-left: 20px; padding-top: 30px; }
    .advantages ul { padding-left: 30px; padding-top: 90px; }
    .advantages ul li { margin-bottom: 15px; padding-left: 10px; font-size: 16px; }
    .parts > div.text { padding-left: 30px; font-size: 20px; }
    .providers > div.text { padding-left: 30px; }
    .address-row { display: block; }
}