/* ============================================================
   Revonexis v3.1.4 — Global Visual System
   One brand palette, one light surface, one dark system.
   The light header is intentionally persistent across all pages.
   ============================================================ */

:root {
  /* Core brand */
  --rx-cyan: #00A9C6;
  --rx-cyan-hover: #008BA5;
  --rx-cyan-dark: #007B93;
  --rx-cyan-soft: rgba(0,169,198,.12);
  --rx-cyan-border: rgba(0,169,198,.18);
  --rx-cyan-glow: rgba(0,169,198,.07);

  /* Light system — warm, calm, intentionally not clinical white */
  --rx-light: #F7F5EF;
  --rx-light-strong: #FCFBF8;
  --rx-light-muted: #EEEAE1;
  --rx-ink: #10213C;
  --rx-ink-2: #26354B;
  --rx-light-text: #59687C;
  --rx-light-border: rgba(16,33,60,.10);

  /* Existing dark system, kept intentionally deep */
  --bg: #050810;
  --bg2: #080D1A;
  --bg3: #0C1220;
  --surface: #0F1628;
  --cyan: var(--rx-cyan);
  --electric: var(--rx-cyan);
  --cyan-dim: var(--rx-cyan-soft);
  --cyan-glow: var(--rx-cyan-glow);
  --border: var(--rx-cyan-border);
  --white: #F7F5EF;
  --text: #B0BDD4;
  --muted: #5A6A8A;
}

