/* <editor-fold desc="Shared section spacing"> */
.acquiring > div:not(.hero-v4) {
    padding-top: 40px;
    padding-bottom: 40px;
}
.acquiring .title.centered,
.acquiring .subtitle.centered { text-align: center; margin-left: auto; margin-right: auto; }
.acquiring .hero-v4 { padding-top: 24px; }
@media (max-width: 576px) {
    .acquiring > div:not(.hero-v4) {
        padding-top: 24px;
        padding-bottom: 24px;
    }
}
/* </editor-fold> */

/* <editor-fold desc="Онлайн-оплата без зайвих кроків (block2) — feature-card-block, 3-col grid, reused from Тарифи's convention"> */
.acquiring .steps-included-block .feature-card-block .subtitle { padding-top: 16px; }
.acquiring .steps-included-block .feature-card-block .subtitle p { margin: 0 0 8px; }
.acquiring .steps-included-block .feature-card-block .subtitle p:last-child { margin-bottom: 0; }
.acquiring .steps-included-block .feature-card-block .feature-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    max-width: none;
    gap: 16px;
    padding-top: 40px;
}
.acquiring .steps-included-block .feature-card-block .feature-card {
    width: auto;
    padding: 24px;
    background: #f6f8fa;
    border-radius: 16px;
    text-align: left;
}
.acquiring .steps-included-block .feature-card-block .feature-card .icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #ebedf2;
    border-radius: 16px;
    overflow: hidden;
}
.acquiring .steps-included-block .feature-card-block .feature-card .icon-wrapper img { width: 32px; height: 32px; transform: none; }
.acquiring .steps-included-block .feature-card-block .feature-card .name { padding-top: 16px; text-align: left; }
.acquiring .steps-included-block .feature-card-block .feature-card .desc { padding-top: 8px; text-align: left; }

@media (max-width: 1180px) {
    .acquiring .steps-included-block .feature-card-block .feature-card-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 992px) {
    .acquiring .steps-included-block .feature-card-block .feature-card-grid { padding-top: 24px; }
    .acquiring .steps-included-block .feature-card-block .feature-card-grid.slick-slider {
        display: block;
        grid-template-columns: none;
    }
    .acquiring .steps-included-block .feature-card-block .feature-card-grid.slick-slider .slick-track { display: flex; }
    .acquiring .steps-included-block .feature-card-block .feature-card-grid.slick-slider .feature-card { width: 320px; height: auto; margin: 0 4px; }
    .acquiring .steps-included-block .feature-card-block .slick-dots {
        display: flex;
        justify-content: center;
        gap: 12px;
        margin-top: 24px;
        padding: 8px;
        list-style: none;
    }
    .acquiring .steps-included-block .feature-card-block .slick-dots li { cursor: pointer; }
    .acquiring .steps-included-block .feature-card-block .slick-dots li button {
        display: block;
        width: 12px;
        height: 12px;
        padding: 0;
        background: #d1d5dc;
        border-radius: 10px;
        font-size: 0;
        line-height: 0;
        transition: background-color .3s;
        cursor: pointer;
        border: none;
    }
    .acquiring .steps-included-block .feature-card-block .slick-dots li.slick-active button { background: #06ba52; }
}
/* </editor-fold> */

/* <editor-fold desc="Переваги для бізнесу (block3) — audience-block > feature-card-block, 4-col grid, image-heavy cards, reused from Головна v4"> */
.acquiring .audience-block .feature-card-block .feature-card-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: none;
    gap: 16px;
    padding-top: 40px;
}
.acquiring .audience-block .feature-card-block .feature-card {
    width: auto;
    padding: 24px;
    background: #f6f8fa;
    border-radius: 16px;
    text-align: left;
}
.acquiring .audience-block .feature-card-block .feature-card .icon-wrapper {
    width: 100%;
    height: auto;
    background: #ebedf2;
    border-radius: 16px;
    margin-bottom: 16px;
    overflow: hidden;
}
.acquiring .audience-block .feature-card-block .feature-card .icon-wrapper img { width: 100%; height: 100%; object-fit: contain; }
.acquiring .audience-block .feature-card-block .feature-card .name { padding-top: 0; text-align: left; }
.acquiring .audience-block .feature-card-block .feature-card .desc { padding-top: 8px; text-align: left; }

