*{
box-sizing:border-box;
margin:0;
padding:0;
}

body{
font-family:Arial,sans-serif;
background:#0f172a;
color:#f1f5f9;
line-height:1.6;
}

.container{
width:min(1100px,92%);
margin:auto;
}

.hero{
min-height:100vh;
display:flex;
align-items:center;
background:linear-gradient(135deg,#0f172a,#111827,#1e293b);
padding:80px 0;
}

.hero h1{
font-size:clamp(2.8rem,6vw,5rem);
line-height:1.1;
margin-bottom:24px;
}

.subtitle{
font-size:1.3rem;
max-width:760px;
color:#cbd5e1;
margin-bottom:40px;
}

.buttons{
display:flex;
gap:16px;
flex-wrap:wrap;
}

.btn{
background:#2563eb;
padding:14px 22px;
border-radius:12px;
text-decoration:none;
color:white;
font-weight:bold;
}

.secondary{
background:#1e293b;
border:1px solid #334155;
}

.section{
padding:90px 0;
}

.dark{
background:#111827;
}

.card{
background:#1e293b;
padding:34px;
border-radius:18px;
margin-bottom:22px;
border:1px solid #334155;
}

.card h2{
font-size:clamp(1.5rem,3vw,2.3rem);
}

.title{
font-size:2.2rem;
margin-bottom:50px;
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:24px;
}

.service{
background:#111827;
padding:28px;
border-radius:18px;
border:1px solid #334155;
}

.service h3{
margin-bottom:16px;
}

.list{
display:grid;
gap:16px;
}

.list div{
background:#1e293b;
padding:22px;
border-radius:14px;
border:1px solid #334155;
}

.contact{
background:#111827;
padding:34px;
border-radius:18px;
border:1px solid #334155;
}

a{
color:#60a5fa;
}

footer{
padding:40px 0;
border-top:1px solid #334155;
}

.footer{
display:flex;
gap:24px;
}