.banner { display: flex; align-items: center; justify-content: center; gap: 120px; padding: 80px 60px; background: #ffffff; }
.banner-left p { width: 600px; margin-bottom: 20px; line-height: 1.6; }
.banner-left h1 { font-size: 48px; color: #1e4fa3; margin-bottom: 20px; }
.btn { display: inline-block; background: #1e4fa3; color: #fff; padding: 10px 20px; border-radius: 6px; }

.section { text-align: center; padding: 60px 20px; }
.section h2 { margin-bottom: 20px; font-size: 28px; color: #1e4fa3; }
.section p { max-width: 800px; margin: 0 auto; line-height: 1.8; color: #555; }

.features { display: grid; grid-template-columns: repeat(3, 380px); justify-content: center; gap: 30px; padding: 40px 20px; }
.card { background: #f8faff; padding: 30px; text-align: center; border-radius: 10px; transition: transform 0.3s; }
.card:hover { transform: translateY(-5px); }
.card img { width: 60px; margin-bottom: 15px; }

@media (max-width: 1200px) { .features { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .banner { flex-direction: column; text-align: center; } .features { grid-template-columns: 1fr; } }