@media (max-width: 1300px) {
    .acquiring .audience-block .feature-card-block .feature-card-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 992px) {
    .acquiring .audience-block .feature-card-block .feature-card-grid { grid-template-columns: 1fr; padding-top: 24px; }
    .acquiring .audience-block .feature-card-block .feature-card-grid.slick-slider {
        display: block;
        grid-template-columns: none;
    }
    .acquiring .audience-block .feature-card-block .feature-card-grid.slick-slider .slick-track { display: flex; }
    .acquiring .audience-block .feature-card-block .feature-card-grid.slick-slider .feature-card { width: 320px; height: auto; margin: 0 4px; }
    .acquiring .audience-block .feature-card-block .slick-dots {
        display: flex;
        justify-content: center;
        gap: 12px;
        margin-top: 16px;
        padding: 8px;
        list-style: none;
    }
    .acquiring .audience-block .feature-card-block .slick-dots li { cursor: pointer; }
    .acquiring .audience-block .feature-card-block .slick-dots li button {
        display: block;
        width: 12px;
        height: 12px;
        padding: 0;
        background: #d1d5dc;
        border-radius: 10px;
        font-size: 0;
        line-height: 0;
        transition: background-color .3s;
        cursor: pointer;
        border: none;
    }
    .acquiring .audience-block .feature-card-block .slick-dots li.slick-active button { background: #06ba52; }
}
/* </editor-fold> */

/* <editor-fold desc="Рішення для різного масштабу бізнесу (block4) — get-guide-block, reused from PRRO v2's shape"> */
.acquiring .get-guide-block .block-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 320px;
    padding: 40px;
    overflow: hidden;
    border-radius: 24px;
    background: linear-gradient(-5.43deg, #EFFEEE 31.319%, #FCFFFC 70.948%);
}
.acquiring .get-guide-block .get-guide-container {
    position: relative;
    z-index: 1;
    max-width: 768px;
}
.acquiring .get-guide-block .desc {
    padding-top: 16px;
    color: #221f1f;
}
.acquiring .get-guide-block .btn-wrapper { padding-top: 32px; }
.acquiring .get-guide-block .img-container {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 412px;
}
.acquiring .get-guide-block .img-wrapper,
.acquiring .get-guide-block .img-wrapper img {
    width: 100%;
    height: 100%;
}
.acquiring .get-guide-block .img-wrapper img { object-fit: contain; }

@media (max-width: 1300px) {
    .acquiring .get-guide-block .get-guide-container { max-width: 480px; }
    .acquiring .get-guide-block .img-container { width: 320px; }
}
@media (max-width: 992px) {
    .acquiring .get-guide-block .get-guide-container { max-width: 340px; padding: 32px 24px; }
}
@media (max-width: 768px) {
    .acquiring .get-guide-block .block-wrapper { min-height: 0; flex-direction: column; padding: 0 16px; }
    .acquiring .get-guide-block .get-guide-container { max-width: 100%; text-align: center; padding: 0 }
    .acquiring .get-guide-block .img-container { position: relative; margin-top: 32px; }
}
/* </editor-fold> */

/* <editor-fold desc="Для кого підходить інтернет-еквайринг (block5) — who-for-block, 3+2 card grid + mobile slider, reused from Інвойсинг v4"> */
.acquiring .who-for-block .title { margin: 0; }

.acquiring .who-for-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding-top: 40px;
}
.acquiring .who-for-container .payment-method-card {
    display: flex;
    flex-direction: column;
    padding: 24px;
    background: #f6f8fa;
    border-radius: 16px;
}
.acquiring .who-for-container .img-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 220px;
    margin-bottom: 16px;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
}
.acquiring .who-for-container .img-wrapper img { max-width: 100%; max-height: 100%; object-fit: contain; }
.acquiring .who-for-container .name { margin: 0; }
.acquiring .who-for-container .desc { margin: 0; padding-top: 8px; color: #221f1f; }

@media (max-width: 992px) {
    .acquiring .who-for-container { grid-template-columns: repeat(2, 1fr); padding-top: 24px; }
    .acquiring .who-for-container .payment-method-card { grid-column: span 1; }
    .acquiring .who-for-container.slick-slider {
        display: block;
        grid-template-columns: none;
    }
    .acquiring .who-for-container.slick-slider .slick-track { display: flex; }
    .acquiring .who-for-container.slick-slider .payment-method-card { height: auto; margin: 0 4px; }

    .acquiring .who-for-block .slick-dots {
        display: flex;
        justify-content: center;
        gap: 12px;
        margin-top: 16px;
        padding: 8px;
        list-style: none;
    }
    .acquiring .who-for-block .slick-dots li { cursor: pointer; }
    .acquiring .who-for-block .slick-dots li button {
        display: block;
        width: 12px;
        height: 12px;
        padding: 0;
        background: #d1d5dc;
        border-radius: 10px;
        font-size: 0;
        line-height: 0;
        transition: background-color .3s;
        cursor: pointer;
        border: none;
    }
    .acquiring .who-for-block .slick-dots li.slick-active button { background: #06ba52; }
}
@media (max-width: 576px) {
    .acquiring .who-for-container .payment-method-card { padding: 16px; }
}
/* </editor-fold> */

/* <editor-fold desc="Готові інтеграції для популярних платформ (block6) — integrations-block, verbatim from Головна v4"> */
.acquiring .integrations-block .subtitle { max-width: 1068px; padding-top: 16px; color: #221f1f; }
.acquiring .integrations-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding-top: 40px;
}
.acquiring .integration-logo,
.acquiring .integration-more {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 108px;
    background: #f6f8fa;
    border-radius: 16px;
    padding: 24px 16px;
}
.acquiring .integration-logo img { width: auto; height: auto; max-width: 100%; }
.acquiring .integration-more {
    color: #221f1f;
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;
    text-decoration: none;
}
.acquiring .integration-more:hover { text-decoration: underline; }

@media (max-width: 992px) {
    .acquiring .integrations-block .subtitle,
    .acquiring .integrations-container { padding-top: 24px; }
}
@media (max-width: 768px) {
    .acquiring .integrations-block .subtitle { padding-top: 8px; }
    .acquiring .integrations-container { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .acquiring .integration-logo,
    .acquiring .integration-more { height: 78px; }
}
/* </editor-fold> */

/* <editor-fold desc="Як підключити інтернет-еквайринг (block7) — how-it-works-block, no media, CTA below steps, reused from Ecommerce's shape"> */
.acquiring .how-it-works-block .hiw-grid {
    display: flex;
    flex-direction: column;
    gap: 32px;
    margin-top: 0;
}
.acquiring .how-it-works-block .hiw-title .title { margin: 0; }
.acquiring .how-it-works-block .hiw-cta.btn {
    align-self: flex-start;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: 52px;
    padding: 8px 24px;
    font-size: 18px;
    line-height: 28px;
    white-space: nowrap;
}
.acquiring .hiw-steps { display: flex; align-items: flex-start; gap: 40px; }
.acquiring .step { position: relative; flex: 1; text-align: left; min-height: 100px; }
.acquiring .step:after {
    content: "";
    position: absolute;
    top: 40px;
    left: 104px;
    width: calc(100% - 104px);
    height: 1px;
    background: #cad3da;
}
.acquiring .step-number {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    margin-bottom: 24px;
    background: #ebedf2;
    border-radius: 50%;
    font-weight: 900;
    font-size: 24px;
    line-height: 30px;
    color: #221f1f;
}
/* Last step is always the "done" state — driven by CSS, not an ACF toggle */
.acquiring .step:last-child .step-number {
    background: #effeee;
    color: transparent;
}
.acquiring .step:last-child .step-number:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    transform: translate(-50%, -50%);
    background: url(../images/ecommerce/check-ring.svg) center center no-repeat;
    background-size: contain;
}
.acquiring .step .name { padding-top: 0; margin: 0; color: #221f1f; }
.acquiring .step .desc { padding-top: 8px; margin: 0; color: #221f1f; }

@media (max-width: 992px) {
    .acquiring .how-it-works-block .hiw-grid { gap: 24px; }
    .acquiring .how-it-works-block .hiw-title { text-align: center; }
    .acquiring .how-it-works-block .hiw-cta.btn { width: 100%; align-self: stretch; }

    .acquiring .hiw-steps { flex-direction: column; gap: 8px; }
    .acquiring .step { padding-left: 76px; width: 100%; min-height: 0; }
    .acquiring .step:after {
        top: 68px;
        left: 30px;
        width: 1px;
        height: calc(100% - 68px);
    }
    .acquiring .step:last-child:after { content: none; }
    .acquiring .step-number { position: absolute; top: 0; left: 0; width: 60px; height: 60px; margin-bottom: 0; font-size: 20px; line-height: 28px; }
    .acquiring .step:last-child .step-number:after { width: 24px; height: 24px; }
    .acquiring .step .name { font-size: 18px; }
}
/* </editor-fold> */

/* <editor-fold desc="Підключіть онлайн-оплату для свого сайту (block10) — cta-banner-block, verbatim from Ecommerce"> */
.acquiring .cta-banner-block .block-wrapper {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 40px 80px 40px 40px;
    background: linear-gradient(-4.32deg, #effeee 31.319%, #fcfffc 70.948%);
    border-radius: 24px;
}
.acquiring .cta-banner-block .icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    font-size: 60px;
    padding: 10px;
}
.acquiring .cta-banner-block .icon-wrapper img { width: 60px; }
.acquiring .cta-banner-block .text { flex: 1 0 0; display: flex; flex-direction: column; gap: 8px; }
.acquiring .cta-banner-block .title { margin: 0; }
.acquiring .cta-banner-block .subtitle { margin: 0; }
.acquiring .cta-banner-block .btn { flex-shrink: 0; width: 245px; }

.acquiring .cta-banner-block .row-wrapper {
    display: flex;
    gap: 32px;
    flex-direction: column;
    flex-grow: 1;
}
@media (max-width: 768px) {
    .acquiring .cta-banner-block .block-wrapper { flex-direction: column; gap: 32px; text-align: center; padding: 24px 16px; }
    .acquiring .cta-banner-block .row-wrapper { align-items: center; }
    .acquiring .cta-banner-block .text { text-align: center; align-items: center; }
    .acquiring .cta-banner-block .btn { width: 100%; }
}
/* </editor-fold> */

/* .need-support-block .block-wrapper/.icon-wrapper/.text is the shared component in style.css — no page CSS needed */
