/* Dark theme: html.dark (Tailwind darkMode: class) */

html.dark {
  color-scheme: dark;
}

html.dark body {
  background-color: #020617;
  color: #f1f5f9;
}

html.dark #mobile-menu {
  background-color: #0f172a !important;
  border-color: #334155 !important;
}

html.dark .nav-scrolled {
  background: rgba(15, 23, 42, 0.92);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}

html.dark .bg-white {
  background-color: #0f172a !important;
}

html.dark .bg-slate-50 {
  background-color: #1e293b !important;
}

html.dark .bg-slate-50\/80 {
  background-color: rgba(30, 41, 59, 0.8) !important;
}

/* Trusted-by / logo strip (Tailwind bg-slate-50/60) */
html.dark .bg-slate-50\/60 {
  background-color: rgba(30, 41, 59, 0.92) !important;
}

html.dark .border-slate-100,
html.dark .border-slate-200 {
  border-color: #334155 !important;
}

html.dark .text-slate-900 {
  color: #f8fafc !important;
}

html.dark .text-slate-800 {
  color: #e2e8f0 !important;
}

html.dark .text-slate-700 {
  color: #cbd5e1 !important;
}

html.dark .text-slate-600 {
  color: #94a3b8 !important;
}

html.dark .text-slate-500 {
  color: #94a3b8 !important;
}

html.dark .text-slate-400 {
  color: #cbd5e1 !important;
}

/* Logo / “trusted by” strip: global slate text overrides must not wash out labels */
html.dark .trusted-by-strip {
  background-color: rgba(30, 41, 59, 0.92) !important;
  border-color: #334155 !important;
}

html.dark .trusted-by-strip .trusted-by-heading {
  color: #cbd5e1 !important;
}

html.dark .trusted-by-strip .trusted-by-name {
  color: #e2e8f0 !important;
}

html.dark .hover\:bg-slate-50:hover {
  background-color: #1e293b !important;
}

html.dark .hover\:bg-slate-100:hover {
  background-color: #334155 !important;
}

html.dark .hover\:text-slate-900:hover {
  color: #f8fafc !important;
}

html.dark .from-indigo-50 {
  --tw-gradient-from: #1e1b4b !important;
}

html.dark .to-purple-50 {
  --tw-gradient-to: #312e81 !important;
}

html.dark .from-indigo-100 {
  --tw-gradient-from: #312e81 !important;
}

html.dark .to-purple-100 {
  --tw-gradient-to: #4c1d95 !important;
}

html.dark .bg-indigo-50 {
  background-color: rgba(49, 46, 129, 0.35) !important;
}

html.dark .bg-indigo-100 {
  background-color: rgba(67, 56, 202, 0.35) !important;
}

html.dark .bg-purple-50 {
  background-color: rgba(88, 28, 135, 0.25) !important;
}

html.dark .bg-purple-100 {
  background-color: rgba(107, 33, 168, 0.3) !important;
}

html.dark .bg-sky-50 {
  background-color: rgba(12, 74, 110, 0.35) !important;
}

html.dark .bg-sky-100 {
  background-color: rgba(12, 74, 110, 0.45) !important;
}

/* Rose: service card (UX/UI) icon background */
html.dark .bg-rose-50 {
  background-color: rgba(136, 19, 55, 0.28) !important;
}

html.dark .bg-rose-100 {
  background-color: rgba(136, 19, 55, 0.38) !important;
}

/* Process section: card body tint (Tailwind bg-slate-50/90) */
html.dark .bg-slate-50\/90 {
  background-color: rgba(30, 41, 59, 0.92) !important;
}

html.dark .bg-emerald-100 {
  background-color: rgba(6, 78, 59, 0.45) !important;
}

html.dark .bg-red-100 {
  background-color: rgba(127, 29, 29, 0.4) !important;
}

html.dark .border-indigo-100 {
  border-color: #4338ca !important;
}

html.dark .bg-slate-100 {
  background-color: #334155 !important;
}

html.dark .bg-slate-200 {
  background-color: #475569 !important;
}

html.dark .shadow-sm {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4) !important;
}

html.dark .shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.45) !important;
}

html.dark .input-field {
  background-color: #0f172a;
  border-color: #475569;
  color: #f1f5f9;
}

html.dark .input-field::placeholder {
  color: #64748b;
}

html.dark .input-field:focus {
  border-color: #818cf8;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

html.dark select.input-field {
  background-color: #0f172a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 1.125rem 1.125rem;
  background-position: right 0.875rem center;
  background-attachment: scroll;
}

html.dark .file-upload-zone {
  border-color: #475569;
}

html.dark .file-upload-zone:hover,
html.dark .file-upload-zone:focus-within {
  border-color: #818cf8;
  background: rgba(99, 102, 241, 0.08);
}

html.dark .card-hover:hover {
  box-shadow: 0 20px 60px -10px rgba(99, 102, 241, 0.12);
}

/* Primary CTAs (nav, contact send, career submit): slate-900 pills blend into dark chrome; use solid indigo */
html.dark a.rounded-full.bg-slate-900.text-white:not([class*="dark:bg-white"]),
html.dark button.rounded-full.bg-slate-900.text-white {
  background-color: #4f46e5 !important;
  color: #ffffff !important;
}

html.dark a.rounded-full.bg-slate-900.text-white:not([class*="dark:bg-white"]):hover,
html.dark button.rounded-full.bg-slate-900.text-white:hover {
  background-color: #4338ca !important;
}