
body{margin:0;font-family:Arial,sans-serif;color:#333}
.top{background:#0b1b33;color:#fff;padding:10px 20px}
nav{display:flex;justify-content:space-between;padding:15px 20px;background:#fff;border-bottom:1px solid #ddd}
nav a{text-decoration:none;color:#333;margin:0 10px}
.hero{background:#203a5f;color:white;padding:80px 20px;text-align:center}
.btn{background:#d62828;color:#fff;padding:12px 20px;text-decoration:none;border-radius:4px}
.section{padding:50px 20px;max-width:1200px;margin:auto}
.brands{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.brand,.card{border:1px solid #ddd;padding:20px;text-align:center}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
footer{background:#0b1b33;color:#fff;padding:30px}
@media(max-width:800px){.brands,.cards{grid-template-columns:1fr 1fr}}
.hero img{
    width:100%;
    max-height:650px;
    object-fit:cover;
}

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

.card{
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 4px 15px rgba(0,0,0,.08);
}

.card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.card h3{
    padding:15px;
}
.brands{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:20px;
}

.brand{
    background:#fff;
    border:1px solid #eee;
    padding:20px;
    text-align:center;
    border-radius:8px;
}

.brand img{
    max-height:60px;
    width:auto;
    max-width:100%;
    object-fit:contain;
}.btn-outline{
    background:#fff;
    color:#0b3b75;
    border:2px solid #0b3b75;
    margin-left:10px;
}