/* Skip Link for Accessibility */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--primary);
    color: #fff;
    padding: 8px 16px;
    z-index: 10001;
    transition: top 0.3s;
}
.skip-link:focus {
    top: 0;
}
:root{--primary:#6C63FF;--primary-dark:#5A52D5;--primary-light:#8B85FF;--accent:#00D9FF;--bg-dark:#0A0A1A;--bg-card:#12122A;--bg-card-hover:#1A1A3E;--bg-section-alt:#0E0E22;--text-primary:#FFFFFF;--text-secondary:#D0D0E8;--text-muted:#9999BB;--gradient:linear-gradient(135deg,var(--primary),var(--accent));--shadow:0 10px 40px rgba(0,0,0,.3);--radius:16px;--radius-sm:10px;--transition:all .3s cubic-bezier(.4,0,.2,1);--font-heading:'Space Grotesk',sans-serif;--font-body:'Inter',sans-serif}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{font-family:var(--font-body);background:var(--bg-dark);color:var(--text-primary);line-height:1.7;overflow-x:hidden}a{text-decoration:none;color:inherit}ul{list-style:none}
.container{max-width:100%;margin:0 auto;padding:0 16px;overflow-x:hidden}
#preloader{position:fixed;inset:0;background:var(--bg-dark);display:flex;align-items:center;justify-content:center;z-index:10000;transition:opacity .5s,visibility .5s}#preloader.hidden{opacity:0;visibility:hidden}.loader-ring{width:50px;height:50px;border:3px solid transparent;border-top-color:var(--primary);border-right-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;transition:var(--transition)}.navbar.scrolled{background:rgba(10,10,26,.95);backdrop-filter:blur(20px);padding:10px 0;box-shadow:0 4px 30px rgba(0,0,0,.3)}.nav-container{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:8px}.logo{font-family:var(--font-heading);font-size:1.8rem;font-weight:700}.logo span{background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nav-links{display:none;gap:4px}.nav-link{padding:8px 14px;border-radius:8px;font-size:.88rem;font-weight:500;color:var(--text-secondary);transition:var(--transition)}.nav-link:hover,.nav-link.active{color:var(--text-primary);background:rgba(108,99,255,.1)}.nav-link.active{color:var(--primary-light)}.nav-cta{display:none;padding:8px 20px;background:linear-gradient(135deg,#00D9FF,#0088FF);border-radius:50px;font-size:.85rem;font-weight:700;color:#0A0A1A;margin-left:auto;transition:var(--transition);white-space:nowrap}.nav-cta:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(108,99,255,.4)}.hamburger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:4px}.hamburger span{width:24px;height:2px;background:var(--text-primary);transition:var(--transition)}
.hero{min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:80px}.hero-bg-shapes{position:absolute;inset:0;overflow:hidden}.shape{position:absolute;border-radius:50%;filter:blur(80px);opacity:.15}.shape-1{width:600px;height:600px;background:#00D9FF;top:-200px;right:-100px;animation:float 8s ease-in-out infinite}.shape-2{width:400px;height:400px;background:var(--accent);bottom:-100px;left:-100px;animation:float 6s ease-in-out infinite reverse}.shape-3{width:300px;height:300px;background:#FF6B6B;top:50%;left:50%;animation:float 10s ease-in-out infinite}@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,-30px)}}
.hero-content{display:grid;grid-template-columns:1fr;gap:32px;align-items:center;position:relative;z-index:2}.hero-badge{display:inline-block;padding:8px 20px;background:rgba(108,99,255,.1);border:1px solid rgba(108,99,255,.2);border-radius:50px;font-size:.9rem;color:var(--primary-light);margin-bottom:20px}.hero-badge i{margin-right:6px}.hero-title{font-family:var(--font-heading);font-size:1.8rem;font-weight:800;line-height:1.05;margin-bottom:20px;letter-spacing:-0.02em}.gradient-text{background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-subtitle{font-size:0.95rem;color:var(--text-secondary);margin-bottom:16px;font-weight:500}.cursor{color:var(--primary);animation:blink 1s infinite}@keyframes blink{50%{opacity:0}}.hero-desc{color:var(--text-secondary);font-size:0.9rem;margin-bottom:24px;max-width:100%}.hero-buttons{display:flex;gap:16px;margin-bottom:48px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 32px;border-radius:50px;font-size:.95rem;font-weight:600;transition:var(--transition);cursor:pointer;border:none}.btn-primary{background:linear-gradient(135deg,#00D9FF,#0088FF);color:#0A0A1A;font-weight:700;box-shadow:0 4px 20px rgba(0,255,136,.3)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,255,136,.5)}.btn-outline{background:transparent;color:var(--text-primary);border:2px solid rgba(108,99,255,.3)}.btn-outline:hover{border-color:var(--primary);background:rgba(108,99,255,.1);transform:translateY(-2px)}.btn-full{width:100%;justify-content:center}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat{text-align:center}.stat-number{font-family:var(--font-heading);font-size:2.2rem;font-weight:700;background:linear-gradient(135deg,#00D9FF,#0088FF);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.stat-plus{font-family:var(--font-heading);font-size:1.6rem;font-weight:700;color:var(--accent)}.stat-label{display:block;font-size:.8rem;color:var(--text-muted);margin-top:4px}
.hero-image{display:flex;flex-direction:column;align-items:center;gap:24px}.hero-img-wrapper{position:relative;width:200px;height:200px}.hero-img-bg{position:absolute;inset:0;background:var(--gradient);border-radius:50%;opacity:.15;animation:pulse 4s ease-in-out infinite}@keyframes pulse{0%,100%{transform:scale(1);opacity:.15}50%{transform:scale(1.05);opacity:.25}}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;border:3px solid rgba(108,99,255,.3);z-index:1}.hero-tools-float{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.tool-tag{padding:6px 14px;background:var(--bg-card);border:1px solid rgba(108,99,255,.15);border-radius:50px;font-size:.8rem;color:var(--text-secondary);display:flex;align-items:center;gap:6px}.tool-tag i{color:var(--primary);font-size:.75rem}.scroll-down{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);color:var(--text-muted);font-size:1.5rem;animation:bounce 2s infinite}@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(10px)}}
.section{padding:60px 16px}.section-dark{background:var(--bg-section-alt)}.section-header{text-align:center;margin-bottom:60px}.section-tag{display:inline-block;padding:6px 16px;background:rgba(0,255,136,.06);border:1px solid rgba(0,255,136,.15);border-radius:50px;font-size:.85rem;color:var(--primary-light);margin-bottom:16px}.section-title{font-family:var(--font-heading);font-size:1.6rem;font-weight:700;margin-bottom:16px}.section-desc{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:1.05rem}.section-cta{text-align:center;margin-top:48px}
.about-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;align-items:center}.about-img-card{position:relative;background:var(--bg-card);border-radius:var(--radius);padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:380px;border:1px solid rgba(108,99,255,.1)}.about-photo{width:100%;height:100%;object-fit:cover;border-radius:var(--radius)}.experience-badge{position:absolute;bottom:-20px;right:-20px;background:var(--gradient);padding:20px 28px;border-radius:var(--radius-sm);text-align:center;box-shadow:var(--shadow)}.exp-number{display:block;font-family:var(--font-heading);font-size:2rem;font-weight:700}.exp-text{font-size:.8rem;opacity:.9}.about-content h3{font-family:var(--font-heading);font-size:1.5rem;margin-bottom:20px;line-height:1.3}.about-content p{color:var(--text-secondary);margin-bottom:16px}.about-highlights{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0 32px}.highlight-item{display:flex;align-items:center;gap:10px;font-size:.9rem;color:var(--text-secondary)}.highlight-item i{color:var(--accent);font-size:.85rem}
.services-category{margin-bottom:48px}.category-title{font-family:var(--font-heading);font-size:1.4rem;margin-bottom:24px;color:var(--text-primary);display:flex;align-items:center;gap:10px}.category-title i{color:var(--primary)}.new-badge{padding:3px 10px;background:linear-gradient(135deg,#FF6B6B,#FF8E53);border-radius:50px;font-size:.7rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:1px}
.services-grid{display:grid;grid-template-columns:1fr;gap:20px}.service-card{background:var(--bg-card);padding:32px 24px;border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);transition:var(--transition);position:relative;overflow:hidden}.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient);transform:scaleX(0);transition:var(--transition)}.service-card:hover{transform:translateY(-8px);border-color:rgba(108,99,255,.2);box-shadow:0 20px 60px rgba(0,0,0,.3)}.service-card:hover::before{transform:scaleX(1)}.service-card.featured{border-color:rgba(255,107,107,.2)}.service-card.featured::before{background:linear-gradient(135deg,#FF6B6B,var(--accent))}.service-icon{width:52px;height:52px;background:rgba(108,99,255,.1);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--primary);margin-bottom:16px;transition:var(--transition)}.service-card:hover .service-icon{background:var(--gradient);color:#fff}.service-card h3{font-family:var(--font-heading);font-size:1.05rem;margin-bottom:10px}.service-card p{color:var(--text-secondary);font-size:.85rem;line-height:1.65;margin-bottom:14px}.service-tags{display:flex;flex-wrap:wrap;gap:5px}.service-tags span{padding:3px 9px;background:rgba(108,99,255,.08);border-radius:50px;font-size:.72rem;color:var(--primary-light)}
.pricing-grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:start}.pricing-card{background:var(--bg-card);border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);padding:36px 28px;transition:var(--transition);position:relative}.pricing-card:hover{transform:translateY(-4px);border-color:rgba(108,99,255,.2)}.pricing-card.popular{border-color:rgba(0,217,255,.3);transform:scale(1.05);box-shadow:0 20px 60px rgba(108,99,255,.2)}.popular-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#00D9FF,#0088FF);padding:5px 20px;border-radius:50px;font-size:.8rem;font-weight:700;color:#fff;white-space:nowrap}.pricing-header{text-align:center;margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid rgba(108,99,255,.1)}.pricing-header h3{font-family:var(--font-heading);font-size:1.5rem;margin-bottom:6px}.pricing-desc{color:var(--text-muted);font-size:.85rem;margin-bottom:16px}.pricing-amount{font-family:var(--font-heading)}.currency{font-size:1.5rem;vertical-align:top;color:var(--accent)}.amount{font-size:3rem;font-weight:800;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.period{font-size:.9rem;color:var(--text-muted)}.pricing-features{list-style:none;margin-bottom:28px}.pricing-features li{padding:8px 0;font-size:.9rem;color:var(--text-secondary);display:flex;align-items:center;gap:10px}.pricing-features li i{font-size:.75rem;width:18px;text-align:center}.pricing-features li i.fa-check{color:var(--accent)}.pricing-features li i.fa-times{color:var(--text-muted)}.pricing-features li.muted{color:var(--text-muted);opacity:.5}
.portfolio-grid{display:grid;grid-template-columns:1fr;gap:24px}.portfolio-card{background:var(--bg-card);border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);overflow:hidden;transition:var(--transition)}.portfolio-card:hover{transform:translateY(-4px);border-color:rgba(108,99,255,.2);box-shadow:var(--shadow)}.portfolio-img{height:180px;background:var(--bg-section-alt);display:flex;align-items:center;justify-content:center}.portfolio-placeholder{width:70px;height:70px;background:rgba(108,99,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:var(--primary)}.portfolio-content{padding:24px}.portfolio-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}.portfolio-tags span{padding:3px 9px;background:rgba(0,217,255,.08);border-radius:50px;font-size:.72rem;color:var(--accent)}.portfolio-content h3{font-family:var(--font-heading);font-size:1.1rem;margin-bottom:10px}.portfolio-content p{color:var(--text-secondary);font-size:.85rem;margin-bottom:6px}.portfolio-result{color:var(--accent);font-size:.85rem;font-weight:600;margin-top:10px}.portfolio-result i{margin-right:6px}.portfolio-link{display:inline-block;margin-top:12px;color:var(--primary-light);font-size:.85rem;font-weight:600;transition:var(--transition)}.portfolio-link:hover{color:var(--accent)}
.skills-grid{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:48px}.skill-card{background:var(--bg-card);padding:28px;border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);text-align:center;transition:var(--transition)}.skill-card:hover{transform:translateY(-4px);border-color:rgba(108,99,255,.2)}.skill-icon{width:52px;height:52px;background:rgba(108,99,255,.1);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--primary);margin:0 auto 12px}.skill-card h3{font-family:var(--font-heading);font-size:.95rem;margin-bottom:14px}.skill-bar{height:8px;background:rgba(108,99,255,.1);border-radius:50px;overflow:hidden}.skill-progress{height:100%;background:linear-gradient(135deg,#00D9FF,#0088FF);border-radius:50px;width:0;transition:width 1.5s cubic-bezier(.4,0,.2,1);position:relative}.skill-progress span{position:absolute;right:0;top:-26px;font-size:.8rem;font-weight:600;color:var(--primary-light)}.tools-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.tool-logo{padding:10px 20px;background:var(--bg-card);border:1px solid rgba(108,99,255,.1);border-radius:var(--radius-sm);font-size:.9rem;font-weight:600;color:var(--text-secondary);transition:var(--transition)}.tool-logo:hover{border-color:var(--primary);color:var(--primary-light);transform:translateY(-2px)}
.testimonials-grid{display:grid;grid-template-columns:1fr;gap:24px}.testimonial-card{background:var(--bg-card);padding:32px;border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);transition:var(--transition)}.testimonial-card:hover{transform:translateY(-4px);border-color:rgba(108,99,255,.2)}.testimonial-stars{color:#FFD700;margin-bottom:16px;display:flex;gap:4px}.testimonial-card p{color:var(--text-secondary);font-size:.95rem;font-style:italic;margin-bottom:20px;line-height:1.8}.testimonial-author{display:flex;align-items:center;gap:12px}.author-avatar{width:44px;height:44px;background:rgba(108,99,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--primary)}.testimonial-author strong{display:block;font-size:.9rem}.testimonial-author span{font-size:.8rem;color:var(--text-muted)}
.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.process-card{background:var(--bg-card);padding:32px 20px;border-radius:var(--radius);border:1px solid rgba(108,99,255,.08);text-align:center;transition:var(--transition)}.process-card:hover{transform:translateY(-4px);border-color:rgba(108,99,255,.2)}.process-number{font-family:var(--font-heading);font-size:2.5rem;font-weight:800;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:.3;margin-bottom:12px}.process-icon{width:50px;height:50px;background:rgba(108,99,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--primary);margin:0 auto 16px}.process-card h3{font-family:var(--font-heading);font-size:1rem;margin-bottom:10px}.process-card p{color:var(--text-secondary);font-size:.85rem;line-height:1.6}
.contact-grid{display:grid;grid-template-columns:1fr;gap:24px}.calendly-btn{margin-bottom:24px;font-size:1rem;padding:18px 32px}.contact-card{display:flex;align-items:center;gap:16px;background:var(--bg-card);padding:20px;border-radius:var(--radius-sm);border:1px solid rgba(108,99,255,.08);margin-bottom:12px;transition:var(--transition)}.contact-card:hover{border-color:rgba(108,99,255,.2)}.contact-icon{width:48px;height:48px;background:rgba(108,99,255,.1);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:1.1rem;flex-shrink:0}.contact-card h4{font-size:.82rem;color:var(--text-muted);margin-bottom:2px}.contact-card p{font-size:.92rem}.social-links{display:flex;gap:10px;margin-top:20px}.social-link{width:46px;height:46px;background:var(--bg-card);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);border:1px solid rgba(108,99,255,.1);transition:var(--transition);font-size:1rem}.social-link:hover{background:var(--gradient);color:#fff;border-color:transparent;transform:translateY(-4px)}
.contact-form{display:flex;flex-direction:column;gap:14px}.form-group input,.form-group textarea,.form-group select{width:100%;padding:14px 18px;background:var(--bg-card);border:1px solid rgba(108,99,255,.1);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-body);font-size:.92rem;transition:var(--transition);outline:none}.form-group select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236E6E8A' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(108,99,255,.1)}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-muted)}.form-group textarea{resize:vertical;min-height:120px}
.footer{padding:48px 0 24px;border-top:1px solid rgba(108,99,255,.08)}.footer-content{text-align:center;margin-bottom:32px}.footer-content .logo{display:inline-block;margin-bottom:12px;font-size:2rem}.footer-content p{color:var(--text-muted);margin-bottom:20px}.footer-links{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}.footer-links a{color:var(--text-secondary);font-size:.9rem;transition:var(--transition)}.footer-links a:hover{color:var(--primary-light)}.footer-bottom{text-align:center;padding-top:24px;border-top:1px solid rgba(108,99,255,.08)}.footer-bottom p{color:var(--text-muted);font-size:.85rem}
@media(max-width:992px){.hero-content{grid-template-columns:1fr;text-align:center;gap:40px}.hero-title{font-size:2.8rem}.hero-desc{margin:0 auto 32px}.hero-buttons{justify-content:center}.hero-stats{justify-content:center}.hero-image{order:-1}.hero-img-wrapper{width:250px;height:250px}.about-grid{grid-template-columns:1fr}.about-image{order:-1}.services-grid{grid-template-columns:repeat(2,1fr)}.portfolio-grid{grid-template-columns:1fr}.skills-grid{grid-template-columns:repeat(2,1fr)}.contact-grid{grid-template-columns:1fr}.process-grid{grid-template-columns:repeat(3,1fr)}.pricing-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}.pricing-card.popular{transform:none}.section-title{font-size:2.2rem}}
@media(max-width:768px){.nav-links{position:fixed;top:0;right:-100%;width:280px;height:100vh;background:var(--bg-card);flex-direction:column;padding:80px 32px 32px;transition:var(--transition);box-shadow:-10px 0 30px rgba(0,0,0,.3)}.nav-links.open{right:0}.nav-cta{display:none}.hamburger{display:flex}.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.hero-title{font-size:2.2rem}.hero-subtitle{font-size:1.1rem}.services-grid,.testimonials-grid{grid-template-columns:1fr}.skills-grid{grid-template-columns:1fr}.process-grid{grid-template-columns:repeat(2,1fr)}.about-highlights{grid-template-columns:1fr}}
@media(max-width:480px){.hero-title{font-size:1.8rem}.hero-stats{gap:16px;flex-wrap:wrap}.stat-number{font-size:1.8rem}.hero-img-wrapper{width:200px;height:200px}.section-title{font-size:1.8rem}.process-grid{grid-template-columns:1fr}}

