
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Poppins',sans-serif;background:#000;color:#fff}
header{position:absolute;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:25px 60px;z-index:100}
.logo{font-family:'Oswald',sans-serif;font-size:40px;font-weight:700}
.logo small{display:block;color:#ff3c00;letter-spacing:3px}
.red{color:#ff3c00}
nav a{color:#fff;text-decoration:none;margin:0 15px;font-weight:600}
nav a.active,nav a:hover{color:#ff3c00}
.call-btn,.btn-red{background:#ff3c00;color:#fff;padding:14px 28px;border-radius:6px;text-decoration:none}
.btn-dark{border:1px solid #777;color:#fff;padding:14px 28px;border-radius:6px;text-decoration:none}
.hero{height:100vh;background:linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.72)),url('../images/banner.png');background-size:cover;background-position:center;display:flex;align-items:center}
.content{padding-left:80px;max-width:800px}
.content h1{font-family:'Oswald',sans-serif;font-size:90px;line-height:1}
.content h1 span{color:#ff3c00}
.content h2{margin:20px 0;font-style:italic}
.content p{font-size:20px;line-height:1.8;margin-bottom:30px}
.buttons{display:flex;gap:20px}

.page-banner{
min-height:55vh;
background:linear-gradient(rgba(0,0,0,.78),rgba(0,0,0,.78)),url('../images/banner.png');
background-size:cover;background-position:center;
display:flex;flex-direction:column;justify-content:center;align-items:center;
text-align:center;padding:180px 20px 120px;
}
.page-banner h1{font-family:'Oswald',sans-serif;font-size:80px;color:#ff3c00;margin-bottom:20px}
.page-banner p{font-size:22px;color:#ddd;max-width:900px}

.services-grid{
background:#050505;
padding:80px 8%;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
gap:30px;
}

.card{
background:#0d0d0d;
border:1px solid rgba(255,60,0,.25);
border-radius:12px;
padding:35px;
transition:all .35s ease;
position:relative;
overflow:hidden;
}

.card::before{
content:'';
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,60,0,.08),transparent);
transition:.6s;
}

.card:hover::before{left:100%}

.card:hover{
transform:translateY(-10px);
border-color:#ff3c00;
box-shadow:0 0 20px rgba(255,60,0,.25),0 0 40px rgba(255,60,0,.15);
}

.card h3{color:#ff3c00;margin-bottom:15px}
.card:hover h3{color:#fff}
.card p{line-height:1.8;color:#ddd}

.service-icon{
width:60px;height:60px;border-radius:50%;
background:rgba(255,60,0,.12);
border:1px solid rgba(255,60,0,.4);
display:flex;align-items:center;justify-content:center;
font-size:28px;color:#ff3c00;margin-bottom:20px;
}


.about-section{background:#050505;padding:100px 8%;}
.about-container{max-width:1200px;margin:auto;}
.about-content{text-align:center;}
.about-content h2{font-size:60px;color:#ff3c00;margin-bottom:20px;}
.about-content p{max-width:850px;margin:0 auto 50px;color:#ddd;line-height:1.8;}
.about-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;}
.feature-card{
background:#0d0d0d;border:1px solid rgba(255,60,0,.25);
border-radius:15px;padding:35px 25px;
opacity:0;transform:translateY(60px);
transition:.6s ease;
}
.feature-card.show{opacity:1;transform:translateY(0);}
.feature-card:hover{
transform:translateY(-10px);
border-color:#ff3c00;
box-shadow:0 0 25px rgba(255,60,0,.35);
}
.feature-card span{font-size:42px;display:block;margin-bottom:15px;}
