@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");

/* =========================================================
   RECRUITING PAGE — ОСНОВНІ НАЛАШТУВАННЯ
   ========================================================= */

.recruiting-page {
    --navy-900: #141d38;
    --navy-800: #1c2c5c;
    --navy-700: #28407e;
    --navy-600: #3c5aa8;
    --sky-500: #3aa9de;
    --sky-400: #6cc3ec;
    --sky-200: #bfe9fb;
    --sky-100: #e5f6ff;
    --sky-50: #f4fbff;
    --paper: #ffffff;
    --ink: #182449;
    --muted: #67759a;
    --line: #e3e8f2;
    --shadow-sm: 0 10px 24px -16px rgba(20, 29, 56, 0.28);
    --shadow-md: 0 24px 48px -24px rgba(20, 29, 56, 0.32);

    width: 100%;
    overflow: hidden;
    background: var(--paper);
    color: var(--ink);
    font-family: "Manrope", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

.recruiting-page,
.recruiting-page * {
    box-sizing: border-box;
}

.recruiting-page .wrap {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 28px;
}

.recruiting-page h1,
.recruiting-page h2,
.recruiting-page h3,
.recruiting-page h4 {
    margin: 0;
    color: var(--navy-800);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.recruiting-page p {
    margin: 0;
}

.recruiting-page ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.recruiting-page a {
    color: inherit;
    text-decoration: none;
}

.recruiting-page section {
    padding: 60px 0;
}

.recruiting-page .divider {
    height: 1px;
    margin: 0;
    border: 0;
    background: var(--line);
}

/* =========================================================
   КНОПКИ
   ========================================================= */

.recruiting-page .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 11px 20px;
    border: 1.5px solid transparent;
    border-radius: 999px;
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.recruiting-page .btn:hover {
    transform: translateY(-1px);
}

.recruiting-page .btn-solid {
    border-color: var(--sky-500);
    background: var(--sky-500);
    color: #ffffff;
    box-shadow: var(--shadow-sm);
}

.recruiting-page .btn-solid:hover {
    border-color: var(--navy-700);
    background: var(--navy-700);
    color: #ffffff;
}

.recruiting-page .btn-outline {
    border-color: var(--navy-700);
    background: #ffffff;
    color: var(--navy-800);
}

.recruiting-page .btn-outline:hover {
    background: var(--navy-800);
    color: #ffffff;
}

/* =========================================================
   HERO
   ========================================================= */

.recruiting-page .page-hero {
    padding: 56px 0 48px;
    background: transparent;
}

.recruiting-page .kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--sky-500);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.recruiting-page .page-hero h1 {
    max-width: 900px;
    color: #ffffff;
    font-size: clamp(40px, 4.4vw, 64px);
    line-height: 1.08;
    letter-spacing: -0.035em;
}

.recruiting-page .page-hero .lead {
    max-width: 830px;
    margin-top: 18px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 16px;
    line-height: 1.65;
}

.recruiting-page .category-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: auto;
    max-width: 100%;
    margin-top: 28px;
    padding: 5px;
    border: 1px solid rgba(227, 232, 242, 0.95);
    border-radius: 999px;
    background: #ffffff;
    box-shadow: var(--shadow-sm);
}

.recruiting-page .category-toggle .cat {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 22px;
    border-radius: 999px;
    color: var(--navy-800);
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}

.recruiting-page .category-toggle .cat.active {
    background: var(--navy-800);
    color: #ffffff;
}

.recruiting-page .category-toggle .cat:not(.active):hover {
    background: var(--sky-50);
}

/* =========================================================
   ЗАГОЛОВОК СЕКЦІЇ
   ========================================================= */

.recruiting-page #produkty {
    padding: 64px 0 72px;
    background: #ffffff;
}

.recruiting-page .section-head {
    max-width: 720px;
    margin: 0 auto 32px;
}

.recruiting-page .section-head.center {
    text-align: center;
}

.recruiting-page .section-head .kicker {
    margin-bottom: 8px;
}

.recruiting-page .section-head h2 {
    font-size: clamp(28px, 3.2vw, 36px);
}

