/* ================================================================
   TRANSCENDENT VENTURES — Tana-Style Colour Theme 2026
   Dark hero / white body alternation (tanatech.io style)
   COLOUR PROPERTIES ONLY — layout/spacing/animations untouched
   ================================================================ */

/* ── 1. NEW COLOUR TOKENS ──────────────────────────────────────── */
:root {
  /* Dark surfaces */
  --tv-dark-900:  #0D0D2B;
  --tv-dark-800:  #13133A;
  --tv-dark-700:  #1A1A3E;
  --tv-dark-card: #1E1E4A;
  --tv-dark-border: rgba(139, 126, 255, 0.20);

  /* Light surfaces */
  --tv-light-50:   #FFFFFF;
  --tv-light-100:  #F5F4FF;
  --tv-light-card: #FFFFFF;
  --tv-light-border: rgba(100, 88, 220, 0.15);

  /* Typography — dark surfaces */
  --tv-text-on-dark-primary:   #FFFFFF;
  --tv-text-on-dark-secondary: #C8C5FF;
  --tv-text-on-dark-muted:     #9B97CC;

  /* Typography — light surfaces */
  --tv-text-on-light-primary:   #1A1A3E;
  --tv-text-on-light-secondary: #3D3B6B;
  --tv-text-on-light-muted:     #6B6898;

  /* Brand accents */
  --tv-purple:        #6B5FE4;
  --tv-purple-strong: #5248C8;
  --tv-purple-light:  #A89EFF;
  --tv-teal:          #00C4AF;
  --tv-teal-dark:     #009B8E;
  --tv-gold-accent:   #FFD166;

  /* Buttons */
  --tv-btn-primary-bg:          #5248C8;
  --tv-btn-primary-text:        #FFFFFF;
  --tv-btn-secondary-border:    #6B5FE4;
  --tv-btn-secondary-text:      #5248C8;
  --tv-btn-secondary-text-dark: #A89EFF;

  /* Update legacy tokens to new palette */
  --bg:        var(--tv-dark-900);
  --bg-2:      var(--tv-dark-800);
  --bg-3:      var(--tv-dark-700);
  --teal:      var(--tv-purple-light);
  --teal-dim:  rgba(168, 158, 255, 0.14);
  --teal-glow: rgba(168, 158, 255, 0.40);
  --gold:      var(--tv-teal);
  --gold-dim:  rgba(0, 196, 175, 0.14);
  --grey:      var(--tv-text-on-dark-secondary);
  --glass:     rgba(30, 30, 74, 0.40);
  --glass-2:   rgba(30, 30, 74, 0.65);
  --glass-b:   var(--tv-dark-border);
}

/* ── 2. GLOBAL LOCK RESET — neutralise tv.css element-level dark bg ─ */
/*
   tv.css sets: section, main, article, header, footer { background-color: #06060F }
   and [class*="-section"] { background-color: #06060F }
   Inside light sections, header/article/footer child elements must be transparent.
*/
[aria-labelledby="services-heading"] header,
[aria-labelledby="services-heading"] footer,
[aria-labelledby="services-heading"] article,
[aria-labelledby="services-heading"] .tv-section-header,
#sv-services header, #sv-services footer, #sv-services article,
#sv-services .tv-section-header,
[aria-labelledby="sv-pathways-h2"] header, [aria-labelledby="sv-pathways-h2"] footer,
[aria-labelledby="sv-pathways-h2"] article, [aria-labelledby="sv-pathways-h2"] .tv-section-header,
[aria-labelledby="sv-process-h2"] header, [aria-labelledby="sv-process-h2"] footer,
[aria-labelledby="sv-process-h2"] article, [aria-labelledby="sv-process-h2"] .tv-section-header,
[aria-labelledby="sv-stack-h2"] header, [aria-labelledby="sv-stack-h2"] footer,
[aria-labelledby="sv-stack-h2"] article, [aria-labelledby="sv-stack-h2"] .tv-section-header,
#about-mission header, #about-mission footer, #about-mission article,
#about-mission .tv-section-header,
#about-values header, #about-values footer, #about-values article,
#about-values .tv-section-header,
.tv-faq-section header, .tv-faq-section footer, .tv-faq-section article,
.tv-faq-section .tv-section-header,
.tv-contact-right header, .tv-contact-right footer, .tv-contact-right article,
.hscroll-section header, .hscroll-section footer, .hscroll-section article,
.hscroll-section .hscroll-header,
.impact-section header, .impact-section footer, .impact-section article,
.impact-section .tv-section-header,
.process-section header, .process-section footer, .process-section article,
.process-section .tv-section-header,
.testimonials-section header, .testimonials-section footer, .testimonials-section article,
.testimonials-section .tv-section-header {
  background-color: transparent !important;
  background: transparent !important;
}

/* Separator gaps show body bg — collapse to nothing */
.separator { margin: 0 !important; background: transparent !important; }

