.services {
    background: transparent;
}

.services-layout {
    display: grid;
    grid-template-columns: repeat(3, 420px);
    gap: 29px;
    margin-top: 40px;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.services-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    min-width: 0;
}

.services-heading {
    padding-top: 0;
    text-align: center;
}

.services-heading .section-title {
    margin: 0;
}

.service-card {
    background: rgba(46, 46, 46, 1);
    border-radius: var(--radius-lg);
    padding: 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    transition: transform 0.25s, box-shadow 0.25s;
}

.service-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.service-card--t1 {
    height: 405px;
    min-height: 405px;
}
.services-col--left .service-card {
    margin-top: auto;
}
.service-card--t2 {
    height: 264px;
    min-height: 264px;
}

.service-card--orange {
    background: var(--orange);
}

.service-card-tag {
    font-size: 12px;
    font-weight: 500;
    /*letter-spacing: 0.08em;*/
    color: #FFFFFF;
    /*margin-bottom: 12px;*/
    text-align: right;
}

.service-card--orange .service-card-tag {
    color: rgba(255, 255, 255, 0.6);
}

.service-card-title {
    font-size: 32px;
    font-weight: 500;
    color: var(--text-light);
    line-height: 1.25;
    margin-bottom: 10px;
}

.service-card--t2 .service-card-title {
    margin-bottom: 8px;
}

.service-card-desc {
    font-size: 18px;
    color: white;
    line-height: 1.6;
    margin-bottom: 0;
    font-weight: 400;
}

.service-card--t2 .service-card-desc {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.service-card--orange .service-card-desc {
    color: rgba(255, 255, 255, 0.75);
}

.service-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    margin-top: 16px;
}

.service-card-img {
    position: absolute;
    top: 0;
    right: 0;
    width: 45%;
    height: 100%;
    object-fit: cover;
    opacity: 0.15;
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}

.service-card-photo {
    position: absolute;
    top: 0;
    right: 0;
    width: 45%;
    height: 100%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.08));
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}
.text-orange {
    color: var(--orange);
}
.text-black {
    color: var(--black);
}

/* Мобильная версия: чередование серой / оранжевой карточки (nth-child) */
@media (max-width: 900px) {
    .services-layout {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .services-col {
        display: contents;
    }

    .services-heading {
        width: 100%;
    }

    /* Сброс десктопного оранжевого класса */
    .services-layout .service-card.service-card--orange {
        background: rgba(46, 46, 46, 1);
    }

    /* 2, 4, 6-й ребёнок layout — серые карточки (1-я, 3-я, 5-я) */
    .services-layout .service-card:nth-child(2n) {
        background: rgba(46, 46, 46, 1);
    }

    .services-layout .service-card:nth-child(2n) .service-card-tag {
        color: #fff;
    }

    .services-layout .service-card:nth-child(2n) .service-card-desc {
        color: #fff;
    }

    .services-layout .service-card:nth-child(2n) .text-orange,
    .services-layout .service-card:nth-child(2n) .text-black {
        color: var(--orange);
    }

    .services-layout .service-card:nth-child(2n) .btn-more {
        background: rgba(244, 122, 31, 0.3);
    }

    .services-layout .service-card:nth-child(2n) .btn-more:hover {
        background: rgba(244, 122, 31, 0.45);
    }

    .services-layout .service-card:nth-child(2n) .btn-more-icon {
        background: var(--orange);
    }

    .services-layout .service-card:nth-child(2n) .arrow-icon--orange::before {
        background-color: var(--orange);
    }

    /* 3, 5-й ребёнок — оранжевые (2-я, 4-я карточки) */
    .services-layout .service-card:nth-child(2n + 1) {
        background: var(--orange);
    }

    .services-layout .service-card:nth-child(2n + 1) .service-card-tag {
        color: rgba(255, 255, 255, 0.6);
    }

    .services-layout .service-card:nth-child(2n + 1) .service-card-desc {
        color: rgba(255, 255, 255, 0.75);
    }

    .services-layout .service-card:nth-child(2n + 1) .text-orange,
    .services-layout .service-card:nth-child(2n + 1) .text-black {
        color: var(--black);
    }

    .services-layout .service-card:nth-child(2n + 1) .btn-more {
        background: rgba(0, 0, 0, 0.3);
    }

    .services-layout .service-card:nth-child(2n + 1) .btn-more:hover {
        background: rgba(0, 0, 0, 0.45);
    }

    .services-layout .service-card:nth-child(2n + 1) .btn-more-icon,
    .services-layout .service-card:nth-child(2n + 1) .arrow-icon--orange::before,
    .services-layout .service-card:nth-child(2n + 1) .arrow-icon--black::before {
        background-color: rgba(46, 46, 46, 1);
    }
}