.recruiting-page .section-head .desc {
    max-width: 680px;
    margin: 10px auto 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}

/* =========================================================
   НАВІГАЦІЯ ТАРИФАМИ
   ========================================================= */

.recruiting-page .tier-tabs {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 36px;
}

.recruiting-page .tier-tabs a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 9px 20px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #ffffff;
    color: var(--navy-800);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.recruiting-page .tier-tabs a:hover {
    border-color: var(--sky-500);
}

.recruiting-page .tier-tabs a.hot {
    border-color: var(--navy-800);
    background: var(--navy-800);
    color: #ffffff;
}

/* =========================================================
   СІТКА ТАРИФІВ
   ========================================================= */

.recruiting-page .recruit-pricing-grid {
    display: flex;
    align-items: stretch;
    gap: 16px;
    width: 100%;
}

.recruiting-page .recruit-pricing-card {
    position: relative;
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    min-width: 0;
    margin: 0;
    padding: 28px 22px 20px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: var(--shadow-sm);
    scroll-margin-top: 90px;
}

.recruiting-page .recruit-pricing-card--popular {
    border-color: var(--sky-500);
    background: linear-gradient(180deg, #f5fbff 0%, #ffffff 24%);
    box-shadow: var(--shadow-md);
}

/* Популярний тариф */

.recruiting-page .popular-badge {
    position: absolute;
    top: -13px;
    left: 50%;
    z-index: 2;
    padding: 6px 16px;
    border-radius: 999px;
    background: var(--sky-500);
    color: #ffffff;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.02em;
    white-space: nowrap;
    transform: translateX(-50%);
}

/* Верх картки */

.recruiting-page .recruit-card-head {
    display: block;
    margin: 0;
    padding: 0;
}

.recruiting-page .lvl-eyebrow {
    display: block;
    color: #7180a5;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.recruiting-page .recruit-pricing-card h3 {
    margin-top: 8px;
    color: var(--navy-800);
    font-size: 25px;
    line-height: 1.15;
}

.recruiting-page .recruit-pricing-card .role {
    min-height: 36px;
    margin-top: 5px;
    color: var(--sky-500);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}

.recruiting-page .recruit-pricing-card > .desc {
    min-height: 88px;
    margin-top: 10px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.55;
}

/* =========================================================
   ЦІНА
   ========================================================= */

.recruiting-page .price-block {
    margin-top: 14px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.recruiting-page .price-block .big {
    color: var(--navy-800);
    font-size: 30px;
    font-weight: 800;
    line-height: 1.2;
}

.recruiting-page .price-block .big .from {
    margin-right: 3px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 700;
}

.recruiting-page .price-block .big small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.recruiting-page .price-block .alt {
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
}

/* =========================================================
   KPI ТА ДОДАТКОВІ ПЛАШКИ
   ========================================================= */

.recruiting-page .kpi-note,
.recruiting-page .discount-line {
    display: block;
    margin-top: 12px;
    padding: 9px 11px;
    border-radius: 8px;
    background: #f1f9fd;
    color: var(--navy-700);
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.45;
}

.recruiting-page .outcome-box {
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid #d8e6f2;
    border-radius: 9px;
}

.recruiting-page .outcome-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 11px;
    background: var(--sky-50);
    color: var(--navy-700);
    font-size: 10.5px;
    line-height: 1.4;
}

.recruiting-page .outcome-row strong {
    flex: none;
}

/* =========================================================
   СПИСКИ МОЖЛИВОСТЕЙ
   ========================================================= */

.recruiting-page .feat-list {
    margin-top: 16px;
}

.recruiting-page .feat-list li {
    position: relative;
    padding: 6px 0 6px 21px;
    color: #34446d;
    font-size: 11.5px;
    line-height: 1.5;
}

.recruiting-page .feat-list li::before {
    content: "✓";
    position: absolute;
    top: 6px;
    left: 0;
    color: var(--sky-500);
    font-family: Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
}

/* =========================================================
   РОЗКРИВНИЙ СПИСОК
   ========================================================= */

.recruiting-page details.more {
    margin-top: auto;
    padding-top: 14px;
}

.recruiting-page details.more summary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 22px 9px 0;
    cursor: pointer;
    list-style: none;
    color: var(--navy-700);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
}

