.custom-search-container {
    position: relative; /* устанавливаем относительное позиционирование */
    float: right; /* прижмем поиск к правому краю */
    margin-top: 20px; /* отступ сверху */
    margin-right: 50px; /* отступ справа */
    z-index: 1000; /* ставим выше остальных элементов */
    background-color: rgba(255,255,255,0.8); /* полупрозрачный фон */
    backdrop-filter: blur(5px); /* легкое размытие фона */
    border-radius: 36px; /* круглые края */
    padding: 10px 20px; /* небольшие отступы */
}

#search-custom {
    width: 100%; /* занимает всю ширину контейнера */
    height: 43px; /* зафиксировали нашу высоту */
    padding: 0 14px; /* внутренние отступы */
    border:none; 
    border-radius:36px;
    background:#fff; 
    color:#222; 
    caret-color:#222;
    font-size:16px;
    line-height:43px; /* выравниваем текст по центру */
    outline:none;
    box-sizing:border-box; /* учитываем padding в общей высоте */
}


/* Основной контейнер */
.vacancy-list {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Noto Sans', sans-serif;
}

/* Строка вакансии */
.vac-item {
    border-bottom: 1px solid #e3e3e3;
    padding: 18px 0;
}

/* Заголовок (как у Контакта) */
.vac-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.vac-title {
    font-size: 24px; /* Повышаем размер шрифта */
    font-weight: 600;
    color: #111;
    margin-bottom: 10px; /* Большой отступ снизу */
}

/* Стрелка */
.vac-arrow {
    width: 20px; /* Увеличиваем стрелку */
    height: 20px;
    border-right: 2px solid #111;
    border-bottom: 2px solid #111;
    transform: rotate(45deg);
    transition: 0.25s;
}

/* Тело */
.vac-body {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.35s ease;
    padding: 0 15px; /* Небольшой внутренний отступ для красоты */
}

/*** Активный класс ***/
.vac-item.open .vac-body {
    max-height: 1200px; /* Больше места для текста */
    opacity: 1;
    margin-top: 25px; /* Немного увеличиваем расстояние сверху */
}
.vac-item.active .vac-arrow {
    transform: rotate(-135deg);
}

/* 3 столбца */
.vac-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px; /* Расстояние между колонками увеличено */
    margin-bottom: 30px; /* Увеличили отступ снизу */
}

.vac-col h4 {
    font-size: 18px; /* Размер шрифт для заглавий повысился */
    margin-bottom: 12px; /* Пространство между заголовком и текстом */
}

.vac-col ul {
    padding-left: 20px;
}
.vac-col li {
    margin-bottom: 10px; /* Расширили отступ между строчками */
    line-height: 1.6; /* Увеличиваем межстрочный интервал */
}

/* Нижняя часть */
.vac-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px; /* Пробел сверху увеличился */
}

.vac-contacts div {
    margin-bottom: 8px;
    font-size: 16px; /* Чуть увеличили шрифт контактов */
}

.vac-salary-btn {
    display: flex;
    align-items: center;
    gap: 25px; /* Удвоили пробел между зарплатой и кнопкой */
}

.salary {
    font-size: 20px; /* Шрифтовое увеличение размера */
    font-weight: 600;
}

.vac-btn {
    padding: 12px 25px; /* Большая кнопка с большим пространством */
    background: #25C5E2;
    color: #fff !important;
    border-radius: 6px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.2s;
}
.vac-btn:hover {
    opacity: .85;
}

/* Адаптив */
@media (max-width: 960px) {
    .vac-columns {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 640px) {
    .vac-columns {
        grid-template-columns: 1fr;
    }
    .vac-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }
    .vac-salary-btn {
        width: 100%;
        justify-content: space-between;
    }
}
