.elementor-kit-1399{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:#0A0A0F;}.elementor-kit-1399 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ==========================================
   EM2MEDIA - GLOBAL STYLES
   Paste in: Elementor → Site Settings → Custom CSS
   ========================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* Backgrounds */
  --em-bg-base: #0A0A0F;
  --em-bg-elevated: #131320;
  --em-bg-surface: #1C1C2E;
  --em-bg-darker: #09090B;
  
  /* Accents */
  --em-violet: #7C3AED;
  --em-violet-light: #A78BFA;
  --em-cyan: #06B6D4;
  --em-cyan-light: #67E8F9;
  --em-pink: #EC4899;
  --em-pink-light: #F472B6;
  
  /* Gradient */
  --em-gradient: linear-gradient(135deg, #7C3AED 0%, #06B6D4 100%);
  --em-gradient-text: linear-gradient(135deg, #A78BFA 0%, #06B6D4 100%);
  --em-gradient-pink: linear-gradient(135deg, #EC4899 0%, #7C3AED 100%);
  
  /* Text */
  --em-text-primary: #F4F4F5;
  --em-text-secondary: #A1A1AA;
  --em-text-muted: #71717A;
  
  /* Borders */
  --em-border: rgba(255,255,255,0.08);
  --em-border-strong: rgba(255,255,255,0.15);
  --em-border-violet: rgba(124,58,237,0.4);
  --em-border-cyan: rgba(6,182,212,0.4);
  --em-border-pink: rgba(236,72,153,0.4);
  
  /* Status */
  --em-success: #10B981;
  --em-warning: #F59E0B;
  --em-error: #EF4444;
}

/* Force dark background everywhere - including ALL Elementor wrappers */
html {
  scroll-behavior: smooth;
}

html, body, .elementor-page, .site, #page,
.site-content, main, #main, #content {
  background-color: var(--em-bg-base) !important;
  color: var(--em-text-secondary);
}

/* Elementor wrapper transparency - prevents subpixel rendering lines between sections */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget,
.elementor-widget-wrap,
.elementor-widget-container,
.elementor-widget-html,
.e-con,
.e-con-inner {
  background-color: transparent;
}

/* ==========================================
   UTILITY CLASSES
   ========================================== */

.em-gradient-text {
  background: var(--em-gradient-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
  padding: 0 0.06em;
  margin: 0 -0.06em;
}

.em-gradient-text-pink {
  background: var(--em-gradient-pink);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
}

/* ==========================================
   BUTTONS (used everywhere)
   ========================================== */

/* ==========================================
   BUTTONS - bulletproof against theme overrides
   ========================================== */

a.em-btn-primary,
button.em-btn-primary,
.elementor a.em-btn-primary,
.elementor-widget-html a.em-btn-primary {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--em-gradient) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  padding: 16px 32px;
  border-radius: 12px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none !important;
  border: none;
  cursor: pointer;
  transition: background 0.4s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

a.em-btn-primary:link,
a.em-btn-primary:visited,
a.em-btn-primary:active,
a.em-btn-primary:focus,
.elementor a.em-btn-primary:link,
.elementor a.em-btn-primary:visited {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  text-decoration: none !important;
}

a.em-btn-primary:hover,
button.em-btn-primary:hover,
.elementor a.em-btn-primary:hover,
.elementor-widget-html a.em-btn-primary:hover {
  background: linear-gradient(135deg, #06B6D4 0%, #7C3AED 100%) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  text-decoration: none !important;
  transform: translateY(-2px);
  box-shadow: 0 20px 40px rgba(124,58,237,0.4), 0 0 60px rgba(124,58,237,0.2);
}

a.em-btn-primary svg,
a.em-btn-primary:hover svg {
  color: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

a.em-btn-secondary,
.elementor a.em-btn-secondary {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: transparent !important;
  color: var(--em-text-primary) !important;
  -webkit-text-fill-color: var(--em-text-primary) !important;
  border: 1px solid var(--em-border-strong) !important;
  padding: 16px 32px;
  border-radius: 12px;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none !important;
  cursor: pointer;
  transition: all 0.3s ease;
}

a.em-btn-secondary:hover,
.elementor a.em-btn-secondary:hover {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.3) !important;
  color: var(--em-text-primary) !important;
  -webkit-text-fill-color: var(--em-text-primary) !important;
  transform: translateY(-2px);
}

/* ==========================================
   ANIMATIONS
   ========================================== */

@keyframes em-fade-up {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes em-fade-down {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes em-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes em-fade-left {
  from { opacity: 0; transform: translateX(-30px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes em-fade-right {
  from { opacity: 0; transform: translateX(30px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes em-float-blob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(40px, -60px) scale(1.1); }
  66% { transform: translate(-30px, 30px) scale(0.95); }
}

@keyframes em-pulse-glow {
  0%, 100% { box-shadow: 0 0 30px rgba(124,58,237,0.3); }
  50% { box-shadow: 0 0 60px rgba(124,58,237,0.6); }
}

@keyframes em-bounce-subtle {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes em-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

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

/* Animation utility classes */
.em-animate-up { opacity: 0; animation: em-fade-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.em-animate-down { opacity: 0; animation: em-fade-down 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.em-animate-in { opacity: 0; animation: em-fade-in 0.8s ease forwards; }
.em-animate-left { opacity: 0; animation: em-fade-left 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.em-animate-right { opacity: 0; animation: em-fade-right 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

/* Stagger delays */
.em-d1 { animation-delay: 0.1s; }
.em-d2 { animation-delay: 0.25s; }
.em-d3 { animation-delay: 0.4s; }
.em-d4 { animation-delay: 0.55s; }
.em-d5 { animation-delay: 0.7s; }
.em-d6 { animation-delay: 0.85s; }

/* Scroll-triggered animations */
.em-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.em-scroll.em-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ==========================================
   COMMON COMPONENTS
   ========================================== */

.em-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.18em;
  color: var(--em-violet-light);
  text-transform: uppercase;
  margin: 0;
}

.em-section-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 56px;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--em-text-primary);
  margin: 0;
}

.em-section-subtitle {
  font-size: 18px;
  line-height: 1.6;
  color: var(--em-text-secondary);
  max-width: 700px;
  margin: 0 auto;
}

/* Card base */
.em-card {
  background: var(--em-bg-elevated);
  border: 1px solid var(--em-border);
  border-radius: 20px;
  padding: 32px;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}

.em-card:hover {
  transform: translateY(-4px);
  border-color: var(--em-border-violet);
  box-shadow: 0 24px 48px rgba(0,0,0,0.4), 0 0 60px rgba(124,58,237,0.15);
}

/* ==========================================
   RESPONSIVE BREAKPOINTS
   ========================================== */

@media (max-width: 1024px) {
  .em-section-title { font-size: 42px; }
}

@media (max-width: 767px) {
  .em-section-title { font-size: 32px; }
  .em-section-subtitle { font-size: 16px; }
  .em-btn-primary, .em-btn-secondary { 
    padding: 14px 24px; 
    font-size: 14px; 
  }
}

/* ==========================================
   GLOBAL SPACING REDUCTION
   ========================================== */

/* Намаляване на padding на всички секции */
.em-problem,
.em-solution,
.em-services,
.em-platform,
.em-process,
.em-cases,
.em-testimonials,
.em-about,
.em-pricing,
.em-faq,
.em-counters,
.em-pm-services,
.em-pm-creatives,
.em-pm-process,
.em-pm-wins,
.em-pm-platform,
.em-pm-pricing,
.em-pm-faq,
.em-wd-services,
.em-wd-included,
.em-wd-process,
.em-wd-pricing,
.em-cp-services,
.em-cp-capabilities,
.em-cp-process,
.em-cp-pricing,
.em-cs-grid-section,
.em-ct-main {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}

/* Mobile - дори по-малко */
@media (max-width: 767px) {
  .em-problem,
  .em-solution,
  .em-services,
  .em-platform,
  .em-process,
  .em-cases,
  .em-testimonials,
  .em-about,
  .em-pricing,
  .em-faq,
  .em-counters,
  .em-pm-services,
  .em-pm-creatives,
  .em-pm-process,
  .em-pm-wins,
  .em-pm-platform,
  .em-pm-pricing,
  .em-pm-faq,
  .em-wd-services,
  .em-wd-included,
  .em-wd-process,
  .em-wd-pricing,
  .em-cp-services,
  .em-cp-capabilities,
  .em-cp-process,
  .em-cp-pricing,
  .em-cs-grid-section,
  .em-ct-main {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
}

/* Намаляване на margin на section headers */
.em-problem-header,
.em-services-header,
.em-pm-services-header,
.em-pm-creatives-header,
.em-pm-process-header,
.em-pm-pricing-header,
.em-pm-faq-header,
.em-wd-services-header,
.em-wd-included-header,
.em-wd-process-header,
.em-wd-pricing-header,
.em-cp-services-header,
.em-cp-cap-header,
.em-cp-process-header,
.em-cp-pricing-header,
.em-cs-grid-header,
.em-process-header,
.em-pricing-header,
.em-faq-header,
.em-testimonials-header {
  margin-bottom: 40px !important;
}

@media (max-width: 767px) {
  .em-problem-header,
  .em-services-header,
  .em-pm-services-header,
  .em-pm-creatives-header,
  .em-pm-process-header,
  .em-pm-pricing-header,
  .em-pm-faq-header,
  .em-wd-services-header,
  .em-wd-included-header,
  .em-wd-process-header,
  .em-wd-pricing-header,
  .em-cp-services-header,
  .em-cp-cap-header,
  .em-cp-process-header,
  .em-cp-pricing-header,
  .em-cs-grid-header,
  .em-process-header,
  .em-pricing-header,
  .em-faq-header,
  .em-testimonials-header {
    margin-bottom: 32px !important;
  }
}

/* ==========================================
   PREVENT HORIZONTAL SCROLL (mobile fix)
   ========================================== */

html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
  width: 100%;
}

/* Force all top-level elements to respect viewport width */
.elementor-page,
.site,
#page,
main,
#main,
#content {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Make sure no section can overflow horizontally */
section {
  max-width: 100vw;
  overflow-x: clip;
}

/* Mobile-specific: tighter constraints */
@media (max-width: 767px) {
  body * {
    max-width: 100vw;
  }
  
  /* Exception: marquee tracks need to be wider than viewport — they're contained by their masked parent */
  .em-marquee-track,
  .em-testimonials-track,
  .em-pm-creatives-track {
    max-width: none !important;
  }
}

/* ==========================================
   TRUST BAR - separate desktop & mobile + seamless loop
   ========================================== */

/* DESKTOP — bigger logos, slower scroll */
.em-trust .em-logo-img {
  height: 96px !important;
  max-width: 180px !important;
}

.em-trust .em-marquee-track {
  gap: 80px !important;
  padding-right: 80px !important;
  animation: em-trust-marquee-loop 50s linear infinite !important;
  will-change: transform;
}

/* MOBILE — much smaller, faster scroll */
@media (max-width: 767px) {
  .em-trust .em-logo-img {
    height: 96px !important;
    max-width: 75px !important;
  }
  
  .em-trust .em-marquee-track {
    gap: 28px !important;
    padding-right: 28px !important;
    animation: em-trust-marquee-loop 18s linear infinite !important;
  }
}

/* Tablet — medium */
@media (min-width: 768px) and (max-width: 1024px) {
  .em-trust .em-logo-img {
    height: 40px !important;
    max-width: 130px !important;
  }
  
  .em-trust .em-marquee-track {
    gap: 56px !important;
    padding-right: 56px !important;
    animation: em-trust-marquee-loop 30s linear infinite !important;
  }
}

/* Seamless infinite loop — moves exactly 1 of 4 sets */
@keyframes em-trust-marquee-loop {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-25%, 0, 0); }
}

/* Pause on hover (desktop only) */
@media (min-width: 768px) {
  .em-trust .em-marquee:hover .em-marquee-track {
    animation-play-state: paused !important;
  }
}

/* ==========================================
   STICKY HEADER FIX - works on all browsers
   ========================================== */

.em-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
}

/* Push content down so it doesn't hide behind fixed header */
body {
  padding-top: 70px;
}

/* Mobile: header is shorter, less padding needed */
@media (max-width: 767px) {
  body {
    padding-top: 58px;
  }
}

/* Anchor links should account for the fixed header height */
[id] {
  scroll-margin-top: 90px;
}

@media (max-width: 767px) {
  [id] {
    scroll-margin-top: 70px;
  }
}/* End custom CSS */