.recruiting-page details.more summary::-webkit-details-marker {
    display: none;
}

.recruiting-page details.more summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 2px;
    color: var(--sky-500);
    font-size: 18px;
    font-weight: 700;
    transform: translateY(-50%);
}

.recruiting-page details.more[open] summary::after {
    content: "−";
}

.recruiting-page .more-content {
    padding-top: 2px;
}

.recruiting-page .more-content .feat-list {
    margin-top: 6px;
}

/* Ціни за кількість вакансій */

.recruiting-page .volume-grid {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
}

.recruiting-page .volume-grid > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 7px;
    background: var(--sky-50);
    color: var(--ink);
    font-size: 10.5px;
    line-height: 1.4;
}

.recruiting-page .volume-grid strong {
    flex: none;
    color: var(--navy-800);
    font-weight: 800;
    text-align: right;
}

/* Додаткові умови */

.recruiting-page .who-list {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 9px;
    background: var(--sky-50);
}

.recruiting-page .who-list li {
    position: relative;
    padding: 4px 0 4px 18px;
    color: var(--navy-700);
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.45;
}

.recruiting-page .who-list li::before {
    content: "✓";
    position: absolute;
    top: 4px;
    left: 0;
    color: var(--sky-500);
    font-family: Arial, sans-serif;
    font-weight: 700;
}

/* =========================================================
   КНОПКИ КАРТОК
   ========================================================= */

.recruiting-page .card-btns {
    display: flex;
    gap: 8px;
    width: 100%;
    margin-top: 18px;
}

.recruiting-page .card-btns .btn {
    flex: 1 1 0;
    min-width: 0;
    min-height: 40px;
    padding: 9px 7px;
    font-size: 10px;
    white-space: normal;
}

/* =========================================================
   АДМІН-ФОРМАТ
   ========================================================= */

.recruiting-page .team-banner {
    position: relative;
    margin-top: 54px;
    padding: 42px 40px;
    overflow: hidden;
    border-radius: 24px;
    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(108, 195, 236, 0.16),
            transparent 38%
        ),
        linear-gradient(
            120deg,
            var(--navy-800),
            var(--navy-700) 62%,
            var(--navy-600)
        );
    color: #ffffff;
    scroll-margin-top: 90px;
}

.recruiting-page .team-banner .team-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.recruiting-page .team-banner .kicker {
    margin-bottom: 10px;
    color: var(--sky-200);
}

.recruiting-page .team-banner h3 {
    color: #ffffff;
    font-size: 28px;
}

.recruiting-page .team-banner .desc {
    max-width: 650px;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
    line-height: 1.6;
}

.recruiting-page .team-cols {
    display: flex;
    gap: 18px;
    margin-top: 30px;
}

.recruiting-page .team-cols .col {
    flex: 1 1 0;
    min-width: 0;
    padding: 22px 24px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background: rgba(20, 29, 56, 0.18);
}

