@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap');

:root{--red:#e30a17;--dark:#07090d;--panel:#10141b;--text:#f5f7fa;--muted:#aeb6c2;--line:#252c36}
*{box-sizing:border-box;scroll-behavior:smooth}
body{margin:0;background:#080a0e;color:var(--text);font-family:Inter,Arial,sans-serif}
.container{width:min(1120px,92%);margin:auto}
.flag-strip{height:5px;background:linear-gradient(90deg,var(--red) 0 100%)}
header{position:sticky;top:0;z-index:10;background:rgba(7,9,13,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.logo{color:white;text-decoration:none;font-weight:900;font-size:22px;letter-spacing:-1px}
.logo span,footer span{color:var(--red)}
nav{display:flex;gap:22px;flex-wrap:wrap}
nav a{color:#dce1e8;text-decoration:none;font-size:13px;font-weight:700}
nav a:hover{color:#fff}
.hero{min-height:650px;display:flex;align-items:center;position:relative;overflow:hidden;background:
radial-gradient(circle at 80% 30%,rgba(227,10,23,.22),transparent 28%),
linear-gradient(120deg,#090b10,#111722 55%,#16090c)}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:40px 40px;opacity:.7}
.hero-content{position:relative;z-index:2;padding:80px 0;max-width:850px}
.badge,.section-title span{color:#ff5a63;font-weight:800;font-size:12px;letter-spacing:2px}
h1{font-size:clamp(48px,8vw,88px);line-height:.98;margin:18px 0 25px;letter-spacing:-4px}
h1 span{color:var(--red)}
.hero p{max-width:680px;color:#c5ccd5;font-size:18px;line-height:1.7}
.buttons{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.btn{padding:14px 20px;border-radius:8px;text-decoration:none;font-weight:800;font-size:14px}
.primary{background:var(--red);color:white}
.secondary{border:1px solid #46505e;color:white}
.section{padding:95px 0}
.section.dark{background:#0d1117;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-title{margin-bottom:38px}
.section-title h2{font-size:42px;margin:10px 0}
.section-title p{color:var(--muted);max-width:650px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card,.tech-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;transition:.25s}
.card:hover,.tech-card:hover{transform:translateY(-5px);border-color:#5a1a20}
.icon{font-size:34px}.card h3,.tech-card h3{font-size:20px}.card p,.tech-card p{color:var(--muted);line-height:1.65}
.tech-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.tech-card b{display:inline-flex;width:48px;height:48px;border-radius:12px;align-items:center;justify-content:center;background:rgba(227,10,23,.12);color:#ff6a72;font-size:18px}
.cyber-box{display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(135deg,#111720,#170b0e);border:1px solid #382229;border-radius:20px;padding:50px}
.cyber-box h2{font-size:38px;margin:10px 0}.cyber-box p{color:var(--muted);line-height:1.7;max-width:700px}
.shield{font-size:80px}
.about{background:#0a0c10}.about-text{color:#b9c1cb;line-height:1.9;max-width:800px}
footer{border-top:1px solid var(--line);padding:35px 0;background:#06080b}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer strong{font-size:18px}footer small{display:block;color:#7f8895;margin-top:5px}
footer p{color:#707985;font-size:12px}
.flag-mini{width:50px;height:32px;background:var(--red);border-radius:4px;position:relative}
.flag-mini:before{content:"";position:absolute;width:13px;height:13px;background:#fff;border-radius:50%;left:12px;top:9px}
.flag-mini:after{content:"";position:absolute;width:10px;height:10px;background:var(--red);border-radius:50%;left:16px;top:10.5px}
@media(max-width:800px){
nav{display:none}.cards,.tech-grid{grid-template-columns:1fr}.hero{min-height:560px}
h1{letter-spacing:-2px}.cyber-box{padding:32px;flex-direction:column;align-items:flex-start}.shield{display:none}
}
