:root{
  /* Ajustables si querés perfilar el tono */
  --uda-primary: #1f6ea8;   /* azul principal */
  --uda-accent:  #3aa1d9;   /* celeste/acento */
  --uda-ink:     #2c3e50;   /* texto */
  --uda-muted:   #607482;   /* texto secundario */
  --uda-bg:      #f5f7fb;   /* fondo claro */
  --uda-surface: #ffffff;   /* tarjetas */
  --uda-border:  #e2e8f0;   /* bordes suaves */
  --radius: 12px;
}

/* Top strip con CTA similares a OFERTA EDUCATIVA / CAMPUS VIRTUAL */
.uda-topbar{
  background: linear-gradient(180deg, var(--uda-accent), var(--uda-primary));
  color:#fff; height:44px; display:flex; align-items:center; gap:.5rem;
  padding:0 .75rem; font-weight:700; letter-spacing:.02em;
}
.uda-topbar .burger{ all:unset; cursor:pointer; font-size:20px; }
.uda-topbar .cta{
  margin-left:auto; display:flex; gap:.5rem;
}
.uda-topbar .cta a{
  display:inline-flex; align-items:center; padding:.35rem .65rem;
  background:rgba(255,255,255,.12); color:#fff; text-decoration:none; font-weight:700;
  border:1px solid rgba(255,255,255,.3); border-radius:8px;
}
.uda-topbar .cta a:hover{ background:rgba(255,255,255,.22); }

/* Franja de marca (logo) */
.uda-brandline{
  display:flex; align-items:center; justify-content:center; gap:1rem;
  background:var(--uda-surface); border-bottom:1px solid var(--uda-border);
  padding:10px 0;
}
.uda-brandline img{ max-height:64px; height:auto; }

/* Navbar principal como el institucional */
.uda-navbar{
  background:var(--uda-surface);
  border-bottom:2px solid #ecf1f6;
  display:flex; justify-content:center; gap:1.25rem; flex-wrap:wrap;
}
.uda-navbar a{
  color:var(--uda-primary); text-decoration:none; font-weight:700;
  padding:.8rem .6rem; border-bottom:2px solid transparent;
}
.uda-navbar a:hover, .uda-navbar a.active{ border-bottom-color:var(--uda-primary); }

/* Ajustes suaves para integrarse con tu UI */
body{ background:var(--uda-bg); color:var(--uda-ink); }
.card{ border:1px solid var(--uda-border); border-radius:var(--radius); }
.btn{ background:var(--uda-primary); border-radius:var(--radius); }
.btn.ghost{ background:#fff; color:var(--uda-ink); border:1px solid var(--uda-border); }
.note{ color:var(--uda-muted); }

/* Responsive: nav colapsable */
@media (max-width: 768px){
  .uda-navbar{ display:none; }
  body.nav-open .uda-navbar{ display:flex; }
}