/* сетка услуг категории. Перенесено из инлайна шаблона buhgalter.ftp.md. */

.services-premium-grid {
        padding: 80px 0;
        background: linear-gradient(135deg, var(--smoke-color) 0%, #ffffff 100%);
    }


    .service-card-premium {
        background:
            linear-gradient(160deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 255, 0.98));
        border-radius: 20px;
        padding: 34px 28px;
        height: 100%;
        transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
        border: 1px solid rgba(12, 40, 88, 0.1);
        box-shadow: 0 10px 30px rgba(12, 40, 88, 0.08);
        position: relative;
        overflow: hidden;
    }

    .service-card-premium::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, var(--theme-color) 0%, #39a6d5 100%);
        transform: scaleX(1);
        opacity: .55;
        transition: opacity .28s ease;
    }

    .service-card-premium:hover {
        transform: translateY(-6px);
        box-shadow: 0 18px 38px rgba(12, 40, 88, 0.13);
        border-color: rgba(0, 82, 166, 0.22);
    }

    .service-card-premium:hover::before {
        opacity: 1;
    }

    .service-icon-premium {
        width: 74px;
        height: 74px;
        background: linear-gradient(145deg, #f7fbff 0%, #eef5ff 100%);
        border-radius: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
        transition: all 0.3s ease;
        border: 1px solid rgba(0, 82, 166, 0.12);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
    }

    .service-card-premium:hover .service-icon-premium {
        border-color: rgba(0, 82, 166, 0.28);
        transform: translateY(-2px);
    }

    .service-icon-premium img {
        width: 42px;
        height: 42px;
        object-fit: contain;
        filter: invert(24%) sepia(96%) saturate(2421%) hue-rotate(196deg) brightness(94%) contrast(101%);
        /* filter: brightness(0) saturate(100%) invert(26%) sepia(42%) saturate(1165%) hue-rotate(138deg) brightness(95%) contrast(93%); */
        transition: filter 0.3s ease, transform .28s ease;
    }

    .service-card-premium:hover .service-icon-premium img {
        filter: invert(24%) sepia(96%) saturate(2421%) hue-rotate(196deg) brightness(94%) contrast(101%);
        transform: scale(1.05);
    }

    .service-content-premium {
        display: flex;
        flex-direction: column;
        flex: 1;
    }

    .service-content-premium h4 {
        color: var(--title-color);
        font-size: 21px;
        line-height: 1.3;
        margin-bottom: 10px;
        transition: color 0.28s ease;
    }

    .service-content-premium h4 a {
        color: inherit;
    }

    .service-content-premium p {
        color: rgba(12, 40, 88, 0.75);
        font-size: 15px;
        line-height: 1.72;
        flex: 1;
        margin-bottom: 18px;
    }

    .service-link-premium {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--theme-color);
        font-weight: 700;
        font-size: 15px;
        text-decoration: none;
        transition: all 0.3s ease;
        padding: 8px 0;
    }

    .service-link-premium i {
        transition: transform 0.3s ease;
        font-size: 18px;
    }

    .service-link-premium:hover {
        gap: 12px;
    }

    .service-link-premium:hover i {
        transform: translateX(4px);
    }

    .services-pagination-premium {
        margin-top: 60px;
        display: flex;
        justify-content: center;
    }

    .services-pagination-premium .pagination {
        gap: 8px;
    }

    .services-pagination-premium .page-item .page-link {
        border: 2px solid var(--smoke-color);
        background: #ffffff;
        color: var(--theme-color);
        border-radius: 12px;
        padding: 10px 18px;
        font-weight: 600;
        transition: all 0.3s ease;
        margin: 0;
    }

    .services-pagination-premium .page-item .page-link:hover {
        /* background: #ebf3ee; */
        /* border-color: #c4f500; */
        /* color: #196164; */
        transform: translateY(-2px);
    }

    .services-pagination-premium .page-item.active .page-link {
        background: linear-gradient(135deg, var(--theme-color) 0%, #006bc9 100%);
        border-color: var(--theme-color);
        color: var(--theme-color2);
        box-shadow: 0 4px 12px rgba(0, 82, 166, 0.3);
    }

    @media (max-width: 768px) {
        .services-premium-grid {
            padding: 60px 0;
        }

        .service-card-premium {
            padding: 28px 22px;
        }
    }