/* AI/DX page — Survate Experience System with restrained violet accents. */

.dx-brand-concept {
  --dx-violet: #7357b8;
  --dx-violet-deep: #4b3987;
  --dx-violet-soft: #eee9fa;
  --dx-electric: #6d78d8;
  --dx-cyan: #56d8ff;
  --dx-blue: #6577ff;
  --dx-pink: #ef6fcf;
  --dx-coral: #ff7c70;
  --dx-amber: #ffc96a;
  --dx-green: #67dda9;
}

@property --dx-spectrum-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes dx-spectrum-spin {
  to { --dx-spectrum-angle: 360deg; }
}

@keyframes dx-spectrum-drift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes dx-ambient-float {
  0% { transform: translate3d(-1.5%, 0, 0) scale(1); }
  50% { transform: translate3d(1.5%, -1%, 0) scale(1.025); }
  100% { transform: translate3d(0, 1%, 0) scale(1); }
}

.dx-brand-concept .dx-page-hero {
  background:
    radial-gradient(circle at 86% 8%, rgba(86,216,255,.18) 0 120px, transparent 260px),
    radial-gradient(circle at 92% 30%, rgba(239,111,207,.19) 0 150px, transparent 300px),
    radial-gradient(circle at 76% 55%, rgba(255,201,106,.16) 0 130px, transparent 285px),
    radial-gradient(circle at 68% 18%, rgba(101,119,255,.17) 0 160px, transparent 315px),
    radial-gradient(circle at 15% 82%, rgba(109,138,122,.13) 0 170px, transparent 171px),
    linear-gradient(115deg, #f8f6f0 0%, var(--home-ivory) 55%, #e9e5f2 100%);
}
.dx-brand-concept .dx-page-hero .page-hero-bg {
  background:
    linear-gradient(115deg, rgba(86,216,255,.08), rgba(101,119,255,.06) 24%, rgba(239,111,207,.08) 48%, rgba(255,124,112,.07) 68%, rgba(255,201,106,.07) 84%, rgba(103,221,169,.06)),
    url("../img/home-connection-pattern.svg") 89% center / min(780px, 62vw) auto no-repeat !important;
  opacity: .28 !important;
  background-size: 220% 220%, min(780px, 62vw) auto !important;
  animation: dx-spectrum-drift 14s ease-in-out infinite;
}
.dx-brand-concept .dx-page-hero h1 { max-width: 790px; }

.dx-brand-concept .dx-hero-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(390px, .78fr);
}
.dx-brand-concept .dx-hero-panel {
  position: relative;
  overflow: hidden;
  min-height: 480px;
  padding: clamp(34px, 4vw, 54px);
  color: #fff;
  background:
    radial-gradient(circle at 78% 24%, rgba(144,118,216,.5), transparent 34%),
    linear-gradient(145deg, var(--home-navy) 0%, #172b50 58%, var(--dx-violet-deep) 135%);
  border: 1px solid rgba(171,145,235,.28);
  border-radius: 2px 62px 2px 2px;
  box-shadow: 0 28px 68px rgba(46,35,88,.22);
}
.dx-brand-concept .dx-hero-panel::before,
.dx-brand-concept .entry-box::before {
  position: absolute;
  inset: 0;
  z-index: 3;
  padding: 3px;
  pointer-events: none;
  content: "";
  background: conic-gradient(
    from var(--dx-spectrum-angle),
    var(--dx-cyan),
    var(--dx-blue),
    var(--dx-pink),
    var(--dx-coral),
    var(--dx-amber),
    var(--dx-green),
    var(--dx-cyan)
  );
  border-radius: inherit;
  filter: drop-shadow(0 0 10px rgba(116,120,255,.4));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: dx-spectrum-spin 7s linear infinite;
}
.dx-brand-concept .dx-hero-panel::after {
  position: absolute;
  right: -130px;
  bottom: -145px;
  width: 430px;
  height: 430px;
  content: "";
  background: url("../img/home-connection-pattern.svg") center / contain no-repeat;
  filter: hue-rotate(35deg) saturate(1.25);
  opacity: .34;
}
.dx-brand-concept .dx-hero-panel > * { position: relative; z-index: 1; }
.dx-brand-concept .dx-hero-panel .hero-card-label { color: #ddd0ff; }
.dx-brand-concept .dx-hero-list { position: relative; z-index: 2; }
.dx-brand-concept .dx-hero-list li {
  color: rgba(255,255,255,.88);
  border-color: rgba(255,255,255,.15);
}
.dx-brand-concept .dx-hero-list li::before { background: #b9a7ef; }
.dx-brand-concept .dx-orbit {
  border-color: rgba(203,187,246,.38);
  background: radial-gradient(circle, rgba(255,255,255,.1), rgba(115,87,184,.08) 55%, transparent 56%);
}
.dx-brand-concept .dx-orbit::before,
.dx-brand-concept .dx-orbit::after { border-color: rgba(203,187,246,.26); }
.dx-brand-concept .dx-orbit span {
  color: #fff;
  background: linear-gradient(135deg, rgba(86,216,255,.82), rgba(101,119,255,.9), rgba(239,111,207,.86), rgba(255,201,106,.8));
  background-size: 260% 260%;
  border: 1px solid rgba(255,255,255,.42);
  box-shadow: 0 10px 26px rgba(27,21,61,.26);
  animation: dx-spectrum-drift 9s ease-in-out infinite;
}

.dx-brand-concept .site-nav a[aria-current="page"] {
  background: rgba(115,87,184,.13);
  box-shadow: inset 0 -2px var(--dx-violet);
}
.dx-brand-concept .anchor-nav a:hover {
  color: var(--dx-violet-deep);
  background: rgba(115,87,184,.09);
}

.dx-brand-concept .section-heading .eyebrow,
.dx-brand-concept :where(.service-kicker, .card-number) { color: var(--dx-violet-deep); }
.dx-brand-concept .intro-text {
  color: var(--home-muted);
  background: linear-gradient(90deg, rgba(238,233,250,.76), rgba(255,255,255,.76));
  border-left-color: var(--dx-violet);
}

.dx-brand-concept .dx-value-grid { gap: 22px; }
.dx-brand-concept .feature-card {
  min-height: 280px;
  background: rgba(255,255,255,.84);
  border: 1px solid var(--home-line);
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, var(--dx-cyan), var(--dx-blue), var(--dx-pink), var(--dx-amber), var(--dx-green)) 1;
  border-radius: 2px 36px 2px 2px;
  box-shadow: none;
}
.dx-brand-concept .feature-card::after {
  background: linear-gradient(135deg, rgba(115,87,184,.1), rgba(109,138,122,.05));
}
.dx-brand-concept .feature-card :where(h3, p) { position: relative; z-index: 1; }

.dx-brand-concept .dx-use-card {
  position: relative;
  overflow: hidden;
  padding: 30px;
  color: var(--home-ink);
  background: rgba(255,255,255,.84);
  border: 1px solid var(--home-line);
  border-radius: 2px 34px 2px 2px;
  box-shadow: none;
}
.dx-brand-concept .dx-use-card::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  content: "";
  background: linear-gradient(180deg, var(--dx-violet), var(--home-sage));
}
.dx-brand-concept .dx-use-card h3 { color: var(--home-navy); }
.dx-brand-concept .dx-use-card p { color: var(--home-muted); }

.dx-brand-concept #ai-tools { background: #fff; }
.dx-brand-concept .tools-layout { gap: clamp(46px, 8vw, 110px); }
.dx-brand-concept .tool-stack {
  overflow: hidden;
  background: linear-gradient(140deg, rgba(238,233,250,.9), rgba(247,248,250,.94));
  border: 1px solid rgba(115,87,184,.2);
  border-radius: 2px 54px 2px 2px;
  box-shadow: 0 0 0 1px rgba(86,216,255,.08), 0 18px 48px rgba(75,57,135,.08);
}
.dx-brand-concept .tool-stack-item {
  color: var(--home-ink);
  background: rgba(255,255,255,.68);
  border-color: rgba(115,87,184,.16);
}
.dx-brand-concept .tool-stack-item:hover {
  background: #fff;
  border-left-color: var(--dx-violet);
}
.dx-brand-concept .tool-stack-item strong { color: var(--home-navy); }
.dx-brand-concept .tool-stack-item span { color: var(--home-muted); }
.dx-brand-concept .tool-stack-item::after { color: var(--dx-violet-deep); }

.dx-brand-concept #process {
  background:
    radial-gradient(circle at 84% 20%, rgba(115,87,184,.26) 0 205px, transparent 206px),
    url("../img/home-connection-pattern.svg") 94% center / min(780px, 62vw) auto no-repeat,
    var(--home-navy);
}
.dx-brand-concept #process .section-heading :where(h2, p:not(.eyebrow)) { color: #fff; }
.dx-brand-concept #process .eyebrow { color: #d9ccfb; }
.dx-brand-concept .dx-process li {
  color: #fff;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.17);
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, var(--dx-cyan), var(--dx-blue), var(--dx-pink), var(--dx-amber), var(--dx-green)) 1;
  border-radius: 2px 30px 2px 2px;
  box-shadow: none;
}
.dx-brand-concept .dx-process li :where(h3, p) { color: #fff; }
.dx-brand-concept .dx-process li p { color: rgba(255,255,255,.72); }
.dx-brand-concept .dx-process li > span {
  color: #ded2ff;
  background: transparent;
  border-color: rgba(203,187,246,.5);
}

.dx-brand-concept .dx-service-list { gap: 0; }
.dx-brand-concept .service-item {
  padding: 34px 12px;
  background: transparent;
  border-width: 1px 0 0;
  border-color: var(--home-line);
  box-shadow: none;
}
.dx-brand-concept .service-item:last-child { border-bottom: 1px solid var(--home-line); }
.dx-brand-concept .service-item h3 { color: var(--home-navy); }
.dx-brand-concept .service-item p { color: var(--home-muted); }
.dx-brand-concept .service-item .text-link { color: var(--dx-violet-deep); }

.dx-brand-concept #governance {
  background: linear-gradient(125deg, var(--home-ivory) 0%, #eeeaf6 100%);
}
.dx-brand-concept .mini-checks span {
  color: var(--dx-violet-deep);
  background: rgba(255,255,255,.72);
  border-color: rgba(115,87,184,.24);
}

.dx-brand-concept .faq-list details {
  overflow: hidden;
  color: var(--home-ink);
  background: rgba(255,255,255,.86);
  border: 1px solid var(--home-line);
  border-radius: 2px;
  box-shadow: none;
}
.dx-brand-concept .faq-list summary {
  padding: 25px 66px 25px 28px;
  color: var(--home-navy);
}
.dx-brand-concept .faq-list summary::after { color: var(--dx-violet-deep); }
.dx-brand-concept .faq-list details p { padding: 0 28px 26px; color: var(--home-muted); }

.dx-brand-concept .entry-box {
  background:
    radial-gradient(circle at 86% 18%, rgba(86,216,255,.22), transparent 27%),
    radial-gradient(circle at 94% 45%, rgba(239,111,207,.25), transparent 30%),
    radial-gradient(circle at 77% 74%, rgba(255,201,106,.18), transparent 28%),
    var(--home-navy);
}
.dx-brand-concept .entry-box .eyebrow { color: #d9ccfb; }
.dx-brand-concept .entry-box .button-light {
  color: #fff !important;
  background: linear-gradient(105deg, var(--dx-cyan), var(--dx-blue), var(--dx-pink), var(--dx-coral), var(--dx-amber), var(--dx-green), var(--dx-cyan)) !important;
  background-size: 350% 100% !important;
  border-color: rgba(203,187,246,.55) !important;
  text-shadow: 0 1px 7px rgba(10,24,46,.55);
  animation: dx-spectrum-drift 7s linear infinite;
}
.dx-brand-concept .entry-box .button-light:hover {
  color: #fff !important;
  border-color: #fff !important;
  filter: saturate(1.08) brightness(1.08);
}

@media (max-width: 980px) {
  .dx-brand-concept .dx-hero-grid { grid-template-columns: 1fr; }
  .dx-brand-concept .dx-hero-panel { width: min(100%, 760px); }
}

@media (max-width: 760px) {
  .dx-brand-concept .dx-page-hero h1 .text-keep { white-space: normal; }
  .dx-brand-concept .dx-hero-panel { min-height: 420px; border-radius: 2px 38px 2px 2px; }
  .dx-brand-concept :where(.feature-card, .dx-use-card, .tool-stack, .dx-process li) {
    border-radius: 2px 28px 2px 2px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dx-brand-concept .dx-page-hero .page-hero-bg,
  .dx-brand-concept .dx-hero-panel::before,
  .dx-brand-concept .dx-orbit span,
  .dx-brand-concept .entry-box::before,
  .dx-brand-concept .entry-box .button-light {
    animation: none !important;
  }
}