/*
============================================================
1. VARIABLES (CSS Custom Properties)
============================================================
*/
section {
    padding: var(--section-padding);
}

/* планшеты */
@media (min-width: 768px) {
    section {
        padding: var(--section-padding-tablet);
    }
}

/* ноутбуки и 1080p */
@media (min-width: 1200px) {
    section {
        padding: var(--section-padding-laptop);
    }
}

/* 4K */
@media (min-width: 2000px) {
    section {
        padding: var(--section-padding-4k);
    }
}
/* ВАЖНО: Весь блок переменных должен быть ТОЛЬКО в style.css */
/* Здесь оставлен только заголовок, как в вашем плане */


/*
============================================================
2. CSS RESET & GLOBAL STYLES
============================================================
*/
.ff-t-cell.ff-t-column-1 {
    display: none !important;
}
/*
--------------------------------------------------------------
2.1. ГЛОБАЛЬНЫЕ СТИЛИ (BODY, H, A)
--------------------------------------------------------------
*/
body {
    /* Основа, взятая из вашего нового блока */
    font-family: var(--font-sans);
    color: var(--color-text-light);
    background: var(--gradient-background);
    line-height: 1.6;
    margin: 0;
    min-height: 100vh;
}

#content.site-content {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 52% 30%, rgba(255, 91, 11, 0.11), transparent 24%),
        radial-gradient(ellipse at 18% 57%, rgba(0, 149, 182, 0.09), transparent 26%),
        radial-gradient(ellipse at 82% 76%, rgba(27, 41, 85, 0.42), transparent 30%),
        linear-gradient(180deg, #071127 0%, #081127 34%, #0a1530 62%, #071127 100%);
}

#content.site-content::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.018) 37%, transparent 64%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.018), transparent 22%, transparent 78%, rgba(255, 255, 255, 0.014));
    pointer-events: none;
    z-index: 0;
}

#content.site-content > * {
    position: relative;
    z-index: 1;
}

#content.site-content .hero-section {
    z-index: 2;
    border-bottom: 0;
}

h1, h2, h3, h4, h5, h6, .hero-title {
    /* Объединённые стили заголовков */
    font-family: var(--font-heading);
    color: var(--color-white); /* Используем цвет для Hero-секции (light) */
    font-weight: 700;
    line-height: 1.2;
}

p {
    /* Объединённые стили параграфов */
    color: var(--color-paragraph);
    margin-bottom: 1rem;
}

a {
    /* Объединённые стили ссылок */
    color: var(--color-accent);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--color-accent-teal-dark);
    text-decoration: none;
}

/*
--------------------------------------------------------------
2.2. КОНТЕЙНЕР
--------------------------------------------------------------
*/
.container {
    /* max-width: 1320px;   1280px */
    width: 100%; /* Используем 90% для центрирования */
    margin: 0 auto;
    padding-left: var(--spacing-sm);
    padding-right: var(--spacing-sm);
}

/*
--------------------------------------------------------------
2.3. УТИЛИТЫ
--------------------------------------------------------------
*/
.text-white { color: var(--color-white) !important; }
.text-primary { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-secondary) !important; }
.text-accent { color: var(--color-accent) !important; }
.text-muted { color: var(--color-paragraph) !important; }

.subtitle {
    font-family: var(--font-base);
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 0.5rem;
    color: var(--color-secondary);
}

/*
============================================================
3. BUTTONS (КНОПКИ)
============================================================

.btn {
    display: inline-block;
    padding: 12px 30px;
    border-radius: var(--border-radius-md);
    font-weight: 600;
    text-align: center;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-lg {
    font-size: 1.1rem;
    padding: 15px 35px;
}

.btn-primary {
    background-image: var(--gradient-accent);
    color: var(--color-white) !important;
    border-color: var(--color-accent-teal-light);
}
.btn-primary:hover {
    opacity: 0.9;
    box-shadow: 0 4px 15px rgba(0, 117, 153, 0.5);
}

.btn-outline-light {
    color: var(--color-white) !important;
    border-color: var(--color-white);
}

.btn-outline-light:hover {
    background-color: var(--color-white);
    color: var(--color-primary) !important;
    border-color: var(--color-white);
}

.btn-secondary-cta {
    border: 2px solid var(--color-accent);
    color: var(--color-accent) !important;
}
.btn-primary-cta {
    background-image: var(--gradient-accent);
    color: var(--color-white) !important;
}
*/

/* --- ОБЕРТКА (Внешний вид) --- */
.caligo-glass-btn {
    position: relative;
    width: 220px; /* Фиксированная ширина */
    height: 50px; /* Фиксированная высота */
    margin: 20px;
    display: inline-block;
    text-align: center;
}

/* --- ССЫЛКА (Основной вид кнопки) --- */
.caligo-glass-btn a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* Стиль стекломорфизма: прозрачный фон + размытие */
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(15px);

    box-shadow: 0 15px 15px rgba(0, 0, 0, 0.3);
    border-radius: 30px;
    padding: 0 10px;
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    color: var(--color-white); /* Светлый текст */
    font-weight: bold;
    font-size: 16px;
    z-index: 1;
    transition: 0.5s;
}
.caligo-glass-btn:hover a {
    letter-spacing: 1px;
}

/* --- АНИМАЦИЯ СВЕТОВОЙ ПОЛОСЫ (Glass Sweep Effect) --- */
.caligo-glass-btn a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    /* Используем градиент для "стеклянного" блика */
    background: linear-gradient(to left, rgba(255, 255, 255, 0.15), transparent);
    transform: skewX(45deg) translate(0);
    transition: 0.5s;
}
.caligo-glass-btn:hover a:before {
    /* Перемещает полосу на 200px при наведении */
    transform: skewX(45deg) translate(200px);
}

/* --- АНИМАЦИЯ ЗАПОЛНЕНИЯ ФОНА (Glass Fill Effect) --- */
.caligo-glass-btn a:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    transition: 0.5s;
    border-radius: 30px;
    z-index: -1;
    /* Цвет фона по умолчанию (будет переопределен) */
}
.caligo-glass-btn:hover a:after {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/* --- ЭФФЕКТ СВЕЧЕНИЯ (Верхний и Нижний псевдоэлементы) --- */
.caligo-glass-btn:before,
.caligo-glass-btn:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    width: 30px;
    height: 10px;
    border-radius: 10px;
    transition: 0.3s;
    transition-delay: 0s;
}
.caligo-glass-btn:before { bottom: -5px; } /* Нижний элемент */
.caligo-glass-btn:after { top: -5px; } /* Верхний элемент */

/* Анимация увеличения светящихся элементов */
.caligo-glass-btn:hover:before,
.caligo-glass-btn:hover:after {
    height: 50%;
    width: 90%;
    border-radius: 30px;
}
.caligo-glass-btn:hover:before { bottom: 0; }
.caligo-glass-btn:hover:after { top: 0; }


/* ====================================
   2. ЦВЕТОВЫЕ СХЕМЫ (Glass Button)
   ==================================== */

/* --- СХЕМА 1: ОРАНЖЕВЫЙ АКЦЕНТ (CTA) --- */
.caligo-glass-btn.btn-accent a:after,
.caligo-glass-btn.btn-accent:before,
.caligo-glass-btn.btn-accent:after {
    background: var(--color-orange-accent);
    /* Настраиваем тень на основе оранжевого акцента */
    box-shadow:
            0 0 5px var(--color-orange-accent),
            0 0 15px var(--color-orange-accent),
            0 0 30px var(--color-orange-accent),
            0 0 60px var(--color-orange-accent);
}

/* --- СХЕМА 2: БИРЮЗОВЫЙ АКЦЕНТ (Teal Light) --- */
.caligo-glass-btn.btn-teal a:after,
.caligo-glass-btn.btn-teal:before,
.caligo-glass-btn.btn-teal:after {
    background: var(--color-teal-light);
    /* Настраиваем тень на основе бирюзового акцента */
    box-shadow:
            0 0 5px var(--color-teal-light),
            0 0 15px var(--color-teal-light),
            0 0 30px var(--color-teal-light),
            0 0 60px var(--color-teal-light);
}

/* --- СХЕМА 3: ГЛУБОКИЙ ФИОЛЕТОВЫЙ (Deep Violet - для фона) --- */
.caligo-glass-btn.btn-deep a:after,
.caligo-glass-btn.btn-deep:before,
.caligo-glass-btn.btn-deep:after {
    background: var(--color-deep-violet);
    /* Приглушенная тень для более "мягкого" эффекта */
    box-shadow:
            0 0 5px var(--color-deep-violet),
            0 0 15px var(--color-deep-violet);
}




/* ====================================
   3. АДАПТАЦИЯ ДЛЯ КНОПОК ПЛАГИНА (Fluent Forms)
   Используем обертку для имитации Glass Button
   ==================================== */
/*

/*
============================================================
4. HEADER & NAVIGATION STYLES
============================================================
*/

/* 4.1. ГЛАВНЫЙ БЛОК ХЕДЕРА (Для мобильных и общих стилей) */
.header-main {
    padding: 20px 0 40px 0;
    position: relative; /* Базовое позиционирование для мобильных */
    z-index: 100;

    /* СТЕКЛО: Применяется на мобильных, если фон прозрачен */
    background-color: var(--glass-bg);
    border: var(--glass-border);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
    box-shadow: var(--shadow-light);
}

.header-wrapper {
    width: 100%;
    margin: 15px auto;
    padding-left: var(--spacing-sm);
    padding-right: var(--spacing-sm);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* ЛОГОТИП */
.site-branding .site-logo-image {
    max-height: 50px;
    width: auto;
    transition: all 0.3s ease;
}

/* 4.2. МЕНЮ */

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: var(--color-accent);
}

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 15px;
}

.main-navigation li {
    position: relative; /* для подменю */
}

.main-navigation li.dropdown::after {
    content: "";
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 28px;
}

.main-navigation li a {
    color: var(--color-text-light);
    padding: 10px 15px;
    font-weight: 600;
    transition: all 0.2s ease-in-out;
    display: block;
}
.nav-link:focus, .nav-link:hover {
    color: var(--color-accent);
}

/*

.main-navigation li a:hover,
.main-navigation li.current-menu-item a {
    color: var(--color-accent) !important;
}

 Скрываем переключатель меню на десктопе */
.menu-toggle {
    display: none;
}

/*
--------------------------------------------------------------
4.3. ВЫПАДАЮЩЕЕ МЕНЮ
--------------------------------------------------------------
*/

/* Основное подменю */
.main-navigation .dropdown-menu {
    display: block; /* управление через opacity/visibility */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    top: calc(100% + 24px);
    left: 0;
    margin-top: 0;
    padding: 8px;
    transition: opacity 0.16s ease, visibility 0.16s ease, transform 0.16s ease;
    transform: translateY(6px);

    border-radius: 12px;
    background-color: rgba(27, 41, 85, 0.96);
    border: var(--glass-border);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28);
    z-index: 200;
    min-width: 200px;
}

/* Показываем подменю, если hover на родителя или на самом подменю */
.main-navigation li.dropdown:hover::after,
.main-navigation li.dropdown:focus-within::after {
    display: block;
}

