/* ── AI Sub-Pages — Shared Stylesheet ── */

body { background: #05050f; color: #fff; font-family: 'Inter', sans-serif; }

/* ── Page wrapper ── */
.ai-sub-world {
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}
.ai-sub-world::before {
  content: '';
  position: fixed;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 40% at 50% -10%, rgba(124,58,237,.18) 0%, transparent 60%),
    radial-gradient(ellipse 60% 30% at 90% 80%, rgba(6,182,212,.08) 0%, transparent 55%);
  pointer-events: none;
  z-index: 0;
}

.ai-sub-wrap {
  position: relative;
  z-index: 1;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 2rem;
}

/* ── Breadcrumb ── */
.ai-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: .8rem;
  font-weight: 600;
  color: rgba(196,181,253,.6);
  text-decoration: none;
  margin-bottom: 2rem;
  transition: color .2s;
}
.ai-breadcrumb:hover { color: #c4b5fd; }

/* ── Hero ── */
.ai-page-hero {
  padding: 7rem 2rem 4.5rem;
  text-align: center;
  position: relative;
  z-index: 1;
}
.ai-page-mod {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .18em;
  color: #06b6d4;
  font-family: 'Courier New', monospace;
  margin-bottom: 1.25rem;
}
.ai-page-badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem 1rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .06em;
  background: rgba(124,58,237,.14);
  border: 1px solid rgba(124,58,237,.3);
  color: #c4b5fd;
  margin-bottom: 1.5rem;
}
.ai-page-hero h1 {
  font-size: clamp(2rem, 5vw, 3.2rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
  margin-bottom: .85rem;
}
.ai-page-hero-desc {
  font-size: 1rem;
  color: rgba(255,255,255,.5);
  max-width: 560px;
  margin: 0 auto 2.5rem;
  line-height: 1.8;
}
.ai-page-hero-btns {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* Secondary button */
.btn-ai-secondary {
  padding: .9rem 2rem;
  border: 1px solid rgba(124,58,237,.4);
  border-radius: 999px;
  color: #c4b5fd;
  text-decoration: none;
  font-weight: 600;
  font-size: .9rem;
  transition: border-color .2s, color .2s;
}
.btn-ai-secondary:hover { border-color: #c4b5fd; color: #fff; }

/* ── Stats row ── */
.ai-page-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  max-width: 800px;
  margin: 0 auto 3rem;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 1rem;
  overflow: hidden;
  background: rgba(255,255,255,.02);
  backdrop-filter: blur(8px);
  position: relative;
  z-index: 1;
}
.ai-page-stat {
  padding: 1.75rem 1rem;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,.07);
}
.ai-page-stat:last-child { border-right: none; }
.ai-page-stat-num {
  font-size: 1.8rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  margin-bottom: .3rem;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ai-page-stat-label { font-size: .75rem; color: rgba(255,255,255,.45); font-weight: 500; }

/* ── Content layout ── */
.ai-page-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 4rem;
  align-items: start;
  padding: 2rem 0 5rem;
  position: relative;
  z-index: 1;
}

/* ── Section ── */
.ai-page-section { margin-bottom: 3.5rem; }
.ai-section-title {
  font-size: 1.1rem;
  font-weight: 800;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  color: #fff;
  letter-spacing: -.01em;
}
.ai-section-title::before {
  content: '';
  display: block;
  width: 4px; height: 1.15em;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  border-radius: 2px;
  flex-shrink: 0;
}

/* ── Feature cards ── */
.ai-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .85rem;
}
.ai-feature-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  padding: 1.4rem;
  transition: border-color .2s, background .2s;
}
.ai-feature-card:hover {
  border-color: rgba(124,58,237,.4);
  background: rgba(124,58,237,.06);
}
.ai-feature-card-icon { font-size: 1.4rem; margin-bottom: .65rem; }
.ai-feature-card h4 { font-size: .88rem; font-weight: 700; margin-bottom: .35rem; color: #fff; }
.ai-feature-card p { font-size: .8rem; color: rgba(255,255,255,.45); line-height: 1.65; }

/* ── Timeline ── */
.ai-page-timeline { display: flex; flex-direction: column; }
.ai-timeline-step {
  display: flex;
  gap: 1.25rem;
  padding-bottom: 2rem;
  position: relative;
}
.ai-timeline-step:last-child { padding-bottom: 0; }
.ai-timeline-step::before {
  content: '';
  position: absolute;
  left: 16px; top: 36px; bottom: 0;
  width: 2px;
  background: rgba(124,58,237,.2);
}
.ai-timeline-step:last-child::before { display: none; }
.ai-timeline-num {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  color: #fff;
  font-weight: 800;
  font-size: .78rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  position: relative; z-index: 1;
}
.ai-timeline-tag {
  font-size: .66rem;
  font-weight: 700;
  color: #06b6d4;
  font-family: 'Courier New', monospace;
  letter-spacing: .06em;
  margin-bottom: .3rem;
  display: block;
}
.ai-timeline-body h4 { font-size: .9rem; font-weight: 700; margin-bottom: .25rem; color: #fff; }
.ai-timeline-body p { font-size: .8rem; color: rgba(255,255,255,.45); line-height: 1.65; margin: 0; }

/* ── Use case grid (industry pages) ── */
.ai-sub-uc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .85rem;
}
.ai-sub-uc-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  padding: 1.4rem;
  transition: border-color .2s, background .2s;
}
.ai-sub-uc-card:hover {
  border-color: rgba(6,182,212,.35);
  background: rgba(6,182,212,.05);
}
.ai-sub-uc-icon { font-size: 1.5rem; margin-bottom: .65rem; }
.ai-sub-uc-label {
  font-size: .62rem;
  color: rgba(124,58,237,.8);
  font-family: 'Courier New', monospace;
  letter-spacing: .08em;
  margin-bottom: .4rem;
}
.ai-sub-uc-card h4 { font-size: .88rem; font-weight: 700; margin-bottom: .35rem; color: #fff; }
.ai-sub-uc-card p { font-size: .8rem; color: rgba(255,255,255,.45); line-height: 1.6; }
.ai-sub-uc-save {
  margin-top: .75rem;
  font-size: .75rem;
  font-weight: 600;
  color: #06b6d4;
}

/* ── Sidebar ── */
.ai-page-sidebar { position: sticky; top: 100px; }
.ai-sidebar-card {
  background: rgba(124,58,237,.07);
  border: 1px solid rgba(124,58,237,.22);
  border-radius: 1.25rem;
  overflow: hidden;
  margin-bottom: 1rem;
}
.ai-sidebar-head {
  background: linear-gradient(135deg, #7c3aed, #4f46e5);
  padding: 1.25rem 1.5rem;
}
.ai-sidebar-head .name { font-weight: 800; font-size: 1rem; color: #fff; }
.ai-sidebar-head .sub { font-size: .75rem; color: rgba(255,255,255,.6); margin-top: .2rem; font-family: 'Courier New', monospace; letter-spacing: .06em; }
.ai-sidebar-body { padding: 1.25rem 1.5rem; }
.ai-sidebar-body ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.ai-sidebar-body li { font-size: .8rem; display: flex; align-items: flex-start; gap: .5rem; color: rgba(255,255,255,.7); }
.ai-sidebar-body li::before { content: '→'; color: #06b6d4; font-weight: 700; flex-shrink: 0; }

.ai-cta-btn {
  display: block;
  width: 100%;
  padding: .95rem;
  text-align: center;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: .9rem;
  text-decoration: none;
  margin-bottom: .75rem;
  transition: opacity .2s;
}
.ai-cta-btn:hover { opacity: .88; }
.ai-cta-secondary {
  display: block;
  text-align: center;
  font-size: .8rem;
  color: rgba(255,255,255,.4);
  padding: .5rem;
  text-decoration: none;
  transition: color .2s;
}
.ai-cta-secondary:hover { color: #c4b5fd; }

/* Industry nav in sidebar */
.ai-industry-nav { display: flex; flex-direction: column; gap: .3rem; }
.ai-industry-nav a {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .85rem;
  border-radius: .75rem;
  font-size: .79rem;
  color: rgba(255,255,255,.45);
  text-decoration: none;
  transition: background .2s, color .2s;
}
.ai-industry-nav a:hover,
.ai-industry-nav a.active { background: rgba(124,58,237,.15); color: #c4b5fd; }

/* Service nav in sidebar */
.ai-service-nav { display: flex; flex-direction: column; gap: .3rem; }
.ai-service-nav a {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .85rem;
  border-radius: .75rem;
  font-size: .79rem;
  color: rgba(255,255,255,.45);
  text-decoration: none;
  transition: background .2s, color .2s;
}
.ai-service-nav a:hover,
.ai-service-nav a.active { background: rgba(124,58,237,.15); color: #c4b5fd; }

/* ── Bottom CTA section ── */
.ai-page-cta-section {
  text-align: center;
  padding: 5rem 2rem;
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255,255,255,.05);
}
.ai-page-cta-section::before {
  content: '';
  position: absolute;
  top: -1px; left: 50%;
  transform: translateX(-50%);
  width: 200px; height: 2px;
  background: linear-gradient(90deg, transparent, #7c3aed, transparent);
}
.ai-page-cta-section h2 {
  font-size: clamp(1.8rem, 4vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -.03em;
  margin-bottom: .85rem;
}
.ai-page-cta-section p {
  color: rgba(255,255,255,.45);
  margin-bottom: 2rem;
  line-height: 1.75;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}
.ai-page-cta-btns {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 900px) {
  .ai-page-layout { grid-template-columns: 1fr; gap: 2rem; }
  .ai-page-sidebar { position: static; }
  .ai-feature-grid { grid-template-columns: 1fr; }
  .ai-sub-uc-grid { grid-template-columns: 1fr; }
  .ai-page-stats { grid-template-columns: repeat(2, 1fr); }
  .ai-page-hero { padding: 6rem 1.5rem 3rem; }
}
@media (max-width: 480px) {
  .ai-page-stats { grid-template-columns: 1fr 1fr; }
  .ai-sub-wrap { padding: 0 1.25rem; }
}
