/* --- mobile.css --- */
.hamburger-btn { display: none; position: fixed; top: 20px; left: 20px; z-index: 1001; background-color: var(--bg-white); border: 1px solid var(--border-color); border-radius: 0.5rem; width: 50px; height: 50px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.mobile-nav { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1000; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; }
.mobile-nav.open { opacity: 1; visibility: visible; }
.mobile-nav .sidebar { width: 320px; height: 100%; transform: translateX(-100%); transition: transform 0.3s ease; }
.mobile-nav.open .sidebar { transform: translateX(0); }
@media (max-width: 1200px) {
    .container-fluid { flex-direction: column; height: auto; min-height: 100vh; }
    .sidebar { display: none; }
    .hamburger-btn { display: flex; align-items: center; justify-content: center; }
    .main-content { height: auto; padding: 80px 24px 40px 24px; }
    .content-header h2 { font-size: 2rem; }
}