/* ==========================================================
   AI-CRIMS LIVING PALETTE — Blue / Violet / Cyan / Magenta
   Decorative only. Keeps the existing layout and functionality.
========================================================== */

:root{
  --life-blue:#4f8cff;
  --life-cyan:#35d7ff;
  --life-violet:#8b6cff;
  --life-purple:#a56bff;
  --life-magenta:#e56cff;
  --life-pink:#ff78b8;
  --life-indigo:#5366ff;
}

/* Shared ambient color field */
body::after{
  content:"";
  position:fixed;
  inset:-18%;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(520px 420px at 12% 18%, rgba(79,140,255,.12), transparent 72%),
    radial-gradient(500px 420px at 82% 18%, rgba(139,108,255,.12), transparent 70%),
    radial-gradient(560px 460px at 72% 78%, rgba(229,108,255,.075), transparent 72%),
    radial-gradient(460px 420px at 18% 82%, rgba(53,215,255,.06), transparent 72%);
  animation: aiColorDrift 18s ease-in-out infinite alternate;
}

@keyframes aiColorDrift{
  0%{transform:translate3d(-1%,0,0) scale(1)}
  50%{transform:translate3d(1.5%,-1%,0) scale(1.025)}
  100%{transform:translate3d(-.5%,1.5%,0) scale(1.04)}
}

/* Landing: richer but still restrained */
.hero::before{
  background:
    radial-gradient(520px 460px at 78% 36%, rgba(79,140,255,.18), transparent 72%),
    radial-gradient(460px 420px at 92% 66%, rgba(229,108,255,.11), transparent 74%),
    linear-gradient(90deg,rgba(4,8,25,.60),rgba(4,8,25,.20) 38%,transparent 68%) !important;
}

.hero .hero-badge,
.section-tag{
  box-shadow:0 0 28px rgba(83,102,255,.08), 0 0 24px rgba(229,108,255,.04);
}

.hero-content h1 span{
  background:linear-gradient(100deg,var(--life-blue) 0%,var(--life-cyan) 30%,var(--life-violet) 62%,var(--life-magenta) 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  background-size:220% 100%;
  animation:lifeGradient 8s ease-in-out infinite alternate;
}

@keyframes lifeGradient{
  from{background-position:0% 50%}
  to{background-position:100% 50%}
}

.feature-card,
.stat-card,
.benefit-card,
.technology-item,
.history-card,
.history-milestone,
.workflow-step,
.testimonial-card,
.faq-item{
  position:relative;
  overflow:hidden;
}

.feature-card::after,
.stat-card::after,
.benefit-card::after,
.technology-item::after,
.history-card::after,
.workflow-step::after,
.testimonial-card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-95px;
  top:-110px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(229,108,255,.16),rgba(139,108,255,.07) 35%,transparent 72%);
  filter:blur(4px);
  pointer-events:none;
  opacity:.7;
  animation:cardGlow 7s ease-in-out infinite alternate;
}

.feature-card:nth-child(3n+2)::after,
.stat-card:nth-child(3n+2)::after,
.benefit-card:nth-child(3n+2)::after{
  background:radial-gradient(circle,rgba(53,215,255,.16),rgba(79,140,255,.07) 35%,transparent 72%);
}

.feature-card:nth-child(3n)::after,
.stat-card:nth-child(3n)::after,
.benefit-card:nth-child(3n)::after{
  background:radial-gradient(circle,rgba(165,107,255,.18),rgba(229,108,255,.06) 35%,transparent 72%);
}

@keyframes cardGlow{
  from{transform:translate3d(0,0,0) scale(.88);opacity:.42}
  to{transform:translate3d(-25px,18px,0) scale(1.12);opacity:.85}
}

/* Public repository: same palette as the landing page */
.repository-search{
  position:relative;
}

.repository-search::before{
  content:"";
  position:absolute;
  width:520px;
  height:420px;
  left:-240px;
  top:80px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(79,140,255,.12),rgba(83,102,255,.05) 35%,transparent 70%);
  filter:blur(18px);
  pointer-events:none;
  animation:repoFloat 10s ease-in-out infinite alternate;
}

.repository-search::after{
  content:"";
  position:absolute;
  width:460px;
  height:390px;
  right:-230px;
  bottom:-100px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(229,108,255,.13),rgba(165,107,255,.06) 38%,transparent 72%);
  filter:blur(20px);
  pointer-events:none;
  animation:repoFloat 12s ease-in-out infinite alternate-reverse;
}

@keyframes repoFloat{
  from{transform:translate3d(0,0,0) scale(.92)}
  to{transform:translate3d(34px,-22px,0) scale(1.08)}
}

.repository-search .search-card{
  background:
    radial-gradient(420px 220px at 88% 0%,rgba(229,108,255,.13),transparent 68%),
    radial-gradient(420px 260px at 5% 100%,rgba(53,215,255,.09),transparent 70%),
    linear-gradient(145deg,rgba(20,32,76,.80),rgba(9,14,38,.86)) !important;
  border-color:rgba(139,108,255,.26) !important;
}

.repository-search .search-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 18%,rgba(53,215,255,.07) 42%,rgba(229,108,255,.10) 52%,transparent 78%);
  background-size:220% 100%;
  animation:searchShimmer 8s ease-in-out infinite;
}