/* ── 3. BASE ───────────────────────────────────────────────────── */
html { background: var(--tv-dark-900) !important; }
body { background: var(--tv-dark-900) !important; color: var(--tv-text-on-dark-primary) !important; }
::selection { background: var(--tv-purple) !important; color: #FFFFFF !important; }

/* ── 3. NAVIGATION (DARK) ──────────────────────────────────────── */
#tv-nav { background: var(--tv-dark-800) !important; }
#tv-nav.scrolled {
  background: rgba(19, 19, 58, 0.95) !important;
  border-bottom-color: var(--tv-dark-border) !important;
}
#tv-wipe { background: var(--tv-purple) !important; }
#tv-progress { background: linear-gradient(90deg, var(--tv-purple-light), var(--tv-teal)) !important; }

.nav-logo { color: var(--tv-text-on-dark-primary) !important; }
.nav-logo span { color: var(--tv-purple-light) !important; }
.nav-logo .dot { background: var(--tv-teal) !important; }
.nav-links a { color: var(--tv-text-on-dark-secondary) !important; }
.nav-links a:hover,
.nav-links a[aria-current="page"] { color: var(--tv-text-on-dark-primary) !important; }
.nav-links a::after { background: var(--tv-purple-light) !important; }
.nav-cta { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
.nav-cta:hover { box-shadow: 0 0 24px rgba(82, 72, 200, 0.5) !important; }
.nav-burger span { background: var(--tv-text-on-dark-primary) !important; }
.nav-mobile { background: rgba(13, 13, 43, 0.98) !important; }
.nav-mobile a { color: var(--tv-text-on-dark-primary) !important; }
.nav-mobile a:hover,
.nav-mobile a[aria-current="page"] { color: var(--tv-purple-light) !important; }

/* ── 4. GLOBAL BUTTONS ─────────────────────────────────────────── */
.tv-btn-teal {
  background: var(--tv-btn-primary-bg) !important;
  color: var(--tv-btn-primary-text) !important;
}
.tv-btn-teal:hover { box-shadow: 0 0 32px rgba(82, 72, 200, 0.4) !important; }
.tv-btn-outline {
  border-color: var(--tv-btn-secondary-text-dark) !important;
  color: var(--tv-btn-secondary-text-dark) !important;
}
.tv-btn-outline:hover {
  border-color: var(--tv-purple-light) !important;
  color: var(--tv-purple-light) !important;
}
.tv-btn-gold {
  background: var(--tv-teal) !important;
  color: #FFFFFF !important;
}

/* ── 5. GLOBAL GLASS CARDS (dark bg default) ───────────────────── */
.tv-glass {
  background: rgba(30, 30, 74, 0.40) !important;
  border-color: var(--tv-dark-border) !important;
}
.tv-glass::before {
  background: linear-gradient(135deg, rgba(168, 158, 255, 0.04) 0%, transparent 60%) !important;
}
.tv-glass:hover {
  border-color: rgba(168, 158, 255, 0.35) !important;
  box-shadow: 0 0 40px rgba(168, 158, 255, 0.08) !important;
}

/* ── 6. GLOBAL TYPOGRAPHY DEFAULTS (dark surface) ──────────────── */
.tv-label { color: var(--tv-purple-light) !important; }
.tv-teal  { color: var(--tv-purple-light) !important; }
.tv-gold  { color: var(--tv-teal) !important; }
.tv-stat-num { color: var(--tv-purple-light) !important; }
.tv-stat-label { color: var(--tv-text-on-dark-muted) !important; }
.tv-tag {
  border-color: var(--tv-dark-border) !important;
  color: var(--tv-text-on-dark-secondary) !important;
  background: rgba(30, 30, 74, 0.40) !important;
}
.tv-tag:hover, .tv-tag.active {
  border-color: var(--tv-purple-light) !important;
  color: var(--tv-purple-light) !important;
  background: rgba(168, 158, 255, 0.10) !important;
}

/* ── 7. CURSOR ──────────────────────────────────────────────────── */
#tv-cursor-dot {
  background: var(--tv-purple-light) !important;
  box-shadow: 0 0 12px rgba(168,158,255,0.6), 0 0 24px rgba(168,158,255,0.3) !important;
}
#tv-cursor-ring { border-color: rgba(168, 158, 255, 0.5) !important; }
body.cursor-hover #tv-cursor-dot {
  background: var(--tv-teal) !important;
  box-shadow: 0 0 20px rgba(0, 196, 175, 0.5) !important;
}
body.cursor-hover #tv-cursor-ring { border-color: rgba(0, 196, 175, 0.4) !important; }

