/* =========================================
   CARRUSEL LOGOS INSTITUCIONAL PREMIUM
========================================= */

/* Contenedor tipo tarjeta */
#carouselLogos {
    background: #ffffff;
    border-radius: 18px;
    padding: 50px 40px 80px 40px; /* espacio arriba y abajo */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
    position: relative;
}

/* Espaciado interno entre filas */
.carousel-item .row {
    align-items: center;
}

/* Logos más grandes y elegantes */
.logo-style {
    max-height: 140px;
    transition: all 0.4s ease;
    filter: grayscale(25%);
    opacity: 0.9;
    padding: 10px;
}

/* Efecto profesional hover */
.logo-style:hover {
    transform: scale(1.12);
    filter: grayscale(0%);
    opacity: 1;
}

/* =========================================
   INDICADORES MODERNOS TIPO BARRA
========================================= */

.custom-bars {
    bottom: 20px; /* separación de las imágenes */
}

.custom-bars [data-bs-target] {
    width: 50px;
    height: 5px;
    border-radius: 50px;
    background-color: rgba(0, 0, 0, 0.15);
    border: none;
    margin: 0 8px;
    transition: all 0.4s ease;
}

/* Activo */
.custom-bars .active {
    background-color: #000;
    width: 65px;
}

/* Animación suave al cambiar slide */
.carousel-fade .carousel-item {
    transition: opacity 0.8s ease-in-out;
}

/* =========================
SECCION SERVICIOS
=========================*/

.servicios-home{
padding:80px 0;
background:#f7f7f7;
}


/* =========================
TARJETAS
=========================*/

.card-servicio{

background:#ffffff;

border-radius:20px;

padding:70px 25px 30px;

text-align:center;

position:relative;

transition:all .4s ease;

box-shadow:0 10px 25px rgba(0,0,0,0.08);

height:100%;
overflow:visible;

}


/* icono circular */

.icono-servicio{

width:80px;

height:80px;

background:#1e6ad6;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

font-size:30px;

position:absolute;

top:-40px;

left:50%;

transform:translateX(-50%);

box-shadow:0 8px 15px rgba(0,0,0,0.2);

}


/* titulo */

.card-servicio h3{

margin-top:20px;

font-weight:600;

margin-bottom:15px;

}


/* texto */

.card-servicio p{

font-size:14px;

color:#555;

min-height:80px;

}


/* boton */

.btn-servicio{

display:inline-block;

margin-top:20px;

padding:10px 25px;

border-radius:30px;

background:#f1f1f1;

color:#333;

text-decoration:none;

font-weight:500;

transition:all .3s ease;

}


/* =========================
EFECTO HOVER
=========================*/

.card-servicio:hover{

background:linear-gradient(
135deg,
#2a7de1,
#4ea5ff
);

transform:translateY(-8px);

color:#fff;

}


/* texto blanco */

.card-servicio:hover h3,
.card-servicio:hover p{

color:#fff;

}


/* boton hover */

.card-servicio:hover .btn-servicio{

background:#ffffff;

color:#1e6ad6;

}


/* icono al hover */

.card-servicio:hover .icono-servicio{

background:#ffffff;

color:#1e6ad6;

}
.seccion-mujer-epica{

height:120vh;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(180deg,#f4f6ff,#ffffff);

position:relative;

}


/* marco visual */

.marco-mujer{

position:relative;

padding:30px;

border-radius:20px;

}


/* halo de luz */

.marco-mujer::before{

content:"";

position:absolute;

width:500px;

height:500px;

background:radial-gradient(circle,#7a6df0,transparent);

filter:blur(120px);

opacity:0.4;

top:50%;

left:50%;

transform:translate(-50%,-50%);

z-index:0;

}


/* imagen */

.marco-mujer img{

width:100%;

max-width:500px;

transform:scale(0.5);

opacity:0.5;

transition:all 0.15s linear;

position:relative;

z-index:2;

border-radius:15px;

box-shadow:0 30px 70px rgba(0,0,0,0.25);

}

/* SECCION TITULO */
.seccion-actualidad{

background: linear-gradient(
135deg,
#0f5fa8,
#1e88e5,
#42a5f5
);

padding:80px 0;

}



/* EFECTO DECORATIVO */

.seccion-actualidad::before{

content:"";

position:absolute;

width:400px;
height:400px;

background:rgba(255,255,255,0.08);

border-radius:50%;

top:-120px;
left:-120px;

}


/* CONTENEDOR */

.titulo-contenedor{

background:rgba(255,255,255,0.1);

backdrop-filter:blur(8px);

padding:40px;

border-radius:18px;

box-shadow:0 20px 60px rgba(0,0,0,0.25);

}


/* TITULO 3D */

.titulo-actualidad{

color:white;

font-size:42px;

font-weight:700;

text-shadow:

2px 2px 0 rgba(0,0,0,0.2),
4px 4px 10px rgba(0,0,0,0.3);

margin-bottom:20px;

}


/* LINEA DECORATIVA */

.titulo-actualidad::after{

content:"";

display:block;

width:100px;

height:4px;

background:white;

margin:15px auto 0;

border-radius:4px;

}


/* TEXTOS */

.subtitulo-actualidad{

color:#e3f2fd;

font-size:16px;

margin-bottom:8px;

}

.mensaje-actualidad{

color:white;

font-weight:600;

}

.seccion-actualidad{

background:linear-gradient(135deg,#0d47a1,#1976d2,#42a5f5);
background-size:200% 200%;

animation:fondoMovimiento 12s ease infinite;

padding:80px 0;

position:relative;
overflow:hidden;

}

@keyframes fondoMovimiento{

0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}

}

.titulo-actualidad{

animation:entradaTitulo 1.2s ease;

}

@keyframes entradaTitulo{

0%{

opacity:0;
transform:translateY(-30px);

}

100%{

opacity:1;
transform:translateY(0);

}

}
.titulo-contenedor{

animation:flotar 6s ease-in-out infinite;

}

@keyframes flotar{

0%{transform:translateY(0px);}
50%{transform:translateY(-8px);}
100%{transform:translateY(0px);}

}

/* ========================= */
/* SECCIÓN NOTICIAS */
/* ========================= */

.noticias-section{

padding:80px 0;
background:#ffffff;

}


/* TITULO */

.titulo-noticias{

text-align:center;
font-size:36px;
font-weight:700;
margin-bottom:50px;
color:#1a1a1a;

}


/* ========================= */
/* NOTICIA DESTACADA */
/* ========================= */

.noticia-destacada{

max-width:1100px;
margin:auto;
position:relative;
border-radius:16px;
overflow:hidden;
box-shadow:0 15px 35px rgba(0,0,0,0.15);

}

.noticia-destacada img{

width:100%;
height:auto;
display:block;

}

.contenido-noticia{

position:absolute;
bottom:0;
left:0;
width:100%;
padding:30px;
background:linear-gradient(to top, rgba(0,0,0,0.7), transparent);
color:white;

}

.contenido-noticia h3{

font-size:28px;
font-weight:700;
margin-bottom:10px;

}

.contenido-noticia p{

font-size:15px;
max-width:600px;

}


/* BOTON */

.btn-noticia{

display:inline-block;
margin-top:10px;
padding:10px 20px;
background:#0d6efd;
color:white;
text-decoration:none;
border-radius:6px;
transition:0.3s;

}

.btn-noticia:hover{

background:#0a58ca;

}



/* ========================= */
/* SLIDER NOTICIAS */
/* ========================= */

.slider-noticias{

margin-top:60px;
position:relative;

}

.slider-container{

display:flex;
gap:25px;
overflow-x:auto;
scroll-behavior:smooth;
padding:10px 40px;

}

.slider-container::-webkit-scrollbar{

display:none;

}


/* TARJETAS */

.card-noticia{

min-width:280px;
background:white;
border-radius:12px;
overflow:hidden;
box-shadow:0 8px 20px rgba(0,0,0,0.08);
transition:0.3s;

}

.card-noticia img{

width:100%;
height:170px;
object-fit:cover;

}

.card-noticia a{

text-decoration:none;
color:#1a1a1a;
display:block;
padding-bottom:15px;

}

.card-noticia h4{

font-size:18px;
font-weight:600;
padding:10px 15px 0;

}

.card-noticia p{

font-size:14px;
color:#555;
padding:0 15px;

}

.card-noticia:hover{

transform:scale(1.05);

}


/* BOTONES */

.slider-btn{

position:absolute;
top:40%;
background:white;
border:none;
width:45px;
height:45px;
border-radius:50%;
font-size:22px;
cursor:pointer;
box-shadow:0 5px 15px rgba(0,0,0,0.2);

}

.prev{

left:0;

}

.next{

right:0;

}

/* ========================= */
/* FONDO GENERAL DE LA PAGINA */
/* ========================= */

body{

background: linear-gradient(
180deg,
#f4f8fc 0%,
#e9f1f8 40%,
#dfeaf5 70%,
#f7fbff 100%
);

}

section{

background:transparent;

}

/* ===== ELIMINAR FONDOS AZULES ===== */

.bg-custom{
background: transparent !important;
}

section{
background: transparent !important;
}

.container{
background: transparent !important;
}

/* ===== FONDO GENERAL DE LA PAGINA ===== */

body{

background: linear-gradient(
180deg,
#f8fbff 0%,
#edf4fb 40%,
#e6f0f9 70%,
#f9fcff 100%
);

}

/* ================================= */
/* BLOQUE ACTUALIDAD DEL CONCEJO */
/* ================================= */

.seccion-actualidad{

background: linear-gradient(
135deg,
#0d6efd,
#1e88e5,
#42a5f5
) !important;

padding:90px 0;

}

.caja-actualidad{

max-width:900px;
margin:auto;

background:rgba(255,255,255,0.15);
backdrop-filter:blur(8px);

border-radius:16px;

padding:40px;

box-shadow:0 15px 35px rgba(0,0,0,0.2);

color:white;

}

/* ================================= */
/* ANIMACION BLOQUE ACTUALIDAD */
/* ================================= */

.caja-actualidad{

max-width:900px;
margin:auto;

background:rgba(255,255,255,0.15);
backdrop-filter:blur(8px);

border-radius:16px;

padding:40px;

box-shadow:0 20px 40px rgba(0,0,0,0.2);

color:white;

transform:scale(0.8);
opacity:0;

animation:aparecerActualidad 1.2s ease forwards;

}


/* animacion zoom */

@keyframes aparecerActualidad{

0%{
transform:scale(0.6);
opacity:0;
}

100%{
transform:scale(1);
opacity:1;
}

}

/* movimiento suave */

.caja-actualidad{

animation:
aparecerActualidad 1.2s ease forwards,
flotarActualidad 6s ease-in-out infinite;

}

@keyframes flotarActualidad{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-8px);
}

100%{
transform:translateY(0px);
}

}

