/**
 * ATB Block: About Team
 * Location: assets/css/blocks/about-team.css
 *
 * Назначение:
 * - стили только для блока .atb-about-team;
 * - компактный блок команды по ревизии About;
 * - без page-id/body костылей, без глобальных селекторов, без !important.
 */

.atb-about-team {
        padding: 34px 0 54px;
        background: #f6f7f9;
}

.atb-about-team__container {
        width: min(calc(100% - 40px), 1320px);
        max-width: 1320px;
        margin-right: auto;
        margin-left: auto;
}

.atb-about-team__head {
        margin: 0 0 14px;
}

.atb-about-team__title {
        margin: 0;
        color: #111827;
        font-size: clamp(22px, 2vw, 32px);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.035em;
}

.atb-about-team__grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 22px;
}

.atb-about-team__card {
        display: grid;
        grid-template-columns: 136px minmax(0, 1fr);
        gap: 22px;
        align-items: center;
        min-height: 144px;
        padding: 10px;
        background: #ffffff;
        border: 1px solid rgba(15, 23, 42, 0.10);
        border-radius: 4px;
        box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
}

.atb-about-team__media {
        overflow: hidden;
        width: 136px;
        height: 136px;
        margin: 0;
        background: #eef2f7;
        border-radius: 4px;
}

.atb-about-team__image {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
}

.atb-about-team__body {
        min-width: 0;
        padding: 4px 8px 4px 0;
}

.atb-about-team__name {
        margin: 0 0 5px;
        color: #111827;
        font-size: 16px;
        font-weight: 800;
        line-height: 1.2;
}

.atb-about-team__role {
        margin: 0 0 16px;
        color: #4b5563;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.35;
}

.atb-about-team__description {
        margin: 0 0 18px;
        max-width: 230px;
        color: #374151;
        font-size: 13px;
        font-weight: 500;
        line-height: 1.45;
}

.atb-about-team__contacts {
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        align-items: center;
}

.atb-about-team__contact,
.atb-about-team__contact:visited {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 20px;
        height: 20px;
        color: #111827;
        font-size: 17px;
        line-height: 1;
        text-decoration: none;
        opacity: 0.78;
        transition: opacity 0.2s ease, transform 0.2s ease;
}

.atb-about-team__contact:hover,
.atb-about-team__contact:focus {
        opacity: 1;
        transform: translateY(-1px);
}

@media (max-width: 1180px) {
        .atb-about-team__grid {
                grid-template-columns: 1fr;
        }

        .atb-about-team__description {
                max-width: none;
        }
}

@media (max-width: 640px) {
        .atb-about-team {
                padding: 28px 0 44px;
        }

        .atb-about-team__container {
                width: min(calc(100% - 32px), 100%);
        }

        .atb-about-team__card {
                grid-template-columns: 92px minmax(0, 1fr);
                gap: 14px;
                min-height: 112px;
                padding: 9px;
        }

        .atb-about-team__media {
                width: 92px;
                height: 92px;
        }

        .atb-about-team__body {
                padding-right: 2px;
        }

        .atb-about-team__name {
                font-size: 15px;
        }

        .atb-about-team__role {
                margin-bottom: 8px;
                font-size: 11px;
        }

        .atb-about-team__description {
                margin-bottom: 10px;
                font-size: 12px;
                line-height: 1.4;
        }

        .atb-about-team__contacts {
                gap: 10px;
        }
}

/* === ATB About Team inline SVG contacts: start === */
/**
 * Назначение:
 * - заменяет цветные текстовые символы контактов на единые SVG-иконки;
 * - не меняет ACF, сетку и порядок блоков;
 * - без page-id/body костылей и без !important.
 */

.atb-about-team__contact,
.atb-about-team__contact:visited {
        width: 22px;
        height: 22px;
        color: #111827;
        font-size: 0;
        opacity: 0.82;
}

.atb-about-team__contact svg {
        display: block;
        width: 18px;
        height: 18px;
        stroke: currentColor;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
        fill: none;
}

.atb-about-team__contact--phone,
.atb-about-team__contact--email,
.atb-about-team__contact--whatsapp {
        color: #111827;
}

.atb-about-team__contact:hover,
.atb-about-team__contact:focus {
        color: #0b63ce;
        opacity: 1;
}
/* === ATB About Team inline SVG contacts: end === */
