:root{
      --bg:#f3f6fb;
      --surface:#ffffff;
      --surface-2:#f8fbff;
      --text:#142033;
      --muted:#6b7280;
      --border:#dbe4f0;

      --nav:#123765;
      --nav-2:#19457d;

      --hero-1:#1f56a0;
      --hero-2:#2a68b9;
      --hero-3:#3978cb;

      --gold:#d4af37;
      --gold-2:#b9921e;

      --blue-btn:#2563eb;
      --blue-btn-2:#1d4ed8;

      --shadow:0 10px 30px rgba(15,23,42,.08);
      --shadow-soft:0 6px 18px rgba(15,23,42,.05);
      --radius:22px;
    }

    body.dark-mode{
      --bg:#0d1422;
      --surface:#111b2d;
      --surface-2:#162235;
      --text:#eef4ff;
      --muted:#aab6cc;
      --border:#26354c;

      --nav:#08172f;
      --nav-2:#10284d;

      --hero-1:#12315d;
      --hero-2:#1c447c;
      --hero-3:#29589a;

      --blue-btn:#3b82f6;
      --blue-btn-2:#2563eb;

      --shadow:0 14px 34px rgba(0,0,0,.25);
      --shadow-soft:0 8px 20px rgba(0,0,0,.15);
    }

    html{ scroll-behavior:smooth; }

    body{
      background:var(--bg);
      color:var(--text);
      font-family:"Tahoma","Segoe UI",system-ui,sans-serif;
      line-height:1.8;
      transition:background .25s ease,color .25s ease;
      overflow-x:hidden;
    }

    a{
      text-decoration:none;
      transition:.25s ease;
    }

    img{
      max-width:100%;
      display:block;
    }

    .page-section{
      margin-top:1.5rem;
    }

    .container-xxl.custom-wide{
      max-width:1450px;
    }

    /* NAVBAR */
    .main-navbar{
      background:linear-gradient(90deg,var(--nav),var(--nav-2));
      box-shadow:0 8px 20px rgba(0,0,0,.10);
      position:sticky;
      top:0;
      z-index:1050;
    }

    .main-navbar .container-xxl{
      min-height:84px;
    }
    

    .navbar-brand{
      color:#fff !important;
      font-weight:800;
      font-size:1.08rem;
      display:flex;
      align-items:center;
      gap:.75rem;
      white-space:nowrap;
    }

    .brand-logo{
      width:46px;
      height:46px;
      border-radius:50%;
      object-fit:cover;
      background:#fff;
      border:2px solid rgba(255,255,255,.82);
      flex-shrink:0;
    }

    .navbar-toggler{
      border:1px solid rgba(255,255,255,.18);
      border-radius:14px;
      padding:.45rem .7rem;
    }

    .navbar-toggler:focus{
      box-shadow:none;
      border-color:rgba(255,255,255,.35);
    }

    .navbar-toggler-icon{
      filter:brightness(0) invert(1);
    }

    .navbar-nav .nav-link{
      color:rgba(255,255,255,.96) !important;
      font-weight:700;
      font-size:.96rem;
      padding:.8rem 1rem !important;
      border-radius:14px;
      white-space:nowrap;
    }

    .navbar-nav .nav-link:hover{
      background:rgba(255,255,255,.10);
    }

    .navbar-nav .nav-link.active{
      background:rgba(255,255,255,.16);
    }

    .nav-tools{
      display:flex;
      align-items:center;
      gap:.65rem;
      flex-wrap:nowrap;
    }

    .search-box{
      display:flex;
      align-items:center;
      gap:.45rem;
      background:rgba(255,255,255,.09);
      border:1px solid rgba(255,255,255,.08);
      border-radius:16px;
      padding:.35rem;
      min-width:430px;
    }

    .search-box .form-control{
      min-height:42px;
      border:none;
      box-shadow:none;
      border-radius:12px;
      background:#fff;
      color:#111827;
      font-size:.94rem;
    }

    .search-box .form-control::placeholder{
      color:#8b93a1;
    }

    .btn-gold{
      min-height:42px;
      background:var(--gold);
      color:#111;
      border:none;
      border-radius:12px;
      font-weight:800;
      padding:.65rem 1rem;
      white-space:nowrap;
    }

    .btn-gold:hover{
      background:var(--gold-2);
      color:#111;
    }

    .btn-nav{
      min-height:42px;
      padding:.65rem .95rem;
      border-radius:12px;
      background:rgba(255,255,255,.08);
      border:1px solid rgba(255,255,255,.16);
      color:#fff;
      font-weight:800;
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      white-space:nowrap;
    }

    .btn-nav:hover{
      background:rgba(255,255,255,.15);
      color:#fff;
    }
    


    /* HERO */
  
  
  
  
    /* end of hero her */
    
    

    /* ANNOUNCEMENT */
    .announce-bar{
      background:var(--surface);
      border:1px solid var(--border);
      border-radius:22px;
      box-shadow:var(--shadow-soft);
      padding:1rem 1.25rem;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:.7rem;
      text-align:center;
    }

    .badge-gold{
      background:var(--gold);
      color:#111;
      border-radius:999px;
      padding:.38rem .75rem;
      font-weight:800;
      font-size:.82rem;
      flex-shrink:0;
    }

    /* CARDS */
    .site-card{
      background:var(--surface);
      border:1px solid var(--border);
      border-radius:22px;
      box-shadow:var(--shadow);
      overflow:hidden;
      height:100%;
    }

    .site-card-header{
      background:linear-gradient(90deg,var(--nav),var(--nav-2));
      color:#fff;
      font-weight:800;
      font-size:1.02rem;
      padding:1rem 1.25rem;
    }

    .site-card-body{
      padding:1.25rem;
    }

    .soft-box{
      background:var(--surface-2);
      border:1px solid var(--border);
      border-radius:18px;
      padding:1rem 1.05rem;
    }

    .info-link{
      color:#0d6efd;
      font-weight:700;
    }

    .info-link:hover{
      color:#084298;
    }

    .muted{
      color:var(--muted);
    }

    .image-frame{
      background:var(--surface-2);
      border:1px solid var(--border);
      border-radius:18px;
      padding:.9rem;
    }

    .image-frame img{
      width:100%;
      border-radius:16px;
      object-fit:cover;
    }

    .btn-outline-blue{
      border:1px solid var(--blue-btn);
      background:transparent;
      color:var(--blue-btn);
      border-radius:12px;
      font-weight:700;
      padding:.68rem 1rem;
    }

    .btn-outline-blue:hover{
      background:var(--blue-btn-2);
      border-color:var(--blue-btn-2);
      color:#fff;
    }

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

    .list-clean li{
      padding:.85rem 0;
      border-bottom:1px solid var(--border);
    }

    .list-clean li:last-child{
      border-bottom:none;
    }

    /* MONTHS */
    .months-grid{
      display:grid;
      grid-template-columns:repeat(6,1fr);
      gap:.9rem;
    }

    .month-btn{
      min-height:54px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:var(--surface-2);
      border:1px solid var(--border);
      border-radius:14px;
      color:var(--text);
      font-weight:700;
      box-shadow:var(--shadow-soft);
    }

    .month-btn:hover{
      background:var(--nav);
      color:#fff;
      border-color:var(--nav);
    }

    /* FOOTER */
 
 .uni-footer{
  margin-top: 3rem;
  background:
    radial-gradient(circle at 12% 20%, rgba(255,255,255,.08), transparent 18%),
    linear-gradient(135deg, var(--nav), var(--nav-2));
  color: #fff;
  padding: 2.6rem 0;
  position: relative;
  overflow: hidden;
  border-top: 4px solid rgba(212,175,55,.85);
}