.main-navigation li.dropdown:hover > .dropdown-menu,
.main-navigation li.dropdown:focus-within > .dropdown-menu,
.main-navigation li.dropdown .dropdown-menu:hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

/* Ссылки подменю */
.main-navigation .dropdown-item {
    color: var(--color-text-light);
    padding: 10px 12px;
    border-radius: 8px;
    white-space: nowrap; /* чтобы текст не переносился */
    transition: color 0.12s ease, background-color 0.12s ease;
}

.main-navigation .dropdown-item:hover,
.main-navigation .dropdown-item:focus,
.main-navigation .dropdown-item.active,
.main-navigation .dropdown-item:active {
    color: var(--color-accent);
    background-color: rgba(255, 255, 255, 0.1);
}

/* Подменю второго уровня (если есть) */
.main-navigation .dropdown-submenu {
    position: relative;
}

.main-navigation .dropdown-submenu::after {
    content: "";
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 100%;
    width: 12px;
}

.main-navigation .dropdown-submenu > .dropdown-menu {
    top: -8px;
    left: calc(100% + 10px); /* открытие справа */
    margin-left: 0;
}

/* Плавное появление для подменю второго уровня */
.main-navigation .dropdown-submenu:hover::after,
.main-navigation .dropdown-submenu:focus-within::after {
    display: block;
}

.main-navigation .dropdown-submenu:hover > .dropdown-menu,
.main-navigation .dropdown-submenu:focus-within > .dropdown-menu,
.main-navigation .dropdown-submenu .dropdown-menu:hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

/* Адаптация для мобильных (если используем collapse Bootstrap) */
@media (max-width: 991px) {
    .main-navigation ul {
        flex-direction: column;
        gap: 0;
    }

    .main-navigation .dropdown-menu {
        position: static;
        margin-top: 0;
        padding: 0;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto;
        transform: none;
        box-shadow: none;
        background-color: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .main-navigation .dropdown-item {
        padding-left: 30px;
    }
}




/*
============================================================
5. HERO SECTION STYLES
============================================================
*/

/* 5.1. Главная секция HERO */
.hero-section {
    position: relative;
    overflow: hidden;
    min-height: 65vh; /* СТАНОВИТСЯ: 65vh (сокращение общей высоты) */
    display: flex;
    align-items: center;
    padding: 0;
}

/* 5.2. Задний план (Баннер/Видео) */
.hero-media-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* СТАНОВИТСЯ: 100% (видео должно занимать всю высоту секции) */
    z-index: 1;
}

#heroVideo {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    border-bottom: solid 1px #E0E0E0 ;
}

/* 5.3. Оверлей */
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
}

/* 5.4. Контент на переднем плане */
.hero-grid-content {
    position: relative;
    z-index: 3;
    width: 100%;
}

.hero-title {
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-white);
    margin-bottom: 30px;
}

.icon-list li i {
    color: var(--color-accent);
}

.hero-form .booking-form-wrapper {
    box-shadow: var(--shadow-strong); /* Используем сильную тень */
}


/*
============================================================
6. PAGE HEADER & CPT STYLES
============================================================
*/
.page-hero {
    min-height: 350px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}
.overlay {
    position: absolute;
    inset: 0;
    /*background: var(--gradient-background);  rgba(0, 43, 255, 0.4);  прозрачность 50% */
}
.page-hero {
    position: relative;
    overflow: hidden;
}

.page-hero .overlay {
    z-index: 1;
}

.page-hero .container {
    position: relative;
    z-index: 2;
}
.page-hero .page-title {
    position: relative;
    z-index: 2;
    font-size: 42px;
    font-weight: 700;
}

.page-content-wrapper {
    padding: 60px 0;
}

.sidebar-left,
.sidebar-right {
    padding: 20px;
    background: #fafafa;
    border-radius: 12px;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

.sidebar-left .widget,
.sidebar-right .widget {
    margin-bottom: 25px;
}

.page-content {
    /* background: #fff; */
     padding: 30px;
     border-radius: 12px;
     box-shadow: 0 0 15px rgba(0,0,0,0.05);
 }

 /*
 ============================================================
 7. FORM STYLING (FluentForm Compact)
 ============================================================
 */
.booking-form-wrapper {
    background-color: var(--color-white);
    border-radius: var(--border-radius-lg);
    padding: 20px !important;
    /* margin-top: 7%;  Оставлено для компенсации наезжания на Hero Title на мобильных */
}

/* Заголовок формы */
.booking-form-wrapper p.text-secondary {
    margin-bottom: 0.75rem !important;
    font-size: xx-large;
    font-weight: 700;
    text-transform: uppercase;
}

/* Отступы между группами полей FluentForm */
.fluentform .ff-el-group {
    margin-bottom: 0.7rem;
}

/* Поля ввода */
.fluentform .ff-el-form-control {
    font-size: 1rem;
}


/*
============================================================
8. FOOTER STYLES
============================================================
*/
footer {
    border-top: 1px solid var(--color-accent);
}
.footer-main {
    background-color: var(--color-primary);
    color: var(--color-text-light);
    padding: var(--spacing-md) 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: var(--spacing-md);
    margin-top: var(--spacing-md);

}

.footer-social-icons .social-icon {
    font-size: 1.2rem;
    margin-left: var(--spacing-sm);
    color: var(--color-text-light);
}

.footer-social-icons .social-icon:hover {
    color: var(--color-accent);
}


/*
============================================================
9. MEDIA QUERIES (Адаптивность)
============================================================
*/

/* 9.1. Tablet (max-width: 1024px) */
@media (max-width: 1024px) {
    .hero-title {
        font-size: 3rem;
    }
}

/* 9.2. Mobile (max-width: 768px) */
@media (max-width: 768px) {
    /* --- HEADER (Мобильные стили) --- */
    .header-main {
        position: relative; /* Или static */
        border-radius: 0;
        padding: 10px 0;
        margin-top: 0;
        max-width: 100%;
        width: 100%;
    }
    .header-wrapper {
        padding-left: var(--spacing-sm);
        padding-right: var(--spacing-sm);
    }
    .menu-toggle {
        display: block;
    }

    /* --- HERO SECTION (Мобильные стили) --- */
    .hero-title {
        font-size: 2.5rem;
    }
    .hero-section {
        margin-top: 0;
        min-height: auto;
        padding-top: var(--spacing-lg);
        padding-bottom: var(--spacing-lg);
    }
    .hero-grid-content {
        padding-top: 0;
        padding-bottom: 0;
    }
    .booking-form-wrapper {
        margin-top: 0; /* Убираем отступ на мобильных */
    }

    /* --- FOOTER (Мобильные стили) --- */
    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
    .footer-social-icons {
        margin-top: 10px;
    }
}

/* 9.3. ДЕСКТОП: Стили "плавающего" хедера (min-width: 992px) */
@media (min-width: 992px) {

    .main-navigation #menu-item-1273 > .dropdown-menu,
    .main-navigation #menu-item-1247 > .dropdown-menu {
        display: grid;
        grid-template-columns: repeat(2, minmax(190px, 1fr));
        gap: 2px 4px;
        right: auto;
        left: 0;
        min-width: 430px;
    }

    .main-navigation #menu-item-1273.dropdown::after,
    .main-navigation #menu-item-1247.dropdown::after {
        right: auto;
        width: 430px;
        height: 34px;
    }

    /* --- HEADER (Fixed/Sticky) --- */
    .header-main {
        max-width: 98%;
        width: 98%;
        padding: 0 21px;
        border-radius: var(--border-radius-lg);
        margin-top: 15px;
        left: 50%;
        transform: translateX(-50%);

        /* КЛЮЧЕВЫЕ ИСПРАВЛЕНИЯ */
        position: relative; /* Используем fixed для плавающего эффекта */
        top: 0;
        z-index: 10001; /* !!! Выше, чем WordPress Admin Bar (10000) !!! */
    }
    .header-wrapper {
        padding-left: 0;
        padding-right: 0;
    }

    /* --- HERO SECTION (Компенсация фиксированного хедера) --- */
    .hero-section {
        /* FIX: Отрицательный отступ для поднятия секции выше шапки */
        margin-top: -120px;
        border-bottom: 1px solid var(--color-accent);
    }
    .hero-grid-content {
        /* FIX: Увеличиваем padding, чтобы контент Hero начинался под шапкой. */
        padding-top: 150px; /* Уменьшаем на 20px */
        padding-bottom: var(--spacing-md); /* ЗНАЧИТЕЛЬНО СОКРАЩАЕМ нижний отступ */
    }

    /* --- ФОРМА (Делаем форму уже) --- */
    .hero-form .booking-form-wrapper {
        max-width: 400px;
        margin-left: auto;
        margin-right: 0;
        margin-top: 18%;
    }

    /* --- ВЫПАДАЮЩЕЕ МЕНЮ (Bootstrap Fix) --- */
    .main-navigation .dropdown:hover > .dropdown-menu {
        display: block;
    }
    .main-navigation .dropdown-menu {
        position: absolute;
        top: calc(100% + 24px);
        left: 0;
        z-index: 1000;
        min-width: 10rem;
    }

    .main-navigation #menu-item-1273 > .dropdown-menu,
    .main-navigation #menu-item-1247 > .dropdown-menu {
        right: auto;
        left: 0;
        min-width: 430px;
    }
}

/*
============================================================
10. WORDPRESS ADMIN BAR FIX
============================================================
*/

/* Исправление, чтобы фиксированный Header не наезжал на Admin Bar */
body.admin-bar .header-main {
    /*  top: 32px; Стандартная высота Admin Bar на десктопе */
}

@media screen and (max-width: 782px) {
    body.admin-bar .header-main {
        top: 46px; /* Высота Admin Bar на мобильных */
    }
}

/*
============================================================
10.1. HOME HERO HEADER OVERLAY
============================================================
*/

body.home .header-main {
    position: absolute;
    left: 50%;
    top: auto;
    width: calc(100% - 40px);
    max-width: 98%;
    margin-top: 15px;
    transform: translateX(-50%);
    z-index: 10001;
    background-color: rgba(255, 255, 255, 0.08);
    border: var(--glass-border);
    border-radius: var(--border-radius-lg);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

body.home .hero-section {
    margin-top: 0;
    border-bottom: 0;
}

body.home .hero-section::before,
body.home .hero-section::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--color-accent);
    z-index: 4;
    pointer-events: none;
}

body.home .hero-section::before {
    top: 0;
}

body.home .hero-section::after {
    bottom: 0;
}

body.home .top-banner + .header-main + main .hero-section::before {
    display: none;
}

@media (min-width: 992px) {
    body.home .hero-grid-content {
        padding-top: 150px;
    }
}

@media (max-width: 768px) {
    body.home .header-main {
        width: calc(100% - 24px);
        max-width: calc(100% - 24px);
        padding: 10px 0;
    }

    body.home .header-container {
        gap: 14px;
    }

    body.home .site-branding .site-logo-image {
        max-width: min(58vw, 240px);
        height: auto;
    }

    body.home .header-cta-group {
        display: none !important;
    }

    body.home .menu-toggle {
        display: flex;
        flex-direction: column;
        gap: 5px;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        margin-left: auto;
        border: 1px solid rgba(255, 255, 255, 0.22);
        border-radius: var(--border-radius-md);
        background: rgba(255, 255, 255, 0.08);
    }

    body.home .menu-toggle .icon-bar {
        display: block;
        width: 23px;
        height: 2px;
        border-radius: 999px;
        background: var(--color-white);
    }

    body.home .hero-section {
        padding-top: 0;
    }

    body.home .hero-grid-content {
        padding-top: 125px;
    }
}



