:root{
      --blue-900: #0d47a1;   
      --blue-800: #0b3a88;   
      --text: #0b0b0b;
      --bg: #ffffff;
    }

.logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 80px;
  padding: 8px 0;
  margin-top: 0;
  position: absolute; /* place logos near top of masthead */
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 5;
}

.Logo1 {
  height: 80px;
  width: auto;
}
.Logo2 {
  height: 100px;
  width: auto;
}
.Logo3 {
  height: 100px;
  width: auto;
}
.Logo4 {
  height: 70px;
  width: auto;
}
.Logo5 {
  height: 70px;
  width: auto;
}

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0; font-family:'Public Sans',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
      color:var(--text); background:var(--bg);
    }

    .topbar{
      background: #0d47a1; color:#d9e6ff; font-size:.8rem; text-align:center;
      padding:8px 12px; letter-spacing:.2px;
    }

 .masthead{
  position: relative;
  min-height: 550px;
  background: linear-gradient(180deg, var(--blue-900) 0%, var(--blue-800) 100%);
  overflow: visible;   
  padding-top: 50px;
}
    .masthead:before{
      content:""; position:absolute; inset:0;
      background: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px) 0 0/24px 24px;
      opacity:.35; pointer-events:none;
    }
    

    .spacer{height:140px} 

    .footer {
  background-color: #fff;
  padding: 2rem 0;
}
.footer .social-links {
  margin-top: 1.5rem;
  color: rgb(0 78 170);
}
.footer .social-links i {
  font-size: 18px;
  color: rgb(0 78 170);
}
footer hr {
  border: 0;
}
.enlaces-footer {
  position: relative;
}
.enlaces-footer:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  top: 2rem;
  background-color: rgb(217 217 217);
}
.footer h3 {
  color: rgb(0 78 170);
  font-weight: 800;
  font-size: 1.1rem;
}
.footer ul {
  padding: 0;
}
.footer ul li {
  font-weight: 400;
  font-size: 0.8rem;
  margin: 6px auto;
}
.enlaces-footer ul li a:hover {
  color: rgb(0 78 170);
  text-decoration: underline;
}
.footer .copy {
  font-size: 0.8rem;
  color: #5d5a57;
}
.footer .decoration-bar {
  width: 100%;
  height: 6px;
  margin-top: 6px;
  background: #004eaa;
  background: linear-gradient(
    90deg,
    rgb(0 78 170) 0%,
    rgb(0 78 170) 70%,
    rgb(149 104 198) 70%,
    rgb(149 104 198) 100%
  );
}
.footer img {
  max-height: 150px; 
  width: auto;
}

@media (max-width: 576px) {
  .logo-bar {
    padding: 25px;
  }
  .slider-img {
    width: 100%;
    height: 40vh;
  }
  .home-slider h1 {
    font-size: 32px;
    letter-spacing: 0;
  }
  .masthead{
  position: relative;
  min-height: 500px; 
  background: linear-gradient(180deg, var(--blue-900) 0%, var(--blue-800) 100%);
  overflow: visible;
  padding-top: 30px;   
  padding-bottom: 30px;
}
.logos{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;   
  gap: clamp(16px, 4vw, 60px);
  position: static; /* keep normal flow on small screens */
  transform: none;
  padding: 12px 0;
}

.logos img{
  max-width: 100%;
  height: clamp(30px, 5vw, 60px); 
  object-fit: contain;
}

}
@media (max-width: 991px) {
  .navbar-toggler {
    position: absolute;
    right: 25px;
    top: -60px;
  }
  #header-social {
    display: none;
  }
}
.header-img img{
  width: 100%;
  display: block;

}

.evento-card{
  position: relative;     
  z-index: 10;
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: 0 12px 28px rgba(0,0,0,.16);
  overflow: hidden;        
  margin: -350px auto 40px;
  max-width: 1150px;
}

.evento-card .fecha {
  background: #f0f0f0;
  padding: 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 150px; 
  
}
.evento-card .contenido{ padding:250px; }



