:root{--base-bg:#111827}*,::after,::before{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{overflow-x:hidden;background:var(--base-bg);color:#cbd5e1}.bg-base{background-color:var(--base-bg)}::selection{background:rgba(59,130,246,.3);color:#fff}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--base-bg)}::-webkit-scrollbar-thumb{background:rgba(100,116,139,.4);border-radius:3px}
/* ТУМАН: canvas + mouse-glow слой */
.animated-mesh-bg{background-color:var(--base-bg);contain:layout paint}
.fog-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.55;mix-blend-mode:screen}
.mouse-glow{position:absolute;left:0;top:0;width:900px;height:900px;margin-left:-450px;margin-top:-450px;border-radius:50%;background:radial-gradient(circle,rgba(96,165,250,.18) 0%,rgba(59,130,246,.08) 35%,transparent 70%);pointer-events:none;will-change:transform;mix-blend-mode:screen;filter:blur(40px)}
/* ВОЛНЫ: только один слой анимируется, остальные статичны */
.infinite-ocean{position:absolute;bottom:0;left:0;width:100%;height:35vh;z-index:1;pointer-events:none;overflow:hidden}.ocean-layer{position:absolute;bottom:0;left:0;width:200%;height:100%;display:flex;font-size:0;line-height:0}.ocean-layer svg{width:100%;height:100%;flex-shrink:0;display:block;min-height:100%}.ocean-layer--1{bottom:3vh;opacity:.6}.ocean-layer--2{bottom:4vh;opacity:.8}.ocean-layer--3{animation:wave-slide 20s linear infinite;bottom:5vh;opacity:1;will-change:transform}@keyframes wave-slide{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
/* НАВИГАЦИЯ */
.nav-scrolled .nav-inner{background:rgba(17,24,39,.9)!important;border-color:rgba(51,65,85,.6)!important;box-shadow:0 10px 30px rgba(0,0,0,.3)!important}.nav-link{position:relative;transition:color .3s ease}.nav-link::after{content:'';position:absolute;bottom:4px;left:50%;width:0;height:2px;background:linear-gradient(90deg,#3b82f6,#22d3ee);border-radius:1px;transition:width .3s ease;transform:translateX(-50%)}.nav-link.active::after,.nav-link:hover::after{width:60%}.nav-link.active{color:#fff}
/* КАРТОЧКИ */
.service-card{position:relative;overflow:hidden;content-visibility:auto;contain-intrinsic-size:400px}.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(59,130,246,0),transparent);transition:background .5s ease}.service-card:hover::before{background:linear-gradient(90deg,transparent,rgba(59,130,246,.6),transparent)}
/* АНИМАЦИИ — без бесконечных */
@keyframes fade-in-up{from{opacity:0;transform:translateY(30px);filter:blur(8px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}.animate-fade-in-up{animation:fade-in-up 1s ease-out both}.animation-delay-100{animation-delay:.1s}.animation-delay-200{animation-delay:.2s}.animation-delay-300{animation-delay:.3s}.scroll-animate{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease,filter .8s ease;filter:blur(6px)}.scroll-animate.is-visible{opacity:1;transform:translateY(0);filter:blur(0)}#submitBtn:not(:disabled){box-shadow:0 10px 30px rgba(37,99,235,.3)}#submitBtn:hover:not(:disabled){box-shadow:0 15px 40px rgba(37,99,235,.5)}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}
/* АДАПТИВНОСТЬ */
@media (max-width:768px){.infinite-ocean{height:25vh}.fog-canvas,.mouse-glow{display:none!important}.ocean-layer--3{animation:none}.scroll-animate{opacity:1;transform:none;filter:none;transition:none}.animate-fade-in-up{animation:none;opacity:1;transform:none;filter:none}.hero-cta{animation:none!important}.about-icon-wrap:hover{transform:none!important}.seo-card::before{width:4px!important}}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}.scroll-animate{opacity:1;transform:none;filter:none}.ocean-layer--1,.ocean-layer--2,.ocean-layer--3{animation:none!important}.hero-cta{animation:none!important}.fog-canvas,.mouse-glow{display:none!important}}

/* === УНИКАЛЬНЫЕ ЭФФЕКТЫ НА БЛОКИ === */

/* HERO: медленная пульсация свечения кнопки (только на десктопе) */
.hero-cta{position:relative;animation:hero-glow 4s ease-in-out infinite}
@keyframes hero-glow{0%,100%{box-shadow:0 10px 30px rgba(37,99,235,.3),0 0 0 0 rgba(59,130,246,.4)}50%{box-shadow:0 15px 40px rgba(37,99,235,.45),0 0 0 12px rgba(59,130,246,0)}}
.hero-cta:hover{animation-play-state:paused}

/* ABOUT US: декоративная иконка медленно вращается при hover */
.about-icon-wrap{transition:transform .8s cubic-bezier(.4,0,.2,1);will-change:transform}
.about-icon-wrap:hover{transform:rotate(180deg) scale(1.08)}

/* SEO BLOCKS: боковая полоска cyan, растущая сверху вниз при hover + верхняя многоцветная полоса */
.seo-card{position:relative;overflow:hidden}
.seo-card::before{content:'';position:absolute;left:0;top:0;width:0;height:100%;background:linear-gradient(180deg,#22d3ee,#3b82f6);transition:width .6s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px rgba(34,211,238,.5)}
.seo-card:hover::before{width:4px}
.seo-card::after{content:'';position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);opacity:0;transition:opacity .7s ease}
.seo-card:hover::after{opacity:1}

/* КАРТОЧКИ: тонкая цветная полоска снизу + верхняя волна света при hover */
.service-card::after{content:'';position:absolute;left:50%;bottom:0;width:0;height:2px;background:linear-gradient(90deg,transparent,#60a5fa,transparent);transition:width .8s ease,opacity .8s ease;opacity:0;transform:translateX(-50%);box-shadow:0 0 12px rgba(96,165,250,.6)}
.service-card:hover::after{width:80%;opacity:1}
.service-card:hover{transform-style:preserve-3d}