/*
============================================================
1. FLUENTFORM VARIABLES (Based on Caligo theme)
============================================================
*/
:root {
    /* FluentForm переменные, привязанные к вашей теме */
    --fluentform-primary: var(--color-accent-teal-light)!important; /* Цвет при фокусе поля */
    --fluentform-secondary: var(--color-text-dark)!important; /* Цвет текста в поле */
    --fluentform-danger: #f56c6c!important;
    --fluentform-border-color: #dadbdd!important;
    --fluentform-border-radius: var(--border-radius-md)!important;
    --fluentform-input-select-height: 40px!important; /* Уменьшенная высота полей ввода */
}

/*
============================================================
2. FORM WRAPPER STYLING (Glassmorphism & Structure)
============================================================
*/

/* Применяем эффект стекла и сильную тень к основной обертке формы */
.booking-form-wrapper {
    /* Основной фон обертки формы */
    background-color: var(--glass-bg) !important;
    border: var(--glass-border);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
    box-shadow: var(--shadow-strong);

    border-radius: var(--border-radius-lg) !important;
    padding: 20px !important;

}

/* Стили для заголовка формы "Your Free Estimate" (должен быть светлым) */
.booking-form-wrapper p.text-secondary {
    color: var(--color-white) !important; /* Делаем заголовок белым/светлым */
    margin-bottom: 0.75rem !important;
    line-height: 1.2;
    font-size: xx-large;
    font-weight: 700;
    text-transform: uppercase;
}
.booking-form-wrapper p.text-secondary .text-accent {
    color: var(--color-accent) !important; /* Оранжевый акцент остается */
}

/* Отступы между группами полей FluentForm */
.fluentform .ff-el-group {
    margin-bottom: 0.7rem;
}

/*
============================================================
3. COLOR SPLIT BLOCKS (Moving From / Moving To)
============================================================
*/

/* 3.1. БЛОК "Moving from" (Оранжевый акцент) */
.fluentform .ff-name-address-wrapper[data-name="Moving_from"] {
    background-color: rgba(255, 91, 11, 0.3); /* Прозрачный оранжевый фон */
    border-left: 5px solid var(--color-accent); /* Оранжевая полоса слева */
    padding: 15px;
    border-radius: var(--border-radius-md);
    margin-bottom: 15px;
}

/* 3.2. БЛОК "Moving to" (Фиолетовый акцент) */
.fluentform .ff-name-address-wrapper[data-name="Moving_to"] {
    background-color: rgba(27, 41, 85, 0.3); /* Прозрачный фиолетовый фон */
    border-left: 5px solid var(--color-secondary); /* Фиолетовая полоса слева */
    padding: 15px;
    border-radius: var(--border-radius-md);
    margin-bottom: 15px;
}

/*
============================================================
4. INPUTS, LABELS & BUTTONS (Global Styles)
============================================================
*/

/* --- ШРИФТЫ --- */
.ff-default,
.ff-default .ff-el-input--label label,
.ff-default .ff_btn_style {
    font-family: var(--font-heading) !important; /* Используем шрифт заголовков для всех элементов формы */
    color: var(--color-white); /* Светлый текст по умолчанию */
}

/* --- INPUT FIELDS (Низкая высота) --- */
.ff-default .ff-el-form-control {
    /* Уменьшаем padding и высоту для компактности */
    padding: 0px 12px!important;
    height: var(--fluentform-input-select-height)!important;
    line-height: var(--fluentform-input-select-height)!important;

    /* Делаем поля полупрозрачными для эффекта стекла */
    background-color: rgba(255, 255, 255, 0.1)!important;
    border: 1px solid rgba(255, 255, 255, 0.3)!important;
    color: var(--color-white)!important; /* Цвет текста в инпутах - белый */

    border-radius: var(--fluentform-border-radius)!important;
    max-width: 100%!important;
}

.ff-default .ff-el-form-control:focus {
    /* При фокусе делаем фон полностью прозрачным, чтобы был виден только фон обертки */
    background-color: transparent;
    border-color: var(--fluentform-primary);
    color: var(--color-white);
    outline: none
}

/* --- BUTTONS (Растягиваем на всю ширину) --- */
.ff-btn, .ff-btn-next, .ff-btn-secondary, .ff-default .ff-btn-submit.ff_btn_style,
.ff-default .ff-btn-primary:not(.ff_btn_no_style) {
        position: relative;
        width: 100%;
        height: 50px;
        margin: 20px 0;
        display: inline-block;
        text-align: center;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;

        /* Стиль стекломорфизма: прозрачный фон + размытие */
        background: rgba(255, 255, 255, 0.05);
        backdrop-filter: blur(15px);
        box-shadow: 0 10px 7px rgba(0, 0, 0, 0.3);
        border-radius: 30px!important;
        border: 0px;
        padding: 0 10px;
        letter-spacing: 1px;
        text-decoration: none;
        text-transform: uppercase;
        color: var(--color-white); /* Светлый текст */
        font-weight: bold;
        font-size: 16px!important;;
        z-index: 1;
        transition: 0.5s;
}

.ff-btn-next.btn-accent a:after,
.ff-btn-glow.btn-accent a:after,
.ff-btn-next.btn-accent:before,
.ff-btn-glow.btn-accent:before,
.ff-btn-glow.btn-accent:after,
.ff-btn-next.btn-accent:after {
    background: var(--color-orange-accent);
    box-shadow:
            0 0 5px var(--color-orange-accent),
            0 0 15px var(--color-orange-accent),
            0 0 30px var(--color-orange-accent),
            0 0 60px var(--color-orange-accent);
}
.ff-btn.btn-accent:before,
.ff-btn.btn-accent:after {
    background: var(--color-orange-accent);
}

.ff-btn-next:before {
    bottom: -5px;
}
.ff-btn-next:before, .ff-btn-next:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    width: 30px;
    height: 10px;
    border-radius: 10px;
    transition: 0.3s;
    transition-delay: 0s;
    z-index: -1;
}

.ff-btn-next:hover:before {
    bottom: 5px;
}
.ff-btn-next:hover:after {
    top: 5px;
}

.ff-btn-next:hover:before, .ff-btn-next:hover:after {
    height: 50%;
    width: 90%;
    border-radius: 30px;
    background: var(--color-orange-accent);
}



/* Скрывает кнопку "Назад" в многошаговых формах Fluent Forms */
.ff-btn-prev {
    display: none !important;
}
/*
============================================================
5. ПРОЧИЕ СТИЛИ FLUENTFORM (Из предоставленного списка)
============================================================
*/

/*
============================================================
6. SELECT STYLING (Выпадающий список)
============================================================
*/

/* 6.1. Стиль самого элемента SELECT */
select.ff-el-form-control {
    /* Наследуем базовые стили из .ff-el-form-control:
       --fluentform-input-select-height, border-radius, color и т.д.
       ---
       Переопределяем системные свойства для единообразия: */

    /* Убираем стандартную стрелку/иконку браузера */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* Добавляем небольшую стрелку или иконку (опционально) */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px 16px;
    padding-right: 30px !important; /* Отступ справа, чтобы не перекрывать стрелку */

    /* Убеждаемся, что фон соответствует стеклянному стилю инпутов */
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--color-white);
}

/* 6.2. Стиль при фокусе */
select.ff-el-form-control:focus {
    /* Стили фокуса уже настроены в .ff-el-form-control:focus */
    background-color: transparent;
    border-color: var(--fluentform-primary);
}

/* 6.3. Стиль для опций в выпадающем списке (<option>) */
select.ff-el-form-control option {
    /* Фон опций должен быть непрозрачным, чтобы текст был читаемым при открытии списка.
       Используем цвет фона вашего тела или формы. */
    background: var(--color-primary);
    color: var(--color-white);
    padding: 5px; /* Небольшой вертикальный отступ */
}

/* Скрываем стрелку в Internet Explorer (требуется отдельный блок) */
select::-ms-expand {
    display: none;
}

/*
============================================================
6.4. HERO BOOKING FORM GLASS LAYOUT
============================================================
*/

.booking-form-wrapper {
    position: relative;
    overflow: hidden;
    color: var(--color-white);
    background: rgba(5, 18, 40, 0.82) !important;
    border: 1px solid rgba(37, 135, 255, 0.24) !important;
    border-radius: 20px !important;
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.32) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.booking-form-wrapper > p.text-secondary {
    margin-bottom: clamp(18px, 3vw, 30px) !important;
    color: var(--color-white) !important;
    font-size: clamp(2rem, 4.1vw, 4rem);
    line-height: 1.05;
    letter-spacing: 0;
}

.booking-form-wrapper .caligo-form-shell--hero {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--color-white) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.booking-form-wrapper .caligo-form-shell--hero > .caligo-form-heading {
    display: block !important;
}

.booking-form-wrapper:has(> p.text-secondary) .caligo-form-shell--hero > .caligo-form-heading,
.booking-form-wrapper .caligo-step-indicator,
.booking-form-wrapper .caligo-step-actions {
    display: none !important;
}

.booking-form-wrapper .caligo-form-heading h2 {
    margin: 0 0 clamp(18px, 3vw, 30px) !important;
    color: var(--color-white) !important;
    font-size: clamp(2rem, 4.1vw, 4rem) !important;
    line-height: 1.05 !important;
    letter-spacing: 0;
}

.booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step,
.booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step.is-active {
    display: block !important;
    animation: none !important;
}

body.home .hero-form .booking-form-wrapper .caligo-step-indicator,
body.home .hero-form .booking-form-wrapper .caligo-step-actions {
    display: flex !important;
}

body.home .hero-form .booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step {
    display: none !important;
}

body.home .hero-form .booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step.is-active {
    display: block !important;
}

.booking-form-wrapper .caligo-form {
    display: grid;
    gap: clamp(18px, 2.4vw, 26px);
}

.booking-form-wrapper .caligo-form-step {
    margin: 0 !important;
    padding: clamp(20px, 2.9vw, 34px) !important;
    border: 0 !important;
    border-left: 10px solid var(--color-accent) !important;
    border-radius: 14px !important;
    background: rgba(255, 91, 11, 0.24) !important;
    box-shadow: none !important;
}

.booking-form-wrapper .caligo-form-step[data-step="1"],
.booking-form-wrapper .caligo-form-step[data-step="2"] {
    min-height: 220px;
}

.booking-form-wrapper .caligo-form-step[data-step="2"] {
    border-left-color: var(--color-secondary) !important;
    background: rgba(27, 41, 85, 0.36) !important;
}

