:root {
--primary: #6366f1;
--primary-dark: #4f46e5;
--secondary: #f59e0b;
--dark: #0f172a;
--light: #f8fafc;
--gray: #94a3b8;
--card-bg: rgba(255, 255, 255, 0.05);
--transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.1);
    }
    .dark {
--primary: #818cf8;
--primary-dark: #6366f1;
--secondary: #fbbf24;
--dark: #020617;
--light: #f1f5f9;
--gray: #64748b;
--card-bg: rgba(15, 23, 42, 0.7);}#testimonials{display: none;}
* {margin:0;padding:0;box-sizing:border-box;}
body {font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;width: 100%;
 background-color:var(--dark);color:var(--light);line-height:1.6;overflow-x:hidden;transition:var(--transition);}
    img {max-width:100%;display:block;}
    .container {max-width:1200px;margin:0 auto;padding:2rem;}
    /* Header */
    header {padding:2rem 0;position:fixed;top:0;z-index:100;height:40px;backdrop-filter:blur(10px);background:rgba(15,23,42,0.8);border-bottom:1px solid rgba(255,255,255,0.1);text-align: center;display: flex;align-items: center;left: 0;right: 0;}
    header .container{
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0;
      width: 100%;
    }
    /* Mobile Nav toggle (hamburger) */
  .nav{display:flex;justify-content:space-between;align-items:center;margin: 1rem;}
  .logo{
    margin: 1rem;
  }
  @media (max-width: 768px) {
  .nav,
  .logo {
    margin: 0;
  }
}
.logo span{color:var(--primary);}
.nav-links{display:flex;gap:2rem;align-items:center;}
.nav-link{color:var(--light);text-decoration:none;font-weight:500;transition:var(--transition);position:relative;}
.nav-link::after{content:'';position:absolute;bottom:-5px;left:0;width:0;height:2px;background:var(--primary);transition:var(--transition);}
.nav-link:hover::after{width:100%;}
.theme-toggle{background:rgba(55, 55, 95, 0.884);border:none;color:var(--light);font-size:1.2rem;cursor:pointer;transition:var(--transition);padding: 5px;border-radius: 5px;}
.theme-toggle:hover{color:var(--primary);transform:rotate(2deg);}
.hamburger{background:none;border:none;cursor:pointer;padding:8px;display:none;flex-direction:column;gap:6px;z-index:1100;}
.hamburger span{display:block;height:3px;background:#fff;border-radius:2px;transition:all .3s ease;}
.hamburger span:first-child{width:25px;}
.hamburger span:last-child{width:18px;margin-left: auto;}
.hamburger:active .bar:nth-child(1){transform: rotate(-45deg) translate(-5px, 6px);}
.hamburger:active .bar:nth-child(2){opacity: 0;}
.hamburger:active .bar:nth-child(3){transform: rotate(45deg) translate(-5px, -6px); width: 25px; }

@media(max-width:868px){
  .nav-links{position:absolute;top:68px;right:0;background:rgba(15,23,42,.95);flex-direction:column;width:250px;padding:1.5rem;border-left:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);
    border-radius: 1rem 0 0 1rem; right:-100%;opacity:0;pointer-events:none;z-index:1000;transition:right 0.5s cubic-bezier(1,-0.06, 0.58, 1);opacity: 1;}
  .nav-links.open{right:0;opacity:1;pointer-events:auto;}
  .hamburger{display:flex;}
  .nav-links .auth-btn{display:block;text-align:center;padding:.6rem 1rem;margin-top:1rem;border-radius:.5rem;font-weight:600;transition:.3s;}
  .nav-links .auth-btn.signup{background:var(--primary);color:#fff;}
  .nav-links .auth-btn.login{background:#fff;color:var(--dark);}
  .nav-links .auth-btn:hover{opacity:.9;transform:translateY(-2px);}
}



/* From Uiverse.io by JulanDeAlb */ 
.hamburger {
  cursor: pointer;
}

.hamburger input {
  display: none;
}

.hamburger svg {
  /* The size of the SVG defines the overall size */
  height: 3em;
  /* Define the transition for transforming the SVG */
  transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line {
  fill: none;
  stroke: white;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  /* Define the transition for transforming the Stroke */
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
              stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line-top-bottom {
  stroke-dasharray: 12 63;
}

.hamburger input:checked + svg {
  transform: rotate(-45deg);
}

.hamburger input:checked + svg .line-top-bottom {
  stroke-dasharray: 20 300;
  stroke-dashoffset: -32.42;
}



    /* Hero */
    .hero {min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:3rem;text-align:left;width: 100%;}
    .hero::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,var(--primary-dark) 0%,transparent 70%);opacity:.1;z-index:-1;animation:pulse 15s infinite alternate;}
    @keyframes pulse{0%{transform:scale(1);}100%{transform:scale(1.2);}}  
    .hero-content{max-width:800px;}
    .hero-subtitle{color:var(--primary);font-weight:600;margin-bottom:1rem;display:inline-block;position:relative;}
    .hero-subtitle::after{content:'';position:absolute;bottom:-5px;left:0;width:100%;height:2px;background:var(--primary);transform:scaleX(0);transform-origin:right;transition:transform .6s ease;}
    .hero:hover .hero-subtitle::after{transform:scaleX(1);transform-origin:left;}
    .hero-title{font-size:3.5rem;font-weight:700;line-height:1.1;margin-bottom:0;background:linear-gradient(to right,var(--light),var(--primary));-webkit-background-clip:text;background-clip:text;color:transparent;}
    .hero-description{font-size:1.1rem;color:var(--gray);margin-bottom:2rem;max-width:90%;}
    .stats{display:flex;gap:2rem;margin-bottom:3rem;}
    .stat-item{position:relative;}
    .stat-item::before{content:'';position:absolute;top:0;left:-1rem;width:3px;height:100%;background:var(--primary);border-radius:3px;}
    .stat-number{font-size:2rem;font-weight:700;color:var(--primary);}  
    .stat-label{font-size:.9rem;color:var(--gray);}  
    .cta-buttons{display:flex;gap:1rem;flex-wrap:wrap;}
    .btn{padding:.8rem 1.8rem;border-radius:50px;font-weight:600;text-decoration:none;transition:var(--transition);display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;}
    .btn:hover{
      color: white;
    }
    /* USP Badge */
    .usp-badge{margin-top:1.5rem;display:inline-block;padding:.4rem 1rem;background:rgba(99,102,241,.15);color:var(--primary);border:1px solid rgba(99,102,241,.4);border-radius:999px;font-size:.85rem;font-weight:600;}

    /* Section Base */
    .section{padding:0 1rem 0;position:relative;}
    .section-title{font-size:2.5rem;font-weight:800;margin-bottom:3rem;position:relative;display:inline-block;}
    .section-title::after{content:'';position:absolute;bottom:-10px;left:0;width:50%;height:4px;background:var(--primary);border-radius:2px;}
@media (max-width:410px) {
  .section {
    padding: 5px;
  }
}
    /* About Section */
    .about-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;background-color: var(--card-bg);padding: 1rem;border-radius: 2rem;border: 1px solid rgba(32, 32, 124, 0.705);}
    .about-image-wrap{text-align:center;}
    
    .about-image{max-width:270px;border-radius:50%;border:4px solid var(--primary);box-shadow:0 0 30px rgba(99,102,241,.3);margin:0 auto;}
    .about-content h3{font-size:2.3rem;margin-bottom:1rem;}
    .about-content p{color:var(--gray);margin-bottom:1.5rem;}
    .about-highlights{margin:1.5rem 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;}
    .about-chip{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:.75rem;border-radius:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--light);transition: var(--transition);}
    .about-chip:hover{
      background: var(--primary);
      color: #000;
    }
    .tech-stack-grid{margin-top:2.5rem;padding:1rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;}
    .tech-item{background:rgba(99,102,241,.1);color:var(--primary);border:1px solid rgba(99,102,241,.25);padding:2rem 1rem;border-radius:.75rem;text-align:center;font-size:.9rem;font-weight:600;display: flex;flex-direction: column;align-items: center;}
    @media(max-width:768px){.about-wrapper{grid-template-columns:1fr;text-align:center;}.about-content{text-align:center;}}
    /* Services */
    .services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;}
    .service-card{background:var(--card-bg);border-radius:1rem;padding:2rem;transition:var(--transition);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);position:relative;overflow:hidden;}
    .service-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(99,102,241,.1)0%,transparent 100%);z-index:-1;opacity:0;transition:var(--transition);}  
    .service-card:hover{box-shadow:0 10px 30px rgba(0,0,0,.2);border-color:rgba(99,102,241,.3);}  
    .service-card:hover::before{opacity:1;}  
    .service-icon{font-size:2.5rem;color:var(--primary);margin-bottom:1.5rem;}
    .service-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem;}
    .service-description{color:var(--gray);margin-bottom:1.5rem;}
    .service-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;}
    .tech-tag{background:rgba(99,102,241,.1);color:var(--primary);padding:.5rem 1rem;border-radius:10px;font-size:.8rem;font-weight:600;}
    .service-badge-premium{display:inline-block;margin-bottom:.75rem;padding:.25rem .75rem;background:var(--secondary);color:#000;font-weight:700;font-size:.75rem;border-radius:999px;text-transform:uppercase;letter-spacing:.5px;}

    /* Projects */
    .projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.6rem;}
    .project-card{border-radius:1rem;overflow:hidden;position:relative;transition:var(--transition);transform-style:preserve-3d;perspective:1000px;height:420px;}
    .project-card-inner{position:relative;width:100%;height:100%;transition:transform .8s;transform-style:preserve-3d;}
    .project-card:hover .project-card-inner{transform:rotateY(180deg);}  
    .project-card-front,.project-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;}
    .project-card-front{background:var(--card-bg);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);}  
    .project-img{width:100%;height:200px;object-fit:cover;}
    .project-card img{
transform: scale(0.90);
    }
    .project-content{padding:1.5rem;}
    .project-title{font-size:1.3rem;font-weight:700;margin-bottom:.5rem;}
    .project-description{color:var(--gray);margin-bottom:1rem;}
    .project-card-back{background:linear-gradient(135deg,var(--primary-dark)0%,var(--primary)100%);color:#fff;transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;padding:2rem;text-align:center;}
    .project-features{list-style:none;margin-bottom:1.5rem;}
    .project-features li{margin-bottom:.5rem;position:relative;padding-left:1.5rem;}
    .project-features li::before{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;left:0;color:var(--secondary);}  

    /* Testimonials */
    .testimonials{top:2rem;position:relative;padding:4rem 0;}
    .swiper{width:100%;padding:2rem 0;}
    .testimonial-card{background:var(--card-bg);border-radius:1rem;padding:2rem;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);margin:0 1rem;}
    .testimonial-content{font-style:italic;margin-bottom:1.5rem;position:relative;}
    .testimonial-content::before,.testimonial-content::after{content:'"';font-size:3rem;color:var(--primary);opacity:.3;position:absolute;}
    .testimonial-content::before{top:-1rem;left:-1rem;}
    .testimonial-content::after{bottom:-2rem;right:-1rem;}
    .testimonial-author{display:flex;align-items:center;gap:1rem;}
    .author-avatar{width:50px;height:50px;border-radius:50%;object-fit:cover;border:2px solid var(--primary);}  
    .author-info h4{font-weight:700;margin-bottom:.2rem;}
    .author-info p{color:var(--gray);font-size:.9rem;}

    /* Contact */
    .contact-form{max-width:600px;margin:0 auto;background:var(--card-bg);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);border-radius:1rem;padding:2rem;}
    .form-group{margin-bottom:1.5rem;}
    .form-label{display:block;margin-bottom:.5rem;font-weight:600;}
    .form-control{width:100%;padding:.8rem 1rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:.5rem;color:var(--light);transition:var(--transition);}  
    .form-control:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.2);}  
    textarea.form-control{min-height:150px;resize:vertical;}
    .form-submit{width:100%;padding:1rem;background:var(--primary);color:#fff;border:none;border-radius:.5rem;font-weight:600;cursor:pointer;transition:var(--transition);}  
    .form-submit:hover{background:var(--primary-dark);transform:translateY(-3px);box-shadow:0 4px 15px rgba(99,102,241,.3);}  
  .typing {
    font-style: italic;
    font: 29px;
    color: white;animation: blink 1s steps(1) infinite;}@keyframes blink { 90% { opacity: 0; } }
    /* Footer */
    footer{background:rgba(15,23,42,.8);padding:3rem 0;border-top:1px solid rgba(255,255,255,.1);}  
    .footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2rem;}
    .footer-logo{font-size:1.5rem;font-weight:700;color:var(--light);margin-bottom:1rem;display:inline-block;text-decoration:none;}
    .footer-logo span{color:var(--primary);}  
    .footer-about{margin-bottom:1rem;color:white;}  
    .social-links{display:flex;gap:1rem;justify-content: center;margin: 1rem;}
    .social-link{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;color:var(--light);transition:background 0.3s ease;text-decoration:none;}
    footer .linkedin:hover{background-color: #7070fc;}
    footer .X:hover{ background-color: white;}
    footer .X:hover i{color: #000;}
    footer .whatsapp:hover{background-color: #3ed36b;}
    footer .yt-ico:hover{background-color: #ec452f;}
    .social-link:hover{background:#3d3f44;color:#fff;}  
    footer .facebook-ico:hover{background:#7070fc;;color:#fff;}  
    .footer-links-title{font-size:1.2rem;margin-bottom:1rem;color:var(--light);}  
    .footer-links,.footer-contact-info{list-style:none;}
    .footer-links li{margin-bottom:.5rem;}
    .footer-links a{color:white;text-decoration:none;transition:var(--transition);text-underline-offset: 4px;}
    .footer-links a:hover{color:var(--light);text-decoration: underline;}  
    .footer-contact-info li{margin-bottom:.5rem;color:var(--gray);}  
    .footer-bottom{text-align:center;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);color:var(--gray);font-size:.9rem;}
    .legal-links{margin-top:.5rem;display:flex;justify-content:center;gap:1.5rem;}
    .legal-links a{text-decoration:none;color:var(--gray);transition:var(--transition);}  
    .legal-links a:hover{color:var(--primary);}  

    /* Floating Shapes */
    .shape{position:absolute;border-radius:50%;filter:blur(40px);opacity:.2;z-index:-1;}
    .shape-1{width:300px;height:300px;background:var(--primary);top:10%;right:10%;animation:float 8s ease-in-out infinite;}
    .shape-2{width:200px;height:200px;background:var(--secondary);bottom:20%;left:5%;animation:float 6s ease-in-out infinite 2s;}
    @keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-20px);}}

    /* 3D cube */
    .cube{position:absolute;top:20%;right:10%;width:100px;height:100px;transform-style:preserve-3d;animation:rotate 15s infinite linear;z-index:-1;}
    @keyframes rotate{0%{transform:rotateX(0) rotateY(0);}100%{transform:rotateX(360deg) rotateY(360deg);}}
    .cube-face{position:absolute;width:100%;height:100%;border:2px solid rgba(99,102,241,.5);display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--primary);background:rgba(99,102,241,.1);backdrop-filter:blur(5px);}  
    .cube-face:nth-child(1){transform:rotateY(0deg) translateZ(50px);}  
    .cube-face:nth-child(2){transform:rotateY(90deg) translateZ(50px);}  
    .cube-face:nth-child(3){transform:rotateY(180deg) translateZ(50px);}  
    .cube-face:nth-child(4){transform:rotateY(-90deg) translateZ(50px);}  
    .cube-face:nth-child(5){transform:rotateX(90deg) translateZ(50px);}  
    .cube-face:nth-child(6){transform:rotateX(-90deg) translateZ(50px);}  

    /* ========= SMART CHATBOT WIDGET ========= */
    .floating-chatbot{position:fixed;bottom:20px;right:20px;z-index:9999;}
    .chat-toggle{background:#1f1e23;color:#fff;border:none;border-radius:50%;width:60px;height:60px;font-size:1.5rem;box-shadow:0 4px 15px rgba(0,0,0,.3);cursor:pointer;display:flex;align-items:center;justify-content:center;}
    .chat-panel{width:520px;max-width:calc(100vw - 40px);background: var(--dark);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:1rem;overflow:hidden;position:absolute;bottom:80px;right:0;display:none;flex-direction:column;}
    .chat-panel.open{display:flex;animation:fadeInUp .25s ease forwards;}
    .chat-contact{background-color: var(--primary-dark);padding: 10px;border-radius: 10px;}
    .chat-contact a{color: #00bd65;text-decoration: underline;font-weight: 600;margin: 0 auto;padding: 5px;}
    @keyframes fadeInUp{from{opacity:0;transform:translateY(10px) scale(.95);}to{opacity:1;transform:translateY(0) scale(1);}}
    .chat-header{background:var(--primary-dark);color:#fff;padding:1rem;display:flex;justify-content:space-between;align-items:center;}
    .chat-header h4{font-size:1rem;font-weight:700;}
    .close-chat{background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer;line-height:1;}
    .chat-body{padding:1rem;height:260px;overflow-y:auto;color:var(--light);display:flex;flex-direction:column;gap:.5rem;scroll-behavior:smooth;}
    .chat-msg{max-width:90%;padding:.55rem .9rem;border-radius:1rem 1rem 0 1rem;font-size:.9rem;line-height:1.35;word-break:break-word;}
    .chat-msg.bot{align-self:flex-start;border-radius: 0 5px 5px 0;background-color: var(--card-bg);}  
    .chat-msg.user{align-self:flex-end;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);}  
    .chat-footer{display:flex;border-top:1px solid rgba(255,255,255,.1);}
    .chat-footer input{flex:1;padding:.6rem;border:none;background:transparent;color:var(--light);font-size:.95rem;}
    .chat-footer input:focus{outline:none;}
    .chat-footer button{background:var(--primary);color:#fff;border:none;padding:0 1rem;cursor:pointer;}
    .chat-quick-btns{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem;}
    .chat-quick-btn{background:rgba(99,102,241,.15);color:var(--primary);border:1px solid rgba(99,102,241,.3);padding:.25rem .75rem;font-size:.75rem;border-radius:999px;cursor:pointer;transition:var(--transition);}  
    .chat-quick-btn:hover{background:var(--primary);color:#000;}
    /* Scrollbar subtle */
    .chat-body::-webkit-scrollbar{width:6px;}  
    .chat-body::-webkit-scrollbar-track{background:rgba(255,255,255,.05);}  
    .chat-body::-webkit-scrollbar-thumb{background:rgba(99,102,241,.4);border-radius:3px;}
    .chatbot-badge{position:absolute;bottom:70px;right:0;background:var(--primary);color:#fff;padding:8px 14px;border-radius:20px;font-size:14px;white-space:nowrap;opacity:0;transform:translateY(10px);transition:all .5s ease;pointer-events:none}.chatbot-badge.show{opacity:1;transform:translateY(0)}
    /* Responsive adjust for smaller screens */
    @media(max-width:480px){.chat-panel{right:-20px;}}
    .whatsapp-float{position:fixed;bottom:20px;left:20px;background-color:#25D366;color:#fff;font-size:24px;padding:5px 10px;border-radius:50%;text-align:center;box-shadow:2px 2px 8px rgba(0,0,0,.3);z-index:1000;transition:transform .3s ease}.whatsapp-float:hover{transform:scale(1.01);color:#fff}
  .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.pricing-section {
  padding: 5rem 2rem;
  background: var(--dark-bg);
  color: var(--light);
  text-align: center;
}.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  margin-top: 3rem;
}.pricing-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 2rem;
  text-align: center;
  transition: 0.3s ease;
}.pricing-card.highlight {
  border: 2px solid var(--primary);
  box-shadow: 0 0 20px rgba(0, 150, 255, 0.2);
}.pricing-card h3 {
  font-size: 1.4rem;
  margin-bottom: 0.5rem;
}.price {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 1rem;
  color: white;
}.pricing-card ul {
  list-style: none;
  padding: 0;
  margin: 1rem 0;
  text-align: left;
}.pricing-card li {
  margin-bottom: 0.5rem;
  position: relative;
  padding-left: 1.2rem;
}.pricing-card a{
    color: white;
    text-decoration: none;
}.pricing-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--primary);
}.btn-cta {
  margin-top: 1rem;
  padding: 0.6rem 1.5rem;
  background: var(--primary);
  color: white;
  border: 2px solid var(--primary);position:relative;top:20px;
  border-radius: 10rem;
  cursor: pointer;transition: all 0.3s ease;}
  .badge{display:inline-block;background:rgba(99,102,241,0.1);color:var(--primary);font-size:0.75rem;font-weight:600;padding:0.3rem 0.8rem;border-radius:999px;margin-bottom:1rem;text-transform:uppercase;letter-spacing:0.5px;}
.btn-cta:hover{background-color: transparent;}
.badge.best-value{background:var(--primary);color:#fff;}
.badge.premium{background:#f59e0b;color:#000;}
.badge.custom{background:#10b981;color:#fff;}
.plan-note{margin-top:1rem;font-size:0.9rem;color:var(--gray);}
.pricing-card ul li i{margin-right:0.6rem;color:var(--primary);}
body{font-family: 'Segoe UI';}.cool{
  color: #f59e0b;
}.hero-h2,  hero-h3 span {
  font-size:1.3rem;
  font-weight: bold;
  background: linear-gradient(90deg, var(--primary), #ee0979);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

height: 22px;
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;font-weight: 100;}
.bl-blak{font-size: 20px;background-color: #b20cff;padding: 1px 20px 5px 10px;border-radius: 100%;}
/* sign up log in buttons  */
.edge-glow {
background-color: #24176370;color: #fdfdfd;padding: 8px 22px;border: 2px solid #4e27fd;border-radius: 2rem;
position: relative;overflow: hidden;cursor: pointer;transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);}
.edge-glow span {display: inline-block; }
.edge-glow::after {content: "";position: absolute;top: 0;bottom: 0;left: -100%;width: 100%;background: #4e27fd;transition: left 0.3s ease;border-radius: 2rem;z-index: 0;}
.edge-glow:hover::after {left: 0; }.edge-glow:hover {color: white;}
.edge-glow span a{position: relative;z-index: 1; color: white;text-decoration: none;}
/* sing up */
.edge-glow2 {
background-color: #4e27fd;color: #fdfdfd;padding: 8px 22px;border: 2px solid #4e27fd;border-radius: 2rem;
position: relative;overflow: hidden;cursor: pointer;transition: all 0.3s ease;}
.edge-glow2 span a{display: inline-block; color: white;text-decoration: none;}
.edge-glow span{display: inline-block;z-index: 1;}
.edge-glow2::after {content: "";position: absolute;top: 0;bottom: 0;left: -100%;width: 100%;background: #ffffff3a;transition: left 0.3s ease;border-radius: 2rem;z-index: 0;}
.edge-glow2:hover::after {left: 0; }.edge-glow2:hover {color: #fff;}
.edge-glow2 span {position: relative;z-index: 1; }
.chatbot-badge{position:absolute;right:70px;bottom:25px;background:var(--primary);color:#fff;font-size:14px;padding:6px 26px 6px 10px;border-radius:6px;white-space:nowrap;box-shadow:1px 1px 6px rgba(0,0,0,.2);animation:fadeout 5s forwards;display:inline-flex;align-items:center;gap:6px}.chatbot-badge .badge-close{background:transparent;border:none;color:#fff;font-size:16px;cursor:pointer;line-height:1;margin-left:4px}.chatbot-badge .badge-close:hover{color:#ff4d4d}@keyframes fadeout{0%{opacity:1}80%{opacity:1}100%{opacity:0;visibility:hidden}}
.typing-indicator {
  display: flex;
  gap: 6px;
  align-items: center;
  padding: 8px 12px;
}

.typing-indicator span {
  width: 8px;
  height: 8px;
  background: #666;
  border-radius: 50%;
  display: inline-block;
  animation: bounce 1.4s infinite;
}

.typing-indicator span:nth-child(1) { animation-delay: 0s; }
.typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator span:nth-child(3) { animation-delay: 0.4s; }

@keyframes bounce {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
  40% { transform: scale(1); opacity: 1; }
}
/* ===========================================
   CUSTOM SCROLLBAR DESIGN
   =========================================== */

/* For Webkit browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: linear-gradient(135deg, #f8fafc, #e2e8f0);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: padding-box;
    transition: all 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, var(--primary-dark), #4338ca);
    transform: scale(1.05);
}

::-webkit-scrollbar-thumb:active {
    background: linear-gradient(135deg, #4338ca, #3730a3);
}

::-webkit-scrollbar-corner {
    background: transparent;
}

/* For Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--primary) #f8fafc;
}

/* Smooth scrolling for the entire page */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px; /* Accounts for fixed header */
}