/* JD THEME — Footer corporativo KOSMOS */
.pz-page { position:relative; box-sizing:border-box; padding-top:var(--pz-header-h,0); background:var(--pz-page-bg,#fff); min-height:100vh; min-height:100svh; }

.pz-footer { background:#06152f; color:#fff; border-top:1px solid rgba(255,255,255,.12); }
.pz-footer__panel { max-width:1350px; margin:0 auto; padding:clamp(46px,5vw,40px) clamp(24px,5vw,84px) 24px; }
.pz-footer__grid { display:grid; grid-template-columns:1.05fr .7fr 1.45fr 1fr; gap:clamp(30px,4vw,70px); align-items:start; }

.pz-footer__brand { min-width:0; display:flex; justify-content:center; }
/* Escritorio: el logo original sobre su tarjeta blanca, como siempre. */
.pz-footer__logo-card { display:inline-flex; align-items:center; justify-content:center; margin:0 auto; min-width:210px; max-width:290px; padding:12px 18px; background:#fff; border-radius:8px; box-shadow:0 8px 25px rgba(0,0,0,.12); }
.pz-logo--footer img { display:block; width:auto; max-width:100%; height:76px; object-fit:contain; }
.pz-logo--footer.pz-logo--footer--text, .pz-logo--footer.pz-logo--text { color:#0b2d62; }

.pz-fcol { min-width:0; }
.pz-fcol__title { margin:0 0 20px; color:#fff; font-size:16px; font-weight:800; letter-spacing:.035em; text-transform:uppercase; }
.pz-flinks { display:flex; flex-direction:column; gap:13px; margin:0; padding:0; list-style:none; }
.pz-flinks li { margin:0; }
.pz-footer a { color:rgba(255,255,255,.86); text-decoration:none; transition:color .2s,transform .2s; }
.pz-footer a:hover, .pz-footer a:focus-visible { color:#fff; text-decoration:none; }
.pz-flinks a { display:inline-flex; align-items:center; gap:8px; font-size:14px; line-height:1.4; }
.pz-flinks a::before { content:"›"; color:#5ea1ff; font-size:18px; line-height:1; }
.pz-flinks a:hover { transform:translateX(2px); }

.pz-fcontact { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:15px; }
.pz-fcontact li { display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start; margin:0; color:rgba(255,255,255,.86); font-size:14px; line-height:1.55; }
.pz-fcontact svg { color:#89b7ff; margin-top:1px; }

.pz-fsocial { display:flex; flex-direction:column; gap:12px; list-style:none; margin:0; padding:0; }
.pz-fsocial__link { display:flex!important; align-items:center; gap:10px; color:rgba(255,255,255,.86)!important; font-size:14px; }
.pz-fsocial__link svg { flex:0 0 auto; color:#89b7ff; }
.pz-fsocial__link:hover { color:#fff!important; transform:translateX(2px); }
.pz-footer__emails { display:flex; flex-direction:column; gap:5px; min-width:0; }
.pz-footer__emails a { overflow-wrap:anywhere; }

.pz-footer__legal { display:flex; justify-content:space-between; gap:20px; margin-top:clamp(40px,5vw,72px); padding-top:20px; border-top:1px solid rgba(255,255,255,.18); color:rgba(255,255,255,.62); font-size:12px; }
.pz-footer__credit { color:rgba(255,255,255,.72); }

/* ==============================
   RESPONSIVE DEL FOOTER
   - Escritorio (>1024px): la grilla de 4 columnas de arriba, intacta.
   - Tablet (801-1024px): las secciones se apilan una debajo de otra.
   - Celular y tablet chica (<=800px): Menu, Contactanos y Redes sociales
     desplegables (acordeon). El giro de la flecha y la apertura los maneja
     el mini-script que vive en footer.php agregando la clase .pz-abierta.
   ============================== */
@media (max-width:1024px){
	.pz-footer__grid { display:flex; flex-direction:column; gap:0; }
	/* En tablet y celular entra el logo transparente del header (lo cambia
	   el <picture> de footer.php): fuera la tarjeta blanca, logo grande y
	   centrado directo sobre el azul. */
	.pz-footer__logo-card { min-width:0; max-width:none; padding:0; background:transparent; border-radius:0; box-shadow:none; }
	.pz-footer__logo-card img { max-width:min(430px, 90vw); max-height:none; }
	.pz-footer__brand { padding:4px 0 22px; }
	.pz-fcol { width:100%; padding:18px 0; border-top:1px solid rgba(255,255,255,.12); }
	.pz-fcol__title { margin:0 0 12px; }
	.pz-fcol:last-child { padding-bottom:6px; }
}

@media (max-width:800px){
	/* El titulo de cada seccion se vuelve una fila tocable con flecha */
	.pz-fcol__title {
		display:flex; align-items:center; justify-content:space-between;
		gap:10px; margin:0; cursor:pointer;
		-webkit-tap-highlight-color:transparent; user-select:none;
	}
	.pz-fcol__title::after {
		content:""; width:9px; height:9px; flex-shrink:0;
		border-right:2px solid currentColor; border-bottom:2px solid currentColor;
		transform:rotate(45deg);            /* flecha hacia abajo */
		transition:transform .25s ease; margin-right:4px;
	}
	.pz-fcol.pz-abierta .pz-fcol__title::after { transform:rotate(225deg); }
	/* El contenido de cada seccion, plegado por defecto */
	.pz-fcol > :not(.pz-fcol__title) {
		overflow:hidden; max-height:0; opacity:0; margin-top:0;
		transition:max-height .3s ease, opacity .25s ease, margin-top .3s ease;
	}
	.pz-fcol.pz-abierta > :not(.pz-fcol__title) { max-height:520px; opacity:1; margin-top:12px; }
}

@media (max-width:760px){ .pz-footer__panel { padding-inline:22px; } }
@media (max-width:520px){ .pz-footer__legal { flex-direction:column; } }
.pz-contact-symbol { color:#89b7ff; font-size:18px; line-height:1; display:inline-flex; align-items:center; justify-content:center; width:20px; min-height:20px; }

.pz-footer__logo-card img {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 280px;
    max-height: 200px;
    height: auto;
    object-fit: contain;
}

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

.pz-fsocial {
	list-style: none;
	margin: 0;
	padding: 0;

	display: flex;
	flex-direction: column;
	gap: 12px;
}

.pz-fsocial li {
	margin: 0;
	padding: 0;
}

.pz-fsocial a {
	display: flex;
	align-items: center;
	gap: 10px;

	color: #ffffff;
	text-decoration: none;

	font-size: 15px;
	line-height: 1.4;

	transition: opacity 0.2s ease, transform 0.2s ease;
}

.pz-fsocial a img {
	width: 18px;
	height: 18px;

	object-fit: contain;
	display: block;

	flex-shrink: 0;
}

.pz-fsocial a:hover {
	color: #ffffff;
	opacity: 0.8;
	transform: translateX(3px);
}