.booking-form-wrapper .caligo-form-step[data-step="3"],
.booking-form-wrapper .caligo-form-step[data-step="4"] {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.booking-form-wrapper .caligo-form-step legend {
    float: none;
    width: auto;
    margin: 0 0 16px;
    padding: 0 !important;
    color: var(--color-white) !important;
    font-size: clamp(1.25rem, 2.2vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
}

.booking-form-wrapper .caligo-form-step legend + .caligo-form-grid {
    clear: both;
}

.booking-form-wrapper .caligo-form-step[data-step="1"] .caligo-form-field > span,
.booking-form-wrapper .caligo-form-step[data-step="2"] .caligo-form-field > span {
    display: none;
}

.booking-form-wrapper .caligo-form-grid {
    gap: clamp(14px, 2vw, 24px) !important;
}

.booking-form-wrapper .caligo-form-field {
    gap: 8px;
    color: var(--color-white) !important;
}

.booking-form-wrapper .caligo-form-field > span {
    color: var(--color-white) !important;
    font-size: clamp(1rem, 1.4vw, 1.25rem) !important;
    font-weight: 700;
}

.booking-form-wrapper .caligo-form input,
.booking-form-wrapper .caligo-form select,
.booking-form-wrapper .caligo-form textarea {
    min-height: 58px;
    border: 2px solid rgba(255, 255, 255, 0.28) !important;
    border-radius: 12px !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--color-white) !important;
    font-size: clamp(1rem, 1.5vw, 1.35rem);
    font-weight: 600;
}

.booking-form-wrapper .caligo-form input::placeholder,
.booking-form-wrapper .caligo-form textarea::placeholder {
    color: rgba(202, 210, 218, 0.78) !important;
}

.booking-form-wrapper .caligo-form textarea {
    min-height: 150px;
    padding-top: 18px !important;
    line-height: 1.4 !important;
    resize: vertical;
}

.booking-form-wrapper .caligo-consent {
    align-items: center;
    gap: 10px;
    font-size: 0.92rem;
}

.booking-form-wrapper .caligo-button {
    width: 100%;
    min-height: 68px;
    margin-top: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    background: rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.34), 0 0 30px rgba(255, 91, 11, 0.65) !important;
    font-size: clamp(1rem, 1.6vw, 1.3rem);
}

.hero-form .booking-form-wrapper > p.text-secondary {
    font-size: clamp(1.7rem, 2.4vw, 2.8rem);
}

body:not(.home) .page-hero--booking-form {
    min-height: 620px;
}

body:not(.home) .page-content-wrapper.has-booking-form {
    position: relative;
    z-index: 5;
    margin-top: -315px;
    margin-bottom: 70px;
}

body:not(.home) .page-content-wrapper.has-booking-form .row {
    justify-content: center;
}

body:not(.home) .page-content-wrapper.has-booking-form main {
    max-width: 900px;
}

body:not(.home) .page-content-wrapper.has-booking-form .page-content {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body:not(.home) .page-content-wrapper.has-booking-form .booking-form-wrapper {
    max-width: 860px;
    margin: 0 auto;
    padding: clamp(28px, 4vw, 48px) !important;
}

/*
============================================================
6.5. TWO-STEP HERO FORM COMPACT LAYOUT
============================================================
*/

.booking-form-wrapper {
    width: min(100%, 420px);
    padding: 20px !important;
}

@media (min-width: 992px) {
    .hero-form .booking-form-wrapper {
        min-height: 590px;
    }
}

.booking-form-wrapper > p.text-secondary,
.booking-form-wrapper .caligo-form-heading h2,
.hero-form .booking-form-wrapper > p.text-secondary {
    margin-bottom: 14px !important;
    font-size: clamp(1.55rem, 2.1vw, 2rem) !important;
    line-height: 1.05 !important;
}

.booking-form-wrapper .caligo-step-indicator {
    display: flex !important;
    gap: 8px;
    margin: 0 0 12px !important;
}

.booking-form-wrapper .caligo-step-indicator span {
    width: 22px;
    height: 22px;
    font-size: 0.72rem;
}

.booking-form-wrapper .caligo-form {
    gap: 14px;
}

.booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step {
    display: none !important;
}

.booking-form-wrapper .caligo-form-shell.is-stepped .caligo-form-step.is-active {
    display: block !important;
}

.booking-form-wrapper .caligo-form-shell.is-stepped:not(.is-final-step) .caligo-button {
    display: none !important;
}

.booking-form-wrapper .caligo-form-shell.is-stepped.is-final-step .caligo-button {
    display: flex !important;
}

.booking-form-wrapper .caligo-form-step {
    min-height: 420px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.booking-form-wrapper .caligo-form-step--contact {
    border: 0 !important;
    background: transparent !important;
    min-height: 316px !important;
}

.booking-form-wrapper .caligo-form-step--contact[data-step="2"] {
    border: 0 !important;
    background: transparent !important;
}

.booking-form-wrapper .caligo-form-panel {
    margin: 0 0 12px;
    padding: 14px 14px 14px 18px;
    border-left: 7px solid var(--color-accent);
    border-radius: 8px;
    background: rgba(255, 91, 11, 0.24);
}

.booking-form-wrapper .caligo-form-panel--to {
    border-left-color: var(--color-secondary);
    background: rgba(27, 41, 85, 0.36);
}

.booking-form-wrapper .caligo-form-panel--meta {
    margin-bottom: 14px;
    padding: 0;
    border: 0;
    background: transparent;
}

.booking-form-wrapper .caligo-form-panel h3,
.booking-form-wrapper .caligo-form-step legend {
    margin: 0 0 10px;
    color: var(--color-white) !important;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.2;
}

.booking-form-wrapper .caligo-form-step--move > legend {
    display: none;
}

.booking-form-wrapper .caligo-form-panel .caligo-form-field > span {
    display: none;
}

.booking-form-wrapper .caligo-form-panel--meta .caligo-form-field > span,
.booking-form-wrapper .caligo-form-step--contact .caligo-form-field > span {
    display: block !important;
    font-size: 0.82rem !important;
    line-height: 1.15;
}

.booking-form-wrapper .caligo-form-grid {
    gap: 10px 12px !important;
}

.booking-form-wrapper .caligo-form input,
.booking-form-wrapper .caligo-form select,
.booking-form-wrapper .caligo-form textarea {
    min-height: 42px;
    padding: 8px 10px !important;
    border-width: 1px !important;
    border-radius: 7px !important;
    font-size: 0.9rem;
    line-height: 1.2 !important;
}

.booking-form-wrapper .caligo-form textarea {
    min-height: 78px;
    padding-top: 10px !important;
}

.booking-form-wrapper .caligo-step-actions {
    display: none !important;
    justify-content: flex-end;
    margin-top: 12px;
}

.booking-form-wrapper .caligo-form-step.is-active .caligo-step-actions {
    display: flex !important;
}

.booking-form-wrapper .caligo-step-button,
.booking-form-wrapper .caligo-button {
    min-height: 48px !important;
    height: 48px;
    border-radius: 999px !important;
    font-size: 0.88rem !important;
    letter-spacing: 0.04em !important;
}

.booking-form-wrapper .caligo-step-button--next {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.18);
    color: var(--color-white);
    text-transform: uppercase;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.26), 0 0 24px rgba(255, 91, 11, 0.55);
}

.booking-form-wrapper .caligo-step-button--back {
    min-height: 34px !important;
    height: 34px;
    padding: 6px 14px;
    font-size: 0.78rem !important;
}

.booking-form-wrapper .caligo-consent {
    align-items: flex-start;
    flex-direction: row;
    font-size: 0.78rem;
    line-height: 1.35;
}

.booking-form-wrapper .caligo-consent input {
    flex: 0 0 auto;
    width: 14px !important;
    height: 14px !important;
    min-height: 0 !important;
    margin-top: 2px;
    padding: 0 !important;
}

body:not(.home) .page-hero--booking-form {
    min-height: 580px;
}

body:not(.home) .page-content-wrapper.has-booking-form {
    margin-top: -285px;
}

body:not(.home) .page-content-wrapper.has-booking-form .booking-form-wrapper {
    max-width: 720px;
    width: min(100%, 720px);
    padding: 24px !important;
}

@media (max-width: 768px) {
    .booking-form-wrapper .caligo-form-grid {
        grid-template-columns: 1fr !important;
    }

    .booking-form-wrapper .caligo-form-step[data-step="1"],
    .booking-form-wrapper .caligo-form-step[data-step="2"] {
        min-height: 0;
    }

    body:not(.home) .page-content-wrapper.has-booking-form {
        margin-top: -260px;
    }
}


/*
============================================================
7. WHY US / ADVANTAGES SECTION STYLING
============================================================
*/
.big-arrow-wrapper {
    position: relative;
    overflow: visible;
    margin-top: -1px;
    margin-bottom: -1px;
    background: transparent;
    border: 0;
}

.big-arrow-wrapper::before {
    content: "";
    position: absolute;
    inset: -28% 0;
    background:
        radial-gradient(ellipse at 54% 50%, rgba(255, 91, 11, 0.08), transparent 48%),
        linear-gradient(180deg, transparent 0%, rgba(11, 23, 49, 0.7) 47%, transparent 100%);
    pointer-events: none;
    z-index: 0;
}

.big-arrow-wrapper > * {
    position: relative;
    z-index: 2;
}

/* --- ОСНОВНАЯ СЕКЦИЯ --- */
.caligo-advantages-section {
    /* Фоновый цвет для секции (например, глубокий синий или фиолетовый) */
    /* background-color: var(--gradient-background);
    padding: var(--spacing-md) 0;  СТАНОВИТСЯ: var(--spacing-md) 0 (Снижаем вертикальный padding) */
}

/* --- ЗАГОЛОВКИ --- */
.caligo-advantages-section .section-header {
    text-align: center;
    margin-bottom: var(--spacing-md);
    padding: 0 var(--spacing-sm);
}
.caligo-advantages-section h2 {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: 2.5rem; /* H2 на десктопе */
    margin-bottom: 0.5rem;
}
/* Оранжевый акцент на ключевом слове */
.caligo-advantages-section h2 span {
    color: var(--color-accent); /* Ярко-оранжевый акцент */
}

.caligo-advantages-section .subtitle {
    color: var(--color-text-on-dark);
    font-size: 1.15rem;
    max-width: 700px;
    margin: 0 auto;
}

/* --- КАРТОЧКА ПРЕИМУЩЕСТВА (ITEM) --- */
.advantage-card-grid {
    display: grid;
    gap: var(--spacing-md);
    grid-template-columns: 1fr; /* По умолчанию: 1 колонка на мобильных */
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-sm);
}

.advantage-card {
    text-align: center;
    padding: var(--spacing-md) var(--spacing-sm);
    /* Легкий эффект стекла или просто прозрачный фон, чтобы был виден фон секции */
    background-color: rgba(255, 255, 255, 0.05);
    border-radius: var(--border-radius-lg);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.advantage-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-strong);
}

.advantage-card .icon-wrapper {
    margin: 0 auto 1.5rem;
    width: 60px;
    height: 60px;
}
.advantage-card .icon-wrapper svg {
    /* Применяем цвет бирюзового акцента к иконкам */
    fill: var(--color-accent-teal-light);
    width: 100%;
    height: 100%;
}

.advantage-card h3 {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: 1.5rem;
    margin-bottom: 0.75rem;
}

.advantage-card p {
    color: var(--color-paragraph);
    font-size: 1rem;
}

