/* telefonansagen.ai: readable, saturated mint details; navy main headings. */
#mainWrapper {
  --tai-copy-ink: #001357;
  --tai-detail-mint: #27d4bd;
  --tai-mint-text: #27bcae;
}

/* Section labels, including the generator intro outside the article scope. */
#mainWrapper .content .b2b-section-eyebrow {
  color: var(--tai-mint-text) !important;
  opacity: 1;
}
#mainWrapper :is(.keyvisual-gradient, .b2b-section--accent) .b2b-section-eyebrow {
  color: #56dfcd !important;
}

/* Detail links use saturated mint; button skins stay independent. */
#mainWrapper .scope-design26 :is(p, li) a:not(:where(.cta1, .cta2, .cta3, .tai-rz-open, .tai-mk-open, .tai-pt-cart, .tai-calc-cart, .button, [role="button"])),
#mainWrapper .seite-kontakt .wrapper_formular .datenschutz a {
  color: var(--tai-mint-text) !important;
  text-decoration-color: var(--tai-detail-mint);
}
#mainWrapper .scope-design26 :is(.keyvisual-gradient, .b2b-section--accent) :is(p, li) a:not(:where(.cta1, .cta2, .cta3, .tai-rz-open, .tai-mk-open, .tai-pt-cart, .tai-calc-cart, .button, [role="button"])) {
  color: #fff !important;
}
#mainWrapper .scope-design26 :is(.keyvisual-gradient, .b2b-section--accent) :is(.b2b-feature, .tai-calc-controls, .tai-calc-card) :is(p, li) a:not(:where(.cta1, .cta2, .cta3, .tai-rz-open, .tai-mk-open, .tai-pt-cart, .tai-calc-cart, .button, [role="button"])) {
  color: var(--tai-mint-text) !important;
}
#mainWrapper .tai-calc :is(.tai-calc-split, .tai-calc-split strong, .tai-calc-rest.is-bonus, .tai-calc-rest.is-bonus strong) {
  color: var(--tai-mint-text);
}
#mainWrapper .musicpool .use,
#mainWrapper .musicpool .use .lbl {
  color: var(--tai-mint-text) !important;
}
#mainWrapper .musicpool :is(.listen, .use) svg {
  color: var(--tai-detail-mint);
}

/* Decorative icons and arrows use the original bright brand accent. */
#mainWrapper .scope-design26 :is(.b2b-feature, .b2b-usecase, .b2b-step) :is(i, svg),
#mainWrapper .scope-design26 :is(.b2b-feature, .b2b-usecase, .b2b-step) h3::after,
#mainWrapper .scope-design26 :is(.b2b-feature-icon, .d26-ico-xl) {
  color: var(--tai-detail-mint);
}

/* Replace the remaining green focus ink without introducing a new hue. */
#mainWrapper .scope-design26 :is(a, button, input, summary, [tabindex]):focus-visible {
  outline-color: var(--tai-copy-ink);
}
#mainWrapper .scope-design26 .hero .hero-glow:focus-within {
  outline-color: var(--tai-detail-mint);
}

/* Hero preview: quiet branded loading state, independent of the legacy popup. */
#taiHeroModal.tai-preview-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
  overflow-y: auto;
  background: rgba(0, 19, 87, .24);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
#taiHeroModal .tai-preview-loader {
  width: min(100%, 440px);
  box-sizing: border-box;
  padding: 36px;
  border: 1px solid rgba(39, 212, 189, .5);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 90px rgba(0, 19, 87, .18);
  text-align: center;
  color: #001357;
}
#taiHeroModal .tai-preview-loader__icon {
  width: 96px;
  height: 96px;
  display: grid;
  place-items: center;
  margin: 0 auto 24px;
  border-radius: 28px;
  background: #001357;
  color: #50d2bd;
}
#taiHeroModal .tai-preview-loader__eyebrow {
  margin: 0 0 10px;
  color: #27bcae;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: .12em;
}
#taiHeroModal h2 {
  margin: 0 0 14px;
  color: #001357;
  font-size: clamp(24px, 3vw, 30px);
  line-height: 1.2;
  font-weight: 700;
}
#taiHeroModal p:not(.tai-preview-loader__eyebrow) {
  margin: 0;
  color: #55647b;
  font-size: 16px;
  line-height: 1.6;
}
#taiHeroModal .tai-preview-loader__progress {
  height: 5px;
  margin-top: 28px;
  border-radius: 8px;
  background: #e8f7f4;
  overflow: hidden;
}
#taiHeroModal .tai-preview-loader__progress span {
  display: block;
  width: 40%;
  height: 100%;
  border-radius: inherit;
  background: #27d4bd;
  animation: tai-preview-progress 1.4s ease-in-out infinite alternate;
}
@keyframes tai-preview-progress { from { transform: translateX(-70%); } to { transform: translateX(230%); } }
@media (max-width: 480px) { #taiHeroModal .tai-preview-loader { padding: 28px 24px; } }
@media (prefers-reduced-motion: reduce) { #taiHeroModal .tai-preview-loader__progress span { animation: none; width: 100%; opacity: .7; } }