/* ================================= */
/* FONDO ANIMADO */
/* ================================= */

.seccion-actualidad{

background: linear-gradient(
135deg,
#0d6efd,
#1e88e5,
#42a5f5
);

background-size:200% 200%;

animation:fondoAnimado 8s ease infinite;

padding:90px 0;

}

@keyframes fondoAnimado{

0%{
background-position:0% 50%;
}

50%{
background-position:100% 50%;
}

100%{
background-position:0% 50%;
}

}

/* ================================= */
/* SECCION ACTUALIDAD DEL CONCEJO PRO */
/* ================================= */

.seccion-actualidad{

position:relative;

background: linear-gradient(
135deg,
#0d6efd,
#1e88e5,
#42a5f5
);

background-size:200% 200%;

animation:fondoActualidad 10s ease infinite;

padding:120px 0;

overflow:hidden;

}


/* animacion fondo */

@keyframes fondoActualidad{

0%{
background-position:0% 50%;
}

50%{
background-position:100% 50%;
}

100%{
background-position:0% 50%;
}

}


/* ================================= */
/* LINEAS TECNOLOGICAS */
/* ================================= */

.seccion-actualidad::before{

content:"";

position:absolute;

width:200%;
height:200%;

top:-50%;
left:-50%;

background-image:

linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);

background-size:60px 60px;

animation:moverLineas 25s linear infinite;

}


@keyframes moverLineas{

0%{
transform:translate(0,0);
}

100%{
transform:translate(60px,60px);
}

}


/* ================================= */
/* TARJETA PRINCIPAL */
/* ================================= */

.caja-actualidad{

max-width:900px;

margin:auto;

background:rgba(255,255,255,0.18);

backdrop-filter:blur(12px);

border-radius:18px;

padding:50px;

box-shadow:0 25px 60px rgba(0,0,0,0.25);

color:white;

text-align:center;

position:relative;

z-index:2;

animation:
aparecerActualidad 1.2s ease forwards,
flotarActualidad 7s ease-in-out infinite;

}


/* entrada zoom */

@keyframes aparecerActualidad{

0%{
transform:scale(0.6);
opacity:0;
}

100%{
transform:scale(1);
opacity:1;
}

}


/* flotacion suave */

@keyframes flotarActualidad{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-10px);
}

100%{
transform:translateY(0px);
}

}


/* ================================= */
/* TITULO */
/* ================================= */

.caja-actualidad h1{

font-size:40px;

font-weight:700;

margin-bottom:15px;

}


/* subtitulo */

.caja-actualidad p{

font-size:18px;

opacity:0.95;

}

/* =============================== */
/* NOTICIA PRINCIPAL */
/* =============================== */

.noticia-destacada{

position:relative;

border-radius:18px;

overflow:hidden;

box-shadow:0 20px 50px rgba(0,0,0,0.25);

transition:all .4s ease;

}


/* imagen */

.noticia-destacada img{

width:100%;
height:520px;

object-fit:cover;

/* punto de enfoque de la imagen */
object-position:top center;

transition:transform 1s ease;

}


/* zoom suave */

.noticia-destacada:hover img{

transform:scale(1.05);

}


/* overlay degradado */

.noticia-destacada::after{

content:"";

position:absolute;

left:0;
right:0;
bottom:0;
top:0;

background:linear-gradient(
to top,
rgba(0,0,0,0.75),
rgba(0,0,0,0.2),
transparent
);

}


/* contenido */

.noticia-info{

position:absolute;

bottom:40px;

left:40px;

color:white;

z-index:2;

max-width:600px;

}


/* titulo */

.noticia-info h2{

font-size:30px;

font-weight:700;

margin-bottom:10px;

}


/* texto */

.noticia-info p{

font-size:16px;

opacity:0.95;

margin-bottom:15px;

}