/* --- АДАПТИВНОСТЬ (Desktop/Tablet) --- */
@media (min-width: 768px) {
    .advantage-card-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 колонки на планшетах */
    }
}
@media (min-width: 1024px) {
    .caligo-advantages-section h2 {
        font-size: 3.5rem; /* Более крупный H2 на десктопе */
    }
    .advantage-card-grid {
        grid-template-columns: repeat(4, 1fr); /* 4 колонки на больших экранах */
    }
}





/* --- СТИЛЬ B: ГОРИЗОНТАЛЬНЫЙ СПИСОК --- */
.horizontal-list-grid {
    display: grid;
    gap: 30px;
    grid-template-columns: 1fr;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-sm);
}

.list-item {
    display: flex; /* Используем Flexbox для выравнивания */
    align-items: flex-start; /* Выравнивание сверху */
    text-align: left; /* Текст слева, а не по центру */
    padding: 20px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.horizontal-list-grid .list-item:last-child {
    border-bottom: none; /* Убираем черту у последнего элемента */
}

.list-item .number-circle {
    /* Создаем крупный, акцентный кружок с цифрой */
    min-width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--color-accent); /* Ваш оранжевый акцент */
    color: var(--color-white);
    font-size: 1.5rem;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 20px;
}

.list-item h3 {
    margin-top: 0;
    margin-bottom: 5px;
}

/* Адаптивность для десктопа (2 колонки) */
@media (min-width: 768px) {
    .horizontal-list-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    /* Убираем черты у элементов, кроме тех, что в первой колонке */
    .list-item:nth-child(2n) {
        border-bottom: none;
    }
}



/* --- СТИЛЬ C: КАРТОЧКИ С ВЕРТИКАЛЬНЫМ АКЦЕНТОМ --- */
.vertical-accent-grid {
    display: grid;
    gap: var(--spacing-md);
    grid-template-columns: repeat(2, 1fr); /* 2 колонки на мобильных */
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-sm);
}

.accent-card {
    text-align: left; /* Текст слева */
    padding: 30px 20px 30px 40px; /* Отступ слева для акцентной линии */
    position: relative;
    overflow: hidden;

    background-color: rgba(255, 255, 255, 0.08); /* Чуть более светлый фон карточки */
    border-radius: var(--border-radius-lg);
    transition: background-color 0.3s ease;
}

.accent-card:hover {
    background-color: rgba(255, 255, 255, 0.15); /* Подсвечиваем при наведении */
}

/* Вертикальная акцентная линия */
.accent-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 8px; /* Ширина линии */
    height: 100%;
    background-color: var(--color-accent); /* Оранжевый цвет */
    border-radius: var(--border-radius-lg) 0 0 var(--border-radius-lg);
}

.accent-card .icon-wrapper {
    /* Иконка меньше и выровнена по левому краю */
    width: 50px;
    height: 50px;
    margin-bottom: 1rem;
}

.accent-card .icon-wrapper img {
    width: 100%;
    height: 100%;

    /* ФИЛЬТР: Превращает черный (#000) цвет в белый (#FFF) */
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);

    /* Если вам нужен оранжевый акцент (var(--color-accent)), фильтр будет более сложным и менее точным.
       Для акцентного цвета лучше всего подходит Вариант 2 (Инлайн-SVG). */
}

.accent-card h3 {
    font-size: 1.3rem; /* Чуть меньше заголовок */
    margin-bottom: 0.5rem;
}

/* Адаптивность для десктопа */
@media (min-width: 1024px) {
    .vertical-accent-grid {
        grid-template-columns: repeat(4, 1fr); /* 4 колонки на десктопе */
    }
}





/*
============================================================
8. SERVICES SECTION
============================================================
Core Services styles are isolated in assets/css/core-services.css.
*/




/* ====================================
   СТИЛИ ФУТЕРА (ОБЩИЕ)
   ==================================== */
.site-footer {
    background-color: var(--color-dark-blue);
    padding: 60px 0 20px;
    color: var(--color-text-light);
    position: relative;
    z-index: 10;
}

/* --- SVG Background Implementation --- */
.site-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: var(--color-dark-blue); /* Основной цвет, если SVG не загрузится */

    /* * ВАЖНО:
    * Используем функцию WordPress get_template_directory_uri()
    * для динамического формирования пути к файлам темы.
    * Однако, поскольку это чистый CSS, мы должны использовать
    * относительный путь или абсолютный, если он жестко зашит.
    * * Если этот CSS находится в отдельном файле (style.css),
    * путь будет относительно расположения style.css.
    * Обычно это: url('../images/svg/footer-bg.svg')
    * * В данном случае, я предполагаю, что файл SVG находится
    * внутри папки темы по пути ТЕМА/images/svg/footer-bg.svg
    */
    background-image: url('../../images/svg/footer-bg.svg');

    background-repeat: no-repeat; /* Или no-repeat, в зависимости от дизайна SVG */
    background-size: 100% auto;

    /* Добавляем позиционирование, чтобы фон был внизу */
    background-position: bottom center;    opacity: 0.25; /* Рекомендуется для приглушения фонового паттерна */
}


/* ====================================
   3. ГЛАВНЫЕ КОЛОНКИ
   ==================================== */
.footer-columns {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 40px;
}

.footer-col {
    flex: 1; /* Распределяем поровну, 4 колонки */
}

/* Устанавливаем ширину для колонки логотипа (опционально, можно оставить flex: 1) */
.footer-col.logo-col {
    flex-basis: 25%;
}

.footer-col.menu-col {
    flex-basis: 0%;
}

/* Заголовки меню */
.footer-title {
    font-size: 18px;
    color: var(--color-teal-light);
    margin-top: 0;
    margin-bottom: 15px;
    font-weight: bold;
}

/* Списки меню (для wp_nav_menu) */
.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin-bottom: 8px;
}

.footer-col ul li a {
    color: var(--color-text-light);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-col ul li a:hover {
    color: var(--color-teal-light);
}
.logo-wrapper, .logo-subtext-widget {
    margin-bottom: 32px;
}
/* ====================================
   4. СТИЛИ ЛОГОТИПА
   ==================================== */
.logo-col {
    text-align: left; /* Логотип расположен справа */
}

.logo-col .custom-logo-link img {
    max-height: 60px; /* Настройте размер логотипа */
    width: auto;
}

/* Текст CAL DOT MC */
.logo-subtext {
    color: var(--color-text-subtle);
    font-size: 13px;
    line-height: 1.3;
    margin-top: 10px;
    font-style: italic;
}

/* ====================================
   5. РАЗДЕЛИТЕЛЬ И НИЖНИЙ КОЛОНТИТУЛ
   ==================================== */
.footer-separator {
    border: none;
    border-top: 1px solid var(--color-deep-violet);
    margin: 0; /* Убираем стандартные отступы */
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0px;
}

.copyright {
    color: var(--color-text-subtle);
    font-size: 13px;
    margin: 0;
}

/* Горизонтальное юридическое меню */
.footer-legal-menu {
    /* Убираем контейнер, если wp_nav_menu его добавляет */
}

.legal-menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 15px; /* Промежуток между элементами */
}

.legal-menu-list li {
    display: inline;
    position: relative;
    font-size: 14px;
}

.legal-menu-list li a {
    color: var(--color-text-light);
    text-decoration: none;
    padding-right: 15px; /* Место для разделителя */
    transition: color 0.3s ease;
}

.legal-menu-list li a:hover {
    color: var(--color-teal-light);
}

/* Разделитель "|" между элементами */
.legal-menu-list li:not(:last-child) a::after {
    content: "|";
    position: absolute;
    right: 0;
    color: var(--color-deep-violet);
}

/* ====================================
   6. АДАПТИВНОСТЬ (Mobile)
   ==================================== */
@media (max-width: 768px) {
    .footer-columns {
        flex-direction: column;
        gap: 20px;
    }

    .footer-col {
        flex-basis: auto; /* Позволяет колонкам занимать всю ширину */
    }

    .logo-col {
        text-align: left; /* Переносим логотип влево на мобильных */
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }

    .copyright {
        order: 2; /* Копирайт внизу */
    }

    .footer-legal-menu {
        order: 1; /* Меню сверху */
    }

}

/*
====================================
AREA CARDS (ЗОНЫ ОБСЛУЖИВАНИЯ)
====================================
*/



/* 1. Сетка */
.area-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.area-card .caligo-glass-btn {
    margin-top: auto;
    align-self: center;
    margin-bottom: 10px; /* отступ от нижнего края карточки */
}

/* 2. Карточка */
.area-card {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(12px);
    background: linear-gradient(135deg,
    rgba(30, 60, 114, 0.35),
    rgba(42, 82, 152, 0.15)
    );
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}



/* Подсветка градиента при наведении */
.area-card-accent::before,
.area-card-teal::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: 0;
}

.area-card-accent::before {
    background: linear-gradient(135deg,
    rgba(255, 91, 11, 0.6),
    rgb(12, 22, 48)
    );
}

.area-card-teal::before {
    background: linear-gradient(135deg,
    rgb(12, 22, 48),
    rgba(65, 156, 236, 0.35)
    );
}

.area-card-accent:hover::before,
.area-card-teal:hover::before {
    opacity: 1;
}

/* Контент поверх градиента */
.area-card h3,
.area-card p,
.area-card a {
    position: relative;
    z-index: 1;
}

/* Заголовок */
.area-card h3 {
    font-size: 1.5rem;
    color: var(--color-white, #fff);
    margin-bottom: 10px;
    font-weight: 700;
}

/* Текст */
.area-card p {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 20px;
}



/*
============================================================
15. VIDEO SECTION
============================================================
*/
.custom-video-section.video-section {
    position: relative;
    isolation: isolate;
    overflow: visible;
    display: block;
    padding-top: clamp(76px, 9vw, 132px);
    padding-bottom: clamp(78px, 9vw, 126px);
    background: transparent;
    border: 0;
}

.custom-video-section.video-section::before {
    content: "";
    position: absolute;
    inset: -12% 0 -20%;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(255, 91, 11, 0.1), transparent 36%),
        radial-gradient(ellipse at 88% 36%, rgba(0, 149, 182, 0.08), transparent 30%),
        linear-gradient(90deg, rgba(7, 17, 39, 0.7), rgba(10, 18, 39, 0.36) 52%, rgba(7, 17, 39, 0.72));
    pointer-events: none;
    z-index: -1;
}

.custom-video-section.video-section::after {
    content: "";
    position: absolute;
    left: 28%;
    right: 22%;
    bottom: -72px;
    height: 180px;
    background: linear-gradient(90deg, transparent, rgba(255, 91, 11, 0.14), rgba(0, 149, 182, 0.1), transparent);
    filter: blur(48px);
    pointer-events: none;
    z-index: -1;
}

.video-section .container {
    max-width: 1430px;
}

.video-showcase {
    display: grid;
    grid-template-columns: minmax(0, 0.86fr) minmax(420px, 1.14fr);
    gap: clamp(36px, 7vw, 96px);
    align-items: center;
}

.video-copy {
    max-width: 600px;
}

.video-eyebrow {
    margin: 0 0 24px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    line-height: 1.2;
    text-transform: uppercase;
}