/* ---------- GLOBAL LIGHT NAVIGATION ---------- */
nav {
  background: rgba(247,245,239,.955) !important;
  border-bottom: 1px solid var(--rx-light-border) !important;
  box-shadow: 0 8px 30px rgba(16,33,60,.035) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.nav-links > li > a:not(.nav-cta),
.nav-lumidy-link,
.nav-lang-switch,
.nav-dropdown > a {
  color: var(--rx-ink-2) !important;
}
.nav-links > li > a:hover,
.nav-lumidy-link:hover,
.nav-lang-switch:hover,
.nav-lang-switch.lang-current,
.nav-links a[aria-current="page"] {
  color: var(--rx-cyan-dark) !important;
}
.nav-lang-group { color: rgba(16,33,60,.25) !important; }
.nav-cta,
.nav-mobile-cta {
  background: var(--rx-cyan) !important;
  border-color: var(--rx-cyan) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.nav-cta:hover,
.nav-mobile-cta:hover {
  background: var(--rx-cyan-hover) !important;
  border-color: var(--rx-cyan-hover) !important;
  color: #fff !important;
}
.nav-hamburger { background: rgba(16,33,60,.035) !important; border-color: rgba(16,33,60,.10) !important; }
.nav-hamburger span { background: var(--rx-ink) !important; }

/* Header logo: dark wordmark + one canonical cyan */
.logo text tspan:first-child { fill: var(--rx-ink) !important; }
.logo text tspan:last-child { fill: var(--rx-cyan) !important; }
.logo svg [stroke="#00A9C6"] { stroke: var(--rx-cyan) !important; }
.logo svg [fill="#00A9C6"] { fill: var(--rx-cyan) !important; }

/* Dropdowns belong to the same light system */
.nav-dropdown-panel {
  background: rgba(252,251,248,.985) !important;
  border-color: var(--rx-light-border) !important;
  box-shadow: 0 18px 48px rgba(16,33,60,.12) !important;
}
.nav-dropdown-item { color: #344159 !important; }
.nav-dropdown-item:hover,
.nav-dropdown-item:focus-visible {
  background: rgba(0,169,198,.07) !important;
  color: var(--rx-cyan-dark) !important;
}

/* Mobile menu uses exactly the same surface and hierarchy */
@media (max-width: 820px) {
  nav { background: rgba(247,245,239,.985) !important; }
  .nav-mobile-menu {
    background: var(--rx-light-strong) !important;
    border-color: var(--rx-light-border) !important;
    box-shadow: 0 18px 48px rgba(16,33,60,.12) !important;
  }
  .nav-mobile-menu a,
  .nav-mobile-services-label { color: var(--rx-ink-2) !important; }
  .nav-mobile-sub a { color: var(--rx-light-text) !important; }
  .nav-mobile-menu a:hover,
  .nav-mobile-menu a[aria-current="page"] { color: var(--rx-cyan-dark) !important; }
  .nav-mobile-lang-group { border-color: var(--rx-light-border) !important; }
}

/* ---------- CANONICAL LIGHT SURFACE ----------
   Use these classes for any current/future light sections so the site
   never drifts into several unrelated whites. */
.rx-light-section,
.section-light,
[data-theme="light"] {
  background: var(--rx-light) !important;
  color: var(--rx-ink);
}
.rx-light-section .section-title,
.section-light .section-title,
[data-theme="light"] .section-title { color: var(--rx-ink) !important; }
.rx-light-section p,
.section-light p,
[data-theme="light"] p { color: var(--rx-light-text); }

/* ---------- GLOBAL ACCENT CONSISTENCY ---------- */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: rgba(0,169,198,.65) !important;
}

/* Keep cyan accents controlled and singular on dark sections */
.section-label,
.eyebrow,
.kicker,
.qc-teaser-label,
.faq-q-icon,
.cta-text-link,
.footer-teams-cta a { color: var(--rx-cyan) !important; }

/* ---------- CLARITY HERO ALIGNMENT ---------- */
.clarity-hero {
  background:
    radial-gradient(circle at 89% 50%, rgba(232,211,176,.27) 0, rgba(247,245,239,0) 25%),
    radial-gradient(circle at 64% 38%, rgba(0,169,198,.052) 0, rgba(247,245,239,0) 34%),
    linear-gradient(108deg, var(--rx-light-strong) 0%, var(--rx-light) 57%, #F3F1EB 100%) !important;
  color: var(--rx-ink) !important;
}
.clarity-hero h1 { color: var(--rx-ink) !important; }
.clarity-hero h1 span,
.clarity-eyebrow { color: var(--rx-cyan) !important; }
.clarity-eyebrow::before,
.clarity-scroll span { background: var(--rx-cyan) !important; }
.clarity-sub { color: #182A45 !important; }
.clarity-body { color: var(--rx-light-text) !important; }
.clarity-btn-primary {
  background: var(--rx-cyan) !important;
  border-color: var(--rx-cyan) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(0,169,198,.16) !important;
}
.clarity-btn-primary:hover {
  background: var(--rx-cyan-hover) !important;
  border-color: var(--rx-cyan-hover) !important;
  box-shadow: 0 16px 34px rgba(0,169,198,.21) !important;
}
.clarity-btn-secondary {
  background: rgba(252,251,248,.72) !important;
  border-color: rgba(16,33,60,.22) !important;
  color: #23344D !important;
}
.clarity-btn-secondary:hover {
  background: var(--rx-light-strong) !important;
  border-color: var(--rx-cyan) !important;
  color: var(--rx-cyan-dark) !important;
}
.clarity-hero::after {
  background: linear-gradient(90deg, transparent, rgba(0,169,198,.24), transparent) !important;
}
.clarity-scroll { border-color: rgba(16,33,60,.16) !important; }

/* The generated artwork already uses the same hue family; this keeps it
   calm instead of neon against the warm-white hero. */
.clarity-hero-art img {
  filter: saturate(.78) contrast(.97) !important;
}

/* ---------- DARK-SYSTEM HARMONY ---------- */
/* Replace old neon feel with the same calmer cyan family in interactive surfaces. */
.btn-primary,
.cta-primary,
.scan-cta,
.storefront-primary,
button[type="submit"] {
  --local-accent: var(--rx-cyan);
}

/* Footer stays dark; only its accent is unified. */
footer a:hover { color: var(--rx-cyan) !important; }

@media (prefers-reduced-motion: reduce) {
  .clarity-scroll span { animation: none !important; }
}