/* boton */

.noticia-info a{

background:linear-gradient(
45deg,
#0d6efd,
#42a5f5
);

border-radius:30px;

padding:10px 22px;

color:white;

text-decoration:none;

font-weight:600;

transition:.3s;

}


.noticia-info a:hover{

transform:translateY(-2px);

box-shadow:0 10px 20px rgba(0,0,0,0.3);

}

/* =============================== */
/* SECCION NOTICIAS */
/* =============================== */

.seccion-noticias{

padding:80px 0;

background:linear-gradient(
180deg,
#f7fbff,
#eef5fb
);

}

/* SECCION NOTICIAS */

.seccion-noticias{

padding:100px 0;

}


/* titulo */

.titulo-noticias{

font-size:34px;
font-weight:700;

color:#0d47a1;

margin-bottom:50px;

}


/* GRID */

.grid-noticias{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

gap:40px;

}


/* TARJETA */

.noticia-card{

background:white;

border-radius:14px;

overflow:hidden;

box-shadow:0 12px 25px rgba(0,0,0,0.15);

transition:0.35s;

}


/* hover */

.noticia-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 45px rgba(0,0,0,0.25);

}


/* imagen */

.noticia-card img{

width:100%;
height:220px;

object-fit:cover;

/* cambia el punto de recorte */
object-position: top center;

}

/* contenido */

.noticia-contenido{

padding:20px;

}


/* titulo */

.titulo-noticias{

font-size:48px;

font-weight:800;

text-align:center;

margin-bottom:60px;

background:linear-gradient(
90deg,
#0d6efd,
#42a5f5,
#0d6efd
);

background-size:200%;

-webkit-background-clip:text;

color:transparent;

animation:moverTitulo 6s linear infinite,
zoomTitulo 3s ease-in-out infinite;

}

/* texto */

.noticia-contenido p{

font-size:14px;

color:#555;

margin-bottom:15px;

}


/* boton */

.noticia-contenido a{

display:inline-block;

padding:8px 18px;

border-radius:25px;

background:linear-gradient(45deg,#0d6efd,#42a5f5);

color:white;

text-decoration:none;

font-size:14px;

font-weight:600;

}


/* hover boton */

.noticia-contenido a:hover{

box-shadow:0 10px 20px rgba(0,0,0,0.25);

}

/* movimiento del degradado */

@keyframes moverTitulo{

0%{
background-position:0%;
}

100%{
background-position:200%;
}

}


/* efecto respiración */

@keyframes zoomTitulo{

0%{
transform:scale(1);
}

50%{
transform:scale(1.05);
}

100%{
transform:scale(1);
}

}

.swiper-slide{
width:750px;
}

.noticia-card{

background:white;
border-radius:18px;
overflow:hidden;
box-shadow:0 25px 50px rgba(0,0,0,0.18);
transition:0.4s;

}

.noticia-card img{

width:100%;
height:380px;
object-fit:cover;

}

.noticia-contenido{
padding:25px;
}

.noticia-contenido h4{

font-size:26px;
font-weight:700;
margin-bottom:15px;

}

.noticia-contenido p{

color:#666;
font-size:17px;

}

.noticia-contenido a{

display:inline-block;
margin-top:15px;
background:#007bff;
color:white;
padding:10px 25px;
border-radius:40px;
text-decoration:none;

}

/* CONTENEDOR GENERAL */
.banner-wrap {
  padding: 50px 20px;
  background: #eef2f8;
}

/* MARCO AZUL PRO */
.banner-frame {
  background: linear-gradient(135deg, #5dade2, #2e86de);
  padding: 20px;
  border-radius: 25px;

  /* PROFUNDIDAD */
  box-shadow:
    0 25px 50px rgba(0,0,0,0.25),
    inset 0 3px 10px rgba(255,255,255,0.2);

  transform: perspective(1000px) rotateX(2deg);
  transition: all 0.4s ease;
}

/* EFECTO HOVER */
.banner-frame:hover {
  transform: perspective(1000px) rotateX(0deg) scale(1.01);
}

/* CARRUSEL */
.carousel {
  border-radius: 15px;
  overflow: hidden;
}

/* IMAGEN GRANDE */
.banner-img {
  width: 100%;
  height: 520px; /* 🔥 CAMBIA ESTO SI LO QUIERES MÁS GRANDE */
  object-fit: cover;
}

/* EFECTO OSCURO SUAVE (PRO) */
.banner-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  background: linear-gradient(
    to right,
    rgba(0,0,0,0.15),
    rgba(0,0,0,0.05)
  );
}

/* FLECHAS MÁS VISIBLES */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.3);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .banner-img {
    height: 300px;
  }
}

/* HERO FULL */
.banner-wrap {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

/* EFECTO SCROLL */
.banner-wrap.scroll-effect {
  transform: scale(0.95);
  opacity: 0.7;
  transition: 0.6s;
}

/* CONTENEDOR */
.banner-frame {
  width: 100%;
  height: 100%;
  overflow: hidden;
  box-shadow: 0 50px 100px rgba(0,0,0,0.5);
}

/* IMAGEN */
.banner-img {
  width: 110%;
  height: 110vh;
  object-fit: cover;

  transition: transform 0.2s linear;
}

/* ZOOM ACTIVO */
.carousel-item.active .banner-img {
  animation: zoomHero 10s ease-in-out infinite alternate;
}

@keyframes zoomHero {
  0% { transform: scale(1); }
  100% { transform: scale(1.15); }
}

/* OVERLAY */
.banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(0,0,0,0.7),
    rgba(0,0,0,0.2)
  );
}

/* LUZ DINÁMICA */
.banner-overlay::after {
  content: "";
  position: absolute;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255,255,255,0.1), transparent 60%);
  animation: lightMove 15s linear infinite;
}

@keyframes lightMove {
  0% { transform: translate(-10%, -10%); }
  50% { transform: translate(10%, 10%); }
  100% { transform: translate(-10%, -10%); }
}

/* TRANSICIÓN */
.carousel-item {
  transition: transform 1.8s ease, opacity 1.8s ease;
}

/* FLECHAS */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(2);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .banner-wrap {
    height: 60vh;
  }
}

/* HERO GRANDE */
.banner-wrap {
  width: 100%;
  height: 90vh; /* 🔥 grande pero no exagerado */
  overflow: hidden;
  position: relative;
}

/* CONTENEDOR */
.banner-frame {
  width: 100%;
  height: 100%;
}

/* IMAGEN SIN RECORTE */
.banner-img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* 🔥 CLAVE: NO recorta */
  background: #000; /* relleno elegante si sobra espacio */
}

/* QUITAMOS OSCURIDAD */
.banner-overlay {
  display: none;
}

/* TRANSICIÓN RÁPIDA */
.carousel-item {
  transition: transform 0.6s ease, opacity 0.6s ease;
}

/* FLECHAS MÁS VISIBLES */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.5);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .banner-wrap {
    height: 50vh;
  }
}

/* CONTENEDOR */
.banner-wrap {
  width: 100%;
  height: 90vh;
  background: #0d1b2a; /* fondo elegante */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* CARRUSEL */
.carousel,
.carousel-inner,
.carousel-item {
  height: 100%;
}

/* IMAGEN PERFECTA */
.banner-img {
  width: 100%;
  height: 100%;

  object-fit: contain; /* 🔥 CLAVE: NO RECORTA */
  object-position: center;

  background: #0d1b2a;
}

/* QUITAR TODO EFECTO */
.banner-overlay {
  display: none;
}

/* TRANSICIÓN LIMPIA */
.carousel-item {
  transition: opacity 0.6s ease-in-out;
}

/* FLECHAS */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.5);
}

