:root {
  --theme-bg: #07110c;
  --theme-surface: rgba(9, 27, 18, 0.88);
  --theme-surface-strong: rgba(7, 20, 14, 0.94);
  --theme-surface-soft: rgba(12, 32, 22, 0.68);
  --theme-border: rgba(144, 183, 162, 0.18);
  --theme-text: #f4f7f2;
  --theme-text-soft: rgba(228, 237, 232, 0.76);
  --theme-accent: #0f9347;
  --theme-accent-strong: #19b85d;
  --theme-accent-soft: rgba(15, 147, 71, 0.16);
  --theme-shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
  --theme-hero-overlay: linear-gradient(
    135deg,
    rgba(4, 10, 7, 0.78),
    rgba(4, 10, 7, 0.22) 50%,
    rgba(15, 147, 71, 0.12)
  );
  color-scheme: dark;
}

html[data-theme="light"] {
  --theme-bg: #eef4ef;
  --theme-surface: rgba(255, 255, 255, 0.9);
  --theme-surface-strong: rgba(248, 251, 248, 0.96);
  --theme-surface-soft: rgba(244, 249, 245, 0.9);
  --theme-border: rgba(10, 37, 24, 0.12);
  --theme-text: #102117;
  --theme-text-soft: rgba(16, 33, 23, 0.72);
  --theme-accent: #0f9347;
  --theme-accent-strong: #0a7a39;
  --theme-accent-soft: rgba(15, 147, 71, 0.12);
  --theme-shadow: 0 20px 70px rgba(18, 54, 33, 0.12);
  --theme-hero-overlay: linear-gradient(
    135deg,
    rgba(242, 247, 243, 0.9),
    rgba(242, 247, 243, 0.36) 50%,
    rgba(15, 147, 71, 0.1)
  );
  color-scheme: light;

  /* Re-point every base token website.css's components already read
     (var(--text), var(--text-muted), var(--line), ...) so components
     re-theme automatically instead of needing a hand-maintained
     selector list here that drifts out of sync as pages get added. */
  --bg: var(--theme-bg);
  --panel: var(--theme-surface);
  --panel-strong: var(--theme-surface-strong);
  --surface: var(--theme-surface);
  --surface-soft: var(--theme-surface-soft);
  --text: var(--theme-text);
  --text-muted: var(--theme-text-soft);
  --ink: var(--theme-text);
  --line: var(--theme-border);
  --line-strong: rgba(10, 37, 24, 0.24);
  --accent: var(--theme-accent);
  --accent-strong: var(--theme-accent-strong);
  --shadow: var(--theme-shadow);
}

/* Logo: the header/footer surface flips from near-black to near-white
   between themes, so the wordmark asset has to flip with it — a single
   fixed-color logo goes invisible against one of the two surfaces. */
.brand-lockup__img--light { display: none; }
html[data-theme="light"] .brand-lockup__img--dark { display: none; }
html[data-theme="light"] .brand-lockup__img--light { display: block; }

html,
body {
  background: var(--theme-bg);
  color: var(--theme-text);
}

