/* ─────────────────────────────────────────────
   AVARRA · Global Dark Theme
   Matches the Next.js design at localhost:3000
   ───────────────────────────────────────────── */

/* ── CSS variable overrides ─────────────────── */
:root {
  --ink:        #ffffff;
  --deep:       #f5f5f5;
  --body:       #d1d5db;
  --muted:      #9ca3af;
  --faint:      #6b7280;
  --surface:    #0a0a0a;
  --panel:      #111111;
  --white:      #000000;
  --border:     rgba(255,255,255,0.07);
  --border-med: rgba(255,255,255,0.12);
  --blue:       #3b82f6;
  --blue-dim:   rgba(59,130,246,0.10);
  --blue-glow:  rgba(59,130,246,0.20);
  --cyan:       #3b82f6;
  --cyan-dim:   rgba(59,130,246,0.08);
  --cyan-glow:  rgba(59,130,246,0.20);
  --gold:       #3b82f6;
  --accent:     #3b82f6;
  --accent-dim: rgba(59,130,246,0.10);
  --accent-mid: rgba(59,130,246,0.20);
  --soft:       #d1d5db;
  --radius:     12px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.3);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.5), 0 2px 4px rgba(0,0,0,0.3);
  --shadow-lg:  0 16px 40px rgba(0,0,0,0.6), 0 4px 8px rgba(0,0,0,0.3);
}