.video-copy h2 {
    margin: 0 0 44px;
    color: #fff;
    font-size: clamp(3rem, 4vw, 4.35rem);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.08;
}

.video-description {
    max-width: 610px;
    margin: 0 0 28px;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.06rem;
    font-weight: 500;
    line-height: 1.1;
}

.video-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 12px;
    margin: 0;
}

.video-points span {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 7px 15px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.video-section .video-cta {
    width: 246px;
    height: 56px;
    margin: 34px 0 0 12px;
}

.video-section .video-cta a {
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.09);
    box-shadow: 0 18px 32px rgba(0, 0, 0, 0.32);
    font-size: 0.95rem;
    line-height: 1;
}

.video-shell {
    position: relative;
    padding: 14px;
    border: 1px solid rgba(80, 128, 160, 0.34);
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(255, 91, 11, 0.24), rgba(0, 117, 153, 0.13) 44%, rgba(255, 255, 255, 0.06));
    box-shadow: 0 38px 92px rgba(0, 0, 0, 0.45);
}

.video-shell::before {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -24px;
    height: 58px;
    border-radius: 50%;
    background: rgba(255, 91, 11, 0.28);
    filter: blur(30px);
    pointer-events: none;
    z-index: -1;
}

.video-frame {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    background: #000;
}

.video-frame video {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    border-radius: 20px;
    cursor: pointer;
    object-fit: cover;
    filter: brightness(0.72) saturate(0.95);
}

.video-play {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 98px;
    height: 98px;
    border: 0;
    border-radius: 50%;
    background: var(--color-orange-accent);
    color: #fff;
    cursor: pointer;
    font-size: 2.15rem;
    transform: translate(-50%, -50%);
    transition: transform 0.24s ease, opacity 0.24s ease, box-shadow 0.24s ease;
    box-shadow: 0 0 0 14px rgba(255, 91, 11, 0.18), 0 0 42px rgba(255, 91, 11, 0.85);
    z-index: 2;
}

.video-play i {
    margin-left: 5px;
}

.video-play:hover,
.video-play:focus {
    transform: translate(-50%, -50%) scale(1.06);
    box-shadow: 0 0 0 16px rgba(255, 91, 11, 0.2), 0 0 54px rgba(255, 91, 11, 1);
}

.video-shell.is-playing .video-play {
    opacity: 0;
    pointer-events: none;
}

@media (max-width: 1050px) {
    .video-showcase {
        grid-template-columns: 1fr;
    }

    .video-copy {
        max-width: 760px;
    }
}

@media (max-width: 640px) {
    .custom-video-section.video-section {
        padding-top: 64px;
        padding-bottom: 76px;
    }

    .video-copy h2 {
        margin-bottom: 28px;
        font-size: clamp(2.55rem, 12vw, 3.7rem);
    }

    .video-description {
        font-size: 1rem;
        line-height: 1.35;
    }

    .video-points span {
        white-space: normal;
    }

    .video-section .video-cta {
        width: min(260px, 100%);
        margin-left: 0;
    }

    .video-shell {
        padding: 8px;
        border-radius: 22px;
    }

    .video-frame {
        border-radius: 16px;
    }

    .video-frame video {
        border-radius: 14px;
    }

    .video-play {
        width: 68px;
        height: 68px;
        font-size: 1.5rem;
    }
}




/*
============================================================
16. Хлебные крошки (breadcrumbs)
============================================================
*/
.page-hero {
    min-height: 400px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.page-hero .overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.page-hero .container {
    position: relative;
    z-index: 2;
    height: 100%;
}

.page-hero .page-title {
    color: #fff;
    font-size: 42px;
    font-weight: 700;
    margin: 0;
    z-index: 2;
}

/* Крошки визуально у нижнего края hero */
.page-hero .breadcrumbs-wrapper {
    position: absolute;
    right: 25%;
    bottom: 18px;
    transform: translateY(50%);
    font-size: 14px;
    text-align: right;
    padding: 8px 16px;
    border-radius: 8px 8px 0 0;
    z-index: 3;

    background-color: var(--glass-bg);
    border: var(--glass-border);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
    box-shadow: var(--shadow-light);
}

.breadcrumb {
list-style: none;
margin: 0;
padding-inline-start: 0;
}

.breadcrumb a {
color: #fff;
text-decoration: none;
}

.breadcrumb a:hover {
text-decoration: underline;
}

.breadcrumb-item.active {
    color: var(--color-accent);
    font-weight: 700;
}

.breadcrumb-item+.breadcrumb-item::before {
float: left;
padding-right: var(--bs-breadcrumb-item-padding-x);
color: var(--color-text-on-dark);
content: var(--bs-breadcrumb-divider, "/");
}

@media (max-width: 768px) {
.page-hero .breadcrumbs-wrapper {
   right: 10%;
   bottom: 10px;
   font-size: 12px;
   padding: 6px 12px;
}
}

.caligo-stats-section {
    position: relative;
    padding: clamp(58px, 6.5vw, 92px) 0;
    color: #fff;
    overflow: hidden;
    background: linear-gradient(180deg, transparent 0%, rgba(12, 22, 48, 0.28) 48%, transparent 100%);
}

.caligo-stats-section::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: clamp(190px, 19vw, 266px);
    transform: translateY(-50%);
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    border-bottom: 1px solid rgba(255, 255, 255, 0.075);
    background: linear-gradient(90deg, rgba(255, 91, 11, 0.075) 0%, rgba(255, 255, 255, 0.03) 36%, rgba(0, 149, 182, 0.035) 100%);
    pointer-events: none;
    z-index: 0;
}

.caligo-stats-section::after {
    content: "";
    position: absolute;
    left: max(24px, calc((100vw - 1320px) / 2));
    top: 50%;
    width: 4px;
    height: clamp(116px, 11vw, 160px);
    transform: translateY(-50%);
    border-radius: 999px;
    background: var(--color-orange-accent);
    box-shadow: 0 0 24px rgba(255, 91, 11, 0.42);
    pointer-events: none;
    z-index: 0;
}

.container-1320 {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.stats-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(220px, 0.32fr) minmax(0, 0.68fr);
    align-items: center;
    gap: clamp(26px, 4.5vw, 72px);
    width: min(calc(100% - clamp(44px, 8vw, 120px)), 1320px);
    max-width: 1320px;
    padding: clamp(24px, 3.4vw, 44px) 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    z-index: 1;
}

.stats-inner::before {
    content: none;
}

.stats-inner::after {
    content: none;
}

.stats-inner > * {
    position: relative;
    z-index: 1;
}

.stats-header {
    position: relative;
    display: block;
    width: min(100%, 310px);
    min-height: 0;
    margin: 0;
    padding: 0 0 0 clamp(22px, 2.2vw, 34px);
    clip-path: none;
    background: transparent;
    text-align: left;
    color: #fff;
    box-shadow: none;
    z-index: 2;
}

.stats-header::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    bottom: 4px;
    width: 3px;
    border-radius: 999px;
    background: var(--color-orange-accent);
    box-shadow: 0 0 18px rgba(255, 91, 11, 0.48);
}

.stats-header::after {
    content: none;
}

.stats-subtitle {
    margin: 0 0 10px;
    color: rgba(255, 255, 255, 0.7);
    font-family: var(--font-base);
    font-size: clamp(0.76rem, 0.78vw, 0.86rem);
    font-weight: 900;
    letter-spacing: 3px;
    line-height: 1.15;
    text-transform: uppercase;
}

.stats-header h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem, 2.65vw, 3.35rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.02;
}

.stats-header h2 span {
    display: inline;
    color: var(--color-orange-accent);
}

.stats-right {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(132px, 1fr));
    gap: 0;
    align-items: center;
    width: 100%;
    min-height: clamp(150px, 14vw, 188px);
    margin: 0;
    padding: 0 0 0 clamp(12px, 2vw, 28px);
    border: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
    background: transparent;
    box-shadow: none;
    overflow: visible;
    counter-reset: statNumber;
}

.stats-right::before {
    content: none;
}

.stat-item {
    position: relative;
    display: flex;
    min-height: clamp(142px, 13vw, 178px);
    padding: clamp(26px, 2.7vw, 38px) clamp(16px, 2.1vw, 30px);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    color: #fff;
    isolation: isolate;
    counter-increment: statNumber;
    transition: none;
}

.stat-item::before {
    content: "0" counter(statNumber);
    position: absolute;
    top: 13px;
    left: clamp(16px, 2.1vw, 30px);
    color: rgba(255, 91, 11, 0.72);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 1.8px;
    line-height: 1;
}

.stat-item:not(:first-child) {
    border-left: 1px solid rgba(255, 255, 255, 0.105);
}