/* CONTENEDOR */
.banner-wrap {
  width: 100%;
  height: 90vh;
  background: #000; /* 🔥 negro evita bordes azules */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* CARRUSEL */
.carousel,
.carousel-inner,
.carousel-item {
  height: 100%;
}

/* IMAGEN SIN RECORTE */
.banner-img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* no recorta */
  object-position: center;

  background: #000; /* 🔥 CLAVE para evitar bordes azules */
}

/* QUITAR CUALQUIER ZOOM */
.carousel-item.active .banner-img {
  transform: none !important;
  animation: none !important;
}

/* TRANSICIÓN LIMPIA (SIN EFECTO RARO) */
.carousel-item {
  transition: opacity 0.5s ease-in-out !important;
}

/* EVITA PARPADEO DE FONDO */
.carousel-inner {
  background: #000;
}

/* FLECHAS */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.5);
}

.carousel-item {
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}

.carousel-item.active {
  opacity: 1;
}

/* 🔥 clave */
.carousel-inner {
  background: transparent;
}

/* FONDO PROFUNDO */
.banner-wrap {
  width: 100%;
  height: 90vh;

  display: flex;
  align-items: center;
  justify-content: center;

  /* 🔥 fondo 3D */
  background: radial-gradient(circle at center, #1b2a49, #0d1b2a);
}

/* MARCO 3D */
.banner-frame {
  width: 95%;
  height: 90%;

  border-radius: 20px;
  overflow: hidden;

  /* 🔥 sombra profunda (efecto flotante) */
  box-shadow:
    0 30px 60px rgba(0,0,0,0.5),
    inset 0 0 40px rgba(255,255,255,0.05);

  position: relative;
}

/* BORDE LUMINOSO SUAVE */
.banner-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;

  border: 1px solid rgba(255,255,255,0.15);
  pointer-events: none;
}

/* IMAGEN NORMAL (sin tocarla) */
.banner-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: transparent;
}

/* ========================= */
/* FONDO MODERNO */
/* ========================= */
.banner-wrap {
  width: 100%;
  height: 90vh;

  display: flex;
  align-items: center;
  justify-content: center;

  /* 🔥 fondo elegante */
  background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
}

/* ========================= */
/* MARCO 3D */
/* ========================= */
.banner-frame {
  width: 95%;
  height: 90%;

  border-radius: 25px;
  overflow: hidden;

  position: relative;

  /* 💎 profundidad */
  box-shadow:
    0 40px 80px rgba(0,0,0,0.5),
    0 10px 30px rgba(0,0,0,0.3);

  transition: transform 0.4s ease;
}

/* EFECTO HOVER SUTIL */
.banner-wrap:hover .banner-frame {
  transform: scale(1.01);
}

/* BORDE TIPO VIDRIO */
.banner-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 25px;

  border: 1px solid rgba(255,255,255,0.15);
  pointer-events: none;
}

/* ========================= */
/* CARRUSEL SUAVE */
/* ========================= */
.carousel,
.carousel-inner,
.carousel-item {
  height: 100%;
}

/* 🔥 transición más suave */
.carousel-item {
  transition: transform 1.2s ease-in-out;
}

/* ========================= */
/* IMAGEN PERFECTA */
/* ========================= */
.banner-img {
  width: 100%;
  height: 100%;

  object-fit: contain;
  object-position: center;

  background: transparent;
}

/* ========================= */
/* FLECHAS PRO */
/* ========================= */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.6);
  opacity: 0.8;
  transition: 0.3s;
}

.carousel-control-prev:hover .carousel-control-prev-icon,
.carousel-control-next:hover .carousel-control-next-icon {
  opacity: 1;
  transform: scale(1.9);
}

/* ========================= */
/* INDICADORES BONITOS */
/* ========================= */
.carousel-indicators [data-bs-target] {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: white;
  opacity: 0.4;
}

.carousel-indicators .active {
  opacity: 1;
  transform: scale(1.3);
}

/* ========================= */
/* RESPONSIVE */
/* ========================= */
@media (max-width: 768px) {
  .banner-wrap {
    height: 55vh;
  }
}

/* CONTENEDOR */
.banner-wrap {
  width: 100%;
  height: 90vh;
  background: #0d1b2a;

  display: flex;
  align-items: center;
  justify-content: center;
}

/* MARCO */
.banner-frame {
  width: 95%;
  height: 90%;
  overflow: hidden;
  position: relative;
}

/* 🔥 AQUÍ ESTÁ LA MAGIA */
.carousel-custom .carousel-inner {
  display: flex;
}

/* CADA SLIDE COMO TARJETA */
.carousel-custom .carousel-item {
  min-width: 100%;
  transition: transform 1s ease-in-out;
}

/* IMAGEN */
.banner-img {
  width: 90%; /* 🔥 NO ocupa todo */
  height: 85%;
  margin: auto;

  object-fit: contain;

  border-radius: 20px;

  /* 💎 SOMBRA REAL */
  box-shadow: 0 20px 40px rgba(0,0,0,0.5);
}

/* EFECTO PROFUNDIDAD EN INACTIVOS */
.carousel-item-next .banner-img,
.carousel-item-prev .banner-img {
  transform: scale(0.9);
  opacity: 0.6;
}

/* ACTIVO MÁS GRANDE */
.carousel-item.active .banner-img {
  transform: scale(1);
  opacity: 1;
}

/* FLECHAS */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(2);
}

/* CONTENEDOR */
.banner-wrap {
  width: 100%;
  height: auto; /* 🔥 clave */
  background: #fff;
}

/* CARRUSEL */
.carousel,
.carousel-inner,
.carousel-item {
  width: 100%;
}

/* IMAGEN GRANDE REAL */
.banner-img {
  width: 100%;
  height: auto; /* 🔥 clave: mantiene proporción */

  object-fit: contain; /* no recorta */
  display: block;
}

/* QUITAR ALTURAS FORZADAS */
.carousel-item {
  height: auto;
}

/* TRANSICIÓN SUAVE */
.carousel-item {
  transition: transform 0.6s ease-in-out;
}

/* FLECHAS */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(1);
  transform: scale(1.5);
}

/* BASE */
.carousel-item {
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* ACTIVO */
.carousel-item.active {
  opacity: 1;
  transform: scale(1);
  z-index: 2;
}

/* EVITA FONDO BLANCO */
.carousel-inner {
  background: transparent;
}

/* IMAGEN */
.banner-img {
  width: 100%;
  height: auto;
  display: block;
}

.carousel-item {
  opacity: 0;
  transform: translateX(40px);
  transition: all 0.6s ease;
}

.carousel-item.active {
  opacity: 1;
  transform: translateX(0);
}

/* ================================
   🌌 ULTRA NIVEL: FONDO ANIMADO
   ================================ */
.contact-ultra {
  position: relative;
  padding: 90px 25px;
  background: #eaf6ff;
  overflow: hidden;
}

/* Partículas */
.particles-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle, rgba(0,200,150,0.35) 2px, transparent 2px),
    radial-gradient(circle, rgba(0,150,120,0.25) 2px, transparent 2px);
  background-size: 140px 140px, 200px 200px;
  animation: particlesMove 18s linear infinite;
}

