/* ============================================================
   WillVault — darkmode.css
   Dark mode styles for Home 1, Home 2, Dashboard & Components.
   Background is pure black (#000000) across regular sections,
   navbar, footer, and drawer.
   Only sections with blue backgrounds in light mode (.hero,
   .h2-hero, .h1-hero, .sec-band, .section-ink, .cta-banner)
   retain their Deep Navy (#172554 / #0F172A) backgrounds.
   ============================================================ */

body.dark {
  --bg: #000000;
  --surface: #0E0E0E;
  --surface-2: #141414;
  --text: #EDF0F5;
  --muted: #9AA6B8;
  --line: #222222;
  --primary: #FFFFFF;
  --primary-dark: #0F172A;
  --primary-soft: rgba(255, 255, 255, .08);
  --sh-sm: 0 2px 8px rgba(0, 0, 0, .55);
  --sh: 0 10px 30px rgba(0, 0, 0, .75);
  --sh-lg: 0 24px 60px rgba(0, 0, 0, .85);

  background: #000000;
  color: var(--text);
}

/* Brand Logo in dark mode — identical across navbar, drawer & footer */
body.dark .brand,
body.dark a.brand,
body.dark a.brand:visited,
body.dark .navbar .brand,
body.dark .drawer .brand,
body.dark .footer .brand,
body.dark .f-brand .brand {
  opacity: 1 !important;
  color: #FFFFFF !important;
}

body.dark .brand-mark,
body.dark .navbar .brand-mark,
body.dark .drawer .brand-mark,
body.dark .footer .brand-mark,
body.dark .f-brand .brand-mark {
  background: var(--secondary) !important;
  color: #FFFFFF !important;
}

body.dark .brand-text,
body.dark a.brand:visited .brand-text,
body.dark .navbar .brand-text,
body.dark .drawer .brand-text,
body.dark .footer .brand-text,
body.dark .f-brand .brand-text {
  font-family: 'Spectral', Georgia, serif !important;
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
  opacity: 1 !important;
}

body.dark .brand-accent,
body.dark a.brand:visited .brand-accent,
body.dark .navbar .brand-accent,
body.dark .drawer .brand-accent,
body.dark .footer .brand-accent,
body.dark .f-brand .brand-accent {
  color: #14B8A6 !important;
  opacity: 1 !important;
}

/* Only sections that are already blue in light mode keep blue in dark mode */
body.dark .hero,
body.dark .h1-hero,
body.dark .section-ink {
  background: #172554 !important;
}

body.dark .hero-bg {
  opacity: .7;
}

body.dark .cta-banner {
  background: #0F172A !important;
}

/* Visible mild black background for header, drawer, and footer (100% identical) */
body.dark .navbar,
body.dark .navbar.scrolled {
  background: #0D111A !important;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  box-shadow: 0 4px 20px rgba(0, 0, 0, .55);
}

/* ============================================================
   NAVBAR & NAV ITEMS IN DARK MODE — High Contrast & Visibility
   ============================================================ */
/* Desktop Nav Links */
body.dark .navbar .nav-link {
  color: #E2E8F0 !important;
  font-weight: 500;
  transition: color .2s ease, background-color .2s ease;
}

body.dark .navbar .nav-link:hover {
  color: #FFFFFF !important;
  background-color: rgba(255, 255, 255, 0.08);
}

body.dark .navbar .nav-link.active {
  color: #FFFFFF !important;
  font-weight: 600;
}

/* Active & Hover Underline: Vibrant Luminous Teal Glow */
body.dark .navbar .nav-link::before {
  background: #14B8A6 !important;
  box-shadow: 0 0 10px rgba(20, 184, 166, 0.65);
  height: 2.5px;
}

/* Dropdown Caret in Navbar */
body.dark .navbar .nav-link .caret {
  color: #94A3B8;
  transition: color .2s ease, transform .2s ease;
}

body.dark .navbar .nav-link:hover .caret,
body.dark .navbar .nav-link.active .caret,
body.dark .navbar .dropdown-toggle[aria-expanded="true"] .caret {
  color: #14B8A6 !important;
}

/* Desktop Dropdown Menus in Dark Mode */
body.dark .navbar .dropdown-menu {
  background: #111622 !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.65) !important;
  backdrop-filter: blur(16px);
}

body.dark .navbar .dropdown-link {
  color: #E2E8F0 !important;
}

body.dark .navbar .dropdown-link i {
  color: #14B8A6 !important;
}