.stat-item::after {
    content: attr(data-stat);
    position: absolute;
    right: 6px;
    bottom: -0.16em;
    z-index: -1;
    color: rgba(255, 255, 255, 0.045);
    font-size: clamp(3.2rem, 5vw, 5.9rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
}

.stat-item:hover {
    transform: none;
    border-top-color: transparent;
}

.stat-item:hover::after {
    color: rgba(255, 255, 255, 0.06);
}

.stat-icon {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    margin: 0 0 18px;
    border: 1px solid rgba(255, 91, 11, 0.24);
    border-radius: 8px;
    background: rgba(255, 91, 11, 0.09);
    color: #fff;
    font-size: 14px;
    box-shadow: none;
}

.stat-number {
    margin-bottom: 8px;
    color: #fff;
    font-size: clamp(2.1rem, 3vw, 3.25rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

.stat-label {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.25;
    opacity: 1;
}

.big-arrow-wrapper + .process-section.caligo-advantages-section {
    padding-top: clamp(66px, 7vw, 96px);
    background:
        radial-gradient(ellipse at 50% 0%, rgba(0, 149, 182, 0.07), transparent 34%),
        linear-gradient(180deg, rgba(10, 21, 45, 0.42) 0%, rgba(8, 17, 39, 0.08) 34%, transparent 100%);
}

.big-arrow-wrapper + .process-section.caligo-advantages-section .section-header {
    margin-top: 0;
}

/* ===============================
   ADAPTIVE
================================ */
@media (max-width: 991px) {
    .caligo-stats-section::after {
        left: 24px;
        height: 112px;
    }

    .stats-inner {
        grid-template-columns: 1fr;
        display: grid;
        gap: 28px;
        text-align: left;
        padding: 30px 0;
    }

    .stats-inner::after {
        content: none;
    }

    .stats-header {
        display: block;
        justify-self: stretch;
        width: min(100%, 420px);
        min-height: 0;
        padding-left: 22px;
        text-align: left;
    }

    .stats-header h2 span {
        display: inline;
    }

    .stats-right {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        min-height: 0;
        padding: 0;
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
        width: 100%;
    }

    .stat-item {
        text-align: center;
    }

    .stat-item::before {
        left: 50%;
        transform: translateX(-50%);
    }

    .stat-icon {
        margin-left: auto;
        margin-right: auto;
    }

    .stat-item:nth-child(odd) {
        border-left: 0;
    }
}

@media (max-width: 620px) {
    .caligo-stats-section {
        min-height: 0;
        padding: 58px 0 64px;
    }

    .caligo-stats-section::before {
        height: calc(100% - 44px);
    }

    .caligo-stats-section::after {
        top: 82px;
        transform: none;
        height: 82px;
    }

    .stats-inner {
        width: calc(100% - 40px);
        padding: 26px 0;
    }

    .stats-subtitle {
        margin-bottom: 10px;
        font-size: 0.82rem;
        letter-spacing: 2.5px;
    }

    .stats-header h2 {
        font-size: clamp(2rem, 10vw, 2.7rem);
        line-height: 1;
    }

    .stats-right {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 12px 0 0;
    }

    .stat-item {
        min-height: 0;
        padding: 28px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .stat-item:not(:first-child) {
        border-left: 0;
    }

    .stat-item:first-child {
        border-top: 0;
    }

}




/* Fades уже есть у тебя */


/*
============================================================
CALIGO REVIEWS BLOCK
============================================================
*/

.caligo-reviews,
.caligo-reviews *,
.caligo-reviews *::before,
.caligo-reviews *::after {
    box-sizing: border-box;
}

.caligo-reviews {
    --caligo-reviews-accent: #ff5b0b;
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 80px 24px 90px;
    background:
        radial-gradient(circle at 5% 10%, rgba(255, 91, 11, 0.10), transparent 30%),
        radial-gradient(circle at 95% 90%, rgba(17, 86, 255, 0.14), transparent 34%),
        linear-gradient(135deg, #020c20 0%, #031833 52%, #04132c 100%);
    color: #fff;
    isolation: isolate;
}

.caligo-reviews::before,
.caligo-reviews::after {
    content: "";
    position: absolute;
    z-index: 1;
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: contain;
}

.caligo-reviews::before {
    top: -32px;
    left: -82px;
    width: 560px;
    height: 250px;
    opacity: 0.86;
    background-image: url("data:image/svg+xml,%3Csvg width='560' height='250' viewBox='0 0 560 250' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23ff6518' stroke-linecap='round'%3E%3Cpath d='M-30 150C92 115 152 34 332 -14' stroke-width='4' opacity='.95'/%3E%3Cpath d='M-42 188C110 142 190 82 410 8' stroke-width='2.5' opacity='.56'/%3E%3Cpath d='M-26 213C130 158 236 104 548 28' stroke-width='1.6' opacity='.28'/%3E%3Cpath d='M-20 126C66 99 126 53 210 4' stroke-width='8' opacity='.18'/%3E%3C/g%3E%3C/svg%3E");
}

.caligo-reviews::after {
    right: -92px;
    bottom: -36px;
    width: 650px;
    height: 270px;
    opacity: 0.82;
    background-image: url("data:image/svg+xml,%3Csvg width='650' height='270' viewBox='0 0 650 270' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%231156ff' stroke-linecap='round'%3E%3Cpath d='M38 254C228 214 365 150 682 36' stroke-width='5' opacity='.88'/%3E%3Cpath d='M80 272C258 238 418 184 674 92' stroke-width='2.6' opacity='.52'/%3E%3Cpath d='M-4 232C190 210 360 128 622 -20' stroke-width='1.6' opacity='.32'/%3E%3Cpath d='M210 274C365 224 485 168 650 106' stroke-width='8' opacity='.13'/%3E%3C/g%3E%3C/svg%3E");
}

.caligo-reviews__container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;
}

.caligo-reviews__header {
    text-align: center;
}

.caligo-reviews__title {
    margin: 0;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 4.75rem;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0;
    text-align: center;
}

.caligo-reviews__title span,
.caligo-live-homepage .section-header .heading-g span,
.caligo-live-homepage .section-header .heading-g .caligo-services__title-accent {
    color: var(--caligo-reviews-accent);
}

.caligo-reviews__subtitle {
    max-width: 760px;
    margin: 22px auto 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1.55rem;
    line-height: 1.4;
    text-align: center;
}

.caligo-reviews__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
    align-items: stretch;
    min-width: 0;
    margin-top: 52px;
}

.caligo-review-card {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 500px;
    height: 100%;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    padding: 30px 38px 34px;
    background: linear-gradient(155deg, rgba(13, 42, 84, 0.94), rgba(3, 21, 49, 0.96));
    border: 1px solid rgba(65, 127, 255, 0.72);
    border-radius: 30px;
    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.caligo-review-card:hover {
    transform: translateY(-5px);
    border-color: rgba(71, 145, 255, 1);
    box-shadow:
        0 24px 50px rgba(0, 0, 0, 0.34),
        0 0 24px rgba(255, 91, 11, 0.10);
}

.caligo-review-card__quote {
    position: absolute;
    top: 20px;
    left: 26px;
    z-index: 0;
    color: rgba(35, 91, 190, 0.24);
    font-family: Georgia, serif;
    font-size: 7rem;
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
}

.caligo-review-card__avatar-wrapper {
    position: relative;
    z-index: 2;
    display: grid;
    width: 118px;
    height: 118px;
    flex: 0 0 118px;
    place-items: center;
    overflow: hidden;
    border: 2px solid var(--caligo-reviews-accent);
    border-radius: 50%;
    background: linear-gradient(145deg, #17345e, #091a37);
    box-shadow:
        0 0 0 5px rgba(255, 91, 11, 0.08),
        0 8px 24px rgba(0, 0, 0, 0.32);
}

.caligo-review-card__avatar {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.25s ease;
}

.caligo-review-card:hover .caligo-review-card__avatar {
    transform: scale(1.03);
}

.caligo-review-card__avatar-initials {
    color: #fff;
    font-size: 2.375rem;
    font-weight: 800;
    line-height: 1;
}

.caligo-review-card__rating {
    display: flex;
    gap: 5px;
    justify-content: center;
    min-width: 0;
    margin-top: 22px;
    color: #ff5b0b;
    line-height: 1;
    white-space: nowrap;
}

.caligo-review-card__star {
    display: block;
    width: 38px;
    height: 38px;
}

.caligo-review-card__star-empty {
    fill: rgba(255, 255, 255, 0.16);
}

.caligo-review-card__star-fill {
    fill: currentColor;
}

.caligo-review-card__text {
    width: 100%;
    max-width: 100%;
    margin: 26px 0 0;
    color: rgba(255, 255, 255, 0.93);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.38rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1.55;
    text-align: center;
    overflow-wrap: anywhere;
    word-break: normal;
}

.caligo-review-card__divider {
    width: 46%;
    height: 2px;
    margin: auto auto 24px;
    background: linear-gradient(90deg, transparent, var(--caligo-reviews-accent), transparent);
}

.caligo-review-card__footer {
    --caligo-review-footer-gap: clamp(12px, 0.86vw, 16px);
    --caligo-review-footer-font-size: clamp(0.95rem, 0.9vw, 1.18rem);
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: var(--caligo-review-footer-gap);
    flex-wrap: nowrap;
    padding: 10px 0 0;
    font-size: var(--caligo-review-footer-font-size);
    font-weight: 700;
    line-height: 1.12;
}

.caligo-review-card__author,
.caligo-review-card__source,
.caligo-review-card__source span {
    color: #fff !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-style: normal !important;
    font-weight: inherit !important;
    letter-spacing: 0 !important;
    line-height: inherit !important;
    text-transform: none !important;
}

.caligo-review-card__author {
    min-width: max-content;
    max-width: none;
    flex: 0 0 auto;
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: keep-all;
}

.caligo-review-card__separator {
    flex: 0 0 1px;
    width: 1px;
    height: 32px;
    background: rgba(255, 255, 255, 0.28);
}

.caligo-review-card__source {
    display: inline-flex;
    min-width: max-content;
    max-width: 100%;
    flex: 0 0 auto;
    align-items: center;
    gap: clamp(6px, 0.52vw, 9px);
    text-decoration: none;
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: keep-all;
}

.caligo-review-card__source:hover {
    color: #fff;
}

.caligo-review-card__source img {
    display: block;
    width: clamp(24px, 1.75vw, 34px);
    max-width: 135px;
    height: clamp(24px, 1.75vw, 34px);
    flex: 0 0 auto;
    object-fit: contain;
}

.caligo-reviews__actions {
    display: flex;
    justify-content: center;
    margin-top: 46px;
}

.caligo-reviews__button {
    display: inline-flex;
    min-width: 390px;
    min-height: 82px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 20px 38px;
    color: #fff;
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    background: rgba(3, 20, 47, 0.92);
    border: 2px solid var(--caligo-reviews-accent);
    border-radius: 22px;
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.28),
        0 0 20px rgba(255, 91, 11, 0.14);
    transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}

.caligo-reviews__button:hover {
    color: #fff;
    background: var(--caligo-reviews-accent);
    box-shadow:
        0 12px 34px rgba(0, 0, 0, 0.3),
        0 0 28px rgba(255, 91, 11, 0.32);
    transform: translateY(-2px);
}

.caligo-reviews__button-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    fill: none;
    stroke: var(--caligo-reviews-accent);
    stroke-width: 1.9;
    stroke-linejoin: round;
    transition: stroke 0.25s ease;
}

.caligo-reviews__button:hover .caligo-reviews__button-icon {
    stroke: #fff;
}

.caligo-review-card a:focus-visible,
.caligo-reviews__button:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 4px;
}

@media (max-width: 1199px) {
    .caligo-reviews__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 32px;
    }

    .caligo-reviews__grid > .caligo-review-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        justify-self: center;
        width: min(100%, 520px);
    }
}

@media (max-width: 991px) {
    .caligo-reviews {
        padding: 72px 22px 82px;
    }

    .caligo-reviews__title {
        font-size: 3.7rem;
    }

    .caligo-reviews__subtitle {
        font-size: 1.3rem;
    }

    .caligo-review-card__text {
        font-size: 1.25rem;
    }
}

@media (max-width: 767px) {
    .caligo-reviews {
        padding: 62px 18px 72px;
    }

    .caligo-reviews::before {
        width: 420px;
        height: 190px;
        opacity: 0.58;
    }

    .caligo-reviews::after {
        width: 430px;
        height: 190px;
        opacity: 0.55;
    }

    .caligo-reviews__title {
        font-size: 3rem;
    }

    .caligo-reviews__subtitle {
        margin-top: 16px;
        font-size: 1.12rem;
    }

    .caligo-reviews__grid {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 40px;
    }

    .caligo-reviews__grid > .caligo-review-card:last-child:nth-child(odd) {
        grid-column: auto;
        width: min(100%, 520px);
    }

    .caligo-review-card {
        max-width: 520px;
        min-height: 0;
        margin-inline: auto;
        padding: 28px 24px 30px;
        border-radius: 24px;
    }

    .caligo-review-card__avatar-wrapper {
        width: 104px;
        height: 104px;
        flex-basis: 104px;
    }

    .caligo-review-card__rating {
        gap: 3px;
    }

    .caligo-review-card__star {
        width: 31px;
        height: 31px;
    }

    .caligo-review-card__text {
        font-size: 1.12rem;
        line-height: 1.55;
    }

    .caligo-review-card__footer {
        --caligo-review-footer-font-size: 1rem;
    }

    .caligo-reviews__button {
        width: min(100%, 390px);
        min-width: 0;
        min-height: 70px;
        padding: 18px 22px;
        font-size: 1.1rem;
        border-radius: 18px;
    }

    .caligo-reviews__button-icon {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
    }
}