/* ===== Scroll Reveal Fix — Content visible by default ===== */
.service-card, .skill-card, .testimonial-card, .portfolio-card, .process-card,
.contact-card, .about-content, .about-img-card, .tool-logo, .pricing-card,
.project-showcase, .project-details, .project-visual {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* Animate only when JS adds .reveal class */
.reveal-me {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal-me.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* ===== Trust Section ===== */
.trust-section {
    padding: 40px 0;
    border-bottom: 1px solid rgba(108, 99, 255, 0.08);
    background: var(--bg-section-alt);
}
.trust-label {
    text-align: center;
    color: var(--text-muted);
    font-size: 0.85rem;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.trust-badges {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}
.trust-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-secondary);
    font-size: 1rem;
    font-weight: 500;
}
.trust-badge i {
    color: var(--accent);
    font-size: 1.2rem;
}
.trust-platforms {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}
.trust-platforms span {
    padding: 6px 16px;
    background: rgba(108, 99, 255, 0.06);
    border: 1px solid rgba(108, 99, 255, 0.1);
    border-radius: 50px;
    font-size: 0.8rem;
    color: var(--text-muted);
    font-weight: 500;
}

/* ===== Project Showcase ===== */
.project-showcase {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 40px;
    align-items: center;
    margin-bottom: 60px;
    padding: 40px;
    background: var(--bg-card);
    border-radius: var(--radius);
    border: 1px solid rgba(108, 99, 255, 0.08);
    transition: var(--transition);
}
.project-showcase:hover {
    border-color: rgba(108, 99, 255, 0.2);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}
.project-showcase.reverse {
    grid-template-columns: 1.2fr 1fr;
}
.project-showcase.reverse .project-visual {
    order: 2;
}
.project-badge {
    display: inline-block;
    padding: 4px 12px;
    background: rgba(0, 217, 255, 0.1);
    border: 1px solid rgba(0, 217, 255, 0.2);
    border-radius: 50px;
    font-size: 0.75rem;
    color: var(--accent);
    font-weight: 600;
    margin-bottom: 12px;
}
.project-details h3 {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    margin-bottom: 16px;
}
.project-problem, .project-solution {
    color: var(--text-secondary);
    font-size: 0.9rem;
    margin-bottom: 10px;
    line-height: 1.7;
}
.project-problem i { color: #FF6B6B; margin-right: 6px; }
.project-solution i { color: var(--accent); margin-right: 6px; }
.project-tech {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 16px 0;
}
.project-tech span {
    padding: 4px 12px;
    background: rgba(108, 99, 255, 0.1);
    border-radius: 50px;
    font-size: 0.78rem;
    color: var(--primary-light);
    font-weight: 500;
}
.project-result {
    color: var(--accent);
    font-size: 0.9rem;
    font-weight: 600;
}
.project-result i { margin-right: 6px; }

/* Project Mockups */
.project-mockup {
    background: var(--bg-dark);
    border-radius: 12px;
    border: 1px solid rgba(108, 99, 255, 0.15);
    overflow: hidden;
}
.mockup-bar {
    padding: 10px 16px;
    background: rgba(108, 99, 255, 0.05);
    display: flex;
    gap: 6px;
}
.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
.dot.red { background: #FF5F57; }
.dot.yellow { background: #FFBD2E; }
.dot.green { background: #28C840; }
.mockup-content {
    padding: 24px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Funnel Visual */
.funnel-visual, .workflow-visual, .lifecycle-visual, .n8n-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.funnel-stage, .wf-node, .lc-step, .n8n-node {
    padding: 10px 20px;
    background: rgba(108, 99, 255, 0.1);
    border: 1px solid rgba(108, 99, 255, 0.2);
    border-radius: 8px;
    font-size: 0.85rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 220px;
    justify-content: center;
}
.funnel-stage.active, .wf-node.active, .lc-step.active, .n8n-node.active {
    background: rgba(0, 217, 255, 0.15);
    border-color: var(--accent);
    color: var(--accent);
}
.funnel-arrow, .wf-arrow, .lc-arrow, .n8n-arrow {
    color: var(--primary);
    font-size: 0.8rem;
}

/* Workflow Horizontal */
.workflow-visual, .lifecycle-visual, .n8n-visual {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

/* Chat Visual */
.chat-visual {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 300px;
}
.chat-bubble {
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 0.8rem;
    max-width: 85%;
}
.chat-bubble.user {
    background: rgba(108, 99, 255, 0.15);
    align-self: flex-end;
    color: var(--text-secondary);
}
.chat-bubble.bot {
    background: rgba(0, 217, 255, 0.1);
    border: 1px solid rgba(0, 217, 255, 0.15);
    align-self: flex-start;
    color: var(--text-secondary);
}
.chat-bubble.bot i {
    color: var(--accent);
    margin-right: 4px;
}

/* Dashboard Visual */
.dashboard-visual {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    width: 100%;
    max-width: 300px;
}
.dash-card {
    padding: 16px;
    background: rgba(108, 99, 255, 0.08);
    border-radius: 8px;
    text-align: center;
    border: 1px solid rgba(108, 99, 255, 0.1);
}
.dash-num {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.3rem;
    font-weight: 700;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.dash-label {
    font-size: 0.7rem;
    color: var(--text-muted);
}

@media (max-width: 768px) {
    .project-showcase, .project-showcase.reverse {
        grid-template-columns: 1fr;
    }
    .project-showcase.reverse .project-visual {
        order: 0;
    }
    .trust-badges { gap: 16px; }
    .workflow-visual, .lifecycle-visual, .n8n-visual {
        flex-direction: column;
    }
    .wf-arrow, .lc-arrow, .n8n-arrow {
        transform: rotate(90deg);
    }
}

/* ===== Cross-Browser Compatibility ===== */

/* CSS Reset for consistent rendering */
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Vendor Prefixes */
.gradient-text {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.navbar.scrolled {
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

/* Safari Flexbox Fixes */
.nav-container { display: -webkit-flex; display: flex; }
.hero-content { display: -webkit-grid; display: grid; }

/* iOS Safari Input Fix */
input, textarea, select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: var(--radius-sm);
}

/* iOS Safari Button Fix */
.btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Firefox Focus Outline */
:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

/* IE11 Grid Fallback */
@supports not (display: grid) {
    .hero-content { display: block; }
    .services-grid { display: block; }
    .services-grid .service-card { margin-bottom: 20px; }
    .pricing-grid { display: block; }
    .pricing-grid .pricing-card { margin-bottom: 20px; }
}

/* Smooth Scroll Polyfill */
html { scroll-behavior: smooth; }

/* Prevent FOUC (Flash of Unstyled Content) */
body { opacity: 1; transition: opacity 0.3s; }

/* Touch Device Optimization */
@media (hover: none) {
    .service-card:hover, .pricing-card:hover, .portfolio-card:hover,
    .testimonial-card:hover, .process-card:hover {
        transform: none;
        box-shadow: none;
    }
    .btn:hover { transform: none; }
}

/* Reduced Motion Preference */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .reveal-me { opacity: 1 !important; transform: none !important; }
}

/* Print Styles */
@media print {
    .navbar, .hero-bg-shapes, .scroll-down, .hamburger, .nav-cta,
    .section-cta, .contact-form, .social-links, .footer { display: none !important; }
    body { background: #fff; color: #000; }
    .section { padding: 40px 0; }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    :root {
        --bg-dark: #000;
        --bg-card: #111;
        --text-primary: #fff;
        --text-secondary: #ccc;
    }
}

/* Extra Small Devices (320px) */
@media (max-width: 320px) {
    .hero-title { font-size: 1.5rem; }
    .hero-stats { gap: 12px; }
    .stat-number { font-size: 1.5rem; }
    .container { padding: 0 16px; }
    .section-title { font-size: 1.5rem; }
}

/* Large Desktop (1440px+) */
@media (min-width: 1440px) {
    .container { max-width: 1400px; }
    .hero-title { font-size: 4rem; }
}

/* 2K+ Screens */
@media (min-width: 2560px) {
    .container { max-width: 1800px; }
    html { font-size: 20px; }
}

/* ===== Results Section ===== */
.results-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.result-card {
    background: var(--bg-card);
    padding: 32px 24px;
    border-radius: var(--radius);
    border: 1px solid rgba(108, 99, 255, 0.08);
    text-align: center;
    transition: var(--transition);
}
.result-card:hover {
    transform: translateY(-4px);
    border-color: rgba(108, 99, 255, 0.2);
}
.result-icon {
    width: 56px;
    height: 56px;
    background: rgba(0, 217, 255, 0.08);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #00D9FF;
    margin: 0 auto 16px;
}
.result-number {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 800;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 4px;
}
.result-label {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px;
}
.result-card p {
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.5;
}

/* ===== Testimonial Service Tag ===== */
.testimonial-service {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    background: rgba(0, 217, 255, 0.08);
    border: 1px solid rgba(0, 217, 255, 0.15);
    border-radius: 50px;
    font-size: 0.75rem;
    color: var(--accent);
    font-weight: 600;
    margin-bottom: 14px;
}

@media (max-width: 992px) {
    .results-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .results-grid { grid-template-columns: 1fr; }
}

/* ===== Intro Video Section ===== */
.video-showcase {
    position: relative;
    max-width: 480px;
    margin: 0 auto;
}
.video-glow {
    position: absolute;
    inset: -30px;
    background: radial-gradient(circle, rgba(108, 99, 255, 0.12) 0%, rgba(0, 217, 255, 0.06) 50%, transparent 70%);
    border-radius: 40px;
    z-index: 0;
    animation: glowPulse 4s ease-in-out infinite;
}
@keyframes glowPulse {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.02); }
}
.video-container {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid rgba(108, 99, 255, 0.2);
    box-shadow: 0 20px 60px rgba(108, 99, 255, 0.15), 0 0 40px rgba(0, 217, 255, 0.05);
    z-index: 1;
    background: #000;
    cursor: pointer;
}
.video-container video {
    width: 100%;
    display: block;
    border-radius: 18px;
}
.video-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(10, 10, 26, 0.5);
    backdrop-filter: blur(4px);
    transition: all 0.4s;
    border-radius: 18px;
}
.video-overlay:hover {
    background: rgba(10, 10, 26, 0.3);
}
.video-overlay.hidden {
    opacity: 0;
    pointer-events: none;
}
.play-button-outer {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(108, 99, 255, 0.2);
    border: 2px solid rgba(108, 99, 255, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
    animation: playPulse 2s ease-in-out infinite;
}
@keyframes playPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(108, 99, 255, 0.3); }
    50% { box-shadow: 0 0 0 15px rgba(108, 99, 255, 0); }
}
.video-overlay:hover .play-button-outer {
    background: rgba(108, 99, 255, 0.4);
    transform: scale(1.1);
}
.play-button-inner {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--gradient);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(108, 99, 255, 0.5);
}
.play-button-inner i {
    color: #fff;
    font-size: 1.3rem;
    margin-left: 4px;
}
.overlay-text {
    color: var(--text-secondary);
    font-size: 0.85rem;
    margin-top: 16px;
    font-weight: 500;
}
.sound-toggle {
    position: absolute;
    bottom: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(10, 10, 26, 0.8);
    border: 1px solid rgba(108, 99, 255, 0.2);
    color: var(--text-secondary);
    font-size: 1rem;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sound-toggle:hover {
    background: var(--primary);
    color: #fff;
}
.video-progress {
    height: 4px;
    background: rgba(108, 99, 255, 0.1);
    border-radius: 2px;
    margin-top: 8px;
    overflow: hidden;
    z-index: 1;
    position: relative;
}
.video-progress-fill {
    height: 100%;
    background: var(--gradient);
    border-radius: 2px;
    width: 0;
    transition: width 0.2s linear;
}

@media (max-width: 480px) {
    .video-showcase { max-width: 100%; }
    .play-button-outer { width: 64px; height: 64px; }
    .play-button-inner { width: 44px; height: 44px; }
    .play-button-inner i { font-size: 1rem; }
}

/* ===== AI Chatbot Widget ===== */
.chat-widget {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9999;
}
.chat-toggle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg,#00D9FF,#0088FF);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(108, 99, 255, 0.4);
    transition: all 0.3s;
    position: relative;
}
.chat-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 8px 30px rgba(108, 99, 255, 0.6);
}
.chat-toggle i {
    color: #fff;
    font-size: 1.5rem;
    transition: all 0.3s;
}
.chat-toggle.active i.fa-comment { display: none; }
.chat-toggle:not(.active) i.fa-times { display: none; }
.chat-toggle .badge {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 20px;
    height: 20px;
    background: #FF6B6B;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    color: #fff;
    font-weight: 700;
}
.chat-window {
    position: absolute;
    bottom: 76px;
    right: 0;
    width: 380px;
    height: 520px;
    background: var(--bg-card);
    border-radius: 20px;
    border: 1px solid rgba(108, 99, 255, 0.15);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    display: none;
    flex-direction: column;
    overflow: hidden;
    animation: slideUp 0.3s ease-out;
}
.chat-window.open { display: flex; }
@keyframes slideUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.chat-header {
    padding: 16px 20px;
    background: var(--bg-dark);
    border-bottom: 1px solid rgba(108, 99, 255, 0.1);
    display: flex;
    align-items: center;
    gap: 12px;
}
.chat-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(108, 99, 255, 0.3);
}
.chat-header-info h3 {
    font-size: 0.95rem;
    color: var(--text-primary);
    font-weight: 600;
}
.chat-header-info p {
    font-size: 0.75rem;
    color: var(--accent);
    display: flex;
    align-items: center;
    gap: 4px;
}
.chat-header-info p .dot {
    width: 6px;
    height: 6px;
    background: #28C840;
    border-radius: 50%;
    display: inline-block;
}
.quick-actions {
    padding: 12px 16px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    border-bottom: 1px solid rgba(108, 99, 255, 0.08);
}
.quick-btn {
    padding: 6px 12px;
    background: rgba(108, 99, 255, 0.08);
    border: 1px solid rgba(108, 99, 255, 0.15);
    border-radius: 50px;
    font-size: 0.72rem;
    color: var(--accent);
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.quick-btn:hover {
    background: rgba(108, 99, 255, 0.2);
    border-color: var(--primary);
}
.chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.chat-messages::-webkit-scrollbar { width: 4px; }
.chat-messages::-webkit-scrollbar-track { background: transparent; }
.chat-messages::-webkit-scrollbar-thumb { background: rgba(108, 99, 255, 0.2); border-radius: 4px; }
.msg {
    max-width: 85%;
    padding: 12px 16px;
    border-radius: 16px;
    font-size: 0.88rem;
    line-height: 1.6;
    animation: msgIn 0.3s ease-out;
}
@keyframes msgIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
.msg.bot {
    align-self: flex-start;
    background: rgba(108, 99, 255, 0.08);
    border: 1px solid rgba(108, 99, 255, 0.1);
    color: var(--text-secondary);
    border-bottom-left-radius: 4px;
}
.msg.user {
    align-self: flex-end;
    background: var(--gradient);
    color: #fff;
    border-bottom-right-radius: 4px;
}
.msg a {
    color: var(--accent);
    text-decoration: underline;
}
.msg.user a { color: #fff; }
.typing {
    display: none;
    align-self: flex-start;
    padding: 12px 16px;
    background: rgba(108, 99, 255, 0.08);
    border-radius: 16px;
    border-bottom-left-radius: 4px;
    gap: 4px;
}
.typing.active { display: flex; }
.typing-dot {
    width: 6px;
    height: 6px;
    background: var(--text-muted);
    border-radius: 50%;
    animation: typeB 1s infinite;
}
.typing-dot:nth-child(2) { animation-delay: 0.2s; }
.typing-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes typeB {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}
.chat-input-area {
    padding: 12px 16px;
    border-top: 1px solid rgba(108, 99, 255, 0.1);
    display: flex;
    gap: 8px;
    background: var(--bg-dark);
}
.chat-input {
    flex: 1;
    padding: 10px 16px;
    background: var(--bg-card);
    border: 1px solid rgba(108, 99, 255, 0.1);
    border-radius: 50px;
    color: var(--text-primary);
    font-size: 0.88rem;
    outline: none;
    font-family: inherit;
}
.chat-input:focus { border-color: var(--primary); }
.chat-input::placeholder { color: var(--text-muted); }
.chat-send {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg,#00D9FF,#0088FF);
    border: none;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    flex-shrink: 0;
}
.chat-send:hover { transform: scale(1.1); }


/* ===== Trust Ticker (Arcytex Style) ===== */
.trust-ticker {
    background: rgba(0, 0, 0, 0.9);
    border-bottom: 1px solid rgba(0, 217, 255, 0.15);
    border-bottom: 1px solid rgba(108, 99, 255, 0.1);
    padding: 10px 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
}
.ticker-track {
    overflow: hidden;
    width: 100%;
}
.ticker-content {
    display: flex;
    gap: 60px;
    animation: tickerScroll 30s linear infinite;
    white-space: nowrap;
}
.ticker-item {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.ticker-item i {
    color: #00D9FF;
    font-size: 0.7rem;
}
@keyframes tickerScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Push navbar down for ticker */
.navbar { top: 38px !important; }
.hero { padding-top: 120px !important; }

/* ===== Risk Reversal Badges ===== */
.risk-badges {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}
.risk-badge {
    padding: 8px 16px;
    background: rgba(0, 217, 255, 0.06);
    border: 1px solid rgba(0, 217, 255, 0.2);
    border-radius: 50px;
    font-size: 0.8rem;
    color: #00D9FF;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
}
.risk-badge i {
    font-size: 0.75rem;
}

/* ===== CTA Micro-copy ===== */
.cta-block {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cta-micro {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0;
}
.cta-micro strong {
    color: var(--accent);
}

/* ===== Dot Grid Background (Arcytex Style) ===== */
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(108, 99, 255, 0.08) 1px, transparent 1px);
    background-size: 30px 30px;
    z-index: 0;
    pointer-events: none;
}

/* ===== Center Glow (Arcytex Style) ===== */
.hero::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 600px;
    background: radial-gradient(circle, rgba(0, 217, 255, 0.06) 0%, transparent 70%);
    z-index: 0;
    pointer-events: none;
}

/* ===== Section Glow ===== */
.section-dark::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(108, 99, 255, 0.05) 0%, transparent 70%);
    pointer-events: none;
}
.section-dark { position: relative; }

/* ===== Enhanced Trust in Results ===== */
.result-card {
    border: 1px solid rgba(0, 217, 255, 0.1);
}
.result-card:hover {
    border-color: rgba(0, 217, 255, 0.3);
    box-shadow: 0 10px 40px rgba(0, 217, 255, 0.1);
}

/* ===== Mobile Ticker ===== */
@media (max-width: 768px) {
    .trust-ticker { padding: 8px 0; }
    .ticker-item { font-size: 0.7rem; gap: 6px; }
    .ticker-content { gap: 40px; }
    .navbar { top: 32px !important; }
    .hero { padding-top: 110px !important; }
    .risk-badges { flex-direction: column; }
    .risk-badge { justify-content: center; }
}

/* ===== Problem Section (Arcytex Style) ===== */
.problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 48px;
}
.problem-card {
    background: var(--bg-card);
    padding: 32px 28px;
    border-radius: var(--radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
    position: relative;
    transition: var(--transition);
}
.problem-card:hover {
    border-color: rgba(255, 107, 107, 0.2);
    transform: translateY(-4px);
}
.problem-number {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.05);
    position: absolute;
    top: 16px;
    right: 20px;
}
.problem-label {
    font-size: 0.7rem;
    font-weight: 600;
    color: #FF6B6B;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 12px;
}
.problem-card h3 {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    margin-bottom: 12px;
    color: var(--text-primary);
}
.problem-card p {
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.7;
}