body.dark .navbar .dropdown-link:hover,
body.dark .navbar .dropdown-link.active {
  color: #FFFFFF !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Navbar Action Controls (Theme, RTL, Login) */
body.dark .navbar .icon-btn {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #FFFFFF !important;
}

body.dark .navbar .icon-btn:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

body.dark .navbar .nav-login {
  background: #0D9488 !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 10px rgba(13, 148, 136, 0.35);
}

body.dark .navbar .nav-login:hover {
  background: #14B8A6 !important;
  box-shadow: 0 4px 16px rgba(20, 184, 166, 0.5);
}

body.dark .drawer {
  background: #0D111A !important;
  border-inline-start: 1px solid rgba(255, 255, 255, .12);
}

/* Mobile Drawer Nav Items in Dark Mode */
body.dark .drawer-nav > a,
body.dark .drawer-drop-btn {
  color: #E2E8F0 !important;
}

body.dark .drawer-nav > a i,
body.dark .drawer-drop-btn > span > i {
  color: #14B8A6 !important;
}

body.dark .drawer-nav > a:hover,
body.dark .drawer-drop-btn:hover {
  color: #FFFFFF !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

body.dark .drawer-nav > a.active,
body.dark .drawer-drop-btn.open {
  color: #FFFFFF !important;
}

body.dark .drawer-submenu a {
  color: #94A3B8 !important;
}

body.dark .drawer-submenu a:hover {
  color: #FFFFFF !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

body.dark .drawer-submenu a.active {
  color: #14B8A6 !important;
  background: rgba(20, 184, 166, 0.1) !important;
  font-weight: 600;
}

body.dark .drawer .drawer-controls .icon-btn {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #FFFFFF !important;
}

body.dark .drawer .drawer-controls .icon-btn:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

body.dark .footer {
  background: #0D111A !important;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

body.dark .footer-grid {
  background: transparent !important;
  border-bottom-color: rgba(255, 255, 255, .08);
}

body.dark .footer-bottom {
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, .10);
}

body.dark .strip {
  background: #000000;
  border-bottom-color: var(--line);
}

body.dark .section-soft {
  background: #000000;
}

/* Surface containers (cards, dropdowns, panels) in dark mode */

body.dark .dossier-card,
body.dark .mock,
body.dark .feature-card,
body.dark .quote-card,
body.dark .price-card,
body.dark .faq-item,
body.dark .dropdown-menu,
body.dark .h1-card,
body.dark .h1-metric-card,
body.dark .h1-build-tile,
body.dark .h1-dx-preview,
body.dark .h1-cmp,
body.dark .h1-faq-item {
  background: #0E0E0E;
  border-color: var(--line);
  color: var(--text);
}


body.dark .h1-opt,
body.dark .h1-dx-row,
body.dark .h1-pane blockquote,
body.dark .h1-guar {
  background: #141414;
  border-color: var(--line);
}

body.dark .steps li {
  border-top-color: var(--line);
}

body.dark .strip-grid strong,
body.dark .strip-val,
body.dark .strip-unit,
body.dark .f-col h4 {
  color: var(--text);
}

body.dark .feature-icon {
  background: rgba(255, 255, 255, .08);
  color: var(--text);
}

body.dark .price-card.featured {
  border-color: var(--secondary);
}

body.dark .price-flag {
  background: var(--secondary);
}

body.dark .quote-score,
body.dark .author-info strong {
  color: #FFFFFF !important;
}

body.dark .quote-verified {
  background: rgba(20, 184, 166, .16) !important;
  color: #2DD4BF !important;
}

body.dark .author-doc {
  color: #14B8A6 !important;
}

body.dark .author-img {
  border-color: #222222 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .5) !important;
}

body.dark .f-social a {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text);
}

body.dark .f-social a:hover {
  background: var(--secondary);
  border-color: var(--secondary);
  color: #fff;
}

body.dark .hamburger span {
  background: var(--text);
}

body.dark .icon-btn {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text);
}

body.dark .icon-btn:hover {
  background: var(--surface-2);
  border-color: #444;
}

body.dark .eyebrow {
  background: rgba(255, 255, 255, .06);
}

/* Typography & Sub-elements */

body.dark .bar {
  background: var(--surface-2);
}

/* Buttons in dark mode */
body.dark .btn-outline {
  background: var(--secondary);
  color: #fff;
  border-color: var(--secondary);
}

body.dark .btn-outline:hover {
  border-color: var(--secondary-dark);
  background: var(--secondary-dark);
  color: #fff;
}

body.dark .hero .btn-outline,
body.dark .section-ink .btn-outline {
  color: #fff;
  border-color: var(--blue-line);
}

body.dark .hero .btn-outline:hover,
body.dark .section-ink .btn-outline:hover {
  border-color: rgba(255, 255, 255, .5);
  background: rgba(255, 255, 255, .08);
}

/* Swap the toggle glyph */
body.dark #themeToggle i::before,
body.dark #drawerTheme i::before {
  content: "\f5a2";
}