@media (max-width: 430px) {
    .caligo-reviews {
        padding-inline: 16px;
    }

    .caligo-reviews__title {
        font-size: 2.55rem;
    }

    .caligo-review-card {
        padding-inline: 20px;
    }

    .caligo-review-card__footer {
        gap: 8px;
    }
}

/* Overrides for caligomovers-core generic .caligo-reviews/.caligo-review-card styles. */
#content.site-content .caligo-reviews {
    display: block;
    grid-template-columns: none;
    gap: 0;
    width: 100%;
    padding: 86px 24px 92px;
    overflow: hidden;
    background:
        radial-gradient(circle at 5% 10%, rgba(255, 91, 11, 0.10), transparent 30%),
        radial-gradient(circle at 95% 90%, rgba(17, 86, 255, 0.14), transparent 34%),
        linear-gradient(135deg, #020c20 0%, #031833 52%, #04132c 100%);
}

#content.site-content .caligo-reviews__container {
    width: 100%;
    max-width: 1480px;
    margin-inline: auto;
    padding: 0;
}

#content.site-content .caligo-reviews__header {
    display: block;
    width: 100%;
    text-align: center;
}

#content.site-content .caligo-reviews__title {
    margin: 0;
    color: #fff;
    font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(48px, 4vw, 70px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 8px 22px rgba(0, 0, 0, 0.26);
    text-transform: none;
}

#content.site-content .caligo-reviews__subtitle {
    max-width: 760px;
    margin: 22px auto 0;
    color: rgba(255, 255, 255, 0.72);
    text-align: center;
}

#content.site-content .caligo-reviews--no-header {
    padding-top: 70px;
}

#content.site-content .caligo-reviews--no-actions {
    padding-bottom: 70px;
}

#content.site-content .caligo-reviews--no-header .caligo-reviews__rotator,
#content.site-content .caligo-reviews--no-header .caligo-reviews-layout {
    margin-top: 0;
}

#content.site-content .caligo-reviews__rotator {
    position: relative;
    width: 100%;
    margin-top: 52px;
    overflow: visible;
}

#content.site-content .caligo-reviews__viewport {
    width: 100%;
    overflow: hidden;
    margin: -12px 0 -30px;
    padding: 12px 0 30px;
    cursor: grab;
    touch-action: pan-y;
    user-select: none;
}

#content.site-content .caligo-reviews__rotator.is-dragging .caligo-reviews__viewport {
    cursor: grabbing;
}

#content.site-content .caligo-reviews__grid {
    display: flex;
    grid-template-columns: none;
    gap: 40px;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    margin-top: 0;
    padding: 0;
    will-change: transform;
    transition: transform 0.58s ease;
}

#content.site-content .caligo-reviews .caligo-review-card {
    position: relative;
    display: flex;
    flex: 0 0 calc((100% - 80px) / 3);
    min-width: 0;
    height: 560px;
    min-height: 560px;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    padding: 30px 38px 34px;
    color: #fff;
    text-align: center;
    background: linear-gradient(155deg, rgba(13, 42, 84, 0.94), rgba(3, 21, 49, 0.96));
    border: 1px solid rgba(65, 127, 255, 0.72);
    border-radius: 30px;
    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#content.site-content .caligo-reviews .caligo-review-card__text {
    width: 100%;
    max-width: 100%;
    margin: 26px 0 0;
    color: rgba(255, 255, 255, 0.93);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.38rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1.55;
    text-align: center;
    overflow-wrap: anywhere;
    display: -webkit-box;
    min-height: calc(1.55em * 5);
    max-height: calc(1.55em * 5);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    line-clamp: 5;
}

#content.site-content .caligo-reviews .caligo-review-card__footer {
    --caligo-review-footer-gap: clamp(12px, 0.86vw, 16px);
    --caligo-review-footer-font-size: clamp(0.95rem, 0.9vw, 1.18rem);
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: var(--caligo-review-footer-gap);
    flex-wrap: nowrap;
    margin: 18px 0 0;
    padding: 10px 0 0;
    color: #fff;
    font-size: var(--caligo-review-footer-font-size);
    font-weight: 700;
    line-height: 1.12;
}

#content.site-content .caligo-reviews .caligo-review-card__author,
#content.site-content .caligo-reviews .caligo-review-card__source,
#content.site-content .caligo-reviews .caligo-review-card__source span {
    color: #fff !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-style: normal !important;
    font-weight: inherit !important;
    letter-spacing: 0 !important;
    line-height: inherit !important;
    text-transform: none !important;
}

#content.site-content .caligo-reviews .caligo-review-card__author {
    min-width: max-content;
    max-width: none;
    flex: 0 0 auto;
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: keep-all;
}

#content.site-content .caligo-reviews .caligo-review-card__separator {
    flex: 0 0 1px;
}

#content.site-content .caligo-reviews .caligo-review-card__source {
    min-width: max-content;
    max-width: 100%;
    flex: 0 0 auto;
    gap: clamp(6px, 0.52vw, 9px);
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: keep-all;
}

#content.site-content .caligo-reviews .caligo-review-card__source img {
    width: clamp(24px, 1.75vw, 34px);
    height: clamp(24px, 1.75vw, 34px);
    flex: 0 0 auto;
}

#content.site-content .caligo-reviews .caligo-review-card__source:hover,
#content.site-content .caligo-reviews .caligo-review-card__source:hover span {
    color: #fff;
}

#content.site-content .caligo-reviews .caligo-review-card__divider {
    width: 46%;
    height: 2px;
    margin: auto auto 38px;
    background: linear-gradient(90deg, transparent, var(--caligo-reviews-accent), transparent);
}

#content.site-content .caligo-reviews__nav {
    position: absolute;
    top: 50%;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    padding: 0;
    color: #fff;
    background: rgba(3, 20, 47, 0.88);
    border: 2px solid var(--caligo-reviews-accent);
    border-radius: 50%;
    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.34),
        0 0 22px rgba(255, 91, 11, 0.16);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

#content.site-content .caligo-reviews__nav:hover {
    background: var(--caligo-reviews-accent);
    box-shadow:
        0 16px 38px rgba(0, 0, 0, 0.38),
        0 0 28px rgba(255, 91, 11, 0.3);
    transform: translateY(-50%) scale(1.04);
}

#content.site-content .caligo-reviews__nav:disabled {
    opacity: 0.36;
    cursor: default;
    transform: translateY(-50%);
}

#content.site-content .caligo-reviews__nav svg {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#content.site-content .caligo-reviews__nav--prev {
    left: -27px;
}

#content.site-content .caligo-reviews__nav--next {
    right: -27px;
}

#content.site-content .caligo-reviews.caligo-reviews--embed,
.caligo-reviews.caligo-reviews--embed {
    padding: 0 !important;
    overflow: visible;
    background: transparent !important;
    isolation: auto;
}

#content.site-content .caligo-reviews.caligo-reviews--embed::before,
#content.site-content .caligo-reviews.caligo-reviews--embed::after,
.caligo-reviews.caligo-reviews--embed::before,
.caligo-reviews.caligo-reviews--embed::after {
    display: none !important;
    content: none !important;
}

#content.site-content .caligo-reviews.caligo-reviews--embed .caligo-reviews__container,
.caligo-reviews.caligo-reviews--embed .caligo-reviews__container {
    max-width: 100%;
    padding: 0;
}

#content.site-content .caligo-reviews.caligo-reviews--embed .caligo-reviews__rotator,
#content.site-content .caligo-reviews.caligo-reviews--embed .caligo-reviews-layout,
.caligo-reviews.caligo-reviews--embed .caligo-reviews__rotator,
.caligo-reviews.caligo-reviews--embed .caligo-reviews-layout {
    margin-top: 0 !important;
}

#content.site-content .caligo-reviews--hide-controls .caligo-reviews__nav,
.caligo-reviews--hide-controls .caligo-reviews__nav {
    display: none !important;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews__viewport,
.caligo-reviews--display-grid .caligo-reviews__viewport {
    overflow: visible;
    margin: 0;
    padding: 0;
    cursor: auto;
    touch-action: auto;
    user-select: auto;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews__grid,
.caligo-reviews--display-grid .caligo-reviews__grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 40px;
    max-width: 1480px;
    margin-inline: auto;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card,
.caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card {
    flex: none !important;
    width: auto;
    max-width: none;
    height: 560px;
    min-height: 560px;
    margin: 0;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews-layout-03__viewport,
.caligo-reviews--display-grid .caligo-reviews-layout-03__viewport {
    overflow: visible;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews-layout-03__track,
.caligo-reviews--display-grid .caligo-reviews-layout-03__track {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    transform: none !important;
    transition: none !important;
}

#content.site-content .caligo-reviews--display-grid .caligo-reviews-layout-03__card,
.caligo-reviews--display-grid .caligo-reviews-layout-03__card {
    flex: none;
}

@media (max-width: 1199px) {
    #content.site-content .caligo-reviews__grid {
        gap: 32px;
    }

    #content.site-content .caligo-reviews__grid > .caligo-review-card {
        flex-basis: calc((100% - 32px) / 2);
        height: 550px;
        min-height: 550px;
    }

    #content.site-content .caligo-reviews__grid > .caligo-review-card:last-child:nth-child(odd) {
        grid-column: auto;
        justify-self: auto;
        width: auto;
    }

    #content.site-content .caligo-reviews--display-grid .caligo-reviews__grid,
    .caligo-reviews--display-grid .caligo-reviews__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 32px;
    }

    #content.site-content .caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card,
    .caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card {
        height: 550px;
        min-height: 550px;
    }
}

@media (max-width: 767px) {
    #content.site-content .caligo-reviews {
        padding: 62px 18px 72px;
    }

    #content.site-content .caligo-reviews__title {
        font-size: 38px;
    }

    #content.site-content .caligo-reviews__grid {
        gap: 24px;
        margin-top: 0;
    }

    #content.site-content .caligo-reviews__rotator {
        margin-top: 40px;
    }

    #content.site-content .caligo-reviews .caligo-review-card {
        flex-basis: 100%;
        max-width: 520px;
        height: 535px;
        min-height: 535px;
        margin-inline: auto;
        padding: 28px 24px 30px;
    }

    #content.site-content .caligo-reviews .caligo-review-card__text {
        font-size: 1.12rem;
        min-height: calc(1.55em * 6);
        max-height: calc(1.55em * 6);
        -webkit-line-clamp: 6;
        line-clamp: 6;
    }

    #content.site-content .caligo-reviews--display-grid .caligo-reviews__grid,
    .caligo-reviews--display-grid .caligo-reviews__grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 24px;
    }

    #content.site-content .caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card,
    .caligo-reviews--display-grid .caligo-reviews__grid > .caligo-review-card {
        width: 100%;
        max-width: 520px;
        height: 535px;
        min-height: 535px;
        margin-inline: auto;
    }

    #content.site-content .caligo-reviews__nav {
        width: 46px;
        height: 46px;
    }

    #content.site-content .caligo-reviews__nav--prev {
        left: -10px;
    }

    #content.site-content .caligo-reviews__nav--next {
        right: -10px;
    }
}