/* ─── Base ──────────────────────────────────────────────────────── */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body {
  background-color: #080d1c;
  color: #e2e8f0;
}

/* ─── Scrollbar ─────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0d1224; }
::-webkit-scrollbar-thumb { background: #c8ff00; border-radius: 3px; }

/* ─── Glassmorphism ─────────────────────────────────────────────── */
.glass {
  background: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(12px);
}

/* glass tinted with brand lime */
.glass-blue {
  background: linear-gradient(135deg, rgba(200,255,0,0.10) 0%, rgba(200,255,0,0.03) 100%);
  border: 1px solid rgba(200,255,0,0.22);
  backdrop-filter: blur(12px);
}

/* ─── Gradient text ─────────────────────────────────────────────── */
.gradient-text {
  background: linear-gradient(135deg, #c8ff00 0%, #ffffff 60%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─── Dot-grid background ────────────────────────────────────────── */
.dot-grid {
  background-image: radial-gradient(rgba(200,255,0,0.12) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* ─── Section divider ────────────────────────────────────────────── */
.section-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,255,0,0.3), rgba(107,122,153,0.2), transparent);
}

/* ─── Scroll-reveal ─────────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ─── Animated gradient border ───────────────────────────────────── */
.animated-border {
  position: relative;
  background: linear-gradient(135deg, rgba(200,255,0,0.07), rgba(107,122,153,0.04));
  border-radius: 24px;
}
.animated-border::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(200,255,0,0.45), rgba(107,122,153,0.25), rgba(200,255,0,0.1));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

/* ─── Feature card hover ─────────────────────────────────────────── */
.feature-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 0 40px rgba(200,255,0,0.15), 0 20px 40px rgba(0,0,0,0.4);
  border-color: rgba(200,255,0,0.35) !important;
}

/* ─── Buttons ────────────────────────────────────────────────────── */
.btn-primary {
  background: linear-gradient(135deg, #a0cc00, #c8ff00);
  box-shadow: 0 4px 20px rgba(200,255,0,0.3), inset 0 1px 0 rgba(255,255,255,0.25);
  transition: all 0.25s ease;
  color: #080d1c !important;  /* lime bg → must use dark text */
}
.btn-primary:hover {
  background: linear-gradient(135deg, #c8ff00, #d4ff33);
  box-shadow: 0 8px 32px rgba(200,255,0,0.5), inset 0 1px 0 rgba(255,255,255,0.3);
  transform: translateY(-2px);
}

/* Icons inside primary buttons must also be dark */
.btn-primary svg {
  color: #080d1c !important;
}

.btn-secondary {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  transition: all 0.25s ease;
}
.btn-secondary:hover {
  background: rgba(255,255,255,0.1);
  border-color: rgba(200,255,0,0.3);
  transform: translateY(-2px);
}

/* ─── Store badges ───────────────────────────────────────────────── */
.store-badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 20px;
  border-radius: 14px;
  transition: all 0.25s ease;
  text-decoration: none;
}
.store-badge:hover { transform: translateY(-3px); }

/* ─── Navbar scroll blur ─────────────────────────────────────────── */
.nav-blur {
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  background: rgba(8,13,28,0.82);
  border-bottom: 1px solid rgba(200,255,0,0.1);
}

/* ─── Form input focus ───────────────────────────────────────────── */
.form-input:focus {
  outline: none;
  border-color: rgba(200,255,0,0.5) !important;
  box-shadow: 0 0 0 3px rgba(200,255,0,0.12);
}

/* ─── Map pin pulse ──────────────────────────────────────────────── */
@keyframes pin-pulse {
  0%   { box-shadow: 0 0 0 0    rgba(200,255,0,0.7); }
  70%  { box-shadow: 0 0 0 14px rgba(200,255,0,0);   }
  100% { box-shadow: 0 0 0 0    rgba(200,255,0,0);   }
}
.pin-pulse { animation: pin-pulse 2s ease-out infinite; }

/* ─── Float animation ────────────────────────────────────────────── */
@keyframes float {
  0%,100% { transform: translateY(0px); }
  50%     { transform: translateY(-18px); }
}
.animate-float { animation: float 6s ease-in-out infinite; }

/* ─── Mobile menu ────────────────────────────────────────────────── */
#mobile-menu { transition: max-height 0.35s ease, opacity 0.35s ease; }

/* ─── Language Selector Dropdown ─────────────────────────────────── */
.lang-dropdown-container, .lang-dropdown-container-mobile {
  position: relative;
}

.lang-chevron.open, .lang-chevron-mobile.open {
  transform: rotate(180deg);
}

.lang-menu {
  transform-origin: top right;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.lang-menu.show {
  display: block !important;
  opacity: 1 !important;
  transform: scale(1) translateY(0) !important;
}

.lang-option:hover, .lang-option-mobile:hover {
  background: rgba(200, 255, 0, 0.08);
}

.lang-option.active, .lang-option-mobile.active {
  background: rgba(200, 255, 0, 0.12);
  color: #ffffff;
}

.lang-option.active .lang-check, .lang-option-mobile.active .lang-check-mobile {
  display: inline-block !important;
}