/* === Insighttech — Production Build (Blue palette, responsive) === */
:root{
  --bg:#0b0f1a; --bg-soft:#0f1524; --card:#11192b; --text:#e6edf7; --muted:#9fb0c9;
  --brand-start:#0ea5e9; --brand-end:#2563eb; --ring:rgba(37,99,235,.35);
  --step-1: clamp(1.75rem, 1.2rem + 2.2vw, 3rem);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;position:relative}
body::before{content:'';position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);width:400px;height:400px;background-image:url('./insighttech_logo.png');background-size:contain;background-repeat:no-repeat;background-position:center;opacity:0.08;z-index:-1;pointer-events:none}
body::after{content:'';position:fixed;top:20%;right:10%;width:200px;height:200px;background-image:url('./insighttech_logo.png');background-size:contain;background-repeat:no-repeat;background-position:center;opacity:0.06;z-index:-1;pointer-events:none}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* Light Theme */
body.light{--bg:#f6f7fb;--bg-soft:#ffffff;--card:#ffffff;--text:#0e1320;--muted:#5b6b85;--ring:rgba(14,165,233,.2)}
body.light::before{opacity:0.02}
body.light::after{opacity:0.015}
body.light .navbar{background:rgba(255,255,255,.98);border-bottom:2px solid rgba(14,165,233,.3);box-shadow:0 4px 20px rgba(0,0,0,.1)}
body.light .nav-links a{color:var(--muted)}
body.light .chip{border:1px solid rgba(0,0,0,.12);color:var(--muted)}
body.light .btn{border:1px solid rgba(0,0,0,.12)}
body.light .card{border:1px solid rgba(0,0,0,.08)}
body.light .input, body.light textarea, body.light select{background:#ffffff;border:1px solid rgba(0,0,0,.12);color:var(--text)}
body.light .input:focus, body.light textarea:focus, body.light select:focus{border-color:var(--brand-start)}
body.light .social-links a{background:linear-gradient(135deg, rgba(14,165,233,.15), rgba(37,99,235,.08));border:2px solid rgba(14,165,233,.3);color:var(--brand-start);box-shadow:0 4px 15px rgba(14,165,233,.15)}
body.light .social-links a:hover{background:linear-gradient(135deg, rgba(14,165,233,.25), rgba(37,99,235,.15));border-color:rgba(14,165,233,.5);color:#ffffff;box-shadow:0 8px 25px rgba(14,165,233,.3)}
body.light .address-info h5{color:var(--text)}
body.light .address-info p{color:var(--muted)}
body.light .contact-intro p{color:var(--muted)}
body.light .case{border:1px solid rgba(0,0,0,.08);background:linear-gradient(135deg, rgba(0,0,0,.02), rgba(0,0,0,.01))}
body.light .tag{border:1px solid rgba(0,0,0,.12);color:var(--brand-start)}
body.light .kicker{color:var(--brand-start)}
body.light .badge{background:rgba(14,165,233,.1);border:1px solid rgba(14,165,233,.2);color:var(--brand-start)}
body.light .hero-card{background:linear-gradient(180deg, rgba(14,165,233,.08), rgba(37,99,235,.04));border:1px solid rgba(0,0,0,.08)}
body.light .about-card{background:var(--card);border:1px solid rgba(0,0,0,.08)}
body.light .about-card:hover{border-color:rgba(14,165,233,.2)}

/* Light Theme Footer Social Links */
body.light .brand-text{background:linear-gradient(135deg,#0ea5e9,#2563eb,#00d4ff);-webkit-background-clip:text;background-clip:text;color:transparent}
body.light .brand-text:hover{background:linear-gradient(135deg,#00d4ff,#0ea5e9,#2563eb);-webkit-background-clip:text;background-clip:text}

/* Navbar */
.navbar{position:fixed;top:0;left:0;right:0;z-index:9999;background:rgba(11,15,26,.98);backdrop-filter:blur(16px);border-bottom:2px solid rgba(14,165,233,.3);box-shadow:0 4px 20px rgba(0,0,0,.3);min-height:60px}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:0;height:60px}
.brand{display:flex;align-items:center;gap:15px;font-weight:900;padding:0}
.brand-text{font-size:1.8rem;letter-spacing:.5px;background:linear-gradient(135deg,var(--brand-start),var(--brand-end),#00d4ff);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:900;margin:0;transition:.3s}
.brand-text:hover{transform:scale(1.05);background:linear-gradient(135deg,#00d4ff,var(--brand-start),var(--brand-end));-webkit-background-clip:text;background-clip:text}
.nav-links{display:flex;gap:26px;list-style:none}
.nav-links a{color:var(--muted);font-weight:700;font-size:1.1rem}
.nav-actions{display:flex;gap:10px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-weight:700;color:var(--muted);background:transparent;cursor:pointer;font-size:1rem}
.btn{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);font-weight:800;background:transparent;cursor:pointer;font-size:1rem}
.btn-primary{background:linear-gradient(90deg,var(--brand-start),var(--brand-end));color:#fff}
.btn-ghost{background:transparent;color:var(--text)}
.btn:hover{transform:translateY(-1px);transition:.2s}

/* Mobile drawer + overlay */
.mobile-only{ display:none; }
.nav-overlay{ position: fixed; inset: 0; background: rgba(0,0,0,.45); backdrop-filter: blur(2px); z-index: 9998; }
body.nav-open .nav-overlay{ display:block }

/* Hero */
.hero{padding:80px 0 80px;background:var(--bg);text-align:center}
.hero-content{max-width:800px;margin:0 auto}
.hero h1{font-size:3rem;line-height:1.2;font-weight:900;margin-bottom:20px;color:var(--text)}
.hero p{font-size:1.2rem;color:var(--muted);margin-bottom:30px;line-height:1.6}
.hero-cta{margin-top:30px}
.hero-logo{display:flex;justify-content:center;margin-top:20px}
.hero-logo img{width:480px;height:480px;border-radius:20px;transition:.3s}
.hero-logo img:hover{transform:scale(1.1)}

/* Sections */
.section{padding:84px 0}
.section-header{text-align:center;margin-bottom:50px}
.section-header h2{font-size:2.5rem;font-weight:900;margin-bottom:15px;color:var(--text)}
.section-header p{font-size:1.1rem;color:var(--muted);max-width:600px;margin:0 auto;line-height:1.6}
.section-header .view-all{color:var(--brand-start);font-weight:700;text-decoration:none;margin-left:20px}

/* Product Cards */
.products-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:30px;margin-top:40px}
.product-card{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px;text-align:center;transition:.3s;position:relative;overflow:hidden}
.product-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(0,0,0,.2);border-color:rgba(14,165,233,.3)}
.product-icon{width:80px;height:80px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(14,165,233,.2), rgba(37,99,235,.1));margin:0 auto 20px;font-size:2rem;color:var(--brand-start)}
.product-card h3{font-size:1.3rem;font-weight:800;margin-bottom:15px;color:var(--text)}
.product-card p{color:var(--muted);line-height:1.6;font-size:.95rem}

/* Service Cards */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:30px;margin-top:40px}
.service-card{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px;transition:.3s}
.service-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(0,0,0,.2)}
.service-icon{width:60px;height:60px;border-radius:15px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(14,165,233,.2), rgba(37,99,235,.1));margin-bottom:20px;font-size:1.5rem;color:var(--brand-start)}
.service-card h3{font-size:1.2rem;font-weight:800;margin-bottom:15px;color:var(--text)}
.service-card p{color:var(--muted);line-height:1.6;margin-bottom:20px}
.service-link{color:var(--brand-start);font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.service-link:hover{color:var(--brand-end)}

/* Blog Cards */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:30px;margin-top:40px}
.blog-card{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px;transition:.3s}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(0,0,0,.2)}
.blog-category{display:inline-block;background:rgba(14,165,233,.15);color:var(--brand-start);padding:6px 12px;border-radius:20px;font-size:.8rem;font-weight:700;margin-bottom:15px}
.blog-card h3{font-size:1.2rem;font-weight:800;margin-bottom:15px;color:var(--text);line-height:1.4}
.blog-card p{color:var(--muted);line-height:1.6;margin-bottom:20px;font-size:.95rem}
/* About Section */
.about-content{max-width:900px;margin:0 auto}
.about-intro{text-align:center;margin-bottom:50px}
.about-intro p{font-size:1.2rem;color:var(--muted);line-height:1.6;max-width:700px;margin:0 auto}
.about-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:30px;margin-top:40px}
.about-card{background:var(--card);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:30px;text-align:center;transition:.3s;position:relative;overflow:hidden}
.about-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(0,0,0,.2);border-color:rgba(14,165,233,.3)}
.about-icon{width:80px;height:80px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(14,165,233,.2), rgba(37,99,235,.1));margin:0 auto 20px;font-size:2rem;color:var(--brand-start)}
.about-card h3{font-size:1.3rem;font-weight:800;margin-bottom:15px;color:var(--text)}
.about-card p{color:var(--muted);line-height:1.6;font-size:.95rem}

