/**
 * IT WEBHUT — Luminous brand gradient for dark surfaces
 * Base purple + soft white-violet highlight (button-style)
 */

:root {
  --itwh-brand-glow: #ebe6ff;
  --itwh-brand-glow-mid: #c9bcff;
  --itwh-brand-glow-deep: #957ff6;

  /* Text & icons — light top → rich base bottom */
  --itwh-brand-gradient-text: linear-gradient(
    165deg,
    #f4f1ff 0%,
    #e3dcff 14%,
    #c9bcff 32%,
    #a894f8 52%,
    #7d65f2 72%,
    #6d52f4 88%,
    #624ceb 100%
  );

  /* Icons — slightly brighter read at small sizes */
  --itwh-brand-gradient-icon: linear-gradient(
    160deg,
    #f0ecff 0%,
    #d4caff 28%,
    #a894f8 58%,
    #6d52f4 100%
  );

  /* Buttons / surfaces — highlight top-right, base bottom-left */
  --itwh-brand-gradient-surface: linear-gradient(
    145deg,
    #ddd6ff 0%,
    #b8a8ff 18%,
    #8f78f8 42%,
    #6d52f4 68%,
    #5a45d4 100%
  );

  --itwh-brand-gradient-surface-hover: linear-gradient(
    145deg,
    #ece7ff 0%,
    #c9bcff 22%,
    #957ff6 50%,
    #7560f5 78%,
    #6d52f4 100%
  );

  --itwh-brand-glow-shadow: 0 0 28px rgba(166, 137, 255, 0.22);
}

/* ── Gradient text utility ── */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-glow-text,
  .itwh-chapter--dark .hero-agency__title span,
  .itwh-chapter--dark .itwh-prefooter-cta__title span,
  .itwh-mega-panel__eyebrow,
  .itwh-chapter--dark .sec-title__top__box::before,
  .itwh-chapter--dark .work-process .sec-title__top__box::before,
  .itwh-chapter--dark .itwh-sec-title .sec-title__top__box::before,
  .itwh-chapter--dark .accordion-services__num,
  .itwh-chapter--dark .solutions__sidebar-item.is-active .solutions__sidebar-num,
  .itwh-chapter--dark .portfolio-one__item__title a:hover,
  .itwh-chapter--dark .project-list__title:hover,
  .itwh-chapter--dark .itwh-hero-link a,
  .itwh-chapter--dark .footer1__title span {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }

  .itwh-chapter--dark .itwh-hero-link a:hover {
    background-image: linear-gradient(
      165deg,
      #faf8ff 0%,
      #e8e2ff 20%,
      #c4b8ff 45%,
      #a894f8 100%
    );
  }
}

/* Fallback when clip not supported */
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-glow-text,
  .itwh-chapter--dark .hero-agency__title span,
  .itwh-mega-panel__eyebrow,
  .itwh-chapter--dark .itwh-hero-link a {
    color: var(--itwh-brand-glow-mid);
  }
}

/* ── Gradient icons on dark ── */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-chapter--dark .accordion-services__arrow i,
  .itwh-chapter--dark .portfolio-one__item__rm i,
  .itwh-chapter--dark .project-list__arrow i,
  .itwh-chapter--dark .solutions__sidebar-item.is-active .solutions__sidebar-arrow i,
  .itwh-mega-panel__cta i,
  .itwh-chapter--dark .contact__chip.is-selected,
  .itwh-glow-icon {
    background-image: var(--itwh-brand-gradient-icon);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
}

/* ── Section labels on dark — subtle glow line + gradient label ── */
.itwh-chapter--dark .section-top__subtitle {
  color: var(--itwh-brand-glow-mid);
  text-shadow: 0 0 20px rgba(166, 137, 255, 0.18);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-chapter--dark .section-top__subtitle {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    text-shadow: none;
  }
}

.itwh-chapter--dark .section-top__subtitle::after {
  background: var(--itwh-brand-gradient-surface);
  box-shadow: 0 0 12px rgba(166, 137, 255, 0.35);
}

/* ── Mega menu on dark panel ── */
.itwh-mega-panel__cta {
  color: var(--itwh-brand-glow-mid);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-mega-panel__cta {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
}

.itwh-mega-panel__cta:hover {
  filter: brightness(1.08);
}

.itwh-mega-link:hover,
.itwh-mega-link:focus-visible {
  color: var(--itwh-brand-glow-mid);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-mega-link:hover,
  .itwh-mega-link:focus-visible {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
}

/* ── Primary buttons on dark — button-style surface gradient ── */
.header-area-1 .header-button .btn-main-primary .text,
.itwh-chapter--dark .btn-main-primary .text,
.itwh-chapter--dark #hero .itwh-hero-cta--primary .text,
.itwh-prefooter-cta .btn-main-primary .text,
.itwh-chapter--dark.contact .contact__submit-wrap .btn-main-primary .text {
  background: var(--itwh-brand-gradient-surface);
  color: #fff;
  -webkit-text-fill-color: #fff;
  box-shadow:
    0 0 0 1px rgba(201, 188, 255, 0.2),
    0 8px 24px rgba(109, 82, 244, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.header-area-1 .header-button .btn-main-primary:hover .text,
.itwh-chapter--dark .btn-main-primary:hover .text,
.itwh-chapter--dark #hero .itwh-hero-cta--primary:hover .text,
.itwh-prefooter-cta .btn-main-primary:hover .text {
  background: var(--itwh-brand-gradient-surface-hover);
  color: #fff;
  -webkit-text-fill-color: #fff;
  box-shadow:
    0 0 0 1px rgba(235, 230, 255, 0.28),
    0 10px 28px rgba(109, 82, 244, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

/* Nav hover underline — gradient streak */
.header-area-1 .main-menu > ul > li > a::after {
  background: var(--itwh-brand-gradient-surface);
  box-shadow: 0 0 10px rgba(166, 137, 255, 0.4);
}

/* Inner pages breadcrumb on dark */
body.itwh-inner-page .breadcrumb-area__links a:hover {
  color: var(--itwh-brand-glow-mid);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body.itwh-inner-page .breadcrumb-area__links a:hover {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
}

/* Tags / chips on dark */
.itwh-chapter--dark .accordion-services__tag,
.itwh-chapter--dark .solutions__tag,
.itwh-chapter--dark .portfolio-one__hover__tag {
  border-color: rgba(201, 188, 255, 0.22);
  color: var(--itwh-brand-glow-mid);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .itwh-chapter--dark .accordion-services__tag,
  .itwh-chapter--dark .solutions__tag {
    background-image: var(--itwh-brand-gradient-text);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
}