/* =========================
   ESTILOS GENERALES
========================= */

body{
font-family: Arial, Helvetica, sans-serif;
color:#333;
background:#f5f5f5;
margin:0;
padding:0;
}


/* =========================
   HEADER SUPERIOR
========================= */

.header-top{
background:#0b7d35;
padding:12px 0;
color:white;
}


/* =========================
   LOGO RESPONSIVO
========================= */

.logo-header{

width:100%;
max-width:260px;
height:auto;

}


/* =========================
   TEXTO HEADER
========================= */

.info-header{
font-size:14px;
color:white;
line-height:1.4;
}


/* =========================
   REDES SOCIALES
========================= */

.redes a{

display:inline-block;
width:36px;
height:36px;
line-height:36px;
text-align:center;
background:#1ea34a;
color:white;
border-radius:6px;
margin-left:6px;
font-size:15px;
transition:0.3s;

}

.redes a:hover{
background:#0a5c26;
transform:scale(1.05);
}


/* =========================
   NAVBAR
========================= */

.navbar-uriondo{

background:#1ea34a;
box-shadow:0 2px 6px rgba(0,0,0,0.1);

}


/* LINKS MENU */

.navbar-uriondo .nav-link{

color:white;
font-weight:500;
margin-right:10px;
padding:10px 14px;

}

.navbar-uriondo .nav-link:hover{

color:#d8ffd8;

}


/* LINK ACTIVO */

.navbar-uriondo .nav-link.active{

font-weight:600;
border-bottom:2px solid white;

}


/* =========================
   DROPDOWN
========================= */

.dropdown-menu{

border-radius:6px;
border:none;
box-shadow:0 4px 10px rgba(0,0,0,0.1);

}

.dropdown-item{

font-size:14px;

}

.dropdown-item:hover{

background:#1ea34a;
color:white;

}


/* =========================
   BOTON HAMBURGUESA
========================= */

.navbar-toggler{

border:none;
color:white;
font-size:24px;

}

.navbar-toggler:focus{

box-shadow:none;

}


/* =========================
   RESPONSIVE TABLET
========================= */

@media (max-width:991px){

.logo-header{

max-width:320px;

}

.info-header{

display:none;

}

.redes{

margin-top:10px;

}

.navbar-nav{

text-align:center;

}

.navbar-uriondo .nav-link{

padding:12px;

}

}


/* =========================
   RESPONSIVE CELULAR
========================= */

@media (max-width:576px){

.logo-header{

max-width:360px;
display:block;
margin:auto;
margin-bottom:10px;

}

}


/* =========================
   AJUSTE CONTAINER
========================= */

.container{
max-width:1200px;
}








/* =========================
   HERO CARRUSEL
========================= */

.carousel-item img{

height:600px;
object-fit:cover;

}

.carousel-caption{

background:rgba(0,0,0,0.4);
padding:20px;
border-radius:10px;

}

.carousel-caption h1{

font-size:48px;
font-weight:bold;

}

.carousel-caption p{

font-size:20px;

}


/* RESPONSIVE */

@media (max-width:768px){

.carousel-item img{

height:400px;

}

.carousel-caption h1{

font-size:28px;

}

}






/****************************************************/

.accesos{
background:#f8f9fa;
}

.acceso-card{
padding:25px;
border:none;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
transition:0.3s;
border-radius:10px;
}

.acceso-card i{
font-size:36px;
color:#1ea34a;
margin-bottom:10px;
}

.acceso-card:hover{
transform:translateY(-5px);
box-shadow:0 6px 18px rgba(0,0,0,0.15);
}
/**********************************/
.turismo{
background:white;
}

.turismo-card{
border:none;
box-shadow:0 4px 12px rgba(0,0,0,0.1);
transition:0.3s;
}

.turismo-card:hover{
transform:translateY(-6px);
}

.turismo-card img{
height:250px;
object-fit:cover;
}

/***********************************************/
.noticias{
background:#f8f9fa;
}

.noticia-card{
border:none;
box-shadow:0 4px 12px rgba(0,0,0,0.1);
transition:0.3s;
}

.noticia-card:hover{
transform:translateY(-6px);
}

.noticia-card img{
height:220px;
object-fit:cover;
}
/***********************************************/
.eventos{
background:white;
}