/* ── 8. MISC GLOBAL ELEMENTS ───────────────────────────────────── */
.tv-typewriter-cursor { background: var(--tv-purple-light) !important; }
.tv-timeline::before { background: linear-gradient(to bottom, var(--tv-purple-light), transparent) !important; }
.tv-timeline-item::before {
  background: var(--tv-purple-light) !important;
  box-shadow: 0 0 16px rgba(168, 158, 255, 0.4) !important;
}
.tv-timeline-year { color: var(--tv-purple-light) !important; }
.tv-scroll-hint { color: var(--tv-text-on-dark-muted) !important; }
.tv-scroll-hint span { background: var(--tv-text-on-dark-muted) !important; }
.skip-nav { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
*:focus-visible { outline-color: var(--tv-purple-light) !important; }
#tv-wa-tip {
  background: var(--tv-dark-700) !important;
  border-color: var(--tv-dark-border) !important;
  color: var(--tv-text-on-dark-primary) !important;
}
#tv-wa-tip::after { border-left-color: var(--tv-dark-700) !important; }
.separator { background: linear-gradient(90deg, transparent, var(--tv-dark-border), transparent) !important; }

/* ── 9. SERVICE ICON BACKGROUNDS ───────────────────────────────── */
.icon-teal { background: rgba(168, 158, 255, 0.12) !important; border-color: rgba(168, 158, 255, 0.20) !important; }
.icon-gold { background: rgba(0, 196, 175, 0.12) !important; border-color: rgba(0, 196, 175, 0.20) !important; }

/* ── 10. CHIP COLOURS ───────────────────────────────────────────── */
.tv-chip-teal { background: rgba(168,158,255,0.12) !important; color: var(--tv-purple-light) !important; }
.tv-chip-gold { background: rgba(0,196,175,0.12) !important; color: var(--tv-teal) !important; }

/* ════════════════════════════════════════════════════════════════
   PER-SECTION COLOURS — DARK vs LIGHT
   ════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────
   INDEX PAGE
────────────────────────────────────────────────────────────── */

/* Hero (DARK) */
#tv-hero { background: var(--tv-dark-900) !important; }
#tv-hero h1, #tv-hero .tv-h1 { color: var(--tv-text-on-dark-primary) !important; }
#tv-hero p { color: var(--tv-text-on-dark-secondary) !important; }
#tv-hero .tv-hero-badge {
  border-color: rgba(168,158,255,0.30) !important;
  background: rgba(168,158,255,0.06) !important;
  color: var(--tv-purple-light) !important;
}
#tv-hero .tv-hero-badge .pulse-dot { background: var(--tv-purple-light) !important; }
#tv-hero .tv-hero-stats .sep { background: var(--tv-dark-border) !important; }

