body{
font-family:'Inter',sans-serif;
margin:0;
background:#f6f8fb;
color:#333;
}

/* Sidebar */

.sidebar{
position:fixed;
left:0;
top:0;
width:260px;
height:100vh;
background:#1E3A8A;
color:white;
padding:30px;
box-sizing:border-box;
}

.sidebar h2{
font-family:'Poppins',sans-serif;
margin-bottom:30px;
font-size:22px;
}

.sidebar ul{
list-style:none;
padding:0;
margin:0;
}

.sidebar li{
margin-bottom:12px;
}

.sidebar a{
color:white;
text-decoration:none;
font-weight:500;
font-size:15px;
}

.sidebar a:hover{
text-decoration:underline;
}

/* Main content */

.content{
margin-left:300px;   /* increased to prevent overlap */
padding:50px;
max-width:900px;
box-sizing:border-box;
}

/* Headings */

h1{
font-size:36px;
margin-top:0;
font-family:'Poppins',sans-serif;
}

h2{
font-size:28px;
margin-top:60px;
font-family:'Poppins',sans-serif;
}

h3{
font-family:'Poppins',sans-serif;
}

/* Cards */

.card{
background:white;
padding:25px;
margin-top:20px;
border-radius:10px;
box-shadow:0 10px 25px rgba(0,0,0,0.05);
}

/* Code blocks */

pre{
background:#111;
color:#fff;
padding:15px;
border-radius:6px;
overflow:auto;
}

/* Footer */

footer{
margin-top:80px;
color:#777;
}

/* Mobile responsiveness */

@media (max-width:900px){

.sidebar{
position:relative;
width:100%;
height:auto;
}

.content{
margin-left:0;
padding:30px;
}

}