@keyframes searchShimmer{
  0%,55%{background-position:120% 0}
  80%,100%{background-position:-20% 0}
}

.repository-search + .features .feature-card{
  background:
    radial-gradient(230px 160px at 88% 8%,rgba(229,108,255,.12),transparent 70%),
    radial-gradient(220px 160px at 0% 100%,rgba(53,215,255,.07),transparent 72%),
    linear-gradient(145deg,rgba(17,28,68,.78),rgba(8,14,38,.88)) !important;
  border-color:rgba(139,108,255,.22) !important;
}

.repository-search + .features .feature-card:hover{
  border-color:rgba(229,108,255,.40) !important;
  box-shadow:0 25px 60px rgba(0,0,0,.30),0 0 36px rgba(139,108,255,.13),0 0 24px rgba(53,215,255,.07) !important;
}

.repository-search + .features .feature-card::before{
  background:linear-gradient(110deg,transparent 15%,rgba(53,215,255,.10) 42%,rgba(165,107,255,.18) 52%,rgba(229,108,255,.10) 60%,transparent 78%) !important;
}

/* Login: polished mixed-color ambient scene */
.scene{
  background:
    radial-gradient(65% 55% at 14% 12%,rgba(79,140,255,.22) 0%,transparent 62%),
    radial-gradient(52% 48% at 84% 20%,rgba(139,108,255,.18) 0%,transparent 62%),
    radial-gradient(48% 42% at 78% 82%,rgba(229,108,255,.12) 0%,transparent 66%),
    radial-gradient(48% 40% at 18% 78%,rgba(53,215,255,.08) 0%,transparent 68%),
    radial-gradient(120% 90% at 50% 100%,#0A1124 0%,var(--deep) 45%,var(--void) 100%) !important;
}

.scene::after{
  opacity:.12 !important;
  background-image:
    linear-gradient(120deg,transparent 0 47%,rgba(229,108,255,.11) 48%,transparent 49%),
    linear-gradient(35deg,transparent 0 48%,rgba(53,215,255,.08) 49%,transparent 50%) !important;
  background-size:280px 280px,340px 340px !important;
  animation:sceneLines 18s linear infinite;
}

@keyframes sceneLines{
  to{background-position:280px 40px,-340px 60px}
}

.card{
  background:
    radial-gradient(340px 180px at 100% 0%,rgba(139,108,255,.10),transparent 70%),
    radial-gradient(300px 180px at 0% 100%,rgba(53,215,255,.06),transparent 72%),
    linear-gradient(145deg,rgba(18,26,61,.96),rgba(11,17,45,.96)) !important;
  border-color:rgba(139,108,255,.22) !important;
  box-shadow:0 32px 90px rgba(0,0,0,.30),0 0 55px rgba(83,102,255,.08),inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.auth-tab.active{
  background:linear-gradient(135deg,rgba(79,140,255,.24),rgba(139,108,255,.22),rgba(229,108,255,.12)) !important;
  box-shadow:inset 0 0 20px rgba(139,108,255,.08);
}

.card input:focus,
.card select:focus,
.card textarea:focus{
  border-color:rgba(139,108,255,.62) !important;
  box-shadow:0 0 0 3px rgba(139,108,255,.10),0 0 24px rgba(53,215,255,.06) !important;
}

.submit-btn,
.card button[type="submit"],
.card .btn-primary{
  background:linear-gradient(105deg,#4f8cff 0%,#6576f4 38%,#8b6cff 68%,#c06de8 100%) !important;
  background-size:220% 100%;
  animation:buttonLife 8s ease-in-out infinite alternate;
}

@keyframes buttonLife{
  from{background-position:0% 50%}
  to{background-position:100% 50%}
}

/* Keep reduced-motion users comfortable. */
@media (prefers-reduced-motion:reduce){
  body::after,.hero-content h1 span,.repository-search::before,.repository-search::after,
  .repository-search .search-card::before,.scene::after,.submit-btn,.card button[type="submit"],.card .btn-primary,
  .feature-card::after,.stat-card::after,.benefit-card::after,.technology-item::after,.history-card::after,
  .workflow-step::after,.testimonial-card::after{animation:none !important;}
}

/* Extra micro-motion for the login panel */
.promo-panel::after{
  content:"";
  position:absolute;
  width:260px;height:260px;
  left:-120px;bottom:-120px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(53,215,255,.10),rgba(79,140,255,.04) 40%,transparent 72%);
  filter:blur(8px);
  pointer-events:none;
  animation:promoAura 9s ease-in-out infinite alternate;
}
@keyframes promoAura{
  from{transform:translate3d(0,0,0) scale(.9);opacity:.35}
  to{transform:translate3d(45px,-25px,0) scale(1.12);opacity:.8}
}

.card::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(120deg,transparent 0 24%,rgba(53,215,255,.08) 38%,rgba(229,108,255,.10) 48%,transparent 64%);
  background-size:240% 100%;
  opacity:.5;
  animation:cardSheen 9s ease-in-out infinite;
}
@keyframes cardSheen{
  0%,52%{background-position:120% 0}
  78%,100%{background-position:-20% 0}
}

.repository-search .section-heading h2{
  background:linear-gradient(100deg,#eef4ff 0%,#b9d5ff 32%,#c8b8ff 65%,#f0b9e7 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

@media (prefers-reduced-motion:reduce){
  .promo-panel::after,.card::after{animation:none !important;}
}