/* ============================================================
   CHANDRAHAS TECHNOLOGIES — Custom Motion & Style Layer
   v1.0  | Loads site-wide, scoped to .ct- classes only
   Brand: maroon #9B2335 / cyan #19C8D8 | Poppins + Inter
   Safe: all effects degrade gracefully; respects reduced-motion
   ============================================================ */

/* ---------- 0. Scroll-reveal base states ---------- */
/* Elements start hidden/offset; JS adds .ct-in to animate them in */
.ct-reveal{opacity:0;transform:translateY(40px);will-change:transform,opacity;
  transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);}
.ct-reveal.ct-in{opacity:1;transform:translateY(0);}
.ct-reveal.ct-left{transform:translateX(-50px);}
.ct-reveal.ct-left.ct-in{transform:translateX(0);}
.ct-reveal.ct-right{transform:translateX(50px);}
.ct-reveal.ct-right.ct-in{transform:translateX(0);}
.ct-reveal.ct-scale{transform:scale(.92);}
.ct-reveal.ct-scale.ct-in{transform:scale(1);}
/* stagger delays */
.ct-d1{transition-delay:.08s;} .ct-d2{transition-delay:.16s;}
.ct-d3{transition-delay:.24s;} .ct-d4{transition-delay:.32s;}
.ct-d5{transition-delay:.40s;} .ct-d6{transition-delay:.48s;}

/* ---------- 1. Hero: living gradient mesh + particle canvas ---------- */
.ct-hero{position:relative;overflow:hidden;}
.ct-hero .et_pb_row{position:relative;z-index:3;}
/* animated gradient mesh sitting under the content */
.ct-hero::before{content:"";position:absolute;inset:-20%;z-index:1;
  background:
    radial-gradient(40% 50% at 20% 30%, rgba(25,200,216,.28) 0%, transparent 60%),
    radial-gradient(45% 55% at 80% 70%, rgba(63,224,238,.18) 0%, transparent 60%),
    radial-gradient(50% 60% at 60% 20%, rgba(110,24,38,.5) 0%, transparent 70%);
  filter:blur(20px);animation:ct-mesh 18s ease-in-out infinite alternate;}
@keyframes ct-mesh{
  0%{transform:translate3d(0,0,0) scale(1);}
  50%{transform:translate3d(3%,-2%,0) scale(1.08);}
  100%{transform:translate3d(-3%,2%,0) scale(1.04);}
}
/* particle canvas injected by JS */
#ct-particles{position:absolute;inset:0;z-index:2;pointer-events:none;}
/* gradient text for hero accent line */
.ct-gradient-text{background:linear-gradient(100deg,#FFFFFF 0%,#3FE0EE 45%,#19C8D8 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  background-size:200% auto;animation:ct-shine 6s linear infinite;}
@keyframes ct-shine{to{background-position:200% center;}}

/* ---------- 2. Glassmorphism cards (pipeline / audience / sectors) ---------- */
.ct-card .et_pb_blurb_content,
.ct-card.et_pb_blurb{position:relative;overflow:hidden;
  background:rgba(255,255,255,.7)!important;backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(155,35,53,.08);border-radius:16px!important;
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s,border-color .45s;}
.ct-card.et_pb_blurb:hover{transform:translateY(-10px);
  box-shadow:0 20px 50px -12px rgba(25,200,216,.35)!important;
  border-color:rgba(25,200,216,.4);}
/* sweeping cyan light on hover */
.ct-card.et_pb_blurb::after{content:"";position:absolute;top:0;left:-60%;width:50%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(25,200,216,.12),transparent);
  transform:skewX(-20deg);transition:left .7s ease;pointer-events:none;}
.ct-card.et_pb_blurb:hover::after{left:120%;}
/* dark-section card variant */
.ct-card-dark.et_pb_blurb{background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(255,255,255,.08);}

/* ---------- 3. Custom SVG icon wrappers ---------- */
.ct-icon{width:64px;height:64px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
  border-radius:16px;background:linear-gradient(135deg,rgba(25,200,216,.12),rgba(155,35,53,.06));
  transition:transform .45s cubic-bezier(.16,1,.3,1);}
.ct-card:hover .ct-icon{transform:scale(1.12) rotate(-4deg);}
.ct-icon svg{width:34px;height:34px;}
.ct-icon svg path,.ct-icon svg circle,.ct-icon svg rect,.ct-icon svg line,.ct-icon svg polyline{
  stroke:#19C8D8;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:200;stroke-dashoffset:200;}
.ct-icon.ct-drawn svg path,.ct-icon.ct-drawn svg circle,.ct-icon.ct-drawn svg rect,
.ct-icon.ct-drawn svg line,.ct-icon.ct-drawn svg polyline{
  animation:ct-draw 1.2s cubic-bezier(.16,1,.3,1) forwards;}
@keyframes ct-draw{to{stroke-dashoffset:0;}}

/* ---------- 4. Magnetic / glowing buttons ---------- */
.ct-btn .et_pb_button,a.ct-btn{position:relative;overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease!important;}
.ct-btn .et_pb_button::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.35),transparent 50%);
  opacity:0;transition:opacity .3s;}
.ct-btn .et_pb_button:hover::before{opacity:1;}
.ct-btn .et_pb_button:hover{box-shadow:0 12px 30px -8px rgba(25,200,216,.6)!important;}

/* ---------- 5. Number counters — gradient numerals ---------- */
.ct-stat .percent,.ct-stat .percent-value,.ct-stat .percent span{
  background:linear-gradient(120deg,#19C8D8,#3FE0EE);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;}

/* ---------- 6. Section transitions / parallax targets ---------- */
.ct-parallax{will-change:transform;}

/* ---------- 7. Headings: subtle entrance underline accent ---------- */
.ct-head-accent{position:relative;display:inline-block;}
.ct-head-accent::after{content:"";position:absolute;left:0;bottom:-10px;height:4px;width:0;
  background:linear-gradient(90deg,#9B2335,#19C8D8);border-radius:2px;
  transition:width 1s cubic-bezier(.16,1,.3,1) .2s;}
.ct-head-accent.ct-in::after{width:72px;}

/* ---------- 8. Mobile + accessibility safeguards ---------- */
@media(max-width:980px){
  .ct-hero::before{animation-duration:24s;filter:blur(30px);}
  #ct-particles{opacity:.5;}
  .ct-card.et_pb_blurb:hover{transform:translateY(-5px);}
}
@media(max-width:767px){
  #ct-particles{display:none;} /* drop particle cost on phones */
  .ct-reveal{transform:translateY(24px);transition-duration:.6s;}
}
@media(prefers-reduced-motion:reduce){
  .ct-reveal,.ct-reveal.ct-in{opacity:1!important;transform:none!important;transition:none!important;}
  .ct-hero::before,.ct-gradient-text{animation:none!important;}
  #ct-particles{display:none!important;}
  .ct-icon svg *{stroke-dashoffset:0!important;animation:none!important;}
}