.recruiting-page .team-cols h4 {
    margin-bottom: 12px;
    color: var(--sky-200);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.recruiting-page .team-cols li {
    position: relative;
    padding: 6px 0 6px 23px;
    color: #ffffff;
    font-size: 12.5px;
    line-height: 1.5;
}

.recruiting-page .team-cols li::before {
    content: "✓";
    position: absolute;
    top: 6px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: rgba(108, 195, 236, 0.16);
    color: var(--sky-200);
    font-size: 10px;
    font-weight: 800;
}

/* =========================================================
   ПЛАНШЕТ
   ========================================================= */

@media (max-width: 900px) {
    .recruiting-page .wrap {
        padding-right: 22px;
        padding-left: 22px;
    }

    .recruiting-page .recruit-pricing-grid {
        gap: 12px;
    }

    .recruiting-page .recruit-pricing-card {
        padding: 24px 18px 18px;
    }

    .recruiting-page .recruit-pricing-card h3 {
        font-size: 22px;
    }

    .recruiting-page .price-block .big {
        font-size: 25px;
    }

    .recruiting-page .card-btns {
        flex-direction: column;
    }

    .recruiting-page .team-banner {
        padding: 36px 30px;
    }
}

/* =========================================================
   МОБІЛЬНА ВЕРСІЯ
   ========================================================= */

@media (max-width: 600px) {
    .recruiting-page .wrap {
        padding-right: 16px;
        padding-left: 16px;
    }

    .recruiting-page section {
        padding: 44px 0;
    }

    .recruiting-page .page-hero {
        padding: 36px 0 42px;
    }

    .recruiting-page .page-hero h1 {
        font-size: 36px;
    }

    .recruiting-page .page-hero .lead {
        font-size: 14px;
        line-height: 1.55;
    }

    .recruiting-page .category-toggle {
        display: flex;
        width: 100%;
        border-radius: 18px;
    }

    .recruiting-page .category-toggle .cat {
        flex: 1 1 50%;
        padding: 10px 8px;
        white-space: normal;
    }

    .recruiting-page #produkty {
        padding: 48px 0 56px;
    }

    .recruiting-page .tier-tabs a {
        flex: 1 1 calc(50% - 5px);
    }

    .recruiting-page .recruit-pricing-grid {
        flex-direction: column;
        gap: 26px;
        max-width: 480px;
        margin: 0 auto;
    }

    .recruiting-page .recruit-pricing-card {
        width: 100%;
        padding: 27px 21px 20px;
    }

    .recruiting-page .recruit-pricing-card .role,
    .recruiting-page .recruit-pricing-card > .desc {
        min-height: 0;
    }

    .recruiting-page .card-btns {
        flex-direction: row;
    }

    .recruiting-page .team-banner {
        margin-top: 44px;
        padding: 32px 22px;
        border-radius: 20px;
    }

    .recruiting-page .team-banner h3 {
        font-size: 24px;
    }

    .recruiting-page .team-cols {
        flex-direction: column;
        gap: 14px;
        margin-top: 24px;
    }

    .recruiting-page .team-cols .col {
        padding: 20px;
    }
}

@media (max-width: 390px) {
    .recruiting-page .page-hero h1 {
        font-size: 32px;
    }

    .recruiting-page .card-btns {
        flex-direction: column;
    }
}
/* =========================================================
   КНОПКИ КАРТОК — ФІНАЛЬНИЙ СТИЛЬ
   ========================================================= */

.recruiting-page .recruit-pricing-card .card-btns {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: 10px !important;

    width: 100% !important;
    margin: 18px 0 0 !important;
    padding: 0 !important;
}

.recruiting-page .recruit-pricing-card .card-btns .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: 50px !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 0 8px !important;

    border-radius: 999px !important;

    font-family: "Manrope", Arial, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-indent: 0 !important;
    white-space: nowrap !important;

    box-sizing: border-box !important;
    overflow: visible !important;
    transform: none !important;
}

/* Консультація */

.recruiting-page .recruit-pricing-card .card-btns .btn-outline {
    border: 1.5px solid #28407e !important;
    background: #ffffff !important;
    color: #1c2c5c !important;
    box-shadow: none !important;
}

/* Замовити */

.recruiting-page .recruit-pricing-card .card-btns .btn-solid {
    border: 1.5px solid #3aa9de !important;
    background: #3aa9de !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(58, 169, 222, 0.20) !important;
}

/* Наведення */

.recruiting-page .recruit-pricing-card .card-btns .btn-outline:hover {
    border-color: #1c2c5c !important;
    background: #1c2c5c !important;
    color: #ffffff !important;
}

.recruiting-page .recruit-pricing-card .card-btns .btn-solid:hover {
    border-color: #28407e !important;
    background: #28407e !important;
    color: #ffffff !important;
}

/* Блок можливостей над кнопками */

.recruiting-page .recruit-pricing-card details.more {
    min-height: 56px;
}

