body { font-family: 'Segoe UI', Arial, sans-serif; margin:0; padding:0; background:#f4f6f9; color:#333; }
header { background:#004080; color:white; display:flex; justify-content:space-between; align-items:center; padding:15px 30px; }
.logo { font-size:1.5em; font-weight:bold; }
nav ul.menu { list-style:none; margin:0; padding:0; display:flex; align-items:center; }
nav ul.menu li { position:relative; margin:0 15px; }
nav ul.menu li a { color:white; text-decoration:none; padding:8px 12px; transition:background 0.3s; }
nav ul.menu li a:hover { background:#0066cc; border-radius:4px; }
nav ul.menu li .submenu { display:none; position:absolute; background:#0066cc; list-style:none; padding:10px; margin:0; top:100%; left:0; border-radius:4px; }
nav ul.menu li:hover .submenu { display:block; }
.hero { text-align:center; padding:60px 20px; background:linear-gradient(to right,#004080,#0066cc); color:white; }
.hero h1 { font-size:2.5em; }
.hero .btn { background:white; color:#004080; padding:10px 20px; border-radius:4px; text-decoration:none; font-weight:bold; }
.features { display:flex; justify-content:space-around; flex-wrap:wrap; padding:40px 20px; }
.card { background:white; border-radius:8px; box-shadow:0 4px 8px rgba(0,0,0,0.1); padding:20px; margin:15px; flex:1 1 200px; text-align:center; }
.class-list, .subject-list, .paper-list { list-style:none; padding:0; }
.class-list li, .subject-list li, .paper-list li { background:#fff; margin:10px 0; padding:15px; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.1); }
.class-list li a, .subject-list li a { text-decoration:none; color:#004080; font-weight:bold; }
.paper-list li a { margin-left:10px; background:#004080; color:white; padding:5px 10px; border-radius:4px; }
footer { background:#004080; color:white; text-align:center; padding:15px; }