
*{box-sizing:border-box}:root{--bg:#0b0f14;--card:#121822;--muted:#1a2230;--text:#e6eef7;--sub:#a9b7c7;--accent:#7C4DFF;--accent2:#00E5FF;--radius:18px;--shadow:0 10px 30px rgba(0,0,0,.35)}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;line-height:1.6}
.container{max-width:1200px;margin:0 auto;padding:24px} .nav{position:sticky;top:0;background:rgba(11,15,20,.85);backdrop-filter:blur(8px);border-bottom:1px solid #1f2734;z-index:50}
.nav .container{display:flex;align-items:center;gap:20px} .nav a{text-decoration:none;padding:10px 12px;border-radius:12px;font-weight:600} .nav a:hover{background:var(--muted)}
.brand{display:flex;align-items:center;gap:12px} .brand img{width:48px;height:48px}
.slider-wrap{background:#0e131b;border-bottom:1px solid #1f2734} .slider{position:relative;max-width:1200px;margin:0 auto;height:180px;overflow:hidden;border-radius:14px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease} .slide.active{opacity:1} .slide img{width:100%;height:180px;object-fit:cover;border:1px solid #1f2734;border-radius:14px;display:block}
.dots{text-align:center;margin:8px 0 0} .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#324155;margin:0 4px} .dot.active{background:var(--accent2)}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center;padding:36px 0} .card{background:var(--card);border:1px solid #1e2633;border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent2));color:#000;font-weight:700;font-size:12px}
.btn{display:inline-block;padding:12px 18px;border-radius:14px;background:linear-gradient(90deg,var(--accent),var(--accent2));color:#000;font-weight:700;text-decoration:none;border:none;cursor:pointer}
.btn.secondary{background:#1f2836;color:var(--text);border:1px solid #2a3547}
.section-title{text-align:center;margin:8px 0 6px;font-size:32px} .section-sub{text-align:center;color:var(--sub);margin:0 0 24px}
.products{padding:24px 0} .grid{display:grid;gap:18px} .grid-8{grid-template-columns:repeat(8,1fr)} .grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1200px){.grid-8{grid-template-columns:repeat(6,1fr)}} @media(max-width:992px){.grid-8{grid-template-columns:repeat(4,1fr)}.hero{grid-template-columns:1fr}}
@media(max-width:640px){.grid-8{grid-template-columns:repeat(2,1fr)}.grid-4{grid-template-columns:repeat(1,1fr)}}
.product-card{background:var(--card);border:1px solid #1f2734;border-radius:16px;padding:14px;display:flex;flex-direction:column}
.product-card img{border-radius:12px;border:1px solid #202a3a;width:100%;height:140px;object-fit:cover;margin-bottom:10px}
.product-card h3{margin:4px 0 4px;font-size:16px;line-height:1.3} .product-card p{margin:0;color:var(--sub);font-size:13px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px} .kpis .item{background:var(--muted);border-radius:14px;padding:12px;text-align:center}
.footer{margin-top:40px;padding:32px 0;border-top:1px solid #1e2633;color:var(--sub)} .small{font-size:14px;color:var(--sub)}
form label{display:block;margin-top:10px} form input,form textarea{width:100%;padding:10px;border-radius:10px;border:1px solid #2a3547;background:#0e141f;color:#e6eef7}
