/* Basic responsive helpers */
img { max-width: 100%; height: auto; box-sizing: border-box; }
.container { width: 100%; margin: 0 auto; padding: 0 24px; }

/* Breakpoints using max-width (mobile-first fallback) */
@media (max-width: 1200px) {
  /* large desktops / smaller screens */
  .container { padding: 0 20px; }
}

@media (max-width: 992px) {
  /* tablets landscape */
  .grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  nav { flex-wrap: wrap; }
}

@media (max-width: 768px) {
  /* tablets / large phones */
  .grid { grid-template-columns: 1fr; }
  .sidebar { display: none; } /* collapse sidebar */
  header .logo { font-size: 1.25rem; }
}

@media (max-width: 576px) {
  /* small phones */
  body { font-size: 14px; }
  .container { padding: 0 12px; }
  .nav-toggle { display: inline-block; } /* show mobile nav toggle */
  nav ul { display: none; } /* hide full nav by default on very small screens */
}

/* ------------------------- */
/* Navbar */
/* ------------------------- */
.navbar {
    background-color: #1C2330;
    color: rgb(212, 212, 212);
    padding: 10px 20px;
}
.navbar .navbar-brand {
    font-size: 1.5rem;
    font-weight: bold;
    color: rgb(212, 212, 212);
}
.navbar .navbar-brand h1 {
    margin: 0;
}
.navbar .navbar-brand:hover {
    color: rgb(212, 212, 212);
}
.navbar .navbar-nav .nav-link {
    color: rgb(212, 212, 212);
    margin: 0;
    font-size: 20px;
}
.navbar .navbar-toggler {
    border: none;
    background-color: transparent;
    color: rgb(212, 212, 212);
}
.navbar .navbar-nav vl {
    border-left: 1px solid rgb(212, 212, 212);
    height: auto;
    margin: 0;
}
.navbar .navbar-nav a:hover{
  background-color: #212938;
}
.navbar .nav-link.active {
    background-color: #212938;
    color: rgb(212, 212, 212) !important;
}
.custom-toggler .navbar-toggler-icon { 
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(151,162,172, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
    }

/* ------------------------ */
/* Header */
/* ------------------------ */
.header {
    background: radial-gradient(circle,rgba(12, 123, 242, 1) 0%, rgba(29, 83, 138, 1) 20%, rgba(33, 41, 56, 1) 65%);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 20px 0;
}
/* ------------------------ */
/* Main Content */
/* ------------------------ */
.post-title {
    margin: 20px 0;
    font-weight: bold;
    text-decoration: underline;
}
/* ------------------------ */
/* Footer */
/* ------------------------ */
.footer {
    background-color: #292929;
    color: #fff;
    margin-top: 20px;
}
.footer p {
    margin: 0;
    padding: 0;
    text-align: center;
}


/* ------------------------ */
/* Custom Classes */
/* ------------------------ */
.temp {
    background-color: rgb(92, 8, 8);
}
.temp2 {
    background-color: rgb(201, 69, 69);
}