/* 
 * ZOOMCITY - Основной файл стилей
 * Подключение кастомных шрифтов и стилей
 */

/* Подключение шрифта Cuyabra Regular */
@font-face {
    font-family: 'Cuyabra';
    src: url('../fonts/cuyabra-Regular.woff2') format('woff2'),
         url('../fonts/cuyabra-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Подключение шрифта Glametrix Medium */
@font-face {
    font-family: 'Glametrix';
    src: url('../fonts/GlametrixMedium.woff2') format('woff2'),
         url('../fonts/GlametrixMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* Подключение шрифта Glametrix Bold */
@font-face {
    font-family: 'Glametrix';
    src: url('../fonts/GlametrixBold.woff2') format('woff2'),
         url('../fonts/GlametrixBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Подключение шрифта Glametrix Light */
@font-face {
    font-family: 'Glametrix';
    src: url('../fonts/GlametrixLight.woff2') format('woff2'),
         url('../fonts/GlametrixLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* Основной шрифт для всего документа */
body {
    font-family: 'Cuyabra', sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f8f9fa;
}

/* Классы для применения различных шрифтов */
.font-glametrix-medium {
    font-family: 'Glametrix', sans-serif;
    font-weight: 500;
}

.font-glametrix-bold {
    font-family: 'Glametrix', sans-serif;
    font-weight: 700;
}

.font-glametrix-light {
    font-family: 'Glametrix', sans-serif;
    font-weight: 300;
}

/* Дополнительные стили для улучшения отображения */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    margin-bottom: 1rem;
}

/* Адаптивные настройки */
@media (max-width: 768px) {
    .display-1 {
        font-size: 3rem;
    }
}

/* Дополнение к существующим стилям в styles.css */

/* Стили для header */
.logo-wrapper {
    font-size: 1.5rem;
    line-height: 0.6; /* Уменьшаем межстрочное расстояние вполовину */
    letter-spacing: 1px;
}

/* Стили для поиска */
.search-container {
    display: flex;
    align-items: center;
}

.search-input-group {
    transition: width 0.3s ease;
}

.search-input {
    border-radius: 20px 0 0 20px !important;
    border: 0px solid #dee2e6;
    border-right: none;
    padding: 0.375rem 0.75rem;
    height: 38px;
}

.search-toggle {
    background-color: #f8f9fa;
    border: 0px solid #dee2e6;
    border-left: none;
    color: #6c757d;
    padding: 0.375rem 0.75rem;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.search-toggle:hover {
    background-color: #e9ecef;
    color: #495057;
}

.menu-toggle {
    background-color: transparent;
    border: none;
    color: #6c757d;
    padding: 0.375rem 0.75rem;
    transition: all 0.2s ease;
}

.menu-toggle:hover {
    color: #495057;
    background-color: #f8f9fa;
    border-radius: 4px;
}

/* Offcanvas меню */
.offcanvas-title {
    font-size: 1.5rem;
    letter-spacing: 1px;
}

.nav-link {
    font-size: 1.1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.nav-link.active {
    color: #0d6efd;
    font-weight: 500;
}

.nav-link:hover {
    color: #0d6efd;
}

.mainMenu{
    background-color: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}
.mainMenu .nav-link{
    font-size: 1rem;
    padding: 0.2rem 1rem;
    border: none;
}

/* Адаптивность */
@media (max-width: 768px) {
    .logo-wrapper {
        font-size: 1.4rem;
    }
    
    .search-input-group {
        max-width: 150px;
    }
}

@media (max-width: 576px) {
    .logo-wrapper {
        font-size: 1.2rem;
    }
    
    .search-input-group {
        max-width: 120px;
    }
}
