/* Kazakhstan IELTS — shared design system */

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background-color: #f8fafc;
}

[x-cloak] {
  display: none !important;
}

/* ---------- Mesh gradient backgrounds ---------- */
.bg-mesh {
  background-image:
    radial-gradient(at 12% 18%, rgba(37, 99, 235, 0.13) 0px, transparent 52%),
    radial-gradient(at 85% 8%, rgba(245, 158, 11, 0.14) 0px, transparent 50%),
    radial-gradient(at 50% 95%, rgba(99, 102, 241, 0.12) 0px, transparent 55%);
}

.bg-mesh-dark {
  background-image:
    radial-gradient(at 15% 15%, rgba(59, 130, 246, 0.35) 0px, transparent 50%),
    radial-gradient(at 85% 0%, rgba(245, 158, 11, 0.18) 0px, transparent 50%),
    radial-gradient(at 50% 100%, rgba(99, 102, 241, 0.28) 0px, transparent 55%);
}

/* ---------- Nav dropdown ---------- */
.dropdown-panel {
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
}
.dropdown-panel.dropdown-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* ---------- Floating WhatsApp button ---------- */
.whatsapp-float {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 60;
  background-color: #25d366;
  box-shadow: 0 10px 30px rgba(37, 211, 102, 0.45);
}
.whatsapp-float:hover {
  background-color: #1ebe57;
}
.whatsapp-float::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background-color: #25d366;
  animation: whatsapp-pulse 2.4s ease-out infinite;
  z-index: -1;
}
@keyframes whatsapp-pulse {
  0% { transform: scale(1); opacity: 0.55; }
  100% { transform: scale(1.9); opacity: 0; }
}

/* ---------- Gentle float animation for hero badges ---------- */
.float-a { animation: floatA 4.5s ease-in-out infinite; }
.float-b { animation: floatA 4.5s ease-in-out infinite; animation-delay: 1.1s; }
.float-c { animation: floatA 4.5s ease-in-out infinite; animation-delay: 2.2s; }
@keyframes floatA {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* ---------- Star rating icon reuse ---------- */
.star-icon { color: #f59e0b; }

/* ---------- Custom select caret (dark calculator panel) ---------- */
.select-caret-dark {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2394a3b8'%3E%3Cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.9rem center;
  background-size: 1.1rem;
  padding-right: 2.5rem;
}

/* ---------- Marquee-free scroll snap chip row (mobile hero badges) ---------- */
.chip-scroll {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.chip-scroll::-webkit-scrollbar {
  display: none;
}

/* ---------- Table -> card fallback divider ---------- */
.divider-dashed {
  border-top: 1px dashed #e2e8f0;
}

/* ---------- Video gallery category filter pills ---------- */
.filter-pill {
  background-color: #ffffff;
  color: #475569;
  border-color: #e2e8f0;
}
.filter-pill:hover {
  border-color: #93c5fd;
  color: #1d4ed8;
}
.filter-pill.is-active {
  background-color: #2563eb;
  color: #ffffff;
  border-color: #2563eb;
  box-shadow: 0 10px 40px -12px rgba(30, 58, 138, 0.18);
}

/* ---------- Schedule: booked slot ---------- */
.slot-busy {
  background-color: #f1f5f9;
  background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgba(148, 163, 184, 0.18) 6px 8px);
}