.linea-cupo{
  background: linear-gradient(to right, #004eaa, #9b4dca);
  color:#fff;
  font-weight:600;
  padding:10px 20px;
  display:flex;
  align-items:center;
  justify-content:flex-end; 
  font-size:.9rem;
}
.linea-cupo i {
  margin-right: 8px;
}


/* ====== BLOQUE DE INFO DEL EVENTO ====== */
.info-evento{
  padding: 32px 28px 40px;      
}

.info-grid{
  display:grid;
  grid-template-columns: 160px 1fr;  
  gap: 28px;
  align-items: start;
}

/* Tarjeta de fecha */
.badge-fecha{
  background:#eaf1ff;
  border-radius:22px;
  padding:18px 12px;
  text-align:center;
  box-shadow: 0 2px 8px rgba(13,71,161,.08);
}
.badge-fecha .mes{
  font-weight:800;
  letter-spacing:.5px;
  color:#0d47a1;
  line-height:1.1;
}
.badge-fecha .dia{
  font-size:72px;
  line-height:1;
  font-weight:900;
  color:#0d47a1;
  margin:8px 0 6px;
}
.badge-fecha .hora{
  font-size:14px;
  font-weight:700;
  color:#0d47a1;
}

/* Tipos del contenido */
.info-titulo{
  font-size:32px;
  font-weight:800;
  color:#0d47a1;
  margin:0 0 6px;
}
.info-direccion a{
  color:#0d47a1;
  text-decoration:underline;
  font-weight:600;
  font-size:15px;
}
.info-descripcion{
  font-size:22px;
  line-height:1.45;
  margin:18px 0 10px;
}
.info-strong{
  font-weight:900;
}
.info-temas{
  color:#0d47a1;
  font-weight:700;
  margin:12px 0 24px;
}
.info-temas a{
  color:#0d47a1;
  text-decoration:none;
}
.info-temas a:hover{ text-decoration:underline; }

/* Boton graaaaandeeeeee morado creo */
.btn-cta{
  display:block;
  width:min(780px, 90%);
  margin:18px auto 0;
  text-align:center;
  padding:20px 28px;
  font-size:26px;
  font-weight:800;
  color:#fff;
  background: linear-gradient(90deg, #7f5bd8, #9b4dca);
  border-radius:999px;
  text-decoration:none;
  border: none;
  margin-top: 50px;
  margin-bottom: 50px;
}

/* Responsive muy responsive ewe*/
@media (max-width: 768px){
  .info-grid{ grid-template-columns: 1fr; }
  .badge-fecha{ width:160px; margin:0 auto; }
  .info-titulo{ font-size:26px; }
  .info-descripcion{ font-size:18px; }
  .btn-cta{ font-size:20px; }
}

/* --- Sección detalle --- */
.detalle-evento{ padding: 28px; }
.detalle-titulo{
  color:#0d47a1; font-weight:800; font-size:28px; margin:0 0 14px;
}
.detalle-texto{ font-size:18px; line-height:1.6; margin-bottom:24px; }

.kpis{
  display:grid; grid-template-columns: repeat(3,1fr);
  gap:24px;
}
.kpi{
  background:#eaf1ff; border-radius:22px; padding:26px 22px;
  box-shadow:0 2px 10px rgba(13,71,161,.08);
  text-align:center;
}
.kpi-num{
  font-size:110px; line-height:0.9; font-weight:900; color:#0d47a1; margin:0 0 8px;
}
.kpi-num::before{ content:none !important; }

.kpi-title{
  color:#0d47a1; font-weight:800; letter-spacing:.8px; margin-bottom:10px;
}
.kpi-text{ font-size:16px; margin:0;    color: #004eaa; }
.kpi-note{ display:block; margin-top:14px; font-size:12px; opacity:.8;  color: #004eaa;}
.kpi-list {
    text-align: left;
    margin: 0;
    padding-left: 18px;
    font-size: 0.70rem; 
    color: #004eaa;
}

.kpi-list li {
    margin: 4px 0;
}
.listem {
    text-align: left;
    font-size: 0.95rem; 
    color: #004eaa;
}

@media (max-width: 992px){ .kpis{ grid-template-columns:1fr; } }