body,
body * {
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.site-body,
.site-shell,
main,
section,
footer {
  background-color: transparent;
  color: var(--theme-text);
}

body p,
body li,
body small,
body .hero-cinematic__lede,
body .manifesto-strip__text p,
body .section-copy p,
body .partner-band__copy p,
body .home-cta__copy p,
body .signal-card p,
body .home-cta__action-card p,
body .site-footer p,
body .breadcrumb,
body .tag-row span,
body .page-hero__lede,
body .site-header__signin,
body .nav-dropdown__link span,
body .mobile-nav__group-label,
body .mobile-nav__sublink {
  color: var(--theme-text-soft);
}

body h1,
body h2,
body h3,
body h4,
body strong,
body .page-hero__title,
body .hero-cinematic__copy h1,
body .manifesto-strip__copy h2,
body .section-copy h2,
body .partner-band__copy h2,
body .home-cta__copy h2,
body .home-cta__panel strong,
body .signal-card strong,
body .service-card h3,
body .product-card strong,
body .pricing-card strong,
body .nav-dropdown__link strong,
body .site-footer a,
body .site-nav > a,
body .site-nav__trigger,
body .mobile-nav > a,
body .mobile-nav__signin {
  color: var(--theme-text);
}

body a {
  color: inherit;
}

body .section-kicker,
body .text-link-arrow,
body .home-cta__label,
body .signal-card span,
body .service-card__top span,
body .page-hero .section-kicker,
body .pricing-card__eyebrow {
  color: var(--theme-accent-strong);
}

body .hero-accent {
  background: none;
  color: var(--theme-accent);
  -webkit-text-fill-color: currentColor;
}

body.site-body {
  background:
    radial-gradient(circle at top right, rgba(15, 147, 71, 0.12), transparent 24%),
    radial-gradient(circle at left center, rgba(228, 129, 47, 0.08), transparent 28%),
    linear-gradient(180deg, var(--theme-bg) 0%, color-mix(in srgb, var(--theme-bg) 88%, #102117 12%) 54%, var(--theme-bg) 100%);
}

body .hero-cinematic__overlay {
  background: var(--theme-hero-overlay);
}

body .hero-cinematic__grid {
  opacity: 0.5;
}

html[data-theme="light"] body .hero-cinematic__video {
  filter: saturate(0.9) brightness(1.04);
}

body .site-header__inner,
body .coming-soon-header,
body .mobile-nav,
body .nav-dropdown,
body .hero-cinematic,
body .metrics-band > div,
body .page-hero,
body .service-card,
body .process-grid article,
body .sector-card,
body .product-card,
body .pricing-card,
body .form-card,
body .signal-card,
body .contact-info-card,
body .cta-band__inner,
body .home-cta__inner,
body .home-cta__panel,
body .home-cta__action-card,
body .cookie-banner,
body .flash,
body .partner-marquee,
body .about-media img {
  border-color: var(--theme-border);
  box-shadow: var(--theme-shadow);
}

body .site-header__inner,
body .coming-soon-header,
body .mobile-nav,
body .nav-dropdown,
body .metrics-band > div,
body .service-card,
body .process-grid article,
body .sector-card,
body .product-card,
body .pricing-card,
body .form-card,
body .signal-card,
body .contact-info-card,
body .cookie-banner,
body .flash,
body .home-cta__panel,
body .home-cta__action-card {
  background: var(--theme-surface);
}

body .hero-cinematic,
body .page-hero,
body .cta-band__inner,
body .home-cta__inner {
  background-color: var(--theme-surface-strong);
}

html[data-theme="light"] body .page-hero,
html[data-theme="light"] body .cta-band__inner,
html[data-theme="light"] body .home-cta__inner,
html[data-theme="light"] body .hero-cinematic,
html[data-theme="light"] body .signal-card--primary,
html[data-theme="light"] body .signal-card--secondary,
html[data-theme="light"] body .pricing-card--featured,
html[data-theme="light"] body .home-cta--pricing .home-cta__inner,
html[data-theme="light"] body .home-cta--contact .home-cta__inner,
html[data-theme="light"] body .home-cta--careers .home-cta__inner {
  background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(234, 244, 238, 0.92));
}

body .hero-pill-row span,
body .hosting-band__list span,
body .sectors-teaser__chips a,
body .tag-row span,
body .home-cta__pills span,
body .home-cta__label {
  border-color: var(--theme-border);
}

body .hero-pill-row span,
body .hosting-band__list span,
body .sectors-teaser__chips a,
body .home-cta__pills span,
body .home-cta__label,
body .tag-row span {
  background: var(--theme-surface-soft);
}

body .button,
body button,
body input,
body textarea,
body select,
body .nav-toggle {
  border-color: var(--theme-border);
}

body .button-solid,
body button.button-solid,
body .cookie-banner button {
  background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-strong));
  color: #f7fff9;
  border-color: transparent;
}

body .button-ghost,
body .button-ghost-light,
body .nav-toggle {
  background: transparent;
  color: var(--theme-text);
}

html[data-theme="light"] body .button-ghost,
html[data-theme="light"] body .button-ghost-light,
html[data-theme="light"] body .nav-toggle {
  background: rgba(255, 255, 255, 0.44);
}

body .site-nav > a:hover,
body .site-nav__trigger:hover,
body .site-nav > a.is-active,
body .site-nav__item.is-active .site-nav__trigger,
body .nav-dropdown__link:hover,
body .nav-dropdown__link.is-active,
body .service-card:hover,
body .product-card:hover,
body .text-link-arrow:hover,
body .sectors-teaser__chips a:hover,
body .button:hover,
body button:hover {
  border-color: rgba(15, 147, 71, 0.42);
}

html[data-theme="light"] body .site-nav > a:hover,
html[data-theme="light"] body .site-nav__trigger:hover,
html[data-theme="light"] body .site-nav > a.is-active,
html[data-theme="light"] body .site-nav__item.is-active .site-nav__trigger,
html[data-theme="light"] body .nav-dropdown__link:hover,
html[data-theme="light"] body .nav-dropdown__link.is-active,
html[data-theme="light"] body .service-card:hover,
html[data-theme="light"] body .product-card:hover,
html[data-theme="light"] body .text-link-arrow:hover,
html[data-theme="light"] body .sectors-teaser__chips a:hover {
  background: rgba(15, 147, 71, 0.08);
}

body .theme-switch {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--theme-border);
  border-radius: 999px;
  background: var(--theme-surface-strong);
  color: var(--theme-text);
  box-shadow: var(--theme-shadow);
  cursor: pointer;
  backdrop-filter: blur(18px);
}

body .theme-switch:hover {
  border-color: rgba(15, 147, 71, 0.44);
}

/* Keep clear of the fixed cookie banner while it's showing (first
   visit only — it self-hides via .is-hidden on Accept). */
