/* =========================================================================
   css/secciones/somos2026.css - Seccion "Somos Staregister" 2026
   (secciones/somos2026.php). Solo la pestana "Staregister en el mundo";
   las demas usan los estilos de siempre.
   ========================================================================= */

.somos26-banner img {
	object-fit: cover;
}

/* ---------- Tarjeta de continente ---------- */
.somos26-continente {
	background-color: #f5f6f8;
	border-top: 3px solid var(--sr-yellow, #ffb800);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.somos26-continente:hover {
	box-shadow: 0 0.5rem 1.25rem rgba(35, 45, 59, 0.12);
	transform: translateY(-2px);
}

.somos26-icono {
	width: 36px;
	height: 36px;
	background-color: #232d3b;
	color: var(--sr-yellow, #ffb800);
	font-size: 1.1rem;
}

/* principal.css da estilo a todos los h3 (gris claro): aqui el de la tarjeta */
.somos26-continente .somos26-nombre {
	color: #333f4f;
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: 0.5px;
}

.somos26-cuenta {
	background-color: rgba(255, 184, 0, 0.18);
	color: #8a6000;
	font-weight: 600;
}

/* ---------- Paises (etiquetas) ---------- */
.somos26-pais {
	padding: 0.2rem 0.65rem;
	background-color: #fff;
	border: 1px solid #e3e5e9;
	color: #333f4f;
	font-size: 0.85rem;
	line-height: 1.5;
	white-space: nowrap;
}

/* Movil y tablet: menos hueco encima de las pestanas. Se sumaban el padding
   inferior de la seccion anterior (40px), el mt-5 de este bloque (48px)
   y el padding superior de la seccion (40px de movil.css). */
@media (max-width: 991.98px) {
	/* La ultima <section> que va antes del bloque (puede haber <link> o <script>
	   en medio, asi que no vale el selector de hermano inmediato) */
	section:has(~ .somos26-bloque):not(:has(~ section ~ .somos26-bloque)) {
		padding-bottom: 0 !important;
	}

	.somos26-bloque {
		margin-top: 1.5rem !important;
	}

	.somos26-bloque > .somos-section {
		padding-top: 0 !important;
	}
}