/* ── Base ───────────────────────────────────── */
html, body {
  background: #000000 !important;
  color: #e5e7eb !important;
}

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #0a0a0a; }
::-webkit-scrollbar-thumb { background: #262626; border-radius: 3px; }

/* ── Global text ─────────────────────────────── */
h1, h2, h3, h4, h5, h6 { color: #ffffff !important; }

p { color: #9ca3af; }

/* ── All sections dark ───────────────────────── */
section,
[class*="-section"],
[class*="_section"] {
  background: #000000 !important;
  border-color: rgba(255,255,255,0.07) !important;
}

/* Slightly lighter alternate sections */
section:nth-child(even),
.phase-section:nth-child(even),
.apply-section,
.comparison-section,
.ph-section,
.trust-section,
.trust-strip,
.calc-section,
.faq-section,
.faq-section-inner,
.guarantee-strip,
.how-it-works,
.stats-bar,
.stats-bar-inner,
.process-section,
.proof-section,
.roles-section,
.diff-section,
.problem-section,
.hero-section {
  background: #0a0a0a !important;
  border-color: rgba(255,255,255,0.07) !important;
}

/* ── Body text in sections ───────────────────── */
section p,
section li,
section span:not(.accent):not(.brand):not(.section-label):not(.section-tag):not(.section-eyebrow),
.wrap p,
.wrap li,
.phase-left p,
.p-body p,
.p-body h4,
.founder-story p,
.svc-list li,
.role-desc,
.role-period,
.step-desc,
.step-title,
.section-sub,
.section-head + p,
.stat-desc,
.ind-icon + *,
.ph-reason-text p,
.effective-date {
  color: #9ca3af !important;
}

/* ── Section labels / tags ───────────────────── */
.section-label,
.section-tag,
.section-eyebrow,
.eyebrow-label,
.phase-badge,
.p-badge,
.svc-tag,
.role-tag,
.feat-label,
.label {
  color: #3b82f6 !important;
  background: rgba(59,130,246,0.08) !important;
  border-color: rgba(59,130,246,0.2) !important;
}

.section-title,
.section-head,
.phase-left h2,
.p-body h4 { color: #ffffff !important; }

/* ── Nav ────────────────────────────────────── */
nav, #nav {
  background: rgba(0,0,0,0.88) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

.brand, .brand em, a.brand { color: #ffffff !important; }
.brand em:last-child { color: #3b82f6 !important; }

.nav-links a { color: #9ca3af !important; }
.nav-links a:hover, .nav-links a.active { color: #ffffff !important; }
.nav-links a:not(.nav-cta)::after { background: #3b82f6 !important; }

.nav-cta, .nav-links .nav-cta {
  background: linear-gradient(to top, #2563eb, #3b82f6) !important;
  color: #ffffff !important;
  border: 1px solid #3b82f6 !important;
  border-radius: 100px !important;
  box-shadow: 0 2px 12px rgba(59,130,246,0.3) !important;
}
.nav-cta:hover, .nav-links .nav-cta:hover {
  background: linear-gradient(to top, #1d4ed8, #2563eb) !important;
}

.mob-toggle span { background: #ffffff !important; }

.nav-dropdown {
  background: #111111 !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.7) !important;
}
.nav-dropdown::before { background: #111111 !important; border-color: rgba(255,255,255,0.08) !important; }
.nav-dropdown a { color: #9ca3af !important; }
.nav-dropdown a:hover { color: #3b82f6 !important; }
.nav-dd-col-head { color: #3b82f6 !important; border-bottom-color: rgba(59,130,246,0.15) !important; }

/* ── Page hero ───────────────────────────────── */
.page-hero {
  background: #000000 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.page-hero h1, .page-hero h2 { color: #ffffff !important; }
.page-hero h1 .accent, .page-hero h2 .accent { color: #3b82f6 !important; }
.page-hero p { color: rgba(255,255,255,0.78) !important; }
.page-hero .section-tag {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.9) !important;
}

/* ── All cards dark ──────────────────────────── */
[class*="card"],
[class*="-card"],
[class*="card-"],
.ph-stat,
.p-card,
.svc-card,
.include-card,
.industry-card,
.perk-card,
.apply-form,
.contact-form-wrap,
.comparison-table {
  background: linear-gradient(135deg, #111111, #0a0a0a) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
[class*="card"]:hover,
[class*="-card"]:hover,
.svc-card:hover,
.industry-card:hover,
.role-card:hover {
  border-color: rgba(59,130,246,0.35) !important;
}
[class*="card"] h3, [class*="card"] h4,
[class*="-card"] h3, [class*="-card"] h4,
.svc-card h3, .include-card h3, .industry-card h3 {
  color: #ffffff !important;
}
[class*="card"] p, [class*="-card"] p,
.svc-card p, .include-card p, .industry-card p {
  color: #9ca3af !important;
}

/* ── Stats / numbers ─────────────────────────── */
.stat-num, .num, .stat-number, .outcome-num, .metric-num,
.problem-num, .process-step-num, .p-num, .ph-stat .stat-num {
  color: #3b82f6 !important;
}
.stat-label, .label, .outcome-label, .metric-label,
.stat-desc, .outcome-note { color: #9ca3af !important; }
.metric-divider { background: rgba(255,255,255,0.1) !important; }

/* Stats bar (blue bar) */
.stats-bar {
  background: #0a0a0a !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.stats-bar .num, .stats-bar .stat-item .num { color: #ffffff !important; }
.stats-bar .label, .stats-bar .stat-item .label { color: #9ca3af !important; }

/* ── Process page specific ───────────────────── */
.phase-section { background: #000000 !important; }
.phase-section:nth-child(even) { background: #0a0a0a !important; }
.p-step { border-bottom-color: rgba(255,255,255,0.07) !important; }
.p-num {
  background: rgba(59,130,246,0.08) !important;
  border-color: rgba(59,130,246,0.2) !important;
  color: #3b82f6 !important;
}
.phase-left h2 { color: #ffffff !important; }
.phase-left p { color: #9ca3af !important; }
.p-body h4 { color: #e5e7eb !important; }
.p-body p { color: #9ca3af !important; }

/* ── Roles page specific ─────────────────────── */
.role-card {
  background: linear-gradient(135deg, #111111, #0a0a0a) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.role-name, .role-title { color: #ffffff !important; }
.role-rate, .role-period { color: #9ca3af !important; }
.role-skills .role-tag {
  background: rgba(59,130,246,0.08) !important;
  color: #60a5fa !important;
  border-color: rgba(59,130,246,0.15) !important;
}
.r-stars { color: #3b82f6 !important; }
.r-score, .r-platform { color: #9ca3af !important; }
.rating-badge { background: rgba(59,130,246,0.1) !important; border-color: rgba(59,130,246,0.2) !important; }
.rating-divider { background: rgba(255,255,255,0.08) !important; }

/* ── Services page ───────────────────────────── */
.svc-card { background: linear-gradient(135deg, #111111, #0a0a0a) !important; border-color: rgba(255,255,255,0.08) !important; }
.svc-icon { background: rgba(59,130,246,0.1) !important; border-color: rgba(59,130,246,0.2) !important; }
.svc-list li { color: #9ca3af !important; border-bottom-color: rgba(255,255,255,0.06) !important; }

/* ── Pricing page ────────────────────────────── */
.p-card {
  background: linear-gradient(135deg, #111111, #0a0a0a) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.p-card.featured, .p-card .featured {
  background: linear-gradient(135deg, rgba(59,130,246,0.12), rgba(37,99,235,0.08)) !important;
  border-color: rgba(59,130,246,0.4) !important;
}
.p-tier { color: #9ca3af !important; }
.price-amount { color: #ffffff !important; }
.savings { color: #3b82f6 !important; }
.p-features li { color: #9ca3af !important; border-bottom-color: rgba(255,255,255,0.06) !important; }
.check-yes { color: #3b82f6 !important; }
.check-no { color: #374151 !important; }
.p-btn-filled {
  background: linear-gradient(to top, #2563eb, #3b82f6) !important;
  color: #ffffff !important;
  border-color: #3b82f6 !important;
}
.p-btn-outline {
  background: transparent !important;
  color: #e5e7eb !important;
  border-color: rgba(255,255,255,0.2) !important;
}
.pricing-note { color: #6b7280 !important; }
.pricing-grid { border-color: rgba(255,255,255,0.07) !important; }

/* ── Comparison table ────────────────────────── */
.comparison-table { border-color: rgba(255,255,255,0.08) !important; }
.comparison-table thead tr { background: #111111 !important; }
.comparison-table th { color: #ffffff !important; border-color: rgba(255,255,255,0.08) !important; }
.comparison-table td { border-color: rgba(255,255,255,0.06) !important; color: #9ca3af !important; }
.comparison-table tr:nth-child(even) td { background: rgba(255,255,255,0.02) !important; }
.col-avarra { color: #3b82f6 !important; }
.col-other { color: #6b7280 !important; }

/* ── FAQ / Accordion ─────────────────────────── */
.faq-item {
  background: #111111 !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.faq-item.open { background: #111111 !important; }
.faq-q, .faq-question { color: #ffffff !important; }
.faq-a, .faq-ans { color: #9ca3af !important; }
.faq-plus { color: #3b82f6 !important; border-color: rgba(59,130,246,0.3) !important; }

/* ── CTA strip ───────────────────────────────── */
.cta-strip {
  background: #0a0a0a !important;
  border-color: rgba(255,255,255,0.07) !important;
}
.cta-strip h2 { color: #ffffff !important; }
.cta-strip p { color: #9ca3af !important; }
.cta-strip-inner h2 { color: #ffffff !important; }
.cta-strip-inner p { color: #9ca3af !important; }

/* ── Trust strip ─────────────────────────────── */
.trust-line, .trust-line-inner { background: #0a0a0a !important; border-color: rgba(255,255,255,0.07) !important; }
.trust-strip { background: #0a0a0a !important; border-color: rgba(255,255,255,0.07) !important; }

/* ── Industries ──────────────────────────────── */
.industry-card { background: linear-gradient(135deg, #111111, #0a0a0a) !important; border-color: rgba(255,255,255,0.08) !important; }
.ind-icon { background: rgba(59,130,246,0.08) !important; border-color: rgba(59,130,246,0.15) !important; }

/* ── Apply / forms ───────────────────────────── */
.apply-form, .contact-form-wrap, .apply-section {
  background: #0a0a0a !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.perk-card { background: #111111 !important; border-color: rgba(255,255,255,0.08) !important; }

/* ── Step layout ─────────────────────────────── */
.step-item { border-color: rgba(255,255,255,0.07) !important; }
.step-number {
  background: rgba(59,130,246,0.08) !important;
  border-color: rgba(59,130,246,0.2) !important;
  color: #3b82f6 !important;
}
.step-title { color: #ffffff !important; }
.step-desc { color: #9ca3af !important; }

/* ── About / story ───────────────────────────── */
.story-highlight {
  background: rgba(59,130,246,0.06) !important;
  border-left-color: #3b82f6 !important;
}
.story-highlight p { color: #d1d5db !important; }
.founder-story p { color: #9ca3af !important; }
.ph-reason-text p { color: #9ca3af !important; }
.ph-reason-text h4 { color: #e5e7eb !important; }
.ph-stat .stat-num { color: #3b82f6 !important; }
.ph-stat .stat-desc { color: #9ca3af !important; }
.ph-stats { border-color: rgba(255,255,255,0.07) !important; }

/* ── Privacy / Terms ─────────────────────────── */
.effective-date {
  background: #111111 !important;
  border-color: rgba(255,255,255,0.08) !important;
  color: #9ca3af !important;
}

/* ── Proof / testimonials ────────────────────── */
.proof-stars { color: #3b82f6 !important; }
.proof-quote { color: #d1d5db !important; }
.proof-name  { color: #ffffff !important; }
.proof-title { color: #6b7280 !important; }
.proof-avatar { background: linear-gradient(135deg, #1d4ed8, #2563eb) !important; color: #ffffff !important; }

/* ── Outcomes strip ──────────────────────────── */
.outcomes-inner { background: #0a0a0a !important; border-color: rgba(255,255,255,0.07) !important; }
.outcomes-footnote { color: #4b5563 !important; }
.outcome-num { color: #ffffff !important; }
.outcome-label { color: #9ca3af !important; }
.outcome-note { color: #6b7280 !important; }

/* ── Problem section ─────────────────────────── */
.problem-item { border-bottom-color: rgba(255,255,255,0.06) !important; }
.problem-item h4 { color: #e5e7eb !important; }
.problem-item p  { color: #9ca3af !important; }
.problem-num { color: #3b82f6 !important; }
.problem-sticky h2 { color: #ffffff !important; }
.problem-sticky p  { color: #9ca3af !important; }

/* ── Hero section ────────────────────────────── */
.hero-guarantee {
  background: rgba(59,130,246,0.06) !important;
  border: 1px solid rgba(59,130,246,0.2) !important;
}
.hero-trust-item { color: #9ca3af !important; }
.hero-guarantee-text strong { color: #ffffff !important; }
.hero-guarantee-text p { color: #9ca3af !important; }

/* ── Buttons ─────────────────────────────────── */
.btn-primary, button.btn-primary, a.btn-primary,
.hero-btn-primary {
  background: linear-gradient(to top, #2563eb, #3b82f6) !important;
  color: #ffffff !important;
  border: 1px solid #3b82f6 !important;
  box-shadow: 0 4px 20px rgba(59,130,246,0.35) !important;
}
.btn-outline, a.btn-outline, .hero-btn-secondary {
  background: transparent !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}
.btn-ghost, a.btn-ghost {
  color: #9ca3af !important;
  border-color: rgba(255,255,255,0.15) !important;
}

/* Filter / tab buttons */
.filter-btn, .filter-bar button {
  background: #111111 !important;
  color: #9ca3af !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
.filter-btn.active, .filter-btn:hover {
  background: rgba(59,130,246,0.1) !important;
  color: #3b82f6 !important;
  border-color: rgba(59,130,246,0.3) !important;
}

/* ── Inputs & forms ──────────────────────────── */
input, textarea, select {
  background: #111111 !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.12) !important;
}
input::placeholder, textarea::placeholder { color: #4b5563 !important; }
label { color: #9ca3af !important; }
.fg label { color: #9ca3af !important; }
select option { background: #111111 !important; color: #ffffff !important; }

/* ── Tables ──────────────────────────────────── */
table { border-color: rgba(255,255,255,0.08) !important; background: transparent !important; }
thead tr { background: #111111 !important; }
th { color: #ffffff !important; border-color: rgba(255,255,255,0.08) !important; background: #111111 !important; }
td { border-color: rgba(255,255,255,0.06) !important; color: #9ca3af !important; }
tr:nth-child(even) td { background: rgba(255,255,255,0.02) !important; }

/* ── Dividers ────────────────────────────────── */
hr { border-color: rgba(255,255,255,0.08) !important; }

/* ── Footer ──────────────────────────────────── */
footer {
  background: #0a0a0a !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  color: #6b7280 !important;
}
.footer-brand .brand, .footer-brand-block .brand, footer .brand { color: #ffffff !important; }
.footer-brand-block p, .footer-brand-desc { color: #6b7280 !important; }
.footer-brand-tag { color: #3b82f6 !important; }
.footer-col h5, .footer-heading, footer h5 { color: #ffffff !important; }
.footer-col ul a, .footer-links a, footer ul a, footer a { color: #6b7280 !important; }
.footer-col ul a:hover, .footer-links a:hover, footer ul a:hover, footer a:hover { color: #9ca3af !important; }
.footer-top { border-bottom-color: rgba(255,255,255,0.08) !important; }
.footer-bottom, .footer-divider { border-top: 1px solid rgba(255,255,255,0.08) !important; }
.footer-bottom p, .footer-links-bottom a, .footer-copy, .footer-address { color: #4b5563 !important; }
.footer-links-bottom a:hover { color: #9ca3af !important; }
.footer-social {
  color: #4b5563 !important;
  border-color: rgba(255,255,255,0.08) !important;
  background: rgba(255,255,255,0.03) !important;
}
.footer-social:hover { color: #3b82f6 !important; }
.footer-policy-links a { color: #4b5563 !important; }
.footer-policy-links a:hover { color: #9ca3af !important; }

/* ── Cookie banner ───────────────────────────── */
#av-cookie-banner {
  background: #111111 !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  color: #9ca3af !important;
}
.cookie-text a { color: #3b82f6 !important; }
.cookie-accept {
  background: linear-gradient(to top, #2563eb, #3b82f6) !important;
  color: #ffffff !important;
  border: none !important;
}
.cookie-decline {
  background: #111111 !important;
  color: #9ca3af !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
}

/* ── Inline links ────────────────────────────── */
a:not([class]) { color: #3b82f6; }
a:not([class]):hover { color: #60a5fa; }

/* ── Mobile nav ──────────────────────────────── */
@media (max-width: 1200px) {
  .nav-links {
    background: rgba(0,0,0,0.97) !important;
    border-bottom-color: rgba(255,255,255,0.08) !important;
  }
  .nav-links li { border-bottom-color: rgba(255,255,255,0.06) !important; }
  .nav-links a { color: #d1d5db !important; }
  .nav-links a:hover { color: #ffffff !important; }
}
