*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

:root{
  --p:#7C3AED;--p2:#6D28D9;--p-light:#EDE9FE;--yellow:#FDE68A;
  --dark:#0D0D1A;--text:#1A1A2E;--muted:#64748B;--border:#E2E8F0;
  --white:#fff;--font:'Plus Jakarta Sans',sans-serif;
}

/* ── MOBILE OVERFLOW FIX ── */
html{
  scroll-behavior:smooth;
  overflow-x:hidden;
}

body{
  font-family:var(--font);
  color:var(--text);
  background:var(--white);
  overflow-x:hidden;
  width:100%;
  position:relative;
  touch-action:pan-y;
}

a{text-decoration:none;}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 32px;
  width:100%;
  box-sizing:border-box;
}

/* ── GRADIENT ANIMATION ── */
@keyframes gradientShift{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
.grad-text{background:linear-gradient(135deg,#7C3AED,#EC4899,#A78BFA,#7C3AED);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}

/* ── SCROLL ANIMATIONS ── */
.animate{opacity:0;transform:translateY(40px);transition:opacity 0.7s ease,transform 0.7s ease;}
.animate.visible{opacity:1;transform:translateY(0);}
.animate-left{opacity:0;transform:translateX(-60px);transition:opacity 0.7s ease,transform 0.7s ease;}
.animate-left.visible{opacity:1;transform:translateX(0);}
.animate-right{opacity:0;transform:translateX(60px);transition:opacity 0.7s ease,transform 0.7s ease;}
.animate-right.visible{opacity:1;transform:translateX(0);}
.delay-1{transition-delay:0.1s;}.delay-2{transition-delay:0.2s;}.delay-3{transition-delay:0.3s;}.delay-4{transition-delay:0.4s;}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);width:100%;touch-action:pan-y;}
.nav-inner{display:flex;align-items:center;gap:8px;padding:16px 32px;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box;}
.logo{font-weight:800;font-size:20px;color:var(--dark);margin-right:auto;}
.nav-links{display:flex;gap:4px;list-style:none;}
.nav-links a{padding:8px 16px;border-radius:8px;color:var(--muted);font-size:14px;font-weight:500;transition:.2s;}
.nav-links a:hover,.nav-links li.active a{color:var(--text);background:#F8F5FF;}
.btn-outline{padding:10px 20px;border-radius:10px;border:1.5px solid var(--border);color:var(--text);font-size:14px;font-weight:600;background:white;cursor:pointer;transition:.2s;}
.btn-outline:hover{border-color:var(--p);color:var(--p);}
.btn-demo{padding:10px 20px;border-radius:10px;background:var(--p);color:white;font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px;transition:.2s;border:none;cursor:pointer;}
.btn-demo:hover{background:var(--p2);transform:translateY(-1px);}
.btn-demo-arrow{width:24px;height:24px;border-radius:6px;background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;font-size:12px;}

/* ── HERO ── */
.hero{padding:60px 0 0;background:#0D0D1A;position:relative;overflow:hidden;width:100%;}
#heroCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;}
.hero .container{position:relative;z-index:2;}
.hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.hero-left{padding-bottom:60px;}
.hero-tag{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.15);padding:6px 14px;border-radius:100px;font-size:13px;font-weight:600;color:rgba(255,255,255,0.9);margin-bottom:24px;animation:fadeDown 0.8s ease both;}
.hero-tag-dot{width:6px;height:6px;border-radius:50%;background:#A78BFA;animation:blink 2s infinite;}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0.3;}}
.hero-title{font-size:clamp(36px,4.5vw,58px);font-weight:800;line-height:1.1;color:white;margin-bottom:24px;animation:fadeDown 0.8s ease 0.1s both;}
.hero-icons{display:inline-flex;gap:6px;background:rgba(255,255,255,0.15);padding:6px 10px;border-radius:12px;margin:0 8px;vertical-align:middle;}
.hero-sub{font-size:16px;color:rgba(255,255,255,0.65);margin-bottom:36px;line-height:1.7;max-width:480px;animation:fadeDown 0.8s ease 0.2s both;}
.hero-cta{margin-bottom:48px;animation:fadeDown 0.8s ease 0.3s both;}
.btn-hero{padding:14px 28px;border-radius:12px;background:var(--p);color:white;font-size:15px;font-weight:700;display:inline-flex;align-items:center;gap:8px;transition:.2s;box-shadow:0 8px 24px rgba(124,58,237,0.4);}
.btn-hero:hover{background:var(--p2);transform:translateY(-2px);}
.btn-hero-arrow{width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;}
.hero-team{display:flex;align-items:center;gap:12px;animation:fadeDown 0.8s ease 0.4s both;}
.team-avatars{display:flex;}
.av{width:36px;height:36px;border-radius:50%;border:2px solid rgba(255,255,255,0.2);overflow:hidden;margin-left:-8px;background:rgba(124,58,237,0.3);}
.av:first-child{margin-left:0;}
.av img{width:100%;height:100%;object-fit:cover;}
.av-plus{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,0.15);border:2px solid rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;color:white;font-size:14px;font-weight:700;margin-left:-8px;}
.team-text{font-size:13px;color:rgba(255,255,255,0.5);}
.team-text strong{color:rgba(255,255,255,0.85);display:block;}
@keyframes fadeDown{from{opacity:0;transform:translateY(-20px);}to{opacity:1;transform:translateY(0);}}

/* ── HERO RIGHT ── */
.hero-right{position:relative;height:580px;animation:fadeLeft 1s ease 0.3s both;}
@keyframes fadeLeft{from{opacity:0;transform:translateX(60px);}to{opacity:1;transform:translateX(0);}}
.hero-photos{position:absolute;bottom:0;right:40px;width:340px;height:480px;z-index:2;}
.hero-photo{position:absolute;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:24px 24px 0 0;opacity:0;transition:opacity 1s ease;}
.hero-photo.active{opacity:1;}
.float-card{position:absolute;border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,0.3);padding:16px 20px;z-index:3;}
.card-services{top:20px;left:0;width:260px;background:white;animation:floatUp 1s ease 0.6s both,cf1 4s ease-in-out 2s infinite;}
.card-services-title{font-size:12px;font-weight:700;color:var(--text);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;}
.card-services-title span{background:var(--p-light);color:var(--p);font-size:10px;padding:3px 8px;border-radius:100px;}
.stags{display:flex;flex-wrap:wrap;gap:6px;}
.stag{padding:5px 10px;border-radius:100px;border:1.5px solid var(--border);font-size:11px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:4px;transition:.2s;}
.stag:hover{border-color:var(--p);color:var(--p);}
.stag-dot{width:5px;height:5px;border-radius:50%;background:var(--p);}
.card-revenue{bottom:120px;left:20px;background:var(--dark);color:white;width:200px;animation:floatUp 1s ease 0.8s both,cf2 4s ease-in-out 2.4s infinite;}
.rev-label{font-size:11px;color:rgba(255,255,255,0.5);margin-bottom:4px;}
.rev-num{font-size:28px;font-weight:800;margin-bottom:8px;background:linear-gradient(135deg,#A78BFA,#EC4899,#7C3AED);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.rev-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(124,58,237,0.3);color:#A78BFA;font-size:10px;font-weight:700;padding:3px 8px;border-radius:100px;}
.rev-bars{display:flex;align-items:flex-end;gap:4px;margin-top:12px;height:40px;}
.rev-bar{flex:1;border-radius:3px 3px 0 0;background:rgba(255,255,255,0.15);}
.rev-bar.hi{background:var(--p);}
.card-stat{top:20px;right:0;background:#FDE68A;width:140px;text-align:center;padding:20px 16px;animation:floatUp 1s ease 1s both,cf3 4s ease-in-out 2.2s infinite;}
.stat-big{font-size:36px;font-weight:800;color:var(--dark);}
.stat-small{font-size:11px;color:rgba(0,0,0,0.5);font-weight:600;margin-top:4px;}
.card-rating{bottom:40px;right:0;width:180px;background:white;animation:floatUp 1s ease 1.2s both,cf4 4s ease-in-out 2.6s infinite;}
.r-title{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:8px;}
.stars{color:#F59E0B;font-size:16px;margin-bottom:4px;}
.r-count{font-size:12px;color:var(--muted);}
.r-count strong{color:var(--text);}
@keyframes floatUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
@keyframes cf1{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@keyframes cf2{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@keyframes cf3{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@keyframes cf4{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}

/* ── TRUST MARQUEE ── */
.trust{background:#111;padding:20px 0;overflow:hidden;width:100%;}
.trust-track{overflow:hidden;width:100%;position:relative;}
.trust-inner{display:flex;width:max-content;will-change:transform;animation:marquee-scroll 20s linear infinite;}
.trust-item{color:rgba(255,255,255,0.5);font-size:14px;font-weight:600;white-space:nowrap;flex-shrink:0;padding-right:48px;}
@keyframes marquee-scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ── ABOUT ── */
.about{padding:100px 0;}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.sec-tag{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#EDE9FE,#FCE7F3);background-size:200% 200%;animation:gradientShift 3s ease infinite;color:var(--p);padding:6px 14px;border-radius:100px;font-size:12px;font-weight:700;margin-bottom:20px;}
.about-title{font-size:40px;font-weight:800;line-height:1.15;color:var(--dark);margin-bottom:20px;}
.about-desc{font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:32px;}
.about-points{display:flex;flex-direction:column;gap:16px;margin-bottom:36px;}
.about-point{display:flex;gap:12px;align-items:flex-start;transition:.2s;}
.about-point:hover{transform:translateX(8px);}
.pt-icon{width:32px;height:32px;border-radius:8px;background:var(--p-light);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.pt-text strong{display:block;font-size:14px;color:var(--dark);margin-bottom:2px;}
.pt-text span{font-size:13px;color:var(--muted);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.ac{background:#F8F5FF;border-radius:20px;padding:28px;transition:.3s;}
.ac:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(124,58,237,0.15);}
.ac.dk{background:var(--dark);}
.ac .aci{font-size:28px;margin-bottom:12px;}
.ac .acn{font-size:32px;font-weight:800;margin-bottom:4px;background:linear-gradient(135deg,#7C3AED,#EC4899,#A78BFA,#7C3AED);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.ac h4{font-size:16px;font-weight:700;margin-bottom:8px;color:var(--dark);}
.ac.dk h4{color:white;}
.ac p{font-size:13px;color:var(--muted);line-height:1.6;}
.ac.dk p{color:rgba(255,255,255,0.5);}

/* ── SERVICES ── */
.services{padding:100px 0;background:#FAFAFA;}
.sec-header{text-align:center;margin-bottom:64px;}
.sec-title{font-size:40px;font-weight:800;color:var(--dark);margin-bottom:16px;line-height:1.15;}
.sec-desc{font-size:16px;color:var(--muted);max-width:520px;margin:0 auto;}
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.svc{background:white;border-radius:20px;padding:32px;border:1px solid var(--border);transition:.3s;position:relative;overflow:hidden;}
.svc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#7C3AED,#EC4899,#A78BFA);opacity:0;transition:.3s;}
.svc:hover{transform:translateY(-8px);box-shadow:0 24px 56px rgba(0,0,0,0.1);border-color:transparent;}
.svc:hover::before{opacity:1;}
.svc.feat{background:var(--p);border-color:var(--p);}
.svc.feat h3,.svc.feat p,.svc.feat .svc-link{color:white;}
.svc-badge{position:absolute;top:16px;right:16px;background:#FDE68A;color:#92400E;font-size:10px;font-weight:800;padding:4px 10px;border-radius:100px;}
.svc-ctag{display:inline-block;background:var(--p-light);color:var(--p);font-size:11px;font-weight:700;padding:4px 10px;border-radius:100px;margin-bottom:12px;}
.svc.feat .svc-ctag{background:rgba(255,255,255,0.2);color:white;}
.svc-icon{width:52px;height:52px;border-radius:14px;background:var(--p-light);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;transition:.3s;}
.svc:hover .svc-icon{transform:scale(1.1) rotate(-5deg);}
.svc.feat .svc-icon{background:rgba(255,255,255,0.2);}
.svc h3{font-size:20px;font-weight:700;margin-bottom:12px;color:var(--dark);}
.svc p{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:20px;}
.svc-metrics{display:flex;gap:16px;margin-bottom:20px;padding:16px;background:#F8F5FF;border-radius:12px;}
.svc.feat .svc-metrics{background:rgba(255,255,255,0.1);}
.svc-met{flex:1;text-align:center;}
.svc-met span{display:block;font-size:20px;font-weight:800;margin-bottom:2px;background:linear-gradient(135deg,#7C3AED,#EC4899,#A78BFA,#7C3AED);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.svc.feat .svc-met span{background:none;-webkit-text-fill-color:white;color:white;}
.svc-met small{font-size:11px;color:var(--muted);}
.svc.feat .svc-met small{color:rgba(255,255,255,0.6);}
.svc-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--p);}
.svc-arr{width:24px;height:24px;border-radius:6px;background:var(--p-light);display:flex;align-items:center;justify-content:center;font-size:11px;transition:.2s;}
.svc:hover .svc-arr{background:var(--p);color:white;transform:translateX(4px);}
.svc.feat .svc-arr{background:rgba(255,255,255,0.2);color:white;}
.see-all{text-align:center;margin-top:40px;}
.btn-all{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;border-radius:12px;border:1.5px solid var(--border);font-size:14px;font-weight:700;color:var(--text);background:white;transition:.3s;}
.btn-all:hover{border-color:var(--p);color:var(--p);transform:translateY(-2px);}

/* ── PRICING ── */
.pricing{padding:100px 0;}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px;}
.price-card{border-radius:20px;padding:36px;border:1px solid var(--border);transition:.3s;}
.price-card:hover{transform:translateY(-6px);box-shadow:0 20px 56px rgba(0,0,0,0.1);}
.price-card.pop{background:var(--p);border-color:var(--p);position:relative;transform:translateY(-8px);}
.price-card.pop:hover{transform:translateY(-14px);}
.pop-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#FDE68A;color:#92400E;font-size:11px;font-weight:800;padding:4px 16px;border-radius:100px;white-space:nowrap;}
.p-name{font-size:14px;font-weight:700;color:var(--muted);margin-bottom:8px;}
.price-card.pop .p-name{color:rgba(255,255,255,0.7);}
.p-amt{font-size:42px;font-weight:800;margin-bottom:4px;background:linear-gradient(135deg,#7C3AED,#EC4899,#A78BFA,#7C3AED);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.price-card.pop .p-amt{background:none;-webkit-text-fill-color:white;color:white;}
.p-amt span{font-size:16px;font-weight:500;}
.p-desc{font-size:13px;color:var(--muted);margin-bottom:24px;}
.price-card.pop .p-desc{color:rgba(255,255,255,0.7);}
.p-div{height:1px;background:var(--border);margin-bottom:24px;}
.price-card.pop .p-div{background:rgba(255,255,255,0.2);}
.p-feats{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:32px;}
.p-feats li{display:flex;gap:10px;font-size:14px;color:var(--text);}
.price-card.pop .p-feats li{color:rgba(255,255,255,0.9);}
.p-feats li::before{content:'✓';font-weight:800;flex-shrink:0;background:linear-gradient(135deg,#7C3AED,#EC4899);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.price-card.pop .p-feats li::before{background:none;-webkit-text-fill-color:#A7F3D0;color:#A7F3D0;}
.btn-price{width:100%;padding:14px;border-radius:12px;font-size:14px;font-weight:700;border:1.5px solid var(--border);background:white;color:var(--text);cursor:pointer;transition:.2s;font-family:var(--font);}
.btn-price:hover{border-color:var(--p);color:var(--p);}
.price-card.pop .btn-price{background:white;color:var(--p);border-color:white;}

/* ── STATS ── */
.stats{padding:100px 0;background:var(--dark);}
.stats-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.stats-left .sec-tag{background:rgba(124,58,237,0.2);color:#A78BFA;animation:none;}
.stats-left .sec-title{color:white;font-size:40px;font-weight:800;margin-bottom:16px;}
.stats-left .sec-desc{color:rgba(255,255,255,0.5);margin-bottom:36px;}
.stats-nums{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
.s-item{padding:28px;border-radius:16px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);transition:.3s;}
.s-item:hover{background:rgba(124,58,237,0.15);border-color:rgba(124,58,237,0.3);transform:translateY(-4px);}
.s-num{font-size:40px;font-weight:800;margin-bottom:6px;background:linear-gradient(135deg,#A78BFA,#EC4899,#7C3AED,#A78BFA);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.s-label{font-size:13px;color:rgba(255,255,255,0.5);}

/* ── TESTIMONIALS ── */
.testi{padding:100px 0;}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.tcard{padding:32px;border-radius:20px;border:1px solid var(--border);transition:.3s;}
.tcard:hover{transform:translateY(-6px);box-shadow:0 20px 56px rgba(0,0,0,0.08);}
.tcard.feat{background:var(--p);border-color:var(--p);}
.t-stars{font-size:16px;margin-bottom:16px;background:linear-gradient(135deg,#F59E0B,#EC4899);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite;}
.tcard.feat .t-stars{background:none;-webkit-text-fill-color:#FDE68A;color:#FDE68A;}
.t-text{font-size:15px;color:var(--muted);line-height:1.7;margin-bottom:24px;}
.tcard.feat .t-text{color:rgba(255,255,255,0.85);}
.t-author{display:flex;gap:12px;align-items:center;}
.t-av{width:44px;height:44px;border-radius:50%;background:var(--p-light);color:var(--p);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.tcard.feat .t-av{background:rgba(255,255,255,0.2);color:white;}
.t-name{font-size:14px;font-weight:700;color:var(--dark);}
.tcard.feat .t-name{color:white;}
.t-role{font-size:12px;color:var(--muted);}
.tcard.feat .t-role{color:rgba(255,255,255,0.6);}

/* ── CTA ── */
.cta{padding:80px 0;}
.cta-box{background:linear-gradient(135deg,var(--p),#4C1D95);border-radius:28px;padding:80px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;position:relative;overflow:hidden;}
.cta-box::before{content:'';position:absolute;top:-50%;right:-5%;width:400px;height:400px;border-radius:50%;background:rgba(255,255,255,0.05);}
.cta-title{font-size:40px;font-weight:800;color:white;margin-bottom:12px;}
.cta-desc{font-size:16px;color:rgba(255,255,255,0.7);}
.btn-cta{padding:16px 36px;border-radius:14px;background:white;color:var(--p);font-size:15px;font-weight:800;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;transition:.2s;position:relative;z-index:1;}
.btn-cta:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(0,0,0,0.2);}

/* ── FOOTER ── */
footer{background:var(--dark);padding:72px 0 32px;}
.ft{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px;}
.ft-logo{font-weight:800;font-size:20px;display:block;margin-bottom:16px;}
.ft-desc{font-size:14px;color:rgba(255,255,255,0.4);line-height:1.7;}
.ft-col strong{display:block;color:white;font-size:13px;font-weight:700;margin-bottom:16px;text-transform:uppercase;letter-spacing:0.5px;}
.ft-col a{display:block;color:rgba(255,255,255,0.4);font-size:14px;margin-bottom:10px;transition:.2s;}
.ft-col a:hover{color:white;transform:translateX(4px);}
.ft-bot{border-top:1px solid rgba(255,255,255,0.08);padding-top:24px;display:flex;justify-content:space-between;}
.ft-copy{font-size:13px;color:rgba(255,255,255,0.3);}

/* ── CHATBOT — GPU composited to prevent Android repaint bleed ── */
.chat-btn{
  position:fixed;bottom:28px;right:28px;
  width:56px;height:56px;border-radius:50%;
  background:var(--p);color:white;font-size:22px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 8px 24px rgba(124,58,237,0.4);
  z-index:999;transition:.2s;border:none;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  will-change:transform;
}
.chat-btn:hover{transform:scale(1.1) translateZ(0);}

.chat-win{
  position:fixed;bottom:96px;right:28px;
  width:360px;background:white;border-radius:20px;
  box-shadow:0 24px 64px rgba(0,0,0,0.15);
  z-index:998;display:none;flex-direction:column;
  overflow:hidden;border:1px solid var(--border);
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  will-change:transform;
  max-width:calc(100vw - 40px);
}
.chat-win.open{display:flex;}
.chat-head{background:var(--p);color:white;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;font-weight:700;}
.chat-head button{background:none;border:none;color:white;font-size:18px;cursor:pointer;}
.chat-body{padding:16px;min-height:240px;max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;}
.msg{padding:10px 14px;border-radius:12px;font-size:13px;max-width:85%;line-height:1.5;}
.msg.bot{background:#F1EDFF;color:var(--text);align-self:flex-start;border-bottom-left-radius:4px;}
.msg.user{background:var(--p);color:white;align-self:flex-end;border-bottom-right-radius:4px;}
.chat-foot{display:flex;border-top:1px solid var(--border);}
.chat-foot input{flex:1;border:none;padding:14px 16px;font-size:13px;outline:none;font-family:var(--font);}
.chat-foot button{background:var(--p);color:white;border:none;padding:14px 18px;font-size:16px;cursor:pointer;}


/* ── PAGE TRANSITIONS ── */
.page-transition{position:fixed;inset:0;background:var(--white);z-index:9999;opacity:1;pointer-events:none;transition:opacity 0.3s ease;}
body.page-loaded .page-transition{opacity:0;}
body.page-loaded .page-transition.active{opacity:1;pointer-events:auto;}

/* ── MOBILE MENU ── */
.mobile-toggle{display:none;background:none;border:none;font-size:32px;color:var(--dark);cursor:pointer;padding-left:12px;line-height:1;transition:.2s;}
.mobile-toggle:active{transform:scale(0.9);}
.mobile-menu{position:fixed;inset:0;background:rgba(0,0,0,0.3);z-index:1000;opacity:0;pointer-events:none;transition:opacity .4s ease;display:flex;justify-content:flex-end;}
.mobile-menu.active{opacity:1;pointer-events:auto;}
.mobile-menu-inner{background:rgba(13,13,26,0.65);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-left:1px solid rgba(255,255,255,0.15);width:85%;max-width:380px;height:100%;padding:32px 28px;display:flex;flex-direction:column;gap:4px;transform:translateX(100%);transition:transform .5s cubic-bezier(0.16,1,0.3,1);box-shadow:-20px 0 60px rgba(0,0,0,0.5);}
.mobile-menu.active .mobile-menu-inner{transform:translateX(0);}
.mobile-close{align-self:flex-end;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);width:44px;height:44px;border-radius:50%;font-size:20px;color:white;cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center;margin-bottom:24px;}
.mobile-close:hover{background:var(--p);transform:rotate(90deg);border-color:var(--p);}
.mobile-menu a.menu-link{font-size:22px;font-weight:600;color:rgba(255,255,255,0.6);text-decoration:none;transition:.3s;padding:12px 16px;border-radius:12px;display:block;}
.mobile-menu a.menu-link:hover{color:white;background:rgba(255,255,255,0.05);transform:translateX(8px);}
.mobile-book{margin-top:auto;padding:16px;text-align:center;background:var(--p);color:white !important;border-radius:14px;font-size:16px !important;font-weight:700 !important;text-decoration:none;transition:.2s;box-shadow:0 8px 24px rgba(124,58,237,0.3);display:block;}
.mobile-book:active{transform:translateY(2px);}
.mobile-login{margin-top:12px;padding:16px;text-align:center;background:rgba(124,58,237,0.1);color:#A78BFA !important;border:1px solid rgba(124,58,237,0.3);border-radius:14px;font-size:16px !important;font-weight:700 !important;text-decoration:none;transition:.2s;display:block;}
.mobile-login:active{background:rgba(124,58,237,0.2);}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .container{padding:0 20px;}

  .nav-links,.btn-outline,.btn-demo{display:none;}
  .mobile-toggle{display:block;}
  .mobile-menu { max-width: 100vw !important; }
.mobile-menu-inner { max-width: 100vw !important; }

  /* Convert side animations to vertical — prevents x-axis stretch */
  .animate-left{transform:translateY(40px);}
  .animate-left.visible{transform:translateY(0);}
  .animate-right{transform:translateY(40px);}
  .animate-right.visible{transform:translateY(0);}

  /* Hero */
  .hero-inner{grid-template-columns:1fr;}
  .hero-right{display:none;}
  .hero-left{padding-bottom:40px;}

  /* All multi-column grids → single column */
  .about-inner,.stats-inner{grid-template-columns:1fr;gap:40px;}
  .svc-grid,.testi-grid,.price-grid,.ft{grid-template-columns:1fr;}
  .about-grid{grid-template-columns:1fr 1fr;}
  .stats-nums{grid-template-columns:1fr 1fr;}

  /* CTA */
  .cta-box{grid-template-columns:1fr;text-align:center;padding:48px 28px;}
  .price-card.pop{transform:none;}

  /* Section titles smaller */
  .sec-title,.about-title,.stats-left .sec-title,.cta-title{font-size:28px;}

  /* Chat window safe on mobile */
  .chat-win{width:calc(100vw - 40px);right:20px;}
  .chat-btn{bottom:20px;right:20px;}
}