/* bi-sun-fill */

/* ---------------- Home 1 dark mode ---------------- */
body.dark .h1-mnote,
body.dark .h1-build-tile p,
body.dark .h1-pane-lead {
  color: var(--muted);
}

body.dark .h1-cmp thead th {
  background: var(--surface-2);
}

body.dark .h1-blob.b2 {
  background: radial-gradient(circle at 60% 60%, rgba(255, 255, 255, .05), transparent 60%);
}

body.dark .h1-hero .btn-outline {
  color: #fff;
  border-color: var(--blue-line);
}

body.dark .h1-hero .btn-outline:hover {
  border-color: rgba(255, 255, 255, .5);
  background: rgba(255, 255, 255, .08);
}

/* Why Choose WillVault & Document Center Image Badges in Dark Mode */
body.dark .why-media-card {
  box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
  border-color: var(--line);
}

body.dark .why-float-chip {
  background: rgba(13, 17, 26, 0.92);
  border-color: rgba(255, 255, 255, 0.14);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .5);
}

body.dark .why-float-chip strong {
  color: #fff;
}

body.dark .why-float-chip span {
  color: rgba(255, 255, 255, 0.72);
}

/* Home 2 Image Cards and Chips in Dark Mode */
body.dark .h1-build-img-wrap {
  background: #141A26;
}


body.dark .h1-faq-card {
  box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
  border-color: var(--line);
}

body.dark .h1-faq-chip {
  background: rgba(13, 17, 26, 0.92);
  border-color: rgba(255, 255, 255, 0.14);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .5);
}

body.dark .h1-faq-chip strong {
  color: #fff;
}

body.dark .h1-faq-chip span {
  color: rgba(255, 255, 255, 0.72);
}

/* About page: story masthead hero with background image in dark mode */
body.dark .ab-hero {
  background: 
    linear-gradient(135deg, rgba(10, 15, 29, 0.94) 0%, rgba(15, 23, 42, 0.90) 55%, rgba(15, 118, 110, 0.72) 100%),
    url('../images/about-bg.webp') center/cover no-repeat !important;
}
body.dark .ab-hero .btn-outline {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.14);
}
body.dark .ab-hero .btn-outline:hover {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.08);
}
body.dark .ab-letter {
  background: #0F172A !important;
}

/* Services page: hero banner with background image in dark mode */
body.dark .sv-hero {
  background:
    radial-gradient(900px 420px at 12% -10%, rgba(15, 118, 110, 0.45), transparent 60%),
    radial-gradient(700px 420px at 100% 6%, rgba(23, 37, 84, 0.45), transparent 55%),
    linear-gradient(160deg, rgba(10, 15, 29, 0.94) 0%, rgba(15, 23, 42, 0.94) 55%, rgba(17, 94, 89, 0.80) 140%),
    url('../images/sv-hero.avif') center/cover no-repeat !important;
}

/* Contact Page Dark Mode Hovers */
body.dark .ct-channel:hover {
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(20, 184, 166, 0.35);
  border-color: rgba(20, 184, 166, 0.5);
}
body.dark .ct-channel .ct-c-value {
  color: #5EEAD4;
}
body.dark .ct-channel:hover .ct-c-value {
  color: #99F6E4;
}
body.dark .ct-step:hover {
  box-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(20, 184, 166, 0.3);
  border-color: rgba(20, 184, 166, 0.45);
}
body.dark .ct-map-card:hover {
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(20, 184, 166, 0.3);
  border-color: rgba(20, 184, 166, 0.45);
}
body.dark .ct-help-card:hover {
  box-shadow: 0 14px 30px -8px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(20, 184, 166, 0.25);
  border-color: rgba(20, 184, 166, 0.35);
}

/* ============================================================
   ADMIN DASHBOARD — dark mode
   ============================================================ */
body.dark.admin,
body.dark .adm-shell {
  background: #000000;
}

body.dark .adm-sidebar {
  background: #0D111A;
  border-inline-end-color: rgba(255, 255, 255, .12);
}

body.dark .adm-topbar {
  background: rgba(13, 17, 26, .92);
  border-bottom-color: rgba(255, 255, 255, .12);
  backdrop-filter: blur(10px);
}

body.dark .adm-link {
  color: #E2E8F0;
}

body.dark .adm-link i {
  color: #94A3B8;
}

body.dark .adm-link:hover {
  color: #FFFFFF;
  background: rgba(255, 255, 255, .08);
}

