:root {
  --adaptive-light-text: var(--theme-color, #A8AD8C);
  --adaptive-dark-text: #FFFFFF;
  --adaptive-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --adaptive-duration: 560ms;
  --adaptive-segment-duration: 440ms;
}

/*
  Adaptive Typography contract
  - Apply .adaptive-text to text nodes that should adapt.
  - Mark nearest background containers with data-adaptive-region + data-bg-mode.
  - data-bg-mode supports: light | dark | complex
  - For complex media layers add data-bg-complex="true" and optional data-bg-luminance="0..1".
  - Optional segment controls:
    data-adaptive-segment-mode="auto|word|char|off"
    data-adaptive-segment-max-width="84"
    data-adaptive-sample-density="low|medium|high"
    data-adaptive-enter-threshold / data-adaptive-exit-threshold
    data-adaptive-lock-tone="light|dark"
*/
.adaptive-text {
  --adaptive-color: var(--adaptive-light-text);
  --adaptive-shadow: none;
  --adaptive-transition-duration: var(--adaptive-duration);
  color: var(--adaptive-color) !important;
  text-shadow: var(--adaptive-shadow) !important;
  mix-blend-mode: normal !important;
  transition:
    color var(--adaptive-transition-duration) var(--adaptive-ease),
    text-shadow var(--adaptive-transition-duration) var(--adaptive-ease),
    filter var(--adaptive-transition-duration) var(--adaptive-ease),
    opacity 260ms ease;
  will-change: color, text-shadow;
}

.adaptive-text--invert {
  color: #FFFFFF !important;
  text-shadow: none !important;
  filter: none !important;
  mix-blend-mode: difference !important;
  transition: opacity 180ms ease !important;
  isolation: auto;
}

.adaptive-text[data-adaptive-tone="light"] {
  --adaptive-shadow: none;
  filter: none;
}

.adaptive-text[data-adaptive-tone="dark"] {
  --adaptive-shadow: 0 2px 10px rgba(0,0,0,0.32);
  filter: saturate(1.03);
}

.adaptive-text[data-adaptive-mode="force-light"] {
  --adaptive-color: var(--adaptive-light-text);
}

.adaptive-text[data-adaptive-mode="force-dark"] {
  --adaptive-color: var(--adaptive-dark-text);
  --adaptive-shadow: 0 2px 10px rgba(0,0,0,0.35);
}

.adaptive-text[data-adaptive-backdrop="blur"] {
  backdrop-filter: blur(8px);
  background: rgba(13,13,13,0.14);
  border-radius: 999px;
  padding: 4px 12px;
}

/* Segmented layered rendering */
.adaptive-text.adaptive-text--segmented {
  color: transparent !important;
  text-shadow: none !important;
  filter: none !important;
  white-space: pre-wrap;
}

.adaptive-segment {
  --adaptive-segment-light-color: var(--adaptive-light-text);
  --adaptive-segment-dark-color: var(--adaptive-dark-text);
  --adaptive-segment-delay: 0ms;
  position: relative;
  display: inline-block;
  white-space: pre;
  vertical-align: baseline;
  contain: paint;
  pointer-events: none;
  backface-visibility: hidden;
  transform: translateZ(0);
}

.adaptive-segment__layer {
  display: block;
  transition:
    opacity var(--adaptive-segment-duration) var(--adaptive-ease),
    color var(--adaptive-segment-duration) var(--adaptive-ease),
    text-shadow var(--adaptive-segment-duration) var(--adaptive-ease),
    transform var(--adaptive-segment-duration) var(--adaptive-ease);
  transition-delay: var(--adaptive-segment-delay);
  will-change: opacity, color;
}

.adaptive-segment__light {
  color: var(--adaptive-segment-light-color);
  opacity: 1;
  text-shadow: none;
}

.adaptive-segment__dark {
  position: absolute;
  inset: 0;
  color: var(--adaptive-segment-dark-color);
  opacity: 0;
  text-shadow: 0 2px 10px rgba(0,0,0,0.28);
}

.adaptive-segment--tone-light .adaptive-segment__light {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.adaptive-segment--tone-light .adaptive-segment__dark {
  opacity: 0;
  transform: translate3d(0, 0.35px, 0);
}

.adaptive-segment--tone-dark .adaptive-segment__light {
  opacity: 0;
  transform: translate3d(0, -0.35px, 0);
}

.adaptive-segment--tone-dark .adaptive-segment__dark {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .adaptive-text {
    transition-duration: 80ms;
  }

  .adaptive-segment__layer {
    transition-duration: 90ms;
    transition-delay: 0ms;
    transform: none !important;
  }
}