/* ===== Cost Section ===== */
.cost-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--bg-card);
    padding: 40px;
    border-radius: var(--radius);
    border: 1px solid rgba(0, 217, 255, 0.15);
    margin-top: 48px;
}
.cost-number {
    text-align: center;
}
.cost-amount {
    display: block;
    font-family: var(--font-heading);
    font-size: 4rem;
    font-weight: 800;
    background: linear-gradient(135deg, #FF6B6B, #FF8E53);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.cost-label {
    font-size: 0.9rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* ===== Qualifier Section ===== */
.qualifier-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.qualifier-card {
    padding: 32px;
    border-radius: var(--radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
}
.qualifier-card.not-for-you {
    background: rgba(255, 107, 107, 0.03);
    border-color: rgba(255, 107, 107, 0.1);
}
.qualifier-card.for-you {
    background: rgba(0, 255, 136, 0.03);
    border-color: rgba(0, 217, 255, 0.15);
}
.qualifier-card h3 {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.qualifier-card ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.qualifier-card li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.6;
}
.qualifier-card.not-for-you li i { color: #FF6B6B; margin-top: 4px; }
.qualifier-card.for-you li i { color: #00D9FF; margin-top: 4px; }

@media (max-width: 768px) {
    .problem-grid { grid-template-columns: 1fr; }
    .qualifier-grid { grid-template-columns: 1fr; }
    .cost-section { flex-direction: column; text-align: center; gap: 24px; }
    .cost-amount { font-size: 3rem; }
}

/* ===== Logo Image ===== */
/* OLD LOGO CSS REMOVED */


/* ===== COMPREHENSIVE RESPONSIVE FIXES ===== */

/* Hero Image Responsive */
.hero-photo {
    width: 320px;
    height: 320px;
    max-width: 320px;
    object-fit: cover;
    object-position: center 20%;
    border-radius: 50%;
    display: block;
    border: 4px solid rgba(0, 217, 255, 0.2);
}

@media (min-width: 1440px) {
    .hero-photo { width: 380px; height: 380px; max-width: 380px; }
}

@media (max-width: 1199px) {
    .hero-photo { width: 300px; height: 300px; max-width: 300px; }
}

@media (max-width: 991px) {
    .hero-photo { width: 280px; height: 280px; max-width: 280px; }
}

@media (max-width: 767px) {
    .hero-photo { 
        width: 240px;
        height: 240px;
        max-width: 240px; 
        margin: 0 auto;
    }
    .hero-image {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}

@media (max-width: 575px) {
    .hero-photo { width: 200px; height: 200px; max-width: 200px; }
}

@media (max-width: 360px) {
    .hero-photo { width: 160px; height: 160px; max-width: 160px; }
}

/* Hero Layout Responsive */
.hero-content {
    display: flex;
    align-items: center;
    gap: 60px;
    min-height: 80vh;
}

@media (max-width: 991px) {
    .hero-content {
        flex-direction: column-reverse;
        text-align: center;
        gap: 40px;
        padding-top: 40px;
    }
    .hero-buttons {
        justify-content: center;
        flex-wrap: wrap;
    }
    .risk-badges {
        justify-content: center;
    }
    .hero-stats {
        justify-content: center;
    }
}

@media (max-width: 575px) {
    .hero-content {
        gap: 30px;
        min-height: auto;
        padding: 20px 0;
    }
}

/* Hero Title Responsive */
.hero-title {
    font-size: 4.5rem;
    line-height: 1.05;
}

@media (max-width: 1199px) {
    .hero-title { font-size: 3.5rem; }
}

@media (max-width: 991px) {
    .hero-title { font-size: 3rem; }
}

@media (max-width: 767px) {
    .hero-title { font-size: 2.5rem; }
}

@media (max-width: 575px) {
    .hero-title { font-size: 2rem; }
}

@media (max-width: 360px) {
    .hero-title { font-size: 1.75rem; }
}

/* Hero Subtitle Responsive */
.hero-subtitle {
    font-size: 1.2rem;
}

@media (max-width: 767px) {
    .hero-subtitle { font-size: 1rem; }
}

@media (max-width: 575px) {
    .hero-subtitle { font-size: 0.9rem; }
}

/* Hero Description Responsive */
.hero-desc {
    font-size: 1rem;
    max-width: 540px;
}

@media (max-width: 991px) {
    .hero-desc { 
        max-width: 100%; 
        margin: 0 auto;
    }
}

@media (max-width: 575px) {
    .hero-desc { font-size: 0.9rem; }
}

/* Stats Responsive */
.hero-stats {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
}

@media (max-width: 991px) {
    .hero-stats { 
        justify-content: center; 
        gap: 24px;
    }
}

@media (max-width: 575px) {
    .hero-stats { 
        gap: 16px;
    }
    .stat-number {
        font-size: 1.8rem !important;
    }
    .stat-label {
        font-size: 0.75rem;
    }
}

/* Buttons Responsive */
.hero-buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

@media (max-width: 575px) {
    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }
    .btn {
        text-align: center;
        justify-content: center;
    }
}

/* Risk Badges Responsive */
.risk-badges {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

@media (max-width: 575px) {
    .risk-badges {
        flex-direction: column;
        align-items: center;
    }
    .risk-badge {
        width: 100%;
        justify-content: center;
    }
}

/* Problem Grid Responsive */
.problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

@media (max-width: 991px) {
    .problem-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 575px) {
    .problem-grid { grid-template-columns: 1fr; }
}

/* Qualifier Grid Responsive */
.qualifier-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

@media (max-width: 767px) {
    .qualifier-grid { grid-template-columns: 1fr; }
}

/* Cost Section Responsive */
.cost-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media (max-width: 767px) {
    .cost-section {
        flex-direction: column;
        text-align: center;
        gap: 24px;
    }
    .cost-amount { font-size: 3rem; }
}

/* Services Grid Responsive */
.services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

@media (max-width: 1199px) {
    .services-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .services-grid { grid-template-columns: 1fr; }
}

/* Pricing Grid Responsive */
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

@media (max-width: 991px) {
    .pricing-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; }
}

/* Results Grid Responsive */
.results-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

@media (max-width: 1199px) {
    .results-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .results-grid { grid-template-columns: 1fr; }
}

/* Testimonials Grid Responsive */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

@media (max-width: 767px) {
    .testimonials-grid { grid-template-columns: 1fr; }
}

/* Portfolio Grid Responsive */
.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

@media (max-width: 767px) {
    .portfolio-grid { grid-template-columns: 1fr; }
}

/* Skills Grid Responsive */
.skills-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

@media (max-width: 991px) {
    .skills-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .skills-grid { grid-template-columns: 1fr; }
}

/* Tools Grid Responsive */
.tools-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

/* Process Grid Responsive */
.process-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

@media (max-width: 1199px) {
    .process-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
    .process-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 575px) {
    .process-grid { grid-template-columns: 1fr; }
}

/* Contact Grid Responsive */
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}

@media (max-width: 767px) {
    .contact-grid { 
        grid-template-columns: 1fr; 
        gap: 32px;
    }
}

/* Chat Widget Responsive */
.chat-window {
    width: 380px;
    height: 520px;
}

@media (max-width: 575px) {
    .chat-window {
        width: calc(100vw - 32px);
        height: 70vh;
        right: -8px;
        bottom: 70px;
    }
    .chat-toggle {
        width: 52px;
        height: 52px;
    }
}

/* Video Responsive */
.video-container {
    max-width: 480px;
    margin: 0 auto;
}

@media (max-width: 575px) {
    .video-container {
        max-width: 100%;
    }
}

/* Section Padding Responsive */
.section {
    padding: 100px 0;
}

@media (max-width: 991px) {
    .section { padding: 80px 0; }
}

@media (max-width: 575px) {
    .section { padding: 60px 0; }
}

/* Container Responsive */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

@media (max-width: 575px) {
    .container { padding: 0 16px; }
}

/* Section Header Responsive */
.section-title {
    font-size: 2.8rem;
}

@media (max-width: 991px) {
    .section-title { font-size: 2.2rem; }
}

@media (max-width: 575px) {
    .section-title { font-size: 1.8rem; }
}

/* About Grid Responsive */
.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

@media (max-width: 991px) {
    .about-grid {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    .about-image { order: -1; }
    .about-highlights { justify-content: center; }
}

/* Footer Responsive */
.footer-content {
    text-align: center;
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
}

/* Nav Responsive */
.navbar .nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    max-width: 1200px;
    margin: 0 auto;
}

@media (max-width: 767px) {
    .nav-links { display: none; }
    .nav-links.open { display: flex; flex-direction: column; }
    .hamburger { display: flex; }
    .nav-cta { display: none; }
}

/* Trust Ticker Responsive */
.trust-ticker {
    padding: 10px 0;
}

@media (max-width: 767px) {
    .trust-ticker { padding: 8px 0; }
    .ticker-item { font-size: 0.7rem; }
}

/* Scroll Down Arrow */
.scroll-down {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 767px) {
    .scroll-down { display: none; }
}

/* ===== LOGO FIX (Override) ===== */
.logo-img {
    height: 56px !important;
    width: auto !important;
    max-width: 200px !important;
    object-fit: contain !important;
    display: block !important;
}
.footer .logo-img {
    height: 44px !important;
    max-width: 160px !important;
}
@media (max-width: 1199px) { .logo-img { height: 48px !important; max-width: 180px !important; } }
@media (max-width: 991px) { .logo-img { height: 42px !important; max-width: 160px !important; } }
@media (max-width: 767px) { .logo-img { height: 36px !important; max-width: 140px !important; } }
@media (max-width: 575px) { .logo-img { height: 32px !important; max-width: 120px !important; } }
@media (max-width: 360px) { .logo-img { height: 28px !important; max-width: 100px !important; } }

/* ===== HERO PHOTO FIX ===== */
.hero-photo {
    object-position: center 20% !important;
}

/* ===== FOOTER TEXT FIX ===== */
.footer-content p {
    white-space: normal !important;
    overflow: visible !important;
}

/* ===== COMPREHENSIVE RESPONSIVE FIXES ===== */

/* Hero Layout */
@media (max-width: 991px) {
    .hero-content {
        grid-template-columns: 1fr !important;
        text-align: center !important;
        gap: 40px !important;
    }
    .hero-image { order: -1; }
    .hero-buttons { justify-content: center; flex-wrap: wrap; }
    .risk-badges { justify-content: center; }
    .hero-stats { justify-content: center; }
    .hero-desc { max-width: 100%; margin-left: auto; margin-right: auto; }
}

@media (max-width: 767px) {
    .hero-title { font-size: 2.5rem !important; }
    .hero-subtitle { font-size: 1rem !important; }
    .hero-desc { font-size: 0.9rem !important; }
    .hero-buttons { flex-direction: column; align-items: center; }
    .risk-badges { flex-direction: column; align-items: center; }
    .risk-badge { width: 100%; justify-content: center; }
    .hero-stats { flex-wrap: wrap; gap: 16px; }
    .stat-number { font-size: 1.8rem !important; }
}

@media (max-width: 575px) {
    .hero-title { font-size: 2rem !important; }
    .hero { padding-top: 100px !important; min-height: auto !important; }
    .container { padding: 0 16px !important; }
}

/* Hero Photo */
@media (max-width: 991px) {
    .hero-photo { width: 260px !important; height: 260px !important; }
    .hero-img-wrapper { width: 260px !important; height: 260px !important; margin: 0 auto; }
}
@media (max-width: 575px) {
    .hero-photo { width: 200px !important; height: 200px !important; }
    .hero-img-wrapper { width: 200px !important; height: 200px !important; }
}

/* Hero Tools Float */
@media (max-width: 767px) {
    .hero-tools-float { justify-content: center; gap: 6px; }
    .tool-tag { font-size: 0.75rem; padding: 5px 10px; }
}

/* Navbar */
@media (max-width: 767px) {
    .nav-links { display: none !important; }
    .nav-links.open { display: flex !important; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: rgba(10,10,26,0.98); padding: 20px; }
    .hamburger { display: flex !important; }
    .nav-cta { display: none !important; }
    .navbar { top: 32px !important; }
}

/* Trust Ticker */
@media (max-width: 767px) {
    .trust-ticker { padding: 8px 0; }
    .ticker-item { font-size: 0.7rem; gap: 6px; }
    .ticker-content { gap: 40px; }
}

/* Sections */
@media (max-width: 767px) {
    .section { padding: 60px 0 !important; }
    .section-title { font-size: 1.8rem !important; }
    .section-desc { font-size: 0.9rem; }
}

/* Services Grid */
@media (max-width: 1199px) {
    .services-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 575px) {
    .services-grid { grid-template-columns: 1fr !important; }
}

/* Pricing Grid */
@media (max-width: 991px) {
    .pricing-grid { grid-template-columns: 1fr !important; max-width: 500px; margin: 0 auto; }
}

/* Results Grid */
@media (max-width: 1199px) {
    .results-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 575px) {
    .results-grid { grid-template-columns: 1fr !important; }
}

/* Testimonials Grid */
@media (max-width: 767px) {
    .testimonials-grid { grid-template-columns: 1fr !important; }
}

/* Portfolio Grid */
@media (max-width: 767px) {
    .portfolio-grid { grid-template-columns: 1fr !important; }
}

/* Skills Grid */
@media (max-width: 991px) {
    .skills-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 575px) {
    .skills-grid { grid-template-columns: 1fr !important; }
}

/* Process Grid */
@media (max-width: 1199px) {
    .process-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
    .process-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 575px) {
    .process-grid { grid-template-columns: 1fr !important; }
}

/* Problem Grid */
@media (max-width: 991px) {
    .problem-grid { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 575px) {
    .problem-grid { grid-template-columns: 1fr !important; }
}

/* Qualifier Grid */
@media (max-width: 767px) {
    .qualifier-grid { grid-template-columns: 1fr !important; }
}

/* Cost Section */
@media (max-width: 767px) {
    .cost-section { flex-direction: column; text-align: center; gap: 24px; }
    .cost-amount { font-size: 3rem; }
}

/* Contact Grid */
@media (max-width: 767px) {
    .contact-grid { grid-template-columns: 1fr !important; gap: 32px; }
}

/* Chat Widget */
@media (max-width: 575px) {
    .chat-window { width: calc(100vw - 32px) !important; right: -8px; }
    .chat-toggle { width: 52px; height: 52px; }
}

/* Video */
@media (max-width: 575px) {
    .video-container { max-width: 100%; }
}

/* About Grid */
@media (max-width: 991px) {
    .about-grid { grid-template-columns: 1fr !important; gap: 40px; text-align: center; }
    .about-image { order: -1; }
    .about-highlights { justify-content: center; }
}

/* Footer */
@media (max-width: 767px) {
    .footer-links { flex-direction: column; gap: 12px; }
    .footer-content { text-align: center; }
}

/* Scroll Down */
@media (max-width: 767px) {
    .scroll-down { display: none; }
}

/* Logo */
@media (max-width: 767px) {
    .logo-img { height: 36px !important; max-width: 140px !important; }
}
@media (max-width: 575px) {
    .logo-img { height: 32px !important; max-width: 120px !important; }
}

/* ===== HERO IMAGE FIX ===== */
.hero-image {
    position: relative;
    z-index: 1;
}

.hero-img-wrapper {
    position: relative;
    width: 320px;
    height: 320px;
    z-index: 1;
}

.hero-photo {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid rgba(0, 217, 255, 0.3);
    z-index: 2;
}

.hero-tools-float {
    position: relative;
    z-index: 3;
    margin-top: 16px;
}

/* Ensure hero content stays above */
.hero-content {
    position: relative;
    z-index: 5;
}

/* Fix hero text */
.hero-text {
    position: relative;
    z-index: 5;
}

/* Mobile fixes */
@media (max-width: 991px) {
    .hero-image {
        order: -1;
        margin-bottom: 20px;
    }
    .hero-img-wrapper {
        width: 260px;
        height: 260px;
        margin: 0 auto;
    }
}

@media (max-width: 575px) {
    .hero-img-wrapper {
        width: 200px;
        height: 200px;
    }
}

/* ===== MOBILE RESPONSIVE FIXES (320px - 480px) ===== */

/* Hero Section Mobile */
@media (max-width: 480px) {
    .hero {
        padding: 120px 12px 40px !important;
        min-height: auto !important;
    }
    .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 24px !important;
        padding: 0 !important;
    }
    .hero-text {
        width: 100% !important;
        padding: 0 4px !important;
    }
    .hero-badge {
        font-size: 0.75rem !important;
        padding: 6px 12px !important;
        display: inline-block !important;
        max-width: 100% !important;
        word-wrap: break-word !important;
    }
    .hero-title {
        font-size: 1.8rem !important;
        line-height: 1.1 !important;
        margin-bottom: 12px !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }
    .hero-subtitle {
        font-size: 0.9rem !important;
        margin-bottom: 10px !important;
    }
    .hero-desc {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
        margin-bottom: 20px !important;
        padding: 0 2px !important;
    }
    .hero-buttons {
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        gap: 12px !important;
    }
    .btn {
        width: 100% !important;
        max-width: 320px !important;
        padding: 12px 20px !important;
        font-size: 0.85rem !important;
        text-align: center !important;
        justify-content: center !important;
    }
    .cta-micro {
        font-size: 0.7rem !important;
        text-align: center !important;
        padding: 0 8px !important;
    }
    .hero-stats {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
        width: 100% !important;
    }
    .stat {
        padding: 8px !important;
    }
    .stat-number {
        font-size: 1.5rem !important;
    }
    .stat-label {
        font-size: 0.7rem !important;
    }
    .hero-image {
        order: -1 !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
    .hero-img-wrapper {
        width: 180px !important;
        height: 180px !important;
    }
    .hero-photo {
        width: 180px !important;
        height: 180px !important;
    }
    .hero-tools-float {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 6px !important;
    }
    .tool-tag {
        font-size: 0.7rem !important;
        padding: 4px 8px !important;
    }
}

/* Trust Ticker Mobile */
@media (max-width: 480px) {
    .trust-ticker {
        padding: 6px 0 !important;
    }
    .ticker-item {
        font-size: 0.6rem !important;
        gap: 4px !important;
    }
    .ticker-content {
        gap: 30px !important;
    }
}

/* Navbar Mobile */
@media (max-width: 480px) {
    .navbar {
        padding: 10px 12px !important;
    }
    .logo-img {
        height: 28px !important;
    }
    .hamburger {
        display: flex !important;
    }
    .nav-links {
        display: none !important;
    }
    .nav-links.open {
        display: flex !important;
        flex-direction: column !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        background: rgba(10, 10, 26, 0.98) !important;
        padding: 16px !important;
    }
    .nav-cta {
        display: none !important;
    }
}

/* Section Mobile */
@media (max-width: 480px) {
    .section {
        padding: 40px 12px !important;
    }
    .section-header {
        margin-bottom: 24px !important;
    }
    .section-tag {
        font-size: 0.7rem !important;
        padding: 4px 10px !important;
    }
    .section-title {
        font-size: 1.5rem !important;
        margin-bottom: 10px !important;
    }
    .section-desc {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
    }
}

/* Services Grid Mobile */
@media (max-width: 480px) {
    .services-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .service-card {
        padding: 16px !important;
    }
    .service-card h3 {
        font-size: 0.9rem !important;
    }
    .service-card p {
        font-size: 0.8rem !important;
    }
}

/* Pricing Mobile */
@media (max-width: 480px) {
    .pricing-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .pricing-card {
        padding: 20px 16px !important;
    }
    .pricing-card.popular {
        transform: none !important;
    }
}

/* Results Mobile */
@media (max-width: 480px) {
    .results-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }
    .result-card {
        padding: 16px 12px !important;
    }
    .result-number {
        font-size: 1.8rem !important;
    }
}

/* Testimonials Mobile */
@media (max-width: 480px) {
    .testimonials-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .testimonial-card {
        padding: 16px !important;
    }
}

/* Portfolio Mobile */
@media (max-width: 480px) {
    .portfolio-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .portfolio-card {
        padding: 12px !important;
    }
}

/* Skills Mobile */
@media (max-width: 480px) {
    .skills-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .skill-card {
        padding: 16px !important;
    }
}

/* Process Mobile */
@media (max-width: 480px) {
    .process-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .process-card {
        padding: 16px !important;
    }
}

/* Problem Cards Mobile */
@media (max-width: 480px) {
    .problem-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .problem-card {
        padding: 16px !important;
    }
}

/* Qualifier Mobile */
@media (max-width: 480px) {
    .qualifier-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
}

/* Cost Section Mobile */
@media (max-width: 480px) {
    .cost-section {
        flex-direction: column !important;
        text-align: center !important;
        padding: 20px 16px !important;
        gap: 16px !important;
    }
    .cost-amount {
        font-size: 2.5rem !important;
    }
}

/* Contact Mobile */
@media (max-width: 480px) {
    .contact-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    .contact-form input,
    .contact-form textarea,
    .contact-form select {
        font-size: 16px !important; /* Prevents zoom on iOS */
    }
}

/* Chat Widget Mobile */
@media (max-width: 480px) {
    .chat-window {
        width: calc(100vw - 24px) !important;
        right: -4px !important;
        bottom: 70px !important;
        height: 60vh !important;
    }
    .chat-toggle {
        width: 48px !important;
        height: 48px !important;
        bottom: 16px !important;
        right: 16px !important;
    }
}

/* Footer Mobile */
@media (max-width: 480px) {
    .footer {
        padding: 24px 12px 16px !important;
    }
    .footer-links {
        flex-direction: column !important;
        gap: 8px !important;
    }
}

/* Container Mobile */
@media (max-width: 480px) {
    .container {
        padding: 0 12px !important;
        max-width: 100% !important;
    }
}

/* Video Mobile */
@media (max-width: 480px) {
    .video-container {
        max-width: 100% !important;
    }
}

/* Scroll Down Mobile */
@media (max-width: 480px) {
    .scroll-down {
        display: none !important;
    }
}


/* ===== GUARANTEE SECTION ===== */
.guarantee-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 40px;
}

.guarantee-card {
    background: var(--bg-card);
    border: 1px solid rgba(0, 217, 255, 0.1);
    border-radius: 16px;
    padding: 32px 24px;
    text-align: center;
    transition: all 0.3s ease;
}

.guarantee-card:hover {
    border-color: var(--primary);
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 217, 255, 0.15);
}

.guarantee-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(0, 217, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 24px;
    color: var(--primary);
}

.guarantee-card h3 {
    font-size: 1.1rem;
    margin-bottom: 12px;
    color: var(--text-primary);
}

.guarantee-card p {
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.6;
}

/* ===== PRICING AMOUNTS ===== */
.pricing-amount {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary);
    margin: 12px 0;
    font-family: var(--font-heading);
}

/* ===== CLIENT NAMES ===== */
.client-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.client-name::before {
    content: '\f005';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.8rem;
}

/* ===== RESPONSIVE: GUARANTEE ===== */
@media (max-width: 1199px) {
    .guarantee-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .guarantee-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .guarantee-card {
        padding: 24px 20px;
    }
    .pricing-amount {
        font-size: 1.2rem;
    }
}


/* ===== HERO TEXT MOBILE FIX ===== */
@media (max-width: 575px) {
    .hero-title {
        font-size: 1.6rem !important;
        line-height: 1.15 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        hyphens: auto !important;
    }
    .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
    }
    .hero-desc {
        font-size: 0.8rem !important;
        line-height: 1.5 !important;
    }
    .hero-badge {
        font-size: 0.7rem !important;
        padding: 5px 10px !important;
    }
}