.recruiting-page .recruit-pricing-card details.more summary {
    min-height: 44px;
    padding: 12px 28px 12px 0;
    font-size: 13px;
    font-weight: 800;
}

/* WordPress додає зайві p та br навколо кнопок */

.recruiting-page .recruit-pricing-card .card-btns p {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}

.recruiting-page .recruit-pricing-card .card-btns br {
    display: none !important;
}

.recruiting-page .recruit-pricing-card .card-btns > a,
.recruiting-page .recruit-pricing-card .card-btns > p > a {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}

/* =========================================================
   КАРТКИ — РОЗМІРИ ЯК У ТАРИФАХ АСИСТЕНТІВ
   ========================================================= */

/* Сітка */

.recruiting-page .recruit-pricing-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 22px !important;
    width: 100% !important;
}

/* Основна картка */

.recruiting-page .recruit-pricing-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 30px 26px 26px !important;

    border: 1px solid #dfe7f2 !important;
    border-radius: 22px !important;
    background: #ffffff !important;

    box-shadow: 0 16px 40px rgba(28, 44, 92, 0.08) !important;
}

/* Рекомендована картка */

.recruiting-page .recruit-pricing-card--popular {
    border: 2px solid #3aa9de !important;
    background: linear-gradient(
        180deg,
        #f1faff 0,
        #ffffff 210px
    ) !important;
    box-shadow: 0 22px 50px rgba(58, 169, 222, 0.17) !important;
    transform: translateY(-8px) !important;
}

/* Плашка "Популярний вибір" */

.recruiting-page .popular-badge {
    top: -16px !important;
    padding: 8px 19px !important;
    border-radius: 999px !important;

    background: #3aa9de !important;
    color: #ffffff !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
}

/* Номер продукту */

.recruiting-page .lvl-eyebrow {
    color: #7784a3 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
}

/* Назва тарифу */

.recruiting-page .recruit-pricing-card h3 {
    margin-top: 10px !important;
    color: #1c2c5c !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
}

/* Підзаголовок */

