*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}
body{background:#f4f7fb;color:#222;line-height:1.7}
.container{width:90%;max-width:1200px;margin:auto}
header{background:#08182f;padding:18px 0}
nav{display:flex;justify-content:space-between;align-items:center}
.logo{color:#fff;font-size:22px;font-weight:bold}
nav ul{display:flex;gap:18px;list-style:none}
nav a{text-decoration:none;color:#fff;font-weight:bold}
.hero{padding:120px 20px;text-align:center;color:#fff;
background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),
url('https://images.unsplash.com/photo-1505693416388-ac5ce068fe85?q=80&w=1400&auto=format&fit=crop') center/cover}
.hero h1{font-size:52px}
.btn{background:#2563eb;color:#fff;padding:13px 24px;border-radius:6px;text-decoration:none;display:inline-block;margin-top:20px}
.section{padding:70px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{background:#fff;padding:28px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.banner{background:#1e3a8a;color:#fff;padding:70px 0;text-align:center}
footer{background:#08182f;color:#fff;text-align:center;padding:35px 0}
.full{width:100%;border-radius:12px;margin-top:25px}
.topic-link{
 color:#1d4ed8;
 font-weight:bold;
 text-decoration:none;
}
.topic-link:hover{
 text-decoration:underline;
}
.definition-box{
 background:#eef4ff;
 border-left:5px solid #2563eb;
 padding:20px;
 margin-top:20px;
 border-radius:8px;
}