/* Showcase / case studies */
.showcase{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.case{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
.case img{width:100%;height:220px;object-fit:cover;display:block;filter:saturate(1.05)}
.case-image{width:100%;height:220px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.ai-image{background:linear-gradient(135deg, rgba(14,165,233,.2), rgba(37,99,235,.1))}
.network-image{background:linear-gradient(135deg, rgba(37,99,235,.2), rgba(14,165,233,.1))}
.case-image i{font-size:4rem;color:rgba(255,255,255,.3);z-index:1}
.case .txt{padding:18px}
.tag{display:inline-block;font-size:.75rem;padding:6px 10px;border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#bfe6ff;margin-bottom:10px}

/* CTA band */
.cta-band{margin:84px 0;border-radius:22px;overflow:hidden;background:
  radial-gradient(1000px 400px at -10% 50%, rgba(14,165,233,.18), transparent),
  radial-gradient(1000px 400px at 120% 20%, rgba(37,99,235,.22), transparent),
  #0e1423;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;padding:28px 32px;gap:22px}
.cta-band h4{font-size:1.6rem}
.cta-band p{color:var(--muted)}

/* Contact / Footer */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.form{background:var(--card);padding:24px;border-radius:18px;border:1px solid rgba(255,255,255,.08)}
.input, textarea, select{width:100%;padding:12px 14px;border-radius:12px;background:#0b1120;color:var(--text);border:1px solid rgba(255,255,255,.12);outline:none}
.input:focus, textarea:focus, select:focus{box-shadow:0 0 0 3px var(--ring);border-color:transparent}
label{font-size:.9rem;color:var(--muted);margin-bottom:6px;display:block}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .group{margin-bottom:14px}
.success{margin-top:12px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.35);padding:12px 14px;border-radius:12px}

/* Social Links */
.social-links{display:flex;gap:15px;margin:15px 0}
.social-links a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:15px;background:linear-gradient(135deg, rgba(14,165,233,.2), rgba(37,99,235,.1));border:2px solid rgba(14,165,233,.4);color:var(--brand-start);transition:.3s;text-decoration:none;box-shadow:0 4px 15px rgba(14,165,233,.2)}
.social-links a:hover{background:linear-gradient(135deg, rgba(14,165,233,.3), rgba(37,99,235,.2));border-color:rgba(14,165,233,.6);color:#ffffff;transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px rgba(14,165,233,.4)}

footer{padding:60px 0 30px;color:var(--muted);border-top:1px solid rgba(255,255,255,.06);margin-top:84px;background:var(--bg-soft)}
.footer-content{display:grid;grid-template-columns:1fr 2fr;gap:60px;margin-bottom:40px}
.footer-section{text-align:center}
.footer-section h3{font-size:1.8rem;font-weight:900;margin-bottom:20px;color:var(--text)}

/* Footer Logo */
.footer-logo{margin-top:20px}
.footer-logo img{width:180px;height:180px;border-radius:15px;transition:.3s}
.footer-logo img:hover{transform:translateY(-2px)}
.footer-info{display:grid;grid-template-columns:1fr 2fr;gap:40px}
.company-info h4{font-size:1.3rem;font-weight:900;margin-bottom:15px;color:var(--text)}
.company-info p{margin-bottom:8px;color:var(--muted)}
.footer-links{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:30px}
.link-group h5{font-size:1rem;font-weight:800;margin-bottom:15px;color:var(--text)}
.link-group ul{list-style:none;padding:0}
.link-group li{margin-bottom:8px}
.link-group a{color:var(--muted);text-decoration:none;transition:.2s}
.link-group a:hover{color:var(--brand-start)}

/* Footer Social Links */
.footer-social-links{display:flex;gap:12px;margin-top:20px}
.footer-social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg, rgba(14,165,233,.15), rgba(37,99,235,.08));border:1px solid rgba(14,165,233,.3);color:var(--brand-start);transition:.3s;text-decoration:none;box-shadow:0 2px 8px rgba(14,165,233,.1)}
.footer-social-link:hover{background:linear-gradient(135deg, rgba(14,165,233,.25), rgba(37,99,235,.15));border-color:rgba(14,165,233,.5);color:#ffffff;transform:translateY(-2px);box-shadow:0 4px 15px rgba(14,165,233,.2)}
.footer-social-link i{font-size:1.1rem;font-weight:600}

.footer-bottom{text-align:center;padding-top:30px;border-top:1px solid rgba(255,255,255,.06)}
.footer-bottom p{color:var(--muted);font-size:.9rem}

/* Responsive */
@media (max-width: 980px){
  .mobile-only{ display:inline-flex; }
  .nav-inner{ gap:10px; }
  :root{ --nav-h: 64px; }
  .nav-links{
    position: fixed; top: calc(var(--nav-h) + env(safe-area-inset-top)); right:0; bottom:0;
    width: min(86vw, 380px);
    background: rgba(11,15,26,.96);
    backdrop-filter: blur(10px);
    border-left: 1px solid rgba(255,255,255,.08);
    padding: 20px; flex-direction: column; gap: 18px;
    transform: translateX(100%); transition: transform .25s ease; z-index: 10000;
    max-height: calc(100dvh - var(--nav-h) - env(safe-area-inset-top)); overflow-y:auto;
  }
  body.light .nav-links{ background: rgba(255,255,255,.96); }
  body.nav-open .nav-links{ transform: translateX(0); }
  body.nav-open{ overflow:hidden; touch-action:none; }
  .hero h1{ font-size: 2.2rem; }
  .hero p{ font-size: 1.1rem; }
  .section-header h2{ font-size: 2rem; }
  .products-grid{ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
  .services-grid{ grid-template-columns: 1fr; }
  .blog-grid{ grid-template-columns: 1fr; }
  .about-grid{ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
  .footer-content{ grid-template-columns: 1fr; gap: 40px; text-align: center; }
  .footer-info{ grid-template-columns: 1fr; gap: 30px; }
  .footer-social-links{ justify-content: center; }
  body::before{ width: 300px; height: 300px; }
  body::after{ width: 150px; height: 150px; }
}


@media (max-width:768px){
  .brand-text{font-size:1.5rem}
  .brand h1{font-size:1.2rem}
  .brand{gap:10px}
  .nav-links a{font-size:1rem}
  .hero{padding-top:70px}
  .hero-logo img{width:400px;height:400px}
@media (max-width: 520px){
  .brand-text{font-size:1.3rem}
  .brand h1{ font-size:.95rem }
  .chip{ padding:8px 10px }
  .btn{ padding:10px 14px }
  .hero p{ font-size: 1rem }
  .hero h1{ font-size: 1.8rem; }
  .hero p{ font-size: 1rem; }
  .section-header h2{ font-size: 1.6rem; }
  .products-grid{ grid-template-columns: 1fr; gap: 15px; }
  .product-card{ padding: 20px; }
  .service-card{ padding: 20px; }
  .blog-card{ padding: 20px; }
  .about-card{ padding: 20px; }
  .about-grid{ grid-template-columns: 1fr; gap: 15px; }
  .footer-links{ grid-template-columns: 1fr; }
  .hero-logo img{width:320px;height:320px}
  body::before{ width: 200px; height: 200px; opacity: 0.06; }
  body::after{ width: 100px; height: 100px; opacity: 0.04; }
}