@keyframes particlesMove {
  0% { background-position: 0 0, 0 0; }
  100% { background-position: 500px 800px, -400px -600px; }
}

/* Líneas brillantes */
.lines-bg {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    115deg,
    rgba(0, 110, 90, 0.07) 0px,
    rgba(0,110,90,0.07) 2px,
    transparent 4px,
    transparent 12px
  );
  animation: linesMove 12s linear infinite;
}

@keyframes linesMove {
  0% { transform: translateY(0); }
  100% { transform: translateY(-250px); }
}

/* ================================
   ✨ TÍTULO HOLOGRÁFICO
   ================================ */
.contact-title-ultra {
  font-size: 3.4rem;
  font-weight: 900;
  text-align: center;
  margin-bottom: 55px;
  background: linear-gradient(90deg, #005f4a, #00b28c, #009b7a, #007a63);
  background-size: 350%;
  -webkit-background-clip: text;
  color: transparent;
  animation: holoTitle 6s infinite alternate ease;
}

@keyframes holoTitle {
  0% { background-position: 0%; }
  100% { background-position: 100%; }
}

/* ================================
   🔳 TARJETAS ULTRA
   ================================ */
.contact-ultra-container {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
  position: relative;
}

.contact-ultra-card {
  width: 320px;
  padding: 40px;
  position: relative;
  border-radius: 25px;
  background: rgba(255,255,255,0.20);
  backdrop-filter: blur(20px);
  border: 2px solid rgba(255,255,255,0.45);

  /* SOMBRA Y 3D */
  box-shadow: 0 12px 30px rgba(0,0,0,0.15),
              0 0 20px rgba(0,170,135,0.25);

  transition: all .4s ease;
  overflow: hidden;
  cursor: pointer;
}

/* Borde neon animado */
.contact-ultra-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 4px;
  background: linear-gradient(135deg,
    rgba(0,255,200,0.8),
    rgba(0,150,120,0.7),
    rgba(0,255,200,0.8)
  );
  background-size: 350%;
  opacity: 0;
  transition: 0.45s ease;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
}

.contact-ultra-card:hover::after {
  opacity: 1;
  animation: borderUltra 4s infinite linear;
}

@keyframes borderUltra {
  0% { background-position: 0%; }
  100% { background-position: 200%; }
}

/* Halo debajo */
.halo {
  position: absolute;
  bottom: -35px;
  left: 50%;
  width: 130px;
  height: 35px;
  background: radial-gradient(circle, rgba(0,230,170,0.45), transparent 70%);
  transform: translateX(-50%);
  filter: blur(12px);
}

/* Hover 3D */
.contact-ultra-card:hover {
  transform: translateY(-18px) scale(1.05);
  box-shadow: 0 20px 45px rgba(0,0,0,0.22),
              0 0 35px rgba(0,255,200,0.35);
}

/* ================================
   🌟 ICONOS PULSE ELEGANTE
   ================================ */
.pulse-ultra img {
  animation: pulseUltra 2.3s infinite ease-in-out;
}

@keyframes pulseUltra {
  0% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 0.85; }
}

.icon-wrapper img {
  width: 65px;
  height: 65px;
  margin-bottom: 15px;
  filter: drop-shadow(0 5px 8px rgba(0,0,0,0.28));
}

/* ================================
   ✔ TEXTOS
   ================================ */
.contact-ultra-card h3 {
  font-size: 1.55rem;
  color: #004837;
  margin-top: 5px;
  margin-bottom: 8px;
  font-weight: 800;
}

.contact-ultra-card p {
  font-size: 1.07rem;
  color: #0b0b0b;
  line-height: 1.45;
}

/* ================================
   🎯 SECCIÓN DEL TÍTULO INDEPENDIENTE
   ================================ */
.big-title-section {
  padding: 90px 20px 50px;
  text-align: center;
  background: linear-gradient(135deg, #f0fbff, #e6f2f9);
  position: relative;
  overflow: hidden;
  animation: sectionFadeIn 1.3s ease forwards;
  opacity: 0;
}

@keyframes sectionFadeIn {
  0% { opacity: 0; transform: translateY(25px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Contenedor del título */
.title-wrapper {
  max-width: 900px;
  margin: auto;
}

/* ================================
   ✨ TÍTULO PRINCIPAL HOLOGRÁFICO
   ================================ */
.global-title {
  font-size: 3.4rem;
  font-weight: 900;
  background: linear-gradient(90deg, #005f4a, #00b28c, #00a784, #007a63);
  background-size: 350%;
  -webkit-background-clip: text;
  color: transparent;
  animation: titleWave 6s infinite alternate ease;
}

@keyframes titleWave {
  0% { background-position: 0%; }
  100% { background-position: 100%; }
}

/* ================================
   🌿 LÍNEA DECORATIVA INSTITUCIONAL
   ================================ */
.title-line {
  width: 120px;
  height: 4px;
  background: linear-gradient(90deg, #00a882, #00936f, #00a882);
  margin: 18px auto 15px;
  border-radius: 10px;
  animation: lineGlow 3s infinite ease-in-out;
}

@keyframes lineGlow {
  0% { box-shadow: 0 0 8px rgba(0,180,140,0.4); }
  50% { box-shadow: 0 0 18px rgba(0,180,140,0.8); }
  100% { box-shadow: 0 0 8px rgba(0,180,140,0.4); }
}

/* ================================
   📝 SUBTÍTULO ELEGANTE
   ================================ */
.title-sub {
  font-size: 1.25rem;
  color: #2d2d2d;
  margin-top: 10px;
  opacity: 0;
  animation: subtitleAppear 1.5s ease forwards 0.4s;
}

@keyframes subtitleAppear {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* TÍTULO ULTRA NIVEL */
.contact-title {
  font-size: 4rem;                   /* Título gigante */
  font-weight: 800;
  text-align: center;
  color: #007BFF;                    /* Azul corporativo */
  margin-top: 40px;
  margin-bottom: 50px;
  letter-spacing: 1.5px;

  /* Efecto brillo */
  background: linear-gradient(90deg, #007BFF, #56A8FF, #007BFF);
  -webkit-background-clip: text;
  color: transparent;
  animation: shine 4s linear infinite;

  /* Animación de entrada */
  opacity: 0;
  transform: translateY(-20px);
  animation: fadeSlide 1.2s ease-out forwards, shine 4s linear infinite;
}

/* Brillo que recorre el título */
@keyframes shine {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

/* Fade + deslizamiento hacia abajo */
@keyframes fadeSlide {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Contenedor del título */
.institutional-title-wrapper {
  width: 80%;           
  margin: 50px auto 40px;
  text-align: center;
  padding: 10px 0;
}

/* Título institucional */
.institutional-title {
  font-size: 3.2rem;                /* Grande pero sobrio */
  font-weight: 700;
  letter-spacing: 1px;
  color: #0A3D8C;                    /* Azul institucional */
  text-transform: uppercase;

  /* Sombra elegante y suave */
  text-shadow: 
    0px 1px 2px rgba(0,0,0,0.15),
    0px 3px 6px rgba(0,0,0,0.10);

  /* Animación institucional sutil */
  opacity: 0;
  transform: translateY(10px);
  animation: institutionalFadeIn 0.8s ease-out forwards;
}

/* Animación sobria de entrada */
@keyframes institutionalFadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Fondo azul institucional para Noticias 2025 */
#carouselnoti {
  background: linear-gradient(135deg, #0a3d91, #0f5dd0);
  padding: 50px 0;
  border-radius: 30px;
}

/* Título */
#carouselnoti h3 {
  color: white !important;
  font-size: 40px;
  margin-bottom: 40px;
}

/* Estilo tipo Naipe */
#carouselnoti .card {
  border-radius: 22px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.35);
  border: none;
  overflow: hidden;
  transform: rotate(-2deg);
  transition: all .4s ease;
  background: white;
}

/* Animación tipo hover */
#carouselnoti .card:hover {
  transform: rotate(0deg) translateY(-10px);
  box-shadow: 0 25px 55px rgba(0,0,0,0.45);
}

/* Imagen de la tarjeta */
#carouselnoti .card img {
  height: 200px;
  object-fit: cover;
}

/* Títulos de tarjeta */
#carouselnoti .card-title {
  color: #0b3eaa;
  font-weight: 700;
}

/* Botón */
#carouselnoti .btn-primary {
  background: #0b48d1;
  border: none;
  border-radius: 50px;
}

#carouselnoti .btn-primary:hover {
  background: #083aab;
}

/* ----------------------------------------
   SECCIÓN NOTICIAS 2025 — DISEÑO CARTAS 3D
   ---------------------------------------- */

/* Fondo azul institucional suave */
#carouselnoti {
  background: #2F6FDB;
  padding: 60px 0;
  border-radius: 28px;
  margin-top: 40px;
}

/* Título principal */
#carouselnoti h3 {
  color: #ffffff;
  font-size: 42px;
  font-weight: 800;
  text-align: center;
  margin-bottom: 50px;
  letter-spacing: .5px;
}

