/*
Theme Name: SEO AI
Theme URI: https://seoai24.ru
Author: Fedor Zaharenkov
Author URI: https://seoai24.ru
Description: Премиальная темная футуристическая тема для проекта SEO AI. Сочетание глубокого космического фона, фиолетово-индигового неонового свечения и ярких оранжевых акцентов для высокой конверсии и технологичного позиционирования.
Version: 1.0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seo-ai
Tags: dark-mode, futuristic, saas, bento-grid, neon-glow, orange-accent, accessibility-ready, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool.
*/

/* ==========================================================================
   Глобальные переменные и дизайн-токены (AURA Tokens)
   ========================================================================== */
:root {
    --color-bg: #09090D;
    --color-card-bg: #111119;
    --color-primary-accent: #8B5CF6;
    --color-secondary-accent: #6366F1;
    --color-orange-accent: #F97316;
    --color-text-primary: #FFFFFF;
    --color-text-secondary: #9CA3AF;
    --color-border: rgba(255, 255, 255, 0.05);
    --color-glow: rgba(139, 92, 246, 0.15);
}

/* ==========================================================================
   Базовые стили и сбросы
   ========================================================================== */
html {
    scroll-behavior: smooth;
    background-color: var(--color-bg);
    color: var(--color-text-primary);
    font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text-secondary);
    font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: var(--color-text-primary);
    margin-top: 0;
}

/* ==========================================================================
   Утилиты доступности (Accessibility)
   ========================================================================== */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* ==========================================================================
   Анимация Bento-карточек и Бегущей строки
   ========================================================================== */
.bento-card {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.bento-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(139, 92, 246, 0.25) !important;
    box-shadow: 0 10px 30px -5px rgba(139, 92, 246, 0.12) !important;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-33.3333%);
    }
}

/* ==========================================================================
   Поддержка prefers-reduced-motion (Доступность)
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-delay: -1ms !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        background-attachment: initial !important;
        scroll-behavior: auto !important;
        transition-duration: 0s !important;
        transition-delay: 0s !important;
        transform: none !important;
    }
    
    .orbit-outer, 
    .orbit-inner, 
    .pipeline-line-path, 
    .animate-pulse,
    .marquee-inner,
    .scroll-reveal {
        animation: none !important;
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
}