/* Light visual treatment. Existing page CSS still owns layout and motion. */
html[data-theme="light"] {
  --dark-bg: #fff;
  --dark-bg-soft: var(--light-cream);
  --dark-line: var(--light-line);
  --dark-text-soft: var(--light-muted);
  --void: #fff;
  --void-line: var(--light-line);
  --navy: var(--light-navy);
  --purple: var(--light-gold);
  --magenta: var(--light-gold);
  --cyan: var(--light-gold);
  --orange: var(--light-gold);
  --ag-cyan: var(--light-gold);
  --ag-purple: var(--light-gold);
  --ag-orange: var(--light-gold);
  --ag-magenta: var(--light-gold);
  --light-navy: #071C42;
  --light-ink: #1f2c42;
  --light-muted: #667085;
  --light-gold: #C78402;
  --light-line: #D9E0E8;
  --light-cream: #F7F4ED;
}

html[data-theme="light"] body { background: #fff !important; color: var(--light-ink) !important; }
html[data-theme="light"] .site-header,
html[data-theme="light"] .site-header--overlay { background: rgba(255,255,255,.96) !important; border-bottom: 1px solid #e7e7e7 !important; }
html[data-theme="light"] .brand-logo--dark { display: none !important; }
html[data-theme="light"] .brand-logo--light { display: inline-block !important; }
html[data-theme="light"] .site-header .site-nav a,
html[data-theme="light"] .site-header .nav-submenu a { color: #27344a !important; }
html[data-theme="light"] .site-header .site-nav a:hover,
html[data-theme="light"] .site-header .site-nav a.active,
html[data-theme="light"] .site-header .nav-submenu a:hover { color: var(--light-navy) !important; }
html[data-theme="light"] .site-header .site-nav a::after { background: var(--light-gold) !important; }
html[data-theme="light"] .site-header .nav-submenu { background: #fff !important; border-color: #e5e5e5 !important; box-shadow: 0 12px 28px rgba(16,31,71,.1) !important; }
html[data-theme="light"] .site-header .nav-submenu a:hover { background: #f7f6f1 !important; }
html[data-theme="light"] .lang-switch { background-color: #fff !important; border-color: #cfd3da !important; color: #303a4f !important; }
html[data-theme="light"] .site-header .btn-grad { color: var(--light-navy) !important; background-image: linear-gradient(#fff,#fff),linear-gradient(90deg,var(--light-navy),var(--light-gold)) !important; }
html[data-theme="light"] .site-header .nav-toggle span { background: var(--light-navy) !important; }
html[data-theme="light"] .site-footer { background: var(--light-navy) !important; border-color: #e7e7e7 !important; }

html[data-theme="light"] .page,
html[data-theme="light"] main,
html[data-theme="light"] .content,
html[data-theme="light"] .light-section,
html[data-theme="light"] .trusted-by { background-color: #fff !important; color: var(--light-ink) !important; }
html[data-theme="light"] .editorial-section,
html[data-theme="light"] .approach,
html[data-theme="light"] .who-we-are,
html[data-theme="light"] .belief-section,
html[data-theme="light"] .perspectives { background: var(--light-cream) !important; color: var(--light-ink) !important; }
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] .hero h1,
html[data-theme="light"] .page-hero h1 { color: var(--light-navy) !important; }
html[data-theme="light"] p,
html[data-theme="light"] .hero-copy p,
html[data-theme="light"] .page-hero p,
html[data-theme="light"] .editorial-lead { color: var(--light-muted) !important; }
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-label,
html[data-theme="light"] .detail-kicker,
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .stats strong,
html[data-theme="light"] .stats b { color: var(--light-gold) !important; }
html[data-theme="light"] .card,
html[data-theme="light"] .industry-card,
html[data-theme="light"] .approach-step,
html[data-theme="light"] .topic-card,
html[data-theme="light"] .featured-card,
html[data-theme="light"] .capability,
html[data-theme="light"] .av-capability-grid article,
html[data-theme="light"] .project-grid article,
html[data-theme="light"] .engagement-story-grid article,
html[data-theme="light"] .belief-grid article,
html[data-theme="light"] .team-member,
html[data-theme="light"] .why-card { background: #fff !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; box-shadow: 0 8px 24px rgba(16,31,71,.05) !important; }
html[data-theme="light"] .hero-link,
html[data-theme="light"] .cta-button,
html[data-theme="light"] .final-cta a,
html[data-theme="light"] .industry-detail-cta a { background: var(--light-navy) !important; border-color: var(--light-navy) !important; color: #fff !important; }
html[data-theme="light"] .hero-art,
html[data-theme="light"] .hero-area,
html[data-theme="light"] .hero { border-color: var(--light-line) !important; }
html[data-theme="light"] .hero-shade,
html[data-theme="light"] .hero::after { background: linear-gradient(90deg,#fff 0%,rgba(255,255,255,.96) 34%,rgba(255,255,255,.5) 62%,rgba(255,255,255,0) 100%) !important; }
html[data-theme="light"] .theme-toggle { border-color: #cfd3da !important; background: #fff !important; color: var(--light-navy) !important; }

@media (max-width: 1024px) {
  html[data-theme="light"] .site-header .site-nav { background: #fff !important; border-color: var(--light-line) !important; }
  html[data-theme="light"] .site-header .site-nav a { border-color: var(--light-line) !important; }
}

/* Reference-style light treatment */
html[data-theme="light"] {
  --light-navy-2: #132f5f;
  --light-ink: #1f2c42;
}
html[data-theme="light"] body { background: #fff !important; color: var(--light-ink) !important; font-family: "Avenir Next", Inter, "Segoe UI", Arial, sans-serif !important; }
html[data-theme="light"] .site-header { min-height: 82px; background: rgba(255,255,255,.97) !important; border-bottom: 1px solid #e7e7e7 !important; }
html[data-theme="light"] .site-header .header-inner { height: 82px; }
html[data-theme="light"] .site-header .brand-logo { width: 215px !important; height: auto !important; max-height: none !important; }
html[data-theme="light"] .site-header .site-nav { gap: 30px; }
html[data-theme="light"] .site-header .site-nav a,
html[data-theme="light"] .site-header .nav-submenu a { color: #27344a !important; font-size: 13px !important; letter-spacing: .025em !important; }
html[data-theme="light"] .site-header .site-nav a:hover,
html[data-theme="light"] .site-header .site-nav a.active { color: var(--light-navy) !important; }
html[data-theme="light"] .site-header .site-nav a::after { background: var(--light-gold) !important; }
html[data-theme="light"] .site-header .nav-submenu { background: #fff !important; border-color: #e5e5e5 !important; border-radius: 4px !important; box-shadow: 0 12px 28px rgba(16,31,71,.1) !important; }
html[data-theme="light"] .site-header .nav-submenu a:hover { background: #f7f6f1 !important; }
html[data-theme="light"] .lang-switch { min-width: 103px; background-color: #fff !important; border-color: #cfd3da !important; border-radius: 5px !important; color: #303a4f !important; }
html[data-theme="light"] .site-header .btn-grad { border-radius: 4px !important; color: var(--light-navy) !important; background-image: linear-gradient(#fff,#fff),linear-gradient(90deg,var(--light-navy),var(--light-gold)) !important; }
html[data-theme="light"] .site-header .btn-grad-arrow { color: var(--light-gold) !important; }
html[data-theme="light"] .site-header .nav-toggle span { background: var(--light-navy) !important; }
html[data-theme="light"] .site-footer { background: var(--light-navy) !important; border-color: var(--light-navy) !important; }
html[data-theme="light"] .site-footer .theme-toggle { border-color: rgba(255,255,255,.42); background: rgba(255,255,255,.08); color: #fff !important; }
html[data-theme="light"] .site-footer .theme-toggle:hover { border-color: var(--light-gold); }
html[data-theme="light"] .site-footer .theme-toggle[aria-pressed="true"] .theme-toggle-track { background: var(--light-gold); }

/* The orbital graphic is a raster image with a purple/blue/orange gradient baked in —
   brand standards explicitly ban AI-gradient artwork, so it's hidden in light theme and
   the approach items become a plain card row instead (matches the approved light mockup). */
html[data-theme="light"] .orbital-img { display: none !important; }
html[data-theme="light"] .approach-orbital-grid {
  grid-template-columns: 1fr !important;
  gap: 40px !important;
  align-items: start !important;
}
html[data-theme="light"] .approach-orbital-copy { max-width: 640px; }
html[data-theme="light"] .orbital-list {
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: 20px !important;
}
html[data-theme="light"] .orbital-list-item {
  flex: 1 1 220px;
  flex-direction: column !important;
  gap: 14px !important;
  margin-left: 0 !important;
  background: #fff;
  border: 1px solid var(--light-line);
  border-radius: 8px;
  padding: 24px;
}
html[data-theme="light"] .orbital-list-icon--raster { display: none !important; }
html[data-theme="light"] .orbital-list-icon--svg {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  background: var(--light-cream);
  color: var(--light-navy) !important;
}
html[data-theme="light"] .orbital-list-icon--svg svg { width: 22px; height: 22px; }

html[data-theme="light"] .hero-dark { height: 430px !important; min-height: 430px !important; background: #fff !important; border-bottom: 1px solid var(--light-line); }
html[data-theme="light"] .hero-dark-bg { left: auto !important; right: 0 !important; width: 68% !important; opacity: 1 !important; }
html[data-theme="light"] .hero-dark-bg img { filter: none !important; }
html[data-theme="light"] .hero-dark::after { background: linear-gradient(90deg,#fff 0%,#fff 31%,rgba(255,255,255,.99) 39%,rgba(255,255,255,.92) 46%,rgba(255,255,255,.6) 54%,rgba(255,255,255,.2) 62%,rgba(255,255,255,0) 70%) !important; }
html[data-theme="light"] .hero-dark-copy-wrap { padding: 45px 62px !important; }
html[data-theme="light"] .hero-dark-copy h1 { max-width: 600px; color: var(--light-navy) !important; font-size: 54px !important; line-height: 1.03 !important; letter-spacing: -.035em !important; }
html[data-theme="light"] .hero-dark-copy h1 .grad-text { background: none !important; color: var(--light-gold) !important; }
html[data-theme="light"] .hero-dark-copy h1 .hero-headline-gold { color: var(--brand-gold, #C78402) !important; -webkit-text-fill-color: var(--brand-gold, #C78402) !important; }
html[data-theme="light"] .hero-dark-copy h1 .hero-headline-navy { color: var(--brand-navy, #071C42) !important; -webkit-text-fill-color: var(--brand-navy, #071C42) !important; }
html[data-theme="light"] .hero-dark-copy .eyebrow { color: var(--light-gold) !important; }
html[data-theme="light"] .hero-dark-copy .hero-dark-sub { color: #3e4a60 !important; }
html[data-theme="light"] .hero-dark-copy .link-arrow { background: var(--light-navy); color: #fff; padding: 14px 22px; }
html[data-theme="light"] .scroll-cue { color: #687184 !important; }

html[data-theme="light"] .stats-band { background: #fff !important; border-bottom: 1px solid var(--light-line); }
html[data-theme="light"] .stats-band-item { min-height: 126px; border-color: var(--light-line) !important; }
html[data-theme="light"] .stats-band-icon,
html[data-theme="light"] .stats-band-item .num { color: var(--light-gold) !important; }

/* Final reference lock: no legacy dark, purple, magenta, or neon surfaces. */
html[data-theme="light"] {
  --dark-bg: #fff !important;
  --dark-bg-soft: var(--light-cream) !important;
  --dark-line: var(--light-line) !important;
  --dark-text-soft: var(--light-muted) !important;
  --void: #fff !important;
  --void-line: var(--light-line) !important;
  --grad-purple: var(--light-navy) !important;
  --grad-pink: var(--light-gold) !important;
  --grad-orange: var(--light-gold) !important;
  --accent-cyan: var(--light-gold) !important;
  --accent-purple: var(--light-gold) !important;
  --accent-orange: var(--light-gold) !important;
  --accent-teal: var(--light-gold) !important;
  --accent-pink: var(--light-gold) !important;
  --purple: var(--light-gold) !important;
  --magenta: var(--light-gold) !important;
  --cyan: var(--light-gold) !important;
  --orange: var(--light-gold) !important;
}
html[data-theme="light"] .page,
html[data-theme="light"] main,
html[data-theme="light"] section,
html[data-theme="light"] footer,
html[data-theme="light"] .content { background-color: #fff !important; color: var(--light-ink) !important; }
html[data-theme="light"] .approach-orbital,
html[data-theme="light"] .editorial-section,
html[data-theme="light"] .belief-section,
html[data-theme="light"] .light-section,
html[data-theme="light"] .conversation,
html[data-theme="light"] .fit,
html[data-theme="light"] .global-model { background-color: var(--light-cream) !important; }
html[data-theme="light"] .page *:not(img):not(svg):not(path),
html[data-theme="light"] .content *:not(img):not(svg):not(path) { border-color: var(--light-line); }
html[data-theme="light"] [class*="purple"],
html[data-theme="light"] [class*="magenta"],
html[data-theme="light"] [class*="orange"],
html[data-theme="light"] [class*="cyan"] { color: var(--light-gold) !important; border-color: var(--light-gold) !important; }
html[data-theme="light"] [class*="purple"]::before,
html[data-theme="light"] [class*="magenta"]::before,
html[data-theme="light"] [class*="orange"]::before,
html[data-theme="light"] [class*="cyan"]::before { background-image: none !important; }
html[data-theme="light"] .grad-text,
html[data-theme="light"] h1 em,
html[data-theme="light"] h2 em,
html[data-theme="light"] .hero h1 em,
html[data-theme="light"] .hero h2 { background: none !important; background-image: none !important; color: var(--light-navy) !important; -webkit-text-fill-color: var(--light-navy) !important; }
html[data-theme="light"] .hero-dark-bg { left: auto !important; right: 0 !important; width: 74% !important; background: transparent !important; }
/* The source photo has faint leftover text baked into its left ~18% (an old export
   mistake) — keep that strip fully covered, then fade out over the clean area. */
html[data-theme="light"] .hero-dark-bg::after { background: linear-gradient(90deg,#fff 0%,#fff 22%,rgba(255,255,255,.7) 30%,rgba(255,255,255,.2) 38%,rgba(255,255,255,0) 46%) !important; }
html[data-theme="light"] .hero-dark-bg img { object-position: center center !important; }
html[data-theme="light"] .hero-dark-bg .hero-image-dark { display: none !important; }
html[data-theme="light"] .hero-dark-bg .hero-image-light { display: block !important; }
html[data-theme="light"] .hero-dark-copy h1,
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4 { color: var(--light-navy) !important; }
html[data-theme="light"] p,
html[data-theme="light"] li,
html[data-theme="light"] span,
html[data-theme="light"] small { color: var(--light-muted) !important; }
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-label,
html[data-theme="light"] .detail-kicker,
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .content-type,
html[data-theme="light"] .learn,
html[data-theme="light"] .explore,
html[data-theme="light"] .read-link { color: var(--light-gold) !important; }
html[data-theme="light"] .site-header a,
html[data-theme="light"] .site-header button,
html[data-theme="light"] .site-header select { color: var(--light-navy) !important; }
html[data-theme="light"] .site-header .btn-grad,
html[data-theme="light"] .hero-dark-copy .link-arrow,
html[data-theme="light"] .hero-link,
html[data-theme="light"] .cta-button,
html[data-theme="light"] .final-cta a,
html[data-theme="light"] .industry-detail-cta a,
html[data-theme="light"] .button.primary { background: var(--light-navy) !important; color: #fff !important; border-color: var(--light-navy) !important; }
html[data-theme="light"] .site-header .btn-grad span,
html[data-theme="light"] .hero-dark-copy .link-arrow span,
html[data-theme="light"] .cta-button span,
html[data-theme="light"] .final-cta a b { color: var(--light-gold) !important; }
html[data-theme="light"] .card,
html[data-theme="light"] .industry-card,
html[data-theme="light"] .topic-card,
html[data-theme="light"] .featured-card,
html[data-theme="light"] .field-card,
html[data-theme="light"] .library-card,
html[data-theme="light"] .role-card,
html[data-theme="light"] .soft-left,
html[data-theme="light"] .stack,
html[data-theme="light"] .fit-grid article,
html[data-theme="light"] .conversation article,
html[data-theme="light"] .project-grid article,
html[data-theme="light"] .why-card { background: #fff !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; box-shadow: 0 8px 24px rgba(16,31,71,.05) !important; }
html[data-theme="light"] .card .icon-frame svg,
html[data-theme="light"] .industry-card svg,
html[data-theme="light"] .role-icon svg,
html[data-theme="light"] .stats svg { stroke: var(--light-navy) !important; }
html[data-theme="light"] .service-detail,
html[data-theme="light"] .industry-detail,
html[data-theme="light"] .why-detail,
html[data-theme="light"] .deep-content,
html[data-theme="light"] .conversation,
html[data-theme="light"] .fit,
html[data-theme="light"] .global-model,
html[data-theme="light"] .article-cover,
html[data-theme="light"] .perspective-track article { background: var(--light-cream) !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .hero-art,
html[data-theme="light"] .hero-area .hero-image,
html[data-theme="light"] .hero-area .hero-shade { background-image: none !important; opacity: 0 !important; }

@media (max-width: 820px) {
  html[data-theme="light"] .hero-dark-bg { left: 0 !important; right: 0 !important; width: 100% !important; opacity: .42 !important; }
  html[data-theme="light"] .hero-dark::after { background: linear-gradient(180deg,#fff 0%,#fff 48%,rgba(255,255,255,.82) 66%,rgba(255,255,255,.08) 100%) !important; }
}

/* Remove remaining legacy gradient/glow details from light-mode components. */
html[data-theme="light"] .lang-switch {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%230b1f47' stroke-opacity='.65' stroke-width='1.6'%3E%3Cpath d='M5 7.5l5 5 5-5'/%3E%3C/svg%3E") !important;
}
html[data-theme="light"] .hero-art,
html[data-theme="light"] .hero-area .hero-image,
html[data-theme="light"] .hero-area .hero-shade { background: #fff !important; background-image: none !important; }
html[data-theme="light"] .service-detail::before,
html[data-theme="light"] .industry-detail::before,
html[data-theme="light"] .why-detail::before,
html[data-theme="light"] .hero::after { background: none !important; box-shadow: none !important; }
html[data-theme="light"] .orbit-core,
html[data-theme="light"] .industry-core,
html[data-theme="light"] .cta-icon { background: var(--light-cream) !important; background-image: none !important; box-shadow: none !important; border-color: var(--light-gold) !important; }
html[data-theme="light"] .orbit,
html[data-theme="light"] .industry-orbit,
html[data-theme="light"] .why-orbit { border-color: rgba(7,28,66,.22) !important; }
html[data-theme="light"] .orbit::before,
html[data-theme="light"] .orbit::after,
html[data-theme="light"] .industry-orbit::before,
html[data-theme="light"] .industry-orbit::after,
html[data-theme="light"] .why-orbit::before,
html[data-theme="light"] .why-orbit::after { border-color: rgba(7,28,66,.22) !important; }
html[data-theme="light"] .project-mark,
html[data-theme="light"] .visual,
html[data-theme="light"] .visual-wave,
html[data-theme="light"] .library-visual,
html[data-theme="light"] .article-cover,
html[data-theme="light"] .final-cta { background: var(--light-cream) !important; background-image: none !important; filter: none !important; box-shadow: none !important; }
html[data-theme="light"] .logo-marquee,
html[data-theme="light"] .trusted-by,
html[data-theme="light"] .trusted { background: #fff !important; background-image: none !important; }
html[data-theme="light"] .card,
html[data-theme="light"] .industry-card,
html[data-theme="light"] .topic-card,
html[data-theme="light"] .featured-card,
html[data-theme="light"] .field-card,
html[data-theme="light"] .library-card,
html[data-theme="light"] .role-card,
html[data-theme="light"] .fit-grid article,
html[data-theme="light"] .conversation article,
html[data-theme="light"] .project-grid article,
html[data-theme="light"] .why-card { background-image: none !important; }
html[data-theme="light"] .shade {
  background: linear-gradient(90deg,#fff 0%,#fff 34%,rgba(255,255,255,.92) 54%,rgba(255,255,255,.4) 76%,rgba(255,255,255,0) 100%) !important;
}
html[data-theme="light"] .hero h1 span,
html[data-theme="light"] .hero h2 span,
html[data-theme="light"] .hero-copy h1 span,
html[data-theme="light"] .hero-copy h2 span {
  background: none !important;
  background-image: none !important;
  color: var(--light-gold) !important;
  -webkit-text-fill-color: var(--light-gold) !important;
}
html[data-theme="light"] .stats-band-item .label { color: var(--light-muted) !important; }

html[data-theme="light"] .approach-orbital { background: var(--light-cream) !important; color: var(--light-ink) !important; padding: 72px 0 70px !important; }
html[data-theme="light"] .approach-orbital-copy h2 { color: var(--light-navy) !important; font-size: 38px !important; line-height: 1.13 !important; }
html[data-theme="light"] .approach-orbital-copy > p:not(.eyebrow) { color: var(--light-muted) !important; }
html[data-theme="light"] .approach-orbital-copy .eyebrow { color: var(--light-gold) !important; }
html[data-theme="light"] .link-arrow-light { color: var(--light-navy) !important; }
html[data-theme="light"] .orbital-list-item { border-color: var(--light-line) !important; }
html[data-theme="light"] .orbital-list-item h3 { color: var(--light-navy) !important; }
html[data-theme="light"] .orbital-list-item p { color: var(--light-muted) !important; }

html[data-theme="light"] .trusted-by { background: #fff !important; border-top: 1px solid var(--light-line); border-bottom: 1px solid var(--light-line); padding: 54px 0 48px !important; }
html[data-theme="light"] .trusted-by-head .eyebrow { color: var(--light-gold) !important; }
html[data-theme="light"] .trusted-by-head > span { color: #777f8c !important; }
html[data-theme="light"] .logo-marquee { background: #fff !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .logo-marquee::before { background: linear-gradient(90deg,#fff,transparent) !important; }
html[data-theme="light"] .logo-marquee::after { background: linear-gradient(-90deg,#fff,transparent) !important; }
html[data-theme="light"] .client-logo img { filter: none !important; opacity: .86 !important; }
html[data-theme="light"] .trusted img { border: none !important; }
html[data-theme="light"] .project-type { color: var(--light-gold) !important; }
html[data-theme="light"] .project-path { border-top-color: var(--light-line) !important; color: var(--light-muted) !important; }
html[data-theme="light"] .project-path b { color: var(--light-gold) !important; }
html[data-theme="light"] .ms-logo span { color: var(--light-navy) !important; }
html[data-theme="light"] .client-logo:not(.ms-logo) img { filter: brightness(0) saturate(100%) !important; opacity: .68 !important; }

html[data-theme="light"] .industries-dark { background: #fff !important; color: var(--light-ink) !important; border-bottom: 1px solid var(--light-line); }
html[data-theme="light"] .industries-dark-copy h2,
html[data-theme="light"] .industry-icon-item { color: var(--light-navy) !important; }
html[data-theme="light"] .industries-dark-copy .eyebrow { color: var(--light-gold) !important; }
html[data-theme="light"] .industry-icon-item .icon { color: var(--light-gold) !important; border-color: var(--light-line) !important; }

html[data-theme="light"] .page,
html[data-theme="light"] .content,
html[data-theme="light"] .trusted,
html[data-theme="light"] .light-section { background-color: #fff !important; color: var(--light-ink) !important; }
html[data-theme="light"] .editorial-section,
html[data-theme="light"] .approach,
html[data-theme="light"] .who-we-are,
html[data-theme="light"] .belief-section,
html[data-theme="light"] .perspectives { background: var(--light-cream) !important; color: var(--light-ink) !important; }
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] .hero h1,
html[data-theme="light"] .page-hero h1 { color: var(--light-navy) !important; }
html[data-theme="light"] p,
html[data-theme="light"] .hero p,
html[data-theme="light"] .hero-copy p,
html[data-theme="light"] .page-hero p,
html[data-theme="light"] .editorial-lead { color: var(--light-muted) !important; }
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-label,
html[data-theme="light"] .detail-kicker,
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .stats strong,
html[data-theme="light"] .stats b { color: var(--light-gold) !important; }
html[data-theme="light"] .card,
html[data-theme="light"] .industry-card,
html[data-theme="light"] .approach-step,
html[data-theme="light"] .topic-card,
html[data-theme="light"] .featured-card,
html[data-theme="light"] .capability,
html[data-theme="light"] .av-capability-grid article,
html[data-theme="light"] .project-grid article,
html[data-theme="light"] .engagement-story-grid article,
html[data-theme="light"] .belief-grid article,
html[data-theme="light"] .team-member,
html[data-theme="light"] .why-card { background: #fff !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; box-shadow: 0 8px 24px rgba(16,31,71,.05) !important; }
html[data-theme="light"] .hero-link,
html[data-theme="light"] .cta-button,
html[data-theme="light"] .final-cta a,
html[data-theme="light"] .industry-detail-cta a,
html[data-theme="light"] .button.primary { background: var(--light-navy) !important; border-color: var(--light-navy) !important; color: #fff !important; }

@media (max-width: 820px) {
  html[data-theme="light"] .hero-dark { min-height: 620px !important; height: 620px !important; }
  html[data-theme="light"] .hero-dark-copy-wrap { padding: 54px 38px !important; }
  html[data-theme="light"] .hero-dark-copy h1 { font-size: 48px !important; }
  html[data-theme="light"] .hero-dark-bg { left: 0 !important; right: 0 !important; width: 100% !important; opacity: .42 !important; }
  html[data-theme="light"] .hero-dark::after { background: linear-gradient(180deg,#fff 0%,#fff 48%,rgba(255,255,255,.82) 66%,rgba(255,255,255,.08) 100%) !important; }
  html[data-theme="light"] .approach-orbital-grid { grid-template-columns: 1fr !important; }
  html[data-theme="light"] .site-footer { grid-template-columns: 1fr 1fr; height: auto; padding: 28px 5%; }
}
@media (max-width: 520px) {
  html[data-theme="light"] .site-header .brand-logo { width: 165px !important; }
  html[data-theme="light"] .hero-dark-copy-wrap { padding: 54px 22px !important; }
  html[data-theme="light"] .hero-dark-copy h1 { font-size: 40px !important; }
}

/* Service and industry line icons must remain visible on white cards. */
html[data-theme="light"] .card .icon-frame { color: var(--light-gold) !important; }
html[data-theme="light"] .card .icon-frame svg,
html[data-theme="light"] .industry-card svg { stroke: var(--light-navy) !important; }
html[data-theme="light"] .card .learn,
html[data-theme="light"] .industry-card .explore { color: var(--light-gold) !important; }
html[data-theme="light"] .card:hover .icon-frame,
html[data-theme="light"] .card.active .icon-frame { color: var(--light-navy) !important; }

html[data-theme="light"] .site-header .brand-logo {
  width: 250px !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: left center !important;
}
html[data-theme="light"] .hero-dark-bg { left: auto !important; right: 0 !important; width: 74% !important; }
html[data-theme="light"] .hero-dark-bg img { object-position: center center !important; }
html[data-theme="light"] .hero-dark-bg .hero-image-dark { display: none !important; }
html[data-theme="light"] .hero-dark-bg .hero-image-light { display: block !important; }

/* Explicit page-level cleanup for the independent Insights, Careers, Contact, and About styles. */
html[data-theme="light"] .article-cover,
html[data-theme="light"] .perspective-track article,
html[data-theme="light"] .conversation,
html[data-theme="light"] .fit,
html[data-theme="light"] .fit-grid article,
html[data-theme="light"] .global-model,
html[data-theme="light"] .global-model-grid article,
html[data-theme="light"] .global-statement,
html[data-theme="light"] .role-icon,
html[data-theme="light"] .stats,
html[data-theme="light"] .stats > div { background: #fff !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .global-statement { background: var(--brand-cool-mist, #EAF0F7) !important; border-left-color: var(--light-gold) !important; }
html[data-theme="light"] .global-statement strong { color: var(--light-navy) !important; }
html[data-theme="light"] .article-cover,
html[data-theme="light"] .perspective-track article,
html[data-theme="light"] .conversation,
html[data-theme="light"] .fit,
html[data-theme="light"] .global-model { background: var(--light-cream) !important; }
html[data-theme="light"] .article-cover > strong,
html[data-theme="light"] .perspective-track p,
html[data-theme="light"] .conversation h2,
html[data-theme="light"] .conversation h3,
html[data-theme="light"] .fit h2,
html[data-theme="light"] .global-model h2,
html[data-theme="light"] .global-model-grid h3,
html[data-theme="light"] .stats strong { color: var(--light-navy) !important; }
html[data-theme="light"] .article-cover > span,
html[data-theme="light"] .perspective-track b,
html[data-theme="light"] .conversation p,
html[data-theme="light"] .fit > p,
html[data-theme="light"] .fit-grid p,
html[data-theme="light"] .global-model-copy p,
html[data-theme="light"] .global-model-grid p,
html[data-theme="light"] .stats span { color: var(--light-muted) !important; }
html[data-theme="light"] .library-visual,
html[data-theme="light"] .featured-card .visual { background: var(--light-cream) !important; }
/* Insight thumbnail patterns were cyan/purple/orange on near-black — flattening them
   to plain cream (as an earlier pass did) left the library grid with no visual
   interest at all, so they get navy/gold patterns instead of just going blank. */
html[data-theme="light"] .thumb-grid {
  background-image: linear-gradient(rgba(7,28,66,.12) 1px,transparent 1px),
    linear-gradient(90deg,rgba(7,28,66,.12) 1px,transparent 1px),
    radial-gradient(circle at 70% 35%,rgba(199,132,2,.22),var(--light-cream) 60%) !important;
  background-size: 13px 13px,13px 13px,100% 100% !important;
  background-color: var(--light-cream) !important;
}
html[data-theme="light"] .thumb-code {
  background-image: repeating-linear-gradient(90deg,rgba(7,28,66,.16) 0 2px,transparent 2px 8px),
    linear-gradient(135deg,var(--light-cream),#efe2c4) !important;
  background-color: var(--light-cream) !important;
}
html[data-theme="light"] .thumb-rings::before,
html[data-theme="light"] .thumb-rings::after { border-color: rgba(199,132,2,.55) !important; }
html[data-theme="light"] .thumb-rings { background: var(--light-cream) !important; }
html[data-theme="light"] .thumb-led {
  background-image: radial-gradient(circle,rgba(199,132,2,.5) 2px,transparent 3px) !important;
  background-size: 18px 18px !important;
  background-color: var(--light-cream) !important;
}
html[data-theme="light"] .thumb-flow { background: linear-gradient(135deg,var(--light-cream),#e4ecf5) !important; }
html[data-theme="light"] .thumb-flow::after { background: repeating-radial-gradient(ellipse at 100% 50%,transparent 0 12px,rgba(7,28,66,.16) 13px 14px) !important; }
html[data-theme="light"] .role-icon svg,
html[data-theme="light"] .stats svg { stroke: var(--light-gold) !important; }

@media (max-width: 520px) {
  html[data-theme="light"] .site-header .brand-logo { width: 220px !important; }
}

/* Keep every public section light; page heroes other than home await new images. */
html[data-theme="light"] section,
html[data-theme="light"] .page,
html[data-theme="light"] main { color: var(--light-ink) !important; }
html[data-theme="light"] .hero-art,
html[data-theme="light"] .hero-area .hero-image,
html[data-theme="light"] .hero-area .hero-shade { background-image: none !important; opacity: 0 !important; }
html[data-theme="light"] .hero-area,
html[data-theme="light"] .hero,
html[data-theme="light"] .hero-copy { background: #fff !important; }
html[data-theme="light"] .service-detail,
html[data-theme="light"] .industry-detail,
html[data-theme="light"] .why-detail,
html[data-theme="light"] .detail-panel,
html[data-theme="light"] .feature-block,
html[data-theme="light"] .deep-content,
html[data-theme="light"] .cta,
html[data-theme="light"] .final-cta,
html[data-theme="light"] .outcome-panel,
html[data-theme="light"] .challenge-panel { background: #fff !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .service-detail::before,
html[data-theme="light"] .why-detail::before { opacity: 0 !important; }
html[data-theme="light"] .detail-item,
html[data-theme="light"] .faq-list,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .editorial-block,
html[data-theme="light"] .examples-block,
html[data-theme="light"] .outcomes-block,
html[data-theme="light"] .faq-block,
html[data-theme="light"] .feature-block { border-color: var(--light-line) !important; }
html[data-theme="light"] .detail-item strong,
html[data-theme="light"] .faq-item button,
html[data-theme="light"] .detail-copy h3,
html[data-theme="light"] .deep-content h4,
html[data-theme="light"] .feature-copy h4,
html[data-theme="light"] .cta h3,
html[data-theme="light"] .final-cta h2 { color: var(--light-navy) !important; }
html[data-theme="light"] .detail-item span,
html[data-theme="light"] .detail-copy > p,
html[data-theme="light"] .deep-content p,
html[data-theme="light"] .feature-copy p,
html[data-theme="light"] .faq-answer p,
html[data-theme="light"] .cta p,
html[data-theme="light"] .final-cta p { color: var(--light-muted) !important; }
html[data-theme="light"] .flow-node,
html[data-theme="light"] .service-flow > div,
html[data-theme="light"] .software-examples > div,
html[data-theme="light"] .feature-points > div,
html[data-theme="light"] .outcome-flow > div,
html[data-theme="light"] .application-grid article,
html[data-theme="light"] .examples-grid article { background: var(--light-cream) !important; color: var(--light-ink) !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .flow-node,
html[data-theme="light"] .service-flow > div { color: var(--light-navy) !important; }
html[data-theme="light"] .flow-node.accent,
html[data-theme="light"] .service-flow > div.accent { border-color: var(--light-gold) !important; box-shadow: none !important; }
html[data-theme="light"] .world-card,
html[data-theme="light"] .why-graphic,
html[data-theme="light"] .feature-graphic,
html[data-theme="light"] .detail-visual { background: var(--light-cream) !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .map-image--dark { display: none !important; }
html[data-theme="light"] .map-image--light {
  display: block !important;
  width: 100% !important;
  object-fit: cover !important;
  background: var(--light-cream) !important;
}
html[data-theme="light"] .legend--dark-only { display: none !important; }
html[data-theme="light"] .round-icon,
html[data-theme="light"] .why-icon,
html[data-theme="light"] .value-icon,
html[data-theme="light"] .people-icon { color: var(--light-gold) !important; }
html[data-theme="light"] .stats,
html[data-theme="light"] .values-row,
html[data-theme="light"] .steps,
html[data-theme="light"] .industry-grid,
html[data-theme="light"] .project-grid,
html[data-theme="light"] .why-grid { background: transparent !important; border-color: var(--light-line) !important; }
html[data-theme="light"] .steps article:hover,
html[data-theme="light"] .industry-grid article:hover,
html[data-theme="light"] .project-grid article:hover,
html[data-theme="light"] .why-card:hover,
html[data-theme="light"] .why-card.active { background: #fff !important; box-shadow: 0 14px 35px rgba(16,31,71,.1) !important; }
html[data-theme="light"] .project-mark,
html[data-theme="light"] .final-cta { background: var(--light-cream) !important; }

@media (max-width: 1024px) {
  html[data-theme="light"] .site-footer { grid-template-columns: 1fr 1fr; height: auto; padding: 28px 5%; }
}

@media (max-width: 820px) {
  html[data-theme="light"] .hero-dark-bg { left: 0 !important; right: 0 !important; width: 100% !important; opacity: .42 !important; }
  html[data-theme="light"] .hero-dark::after { background: linear-gradient(180deg,#fff 0%,#fff 48%,rgba(255,255,255,.82) 66%,rgba(255,255,255,.08) 100%) !important; }
}

/* Light mode uses navy and gold only; remove legacy purple/magenta text accents. */
html[data-theme="light"] .grad-text,
html[data-theme="light"] h1 em,
html[data-theme="light"] h2 em,
html[data-theme="light"] .hero h1 em,
html[data-theme="light"] .hero h2,
html[data-theme="light"] .final-cta h2 span,
html[data-theme="light"] .purple,
html[data-theme="light"] .magenta,
html[data-theme="light"] .accent-purple,
html[data-theme="light"] .accent-pink,
html[data-theme="light"] .purple-border,
html[data-theme="light"] .purple-card { background: none !important; background-image: none !important; -webkit-text-fill-color: var(--light-navy) !important; color: var(--light-navy) !important; }
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-label,
html[data-theme="light"] .detail-kicker,
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .content-type,
html[data-theme="light"] .topic-num,
html[data-theme="light"] .apply-link,
html[data-theme="light"] .learn,
html[data-theme="light"] .explore,
html[data-theme="light"] .read-link,
html[data-theme="light"] .stats strong,
html[data-theme="light"] .stats b,
html[data-theme="light"] .stats-band-item .num { color: var(--light-gold) !important; }
html[data-theme="light"] .card:nth-child(2),
html[data-theme="light"] .card:nth-child(5),
html[data-theme="light"] .industry-card.purple,
html[data-theme="light"] .industry-card.magenta,
html[data-theme="light"] .role-card:nth-child(4n+2),
html[data-theme="light"] .role-card:nth-child(4n+4) { --accent: var(--light-gold) !important; }
html[data-theme="light"] .why-icon.purple,
html[data-theme="light"] .why-icon.orange,
html[data-theme="light"] .value-icon.purple,
html[data-theme="light"] .value-icon.orange,
html[data-theme="light"] .stats i.purple,
html[data-theme="light"] .stats i.orange { color: var(--light-gold) !important; }

/* Brand standards v3: AG Navy, AG Gold, Deep Blue, Cool Mist, Warm White, Slate. */
html[data-theme="light"] {
  --brand-navy: #071C42;
  --brand-deep-blue: #0D2D63;
  --brand-gold: #C78402;
  --brand-cool-mist: #EAF0F7;
  --brand-warm-white: #F7F4ED;
  --brand-slate: #667085;
  --light-navy: var(--brand-navy);
  --light-gold: var(--brand-gold);
  --light-muted: var(--brand-slate);
  --light-cream: var(--brand-warm-white);
  --light-line: #D9E0E8;
}
html[data-theme="light"] .service-detail,
html[data-theme="light"] .industry-detail,
html[data-theme="light"] .why-detail { background: var(--brand-warm-white) !important; }
html[data-theme="light"] .feature-story,
html[data-theme="light"] .industry-section { background: transparent !important; }
html[data-theme="light"] .detail-visual,
html[data-theme="light"] .orbit-core { background: var(--brand-warm-white) !important; }
html[data-theme="light"] .hero-dark-copy h1 .grad-text { color: var(--brand-gold) !important; -webkit-text-fill-color: var(--brand-gold) !important; }

/* Theme control: one compact slider in both color modes. */
.site-footer .theme-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  width: auto !important;
  max-width: max-content !important;
  justify-self: center !important;
  min-width: 0 !important;
  height: 26px !important;
  padding: 4px 8px 4px 5px !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.78) !important;
  font: 600 9px/1 "Avenir Next", "Segoe UI", Arial, sans-serif !important;
  letter-spacing: .04em;
  cursor: pointer;
  white-space: nowrap;
}
.site-footer .theme-toggle:hover { border-color: var(--light-gold, #C78402) !important; color: #fff !important; }
.site-footer .theme-toggle-track {
  position: relative;
  display: block;
  width: 28px;
  height: 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.28);
}
.site-footer .theme-toggle-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  transition: transform .2s ease, background-color .2s ease;
}
.site-footer .theme-toggle[aria-pressed="true"] .theme-toggle-track { background: #C78402; }
.site-footer .theme-toggle[aria-pressed="false"] .theme-toggle-track { background: #667085; }
.site-footer .theme-toggle[aria-pressed="false"] .theme-toggle-thumb { transform: translateX(12px); }

/* Final visual review: remove inherited dark gradients and restore card spacing. */
html[data-theme="light"] .page,
html[data-theme="light"] main,
html[data-theme="light"] section:not(.hero-dark),
html[data-theme="light"] footer,
html[data-theme="light"] .content,
html[data-theme="light"] .work,
html[data-theme="light"] .projects,
html[data-theme="light"] .trusted,
html[data-theme="light"] .why,
html[data-theme="light"] .expertise-industries,
html[data-theme="light"] .team-section,
html[data-theme="light"] .library-section,
html[data-theme="light"] .field,
html[data-theme="light"] .roles,
html[data-theme="light"] .apply { background-image: none !important; }
html[data-theme="light"] .hero-dark-bg { background-image: none !important; }

html[data-theme="light"] .steps article,
html[data-theme="light"] .role-card,
html[data-theme="light"] .why-card,
html[data-theme="light"] .fit-grid article,
html[data-theme="light"] .conversation article,
html[data-theme="light"] .topic-card,
html[data-theme="light"] .field-card,
html[data-theme="light"] .library-card,
html[data-theme="light"] .project-grid article,
html[data-theme="light"] .engagement-story-grid article,
html[data-theme="light"] .belief-grid article,
html[data-theme="light"] .av-capability-grid article,
html[data-theme="light"] .approach-step { padding: 26px 22px !important; }
html[data-theme="light"] .role-card .role-head,
html[data-theme="light"] .topic-card .topic-icon,
html[data-theme="light"] .field-card .field-icon { margin-bottom: 22px; }
html[data-theme="light"] .service-detail,
html[data-theme="light"] .industry-detail,
html[data-theme="light"] .why-detail,
html[data-theme="light"] .deep-content,
html[data-theme="light"] .global-model,
html[data-theme="light"] .conversation,
html[data-theme="light"] .fit,
html[data-theme="light"] .contact-section,
html[data-theme="light"] .intro,
html[data-theme="light"] .software,
html[data-theme="light"] .apply { background-image: none !important; }
html[data-theme="light"] .service-detail .deep-content > section,
html[data-theme="light"] .industry-detail .industry-section,
html[data-theme="light"] .why-detail { padding-top: 40px; padding-bottom: 40px; }

/* About page "how we work" steps and industries grid ship their own dark-theme-only
   CSS (public-pages/about/styles.css) that was never covered above — they were
   rendering as illegible dark-on-dark cards. */
html[data-theme="light"] .steps article {
  background: #fff !important;
  border-color: var(--light-line) !important;
  color: var(--light-ink) !important;
}
html[data-theme="light"] .steps span,
html[data-theme="light"] .steps span.purple,
html[data-theme="light"] .steps i { color: var(--light-gold) !important; }
html[data-theme="light"] .steps h3 { color: var(--light-navy) !important; }
html[data-theme="light"] .steps p { color: var(--light-muted) !important; }

html[data-theme="light"] .industry-grid article {
  --accent: var(--light-gold) !important;
  background: #fff !important;
  border-color: var(--light-line) !important;
}
html[data-theme="light"] .industry-grid h3 { color: var(--light-navy) !important; }

/* Dark-theme-only white link text left invisible on the light background. */
html[data-theme="light"] .link-arrow { color: var(--light-navy) !important; }

/* About page "statement" quote band and AV callout box: dark-navy fill and a banned
   magenta/orange/cyan gradient border, never covered above. */
html[data-theme="light"] .statement {
  background: var(--light-cream) !important;
  border: 1px solid var(--light-line) !important;
  color: var(--light-navy) !important;
  animation: none !important;
}
html[data-theme="light"] .eyebrow:after,
html[data-theme="light"] .eyebrow::after { background: var(--light-gold) !important; }
html[data-theme="light"] .av-callout {
  border-left: 2px solid var(--light-gold) !important;
  background: var(--light-cream) !important;
}
html[data-theme="light"] .av-callout strong { color: var(--light-navy) !important; }
html[data-theme="light"] .av-callout span { color: var(--light-muted) !important; }
html[data-theme="light"] .av-copy li:before { color: var(--light-gold) !important; }

/* About page stats row and section kicker used a per-item rainbow accent class
   (cyan/purple/orange/pink/teal) instead of the brand's gold-only accent. */
html[data-theme="light"] .editorial-label { color: var(--light-gold) !important; }
html[data-theme="light"] .stats i,
html[data-theme="light"] .stats strong { color: var(--light-gold) !important; }
html[data-theme="light"] .stats > div:after { background: linear-gradient(90deg,transparent,var(--light-gold),transparent) !important; }

/* "Why AG Consulting" detail panel: dark quad cards, plus an orbiting-dot diagram
   whose accent color is set per-tab via the --detail custom property (inline style,
   JS-driven) — override it with !important so every tab renders gold, not the
   original cyan/purple/orange/pink rotation. */
html[data-theme="light"] #why-detail { --detail: var(--light-gold) !important; }
html[data-theme="light"] .why-point { background: #fff !important; border: 1px solid var(--light-line) !important; }
html[data-theme="light"] .why-point strong { color: var(--light-navy) !important; }
html[data-theme="light"] .why-point span { color: var(--light-muted) !important; }
html[data-theme="light"] .why-core { color: #fff !important; }
html[data-theme="light"] .why-tag { color: var(--light-muted) !important; }
html[data-theme="light"] .office { background: var(--light-gold) !important; }
html[data-theme="light"] .project { background: var(--light-navy) !important; }
html[data-theme="light"] .why-card { --why-accent: var(--light-gold) !important; }

/* Work/Team/Careers page-hero and CTA bands play a background video plus a navy/blue
   gradient ::before overlay — text color was switched to navy for light theme but the
   background never was, leaving navy-on-navy. */
html[data-theme="light"] .page-hero,
html[data-theme="light"] .cta { background: var(--light-cream) !important; }
html[data-theme="light"] .page-hero-video,
html[data-theme="light"] .cta-video { display: none !important; }
html[data-theme="light"] .page-hero::before,
html[data-theme="light"] .cta::before { background: none !important; }
html[data-theme="light"] .cta h3,
html[data-theme="light"] .cta h2 { color: var(--light-navy) !important; }
html[data-theme="light"] .cta p { color: var(--light-muted) !important; }
html[data-theme="light"] .page-hero .eyebrow { color: var(--light-gold) !important; }

/* Same per-tab rainbow-accent pattern (JS sets a --detail/--industry custom property
   inline per active tab) also drives the Services and Industries detail panels. */
html[data-theme="light"] .service-detail { --detail: var(--light-gold) !important; }
html[data-theme="light"] #industry-detail { --industry: var(--light-gold) !important; }
/* .cyan/.purple/.magenta/.orange utility classes set their own --accent custom
   property (used by card underlines, "Explore" links, and icon strokes) — the
   catch-all color rule above doesn't reach custom properties, so force this too. */
html[data-theme="light"] .cyan,
html[data-theme="light"] .purple,
html[data-theme="light"] .magenta,
html[data-theme="light"] .orange { --accent: var(--light-gold) !important; }

/* About page: "values row" (Engineering Excellence, Strategic Partnership, etc.) shares
   a hover rule with several other grids; those other grids already got a base
   !important background that survives hover, but values-row never did, so hovering
   still dropped to the original dark-theme hover color (#081629) with no text-color
   fix to match, making it unreadable. */
html[data-theme="light"] .values-row article {
  background: #fff !important;
  border-color: var(--light-line) !important;
}
html[data-theme="light"] .values-row article:hover {
  background: var(--light-cream) !important;
  border-color: var(--light-gold) !important;
  box-shadow: none !important;
}
html[data-theme="light"] .values-row h3 { color: var(--light-navy) !important; }
html[data-theme="light"] .values-row p { color: var(--light-muted) !important; }
html[data-theme="light"] .value-icon { color: var(--light-gold) !important; }
html[data-theme="light"] .values-row { margin-bottom: 56px !important; }

/* About page industry-grid icons (Industries We Serve) doubled in size on request. */
html[data-theme="light"] .industry-grid article div { font-size: 48px !important; }

/* About page team-footer: was a dark card with a cyan left accent bar ("blue box") —
   flatten it to plain text inline with the rest of the team section. */
html[data-theme="light"] .team-footer {
  background: transparent !important;
  border-left: none !important;
  padding-left: 0 !important;
}
html[data-theme="light"] .team-footer span { color: var(--light-gold) !important; }
html[data-theme="light"] .team-footer p { color: var(--light-ink) !important; }

/* Services page: decision-framework grid, flow diagram, and real-world application
   cards were flat cream-on-cream with almost no definition — give them a white card
   + gold keyline, matching the card language used everywhere else on the site. */
html[data-theme="light"] .detail-item {
  background: #fff !important;
  border-top: 3px solid var(--light-gold) !important;
  padding: 20px 18px !important;
}
html[data-theme="light"] .flow-node {
  background: #fff !important;
  border: 1px solid var(--light-line) !important;
  border-top: 3px solid var(--light-gold) !important;
}
html[data-theme="light"] .flow-node.accent {
  border-top-color: var(--light-navy) !important;
  background: var(--light-cream) !important;
}
html[data-theme="light"] .examples-grid article,
html[data-theme="light"] .application-grid article {
  background: #fff !important;
  border: 1px solid var(--light-line) !important;
  border-top: 3px solid var(--light-gold) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease !important;
}
html[data-theme="light"] .examples-grid article:nth-child(even) { background: var(--brand-cool-mist, #EAF0F7) !important; }
html[data-theme="light"] .examples-grid article:hover,
html[data-theme="light"] .application-grid article:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 34px rgba(7,28,66,.14) !important;
  border-color: var(--light-gold) !important;
  border-top-color: var(--light-navy) !important;
}
html[data-theme="light"] .faq-item button { font-weight: 700 !important; }

/* Industries page: "Real World Applications" cards use a different class
   (.application-card, not .application-grid article) that was never covered, and the
   "Challenges we help solve" list had near-invisible light-gray text on a faint
   border, unreadable on a light background. */
html[data-theme="light"] .application-card {
  background: #fff !important;
  border: 1px solid var(--light-line) !important;
  border-top: 3px solid var(--light-gold) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease !important;
}
html[data-theme="light"] .application-grid .application-card:nth-child(even) { background: var(--brand-cool-mist, #EAF0F7) !important; }
html[data-theme="light"] .application-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 34px rgba(7,28,66,.14) !important;
  border-color: var(--light-gold) !important;
  border-top-color: var(--light-navy) !important;
}
html[data-theme="light"] .application-card:before { color: var(--light-gold) !important; }
html[data-theme="light"] .application-card strong { color: var(--light-navy) !important; }
html[data-theme="light"] .application-card p { color: var(--light-muted) !important; }
html[data-theme="light"] .challenge-list div { color: var(--light-ink) !important; border-bottom-color: var(--light-line) !important; }
html[data-theme="light"] .challenge-list span { color: var(--light-gold) !important; }

/* Industries "Let's Talk" per-industry CTA: was sized/colored for the dark theme
   (28px heading, cyan/purple/etc. border via --industry) and now sits after the
   "Why choose AG Consulting" section instead of before it. */
html[data-theme="light"] .industry-detail-cta h4 { font-size: 20px !important; color: var(--light-navy) !important; }
html[data-theme="light"] .industry-detail-cta { padding: 32px 0 !important; border-top: 1px solid var(--light-line) !important; }
html[data-theme="light"] .industry-detail-cta a { border-color: var(--light-navy) !important; }
html[data-theme="light"] .industry-detail-cta a span { color: var(--light-gold) !important; }

/* Insights hero "Browse all insights" button: white text/border on a white page
   background (never covered — --cyan resolves to gold for the border, but the text
   color itself was a literal hardcoded white). */
html[data-theme="light"] .hero-button { color: var(--light-navy) !important; border-color: var(--light-gold) !important; }
html[data-theme="light"] .hero-button span { color: var(--light-gold) !important; }

/* Careers "careers@agavconsulting.com" callout uses a soft cool-mist tint that reads
   well — reuse it for the About page's AV callout instead of plain cream. */
html[data-theme="light"] .av-callout { background: var(--brand-cool-mist, #EAF0F7) !important; border-left-color: var(--light-gold) !important; }
html[data-theme="light"] .global-note {
  background: var(--brand-cool-mist, #EAF0F7) !important;
  border-left-color: var(--light-gold) !important;
}
html[data-theme="light"] .global-note span { color: var(--light-gold) !important; }
html[data-theme="light"] .global-note p { color: var(--light-ink) !important; }

/* Real hero photography for Services/Careers/Insights (replacing the dark-theme
   gradients/photos that .hero-art was blanket-hidden to white for above). Each image
   already fades to white on its own left edge, so no extra CSS gradient is layered
   on top — just the image, right-anchored. */
html[data-theme="light"] .page-services .hero-art {
  opacity: 1 !important;
  inset: auto !important;
  top: 0 !important; left: auto !important; right: 0 !important;
  width: 65% !important;
  height: 428px !important;
  background: url("/services/assets/services-hero-light.png") right top / cover no-repeat !important;
}
html[data-theme="light"] .page-services .hero-art:before,
html[data-theme="light"] .page-services .hero-art:after { display: none !important; }
html[data-theme="light"] .page-services .hero,
html[data-theme="light"] .page-services .hero-copy { background: transparent !important; }
/* The "Digital Transformation" card carries a leftover .magenta accent class that
   also matches a text-gradient-cleanup rule elsewhere (background:none), wiping its
   card background along with it. */
html[data-theme="light"] .card.magenta { background: #fff !important; }

/* career_hero.png (unlike services/insights) has no built-in fade — the men and city
   view span its full width — so it needs its own CSS gradient to stay readable. */
html[data-theme="light"] .page-careers .hero-art {
  opacity: 1 !important;
  width: 70% !important;
  right: 0 !important;
  left: auto !important;
  background:
    linear-gradient(90deg, #fff 0%, #fff 15%, rgba(255,255,255,.85) 30%, rgba(255,255,255,.3) 50%, rgba(255,255,255,0) 70%),
    url("/careers/assets/career-hero-light.png") right top / cover no-repeat !important;
  animation: none !important;
}
html[data-theme="light"] .page-careers .shade { background: none !important; opacity: 0 !important; }

html[data-theme="light"] .page-insights .hero-art {
  opacity: 1 !important;
  background: url("/insights/assets/insights-hero-light.png") right center / cover no-repeat !important;
  transform: none !important;
  animation: none !important;
}
html[data-theme="light"] .page-insights .hero-shade { background: none !important; opacity: 0 !important; }
html[data-theme="light"] .page-insights .hero-dots { display: none !important; }

/* About page hero photo — same fade-in-image pattern as Services/Insights. */
html[data-theme="light"] .page-about .hero-art {
  opacity: 1 !important;
  width: 100% !important;
  right: 0 !important;
  background: url("/about/assets/about-hero-light.png") right center / cover no-repeat !important;
  animation: none !important;
}
html[data-theme="light"] .page-about .hero:after { background: none !important; }
html[data-theme="light"] .page-about .hero,
html[data-theme="light"] .page-about .hero-copy { background: transparent !important; }