/* ---------- TARJETAS TIPO NAIPES ---------- */
#carouselnoti .card {
  position: relative;
  background: #ffffff;
  border-radius: 22px;
  border: none;
  overflow: hidden;
  padding: 0;
  transform: translate(0,0);
  transition: transform .4s ease, box-shadow .4s ease;
}

/* CAPA 1 — sombra profunda */
#carouselnoti .card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.18);
  border-radius: 22px;
  transform: translate(10px, 10px);
  transition: transform .4s ease;
  z-index: -2;
}

/* CAPA 2 — cartón azul institucional */
#carouselnoti .card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #1F5BC0;
  opacity: 0.4;
  border-radius: 22px;
  transform: translate(5px, 5px);
  transition: transform .4s ease;
  z-index: -1;
}

/* EFECTO PEEL-OFF — tarjeta se despega */
#carouselnoti .card:hover {
  transform: translate(-10px, -10px);
}

#carouselnoti .card:hover::before {
  transform: translate(20px, 20px);
}

#carouselnoti .card:hover::after {
  transform: translate(12px, 12px);
}

/* ---------- IMÁGENES ---------- */
#carouselnoti .card img {
  height: 200px;
  width: 100%;
  object-fit: cover;
  border-bottom: 4px solid #2F6FDB;
}

/* ---------- TEXTO DE LA TARJETA ---------- */
#carouselnoti .card-body {
  padding: 18px 22px;
}

#carouselnoti .card-title {
  font-size: 20px;
  color: #2F6FDB;
  font-weight: 700;
  margin-bottom: 12px;
}

#carouselnoti .card-text {
  font-size: 15px;
  color: #444;
  line-height: 1.45;
}

/* ---------- BOTONES ---------- */
#carouselnoti .btn-primary {
  background: #2F6FDB;
  border: none;
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 15px;
  transition: background .3s ease;
}

#carouselnoti .btn-primary:hover {
  background: #1F5BC0;
}

/* ---------- CONTROLES DEL CARRUSEL ---------- */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: brightness(0) invert(1);
}

/* ============================
   FONDO DE LA SECCIÓN 2025
============================ */
#noticias2025 {
    background: linear-gradient(180deg, #0d6efd, #0b5ed7);
    padding: 50px 0;
    border-radius: 20px;
}

/* ============================
   ESTILO DE LAS TARJETAS
============================ */
#noticias2025 .card {
    background: #f0f6ff; /* azul muy suave */
    border: none;
    border-radius: 18px;
    box-shadow: 0 8px 18px rgba(0,0,0,0.25);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    transform: rotate(-1deg) translateY(0);
    overflow: hidden;
}

/* Hover: se despega como un naipe */
#noticias2025 .card:hover {
    transform: rotate(0deg) translateY(-12px) scale(1.03);
    box-shadow: 0 18px 28px rgba(0,0,0,0.35);
}

/* ============================
   IMAGEN DE LA TARJETA
============================ */
#noticias2025 .card-img-top {
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    height: 210px;
    object-fit: cover;
}

/* ============================
   CUERPO DE TEXTO
============================ */
#noticias2025 .card-body {
    padding: 22px;
    background: rgba(255, 255, 255, 0.5);
}

/* Títulos */
#noticias2025 .card-title a {
    font-weight: 700;
    color: #0b4fb3;
    text-decoration: none;
}

/* Descripción */
#noticias2025 .card-text {
    color: #333;
    margin-top: 10px;
}

/* ============================
   BOTÓN "Leer más"
============================ */
#noticias2025 .btn-primary {
    background: #198754; /* verde suave */
    border: none;
    padding: 7px 18px;
    font-size: 14px;
    border-radius: 20px;
    transition: background 0.25s ease;
}

#noticias2025 .btn-primary:hover {
    background: #146c43;
}

/* ============================
   AJUSTES DE CARRUSEL BOOTSTRAP
============================ */
#noticias2025 .carousel-inner {
    padding-top: 20px;
}

#noticias2025 .carousel-item {
    transition: transform 0.8s ease-in-out;
}

/* Flechas */
#noticias2025 .carousel-control-prev-icon,
#noticias2025 .carousel-control-next-icon {
    filter: invert(100%);
}

/* === Fondo más discreto y con 3D suave === */
.noticias2025 {
    background: linear-gradient(135deg, #0d6efd, #1b6de0 60%, #0b4ca3);
    padding: 40px 0;
    border-radius: 18px;
    margin: 40px auto;
    max-width: 1300px;
    perspective: 1200px; /* efecto 3D real */
}

.noticias2025 h3 {
    color: white;
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 25px;
    text-shadow: 0 3px 9px rgba(0,0,0,0.25);
}

/* === Ocultar botones del carrusel === */
#carouselnoti .carousel-control-prev,
#carouselnoti .carousel-control-next {
    display: none !important;
}

/* === Convertir las tarjetas del carrusel en un stack 3D === */
#carouselnoti .carousel-item {
    display: flex !important;
    justify-content: center;
}

#carouselnoti .carousel-item .row {
    position: relative;
    width: 380px;
    height: 520px;
}

/* === Cada tarjeta se convierte en una capa en 3D === */
#carouselnoti .card {
    position: absolute;
    width: 100%;
    border-radius: 20px;
    overflow: hidden;
    transform-style: preserve-3d;
    transition: transform .5s ease, box-shadow .5s ease;
}

