/* LIGHT APPEARANCE (class-based for manual toggle support) */
body.light-appearance {
  --theme-bg: #f0f7ff;
}

/* The element surfaces below are the DEFAULT light treatment — white-ish cards,
   ink text, a light cursor. They apply to the default look and to any theme with
   a light variant (which layers its own tint on top). They are suppressed under
   `.theme-dark-only` themes — those flagged `darkOnly` in the theme registry —
   which have no bright form and keep their dark identity in light mode; without
   this guard, their dark pages would show white cards and ink text.
   The exclusion is wrapped in :where() so it adds ZERO specificity — a bare
   :not(.theme-dark-only) would outrank a theme's own same-specificity element
   override and clobber it; :where keeps these at their original weight so source
   order still lets a theme win where it sets its own surfaces. */
body.light-appearance:where(:not(.theme-dark-only)) .section-label {
  color: var(--sky-5);
}
body.light-appearance:where(:not(.theme-dark-only)) .section-label::before {
  background: var(--sky-5);
}
body.light-appearance:where(:not(.theme-dark-only)) .services-grid {
  background: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.06);
}
body.light-appearance:where(:not(.theme-dark-only)) .service-card {
  background: rgba(255, 255, 255, 0.75);
}
body.light-appearance:where(:not(.theme-dark-only)) .service-card:hover {
  background: rgba(255, 255, 255, 0.9);
}
body.light-appearance:where(:not(.theme-dark-only)) .service-card::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(var(--theme-glow), 0.3),
    transparent
  );
}
body.light-appearance:where(:not(.theme-dark-only)) .service-num {
  /* sky-5 (#1a5fa8) at this alpha clears WCAG AA on the near-white card. */
  color: rgba(26, 95, 168, 0.85);
}
body.light-appearance:where(:not(.theme-dark-only)) .service-title {
  color: var(--ink);
}
body.light-appearance:where(:not(.theme-dark-only)) .service-desc {
  color: rgba(var(--ink-rgb), 0.65);
}

body.light-appearance:where(:not(.theme-dark-only)) .about-heading {
  color: var(--ink);
}
body.light-appearance:where(:not(.theme-dark-only)) .about-body {
  color: rgba(var(--ink-rgb), 0.65);
}
body.light-appearance:where(:not(.theme-dark-only)) .stat-num {
  color: var(--ink);
}
body.light-appearance:where(:not(.theme-dark-only)) .stat-label {
  color: rgba(var(--ink-rgb), 0.62);
}

body.light-appearance:where(:not(.theme-dark-only)) .contact-card {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.8) 0%,
    rgba(240, 247, 255, 0.9) 100%
  );
  border-color: rgba(var(--theme-glow), 0.2);
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-card::before {
  background: radial-gradient(
    circle,
    rgba(var(--theme-glow), 0.08),
    transparent 70%
  );
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-heading {
  color: var(--ink);
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-sub {
  color: rgba(var(--ink-rgb), 0.62);
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-link {
  color: rgba(var(--ink-rgb), 0.65);
  border-color: rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.6);
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-link:hover {
  color: var(--ink);
  border-color: rgba(var(--theme-glow), 0.3);
  background: rgba(255, 255, 255, 0.85);
}
body.light-appearance:where(:not(.theme-dark-only)) .contact-link svg {
  color: var(--sky-5);
}

body.light-appearance:where(:not(.theme-dark-only)) .footer-info {
  border-top-color: rgba(0, 0, 0, 0.06);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-brand {
  color: var(--ink);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-col-title {
  color: var(--sky-5);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-text {
  color: rgba(var(--ink-rgb), 0.62);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-link {
  color: rgba(var(--ink-rgb), 0.62);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-link:hover {
  color: var(--sky-5);
}

body.light-appearance:where(:not(.theme-dark-only)) footer {
  border-top-color: rgba(0, 0, 0, 0.05);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-copy {
  /* Raised from a near-invisible tint to clear WCAG AA on the light bg. */
  color: rgba(var(--ink-rgb), 0.62);
}
body.light-appearance:where(:not(.theme-dark-only)) .footer-badge {
  /* The theme-glow blue can't reach AA even solid (~3.3:1); use the darker
     link-blue (--sky-5, 5.99:1) that the other light-mode labels use. */
  color: var(--sky-5);
}

body.light-appearance:where(:not(.theme-dark-only))::after {
  opacity: 0.015;
}
body.light-appearance:where(:not(.theme-dark-only)) #cursor {
  background: var(--sky-4);
  mix-blend-mode: normal;
  box-shadow:
    0 0 6px rgba(var(--cursor-glow), 0.5),
    0 0 2px rgba(255, 255, 255, 0.7);
}
body.light-appearance:where(:not(.theme-dark-only)) #cursor-ring {
  border-color: rgba(var(--cursor-glow), 0.5);
  box-shadow: 0 0 4px rgba(var(--cursor-glow), 0.15);
}