/* 2026 AI B2B visual layer: calm graphite, indigo intelligence, mint status. */
:root {
  --ai-ink: #0a1020;
  --ai-deep: #101936;
  --ai-indigo: #5b61f6;
  --ai-sky: #31a9ff;
  --ai-mint: #55e0bd;
  --ai-pale: #f6f7fb;
}

body {
  color: #18243a;
  background: var(--ai-pale);
}

.site-nav {
  border-bottom-color: rgba(43, 56, 98, 0.1) !important;
  box-shadow: 0 10px 30px rgba(27, 37, 70, 0.045) !important;
}

.site-nav .links a:hover,
.site-nav .nav-links a:hover,
.site-nav nav a:hover,
.site-nav .links a.active,
.site-nav .nav-links a.active,
.site-nav nav a.active {
  color: var(--ai-indigo) !important;
}

.site-nav .links a::after,
.site-nav .nav-links a::after,
.site-nav nav a::after {
  background: var(--ai-indigo);
}

.site-nav .nav-cta::before,
.site-nav .phone-mark,
.site-nav .phone-icon,
.site-nav .contact-icon,
.site-nav .contact-btn::before {
  background: linear-gradient(135deg, var(--ai-indigo), var(--ai-sky)) !important;
}

/* Home */
#top.hero {
  background:
    radial-gradient(circle at 76% 35%, rgba(91, 97, 246, 0.36), transparent 24%),
    radial-gradient(circle at 56% 76%, rgba(85, 224, 189, 0.16), transparent 25%),
    linear-gradient(120deg, #080d18 0%, #111a35 52%, #172659 100%);
}

#top .hero-ring {
  border-color: rgba(126, 146, 255, 0.22);
  box-shadow: 0 0 0 74px rgba(91, 97, 246, 0.026), 0 0 0 148px rgba(85, 224, 189, 0.018);
}

#top .eyebrow,
#top .hero-badge,
#top .console-live,
#top .chart-percent,
#top .console-metric:nth-child(2) b,
#top .console-callout {
  color: var(--ai-mint) !important;
}

#top .button-primary {
  background: linear-gradient(135deg, var(--ai-indigo), var(--ai-sky));
}

#top .ai-console {
  border-color: rgba(143, 158, 255, 0.35);
  background: linear-gradient(145deg, rgba(29, 43, 93, 0.94), rgba(11, 22, 51, 0.92));
  box-shadow: 0 25px 64px rgba(2, 6, 24, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#top .console-chart,
#top .console-metric,
#top .console-status > div {
  border-color: rgba(151, 166, 255, 0.16);
  background: rgba(7, 15, 36, 0.29);
}

#top .console-bars i {
  background: linear-gradient(180deg, var(--ai-mint), var(--ai-sky));
}

#top .console-trace path,
#top .console-trace circle {
  stroke: var(--ai-mint);
  fill: var(--ai-mint);
}

/* Solutions */
#services.solutions-hero {
  background:
    radial-gradient(circle at 88% 11%, rgba(91, 97, 246, 0.11), transparent 25%),
    linear-gradient(90deg, rgba(91, 97, 246, 0.042) 1px, transparent 1px),
    linear-gradient(rgba(91, 97, 246, 0.042) 1px, transparent 1px),
    #fafbfe;
}

.service-card:hover,
.expertise-card:hover {
  border-color: rgba(91, 97, 246, 0.38);
  box-shadow: 0 24px 44px rgba(46, 58, 123, 0.12);
}

.service-number {
  color: var(--ai-indigo) !important;
  background: #edf0ff !important;
}

.process,
.delivery-board {
  background:
    radial-gradient(circle at 89% 10%, rgba(91, 97, 246, 0.29), transparent 25%),
    linear-gradient(130deg, #0b1220, #151e42) !important;
}

.process .kicker,
.process-list b,
.delivery-flow span {
  color: var(--ai-mint) !important;
}

/* Cases and insights */
#cases.case-hero,
#insights.insights {
  background-color: #f7f8fc;
  background-image:
    radial-gradient(circle at 88% 12%, rgba(91, 97, 246, 0.11), transparent 28%),
    linear-gradient(90deg, rgba(73, 95, 145, 0.04) 1px, transparent 1px),
    linear-gradient(rgba(73, 95, 145, 0.04) 1px, transparent 1px);
}

