/* =========================================================
VARIABLES
========================================================= */

:root{
--azul-minero:#0b1a2a;
--amarillo:#fcbf49;
--gris-fondo:#4CAF50;
--oro:#d4af37;
}

/* =========================================================
BASE
========================================================= */

body{
font-family:'Montserrat',sans-serif;
background:var(--gris-fondo);
color:#333;
overflow-x:hidden;
scroll-behavior:smooth;
}

.section{
padding:80px 0;
}

.section-title{
font-weight:700;
margin-bottom:40px;
color:var(--azul-minero);
text-align:center;
}

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

.navbar{
background:var(--azul-minero);
padding:10px 0;
z-index:100;
}

.navbar-brand img{
height:120px;
width:auto;
}

.navbar-brand .logo{
height:90px;
width:auto;
transition:.3s;
}

/* Tablet */

@media(max-width:992px){

.navbar-brand img{
height:80px;
}

}

/* Mobile */

@media(max-width:768px){

.navbar-brand .logo{
height:65px;
}

}

/* Celular peque単o */

@media(max-width:576px){

.navbar-brand img{
height:40px;
}

}

/* =========================================================
SCROLL OFFSET PARA NAVBAR
========================================================= */

section[id], header#inicio{
scroll-margin-top:100px;
}

@media(max-width:768px){

section[id], header#inicio{
scroll-margin-top:120px;
}

}


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

.footer-industrial{
background:#0d1b2a;
padding:55px 0 20px;
font-size:14px;
border-top:3px solid var(--amarillo);
}

.footer-title{
color:#fcbf49;
font-weight:600;
margin-bottom:18px;
}

.footer-text{
color:#d1d1d1;
line-height:1.7;
}

/* SERVICIOS */

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

.footer-links li{
margin-bottom:10px;
color:#d1d1d1;
}

/* CONTACTO */

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

.footer-contact-list li{
display:flex;
align-items:center;
gap:10px;
margin-bottom:10px;
color:#d1d1d1;
}

.footer-contact-list i{
color:#fcbf49;
min-width:18px;
}

.footer-contact-list a{
color:#d1d1d1;
text-decoration:none;
transition:0.3s;
}

.footer-contact-list a:hover{
color:#fcbf49;
}

/* WHATSAPP */ 

.whatsapp-btn{
display:inline-flex;
align-items:center;
gap:8px;
padding:6px 12px;
background:#25D366;
color:white;
border-radius:6px;
font-weight:600;
text-decoration:none;
transition:all 0.3s ease;
}

.whatsapp-btn:hover{
background:#1ebe5d;
transform:translateY(-2px);
}

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

.social-container{
margin-top:10px;
}

.social-icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
border-radius:50%;
background:#1b2f45;
color:#fcbf49;
margin:0 5px;
font-size:18px;
transition:0.3s;
}

.social-icon:hover{
background:#fcbf49;
color:#0d1b2a;
transform:translateY(-3px);
}

.footer-line{
border-color:#2c3e50;
margin:30px 0;
}

.footer-bottom{
font-size:13px;
color:#bfbfbf;
}

/* ========================================
TABLET GRANDE (<= 1200px)
======================================== */
@media (max-width:1200px){

.section{
padding:70px 0;
}

.navbar-brand img{
height:100px;
}

}


/* ========================================
TABLET (<= 992px)
======================================== */
@media (max-width:992px){

.section{
padding:60px 0;
}

.section-title{
font-size:1.6rem;
margin-bottom:30px;
}

.navbar{
padding:8px 0;
}

.navbar-brand img{
height:80px;
}

.footer-industrial{
padding:45px 0 15px;
text-align:center;
}

.footer-contact-list li{
justify-content:center;
}

}


/* ========================================
MÓVIL (<= 768px)
======================================== */
@media (max-width:768px){

.section{
padding:50px 0;
}

.section-title{
font-size:1.4rem;
}

.navbar-brand{
flex-direction:row; /* 🔥 clave */
justify-content:center;
}

.navbar-brand img{
height:60px;
}

.navbar-brand span{
font-size:.8rem;
}

.footer-text{
font-size:13px;
}

.footer-links li{
font-size:13px;
}

.footer-contact-list{
align-items:center;
}

.footer-contact-list li{
flex-direction:column;
gap:5px;
}

.social-icon{
width:34px;
height:34px;
font-size:16px;
}

.whatsapp-btn{
width:100%;
justify-content:center;
}

}


/* ========================================
MÓVIL PEQUEÑO (<= 480px)
======================================== */
@media (max-width:480px){

.section{
padding:40px 0;
}

.section-title{
font-size:1.2rem;
}

.navbar-brand img{
height:50px;
}

.navbar-brand span{
font-size:.75rem;
}

.footer-industrial{
padding:35px 0 10px;
}

.footer-title{
font-size:14px;
}

.footer-bottom{
font-size:12px;
}

.social-icon{
width:32px;
height:32px;
font-size:14px;
}

}