:root{
  --inst-blue-1: #0b1c39;   /* navbar */
  --inst-blue-2: #242e47;   /* header/footer */
  --inst-gold:   #fbc900;   /* acento */

  --radius: 14px;
  --shadow-sm: 0 8px 22px rgba(11, 28, 57, .18);
  --shadow-xs: 0 6px 16px rgba(11, 28, 57, .14);
}

/* Base */
body{
  background: #ffffff;
  color: #0f172a;
}

/* ===== TOPBAR ===== */
.topbar{
  background: var(--inst-blue-2);
  color: #fff;
}
.topbar-link{
  color: rgba(255,255,255,.95);
  text-decoration: none;
  font-size: .95rem;
  transition: color .15s ease;
}
.topbar-link:hover{ color: var(--inst-gold); }
.topbar-sep{ color: rgba(255,255,255,.35); margin: 0 .5rem; }

/* ===== BANDA INSTITUCIONAL ===== */
.noticebar{
  background: var(--inst-blue-1);
  border-bottom: 6px solid var(--inst-gold);
}
.noticebar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1rem;
  padding: .65rem 0;
}
.noticebar-text{
  color:#fff;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.4rem;
}
.notice-badge{
  background: var(--inst-gold) !important;
  color:#111827 !important;
  font-weight: 800;
  border-radius: 999px;
}
.noticebar-action{ flex: 0 0 auto; }

/* ===== BOTONES ===== */
.btn-brand{
  background: var(--inst-gold) !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  color: #111827 !important;
  font-weight: 800 !important;
  border-radius: 999px !important;
}
.btn-brand:hover{
  filter: brightness(.98);
  transform: translateY(-1px);
  box-shadow: var(--shadow-xs);
}

.btn-brand-soft{
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  color: #fff !important;
  font-weight: 800 !important;
  border-radius: 999px !important;
}
.btn-brand-soft:hover{
  border-color: var(--inst-gold) !important;
  color: var(--inst-gold) !important;
}

/* ==========================
   NAVBAR institucional (COMPACTA)
   ========================== */
.navbar-brandbar{
  background: var(--inst-blue-1);
  border-bottom: 8px solid var(--inst-gold); /* más fino */
  padding-top: .35rem;
  padding-bottom: .35rem;
}

.navbar-brandbar .navbar-toggler{
  border: 1px solid rgba(255,255,255,.25);
  box-shadow: none !important;
  padding: .25rem .45rem;
}
.navbar-brandbar .navbar-toggler:focus{
  box-shadow: none !important;
}
.navbar-brandbar .navbar-toggler-icon{
  filter: invert(1);
}

/* Marca */
.brand-mark{
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,.10);
  color:#fff;
}
.brand-mark i{ font-size: 1.05rem; }

.brand-text{
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1;
  font-size: 1rem;
}

/* Links */
.nav-link-brand{
  color: rgba(255,255,255,.95) !important;
  font-weight: 650;
  padding: .45rem .65rem !important;
  font-size: .92rem;
  border-radius: 999px;
  transition: all .15s ease;
}
.nav-link-brand:hover{
  background: rgba(255,255,255,.10);
  color: #fff !important;
}
.nav-link-brand.active{
  background: rgba(251,201,0,.18);
  border: 1px solid rgba(251,201,0,.30);
}

/* Dropdown elegante */
.dropdown-menu-brand{
  background: var(--inst-blue-1) !important;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  padding: .4rem;
  box-shadow: var(--shadow-sm);
  margin-top: .6rem;
}
.dropdown-menu-brand .dropdown-item{
  color: rgba(255,255,255,.92) !important;
  border-radius: 10px;
  padding: .5rem .65rem;
  font-size: .92rem;
  transition: all .15s ease;
}
.dropdown-menu-brand .dropdown-item:hover{
  background: rgba(2, 15, 55, .85) !important;
  color: var(--inst-gold) !important;
  border-bottom: 1px solid var(--inst-gold);
}

/* Botón Clave Única */
.navbar-brandbar .btn-brand-soft{
  padding: .42rem .7rem !important;
  font-size: .88rem !important;
}

/* En pantallas grandes, menos separación */
@media (min-width: 992px){
  .navbar-brandbar .navbar-nav{ gap: .15rem; }
}

/* MAIN */
main{ min-height: 55vh; }

/* Cards */
.card{ border-radius: 16px !important; }
.shadow-soft{ box-shadow: var(--shadow-xs); }

/* Footer */
.footer-brand{
  background: var(--inst-blue-2);
  color: rgba(255,255,255,.92);
  border-top: 7px solid var(--inst-gold);
}
.footer-link{
  color: rgba(255,255,255,.88);
  text-decoration: none;
  transition: color .15s ease;
}
.footer-link:hover{ color: var(--inst-gold); }
.footer-divider{ border-color: rgba(255,255,255,.12); }

/* Errores */
.error{
  margin: 0 !important;
  padding: 0 !important;
  color: #ef4444 !important;
  font-size: 12px !important;
}

/* Carousel (tu estilo) */
#main .carousel-inner img{
  max-height: 70vh;
  object-fit: cover;
  filter: grayscale(0%);
}

/* Fade carousel (tu bloque) */
.carousel-fade .carousel-item {
  opacity: 0;
  transition-duration: .6s;
  transition-property: opacity;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
  opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
  opacity: 0;
}
.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
  transform: translate3d(0, 0, 0);
}