...
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Arial',sans-serif;background:#f4f4f9 url('media/f72ef05f-aae2-42ec-ac0a-bd5a247fd989_wallhaven-lykljp.jpg') no-repeat center center fixed;background-size:cover;color:#333}
header{background:#005f99;padding:1rem 2rem;position:sticky;top:0;z-index:1000}
nav ul{list-style:none;display:flex;gap:1.5rem}
nav a{color:#fff;text-decoration:none;font-weight:600}
nav a:hover{text-decoration:underline}
.hero-content{max-width:800px;margin:auto;padding:4rem 2rem;text-align:center}
.cta-button{display:inline-block;background:#ff8c00;color:#fff;padding:0.75rem 1.5rem;text-decoration:none;border-radius:4px}
.cta-button:hover{background:#e57e00}
.content-section{max-width:1200px;margin:auto;padding:2rem}
.course-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}
.course-card{background:#fff;border-radius:6px;padding:1.5rem;box-shadow:0 2px 4px rgba(0,0,0,.1)}
.course-link{display:inline-block;margin-top:1rem;color:#005f99}
.course-link:hover{text-decoration:underline}
form{display:flex;flex-direction:column;gap:0.75rem}
label{font-weight:600}
input,textarea{padding:0.75rem;border:1px solid #ccc;border-radius:4px}
button{background:#005f99;color:#fff;padding:0.75rem;border:none;border-radius:4px;font-weight:600}
button:hover{background:#004773}
#form-status{margin-top:0.75rem}
footer{text-align:center;padding:1rem;background:#004773;color:#fff}
@media (max-width:600px){
nav ul{flex-direction:column;align-items:flex-start} 
.hero-content{padding:2rem 1rem}
}