:root{
  --primary:#26D980;
  --primary-deep:#0bbf6a;
  --accent:#ff7f50;
  --accent-pink:#ff5e9c;
  --bg:#FAFCF9;
  --ink:#0E1A14;
}
html{scroll-behavior:smooth}
body{
  font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.font-display{font-family:'Sora',system-ui,sans-serif;letter-spacing:-0.02em}

/* gradient text */
.gradient-text{
  background:linear-gradient(135deg,#26D980 0%,#0bbf6a 45%,#ff7f50 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.gradient-text-warm{
  background:linear-gradient(135deg,#ff7f50,#ff5e9c);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* glass */
.glass{
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.55);
}
.glass-dark{
  background:rgba(14,26,20,.55);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.08);
}

/* glow buttons */
.btn-glow{
  background:linear-gradient(135deg,#26D980,#0bbf6a);
  color:#06281A;
  box-shadow:0 10px 30px -8px rgba(38,217,128,.65),inset 0 1px 0 rgba(255,255,255,.4);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;
}
.btn-glow:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 18px 50px -10px rgba(38,217,128,.85),0 0 0 4px rgba(38,217,128,.18)}
.btn-ghost{
  background:rgba(255,255,255,.7);
  border:1px solid rgba(14,26,20,.08);
  transition:all .3s;
}
.btn-ghost:hover{transform:translateY(-3px);background:#fff;box-shadow:0 12px 30px -10px rgba(14,26,20,.18)}

/* blobs */
.blob{
  position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;z-index:0;
  animation:blobFloat 18s ease-in-out infinite;
}
@keyframes blobFloat{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(40px,-30px) scale(1.1)}
  66%{transform:translate(-30px,40px) scale(.95)}
}
.blob-green{background:radial-gradient(circle,#26D980,#26D98000)}
.blob-orange{background:radial-gradient(circle,#ff7f50,#ff7f5000)}
.blob-pink{background:radial-gradient(circle,#ff5e9c,#ff5e9c00)}

/* float-3d cards */
.float-3d{
  animation:float3d 7s ease-in-out infinite;
  transform-style:preserve-3d;
  will-change:transform;
}
.float-3d.delay-1{animation-delay:-2s}
.float-3d.delay-2{animation-delay:-4s}
@keyframes float3d{
  0%,100%{transform:translateY(0) rotate(-2deg)}
  50%{transform:translateY(-18px) rotate(2deg)}
}

/* shimmer */
.shimmer{
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.6) 50%,transparent 70%);
  background-size:200% 100%;
  animation:shimmer 3s linear infinite;
}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* card hover lift */
.lift{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.lift:hover{transform:translateY(-8px);box-shadow:0 30px 60px -25px rgba(14,26,20,.25)}

/* glow ring */
.glow-ring{position:relative}
.glow-ring::before{
  content:"";position:absolute;inset:-2px;border-radius:inherit;
  background:linear-gradient(135deg,#26D980,#ff7f50,#ff5e9c,#26D980);
  background-size:300% 300%;
  filter:blur(10px);opacity:0;transition:opacity .4s;z-index:-1;
  animation:gradShift 6s linear infinite;
}
.glow-ring:hover::before{opacity:.7}
@keyframes gradShift{0%{background-position:0 0}100%{background-position:300% 0}}

/* animated gradient bar */
.anim-grad{
  background:linear-gradient(120deg,#26D980,#0bbf6a,#ff7f50,#ff5e9c,#26D980);
  background-size:300% 100%;
  animation:gradShift 8s linear infinite;
}

/* counters */
.counter{font-variant-numeric:tabular-nums}

/* dotted bg */
.dotted{
  background-image:radial-gradient(rgba(14,26,20,.08) 1px,transparent 1px);
  background-size:22px 22px;
}

/* tilt cards */
.tilt{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tilt:hover{transform:perspective(800px) rotateX(6deg) rotateY(-6deg) scale(1.04)}

/* connecting line */
.dash-path{stroke-dasharray:8 10;animation:dash 30s linear infinite}
@keyframes dash{to{stroke-dashoffset:-1000}}

/* nav scroll */
.nav-scrolled{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);box-shadow:0 8px 30px -20px rgba(14,26,20,.25)}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* hero particles canvas */
#tsparticles{position:absolute;inset:0;z-index:0}

/* scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:linear-gradient(#26D980,#ff7f50);border-radius:10px}
::-webkit-scrollbar-track{background:#eef3ef}