.evento-card{
display:flex;
align-items:center;
gap:20px;
padding:20px;
background:#f8f9fa;
border-radius:10px;
box-shadow:0 4px 10px rgba(0,0,0,0.08);
transition:0.3s;
}

.evento-card:hover{
transform:translateY(-5px);
}

.evento-fecha{
background:#1ea34a;
color:white;
padding:10px;
border-radius:8px;
text-align:center;
width:70px;
}

.evento-fecha span{
font-size:22px;
font-weight:bold;
display:block;
}

.evento-fecha p{
margin:0;
font-size:14px;
}

.evento-info h5{
margin:0;
font-weight:600;
}

.evento-info p{
margin:0;
font-size:14px;
color:#555;
}
/********************************************/
.galeria{
background:#f8f9fa;
}

.galeria-img{
border-radius:10px;
transition:0.3s;
cursor:pointer;
}

.galeria-img:hover{
transform:scale(1.05);
box-shadow:0 6px 18px rgba(0,0,0,0.2);
}
/**********************************************/
/* =========================
   MAPA MUNICIPIO
========================= */

.mapa-section{
background:#f8f9fa;
}

.titulo-mapa{
font-weight:600;
color:#333;
}

.subtitulo-mapa{
color:#666;
font-size:15px;
}

.mapa-wrapper{
width:100%;
height:450px;
border-radius:12px;
overflow:hidden;
box-shadow:0 6px 18px rgba(0,0,0,0.15);
margin:auto;
}

/* IFRAME MAPA */

.mapa-wrapper iframe{
width:100%;
height:100%;
border:0;
display:block;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width:768px){

.mapa-wrapper{
height:350px;
}

}

@media (max-width:480px){

.mapa-wrapper{
height:300px;
}

}
/*********************************************************/
/* =========================
   FOOTER
========================= */

.footer-uriondo{
background:#0b7d35;
color:white;
padding:50px 0 20px 0;
}

.footer-logo{
max-width:180px;
margin-bottom:15px;
}

.footer-text{
font-size:14px;
color:#d8ffd8;
}

.footer-uriondo h5{
margin-bottom:15px;
font-weight:600;
}

.footer-links{
list-style:none;
padding:0;
}

.footer-links li{
margin-bottom:8px;
}

.footer-links a{
color:#d8ffd8;
text-decoration:none;
transition:0.3s;
}

.footer-links a:hover{
color:white;
}

.footer-redes a{
display:inline-block;
width:36px;
height:36px;
line-height:36px;
text-align:center;
background:#1ea34a;
color:white;
border-radius:6px;
margin-right:6px;
transition:0.3s;
}

.footer-redes a:hover{
background:#0a5c26;
}

.footer-copy{
font-size:14px;
color:#d8ffd8;
margin-top:10px;
}
/***************************noticias*/
/* ========================= */
/* TITULO ESTILO PERIODICO */
/* ========================= */

.titulo-noticias-container{
text-align:center;
margin-bottom:50px;
}

.titulo-noticias{
font-size:40px;
font-weight:700;
letter-spacing:1px;
}

.linea-titulo{
width:90px;
height:4px;
background:#198754;
margin:15px auto;
border-radius:2px;
}

.subtitulo-noticias{
font-size:18px;
color:#666;
margin-top:10px;
}



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

.noticia-destacada img{
width:100%;
height:420px;
object-fit:cover;
border-radius:10px;
}

.contenido-destacado{
padding:20px 0;
}

.contenido-destacado h2{
font-size:32px;
font-weight:700;
margin-bottom:10px;
}

.fecha-noticia{
font-size:14px;
color:#888;
margin-bottom:10px;
}



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

.noticia-card{
border:none;
border-radius:10px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.08);
transition:0.3s;
}

.noticia-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.12);
}

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

.noticia-card .card-title{
font-size:20px;
font-weight:600;
margin-bottom:5px;
}

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



/* ========================= */
/* BOTON NOTICIA */
/* ========================= */

.btn-noticia{
background:#198754;
color:white;
border-radius:6px;
padding:8px 16px;
text-decoration:none;
font-size:14px;
}

.btn-noticia:hover{
background:#157347;
color:white;
}