body.dark .adm-link:hover i {
  color: #FFFFFF;
}

body.dark .adm-link.active {
  color: #2DD4BF;
  background: rgba(20, 184, 166, .14);
}

body.dark .adm-link.active i {
  color: #2DD4BF;
}

body.dark .adm-link .adm-link-note {
  background: rgba(20, 184, 166, .16);
  color: #2DD4BF;
}

body.dark .adm-tb-crumb strong {
  color: #FFFFFF;
}

body.dark .adm-burger span {
  background: var(--text);
}

body.dark .adm-close {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .16);
  color: #FFFFFF;
}

body.dark .adm-close:hover {
  background: rgba(255, 255, 255, .15);
  border-color: rgba(255, 255, 255, .3);
}


body.dark .adm-field input,
body.dark .adm-field select,
body.dark .adm-field textarea {
  background: #111622;
  border-color: rgba(255, 255, 255, .14);
  color: var(--text);
}


body.dark .adm-field input:focus,
body.dark .adm-field select:focus,
body.dark .adm-field textarea:focus {
  border-color: #14B8A6;
  background: #0D111A;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, .18);
}

body.dark .adm-select {
  background-color: #111622;
  border-color: rgba(255, 255, 255, .14);
  color: var(--text);
}

body.dark .adm-profile {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .14);
}

body.dark .adm-profile:hover {
  border-color: #14B8A6;
}

body.dark .adm-profile .caret {
  color: #94A3B8;
}

body.dark .adm-pop {
  background: #111622;
  border-color: rgba(255, 255, 255, .14);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .65);
}

body.dark .adm-pop-menu a {
  color: #E2E8F0;
}

body.dark .adm-pop-menu a:hover {
  color: #FFFFFF;
  background: rgba(255, 255, 255, .1);
}

body.dark .adm-notif.unread {
  background: rgba(20, 184, 166, .12);
}

body.dark .adm-card,
body.dark .adm-stat,
body.dark .adm-draft {
  background: #0E0E0E;
  border-color: rgba(255, 255, 255, .1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .55);
}