/* La tarjeta principal */
#carouselnoti .card:nth-child(1) {
    z-index: 3;
    transform: translateZ(40px) rotate(-1deg);
    box-shadow: 0 18px 28px rgba(0,0,0,0.28);
}

/* Segunda tarjeta, un poco atrás */
#carouselnoti .card:nth-child(2) {
    z-index: 2;
    transform: translate(12px, 18px) translateZ(-15px) rotate(-3deg);
    opacity: 0.9;
}

/* Tercera tarjeta, más atrás aún */
#carouselnoti .card:nth-child(3) {
    z-index: 1;
    transform: translate(22px, 28px) translateZ(-35px) rotate(-5deg);
    opacity: 0.75;
}

/* Hover: la principal se despega más */
#carouselnoti .card:nth-child(1):hover {
    transform: translateZ(80px) translateY(-12px) scale(1.03);
    box-shadow: 0 25px 40px rgba(0,0,0,0.35);
}

/* ==============================
   Estilos internos de la tarjeta
============================== */
#carouselnoti .card-img-top {
    height: 200px;
    object-fit: cover;
}

#carouselnoti .card-body {
    background: rgba(255,255,255,0.75);
    padding: 20px;
}

#carouselnoti .card-title {
    font-weight: 700;
    color: #094a9f;
}

#carouselnoti .btn-primary {
    border-radius: 20px;
    background: #198754;
    border: none;
}

#carouselnoti .btn-primary:hover {
    background: #146c43;
}

.noticias2025 {
    background: linear-gradient(145deg, #e9f1ff, #d4e4ff);
    padding: 50px 0;
    border-radius: 22px;
    margin: 40px auto;
    max-width: 1200px;
    box-shadow: 0 12px 25px rgba(0,0,0,0.15);
}
.noticias2025 h3 {
    color: #0a3e8c;
    font-weight: 800;
    text-shadow: 0 2px 5px rgba(0,0,0,0.15);
}

/* Carta principal */
#carouselnoti .card:nth-child(1) {
    transform: scale(0.85) translateZ(40px);
    transition: transform .6s ease, box-shadow .6s ease;
    cursor: pointer;
}

#carouselnoti .card:nth-child(1):hover {
    transform: scale(1.12) translateY(-15px);
    box-shadow: 0 22px 35px rgba(0,0,0,0.35);
}

/* Tarjeta 2 */
#carouselnoti .card:nth-child(2) {
    transform: translate(15px, 18px) rotate(-2deg) scale(.95);
    opacity: 0.85;
    position: absolute;
    z-index: 1;
}

/* Tarjeta 3 */
#carouselnoti .card:nth-child(3) {
    transform: translate(25px, 28px) rotate(-4deg) scale(.92);
    opacity: 0.75;
    position: absolute;
    z-index: 0;
}

/* Fondo institucional premium */
.noticias2026 {
    background: linear-gradient(to bottom, #eef4ff 0%, #f8fbff 100%);
    padding: 65px 0 90px;
    border-radius: 26px;
    margin: 40px auto;
    position: relative;
    overflow: hidden;
}

/* Efecto de iluminación suave detrás */
.noticias2026::before {
    content: "";
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(100,160,255,0.25), transparent 70%);
    top: -150px;
    left: 50%;
    transform: translateX(-50%);
    filter: blur(40px);
    z-index: 0;
}

/* Título */
.noticias2026 h3 {
    color: #0a4ea3;
    font-weight: 900;
    font-size: 38px;
    text-align: center;
    margin-bottom: 50px;
    position: relative;
    z-index: 2;
    letter-spacing: 1px;
}

/* Carrusel */
#carouselnoti {
    max-width: 940px;
    margin: auto;
    position: relative;
    perspective: 1600px;
    z-index: 2;
}

/* Tarjeta general */
#carouselnoti .card {
    border-radius: 22px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.18);
    transition: transform .6s ease, box-shadow .4s ease;
    overflow: hidden;
    border: none;
    background: #ffffff;
}

/* Imagen */
#carouselnoti .card img {
    border-radius: 22px 22px 0 0;
}

/* Tarjeta central */
#carouselnoti .carousel-item.active {
    transform: scale(1) translateZ(120px);
    opacity: 1;
}

#carouselnoti .carousel-item.active .card {
    box-shadow: 0 25px 50px rgba(0,0,0,0.25);
}

/* Tarjetas laterales con efecto 3D real */
#carouselnoti .carousel-item-next.carousel-item-left {
    transform: scale(.85) rotateY(28deg) translateX(-120px);
    opacity: .35;
    filter: blur(3px);
}

#carouselnoti .carousel-item-prev.carousel-item-right {
    transform: scale(.85) rotateY(-28deg) translateX(120px);
    opacity: .35;
    filter: blur(3px);
}

#carouselnoti .carousel-item-next.carousel-item-right {
    transform: scale(.85) rotateY(-28deg) translateX(120px);
    opacity: .35;
    filter: blur(3px);
}

#carouselnoti .carousel-item-prev.carousel-item-left {
    transform: scale(.85) rotateY(28deg) translateX(-120px);
    opacity: .35;
    filter: blur(3px);
}

/* Flotar al pasar el mouse (solo tarjeta central) */
#carouselnoti .carousel-item.active:hover .card {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 30px 60px rgba(0,0,0,0.28);
}

/* Botones laterales modernos */
.carousel-control-prev, 
.carousel-control-next {
    width: 60px;
    height: 60px;
    background: rgba(255,255,255,0.65);
    backdrop-filter: blur(8px);
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    transition: .3s ease;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

.carousel-control-prev:hover, 
.carousel-control-next:hover {
    background: rgba(255,255,255,0.9);
    transform: scale(1.08) translateY(-50%);
}

/* Iconos */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: brightness(0.3);
}

/* Subtítulo institucional */
.title-sub {
  font-size: 1.35rem;        /* ← AUMENTADO (antes seguro estaba en 1rem o 1.1rem) */
  font-weight: 400;
  color: #2a2a2a;            /* Gris serio institucional */
  margin-top: 10px;
  letter-spacing: 0.5px;
  opacity: 0;
  animation: subtitleFade 1s ease-out forwards;
  animation-delay: 0.2s;     /* Entra después del título */
}

/* Animación suave del subtítulo */
@keyframes subtitleFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
#carouselnoti {
  max-width: 1100px;
  margin: auto;
}

#carouselnoti .card {
  border: none;
  border-radius: 15px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#carouselnoti .card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

#carouselnoti .card img {
  height: 220px;
  object-fit: cover;
}

#carouselnoti .card-body {
  padding: 15px;
}

#carouselnoti .card-title {
  font-size: 16px;
  font-weight: 600;
}

#carouselnoti .card-text {
  font-size: 14px;
  color: #555;
}

#carouselnoti .btn {
  border-radius: 20px;
  font-size: 13px;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: rgba(0,0,0,0.5);
  border-radius: 50%;
  padding: 10px;
}
.carrusel-noticias .noticias-container {
  max-width: 1200px;
  margin: auto;
  padding: 0 20px;
}

.carrusel-noticias .noticias-scroll {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 10px;
}

.carrusel-noticias .noticias-scroll::-webkit-scrollbar {
  height: 8px;
}

.carrusel-noticias .noticias-scroll::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 10px;
}

