/*
 * Shared content-element color themes.
 *
 * The component templates keep responsibility for layout and brand accents. This layer
 * only normalizes neutral backgrounds, text, surfaces and borders so every component can
 * be placed on both page templates. `inherit` stays transparent and derives its palette
 * from the surrounding page; `light` and `dark` create an explicit section background.
 */

/* Page wrappers provide the palette inherited by elements using `Standard`. */
body .site,
body .content-theme--light {
  --content-theme-heading: #171a20;
  --content-theme-text: #3a4150;
  --content-theme-muted: #6b7484;
  --content-theme-accent: #1b5bff;
  --content-theme-surface: #fbfcfe;
  --content-theme-surface-strong: #f1f4f8;
  --content-theme-border: rgba(23, 26, 32, 0.12);
  --content-theme-control-background: #ffffff;
  --content-theme-control-hover: #eef2f8;
}

body .subsite,
body .content-theme--dark {
  --content-theme-heading: #ffffff;
  --content-theme-text: #e8edf6;
  --content-theme-muted: #aeb8ca;
  --content-theme-accent: #6fa2ff;
  --content-theme-surface: #0c1526;
  --content-theme-surface-strong: #111d31;
  --content-theme-border: rgba(255, 255, 255, 0.13);
  --content-theme-control-background: #101a2b;
  --content-theme-control-hover: #16243a;
}

body .content-theme {
  --content-theme-background: transparent;

  background-color: var(--content-theme-background) !important;
  color: var(--content-theme-text, inherit) !important;
}

/* Existing records without a stored value behave exactly like `inherit`. */

body .content-theme--light {
  --content-theme-background: #ffffff;
}

body .content-theme--dark {
  --content-theme-background: #070c16;
}

/* Neutral typography follows the selected section palette. Brand/accent colors remain. */
body .content-theme :where(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  strong,
  blockquote,
  .u-color-171a20,
  .u-color-fff,
  .u-color-e8edf6,
  .u-color-dce6fa,
  .u-color-c6cfdd
) {
  color: var(--content-theme-heading) !important;
}

body .content-theme :where(
  .u-color-3a4150,
  .u-color-rgba-255-255-255-0-85,
  .u-color-rgba-255-255-255-0-88,
  .u-color-rgba-255-255-255-0-9,
  .u-color-rgba-255-255-255-0-92
) {
  color: var(--content-theme-text) !important;
}

body .content-theme :where(
  .u-color-5a6272,
  .u-color-5f6b7e,
  .u-color-6b7688,
  .u-color-7a8394,
  .u-color-7a8496,
  .u-color-8a93a6,
  .u-color-8fa3be,
  .u-color-9aa3b2,
  .u-color-9ba6b8,
  .u-color-aeb8ca,
  .u-color-rgba-255-255-255-0-4,
  .u-color-rgba-255-255-255-0-45,
  .u-color-rgba-255-255-255-0-55,
  .u-color-rgba-255-255-255-0-6,
  .u-color-rgba-255-255-255-0-65,
  .u-color-rgba-255-255-255-0-75,
  .feature-cards__text,
  .image-slider__hint,
  .image-slider__caption div,
  .pricing-card__muted,
  .pricing__legal,
  .success-story__quote,
  .text-section__text,
  .countup-section__text
) {
  color: var(--content-theme-muted) !important;
}

body .content-theme :where(
  .u-color-1b5bff,
  .u-color-6fa2ff,
  .feature-cards__text a,
  .image-slider__caption h3
) {
  color: var(--content-theme-accent) !important;
}

body .content-theme :where(
  .u-background-1b5bff,
  .u-background-6fa2ff
) {
  background: var(--content-theme-accent) !important;
}

/* Neutral component surfaces adapt; branded product/pricing cards remain intentional. */
body .content-theme :where(
  .u-background-fff,
  .u-background-fbfcfe,
  .u-background-f7f9fc,
  .u-background-070c16,
  .u-background-0a1120,
  .u-background-0c1526,
  .u-background-0d1728,
  .u-background-0f1a2c,
  .feature-cards__card,
  .success-story,
  .tableItemRow,
  .tableItemContentLeft,
  .tableItemContentRight
) {
  background: var(--content-theme-surface) !important;
}

body .content-theme :where(
  .u-background-rgba-23-26-32-0-08,
  .u-background-rgba-23-26-32-0-13,
  .u-background-rgba-255-255-255-0-05,
  .u-background-rgba-255-255-255-0-06,
  .u-background-rgba-255-255-255-0-08,
  .u-background-rgba-255-255-255-0-09,
  .u-background-rgba-255-255-255-0-1,
  .u-background-rgba-255-255-255-0-12,
  .u-background-rgba-255-255-255-0-14,
  .image-slider__segments span:not(.is-active),
  .pricing-card__divider
) {
  background: var(--content-theme-surface-strong) !important;
}

