/* Dhakadigitalsurvey — design tokens & utilities */

:root {
  --primary: #30bd9b;
  --primary-dim: #1ea583;
  --text: #2a2b3f;
  --text-muted: #888888;
  --surface: #ffffff;
  --surface-alt: #f8f8f8;
  --surface-lowest: #ffffff;
  --surface-container: #f3f7fd;
  --outline-variant: #eaeaea;
  --on-surface-variant: #495057;
}

/* ============================================
   AGGRESSIVE SCROLL FIX — DO NOT TOUCH
   ============================================ */
html {
  overflow-y: scroll !important;
  overflow-x: hidden !important;
  height: auto !important;
  min-height: 100% !important;
  scroll-behavior: smooth;
}

body {
  overflow-y: visible !important;
  overflow-x: hidden !important;
  height: auto !important;
  min-height: 100vh !important;
  width: 100% !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Logo fallback */
.brand-mark {
  width: 32px; height: 32px; border-radius: 9999px;
  background: linear-gradient(135deg, var(--primary), var(--primary-dim));
  color: #fff; font-weight: 800; font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center;
  letter-spacing: -0.5px; border: 1px solid rgba(48,189,155,0.25);
}

/* Active nav link */
.nav-link[aria-current="page"] { color: var(--primary); font-weight: 700; }
.nav-link:hover { color: var(--primary); }

/* Line clamp */
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Floating stat card bob */
@keyframes float-bob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
.float-bob { animation: float-bob 4s ease-in-out infinite; }

/* Mobile drawer */
.mobile-menu { display:none; opacity:0; transform:translateY(-10px); transition:opacity .3s ease,transform .3s ease; }
.mobile-menu.open { display:flex !important; opacity:1; transform:translateY(0); }

/* Responsive */
@media (max-width:640px) {
  .px-margin-mobile { padding-left:1rem !important; padding-right:1rem !important; }
  h1 { font-size:1.85rem !important; line-height:1.25 !important; }
  h2 { font-size:1.5rem !important; line-height:1.3 !important; }
  .btn-mobile-full { width:100% !important; justify-content:center !important; }
}
@media (min-width:641px) and (max-width:1024px) {
  .px-margin-mobile { padding-left:2rem !important; padding-right:2rem !important; }
  h1 { font-size:2.5rem !important; }
}

/* Fluid media */
img, video, canvas { max-width:100%; height:auto; }

/* Infinite Marquee Ticker (Right to Left) */
@keyframes marqueeRightToLeft {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.animate-marquee-rtl {
  display: flex;
  width: max-content;
  animation: marqueeRightToLeft 28s linear infinite;
}

.animate-marquee-rtl:hover {
  animation-play-state: paused;
}