/* Стили для Hero Section */
.hero-video-section {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-video-section .absolute.inset-0 {
    z-index: 10;
}

.hero-video-section .relative.z-20 {
    z-index: 20;
}

.animate-glow {
    color: white;
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.7));
    animation: glow 1.5s ease-in-out infinite alternate;
}

@keyframes glow {
    0% { transform: scale(1); filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.7)); }
    100% { transform: scale(1.02); filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.9)); }
}

@media (max-width: 768px) {
    .hero-video-section {
        height: 400px;
    }
    .hero-video-section h1 {
        font-size: 2.5rem;
    }
    .hero-video-section p {
        font-size: 1.25rem;
    }
}

@media (max-width: 640px) {
    .hero-video-section {
        height: 300px;
    }
    .hero-video-section h1 {
        font-size: 1.5rem;
    }
    .hero-video-section p {
        font-size: 1rem;
    }
}

/* Добавлено: стили для планшетов (768–1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    /* Hero Section */
    .hero-video-section {
        height: 500px; /* Уменьшенная высота для планшетов */
    }
    .hero-video-section h1 {
        font-size: 3.5rem; /* Меньший шрифт для заголовка */
    }
    .hero-video-section p {
        font-size: 1.5rem; /* Меньший шрифт для текста */
    }
    .hero-video {
        object-fit: contain; /* Изменено на contain, чтобы избежать обрезки видео */
    }

    /* Категории и товары */
    .grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)); /* 3 колонки для карточек */
    }
    .category-card img, .product-card img {
        height: 180px; /* Уменьшенная высота изображений */
        object-fit: contain; /* Предотвращает обрезку изображений */
    }

    /* Форма подписки */
    .subscription-banner .banner-content {
        padding: 1.5rem; /* Увеличенные отступы для компактности */
    }
    .subscription-banner input {
        font-size: 0.9rem; /* Меньший шрифт для полей ввода */
    }

    /* Swiper */
    .swiper {
        --swiper-navigation-size: 28px; /* Меньший размер стрелок */
    }
    .swiper-button-prev, .swiper-button-next {
        width: 28px;
        height: 28px;
    }
}

/* Стили для парящих карточек */
.floating-card {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.floating-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.8);
}

/* Стили для карточек категорий */
.category-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.category-card a {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.category-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: center;
    border-radius: 0.5rem 0.5rem 0 0;
}

/* Стили для карточек товаров */
.product-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    padding-top: 8px;
}

.product-card a {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.product-card img {
    width: 100%;
    height: 224px;
    object-fit: cover;
    object-position: center;
    border-radius: 0.5rem 0.5rem 0 0;
}

.card-buttons {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: white;
    z-index: 10;
}

/* Стили для формы подписки */
.subscription-banner input {
    transition: all 0.3s ease;
}

.subscription-banner input:focus {
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.2);
}