.carrusel-noticias .noticia-card {
  min-width: 300px;
  max-width: 300px;
  flex: 0 0 auto;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
  scroll-snap-align: start;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.carrusel-noticias .noticia-card:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

.carrusel-noticias .noticia-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

.carrusel-noticias .contenido {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 15px;
  background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
  color: white;
}

.carrusel-noticias .contenido h5 {
  font-size: 14px;
  margin-bottom: 8px;
}

.carrusel-noticias .contenido a {
  font-size: 13px;
  color: #00d4ff;
  text-decoration: none;
}

.carrusel-noticias .noticia-card {
  min-width: 340px;
  max-width: 340px;
  flex: 0 0 auto;
  border-radius: 15px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.carrusel-noticias .noticia-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

.carrusel-noticias .noticia-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

/* CONTENIDO BLANCO */
.carrusel-noticias .noticia-body {
  padding: 15px;
}

.carrusel-noticias .noticia-body h5 {
  font-size: 16px;
  margin-bottom: 10px;
  color: #222;
}

.carrusel-noticias .noticia-body p {
  font-size: 14px;
  color: #555;
  margin-bottom: 15px;
}

/* BOTÓN */
.carrusel-noticias .btn-noticia {
  display: inline-block;
  padding: 8px 15px;
  background: #0d6efd;
  color: #fff;
  border-radius: 20px;
  font-size: 13px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.carrusel-noticias .btn-noticia:hover {
  background: #084298;
}
.banner-full {
  width: 100%;
  height: 80vh; /* ocupa casi toda la pantalla */
  overflow: hidden;
  position: relative;
}

.banner-full img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* llena sin deformar */
  transition: transform 0.6s ease, filter 0.6s ease;
}

/* EFECTO HOVER PRO */
.banner-full:hover img {
  transform: scale(1.05);
  filter: brightness(0.8);
}

/* OPCIONAL: efecto overlay elegante */
.banner-full::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.2);
  transition: background 0.4s ease;
}

.banner-full:hover::after {
  background: rgba(0,0,0,0.4);
}
.banner-ajustado {
  width: 100%;
  overflow: hidden;
  border-radius: 10px; /* opcional, se ve más moderno */
}

.banner-ajustado img {
  width: 100%;
  height: auto; /* mantiene proporción */
  display: block;
}

/* Opcional: efecto suave */
.banner-ajustado img:hover {
  transform: scale(1.02);
  transition: 0.4s ease;
}
/* CONTENEDOR CON FONDO DEGRADADO */
.banner-wrapper {
  background: linear-gradient(135deg, #ffffff, #e6f0ff, #cce0ff);
  padding: 30px;
  border-radius: 15px;
  text-align: center;
  overflow: hidden;
  position: relative;
}

/* IMAGEN */
.banner-wrapper img {
  width: 100%;
  max-width: 900px; /* controla tamaño */
  height: auto;
  border-radius: 10px;

  /* sombra elegante */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);

  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

/* EFECTO HOVER */
.banner-wrapper:hover img {
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}
.banner-wrapper {
  background: linear-gradient(270deg, #ffffff, #dbeafe, #bfdbfe);
  background-size: 400% 400%;
  animation: gradientMove 8s ease infinite;
}

@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.banner-wrapper img {
  width: 100%;
  max-width: 100%; /* ocupa todo */
}

.calendario-section {
  max-width: 1200px;
  margin: auto;
  text-align: center;
}

#calendar {
  width: 100%;
  max-width: 1200px;
  margin: 30px auto;
  background: #ffffff;
  padding: 25px;
  border-radius: 15px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.15);
  font-size: 16px;
}


/* BOTONES */
.filtros button {
  margin: 5px;
  padding: 8px 15px;
  border: none;
  background: #2c3e50;
  color: white;
  border-radius: 5px;
  cursor: pointer;
}

.filtros button:hover {
  background: #1a252f;
}

/* MODAL */
.modal {
  display: none;
  position: fixed;
  z-index: 999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
}

.modal-content {
  background: #fff;
  margin: 10% auto;
  padding: 20px;
  width: 90%;
  max-width: 500px;
  border-radius: 10px;
  text-align: left;
}

.cerrar {
  float: right;
  font-size: 22px;
  cursor: pointer;
}

.fc-event {
  text-decoration: none !important;
  border: none !important;
  padding: 4px;
  font-size: 14px;
  border-radius: 4px;
}

.fc-event-title {
  text-decoration: none !important;
  font-weight: 500;
}
.fc-toolbar-title {
  font-size: 24px !important;
  font-weight: bold;
}

.fc-button {
  background: #2c3e50 !important;
  border: none !important;
}

.fc-button:hover {
  background: #1a252f !important;
}

.fc-daygrid-day-number {
  font-weight: bold;
  color: #2c3e50;
}

.fc-col-header-cell-cushion {
  text-decoration: none !important;
  color: #2c3e50;
  font-weight: bold;
}
.fc-daygrid-event {
  white-space: normal !important;
  font-size: 13px;
}

.calendario-section {
  width: 100% !important;
  max-width: 1400px; /* puedes subirlo a 1600 si quieres gigante */
  margin: auto;
}
.fc a {
  color: #2c3e50 !important;
  text-decoration: none !important;
}

.fc-event-title {
  color: #2c3e50 !important;
}
/* Colorear días que tienen eventos */
.dia-con-evento {
  background-color: #eaf3ff !important;
}

/* Quitar azul feo */
.fc a {
  color: #2c3e50 !important;
  text-decoration: none !important;
}

/* Mejorar eventos */
.fc-event {
  border: none !important;
  font-size: 13px;
}
#calendar {
  width: 100%;
  max-width: 1300px;
  margin: 40px auto;
  background: rgba(255, 255, 255, 0.95);
  padding: 25px;
  border-radius: 18px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
  backdrop-filter: blur(10px);
}
.dia-con-evento {
  background: linear-gradient(135deg, #60a5fa, #2563eb) !important;
  color: white !important;
  border-radius: 8px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Número del día en blanco */
.dia-con-evento .fc-daygrid-day-number {
  color: white !important;
  font-weight: bold;
}
.fc-daygrid-day:hover {
  transform: scale(1.03);
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
  z-index: 2;
}
.fc-event {
  background: rgba(255,255,255,0.9) !important;
  color: #1e3a8a !important;
  border-radius: 6px;
  padding: 2px 4px;
  font-size: 12px;
  font-weight: 500;
}
.fc-button {
  background: linear-gradient(135deg, #2563eb, #1e40af) !important;
  border: none !important;
  border-radius: 6px !important;
}

.fc-button:hover {
  background: linear-gradient(135deg, #1e40af, #1e3a8a) !important;
}
.dia-con-evento::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 8px;
  background: rgba(255,255,255,0.1);
  pointer-events: none;
}
.fc-toolbar-title {
  text-transform: capitalize;
}

.calendario-section h2 {
  text-align: center;
  width: 100%;
  margin-bottom: 20px;
}

.fc-header-toolbar {
  justify-content: center !important;
  text-align: center;
}
body {
  overflow-x: hidden;
}
.calendario-section {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}
#calendar {
  width: 100% !important;
  max-width: 1300px;
  margin: 40px auto;
}
.calendario-section h2 {
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  margin: 0 auto 15px auto !important;
  font-size: 28px !important;
}
.titulo-calendario {
  text-align: center !important;
  width: 100%;
  margin: 0 auto 15px auto !important;
  font-size: 28px !important;
}