.recruiting-page .recruit-pricing-card .role {
    min-height: 44px !important;
    margin-top: 6px !important;

    color: #3aa9de !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}

/* Опис продукту */

.recruiting-page .recruit-pricing-card > .desc {
    min-height: 108px !important;
    margin-top: 12px !important;

    color: #67759a !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* Ціна */

.recruiting-page .price-block {
    min-height: 118px !important;
    margin-top: 20px !important;
    padding: 20px 0 !important;

    border-top: 1px solid #e3e8f2 !important;
    border-bottom: 1px solid #e3e8f2 !important;
}

.recruiting-page .price-block .big {
    color: #1c2c5c !important;
    font-size: 37px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
}

.recruiting-page .price-block .big .from,
.recruiting-page .price-block .big small {
    color: #67759a !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.recruiting-page .price-block .alt {
    margin-top: 8px !important;
    color: #7b87a4 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* KPI */

.recruiting-page .kpi-note {
    display: flex !important;
    align-items: center !important;
    min-height: 54px !important;

    margin-top: 18px !important;
    padding: 11px 13px !important;

    border: 1px solid #dceff9 !important;
    border-radius: 11px !important;
    background: #f7fcff !important;

    color: #3c5a85 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

/* Бонус у Close */

.recruiting-page .outcome-box {
    margin-top: 12px !important;
    border: 1px solid #dceff9 !important;
    border-radius: 11px !important;
}

.recruiting-page .outcome-row {
    min-height: 48px !important;
    padding: 10px 12px !important;
    background: #f4fbff !important;
    font-size: 11.5px !important;
    line-height: 1.4 !important;
}

/* Основний список */

.recruiting-page .feat-list {
    margin-top: 19px !important;
}

.recruiting-page .feat-list li {
    padding: 7px 0 7px 24px !important;

    color: #26365d !important;
    font-size: 13.5px !important;
    line-height: 1.45 !important;
}

/* Галочки як на сторінці асистентів */

.recruiting-page .feat-list li::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;

    top: 8px !important;
    left: 5px !important;

    width: 5px !important;
    height: 9px !important;

    border: 0 !important;
    border-right: 2px solid #3aa9de !important;
    border-bottom: 2px solid #3aa9de !important;
    border-radius: 0 !important;

    background: transparent !important;
    transform: rotate(45deg) !important;
}

/* Повний список */

.recruiting-page .recruit-pricing-card details.more {
    min-height: 56px !important;
    margin-top: auto !important;
    padding-top: 0 !important;
    border-top: 1px solid #e8edf4 !important;
}

.recruiting-page .recruit-pricing-card details.more summary {
    min-height: 56px !important;
    padding: 15px 28px 8px 0 !important;

    color: #28407e !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
}

/* Додаткова умова */

.recruiting-page .discount-line {
    min-height: 54px !important;
    margin-top: 12px !important;
    padding: 11px 13px !important;

    border: 1px solid #dceff9 !important;
    border-radius: 11px !important;
    background: #f7fcff !important;

    color: #3c5a85 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

/* Кнопки */

.recruiting-page .recruit-pricing-card .card-btns {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;

    width: 100% !important;
    margin-top: 18px !important;
}

.recruiting-page .recruit-pricing-card .card-btns p {
    display: contents !important;
}

.recruiting-page .recruit-pricing-card .card-btns br {
    display: none !important;
}

.recruiting-page .recruit-pricing-card .card-btns .btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: 50px !important;
    min-height: 50px !important;

    margin: 0 !important;
    padding: 0 10px !important;

    border-radius: 999px !important;

    font-size: 13.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* Телефон */

@media (max-width: 680px) {
    .recruiting-page .recruit-pricing-grid {
        grid-template-columns: 1fr !important;
    }

    .recruiting-page #rp-product-three {
    grid-column: auto !important;
    width: 100% !important;
}

    .recruiting-page .recruit-pricing-card > .desc,
    .recruiting-page .recruit-pricing-card .role,
    .recruiting-page .price-block {
        min-height: 0 !important;
    }
}

/* =========================================================
   ПРИБИРАЄМО СЛУЖБОВІ ЕЛЕМЕНТИ WORDPRESS І ФІКСУЄМО КОЛОНКИ
   ========================================================= */

/* WordPress може вставляти порожні p та br між article */

.recruiting-page .recruit-pricing-grid > p,
.recruiting-page .recruit-pricing-grid > br {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* На комп’ютері чітко призначаємо кожній картці її колонку */

.recruiting-page .recruit-pricing-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: auto !important;
    grid-auto-flow: row !important;
    gap: 22px !important;
}

.recruiting-page .recruit-pricing-grid > #rp-product-one {
    grid-column: 1 !important;
    grid-row: 1 !important;
}

.recruiting-page .recruit-pricing-grid > #rp-product-two {
    grid-column: 2 !important;
    grid-row: 1 !important;
}

.recruiting-page .recruit-pricing-grid > #rp-product-three {
    grid-column: 3 !important;
    grid-row: 1 !important;
}

/* Мобільна версія */

@media (max-width: 680px) {
    .recruiting-page .recruit-pricing-grid {
        grid-template-columns: 1fr !important;
    }

    .recruiting-page .recruit-pricing-grid > #rp-product-one {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    .recruiting-page .recruit-pricing-grid > #rp-product-two {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    .recruiting-page .recruit-pricing-grid > #rp-product-three {
        grid-column: 1 !important;
        grid-row: 3 !important;
        width: 100% !important;
    }
}

/* Ціна та "/ вакансія" в одному рядку */

.recruiting-page .price-block .big {
    display: flex !important;
    align-items: baseline !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    white-space: nowrap !important;
}