body.dark .adm-stat::before {
  background: linear-gradient(90deg, #14B8A6, rgba(20, 184, 166, .2));
}

body.dark .adm-stat-ico,
body.dark .adm-draft-top .adm-file {
  background: rgba(20, 184, 166, .14);
  color: #2DD4BF;
}

body.dark .adm-table th {
  background: #0B0B0B;
  color: #94A3B8;
  border-color: rgba(255, 255, 255, .09);
}

body.dark .adm-table td,
body.dark .adm-table th {
  border-color: rgba(255, 255, 255, .09);
}

body.dark .adm-table tbody tr:hover {
  background: #141414;
}

body.dark .adm-file {
  background: rgba(20, 184, 166, .14);
  color: #2DD4BF;
}

body.dark .adm-file.pdf {
  background: rgba(239, 68, 68, .14);
  color: #F87171;
}

body.dark .adm-file.navy {
  background: rgba(255, 255, 255, .1);
  color: #FFFFFF;
}

body.dark .adm-file.gold {
  background: rgba(245, 158, 11, .14);
  color: #FBBF24;
}

body.dark .adm-act {
  background: transparent;
  border-color: rgba(255, 255, 255, .16);
  color: #94A3B8;
}

body.dark .adm-act:hover {
  background: rgba(20, 184, 166, .14);
  border-color: #14B8A6;
  color: #2DD4BF;
}

/* Status pills in dark mode */
body.dark .h1-status.ok {
  background: rgba(46, 160, 67, .16);
  color: #6EE7B7;
}

body.dark .h1-status.draft {
  background: rgba(255, 255, 255, .08);
  color: #CBD5E1;
}

body.dark .h1-status.pending {
  background: rgba(245, 158, 11, .16);
  color: #FBBF24;
}

body.dark .h1-status.refund {
  background: rgba(239, 68, 68, .16);
  color: #FCA5A5;
}

body.dark .h1-status.info {
  background: rgba(56, 189, 248, .16);
  color: #7DD3FC;
}

body.dark .adm-trend.up {
  color: #6EE7B7;
}

body.dark .adm-trend.down {
  color: #FBBF24;
}

body.dark .adm-bar-x,
body.dark .adm-rev-labels span,
body.dark .adm-donut-list span,
body.dark .adm-cust-main span,
body.dark .adm-draft-meta span,
body.dark .adm-cell-main small,
body.dark .adm-check-main span,
body.dark .adm-gauge-center span {
  color: #94A3B8;
}

body.dark .adm-donut::after,
body.dark .adm-gauge::after {
  background: #0E0E0E;
}

body.dark .adm-rev .g-grid {
  stroke: rgba(255, 255, 255, .09);
}

body.dark .adm-rev .g-grid-major {
  stroke: rgba(255, 255, 255, .16);
}

body.dark .adm-cust,
body.dark .adm-line,
body.dark .adm-check,
body.dark .adm-notif {
  border-color: rgba(255, 255, 255, .09);
}

body.dark .adm-switch i {
  background: #2E3440;
}

body.dark .adm-draft:hover {
  border-color: #14B8A6;
}

body.dark .adm-draft-pct {
  color: #2DD4BF;
}

body.dark .adm-ava.navy {
  background: #24324F;
  color: #fff;
}

/* ============================================================
   Sign Up / Create Account page (signup.html)
   ============================================================ */
body.dark .auth-card {
  background: #0E0E0E;
  border-color: rgba(255, 255, 255, .1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .55);
}

body.dark .auth-soc {
  background: #0E0E0E;
  border-color: rgba(255, 255, 255, .12);
  color: #EDF0F5;
}

body.dark .auth-soc:hover {
  border-color: #14B8A6;
}

body.dark .auth-apple i {
  color: #EDF0F5;
}

body.dark .auth-divider::before,
body.dark .auth-divider::after {
  background: rgba(255, 255, 255, .12);
}

/* ============================================================
   404 & Coming Soon pages — dark mode
   ============================================================ */

/* Page backgrounds */
body.dark .err-page,
body.dark .cs-page {
  background: #000000;
}

/* Ghost background icon — stays barely visible */
body.dark .err-bg-icon i {
  color: #ffffff;
  opacity: .03;
}

/* 404 gradient number — swap to lighter teal/blue tones */
body.dark .err-code {
  background: linear-gradient(135deg, #60a5fa 0%, #2DD4BF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Divider line */
body.dark .err-divider::before,
body.dark .err-divider::after {
  background: rgba(255, 255, 255, .12);
}
body.dark .err-divider span {
  color: var(--muted, #9AA6B8);
}

/* Headings & body text */
body.dark .err-title,
body.dark .cs-title {
  color: #EDF0F5;
}
body.dark .err-body,
body.dark .cs-body {
  color: #9AA6B8;
}

/* Quick links below 404 CTAs */
body.dark .err-links a {
  color: #9AA6B8;
}
body.dark .err-links a:hover {
  color: #2DD4BF;
}

/* Animated dots — already coloured, just ensure visibility */
body.dark .err-dot:nth-child(1) { background: #2DD4BF; }
body.dark .err-dot:nth-child(2) { background: #60a5fa; }
body.dark .err-dot:nth-child(3) { background: #F59E0B; }

/* Coming Soon — badge */
body.dark .cs-badge {
  background: linear-gradient(135deg, rgba(45,212,191,.14), rgba(96,165,250,.14));
  border-color: rgba(45,212,191,.3);
  color: #2DD4BF;
}

/* Coming Soon — gradient text span */
body.dark .cs-title span {
  background: linear-gradient(135deg, #60a5fa 0%, #2DD4BF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Countdown tiles */
body.dark .cs-num {
  background: #141414;
  border-color: rgba(255, 255, 255, .1);
  color: #EDF0F5;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .6);
}
body.dark .cs-label {
  color: #9AA6B8;
}
body.dark .cs-sep {
  color: #9AA6B8;
}

/* Progress bar track */
body.dark .cs-progress-bar {
  background: rgba(255, 255, 255, .1);
}
body.dark .cs-progress-label {
  color: #9AA6B8;
}

/* Email input */
body.dark .cs-form input[type="email"] {
  background: #141414;
  border-color: rgba(255, 255, 255, .12);
  color: #EDF0F5;
}
body.dark .cs-form input[type="email"]:focus {
  border-color: #2DD4BF;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, .15);
}
body.dark .cs-form input[type="email"]::placeholder {
  color: #9AA6B8;
}

/* Notify confirmation message */
body.dark .cs-notify-msg {
  color: #2DD4BF;
}

/* Social icon buttons */
body.dark .cs-social a {
  border-color: rgba(255, 255, 255, .12);
  color: #9AA6B8;
}
body.dark .cs-social a:hover {
  border-color: #2DD4BF;
  color: #2DD4BF;
}

/* Orb opacities — slightly reduce to avoid jarring bright blobs on black */
body.dark .cs-orb-1 { opacity: .08; }
body.dark .cs-orb-2 { opacity: .08; }
body.dark .cs-orb-3 { opacity: .05; }