/* Services section (LIGHT) */
[aria-labelledby="services-heading"] { background: var(--tv-light-50) !important; }
[aria-labelledby="services-heading"] h2,
[aria-labelledby="services-heading"] h3,
[aria-labelledby="services-heading"] h4 { color: var(--tv-text-on-light-primary) !important; }
[aria-labelledby="services-heading"] p { color: var(--tv-text-on-light-secondary) !important; }
[aria-labelledby="services-heading"] .tv-label { color: var(--tv-purple-strong) !important; }
[aria-labelledby="services-heading"] .tv-teal { color: var(--tv-purple-strong) !important; }
[aria-labelledby="services-heading"] .tv-glass,
[aria-labelledby="services-heading"] .tv-service-card {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
[aria-labelledby="services-heading"] .tv-glass::before {
  background: linear-gradient(135deg, rgba(82,72,200,0.03) 0%, transparent 60%) !important;
}
[aria-labelledby="services-heading"] .tv-glass:hover {
  border-color: rgba(82,72,200,0.25) !important;
  box-shadow: 0 0 40px rgba(82,72,200,0.06) !important;
}
[aria-labelledby="services-heading"] .tv-service-card p { color: var(--tv-text-on-light-secondary) !important; }
[aria-labelledby="services-heading"] .icon-teal {
  background: rgba(82,72,200,0.08) !important;
  border-color: rgba(82,72,200,0.15) !important;
}
[aria-labelledby="services-heading"] .icon-gold {
  background: rgba(0,155,142,0.08) !important;
  border-color: rgba(0,155,142,0.15) !important;
}
[aria-labelledby="services-heading"] .tv-tag {
  border-color: var(--tv-light-border) !important;
  color: var(--tv-purple-strong) !important;
  background: rgba(82,72,200,0.06) !important;
}
[aria-labelledby="services-heading"] .tv-tag:hover {
  border-color: var(--tv-purple-strong) !important;
  background: rgba(82,72,200,0.10) !important;
}
[aria-labelledby="services-heading"] .tv-btn-teal {
  background: var(--tv-btn-primary-bg) !important;
  color: var(--tv-btn-primary-text) !important;
}

/* CTA Banner (DARK) */
.tv-cta-banner { background: var(--tv-dark-700) !important; }
.tv-cta-banner h2, .tv-cta-banner .tv-h2 { color: var(--tv-text-on-dark-primary) !important; }
.tv-cta-banner p { color: var(--tv-text-on-dark-secondary) !important; }
.tv-cta-banner .tv-label { color: var(--tv-purple-light) !important; }
.tv-cta-banner .tv-btn-teal {
  background: var(--tv-btn-primary-bg) !important;
  color: var(--tv-btn-primary-text) !important;
}
.tv-cta-banner .tv-btn-outline {
  border-color: var(--tv-btn-secondary-text-dark) !important;
  color: var(--tv-btn-secondary-text-dark) !important;
}

/* ──────────────────────────────────────────────────────────────
   SERVICES PAGE
────────────────────────────────────────────────────────────── */

/* Hero (DARK) */
#sv-hero { background: var(--tv-dark-900) !important; }
#sv-hero h1, #sv-hero .tv-h1 { color: var(--tv-text-on-dark-primary) !important; }
#sv-hero p { color: var(--tv-text-on-dark-secondary) !important; }
#sv-hero .tv-label { color: var(--tv-purple-light) !important; }
#sv-hero .tv-teal { color: var(--tv-purple-light) !important; }
#sv-hero .tv-btn-teal { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
#sv-hero .tv-btn-outline { border-color: var(--tv-btn-secondary-text-dark) !important; color: var(--tv-btn-secondary-text-dark) !important; }

/* Services grid (LIGHT) */
#sv-services { background: var(--tv-light-50) !important; }
#sv-services h2, #sv-services h3, #sv-services h4 { color: var(--tv-text-on-light-primary) !important; }
#sv-services p { color: var(--tv-text-on-light-secondary) !important; }
#sv-services .tv-label { color: var(--tv-purple-strong) !important; }
#sv-services .tv-teal { color: var(--tv-purple-strong) !important; }
#sv-services .tv-glass,
#sv-services [class*="sv-card"] {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
#sv-services .tv-glass::before {
  background: linear-gradient(135deg, rgba(82,72,200,0.03) 0%, transparent 60%) !important;
}
#sv-services .tv-glass:hover {
  border-color: rgba(82,72,200,0.25) !important;
  box-shadow: 0 0 40px rgba(82,72,200,0.06) !important;
}
#sv-services .sv-card-tag { border-color: var(--tv-light-border) !important; color: var(--tv-purple-strong) !important; background: rgba(82,72,200,0.06) !important; }
#sv-services .sv-card-title { color: var(--tv-text-on-light-primary) !important; }
#sv-services .sv-card-desc { color: var(--tv-text-on-light-secondary) !important; }
#sv-services .sv-card-feature { color: var(--tv-text-on-light-secondary) !important; }
#sv-services .sv-card-feature svg { color: var(--tv-teal-dark) !important; }
#sv-services .sv-card-btn { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
#sv-services .sv-stack-pill {
  background: rgba(82,72,200,0.08) !important;
  border-color: rgba(82,72,200,0.15) !important;
  color: var(--tv-text-on-light-primary) !important;
}
#sv-services .sv-stack-pill.gold {
  background: rgba(0,155,142,0.08) !important;
  border-color: rgba(0,155,142,0.15) !important;
  color: var(--tv-teal-dark) !important;
}
/* Feature list items (div was white on white — invisible) */
#sv-services .sv-features-list li { color: var(--tv-text-on-light-secondary) !important; }
#sv-services .sv-feat-teal li::before { background: var(--tv-purple-strong) !important; box-shadow: none !important; }
#sv-services .sv-feat-gold li::before { background: var(--tv-teal-dark) !important; box-shadow: none !important; }
/* Card badges on white cards */
#sv-services .sv-card-badge-teal {
  background: rgba(82, 72, 200, 0.10) !important;
  color: var(--tv-purple-strong) !important;
  border-color: rgba(82, 72, 200, 0.22) !important;
}
#sv-services .sv-card-badge-gold {
  background: rgba(0, 155, 142, 0.10) !important;
  color: var(--tv-teal-dark) !important;
  border-color: rgba(0, 155, 142, 0.22) !important;
}
/* Pulse dot on "Most Popular" badge — make it visible on white */
#sv-services .sv-card-badge-teal > span { background: var(--tv-purple-strong) !important; }
/* Card footer chips */
#sv-services .tv-chip-teal { background: rgba(82,72,200,0.10) !important; color: var(--tv-purple-strong) !important; }
#sv-services .tv-chip-gold { background: rgba(0,155,142,0.10) !important; color: var(--tv-teal-dark) !important; }
/* Gold button (System Integration, Team Training) */
#sv-services .tv-btn-gold { background: var(--tv-teal-dark) !important; color: #FFFFFF !important; }
/* Accent strip */
#sv-services .sv-accent-teal { background: linear-gradient(180deg, var(--tv-purple-strong) 0%, transparent 100%) !important; }
#sv-services .sv-accent-gold { background: linear-gradient(180deg, var(--tv-teal-dark) 0%, transparent 100%) !important; }
/* Card left/right divider */
#sv-services .sv-card-left { border-right-color: var(--tv-light-border) !important; }

