@import "layout/navbar.css";
@import "home/hero.css";
@import "home/clients.css";
@import "home/process.css";
@import "home/ai-free-training.css";
@import "home/ai-adoption.css";
@import "home/services.css";
@import "home/demos-showcase.css";
@import "home/testimonials.css";
@import "home/value-prop.css";
@import "layout/footer.css";
@import "home/contact.css";
@import "home/team.css";
/* @import "aitraining/contact.css";
@import "aitraining/hero.css";
@import "aitraining/advantages.css";
@import "aitraining/target-audience.css";
@import "aitraining/join-cta.css";
@import "aitraining/live-meeting.css";
@import "aitraining/training-program.css"; */
/* @import "typography.css"; */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Objectivity", sans-serif;
}

@font-face {
  font-family: "Objectivity";
  src: url("https://fonts.cdnfonts.com/css/Objectivity") format("woff2");
  font-weight: 400;
  font-style: normal;
}

body {
  background-color: var(--dark-bg);
  color: var(--light-text);
  overflow-x: hidden;
  animation: fadeIn 1s ease-out;
}

:root {
  --primary-color: #00d285;
  --primary-color-dark: #00b974;
  --secondary-color: #6c5ce7;
  --accent-color: #00b8d9;
  --dark-bg: #000000;
  --dark-bg-2: #0a0a0a;
  --dark-bg-3: #111111;
  --light-text: #ffffff;
  --light-text-2: #f0f0f0;
  --gray-text: #aaaaaa;
  --gray-text-2: #888888;
  --spacing-xs: 8px;
  --spacing-sm: 16px;
  --spacing-md: 24px;
  --spacing-lg: 48px;
  --spacing-xl: 80px;
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 12px;
  --transition-fast: 0.2s ease;
  --transition-medium: 0.3s ease;
  --transition-slow: 0.5s ease;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 600;
  --font-weight-black: 700;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --font-size-3xl: 3rem;
  --font-size-4xl: 4rem;
  --letter-spacing-tight: -0.05em;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.05em;
}

.container {
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
  padding-left: var(--spacing-lg);
  padding-right: var(--spacing-lg);
  position: relative;
}

.parallax-element {
  will-change: transform;
  transform: translateZ(0);
  transition: transform 0.1s linear;
}

.parallax-slow {
  transition: transform 0.2s ease-out;
}

.parallax-very-slow {
  transition: transform 0.3s ease-out;
}

.parallax-depth-1 {
  transform-style: preserve-3d;
  transform: perspective(1000px) translateZ(10px);
}

.parallax-depth-2 {
  transform-style: preserve-3d;
  transform: perspective(1000px) translateZ(20px);
}

.parallax-depth-3 {
  transform-style: preserve-3d;
  transform: perspective(1000px) translateZ(30px);
}

.parallax-shadow {
  position: relative;
}

.parallax-shadow::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  opacity: 0;
  transition: opacity var(--transition-medium);
  z-index: -1;
  border-radius: inherit;
}

.parallax-shadow:hover::after {
  opacity: 1;
}

/* Floating animation for subtle movement */
@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

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

.float-animation-slow {
  animation: float 8s ease-in-out infinite;
}

.float-animation-very-slow {
  animation: float 10s ease-in-out infinite;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.highlight {
  background: linear-gradient(to right, var(--primary-color) 0%, #00f090 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: var(--font-weight-bold);
  position: relative;
  display: inline-block;
  animation: glowPulse 3s ease-in-out infinite;
}

@keyframes glowPulse {
  0% {
    filter: drop-shadow(0 0 2px rgba(0, 210, 133, 0));
  }
  50% {
    filter: drop-shadow(0 0 5px rgba(0, 210, 133, 0.4));
  }
  100% {
    filter: drop-shadow(0 0 2px rgba(0, 210, 133, 0));
  }
}