.recruiting-page .price-block .big .from,
.recruiting-page .price-block .big small {
    display: inline !important;
    flex: none !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* Прибираємо автоматичні переноси WordPress */

.recruiting-page .price-block .big br {
    display: none !important;
}

.recruiting-page .price-block .big p {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Вирівнювання нижньої частини всіх карток */

.recruiting-page .discount-line--empty {
    visibility: hidden !important;
    pointer-events: none !important;
}

.recruiting-page .recruit-pricing-card .discount-line {
    display: flex !important;
    align-items: center !important;
    min-height: 64px !important;
    margin-top: 12px !important;
}

.recruiting-page .recruit-pricing-card .card-btns {
    margin-top: 18px !important;
}

/* =========================================================
   АДМІН-ФОРМАТ — СТИЛЬ БЛОКУ + TEAM
   ========================================================= */

.recruiting-page #recruit-admin.team-banner {
    position: relative !important;
    margin-top: 52px !important;
    padding: 44px 42px 40px !important;
    overflow: hidden !important;

    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 26px !important;

    background:
        radial-gradient(
            circle at 92% 5%,
            rgba(108, 195, 236, 0.22),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #172653 0%,
            #243d7c 52%,
            #385da8 100%
        ) !important;

    color: #ffffff !important;
    box-shadow: 0 24px 55px rgba(28, 44, 92, 0.18) !important;
    scroll-margin-top: 90px !important;
}

/* Декоративні дуги */

.recruiting-page #recruit-admin.team-banner::after {
    content: "" !important;
    position: absolute !important;
    right: -130px !important;
    bottom: -210px !important;

    display: block !important;
    width: 420px !important;
    height: 420px !important;

    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 55px rgba(255, 255, 255, 0.025),
        0 0 0 110px rgba(255, 255, 255, 0.018) !important;

    pointer-events: none !important;
}

/* Верхня частина */

.recruiting-page #recruit-admin .team-head {
    position: relative !important;
    z-index: 2 !important;

    display: block !important;
    width: 100% !important;
    max-width: 760px !important;
}

.recruiting-page #recruit-admin .kicker {
    margin-bottom: 10px !important;

    color: #8dd7f6 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

.recruiting-page #recruit-admin h3 {
    margin: 0 !important;

    color: #ffffff !important;
    font-size: 34px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
}

.recruiting-page #recruit-admin .team-head .desc {
    max-width: 720px !important;
    margin-top: 14px !important;

    color: rgba(255, 255, 255, 0.78) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* Дві нижні колонки */

.recruiting-page #recruit-admin .team-cols {
    position: relative !important;
    z-index: 2 !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;

    width: 100% !important;
    margin-top: 32px !important;
}

.recruiting-page #recruit-admin .team-cols .col {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 24px 25px !important;

    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 17px !important;

    background: rgba(10, 24, 61, 0.18) !important;
}

/* Заголовки колонок */

.recruiting-page #recruit-admin .team-cols h4 {
    margin: 0 0 14px !important;

    color: #8dd7f6 !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.09em !important;
    text-transform: uppercase !important;
}

/* Списки */

.recruiting-page #recruit-admin .team-cols ul {
    display: grid !important;
    gap: 2px !important;

    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.recruiting-page #recruit-admin .team-cols li {
    position: relative !important;
    display: block !important;

    margin: 0 !important;
    padding: 7px 0 7px 31px !important;

    background: none !important;
    color: rgba(255, 255, 255, 0.9) !important;

    font-size: 13.5px !important;
    line-height: 1.45 !important;
    list-style: none !important;
}

/* Галочка у кружечку */

.recruiting-page #recruit-admin .team-cols li::before {
    content: "✓" !important;
    position: absolute !important;
    top: 7px !important;
    left: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 20px !important;
    height: 20px !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: rgba(108, 195, 236, 0.15) !important;
    color: #8dd7f6 !important;

    font-family: Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    transform: none !important;
}

/* Прибираємо інші маркери теми */

.recruiting-page #recruit-admin .team-cols li::after {
    content: none !important;
    display: none !important;
}

/* Планшет */

@media (max-width: 900px) {
    .recruiting-page #recruit-admin.team-banner {
        padding: 38px 30px 34px !important;
    }
}

/* Телефон */