/* Engagement Pathways (DARK — alternates with light services section) */
[aria-labelledby="sv-pathways-h2"] { background: var(--tv-dark-800) !important; }
[aria-labelledby="sv-pathways-h2"] h2,
[aria-labelledby="sv-pathways-h2"] h3 { color: var(--tv-text-on-dark-primary) !important; }
[aria-labelledby="sv-pathways-h2"] p { color: var(--tv-text-on-dark-secondary) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-label { color: var(--tv-purple-light) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-teal { color: var(--tv-purple-light) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-gold { color: var(--tv-teal) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-glass {
  background: rgba(30, 30, 74, 0.60) !important;
  border-color: var(--tv-dark-border) !important;
}
[aria-labelledby="sv-pathways-h2"] th { color: var(--tv-text-on-dark-primary) !important; }
[aria-labelledby="sv-pathways-h2"] td { color: var(--tv-text-on-dark-secondary) !important; }
[aria-labelledby="sv-pathways-h2"] .col-teal-cell { color: var(--tv-purple-light) !important; }
[aria-labelledby="sv-pathways-h2"] .col-gold-cell { color: var(--tv-teal) !important; }
[aria-labelledby="sv-pathways-h2"] .col-white-cell { color: var(--tv-text-on-dark-primary) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-btn-teal { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
[aria-labelledby="sv-pathways-h2"] .tv-btn-gold { background: var(--tv-teal-dark) !important; color: #FFFFFF !important; }
[aria-labelledby="sv-pathways-h2"] .tv-btn-outline { border-color: var(--tv-btn-secondary-text-dark) !important; color: var(--tv-btn-secondary-text-dark) !important; }

/* Process steps (LIGHT) */
[aria-labelledby="sv-process-h2"] { background: var(--tv-light-50) !important; }
[aria-labelledby="sv-process-h2"] h2,
[aria-labelledby="sv-process-h2"] h3,
[aria-labelledby="sv-process-h2"] h4 { color: var(--tv-text-on-light-primary) !important; }
[aria-labelledby="sv-process-h2"] p { color: var(--tv-text-on-light-secondary) !important; }
[aria-labelledby="sv-process-h2"] .tv-label { color: var(--tv-purple-strong) !important; }
[aria-labelledby="sv-process-h2"] .tv-teal { color: var(--tv-purple-strong) !important; }
/* Step number circles */
[aria-labelledby="sv-process-h2"] .sv-step-num {
  background: rgba(82, 72, 200, 0.10) !important;
  border-color: var(--tv-purple-strong) !important;
  color: var(--tv-purple-strong) !important;
  box-shadow: 0 0 20px rgba(82, 72, 200, 0.12) !important;
}
/* Step titles — were white on white (invisible) */
[aria-labelledby="sv-process-h2"] .sv-step-title { color: var(--tv-text-on-light-primary) !important; }
/* Step descriptions — were #C8C5FF on white (near-invisible) */
[aria-labelledby="sv-process-h2"] .sv-step-desc { color: var(--tv-text-on-light-secondary) !important; }
/* Duration badges */
[aria-labelledby="sv-process-h2"] .sv-step-duration {
  color: var(--tv-purple-strong) !important;
  background: rgba(82, 72, 200, 0.08) !important;
  border-color: rgba(82, 72, 200, 0.20) !important;
}
/* Connecting line between steps */
[aria-labelledby="sv-process-h2"] .sv-steps-track::before { background: rgba(82, 72, 200, 0.20) !important; }

/* Tech stack (DARK — alternates with light process section) */
[aria-labelledby="sv-stack-h2"] { background: var(--tv-dark-800) !important; }
[aria-labelledby="sv-stack-h2"] h2,
[aria-labelledby="sv-stack-h2"] h3 { color: var(--tv-text-on-dark-primary) !important; }
[aria-labelledby="sv-stack-h2"] p { color: var(--tv-text-on-dark-secondary) !important; }
[aria-labelledby="sv-stack-h2"] .tv-label { color: var(--tv-purple-light) !important; }
[aria-labelledby="sv-stack-h2"] .tv-teal { color: var(--tv-purple-light) !important; }
[aria-labelledby="sv-stack-h2"] .sv-stack-pill {
  background: rgba(30, 30, 74, 0.60) !important;
  border-color: var(--tv-dark-border) !important;
  color: var(--tv-text-on-dark-secondary) !important;
}
[aria-labelledby="sv-stack-h2"] .sv-stack-pill.gold {
  background: rgba(0, 196, 175, 0.12) !important;
  border-color: rgba(0, 196, 175, 0.25) !important;
  color: var(--tv-teal) !important;
}
[aria-labelledby="sv-stack-h2"] .sv-stack-dot { background: var(--tv-purple-light) !important; }

/* Services CTA (DARK) */
#sv-cta { background: var(--tv-dark-700) !important; }
#sv-cta h2, #sv-cta .tv-h2 { color: var(--tv-text-on-dark-primary) !important; }
#sv-cta p { color: var(--tv-text-on-dark-secondary) !important; }
#sv-cta .tv-label { color: var(--tv-purple-light) !important; }
#sv-cta .tv-teal { color: var(--tv-purple-light) !important; }
#sv-cta .tv-btn-teal { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
#sv-cta .tv-btn-outline { border-color: var(--tv-btn-secondary-text-dark) !important; color: var(--tv-btn-secondary-text-dark) !important; }

/* ──────────────────────────────────────────────────────────────
   ABOUT PAGE
────────────────────────────────────────────────────────────── */

/* Hero (DARK) */
#about-hero { background: var(--tv-dark-900) !important; }
#about-hero h1, #about-hero .tv-h1 { color: var(--tv-text-on-dark-primary) !important; }
#about-hero p { color: var(--tv-text-on-dark-secondary) !important; }
#about-hero em { color: var(--tv-purple-light) !important; }
#about-hero .tv-label { color: var(--tv-purple-light) !important; }

/* Mission (LIGHT) */
#about-mission { background: var(--tv-light-50) !important; }
#about-mission h1, #about-mission h2,
#about-mission h3, #about-mission h4 { color: var(--tv-text-on-light-primary) !important; }
#about-mission p { color: var(--tv-text-on-light-secondary) !important; }
#about-mission .tv-label { color: var(--tv-purple-strong) !important; }
#about-mission .mission-quote { color: var(--tv-text-on-light-primary) !important; }
#about-mission .mission-quote span { color: var(--tv-purple-strong) !important; }
#about-mission .mission-quote::before { color: var(--tv-purple) !important; }
#about-mission .accent-line { background: var(--tv-purple-strong) !important; }
#about-mission .pillar-card {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
#about-mission .pillar-card::before {
  background: linear-gradient(135deg, rgba(82,72,200,0.04) 0%, transparent 60%) !important;
}
#about-mission .pillar-card:hover {
  border-color: rgba(82,72,200,0.28) !important;
}
#about-mission .pillar-card h4 { color: var(--tv-text-on-light-primary) !important; }
#about-mission .pillar-card p { color: var(--tv-text-on-light-secondary) !important; }
#about-mission .tag-teal {
  background: rgba(82,72,200,0.08) !important;
  color: var(--tv-purple-strong) !important;
  border-color: rgba(82,72,200,0.15) !important;
}
#about-mission .tag-gold {
  background: rgba(0,155,142,0.08) !important;
  color: var(--tv-teal-dark) !important;
  border-color: rgba(0,155,142,0.15) !important;
}

/* Values (LIGHT alternate) */
#about-values { background: var(--tv-light-100) !important; }
#about-values h2, #about-values h3 { color: var(--tv-text-on-light-primary) !important; }
#about-values p { color: var(--tv-text-on-light-secondary) !important; }
#about-values .tv-label { color: var(--tv-purple-strong) !important; }
#about-values .value-card {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
#about-values .value-card:hover { border-color: rgba(82,72,200,0.25) !important; }
#about-values .value-card h3 { color: var(--tv-text-on-light-primary) !important; }
#about-values .value-card p { color: var(--tv-text-on-light-secondary) !important; }
#about-values .value-num { color: var(--tv-purple-strong) !important; }
#about-values [style*="linear-gradient"] { background: linear-gradient(90deg, rgba(82,72,200,0.2), transparent) !important; }

/* CTA (DARK) */
#about-cta { background: var(--tv-dark-700) !important; }
#about-cta h2, #about-cta .tv-h2 { color: var(--tv-text-on-dark-primary) !important; }
#about-cta p { color: var(--tv-text-on-dark-secondary) !important; }
#about-cta .tv-label { color: var(--tv-purple-light) !important; }
#about-cta .cta-card {
  background: rgba(30, 30, 74, 0.65) !important;
  border-color: var(--tv-dark-border) !important;
}
#about-cta .tv-btn-teal { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }

/* ──────────────────────────────────────────────────────────────
   CONTACT PAGE
────────────────────────────────────────────────────────────── */

/* Outer wrapper (LIGHT) */
.tv-contact-hero { background: var(--tv-light-100) !important; }

/* Left panel (DARK) */
.tv-contact-left {
  background: linear-gradient(135deg, var(--tv-dark-900) 0%, var(--tv-dark-800) 100%) !important;
}
.tv-contact-left h1, .tv-contact-left h2,
.tv-contact-left h3 { color: var(--tv-text-on-dark-primary) !important; }
.tv-contact-left p { color: var(--tv-text-on-dark-secondary) !important; }
.tv-contact-left .tv-label { color: var(--tv-purple-light) !important; }
.tv-contact-left .tv-contact-info-item,
.tv-contact-left .tv-contact-info-item span { color: var(--tv-text-on-dark-secondary) !important; }
.tv-contact-left .tv-contact-info-item .icon { color: var(--tv-purple-light) !important; }

/* Response badge */
.tv-response-badge {
  background: rgba(168,158,255,0.12) !important;
  border-color: rgba(168,158,255,0.25) !important;
  color: var(--tv-purple-light) !important;
}

/* Right panel / form (LIGHT) */
.tv-contact-right { background: var(--tv-light-50) !important; }
.tv-contact-right h2,
.tv-contact-right h3 { color: var(--tv-text-on-light-primary) !important; }
.tv-contact-right p { color: var(--tv-text-on-light-secondary) !important; }
.tv-contact-right .tv-label { color: var(--tv-purple-strong) !important; }

/* Form inputs (on light bg) */
#tv-contact-form .tv-field input,
#tv-contact-form .tv-field textarea,
#tv-contact-form .tv-field select {
  background: #FFFFFF !important;
  border-color: rgba(100, 88, 220, 0.30) !important;
  color: var(--tv-text-on-light-primary) !important;
}
#tv-contact-form .tv-field label {
  color: var(--tv-text-on-light-muted) !important;
}
#tv-contact-form .tv-field input:focus,
#tv-contact-form .tv-field textarea:focus,
#tv-contact-form .tv-field select:focus {
  border-color: var(--tv-purple-strong) !important;
  box-shadow: 0 0 0 3px rgba(82, 72, 200, 0.12) !important;
}
#tv-contact-form .tv-field input:focus ~ label,
#tv-contact-form .tv-field input:not(:placeholder-shown) ~ label,
#tv-contact-form .tv-field textarea:focus ~ label {
  color: var(--tv-purple-strong) !important;
}
#tv-contact-form .tv-field select option { background: #FFFFFF !important; color: var(--tv-text-on-light-primary) !important; }
.tv-submit-btn { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
.tv-submit-btn:hover { box-shadow: 0 0 32px rgba(82,72,200,0.4) !important; }

/* Success state */
.tv-form-success { background: var(--tv-light-50) !important; }
.tv-form-success h4 { color: var(--tv-text-on-light-primary) !important; }
.tv-form-success p { color: var(--tv-text-on-light-secondary) !important; }
.tv-success-icon { color: var(--tv-teal-dark) !important; border-color: var(--tv-teal-dark) !important; }

/* FAQ (LIGHT) */
.tv-faq-section { background: var(--tv-light-50) !important; }
.tv-faq-section h2 { color: var(--tv-text-on-light-primary) !important; }
.tv-faq-section .tv-label { color: var(--tv-purple-strong) !important; }
.tv-faq-item {
  background: #FFFFFF !important;
  border-color: rgba(100, 88, 220, 0.15) !important;
}
.tv-faq-item.open {
  background: #F0EEFF !important;
  border-color: rgba(100, 88, 220, 0.30) !important;
}
.tv-faq-question { color: var(--tv-text-on-light-primary) !important; }
.tv-faq-answer,
.tv-faq-answer-inner { color: var(--tv-text-on-light-secondary) !important; }
.tv-faq-icon { color: var(--tv-purple-strong) !important; }

/* ──────────────────────────────────────────────────────────────
   WORK / CASE STUDIES PAGE
────────────────────────────────────────────────────────────── */

/* Hero (DARK) */
#work-hero { background: var(--tv-dark-900) !important; }
#work-hero h1, #work-hero .tv-h1 { color: var(--tv-text-on-dark-primary) !important; }
#work-hero p, #work-hero .hero-subtitle { color: var(--tv-text-on-dark-secondary) !important; }
#work-hero em { color: var(--tv-purple-light) !important; }
#work-hero .tv-label { color: var(--tv-purple-light) !important; }
#work-hero .tv-tag { border-color: var(--tv-dark-border) !important; color: var(--tv-text-on-dark-secondary) !important; background: rgba(30,30,74,0.4) !important; }
#work-hero .tv-tag.active { border-color: var(--tv-purple-light) !important; color: var(--tv-purple-light) !important; background: rgba(168,158,255,0.10) !important; }

/* Case studies horizontal scroll (LIGHT) */
.hscroll-section {
  background: var(--tv-light-50) !important;
  border-top-color: var(--tv-light-border) !important;
  border-bottom-color: var(--tv-light-border) !important;
}
.hscroll-section h2, .hscroll-section h3 { color: var(--tv-text-on-light-primary) !important; }
.hscroll-section p { color: var(--tv-text-on-light-secondary) !important; }
.hscroll-section .tv-label { color: var(--tv-purple-strong) !important; }
.hscroll-section .hscroll-hint { color: var(--tv-text-on-light-muted) !important; }
.hscroll-section .hscroll-hint svg { color: var(--tv-purple-strong) !important; }
.hscroll-section .project-card {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
.hscroll-section .project-card h3 { color: var(--tv-text-on-light-primary) !important; }
.hscroll-section .client-name { color: var(--tv-text-on-light-muted) !important; }
.hscroll-section .before-after {
  background: rgba(0, 0, 0, 0.04) !important;
  border-color: rgba(100, 88, 220, 0.12) !important;
}
.hscroll-section .ba-row { color: var(--tv-text-on-light-secondary) !important; }
.hscroll-section .stack-tag {
  background: rgba(82,72,200,0.06) !important;
  border-color: var(--tv-light-border) !important;
  color: var(--tv-text-on-light-secondary) !important;
}
.hscroll-section .result-metric { background: rgba(82,72,200,0.06) !important; }
.hscroll-section .metric-num { color: var(--tv-purple-strong) !important; }
.hscroll-section .metric-label { color: var(--tv-text-on-light-secondary) !important; }

/* Impact stats (LIGHT alternate) */
.impact-section { background: var(--tv-light-100) !important; }
.impact-section h2, .impact-section h3 { color: var(--tv-text-on-light-primary) !important; }
.impact-section p { color: var(--tv-text-on-light-secondary) !important; }
.impact-section .tv-label { color: var(--tv-purple-strong) !important; }
.impact-section .tv-stat-num { color: var(--tv-purple-strong) !important; }
.impact-section .tv-stat-label { color: var(--tv-text-on-light-muted) !important; }
.impact-section .tv-glass {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
.impact-section [style*="border-top"] { border-top-color: var(--tv-light-border) !important; }

/* Process (LIGHT) */
.process-section { background: var(--tv-light-50) !important; }
.process-section h2, .process-section h3, .process-section h4 { color: var(--tv-text-on-light-primary) !important; }
.process-section p { color: var(--tv-text-on-light-secondary) !important; }
.process-section .tv-label { color: var(--tv-purple-strong) !important; }
.process-section .tv-glass {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}

/* Testimonials (LIGHT alternate) */
.testimonials-section { background: var(--tv-light-100) !important; }
.testimonials-section h2, .testimonials-section h3 { color: var(--tv-text-on-light-primary) !important; }
.testimonials-section p { color: var(--tv-text-on-light-secondary) !important; }
.testimonials-section .tv-label { color: var(--tv-purple-strong) !important; }
.testimonials-section .quote-text { color: var(--tv-text-on-light-primary) !important; }
.testimonials-section .tv-glass {
  background: var(--tv-light-card) !important;
  border-color: var(--tv-light-border) !important;
}
.testimonials-section [class*="author"] { color: var(--tv-text-on-light-muted) !important; }
.testimonials-section [class*="company"] { color: var(--tv-text-on-light-muted) !important; }

/* Work CTA (DARK) */
.cta-section { background: var(--tv-dark-700) !important; }
.cta-section h2, .cta-section h3 { color: var(--tv-text-on-dark-primary) !important; }
.cta-section p { color: var(--tv-text-on-dark-secondary) !important; }
.cta-section .tv-label { color: var(--tv-purple-light) !important; }
.cta-section .tv-btn-teal { background: var(--tv-btn-primary-bg) !important; color: var(--tv-btn-primary-text) !important; }
.cta-section .tv-btn-outline { border-color: var(--tv-btn-secondary-text-dark) !important; color: var(--tv-btn-secondary-text-dark) !important; }
.cta-inner { background: rgba(30,30,74,0.65) !important; border-color: var(--tv-dark-border) !important; }

/* ── FOOTER (ALL PAGES — DARK) ─────────────────────────────────── */
#tv-footer {
  background: var(--tv-dark-900) !important;
  border-top-color: var(--tv-dark-border) !important;
}
#tv-footer .nav-logo { color: var(--tv-text-on-dark-primary) !important; }
#tv-footer .nav-logo span { color: var(--tv-purple-light) !important; }
.footer-brand p { color: var(--tv-text-on-dark-secondary) !important; }
.footer-col h5 { color: var(--tv-purple-light) !important; }
.footer-col a { color: var(--tv-text-on-dark-secondary) !important; }
.footer-col a:hover { color: var(--tv-text-on-dark-primary) !important; }
.footer-bottom { border-top-color: var(--tv-dark-border) !important; }
.footer-bottom p { color: var(--tv-text-on-dark-muted) !important; }
.footer-social a {
  border-color: var(--tv-dark-border) !important;
  color: var(--tv-text-on-dark-muted) !important;
}
.footer-social a:hover {
  border-color: var(--tv-purple-light) !important;
  color: var(--tv-purple-light) !important;
}