.subscription-banner .banner-content {
    background: linear-gradient(to right, #374151, #1f2937);
    color: white;
}

/* Стили для Swiper */
.swiper-button-prev, .swiper-button-next {
    color: #4b5563;
    width: 32px;
    height: 32px;
    background: transparent;
    opacity: 0.7;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.swiper-button-prev:hover, .swiper-button-next:hover {
    opacity: 1;
    transform: scale(1.1);
}

.swiper-button-prev::after, .swiper-button-next::after {
    font-size: 16px;
    font-weight: bold;
}

.swiper-pagination {
    bottom: -10px !important; /* Перемещаем пагинацию ниже */
}

.swiper-pagination-bullet {
    background: #6b7280; /* Серый цвет для неактивных точек */
    opacity: 0.6;
    width: 6px; /* Меньший размер точек */
    height: 6px;
    margin: 0 4px; /* Уменьшенный отступ между точками */
    transition: all 0.3s ease;
}

.swiper-pagination-bullet-active {
    background: #dc2626; /* Красный цвет для активной точки */
    opacity: 1;
    transform: scale(1.2); /* Легкое увеличение активной точки */
}

@media (max-width: 640px) {
    .swiper-pagination {
        bottom: -15px !important; /* Еще ниже для мобильных */
    }
    .swiper-pagination-bullet {
        width: 5px;
        height: 5px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .swiper-pagination {
        bottom: -12px !important; /* Для планшетов */
    }
}

/* Анимации */
.animate-pulse {
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Контрастность для ссылок и текста */
.text-gray-500:hover {
    color: #dc2626;
}

.text-gray-800 {
    color: #1f2937;
}

.bg-gray-200 {
    background-color: #f3f4f6;
}

.text-gray-700 {
    color: #111827;
}

.bg-gray-800 {
    background-color: #1f2937;
}

.text-gray-100 {
    color: #f3f4f6;
}
/* Стили для контейнера формы */
#amoforms_iframe_container_1563574 {
    width: 100%; /* Устанавливаем ширину на 100% от родителя */
    max-width: 100%; /* Убираем жесткое ограничение 512px */
    margin: 0 auto; /* Центрируем */
    padding: 0 1rem; /* Добавляем небольшие отступы по бокам для адаптивности */
}

/* Стили для формы внутри контейнера */
.amocrm_form {
    width: 100%; /* Форма занимает всю ширину контейнера */
    max-width: 600px; /* Ограничиваем максимальную ширину для эстетики */
    margin: 0 auto; /* Центрируем форму внутри контейнера */
    background: transparent; /* Убираем фон формы */
    color: white;
    font-family: 'Inter', Arial, sans-serif;
}

.amocrm_form iframe {
    width: 100%; /* Убеждаемся, что iframe растягивается */
    border: none; /* Убираем бордеры */
    margin: 0; /* Убираем лишние отступы */
    height: auto; /* Позволяем высоте адаптироваться */
}

/* Адаптивность для разных экранов */
@media (min-width: 640px) {
    .amocrm_form {
        max-width: 500px; /* Уменьшаем на планшетах для баланса */
    }
}

@media (min-width: 1024px) {
    .amocrm_form {
        max-width: 600px; /* На десктопах возвращаем до 600px */
    }
}
.amocrm_form__footer,
.amocrm-powered-by {
    display: none !important;
}
/* Стили для карточек блога */
.blog-card {
    position: relative;
    width: 100%;
    height: 250px; /* Фиксированная высота для равномерности */
    overflow: hidden;
    border-radius: 0.5rem;
}

.blog-card-bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: transform 0.3s ease;
}

.blog-card:hover .blog-card-bg {
    transform: scale(1.05); /* Легкое увеличение при наведении */
}

.blog-card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7); /* Полупрозрачный фон для текста */
    padding: 1rem;
    z-index: 2;
    color: white;
}

.blog-card-content h3 {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.4;
}

.blog-card-content p {
    margin: 0.5rem 0 0;
    font-size: 0.875rem;
    color: #e5e7eb; /* text-gray-200 */
}

@media (max-width: 640px) {
    .blog-card {
        height: 200px; /* Меньшая высота для мобильных */
    }
    .blog-card-content h3 {
        font-size: 1rem;
    }
    .blog-card-content p {
        font-size: 0.75rem;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .blog-card {
        height: 220px; /* Средняя высота для планшетов */
    }
}
/* Стили для текста в Hero Section */
.text-shadow {
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.8); /* Усиленная тень для читаемости */
    color: #f3f4f6; /* text-gray-100 для контраста */
}

.text-shadow a {
    color: #e5e7eb; /* text-gray-200 */
    transition: color 0.3s ease;
}

.text-shadow a:hover {
    color: #f56565; /* Красный оттенок при наведении */
}

/* Усиленная тень для заголовка в Hero Section */
.animate-glow {
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.8); /* Усиленная тень для читаемости */
    color: #f3f4f6; /* text-gray-100 для контраста */
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.7));
    animation: glow 1.5s ease-in-out infinite alternate;
}

@media (max-width: 640px) {
    .text-shadow {
        font-size: 1rem; /* Меньший шрифт для мобильных */
        text-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
    }
    .animate-glow {
        font-size: 1.5rem; /* Меньший шрифт для мобильных */
        text-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .text-shadow {
        font-size: 1.5rem; /* Средний шрифт для планшетов */
        text-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
    }
    .animate-glow {
        font-size: 3.5rem; /* Средний шрифт для планшетов */
        text-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
    }
}