body .content-theme [class*="u-border-"][class*="rgba-23-26-32"],
body .content-theme [class*="u-border-"][class*="rgba-255-255-255"],
body .content-theme :where(
  .feature-cards__card,
  .image-slider__frame,
  .pricing-card,
  .success-story,
  .tableItemRow
) {
  border-color: var(--content-theme-border) !important;
}

/* Filter, slider and secondary controls must stay readable in both palettes. */
body .content-theme :where(
  .product-slider__filter,
  .product-slider__filter-select,
  .product-slider__arrow,
  .image-slider__control,
  .success-stories__filter,
  .success-stories__filter-select,
  .success-stories__arrow,
  .filter__button,
  .tabs__button
) {
  border-color: var(--content-theme-border) !important;
  background: var(--content-theme-control-background) !important;
  color: var(--content-theme-heading) !important;
}

body .content-theme :where(
  .product-slider__filter,
  .success-stories__filter,
  .filter__button,
  .tabs__button
):not(.is-active):hover,
body .content-theme :where(
  .product-slider__arrow,
  .image-slider__control,
  .success-stories__arrow
):not(:disabled):hover {
  background: var(--content-theme-control-hover) !important;
  color: var(--content-theme-heading) !important;
}

body .content-theme :where(
  .product-slider__filter,
  .success-stories__filter,
  .filter__button,
  .tabs__button
).is-active {
  border-color: #1b5bff !important;
  background: #1b5bff !important;
  color: #ffffff !important;
}

/* Pricing cards use the section palette unless an editorial card style is explicit. */
body .content-theme .pricing-card:not(.pricing-card--dark) {
  border-color: var(--content-theme-border) !important;
  background: var(--content-theme-surface) !important;
  color: var(--content-theme-heading) !important;
}

body .content-theme .pricing-card:not(.pricing-card--dark) .pricing-card__topline,
body .content-theme .pricing-card:not(.pricing-card--dark) .pricing-card__features {
  color: var(--content-theme-text) !important;
}

body .content-theme .pricing-card:not(.pricing-card--dark) .pricing-card__link {
  border-color: var(--content-theme-border) !important;
  color: var(--content-theme-heading) !important;
}

/* Dark visual islands keep light copy independently from the surrounding section. */
body .content-theme :where(
  .product-slider-card,
  .pricing-card--dark,
  .pricing-card__badge,
  .button--assistant,
  .footer-homepage__cta,
  .footer-homepage__team-card,
  a[class*="u-background-linear-gradient"]
) {
  --content-theme-heading: #ffffff;
  --content-theme-text: #eef2f8;
  --content-theme-muted: rgba(255, 255, 255, 0.68);
  --content-theme-accent: #6fa2ff;
  --content-theme-surface: #101a2b;
  --content-theme-surface-strong: rgba(255, 255, 255, 0.12);
  --content-theme-border: rgba(255, 255, 255, 0.16);
  --content-theme-control-background: #101a2b;
  --content-theme-control-hover: #16243a;
}

body .content-theme :where(.hover-u-color-fff:hover) {
  color: var(--content-theme-heading) !important;
}

body .content-theme :where(.workflow__badge) {
  border-color: var(--content-theme-border) !important;
  background: var(--content-theme-surface) !important;
}

body .content-theme :where(.workflow__badge-text) {
  color: var(--content-theme-muted) !important;
}

body .content-theme .feature-cards--capabilities .feature-cards__card:hover {
  border-color: color-mix(in srgb, var(--content-theme-accent) 45%, transparent) !important;
  background: var(--content-theme-control-hover) !important;
}

/* Light variants of the formerly dark-only header/footer use the dark logo artwork. */
body .content-theme--light.subsite-navigation img,
body .content-theme--light.subsite-footer img,
.site .content-theme.subsite-navigation:not(.content-theme--dark) img,
.site .content-theme.subsite-footer:not(.content-theme--dark) img,
body .content-theme--light.site-footer .footer-homepage__logo,
.site .content-theme.site-footer:not(.content-theme--dark) .footer-homepage__logo {
  filter: brightness(0) saturate(100%);
}

body .content-theme--light.site-footer .footer-homepage__grid,
.site .content-theme.site-footer:not(.content-theme--dark) .footer-homepage__grid {
  background-image:
    linear-gradient(rgba(23, 26, 32, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 26, 32, 0.035) 1px, transparent 1px) !important;
}

/* Fixed navigation benefits from a translucent explicit theme background. */
body .content-theme--light.subsite-navigation {
  background-color: rgba(255, 255, 255, 0.9) !important;
}

body .content-theme--dark.subsite-navigation {
  background-color: rgba(7, 12, 22, 0.9) !important;
}

.site .content-theme.subsite-navigation:not(.content-theme--light):not(.content-theme--dark) {
  background-color: rgba(255, 255, 255, 0.9) !important;
}

.subsite .content-theme.subsite-navigation:not(.content-theme--light):not(.content-theme--dark) {
  background-color: rgba(7, 12, 22, 0.9) !important;
}

@media (prefers-reduced-motion: reduce) {
  body .content-theme *,
  body .content-theme *::before,
  body .content-theme *::after {
    transition-duration: 0.01ms !important;
  }
}