/* ==================================================
CABECERA Y PIE — VERSION RESPONSIVE LIMPIA
================================================== */

/* =========================
CABECERA
========================= */

.pd-header{
background-color:var(--azul);
}

.pd-header .pd-container{
display:flex;
align-items:center;
justify-content:space-between;

max-width:1200px;
margin:auto;

padding:10px 20px;
gap:20px;
}

/* LOGO */

.pd-logo{
width:100px;
height:100px;
display:block;
}
/* =========================
MENU CABECERA
========================= */

.pd-nav{
display:flex;
align-items:center;
gap:28px;
}

.pd-nav-link{
color:var(--blanco);
text-decoration:none;
font-weight:600;
white-space:nowrap;
transition:0.2s;
}

.pd-nav-link:hover{
text-decoration:underline;
}
/* =========================
BOTON WHATSAPP
========================= */

.pd-whatsapp-btn{
background-color:var(--blanco);
color:var(--azul);

padding:10px 18px;

font-weight:600;
text-decoration:none;

border-radius:4px;
white-space:nowrap;

transition:0.2s;
}

.pd-whatsapp-btn:hover{
background-color:var(--rojo);
color:var(--blanco);
}

/* =========================
PIE
========================= */

.pd-footer{
background-color:var(--azul);
margin-top:40px;
}

.pd-footer .pd-container{

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

max-width:1200px;
margin:auto;

padding:20px;
gap:20px;
flex-wrap:wrap;
}

.pd-footer-text{
color:var(--texto-claro);
font-size:0.95rem;
margin:0;
max-width:600px;
}

/* links footer */

.pd-footer-text a{
color:#fff;
text-decoration:none;
font-weight:500;
}

.pd-footer-text a:hover{
text-decoration:underline;
}

/* =========================
REPUTACION CLIENTES
========================= */

.reputacion-clientes{
background:#f7f7f7;
padding:50px 20px;
text-align:center;
}

.rep-sub{
color:#666;
font-size:14px;
margin-bottom:20px;
}

.rep-box{
display:flex;
flex-direction:column;
align-items:center;
gap:20px;
}

.rep-icon{
width:40px;
margin-bottom:10px;
}
.rep-img{
width:100%;
max-width:500px;
height:auto;
}
/* =========================
HEADER FOOTER STACK FIX
========================= */

header{
position:relative;
z-index:10;
}

footer{
position:relative;
z-index:10;
}

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

@media (max-width:900px){

.pd-header .pd-container{
flex-direction:column;
justify-content:center;
gap:10px;
}

.pd-footer .pd-container{
flex-direction:column;
align-items:center;
text-align:center;
}

}

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

@media (max-width:600px){

.pd-logo{
width:80px;
height:80px;
}

.pd-header .pd-container{
padding:10px;
}

.pd-whatsapp-btn{
width:100%;
text-align:center;
}

.rep-img{
max-width:100%;
}

}
@media (max-width:900px){

.pd-nav{
justify-content:center;
}

}