
:root {
  --primary: #2563eb; /* blue-600 */
  --primary-600: #1d4ed8;
  --secondary: #f97316; /* orange-500 */
  --secondary-600: #ea580c;

  --header-bg: #111827; /* gray-900 */
  --header-text: #ffffff;

  --bg-soft: #f8fafc; /* slate-50 */
  --border: #e5e7eb;   /* gray-200 */
  --shadow: 0 8px 30px rgba(0,0,0,0.08);
}

* { box-sizing: border-box; }
html, body { height: 100%; }

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: #ffffff;
  color: #111827;
}

.font-inter { font-family: Inter, ui-sans-serif, system-ui; }


::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }


.btn {
  @apply inline-flex items-center justify-center gap-2 rounded-md px-4 py-2 text-sm font-semibold transition;
}
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-600); }
.btn-secondary { background: var(--secondary); color: #fff; }
.btn-secondary:hover { background: var(--secondary-600); }


.card {
  @apply overflow-hidden rounded-xl border bg-white shadow;
  border-color: var(--border);
}
.card:hover { box-shadow: var(--shadow); transform: translateY(-1px); }


#mainCarousel .slide {
  min-width: 100%;
}


.footer-collapsed .footer-content {
  display: none;
}


.container-soft {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
}


@media (max-width: 640px) {
  .container-soft { padding: .75rem; }
}


.dark body {
  background: #0b1220;
  color: #e5e7eb;
}
.dark .card {
  background: #0f172a;
  border-color: #1f2937;
}
.dark .container-soft {
  background: #0b1324;
  border-color: #1f2937;
}
.dark ::-webkit-scrollbar-thumb { background: #334155; }