/* ===== GLOBAL ===== */
*, *::before, *::after { box-sizing: border-box; }

:root {
  --primary:      #200E01;
  --primary-dark: #5B0202;
  --accent:       #8B0000;
  --accent-dark:  #5B0202;
}

html { scroll-behavior: smooth; }

body { font-family: 'Inter', system-ui, sans-serif; }

/* ===== NAVBAR SCROLL EFFECT ===== */
#navbar.scrolled {
  background: rgba(21, 43, 107, 0.97) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0,0,0,0.18);
}

/* ===== MARQUEE ===== */
.marquee-track {
  animation: marquee 28s linear infinite;
  width: max-content;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-33.333%); }
}

/* ===== ANIMATIONS ===== */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ===== CARD HOVER ===== */
.service-card { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.service-card:hover { transform: translateY(-6px); }

/* ===== HERO PARTICLES ===== */
#particles {
  background-image:
    radial-gradient(circle, rgba(255,255,255,0.15) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* ===== CUSTOM SCROLLBAR ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; }

/* ===== FOCUS STATES ===== */
input:focus, textarea:focus, select:focus { outline: none; }

/* ===== LINE CLAMP ===== */
.line-clamp-1 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* ===== SMOOTH TRANSITIONS ===== */
a, button { transition-property: color, background-color, border-color, transform, box-shadow, opacity; }