/* Páginas fijas: Nosotros, Administración de edificios y el blog.

   La paleta se repite aquí a propósito: buscador.css, que es donde vive el
   :root original, NO se carga en estas páginas, y sin las variables se caían
   los fondos naranjas y los bordes (una var indefinida invalida toda la
   declaración). Los valores son los mismos; si cambian, cambian en los dos.

   Todo cuelga de .solis-pagina / .solis-blog para no chocar con Elementor, que
   sigue pintando la cabecera y el pie. OJO: .solis-pag (sin "ina") ya está
   cogido por los botones de paginación del buscador. */

:root {
	--solis-naranja: #FA6407;
	--solis-naranja-oscuro: #E85500;
	--solis-texto: #111;
	--solis-gris: #7A7A7A;
	--solis-borde: #E4E4E4;
	--solis-fondo: #F4F5F7;
	--solis-radio: 14px;
}

.solis-pagina {
	--verde: #16211B;
	--verde-claro: #7FB539;
	color: var(--solis-texto);
	font-family: var(--solis-tipo, inherit);
}

/* Aire entre el menú y la portada de la página. Sin esto la tarjeta oscura
   arranca pegada a la cabecera, que también es oscura, y las dos se leen
   como un solo bloque. */
.solis-pagina--nosotros,
.solis-pagina--admin { padding-top: 32px; }

/* ------------------------------------------------------------------ hero */

.solis-pagina__hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 420px;
	border-radius: 22px;
	overflow: hidden;
	background: var(--verde);
	padding: 44px;
	box-sizing: border-box;
}

/* La foto va como capa de fondo, nunca a tamaño natural: así es como la
   página anterior acababa midiendo miles de píxeles de alto. */
.solis-pagina .solis-pagina__hero-foto {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.solis-pagina__hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(10, 20, 15, .92) 0%, rgba(10, 20, 15, .72) 45%, rgba(10, 20, 15, .25) 100%);
}

.solis-pagina__hero--marca::after { display: none; }

.solis-pagina__hero-texto {
	position: relative;
	z-index: 1;
	max-width: 620px;
	color: #fff;
}

.solis-pagina__hero-texto h1 {
	margin: 0 0 14px !important;
	font-size: clamp(30px, 3.6vw, 46px) !important;
	line-height: 1.14;
	font-weight: 700;
	color: #fff !important;
	text-transform: none;
}

.solis-pagina__hero-bajada {
	margin: 0 0 26px;
	font-size: 16.5px;
	line-height: 1.65;
	color: rgba(255, 255, 255, .84);
}

.solis-pagina__hero-botones { display: flex; flex-wrap: wrap; gap: 12px; }

/* Hero de Administración: sin foto, con el logotipo del servicio al lado. */
.solis-pagina__hero--marca {
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	background:
		radial-gradient(120% 140% at 100% 0%, #24382D 0%, rgba(36, 56, 45, 0) 60%),
		var(--verde);
}

.solis-pagina__hero-marca {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	width: 240px;
	padding: 26px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .28);
}

.solis-pagina__hero-marca img { width: 100%; height: auto; display: block; }

/* --------------------------------------------------------------- botones */

.solis-pagina__boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 24px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	border: 1.5px solid transparent;
	transition: background .18s, color .18s, border-color .18s, transform .18s;
}

.solis-pagina__boton:hover { transform: translateY(-1px); }

