
:root{
  --brand:#0b6cff;
  --accent2:#6C63FF;
  --bg:#071021;
  --card:#0b1220;
  --muted:#99a1b3;
  --text:#e6eef8;
  --soft:#081027;
  --radius:14px;
  --max-width:1200px;
  --accent-glow:0 12px 40px rgba(11,108,255,0.12);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background:var(--bg); color:var(--text);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  transition:background .35s,color .35s; scroll-behavior:smooth;
}
.container{width:calc(100% - 48px);max-width:var(--max-width);margin:0 auto;padding:0 24px}
.muted{color:var(--muted)}
#scroll-progress{position:fixed;left:0;top:0;height:3px;background:linear-gradient(90deg,var(--brand),var(--accent2));width:0;z-index:9999;border-radius:0 4px 4px 0;transition:width .12s linear}
.header{position:sticky;top:0;z-index:999;background:linear-gradient(to bottom,rgba(11,17,34,0.8),rgba(11,17,34,0.6));backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,0.03);transition:all .25s ease}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand{display:flex;gap:.5rem;align-items:center}
.site-logo{height:70px;width:auto;transition:transform .25s ease,filter .25s ease;filter:drop-shadow(0 6px 16px rgba(11,108,255,0.15))}
.header.shrink{padding:4px 0;box-shadow:0 8px 30px rgba(0,0,0,0.28)}
.header.shrink .site-logo{height:56px}
.nav-list{display:flex;gap:18px;list-style:none;padding:0;margin:0;align-items:center}
.nav-link{color:var(--muted);text-decoration:none;font-weight:600;padding:8px 6px;border-radius:8px;position:relative}
.nav-link:hover{color:var(--text)}
.nav-link::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:3px;background:linear-gradient(90deg,var(--brand),var(--accent2));transition:width .35s}
.nav-link:hover::after{width:100%}
.actions{display:flex;align-items:center;gap:10px}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.06);padding:8px 10px;border-radius:8px;cursor:pointer}
.mobile-only{display:none}
.hero{min-height:64vh;display:flex;align-items:center;position:relative;padding:56px 0 28px;overflow:hidden}
.parallax-bg{position:absolute;inset:0;background:linear-gradient(180deg, rgba(7,16,33,0.9) 0%, rgba(7,16,33,0.7) 40%, rgba(7,16,33,0.6) 70%, rgba(7,16,33,0.95) 100%), radial-gradient(circle at 50% 35%, rgba(11,108,255,0.25), rgba(108,99,255,0.1) 60%, transparent 80%), url('../images/hero.jpg') center / cover no-repeat;filter:brightness(0.9) saturate(1.1);transform:translateZ(0);will-change:transform;z-index:0;transition: transform 0.3s ease-out}
.hero-inner{display:flex;align-items:center;gap:28px;justify-content:space-between;position:relative;z-index:2}
.hero-copy{max-width:640px;color:#fff}
@keyframes heroFadeUp{0%{opacity:0;transform:translateY(40px)}100%{opacity:1;transform:translateY(0)}}
.hero-title,.hero-lead,.hero-ctas{opacity:0;animation:heroFadeUp .9s ease forwards}
.hero-title{font-family:"Montserrat","Inter",sans-serif;font-size:2.1rem;line-height:1.04;margin-bottom:10px;font-weight:800;letter-spacing:-0.3px;animation-delay:.1s}
.hero-lead{color:rgba(255,255,255,0.92);font-size:1.02rem;margin-bottom:14px;animation-delay:.35s}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;animation-delay:.6s}
.btn{display:inline-block;padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:700}
.btn-primary{background:linear-gradient(135deg,var(--brand),var(--accent2));color:#fff;box-shadow:var(--accent-glow);transition:transform .25s,box-shadow .25s}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(11,108,255,0.18)}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.08)}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));backdrop-filter: blur(6px);color:#fff;padding:12px;border-radius:12px;box-shadow:0 10px 30px rgba(2,6,23,0.12)}
.card-lg{padding:16px 18px;font-weight:700}
.card-sm{padding:8px 10px;font-size:.95rem}
.section{padding:60px 0}
.bg-soft{background:linear-gradient(180deg,var(--soft),transparent)}
.section-title{text-align:center;font-size:1.45rem;margin-bottom:6px;font-weight:700}
.section-lead{text-align:center;color:var(--muted);margin-bottom:22px;max-width:820px;margin-left:auto;margin-right:auto}
.grid{display:grid;gap:16px}
.services-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:12px}
.service-card{padding:20px;background:var(--card);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.28);transition:transform .35s,box-shadow .35s}
.service-card h3{margin-bottom:8px}
.service-card:hover{transform:translateY(-8px);box-shadow:0 18px 40px rgba(2,6,23,0.09)}
.pricing-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));align-items:start;margin-top:18px}
.pricing-card{padding:20px;background:var(--card);border-radius:12px;position:relative;overflow:visible;box-shadow:0 10px 30px rgba(0,0,0,0.28)}
.pricing-card .pricing-head{display:flex;align-items:center;justify-content:space-between}
.price{font-size:1.4rem;color:var(--brand);font-weight:800}
.price-sub{font-size:.95rem;color:var(--muted);display:block}
.pricing-card.popular{border:2px solid var(--brand);transform:translateY(-6px);box-shadow:0 18px 45px rgba(11,108,255,0.11)}
.pricing-card .features{list-style:none;padding-left:0;text-align:left;margin:12px 0}
.pricing-card .features li{margin:8px 0;color:var(--muted)}
.ribbon{position:absolute;top:-12px;left:-12px;background:var(--accent2);color:#fff;padding:8px 12px;border-radius:12px;font-weight:700;font-size:.9rem}
.ribbon-sale{position:absolute;top:-12px;right:-12px;background:linear-gradient(90deg,var(--brand),var(--accent2));color:#fff;padding:8px 12px;border-radius:12px;font-weight:700;font-size:.9rem}
.old-price{opacity:.6;text-decoration:line-through;margin-right:6px}
.pricing-card .more-link{display:inline-block;margin-top:8px;color:var(--muted);font-weight:600}
.pricing-card .more-link:hover{color:var(--brand)}
.trusted-by{margin-top:16px;text-align:center}
.trusted-by .logos{display:flex;gap:16px;justify-content:center;margin-top:10px;flex-wrap:wrap}
.trusted-by img{background:rgba(255,255,255,0.05);border-radius:10px;width:120px;height:40px;object-fit:contain;opacity:0.6;filter:none}
.about-grid{display:flex;gap:14px;justify-content:center;margin-top:16px;flex-wrap:wrap}
.stat{background:var(--card);padding:16px;border-radius:12px;min-width:140px;box-shadow:0 8px 30px rgba(0,0,0,0.28)}
.stat-val{font-weight:800;font-size:1.15rem}
.stat-label{color:var(--muted);margin-top:6px;font-size:.95rem}
.contact-grid{display:grid;grid-template-columns:1fr 320px;gap:16px;margin-top:12px}
.contact-card{padding:16px;border-radius:12px;background:var(--card);box-shadow:0 10px 30px rgba(0,0,0,0.28)}
.contact-info{padding:16px;border-radius:12px;background:var(--card);box-shadow:0 10px 30px rgba(0,0,0,0.28)}
.form-actions{display:flex;gap:10px;align-items:center;margin-top:10px}
input,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:var(--text);resize:vertical}
textarea{min-height:140px}
.toast{position:fixed;right:20px;bottom:24px;background:var(--card);padding:12px 16px;border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,0.28);display:none;z-index:9999}
.footer{padding:18px 0;background:transparent;color:var(--muted);border-top:1px solid rgba(255,255,255,0.06)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:12px}
a{color:inherit;text-decoration:none;position:relative;transition:color .35s ease}
a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;background:linear-gradient(90deg,var(--brand),var(--accent2));transition:width .35s;border-radius:3px}
a:hover{color:var(--brand)} a:hover::after{width:100%}
.mobile-nav{background:rgba(7,16,33,0.98);position:absolute;top:100%;left:0;width:100%;padding:16px 0;border-top:1px solid rgba(255,255,255,0.05);display:none;z-index:999}
.mobile-nav ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;align-items:center}
.mobile-nav li{width:100%;text-align:center}
.mobile-nav li a{display:block;padding:8px 0;color:var(--text);font-weight:600;text-decoration:none}
.mobile-nav li a:hover{color:var(--brand)}
.features.features-check{list-style:none;padding-left:0}
.features.features-check li{position:relative;padding-left:26px;margin:10px 0;color:var(--text)}
.features.features-check li::before{content:"✓";position:absolute;left:0;top:0.1rem;font-weight:800;color:var(--brand);}
.section + .section{border-top:1px solid rgba(255,255,255,0.05)}
.breadcrumbs{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:.95rem;margin-top:8px}
.breadcrumbs a{color:var(--muted)}
.breadcrumbs a:hover{color:var(--brand)}
.breadcrumbs .sep{opacity:.4}
@media (max-width:980px){
  .nav{display:none}
  .mobile-only{display:inline-flex}
  .hero-inner{flex-direction:column;align-items:flex-start;gap:18px}
  .hero-aside{display:none}
  .contact-grid{grid-template-columns:1fr}
  .trusted-by img{height:36px;width:110px}
}
@media (max-width:640px){
  .hero-title{font-size:1.5rem}
  .hero-lead{font-size:.98rem}
  .container{padding:0 18px}
  .pricing-grid{grid-template-columns:1fr}
}


/* Brand/logo tweaks */
.brand::after { display: none !important; } /* no underline effect on logo link */
.site-logo { height: 60px; width: auto; transition: transform .3s ease, filter .3s ease; filter: drop-shadow(0 4px 12px rgba(11,108,255,0.12)); }
.site-logo:hover { transform: scale(1.04); filter: drop-shadow(0 8px 24px rgba(11,108,255,0.16)); }

/* Align hero copy with header/logo visually */
.hero-inner { align-items: flex-start; }
.hero-copy { margin-top: 6px; }

/* Keep nav underline as-is, but prevent it on brand link explicitly */
.brand, .brand a { text-decoration: none; }
