html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  line-height: normal;
}
#what-we-deliver,
#built-for-world {
  scroll-margin-top: 72px;
}

:root {
  /* Figma Variables */

  /* Spacing */
  --Container-container-large: 1280px;
  --Max-Width-max-width-large: 768px;
  --Page-Padding-padding-global: 64px;
  --Radius-Large: 8px;
  --Radius-Medium: 8px;
  --Section-Padding-padding-section-large: 112px;
  --Section-Padding-padding-section-medium: 80px;
  --Text-Sizes-Heading-1: 72px;
  --Text-Sizes-Heading-2: 52px;
  --Text-Sizes-Heading-6: 22px;
  --Text-Sizes-Text-Large: 22px;
  --Text-Sizes-Text-Medium: 18px;
  --Text-Sizes-Text-Regular: 16px;
  --Text-Sizes-Text-Small: 14px;
  --Text-Sizes-Text-Tiny: 12px;

  /* Color */
  --Color-Black-Rock: #030433;
  --Color-Black-Rock-Dark: #020328;
  --Color-Neutral-Darkest: #000;
  --Color-White: #fff;
  --Opacity-Neutral-Darkest-15: rgba(0, 0, 0, 0.15);
  --Opacity-Neutral-Darkest-60: rgba(0, 0, 0, 0.6);
  --Opacity-Transparent: rgba(255, 255, 255, 0);
  --Opacity-White-20: rgba(255, 255, 255, 0.2);
  --Opacity-White-60: rgba(255, 255, 255, 0.6);

  /* Tech Accent Colors */
  --Accent-Cyan: #00d4ff;
  --Accent-Cyan-Dim: rgba(0, 212, 255, 0.15);
  --Accent-Cyan-Glow: rgba(0, 212, 255, 0.35);
  --Accent-Blue: #4f8ef7;
  --Accent-Blue-Dim: rgba(79, 142, 247, 0.12);
  --Glow-Primary: 0 0 20px rgba(0, 212, 255, 0.4), 0 0 60px rgba(0, 212, 255, 0.15);
  --Glow-Button: 0 0 16px rgba(0, 212, 255, 0.5), 0 4px 20px rgba(0, 212, 255, 0.2);
  --Glow-Card: 0 4px 30px rgba(0, 212, 255, 0.12), 0 1px 0 rgba(0, 212, 255, 0.2) inset;
  --Transition-Smooth: 0.25s cubic-bezier(0.0, 0.0, 0.2, 1);
  --Transition-Spring: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Common Style Variables */
}

/* ===================== GLOBAL ANIMATIONS ===================== */
@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.6; }
  50%       { opacity: 1; }
}

@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

/* ===================== REDUCED MOTION ===================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}


