/* HEADER */
header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 2vw;
    padding: 0 2vw; /* Отступы по краям */
    width: 100%;
    /* max-width: 100%; Максимальная ширина, как в макете */
    height: 60%;
    background: #E8F5E2;
    margin: 0 auto; /* Центрируем */
    box-sizing: border-box;
}

/* HEADER LOGO */
.headerLogo {
    display: flex;
    align-items: center;
    width: fit-content; 
    flex: none;
    gap: 1.5vw; 
    text-decoration: none;
}

.logoPic {
    width: 10%; /* Увеличил размер логотипа */
    height: 20%;
}

.companyName {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 700; /* Увеличил жирность текста */
    font-size: clamp(1.5rem, 2.8vw, 2.4rem); /* Увеличил размер текста */
    color: #000000;
    margin: 0; /* Убираем лишние отступы */
}

/* HEADER SEARCH */
.headerSearch {
    /* visibility: hidden; */
    display: flex;
    width: 60%; /* Ширина из макета */
    height: 60%;
    /* order: 1;
    flex-grow: 0; */
    align-items: center;
    background-color: #e0f2e9; /* Зеленый фон, как на скриншоте */
    border-radius: 0.5rem;
    padding: 0 1vw;
    box-sizing: border-box;
}

.searchIcon {
    width: 5%;
    height: auto;
}

.searchInput {
    flex-grow: 1; /* Занимает оставшееся пространство */
    height: 100%;
    border: none;
    outline: none;
    font-size: clamp(0.9rem, 1.5vw, 1.2rem);
    background: #FFFFFF;
    border-radius: 0.5rem;
    padding: 0 1vw;
}
.searchBtn {
    width: 15%; /* Ширина кнопки относительно контейнера */
    height: 80%; /* Высота относительно headerSearch */
    min-width: 10vw; /* Минимальная ширина для маленьких экранов */
    min-height: 4vh;
    background: #69B862;
    color: black;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: clamp(0.8rem, 1.2vw, 1rem); /* Адаптивный текст */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* HEADER ICONS */
.headerIcons {
    display: flex;
    align-items: center;
    gap: 1vw; /* Адаптивный отступ */
    width: 15%; /* Относительная ширина */
    flex: none;
}

.icon {
    width: 20%; /* Размер иконок относительно контейнера */
    height: auto; /* Сохраняем пропорции */
}
@media (max-width: 768px) {
    header {
        gap: 1vw;
        padding: 0 1vw;
        height: 12vh; /* Увеличим высоту для маленьких экранов */
    }

    .headerLogo {
        width: 25%; /* Увеличил ширину для маленьких экранов */
    }

    .logoPic {
        width: 40%; /* Сохраняем увеличенный размер */
    }

    .companyName {
        font-size: clamp(1.2rem, 2.5vw, 2rem); /* Уменьшаем, но оставляем больше */
    }

    .headerSearch {
        width: 55%;
        height: 50%;
        padding: 0 0.5vw;
    }

    .searchIcon {
        width: 6%;
    }

    .searchInput {
        font-size: clamp(0.8rem, 1.2vw, 1rem);
    }

    .searchBtn {
        width: 20%;
        min-width: 12vw;
        height: 70%;
        font-size: clamp(0.7rem, 1vw, 0.9rem);
    }

    .headerIcons {
        width: 20%;
        gap: 0.5vw;
    }

    .icon {
        width: 25%;
    }
}