.proof-copy,
.case-outcome,
.metric:first-child {
  background: linear-gradient(145deg, #111b38, #0b142b) !important;
}

.assessment {
  background:
    radial-gradient(circle at 10% 18%, rgba(85, 224, 189, 0.17), transparent 28%),
    radial-gradient(circle at 88% 15%, rgba(91, 97, 246, 0.25), transparent 24%),
    linear-gradient(120deg, #0b1220, #182250 64%, #172c5c) !important;
}

.insight-card:hover {
  box-shadow: 0 20px 38px rgba(46, 58, 123, 0.13);
}

.card-top,
.insight-card:nth-child(3) .card-top {
  background: linear-gradient(135deg, #273a85, #4f5de1) !important;
}

.insight-card:nth-child(2) .card-top {
  background: linear-gradient(135deg, #126b73, #22a99d) !important;
}

/* About */
.about-hero {
  background:
    radial-gradient(circle at 88% 15%, rgba(74, 219, 206, 0.24), transparent 23%),
    radial-gradient(circle at 10% 98%, rgba(75, 133, 255, 0.11), transparent 30%),
    #f4f9fc !important;
}

.about-kicker,
.section-kicker {
  color: var(--ai-mint) !important;
}

.about-hero h1 em {
  color: #147df4 !important;
}

.hero-actions__primary,
.about-cta a {
  background: linear-gradient(135deg, var(--ai-mint), #36cfae) !important;
}

/* Shared small-screen safeguards for every standalone page. */
@media (max-width: 720px) {
  .wrap,
  .shell,
  .container {
    width: calc(100vw - 32px) !important;
    max-width: none !important;
  }

  .hero-inner {
    width: calc(100vw - 48px) !important;
    max-width: 420px !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .hero h1,
  .intro h1,
  .about-hero h1 {
    overflow-wrap: anywhere;
  }

  .hero-actions,
  .hero-actions__buttons {
    width: 100%;
    max-width: 100%;
  }

  .hero-actions a,
  .hero-actions button,
  .button-primary,
  .button-secondary {
    box-sizing: border-box;
    max-width: 100%;
  }

  .hero-actions a {
    width: 100% !important;
  }

  .hero-copy,
  .eyebrow {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .hero .eyebrow {
    display: flex;
    flex-wrap: wrap;
    line-height: 1.55;
  }

  .hero .hero-copy {
    word-break: break-all;
  }

  .hero-proof {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
  }

  .hero-proof > div {
    min-width: 0;
    padding-right: 8px !important;
  }

  .hero-proof span {
    overflow-wrap: anywhere;
  }

  .mobile-console-note {
    display: none !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .ai-console,
  .assurance-board,
  .delivery-board {
    animation: ai-float 6s ease-in-out infinite;
  }
}

@keyframes ai-float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-6px);
  }
}

/* Homepage: a concise company profile that connects service capability to trust. */
.home-about {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 15%, rgba(72, 216, 213, 0.14), transparent 28%),
    linear-gradient(135deg, #f7fbff, #edf7fa);
}

.home-about__grid {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: clamp(34px, 6vw, 84px);
  align-items: center;
}

.home-about .intro {
  max-width: 530px;
}

.home-about .text-link {
  display: inline-block;
  margin-top: 26px;
}

.home-about__panel {
  position: relative;
  overflow: hidden;
  padding: clamp(30px, 4vw, 48px);
  border: 1px solid rgba(121, 222, 221, 0.34);
  border-radius: 24px;
  background: linear-gradient(145deg, #0a2649, #104c74 58%, #0e7183);
  box-shadow: 0 28px 60px rgba(13, 68, 107, 0.16);
  color: #fff;
}

.home-about__panel::after {
  position: absolute;
  top: -135px;
  right: -110px;
  width: 320px;
  height: 320px;
  border: 1px solid rgba(139, 242, 238, 0.28);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(139, 242, 238, 0.045), 0 0 0 76px rgba(139, 242, 238, 0.03);
  content: "";
}

.home-about__panel > p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #73e6e1;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.15em;
}

.home-about__panel h3 {
  position: relative;
  z-index: 1;
  margin: 18px 0 32px;
  font-size: clamp(27px, 3vw, 39px);
  line-height: 1.27;
  letter-spacing: -0.05em;
}

.home-about__facts {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(190, 244, 241, 0.18);
  border-radius: 14px;
  background: rgba(185, 239, 240, 0.14);
}

.home-about__facts div {
  min-height: 106px;
  padding: 19px;
  background: rgba(5, 30, 62, 0.42);
}

.home-about__facts b,
.home-about__facts span {
  display: block;
}

.home-about__facts b {
  color: #fff;
  font-size: 25px;
  letter-spacing: -0.04em;
}

.home-about__facts span {
  margin-top: 5px;
  color: #b8dbe6;
  font-size: 12px;
}

.section-soft .step h3 {
  color: #fff;
  font-weight: 800;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
}

.quick-page-links {
  display: flex;
  align-items: center;
  gap: 9px;
}

.quick-page-links a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid #c9e4e7;
  border-radius: 999px;
  color: #168a9b;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.quick-page-links a:first-child {
  border-color: transparent;
  background: transparent;
  padding-right: 4px;
}

.quick-page-links a:hover {
  background: #168a9b;
  border-color: #168a9b;
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 760px) {
  .quick-page-links { flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .home-about__grid {
    grid-template-columns: 1fr;
  }

  .home-about__panel {
    padding: 28px 23px;
    border-radius: 19px;
  }

  .home-about__panel h3 {
    font-size: 29px;
  }

  .home-about__facts div {
    min-height: 96px;
    padding: 15px;
  }

  .trust .data-number::before {
    font-size: 48px;
  }
}