@media (max-width: 375px) {
    .hero-title {
        font-size: 1.4rem !important;
    }
}


/* ===== PROCESS TIMELINE ===== */
.process-timeline {
    display: inline-block;
    background: rgba(0, 217, 255, 0.1);
    color: var(--primary);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 8px;
    letter-spacing: 0.5px;
}

/* ===== PLAY BUTTON OVERLAY ===== */
.play-button-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: rgba(0, 217, 255, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease;
    box-shadow: 0 8px 32px rgba(0, 217, 255, 0.4);
}
.play-button-overlay:hover {
    transform: translate(-50%, -50%) scale(1.1);
}
.play-button-overlay::after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 28px;
    border-color: transparent transparent transparent #0A0A1A;
    margin-left: 5px;
}

/* ===== STANDARDIZED CTA BUTTONS ===== */
.btn-primary,
.btn-gradient,
.hero-buttons .btn:first-child {
    background: linear-gradient(135deg, #00D9FF, #0088FF) !important;
    color: #0A0A1A !important;
    font-weight: 700 !important;
    border: none !important;
    padding: 14px 32px !important;
    border-radius: 50px !important;
    font-size: 0.95rem !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 20px rgba(0, 217, 255, 0.3) !important;
}

.btn-primary:hover,
.btn-gradient:hover,
.hero-buttons .btn:first-child:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(0, 217, 255, 0.5) !important;
}

