:root {
  --color-primary: #b8f34a;
  --color-olive: #a3a65a;
  --color-primary-contrast: #101411;
  --color-accent: #ff6fae;
  --color-wow: #d9ff72;
  --color-wow-secondary: #fff06a;
  --color-bg: #0d110f;
  --color-surface: #151b17;
  --color-text: #f3f7ef;
  --color-muted: #9ca99e;
  --font-heading: "Arial", sans-serif;
  --font-body: "Arial", sans-serif;
  --radius: 18px;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-heading);
  letter-spacing: -0.03em;
}

::selection {
  background: var(--color-primary);
  color: var(--color-primary-contrast);
}

.grid-pattern {
  background-image: linear-gradient(rgba(184, 243, 74, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(184, 243, 74, 0.07) 1px, transparent 1px);
  background-size: 48px 48px;
}

.glow {
  box-shadow: 0 0 80px rgba(184, 243, 74, 0.12);
}

input,
textarea,
select {
  color: var(--color-text);
}

input::placeholder,
textarea::placeholder {
  color: var(--color-muted);
}

@keyframes logo-bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  20% {
    transform: translateY(-7px);
  }
  40% {
    transform: translateY(0);
  }
  60% {
    transform: translateY(-3px);
  }
  80% {
    transform: translateY(0);
  }
}

.logo-mark {
  animation: logo-bounce 1.8s ease-in-out infinite;
  transform-origin: center bottom;
}

@media (prefers-reduced-motion: reduce) {
  .logo-mark {
    animation: none;
  }
}

@keyframes contact-title-drop {
  0% {
    opacity: 0;
    transform: translateY(-120px);
  }
  65% {
    opacity: 1;
    transform: translateY(12px);
  }
  82% {
    transform: translateY(-6px);
  }
  92% {
    transform: translateY(3px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.contact-hero-title {
  animation: contact-title-drop 1.1s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@media (prefers-reduced-motion: reduce) {
  .contact-hero-title {
    animation: none;
  }
}