.solis-pagina__boton--naranja { background: var(--solis-naranja); color: #fff !important; }
.solis-pagina__boton--naranja:hover { background: var(--solis-naranja-oscuro); color: #fff !important; }

.solis-pagina__boton--linea-claro { border-color: rgba(255, 255, 255, .55); color: #fff !important; }
.solis-pagina__boton--linea-claro:hover { background: rgba(255, 255, 255, .12); color: #fff !important; }

.solis-pagina__boton--blanco { background: #fff; color: var(--solis-naranja) !important; }
.solis-pagina__boton--blanco:hover { background: #FFF3EA; color: var(--solis-naranja-oscuro) !important; }

.solis-pagina__boton--linea { border-color: rgba(255, 255, 255, .7); color: #fff !important; }
.solis-pagina__boton--linea:hover { background: rgba(255, 255, 255, .14); color: #fff !important; }

/* ------------------------------------------------------------- secciones */

.solis-pagina__seccion { padding: 72px 0 0; }
.solis-pagina__seccion--sin-tope { padding-top: 56px; padding-bottom: 8px; }

/* Franja gris a todo el ancho de la caja de contenido. */
.solis-pagina__seccion--gris {
	margin-top: 72px;
	padding: 56px 32px 60px;
	border-radius: 22px;
	background: var(--solis-fondo);
}

.solis-pagina__cabecera { text-align: center; max-width: 720px; margin: 0 auto 36px; }

.solis-pagina__kicker {
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--solis-naranja);
}

.solis-pagina__kicker--claro { color: #fff; opacity: .8; }

.solis-pagina__titulo {
	margin: 0 0 12px !important;
	font-size: clamp(24px, 2.6vw, 34px) !important;
	line-height: 1.2;
	font-weight: 700;
	text-transform: none;
}

.solis-pagina__titulo span { color: var(--verde-claro); }

.solis-pagina__bajada { margin: 0; font-size: 15.5px; line-height: 1.65; color: #4A4A4A; }

.solis-pagina__parrafo { margin: 0 0 20px; font-size: 16px; line-height: 1.8; color: #3C3C3C; }

.solis-pagina__enlace {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 700;
	color: var(--solis-naranja) !important;
	text-decoration: none;
}

.solis-pagina__enlace svg { width: 17px; height: 17px; transition: transform .18s; }
.solis-pagina__enlace:hover svg { transform: translateX(3px); }

/* --------------------------------------------------- nosotros: cifras */

/* Texto a la izquierda y cifras a la derecha: en la versión anterior las
   cifras iban en una fila suelta y no se relacionaban con nada. */
.solis-pagina__quienes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}

.solis-pagina__quienes .solis-pagina__cabecera { text-align: left; margin-left: 0; margin-bottom: 20px; }

.solis-pagina__cifras {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.solis-pagina__cifras li {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 22px 20px;
	border: 1px solid var(--solis-borde);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .04);
}

.solis-pagina__cifra-icono {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 6px;
	border-radius: 12px;
	background: #FFF1E6;
	color: var(--solis-naranja);
}

.solis-pagina__cifra-icono svg { width: 21px; height: 21px; }

.solis-pagina__cifras b { font-size: 26px; font-weight: 700; line-height: 1.1; }
.solis-pagina__cifras small { font-size: 13px; line-height: 1.5; color: var(--solis-gris); }

/* ------------------------------------------------- misión / visión / dos */

.solis-pagina__dos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
}

.solis-pagina__tarjeta {
	padding: 30px 28px;
	border-radius: 18px;
	background: #fff;
	border: 1px solid var(--solis-borde);
}

.solis-pagina__tarjeta-icono {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: 16px;
	border-radius: 14px;
	background: var(--verde);
	color: #fff;
}

.solis-pagina__tarjeta-icono svg { width: 24px; height: 24px; }

.solis-pagina__tarjeta h3 {
	margin: 0 0 10px !important;
	font-size: 20px !important;
	font-weight: 700;
	text-transform: none;
}

.solis-pagina__tarjeta p { margin: 0; font-size: 15px; line-height: 1.75; color: #4A4A4A; }

/* ------------------------------------------- administración: servicios */

.solis-pagina__servicios {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

.solis-serv-ed {
	display: flex;
	flex-direction: column;
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--solis-borde);
	transition: box-shadow .2s, transform .2s;
}

.solis-serv-ed:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(0, 0, 0, .1); }

.solis-serv-ed__foto { aspect-ratio: 16 / 10; overflow: hidden; }

/* Nivel extra de especificidad: Elementor impone img { height: auto } y
   dejaba una banda gris bajo cada foto. */
.solis-serv-ed .solis-serv-ed__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .5s ease;
}

.solis-serv-ed:hover .solis-serv-ed__foto img { transform: scale(1.05); }

.solis-serv-ed__cuerpo { padding: 20px 22px 24px; }

.solis-serv-ed__cuerpo h3 {
	margin: 0 0 8px !important;
	font-size: 17px !important;
	font-weight: 700;
	text-transform: none;
}

.solis-serv-ed__cuerpo p { margin: 0; font-size: 14px; line-height: 1.65; color: #4A4A4A; }

/* ----------------------------------------------------------------- pasos */

.solis-pagina__pasos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
	counter-reset: paso;
}

.solis-pagina__pasos li {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 26px 22px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid var(--solis-borde);
}

.solis-pagina__paso-num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin-bottom: 6px;
	border-radius: 50%;
	background: var(--solis-naranja);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
}

.solis-pagina__pasos b { font-size: 16px; font-weight: 700; }
.solis-pagina__pasos span:not(.solis-pagina__paso-num) { font-size: 14px; line-height: 1.6; color: #4A4A4A; }

/* ------------------------------------------------------------- edificios */

.solis-edificio {
	display: flex;
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--solis-borde);
}

.solis-edificio__foto { flex: 0 0 40%; position: relative; min-height: 190px; }

.solis-edificio .solis-edificio__foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.solis-edificio__cuerpo { padding: 24px 24px; display: flex; flex-direction: column; gap: 8px; }

.solis-edificio__cuerpo h3 {
	margin: 0 !important;
	font-size: 18px !important;
	font-weight: 700;
	line-height: 1.3;
	text-transform: none;
}

.solis-edificio__zona {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 4px;
	font-size: 14px;
	color: var(--solis-gris);
}

.solis-edificio__zona svg { width: 16px; height: 16px; flex: 0 0 auto; }

/* ---------------------------------------------------------------- cierre */

.solis-pagina__cierre {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
	padding: 38px 40px;
	border-radius: 22px;
	background: linear-gradient(100deg, var(--solis-naranja) 0%, #FF8A3D 100%);
	color: #fff;
}

.solis-pagina__cierre h2 {
	margin: 0 0 8px !important;
	font-size: clamp(21px, 2.2vw, 28px) !important;
	font-weight: 700;
	color: #fff !important;
	text-transform: none;
}

.solis-pagina__cierre p { margin: 0; font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .92); max-width: 560px; }

.solis-pagina__cierre-botones { display: flex; gap: 12px; flex-wrap: wrap; }

.solis-pagina__contacto-extra {
	margin: 18px 0 0;
	text-align: center;
	font-size: 14.5px;
	color: var(--solis-gris);
}

.solis-pagina__contacto-extra a { color: var(--solis-naranja) !important; font-weight: 600; text-decoration: none; }

/* --------------------------------------------------------------- móviles */

@media (max-width: 1024px) {
	.solis-pagina__servicios { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.solis-pagina__pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.solis-pagina__quienes { grid-template-columns: 1fr; gap: 32px; }
	.solis-pagina__hero--marca { flex-direction: column; align-items: flex-start; }
	.solis-pagina__hero-marca { width: 180px; }
}

@media (max-width: 760px) {
	.solis-pagina__hero { min-height: 340px; padding: 30px 24px; border-radius: 18px; }
	.solis-pagina__seccion { padding-top: 52px; }
	.solis-pagina__seccion--gris { margin-top: 52px; padding: 40px 20px 44px; }
	.solis-pagina__dos { grid-template-columns: 1fr; }
	.solis-pagina__servicios { grid-template-columns: 1fr; }
	.solis-pagina__pasos { grid-template-columns: 1fr; }
	.solis-pagina__cifras { grid-template-columns: 1fr 1fr; }
	.solis-edificio { flex-direction: column; }
	.solis-edificio__foto { flex: none; height: 180px; }
	.solis-pagina__cierre { padding: 28px 24px; }
	.solis-pagina__boton { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.solis-pagina__boton,
	.solis-serv-ed,
	.solis-serv-ed__foto img,
	.solis-pagina__enlace svg { transition: none; }
	.solis-serv-ed:hover { transform: none; }
	.solis-serv-ed:hover .solis-serv-ed__foto img { transform: none; }
}

/* ================================================================== blog */

.solis-blog__hero {
	position: relative;
	margin-bottom: 44px;
	padding: 54px 44px;
	border-radius: 22px;
	background:
		radial-gradient(110% 150% at 100% 0%, #24382D 0%, rgba(36, 56, 45, 0) 62%),
		#16211B;
	color: #fff;
	text-align: center;
}

.solis-blog__hero .solis-pagina__kicker { color: #fff; opacity: .8; }

.solis-blog__hero h1 {
	margin: 0 auto 12px !important;
	max-width: 760px;
	font-size: clamp(27px, 3.2vw, 40px) !important;
	line-height: 1.18;
	font-weight: 700;
	color: #fff !important;
	text-transform: none;
}

.solis-blog__hero p {
	margin: 0 auto;
	max-width: 620px;
	font-size: 16px;
	line-height: 1.65;
	color: rgba(255, 255, 255, .82);
}

/* Portada de reserva cuando el artículo no tiene imagen destacada: el
   degradado de marca con la casita, en vez de un recuadro gris vacío. */
.solis-blog__tapa {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #16211B 0%, #24382D 55%, #2F4A3B 100%);
	color: rgba(255, 255, 255, .5);
}

.solis-blog__tapa svg { width: 54px; height: 54px; }

/* Destacado: el artículo más reciente ocupa una tarjeta ancha. Con pocos
   artículos publicados, una rejilla de tres columnas dejaba huecos. */
.solis-blog__destacado {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 0;
	margin-bottom: 40px;
	border-radius: 20px;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--solis-borde);
	box-shadow: 0 4px 20px rgba(0, 0, 0, .06);
}

.solis-blog__destacado-media { position: relative; min-height: 300px; line-height: 0; }

.solis-blog__destacado .solis-blog__destacado-media img,
.solis-blog__destacado .solis-blog__tapa {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.solis-blog__destacado-cuerpo {
	padding: 38px 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 12px;
}

.solis-blog__etiqueta {
	align-self: flex-start;
	padding: 5px 12px;
	border-radius: 999px;
	background: #FFF1E6;
	color: var(--solis-naranja);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.solis-blog__destacado-cuerpo h2 {
	margin: 0 !important;
	font-size: clamp(21px, 2.2vw, 28px) !important;
	line-height: 1.25;
	font-weight: 700;
	text-transform: none;
}

.solis-blog__destacado-cuerpo h2 a { color: var(--solis-texto) !important; text-decoration: none; }
.solis-blog__destacado-cuerpo h2 a:hover { color: var(--solis-naranja) !important; }

.solis-blog__destacado-cuerpo .solis-blog__extracto { font-size: 15px; flex: none; }

/* Pie del listado: mientras haya pocos artículos, el visitante siempre
   tiene a mano el catálogo. */
.solis-blog__pie {
	margin-top: 56px;
	padding: 34px 36px;
	border-radius: 20px;
	background: var(--solis-fondo);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.solis-blog__pie h2 {
	margin: 0 0 6px !important;
	font-size: 21px !important;
	font-weight: 700;
	text-transform: none;
}

.solis-blog__pie p { margin: 0; font-size: 14.5px; color: #4A4A4A; }

@media (max-width: 860px) {
	.solis-blog__destacado { grid-template-columns: 1fr; }
	.solis-blog__destacado-media { min-height: 210px; }
	.solis-blog__destacado-cuerpo { padding: 26px 24px 30px; }
	.solis-blog__hero { padding: 36px 22px; }
	.solis-blog__pie { padding: 26px 22px; }
}