.btn-outline,
.btn-ghost,
.hero-buttons .btn:nth-child(2) {
    background: transparent !important;
    color: #00D9FF !important;
    border: 2px solid rgba(0, 217, 255, 0.4) !important;
    padding: 14px 32px !important;
    border-radius: 50px !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.btn-outline:hover,
.btn-ghost:hover,
.hero-buttons .btn:nth-child(2):hover {
    background: rgba(0, 217, 255, 0.1) !important;
    border-color: #00D9FF !important;
    transform: translateY(-2px) !important;
}

/* ===== NORMALIZED SECTION SPACING ===== */
.section,
.section-dark,
.section-alt {
    padding: 80px 0 !important;
}

.section-header {
    margin-bottom: 40px !important;
    text-align: center !important;
}

#qualifier,
#problems,
#guarantee,
#results,
#testimonials,
#skills,
#process,
#contact {
    padding: 80px 0 !important;
}

/* ===== FIX MOST POPULAR BADGE ===== */
.pricing-card.popular {
    position: relative !important;
    border: 2px solid var(--primary) !important;
    transform: scale(1.05) !important;
}

.pricing-card.popular .popular-badge,
.pricing-card.popular::before {
    position: absolute !important;
    top: -12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(135deg, #00D9FF, #0088FF) !important;
    color: #0A0A1A !important;
    padding: 4px 16px !important;
    border-radius: 20px !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    z-index: 10 !important;
    white-space: nowrap !important;
}

/* ===== ABOUT HIGHLIGHTS BULLETS ===== */
.about-highlights {
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

.about-highlights li {
    padding: 8px 0 !important;
    color: var(--text-secondary) !important;
    font-size: 1rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.about-highlights li i {
    color: var(--primary) !important;
    font-size: 0.9rem !important;
    flex-shrink: 0 !important;
}

.about-highlights li strong {
    color: var(--text-primary) !important;
}

/* ===== MOBILE LEFT-OVERFLOW FIX ===== */
@media (max-width: 480px) {
    * {
        box-sizing: border-box !important;
    }
    
    body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    
    .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    
    .hero {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    
    .section,
    .section-dark,
    .section-alt {
        padding-left: 16px !important;
        padding-right: 16px !important;
        overflow-x: hidden !important;
    }
    
    .hero-title {
        font-size: 1.6rem !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
    }
    
    .section-title {
        font-size: 1.4rem !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
    }
    
    .section-tag {
        font-size: 0.7rem !important;
        max-width: 100% !important;
    }
    
    .trust-ticker {
        padding: 6px 16px !important;
    }
    
    .ticker-item {
        font-size: 0.65rem !important;
        white-space: nowrap !important;
    }
    
    .problem-card h3 {
        font-size: 0.9rem !important;
        word-wrap: break-word !important;
    }
    
    .problem-card p {
        font-size: 0.8rem !important;
        word-wrap: break-word !important;
    }
    
    .qualifier-card li {
        font-size: 0.85rem !important;
        word-wrap: break-word !important;
        padding-left: 0 !important;
    }
    
    .qualifier-card {
        padding: 16px !important;
    }
    
    h1, h2, h3, h4 {
        overflow-wrap: break-word !important;
        word-wrap: break-word !important;
        max-width: 100% !important;
    }
    
    p {
        overflow-wrap: break-word !important;
        word-wrap: break-word !important;
        max-width: 100% !important;
    }
    
    .navbar {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    
    .nav-container {
        padding: 0 16px !important;
    }
}

/* Prevent horizontal scroll globally */
html {
    overflow-x: hidden !important;
}

body {
    overflow-x: hidden !important;
}

html, body { overflow-x: hidden !important; max-width: 100vw !important; width: 100% !important; }
* { box-sizing: border-box !important; }
.hero { overflow: hidden !important; padding-left: 16px !important; padding-right: 16px !important; }
.hero-bg-shapes { overflow: hidden !important; }
.shape { display: none !important; }
.hero-buttons { flex-direction: column !important; align-items: stretch !important; }
.btn { width: 100% !important; justify-content: center !important; }

@media (max-width: 480px) {
    .chat-toggle {
        bottom: 80px !important;
        right: 12px !important;
        width: 48px !important;
        height: 48px !important;
    }
    .hero-buttons .btn {
        white-space: normal !important;
        word-wrap: break-word !important;
        text-align: center !important;
    }
    .hero-subtitle {
        font-size: 0.85rem !important;
        white-space: normal !important;
        word-wrap: break-word !important;
    }
}

@media (max-width: 480px) {
    .hero-subtitle {
        font-size: 0.85rem !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    .hero-desc {
        font-size: 0.82rem !important;
        line-height: 1.5 !important;
        max-width: 100% !important;
    }
    .chat-toggle {
        bottom: 90px !important;
        right: 12px !important;
        z-index: 999 !important;
    }
    .chat-window {
        bottom: 140px !important;
    }
}

@media (max-width: 480px) {
    .trust-ticker {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }
    .trust-ticker::-webkit-scrollbar { display: none !important; }
    .ticker-content {
        animation: none !important;
        gap: 16px !important;
        padding: 0 12px !important;
    }
    .ticker-item {
        font-size: 0.6rem !important;
        letter-spacing: 0.5px !important;
        flex-shrink: 0 !important;
    }
    .chat-toggle {
        bottom: 90px !important;
        right: 12px !important;
        width: 44px !important;
        height: 44px !important;
        opacity: 0.7 !important;
    }
    .chat-toggle:hover {
        opacity: 1 !important;
    }
}