body { font-family: Arial, sans-serif; margin:0; padding:0; background:#f9f9f9; }
header { display:flex; align-items:center; justify-content:space-between; padding:10px 20px; background:#0056b3; color:white; }
header img { width:50px; height:50px; border-radius:50%; }
nav a { margin:0 10px; text-decoration:none; color:white; font-weight:bold; }
nav a:hover { color:#ffeb3b; }
.banner { position:relative; text-align:center; color:white; }
.banner img { width:100%; height:300px; object-fit:cover; }
.banner-text { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;
               background:rgba(0,0,0,0.5); padding:20px 40px; border-radius:8px; }
.banner-text h1 { font-size:36px; margin:0; color:#fff; }
.banner-text p { font-size:18px; margin:5px 0 0; color:#ddd; }
.section { padding:40px 20px; }
.section-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; background:#007BFF; padding:10px; border-radius:4px; }
.section-header h2 { font-size:24px; margin:0; color:white; }
.section-header a { font-size:14px; color:#ffeb3b; text-decoration:none; }
.cards { display:grid; gap:20px; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); }
.card { border-radius:8px; padding:15px; text-align:center; background:#eaf3ff; box-shadow:0 2px 5px rgba(0,0,0,0.1); }
.card img { max-width:100%; border-radius:4px; margin-bottom:10px; }
footer { background:#333; color:white; text-align:center; padding:20px; margin-top:20px; }