body { font-family: 'Roboto', sans-serif; margin:0; padding:0; background:#f9f9f9; }
header { background:#0d47a1; color:white; padding:20px 0; text-align:center; }
header h1 { margin:0; font-size:2em; }
section { max-width:1200px; margin:40px auto; padding:0 20px; }
.intro, .modules { text-align:center; }
.intro p, .modules ul { font-size:1.1em; color:#333; }
.modules ul { list-style:none; padding:0; }
.modules ul li { margin:12px 0; font-size:1.2em; }
.modules ul li a { text-decoration:none; color:#0d47a1; font-weight:500; }
.modules ul li a:hover { text-decoration:underline; }
.cta { text-align:center; margin:50px 0; }
.cta button { background:#0d47a1; color:white; padding:15px 30px; border:none; border-radius:8px; font-size:1em; cursor:pointer; margin:10px; }
.cta button:hover { background:#094a86; }
form { max-width:600px; margin:40px auto; background:white; padding:30px; border-radius:12px; box-shadow:0 4px 15px rgba(0,0,0,0.1); }
form h3 { text-align:center; color:#0d47a1; margin-bottom:20px; }
form input, form select { width:100%; padding:12px; margin:8px 0; border-radius:6px; border:1px solid #ccc; }
form button { width:100%; background:#0d47a1; color:white; border:none; padding:12px; border-radius:6px; cursor:pointer; }
form button:hover { background:#094a86; }
.diagram { text-align:center; margin-top:30px; }
.diagram img { max-width:100%; height:auto; border-radius:12px; box-shadow:0 4px 10px rgba(0,0,0,0.1);}