/* Основные цвета */
.bg-primary{
    background-color: #e4c010 !important;
}
.btn-primary{
    background-color: #e4c010 !important;
    color: #1a1a1a;
    outline-color: #a58a09;
    border-color: #a58a09;
}

.text-primary{
    color: #e4c010 !important;
}

/* Анимации для блока УТП */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

@keyframes float-side {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(15px); }
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes twinkle {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 1; }
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.animate-float-side {
    animation: float-side 5s ease-in-out infinite;
}

.animate-rotate {
    animation: rotate 20s linear infinite;
}

.animate-twinkle {
    animation: twinkle 2s ease-in-out infinite;
}

.animate-pulse {
    animation: pulse 2s ease-in-out infinite;
}

/* Дополнительные стили для улучшения изображений */
.man-image {
    filter: contrast(1.1) brightness(1.05) saturate(1.1);
    -webkit-filter: contrast(1.1) brightness(1.05) saturate(1.1);
}

.enhanced-image {
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
}

/* Стили для шрифта Manrope */
body {
    font-family: 'Manrope', sans-serif;
}

/* Улучшаем читаемость заголовков */
h1, h2, h3, h4, h5, h6,
.font-bold, .font-medium, .font-semibold {
    font-weight: 700; /* Manrope Bold */
    letter-spacing: -0.01em; /* Небольшой кернинг для красоты */
}

/* Для кнопок и акцентных элементов */
.btn, .navbar a, .footer-title {
    font-weight: 600; /* Manrope SemiBold */
}

/* Для основного текста */
p, .text-content, .opacity-80 {
    font-weight: 400; /* Manrope Regular */
    line-height: 1.6; /* Улучшенный интерлиньяж */
}

/* Адаптивные корректировки */
@media (max-width: 768px) {
    .hero-visual {
        margin-top: 2rem;
        height: 400px;
    }
}

/* Анимации для блоков при скролле */
@keyframes slide-up {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* Классы для элементов до анимации */
.hidden-start {
    opacity: 0;
    transform: translateY(30px);
}

.hidden-fade {
    opacity: 0;
}

/* Классы анимаций (добавляются через JS) */
.slide-up-animate {
    animation: slide-up 0.8s ease-out forwards !important;
}

.fade-in-animate {
    animation: fade-in 0.8s ease-out forwards !important;
}

/* Анимация при наведении */
.hover-lift {
    transition: all 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Градиенты для фонов */
.gradient-bg {
    background: linear-gradient(135deg,
    rgba(228, 192, 16, 0.1) 0%,
    rgba(26, 26, 26, 0.1) 25%,
    rgba(228, 192, 16, 0.05) 50%,
    rgba(26, 26, 26, 0.05) 75%);
}

/* Декоративные эффекты */
.glow-effect {
    box-shadow: 0 0 20px rgba(228, 192, 16, 0.3);
}

/* Анимации для иконок (опционально) */
@keyframes icon-bounce {
    0%, 100% {
        transform: translateY(0) scale(1);
    }
    50% {
        transform: translateY(-10px) scale(1.1);
    }
}

.icon-bounce {
    animation: icon-bounce 3s ease-in-out infinite;
}

/* Задержки для последовательных анимаций */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }

/* Утилиты */
.transition-all {
    transition: all 0.3s ease;
}

/* Для карточек с градиентными иконками */
.icon-gradient-primary {
    background: linear-gradient(135deg, #e4c010, #ffd700);
}

.icon-gradient-secondary {
    background: linear-gradient(135deg, #6b7280, #9ca3af);
}

.icon-gradient-accent {
    background: linear-gradient(135deg, #10b981, #34d399);
}
