/* El pie 2027. Creado 2026-09-17 · v1.0.0
   Regla de la casa: cada cambio de CSS = nombre de archivo nuevo (WP Rocket).
   Todo prefijado con .f27 para ganarle al kit de Elementor. */

.f27{
	--f27-naranja:#F57C00;
	--f27-marron:#7A5238;
	--f27-tinta:#1B1512;
	--f27-gris:#8A817B;
	--f27-linea:#E8E2DA;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
	border-top:4px solid var(--f27-naranja);
	background:#fff;
}
.f27 .f27-dentro{
	max-width:1280px;
	margin:0 auto;
	padding:0 22px;
	box-sizing:border-box;
}

/* ---------- fila de arriba ---------- */
.f27 .f27-fila1{
	display:flex;
	align-items:center;
	gap:26px;
	padding-top:24px;
	padding-bottom:22px;
	flex-wrap:wrap;
}
.f27 .f27-marca{
	display:flex;
	align-items:center;
	gap:13px;
	text-decoration:none;
	flex:none;
}
.f27 .f27-marca img{width:64px;height:64px;object-fit:contain;display:block}
/* 1.1.1: el logo de texto de siempre al lado del escudo (panel Cabecera y pie › Logo de texto). */
/* 1.1.2: un poco más pequeño (Angel). */
.f27 .f27-marca img.f27-logo{width:auto;height:auto;max-width:min(200px,55vw);max-height:46px}
.f27 .f27-marca-texto strong{
	display:block;
	font-family:"Oswald",sans-serif;
	font-weight:500;
	font-size:21px;
	letter-spacing:.02em;
	text-transform:uppercase;
	color:var(--f27-tinta);
}
.f27 .f27-marca-texto strong em{font-style:normal;color:var(--f27-naranja)}
.f27 .f27-marca-texto small{
	display:block;
	margin-top:2px;
	font-size:12.5px;
	color:var(--f27-gris);
}

.f27 .f27-redes{display:flex;gap:9px;margin:0;padding:0;list-style:none;flex:none}
.f27 .f27-redes a{
	display:grid;
	place-items:center;
	width:36px;height:36px;
	border:1px solid var(--f27-linea);
	border-radius:50%;
	color:var(--f27-marron);
	text-decoration:none;
	transition:color .18s ease,border-color .18s ease;
}
.f27 .f27-redes a:hover{color:var(--f27-naranja);border-color:var(--f27-naranja)}

.f27 .f27-servicios{
	display:flex;
	flex-wrap:wrap;
	gap:6px 22px;
	margin-left:auto;
}
.f27 .f27-servicios a{
	position:relative;
	font-family:"Oswald",sans-serif;
	font-size:15px;
	font-weight:500;
	letter-spacing:.02em;
	color:var(--f27-marron);
	text-decoration:none;
	padding-bottom:2px;
	border-bottom:2px solid transparent;
}
.f27 .f27-servicios a:hover{color:var(--f27-naranja);border-bottom-color:var(--f27-naranja)}

/* ---------- las seis columnas ---------- */
.f27 .f27-columnas{
	display:grid;
	grid-template-columns:repeat(6,1fr);
	gap:26px;
	padding-top:24px;
	padding-bottom:30px;
	border-top:1px solid var(--f27-linea);
}
.f27 .f27-col-titulo{
	display:block;
	margin-bottom:11px;
	font-family:"Oswald",sans-serif;
	font-weight:400;
	font-size:17px;
	letter-spacing:.04em;
	text-transform:uppercase;
	color:var(--f27-naranja);
	text-decoration:none;
}
.f27 .f27-col-titulo:hover{color:var(--f27-marron)}
.f27 .f27-col ul{margin:0;padding:0;list-style:none}
.f27 .f27-col li{margin:0 0 7px}
.f27 .f27-col a{
	font-size:14px;
	line-height:1.4;
	color:#4A443F;
	text-decoration:none;
}
.f27 .f27-col li a:hover{color:var(--f27-naranja)}

/* ---------- la franja oscura ---------- */
.f27 .f27-bajo{background:var(--f27-tinta);padding:16px 0 18px}
.f27 .f27-bajo .f27-dentro{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	gap:10px 24px;
}
.f27 .f27-legal{display:flex;flex-wrap:wrap;gap:6px 20px}
.f27 .f27-legal a{
	font-size:13px;
	color:rgba(255,255,255,.80);
	text-decoration:none;
}
.f27 .f27-legal a:hover{color:#fff;text-decoration:underline}
.f27 .f27-copy{
	margin:0;
	font-size:12.5px;
	color:rgba(255,255,255,.55);
}

/* ---------- tableta ---------- */
@media (max-width:1024px){
	.f27 .f27-dentro{padding:0 18px}
	.f27 .f27-columnas{grid-template-columns:repeat(3,1fr);gap:22px}
	.f27 .f27-servicios{margin-left:0;flex:1 0 100%}
}

/* ---------- movil ---------- */
@media (max-width:640px){
	.f27 .f27-dentro{padding:0 16px}
	.f27 .f27-fila1{gap:16px;padding-top:20px;padding-bottom:18px}
	.f27 .f27-columnas{grid-template-columns:repeat(2,1fr);gap:18px;padding-bottom:24px}
	.f27 .f27-servicios{gap:6px 16px}
	.f27 .f27-servicios a{font-size:14px}
	.f27 .f27-bajo .f27-dentro{flex-direction:column;align-items:flex-start}
	.f27 .f27-legal{gap:6px 14px}
	.f27 .f27-legal a{font-size:12.5px}
}

/* El numero de la ficha o la pagina, para localizarla en WordPress.
   Añadido 2026-09-18 a peticion de Angel. */
.f27-id {
	opacity: .55;
	font-variant-numeric: tabular-nums;
}

/* 1.1.3 (2026-09-29, tema 5.12.0) — Iconos, opción B de Angel: el logo de cada red
   solo, relleno y a 28 px, sin el círculo alrededor. */
.f27 .f27-redes{gap:6px;align-items:center}
.f27 .f27-redes a{width:40px;height:40px;border:0;border-radius:8px}
.f27 .f27-redes a:hover,.f27 .f27-redes a:focus-visible{color:var(--f27-naranja)}

/* 1.1.4 (2026-09-29, tema 5.14.5) — Las redes del pie, como las de la ficha
   (Angel: «estos como los otros»): círculo blanco de 42 px, logo naranja de
   trazo a 24 px, sombra suave y un pequeño salto al pasar por encima. */
.f27 .f27-redes{gap:8px}
.f27 .f27-redes a{
	width:42px;height:42px;border:0;border-radius:50%;
	background:#fff;color:var(--f27-naranja);
	box-shadow:0 3px 10px rgba(27,21,18,.10);
	transition:transform .2s ease,box-shadow .2s ease,color .2s ease;
}
.f27 .f27-redes a svg{width:24px;height:24px}
.f27 .f27-redes a:hover,.f27 .f27-redes a:focus-visible{
	color:var(--f27-naranja);
	transform:translateY(-2px);
	box-shadow:0 5px 14px rgba(27,21,18,.15);
}
@media (prefers-reduced-motion:reduce){
	.f27 .f27-redes a:hover,.f27 .f27-redes a:focus-visible{transform:none}
}
