.uc-menu .t396__artboard.rendered {
    overflow: visible !important;
}

.kgp-text-book .tn-atom {
    text-indent: 128px;
    text-align: justify;
}

@media screen and (max-width: 1440px) {
    .kgp-text-book .tn-atom {
        text-indent: 60px;
    }
}

.kgp-program-card {
    cursor: pointer;
}
.kgp-program-card > .tn-molecule {
    transition: background-color 0.3s ease-in-out !important;
}
.kgp-program-card:hover [data-elem-type="text"] .tn-atom {
    transition: color 0.3s ease-in-out !important;
}
.kgp-program-card:hover > .tn-molecule {
    background-color: #D2C9F7 !important;
}
.kgp-program-card:hover [data-elem-type="text"] .tn-atom {
    color: #F5571D !important;
}

/* CSS для скрытия блоков */
.kgp-hidden-content-block {
    display: none !important; /* !important может быть нужен для переопределения стилей конструктора */
}

.kgp-tilda-switcher .tn-atom {
    cursor: pointer;
}

/* Опционально: стили для активной кнопки */
.kgp-switcher-button.kgp-active-button .tn-atom {
    color: #6200d6 !important; /* Пример выделения активной кнопки */
    background-color: #f2e7ff !important;
}

.kgp-switcher-button.kgp-active-button__inverted .tn-atom {
    color: #FFFFFF !important; /* Пример выделения активной кнопки */
    background-color: #8056E3 !important;
}

.tik-switcher-button.kgp-active-button .tn-atom {
    color: #1520B1 !important; /* Пример выделения активной кнопки */
    background-color: #CBCEF6 !important;
}

.mix-screen {
    mix-blend-mode: screen;
}

/* ------------------------------------------------------------------ */
/* --- ДЕСКТОП: Стили по умолчанию (от 1440px и выше) --- */
/* ------------------------------------------------------------------ */
.kgp-submenu { 
    /* Здесь вы можете оставить base-стили, если они нужны для всех разрешений */
    pointer-events: none;
    /* transition: opacity 0.3s ease, top 0s 0.3s; */ /* Убрано, т.к. конфликтует с max-height */
    transition: opacity 0.3s ease; /* Универсальный transition */
}

/* 1. КЛАСС СКРЫТИЯ (1440px+) */
.kgp-submenu__hidden { 
    /*top: 0px !important; */
    max-height: 0 !important;
    opacity: 0;
    overflow: hidden;
    /* Здесь оставляем позиционирование только для <1440px (см. ниже) */
}

/* 2. КЛАСС ПОКАЗА (1440px+) */
.kgp-submenu__show {
    /*max-height: 999px;*/
    opacity: 1;
    pointer-events: auto;
    
    /* Добавляем z-index, если он нужен для перекрытия элементов */
    z-index: 1010 !important;
    
    transition: opacity 0.3s ease;
}

/* ------------------------------------------------------------------ */
/* --- АДАПТАЦИЯ: Для экранов МЕНЬШЕ 1440px (max-width: 1439px) --- */
/* ------------------------------------------------------------------ */

@media screen and (max-width: 1439px) {
    
    .kgp-submenu-container {
        overflow: hidden;
    }
    
    .scroll-lock {
        overflow: hidden !important; /* Блокирует вертикальный скролл */
        height: 100vh !important; /* Важно: предотвращает скролл на iOS */
    }
    
    /* 2. Стиль контейнера меню (убедитесь, что он может скроллиться) */
    .kgp-submenu-container__show {
        position: fixed; /* или absolute/fixed, в зависимости от дизайна */
        /* ... другие стили позиционирования ... */
        height: calc((100vh / var(--zoom, 1) - 80px)) !important;
        overflow-y: auto; /* Включаем скролл внутри контейнера, если контент не помещается */
        -webkit-overflow-scrolling: touch; /* Для плавного скролла на iOS */
    }
    
    
    .t396_safari .kgp-submenu-container__show {
        /* УПРОЩЕННАЯ ФОРМУЛА: 
           На iOS/Safari просто вычитаем немасштабированную высоту шапки (80px),
           игнорируя var(--zoom), чтобы избежать ошибки calc(). 
           Safari самостоятельно справится с transform: scale().
        */
        height: calc(100dvh - 80px) !important;
        
        /* Для стабильного скролла на iOS */
        -webkit-overflow-scrolling: touch; 
    }
    
    
    .kgp-submenu-container:not(.kgp-submenu-container__show) {
        display: none !important;
    }
    
    /* Переопределяем позиционирование базового класса */
    .kgp-submenu {
        /* Убираем абсолютное позиционирование для всех состояний на малых экранах */
        position: relative !important; 
        /* top/left/z-index сбросятся благодаря position: relative */
        /* Убедитесь, что здесь не добавляются стили, которые ломают макет */
    }

    /* 1. КЛАСС СКРЫТИЯ (max-width: 1439px) */
    .kgp-submenu__hidden {
        /* Эти стили остаются, так как они обеспечивают скрытие */
        top: auto !important; /* Убеждаемся, что top сброшен */
        max-height: 0;
        opacity: 0;
    }
    
    /* 2. КЛАСС ПОКАЗА (max-width: 1439px) */
    .kgp-submenu__show {
        /* Переопределяем позиционирование, которое было задано выше для >1440px */
        position: relative !important; /* Меняем на относительное */
        top: auto !important; /* Сбрасываем принудительный top */
        
        /*max-height: 999px;*/
        opacity: 1;
        pointer-events: auto;
        
        /* Z-index можно снизить или убрать, если он не нужен */
        /* z-index: auto !important; */
    }
}

.kgp-submenu-button .tn-atom__button-icon {
    transition: transform 0.3s ease; 
    /* transform: rotate(0deg); - это уже не нужно, если не задано в Tilda */
}

/* 3. ПОВОРОТ СТРЕЛКИ при АКТИВАЦИИ ТРИГГЕРА */
/* Нацеливаемся на стрелку внутри активной ссылки */
.kgp-submenu-button .is-trigger-active {
    background-color: #F3F3F3 !important;
}
.kgp-submenu-button .is-trigger-active .tn-atom__button-icon {
    transform: rotate(180deg) !important; /* Поворот на 180 градусов */
}