@media (max-width: 680px) {
    .recruiting-page #recruit-admin.team-banner {
        margin-top: 42px !important;
        padding: 34px 21px 28px !important;
        border-radius: 21px !important;
    }

    .recruiting-page #recruit-admin h3 {
        font-size: 29px !important;
    }

    .recruiting-page #recruit-admin .team-cols {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 26px !important;
    }

    .recruiting-page #recruit-admin .team-cols .col {
        padding: 21px 18px !important;
    }
}

/* =========================================================
   CTA — ЯК НА СТОРІНЦІ ТАРИФІВ АСИСТЕНТІВ
   ========================================================= */

.recruiting-page .cta-banner {
    padding: 48px 40px !important;
    border-radius: 24px !important;
    background: #141d38 !important;
    color: #ffffff !important;
    text-align: center !important;
}

.recruiting-page .cta-banner h2 {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: clamp(22px, 3vw, 30px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.recruiting-page .cta-banner p {
    margin: 10px 0 0 !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 14.5px !important;
    line-height: 1.55 !important;
}

.recruiting-page .cta-banner .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 420px !important;
    max-width: 100% !important;
    height: 68px !important;
    min-height: 68px !important;

    margin: 36px auto 0 !important;
    padding: 0 25px !important;

    border: none !important;
    border-radius: 999px !important;
    background: #3aa9de !important;
    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-shadow: none !important;
}

@media (max-width: 520px) {
    .recruiting-page .cta-banner .btn {
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        margin-top: 28px !important;
        font-size: 14px !important;
    }
}

.recruiting-page .cta-banner .btn:hover {
    border-color: #28407e !important;
    background: #28407e !important;
    color: #ffffff !important;
}

@media (max-width: 520px) {
    .recruiting-page .cta-banner {
        padding: 36px 20px !important;
    }
}

.recruiting-page .cta-banner .btn {
    padding: 0 !important;
    line-height: 1 !important;
}

/* CTA-кнопка — як у тарифах асистентів */

.recruiting-page .cta-banner .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 350px !important;
    max-width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;

    margin: 30px auto 0 !important;
    padding: 0 24px !important;

    border: 1.5px solid #3aa9de !important;
    border-radius: 999px !important;
    background: #3aa9de !important;
    color: #ffffff !important;

    font-family: "Manrope", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;

    box-shadow: none !important;
    transform: none !important;
}

.recruiting-page .cta-banner .btn span {
    display: block !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    transform: none !important;
}

.recruiting-page .cta-banner .btn:hover {
    border-color: #28407e !important;
    background: #28407e !important;
    color: #ffffff !important;
}

@media (max-width: 520px) {
    .recruiting-page .cta-banner .btn {
        width: 100% !important;
        height: 54px !important;
        min-height: 54px !important;
        margin-top: 24px !important;
        font-size: 13px !important;
    }
}

.recruiting-page .recruit-pricing-card {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;
}

.recruiting-page .recruit-pricing-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 35px;
    right: 0;

    width: 52%;
    height: 270px;

    background-repeat: no-repeat;
    background-position: right top;
    background-size: contain;

    opacity: 0.33;
    pointer-events: none;

    -webkit-mask-image: linear-gradient(
        to bottom,
        #000 25%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom,
        #000 25%,
        transparent 100%
    );
}

.recruiting-page #rp-product-one::after {
    background-image: url("https://siri-pro.com/wp-content/uploads/2026/08/chatgpt-image-17-serp.-2026-r.-17_18_52.png");
}

.recruiting-page #rp-product-two::after {
    background-image: url("https://siri-pro.com/wp-content/uploads/2026/08/chatgpt-image-17-serp.-2026-r.-17_21_25.png");
}

.recruiting-page #rp-product-three::after {
    background-image: url("https://siri-pro.com/wp-content/uploads/2026/08/chatgpt-image-17-serp.-2026-r.-17_23_31.png");
}

.recruiting-page .recruit-pricing-card > * {
    position: relative;
    z-index: 1;
}

/* Збільшуємо фото у картці Close */

.recruiting-page #rp-product-two::after {
    top: 38px !important;
    right: -45px !important;

    width: 78% !important;
    height: 330px !important;

    background-position: right top !important;
    background-size: contain !important;

    opacity: 0.25 !important;
}