body:has(.cookie-banner:not(.is-hidden)) .theme-switch {
  bottom: 3.75rem;
}

body .theme-switch__label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--theme-text-soft);
}

body .theme-switch__value {
  min-width: 3.8rem;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: var(--theme-accent-soft);
  color: var(--theme-accent-strong);
  font-weight: 800;
  text-align: center;
}

@media (max-width: 768px) {
  body .theme-switch {
    right: 1rem;
    bottom: 1rem;
    gap: 0.6rem;
    padding: 0.72rem 0.9rem;
  }

  body .theme-switch__label {
    display: none;
  }

  body:has(.cookie-banner:not(.is-hidden)) .theme-switch {
    bottom: 4.75rem;
  }
}

/* Theme-safe component finishes. Keep layout and alignment in website.css;
   this layer only supplies predictable surfaces and readable text in both
   modes, including on top of the landing video. */
html[data-theme] body .site-header__inner,
html[data-theme] body .site-header.is-scrolled .site-header__inner,
html[data-theme] body .nav-dropdown,
html[data-theme] body .mobile-nav,
html[data-theme] body .metrics-band > div,
html[data-theme] body .service-card,
html[data-theme] body .process-grid article,
html[data-theme] body .sector-card,
html[data-theme] body .product-card,
html[data-theme] body .pricing-card,
html[data-theme] body .contact-info-card,
html[data-theme] body .form-card,
html[data-theme] body .cookie-banner,
html[data-theme] body .flash,
html[data-theme] body .home-cta__panel,
html[data-theme] body .home-cta__action-card {
  background-color: var(--theme-surface);
  color: var(--theme-text);
}

html[data-theme] body .page-hero,
html[data-theme] body .cta-band__inner,
html[data-theme] body .home-cta__inner {
  background-color: var(--theme-surface-strong);
  color: var(--theme-text);
}

html[data-theme="light"] body .hero-cinematic__overlay {
  background:
    linear-gradient(180deg, rgba(247, 251, 248, 0.9) 0%, rgba(242, 248, 244, 0.78) 48%, rgba(235, 245, 238, 0.92) 100%),
    radial-gradient(circle at 72% 42%, rgba(15, 147, 71, 0.12), transparent 28%);
}

html[data-theme="dark"] body .hero-cinematic__overlay {
  background:
    linear-gradient(180deg, rgba(6, 12, 11, 0.78) 0%, rgba(6, 12, 11, 0.52) 42%, rgba(6, 12, 11, 0.86) 100%),
    radial-gradient(circle at 72% 42%, rgba(228, 129, 47, 0.18), transparent 26%),
    radial-gradient(circle at 42% 72%, rgba(15, 147, 71, 0.16), transparent 28%);
}

html[data-theme] body .hero-cinematic__copy,
html[data-theme] body .hero-cinematic__side,
html[data-theme] body .home-cta__copy,
html[data-theme] body .home-cta__panel,
html[data-theme] body .home-cta__action-card,
html[data-theme] body .page-hero__inner,
html[data-theme] body .section-copy,
html[data-theme] body .manifesto-strip__copy,
html[data-theme] body .manifesto-strip__text {
  color: var(--theme-text);
}

html[data-theme] body .hero-cinematic__copy h1,
html[data-theme] body .hero-cinematic__copy h1 > span,
html[data-theme] body .page-hero h1,
html[data-theme] body .home-cta h2,
html[data-theme] body .section-copy h2,
html[data-theme] body .manifesto-strip__copy h2 {
  color: var(--theme-text);
}

html[data-theme] body .hero-cinematic__copy .hero-accent {
  background: none;
  color: var(--theme-accent-strong);
  -webkit-text-fill-color: currentColor;
}

html[data-theme] body .form-card--light {
  background: var(--theme-surface-strong);
  color: var(--theme-text);
}

html[data-theme] body .form-card--dark {
  background: var(--theme-surface);
  color: var(--theme-text);
}

html[data-theme] body .form-card input,
html[data-theme] body .form-card textarea,
html[data-theme] body .form-card select {
  background: var(--theme-surface-strong);
  border-color: var(--theme-border);
  color: var(--theme-text);
}

html[data-theme] body .form-card input::placeholder,
html[data-theme] body .form-card textarea::placeholder {
  color: var(--theme-text-soft);
  opacity: 1;
}

html[data-theme="light"] body .hero-cinematic__copy h1,
html[data-theme="light"] body .hero-cinematic__copy h1 > span,
html[data-theme="light"] body .hero-cinematic__lede {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72);
}

@media (max-width: 1024px) {
  body .theme-switch__label {
    display: none;
  }
}

@media (max-width: 520px), (max-height: 520px) and (orientation: landscape) {
  body:has(.cookie-banner:not(.is-hidden)) .theme-switch,
  body:has(.mobile-nav.is-open) .theme-switch {
    display: none;
  }
}