.uni-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(255,255,255,.02), transparent);
  pointer-events:none;
}

.uni-footer-container{
  max-width: 1600px;
  padding-left: 32px;
  padding-right: 32px;
  position: relative;
  z-index: 1;
}

.uni-footer-brand,
.uni-footer-center,
.uni-footer-dev{
  height: 100%;
}

.uni-footer-logo{
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

.uni-footer-title{
  color:#fff;
  font-weight:900;
  font-size:1.5rem;
}

.uni-footer-subtitle{
  color:rgba(255,255,255,.72);
  font-size:.95rem;
}

.uni-footer-meta{
  color:rgba(255,255,255,.78);
  font-size:.98rem;
}

.uni-footer-map-link{
  display:inline-flex;
  align-items:center;
  color:#fff;
  font-weight:800;
  text-decoration:none;
  margin-top:.35rem;
}

.uni-footer-map-link:hover{
  color:var(--gold);
}

.uni-footer-center{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:.8rem;
  text-align:center;
  padding: 1rem 1.2rem;
  border-inline: 1px solid rgba(255,255,255,.12);
}

.uni-footer-center-line{
  color:#fff;
  font-weight:700;
  font-size:1.02rem;
}

.uni-footer-note{
  color:rgba(255,255,255,.72);
  max-width: 360px;
  line-height: 1.8;
}

.uni-footer-dev{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.uni-footer-dev-label{
  color:rgba(255,255,255,.68);
  font-size:.92rem;
  margin-bottom:.7rem;
}

.uni-footer-dev-link{
  display:inline-flex;
  align-items:center;
  gap:.75rem;
  padding:.7rem 1rem;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  text-decoration:none;
  transition:.25s ease;
}

.uni-footer-dev-link:hover{
  background:rgba(255,255,255,.15);
  transform:translateY(-2px);
}

.uni-dev-name{
  color:var(--gold);
  font-weight:800;
}

.uni-dev-orb{
  width:18px;
  height:18px;
  border-radius:50%;
  display:inline-block;
  background:
    radial-gradient(circle at 30% 30%, #ffffff, #8fd3ff 28%, #3498db 55%, #0d3b66 78%, #041b2d 100%);
  box-shadow:
    0 0 0 4px rgba(255,255,255,.07),
    0 0 20px rgba(143,211,255,.5);
  animation: uniOrbPulse 2.3s ease-in-out infinite;
}

@keyframes uniOrbPulse{
  0%{
    transform:scale(1);
    box-shadow:
      0 0 0 4px rgba(255,255,255,.07),
      0 0 12px rgba(143,211,255,.35);
  }
  50%{
    transform:scale(1.14);
    box-shadow:
      0 0 0 6px rgba(255,255,255,.09),
      0 0 24px rgba(143,211,255,.6);
  }
  100%{
    transform:scale(1);
    box-shadow:
      0 0 0 4px rgba(255,255,255,.07),
      0 0 12px rgba(143,211,255,.35);
  }
}

@media (max-width: 991.98px){
  .uni-footer{
    padding: 2.1rem 0;
  }

  .uni-footer-container{
    padding-left: 18px;
    padding-right: 18px;
  }

  .uni-footer-center{
    border-inline: none;
    border-top: 1px solid rgba(255,255,255,.12);
    border-bottom: 1px solid rgba(255,255,255,.12);
    padding: 1.4rem 0;
  }

  .uni-footer-dev{
    align-items:center;
  }
}

@media (max-width: 575.98px){
  .uni-footer-container{
    padding-left: 14px;
    padding-right: 14px;
  }

  .uni-footer-title{
    font-size:1.15rem;
  }

  .uni-footer-logo{
    width:58px;
    height:58px;
  }

  .uni-footer-dev-link{
    width:100%;
    justify-content:center;
  }
}
 
 
 
 
 /*end FOOTER */

@media (max-width: 991.98px){
  .footer{
    text-align:center;
  }

  .footer-info-box{
    margin:auto;
  }
}

    /* RESPONSIVE */
    @media (max-width: 1400px){
      .search-box{ min-width:360px; }
    }

    @media (max-width: 1199.98px){
      .hero-title{
        font-size:2.7rem;
      }

      .months-grid{
        grid-template-columns:repeat(4,1fr);
      }
    }

    @media (max-width: 991.98px){
      .main-navbar .container-xxl{
        min-height:auto;
        padding-top:.8rem;
        padding-bottom:.8rem;
      }

      .navbar-collapse{
        margin-top:1rem;
        background:rgba(255,255,255,.06);
        border:1px solid rgba(255,255,255,.08);
        border-radius:20px;
        padding:1rem;
      }

      .navbar-nav{
        margin-bottom:1rem;
      }

      .nav-tools{
        width:100%;
        flex-wrap:wrap;
      }

      .search-box{
        min-width:100%;
      }

      .hero-inner{
        text-align:center;
        padding:2.1rem 0 2.2rem;
      }

      .hero-desc{
        margin-inline:auto;
      }

      .hero-actions{
        justify-content:center;
      }

      .hero-logo-box{
        margin-bottom:1rem;
      }

      .months-grid{
        grid-template-columns:repeat(3,1fr);
      }
    }

    @media (max-width: 767.98px){
      .hero{
        border-radius:24px;
      }

      .announce-bar{
        flex-direction:column;
      }

      .hero-title{
        font-size:2rem;
      }

      .site-card-header{
        font-size:.98rem;
      }

      .months-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media (max-width: 575.98px){
      .navbar-brand{
        font-size:.95rem;
      }

      .brand-logo{
        width:40px;
        height:40px;
      }

      .search-box{
        flex-direction:column;
        align-items:stretch;
      }

      .hero-actions a{
        width:100%;
      }

      .hero-inner{
        padding:1.7rem 0 1.8rem;
      }

      .site-card-body{
        padding:1rem;
      }
    }