/* =========================================================================
   BPI Inicio — composición inspirada en Finbuzz con la paleta institucional
   de BuenasPrácticas S.R.L. (colores tomados de los logos oficiales).
   ========================================================================= */

/* ---------- Tokens ---------- */
.bpin {
	--bpin-primario: #7C122F;
	--bpin-primario-hover: #74122B;
	--bpin-acento: #CB3343;
	--bpin-gris: #A4A1A2;
	--bpin-titulos: #231F20;
	--bpin-oscuro: #1C1E22;
	--bpin-texto: #606164;
	--bpin-claro: #F4F5F8;
	--bpin-blanco: #FFFFFF;
	--bpin-borde: #E4E4E4;
	--bpin-suave: color-mix(in srgb, var(--bpin-primario) 8%, #fff);
	--bpin-sombra: 0 14px 40px rgba(35, 31, 32, .08);
	--bpin-sombra-alta: 0 22px 50px rgba(35, 31, 32, .14);
	--bpin-radio: 6px;
	--bpin-fuente-titulos: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
	--bpin-fuente-texto: 'Source Sans 3', 'Source Sans Pro', 'Segoe UI', Arial, sans-serif;
	--bpin-transicion: .35s cubic-bezier(.2, .7, .2, 1);

	font-family: var(--bpin-fuente-texto);
	font-size: 17px;
	line-height: 1.7;
	color: var(--bpin-texto);
	-webkit-font-smoothing: antialiased;
}

.bpin *,
.bpin *::before,
.bpin *::after {
	box-sizing: border-box;
}

.bpin h1, .bpin h2, .bpin h3, .bpin h4 {
	font-family: var(--bpin-fuente-titulos);
	color: var(--bpin-titulos);
	margin: 0;
	letter-spacing: -.01em;
	text-transform: none;
}

.bpin p {
	margin: 0;
}

/* El tema colorea <strong>: aquí hereda del contenedor salvo indicación propia. */
.bpin strong {
	color: inherit;
}

.bpin a {
	color: inherit;
	text-decoration: none;
	transition: color var(--bpin-transicion), background-color var(--bpin-transicion), border-color var(--bpin-transicion);
}

.bpin ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bpin img {
	display: block;
	max-width: 100%;
	height: auto;
}

.bpin button {
	font: inherit;
	cursor: pointer;
}

.bpin :focus-visible {
	outline: 2px solid var(--bpin-acento);
	outline-offset: 3px;
}

.bpin-oculto {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.bpin-sin-scroll,
.bpin-sin-scroll body {
	overflow: hidden;
}

body.bpin-pagina {
	background: #fff;
	overflow-x: hidden;
}

/* ---------- Estructura ---------- */
.bpin-contenedor {
	width: 100%;
	max-width: 1230px;
	margin: 0 auto;
	padding: 0 15px;
}

.bpin-seccion {
	position: relative;
	padding: 110px 0;
	/* Los adornos (anillo giratorio, puntos) no deben generar desplazamiento horizontal. */
	overflow-x: clip;
}

.bpin-seccion--clara {
	background:
		radial-gradient(circle, rgba(124, 18, 47, .07) 1.5px, transparent 1.6px) 0 0 / 22px 22px,
		var(--bpin-claro);
}

.bpin-seccion--oscura {
	background:
		linear-gradient(rgba(28, 30, 34, .9), rgba(28, 30, 34, .94)),
		var(--bpin-fondo, none) center / cover no-repeat,
		var(--bpin-oscuro);
	color: rgba(255, 255, 255, .78);
}

.bpin-seccion--oscura .bpin-titulo,
.bpin-seccion--oscura h3 {
	color: #fff;
}

.bpin-dos-columnas {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 70px;
	align-items: center;
}

.bpin-rejilla {
	display: grid;
	gap: 30px;
}

.bpin-rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bpin-rejilla--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- Encabezados de sección ---------- */
.bpin-etiqueta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
	padding: 5px 14px 5px 12px;
	border-left: 3px solid var(--bpin-primario);
	background: var(--bpin-suave);
	color: var(--bpin-primario);
	font-family: var(--bpin-fuente-titulos);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.bpin-etiqueta--solida {
	border-left-color: var(--bpin-acento);
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-etiqueta--clara {
	border-left-color: var(--bpin-acento);
	background: rgba(255, 255, 255, .1);
	color: #fff;
}

.bpin-titulo {
	font-size: clamp(30px, 3.1vw, 42px);
	font-weight: 700;
	line-height: 1.22;
	margin-bottom: 20px !important;
}

.bpin-titulo span {
	color: var(--bpin-primario);
}

.bpin-seccion--oscura .bpin-titulo span {
	color: var(--bpin-acento);
}

.bpin-parrafo {
	margin-bottom: 28px !important;
}

.bpin-encabezado {
	margin-bottom: 55px;
}

.bpin-encabezado--partido {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 60px;
	align-items: end;
}

.bpin-encabezado--partido .bpin-titulo,
.bpin-encabezado--partido .bpin-parrafo {
	margin-bottom: 0 !important;
}

.bpin-encabezado--boton {
	grid-template-columns: minmax(0, 1fr) auto;
}

.bpin-encabezado--centrado {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* ---------- Botones y enlaces ---------- */
.bpin-boton {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 16px 28px;
	border: 0;
	border-radius: 4px;
	font-family: var(--bpin-fuente-titulos);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .06em;
	text-transform: uppercase;
	overflow: hidden;
	isolation: isolate;
	transition: color var(--bpin-transicion), background-color var(--bpin-transicion), transform var(--bpin-transicion);
}

.bpin-boton::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform var(--bpin-transicion);
}

.bpin-boton:hover::before,
.bpin-boton:focus-visible::before {
	transform: scaleX(1);
	transform-origin: left;
}

.bpin-boton .bpin-svg {
	width: 18px;
	height: 18px;
	transition: transform var(--bpin-transicion);
}

.bpin-boton:hover .bpin-svg {
	transform: translateX(4px);
}

.bpin-boton--primario {
	background: var(--bpin-primario);
	color: #fff !important;
}

.bpin-boton--primario::before {
	background: var(--bpin-titulos);
}

.bpin-boton--claro {
	background: #fff;
	color: var(--bpin-primario) !important;
}

.bpin-boton--claro::before {
	background: var(--bpin-titulos);
}

.bpin-boton--claro:hover {
	color: #fff !important;
}

.bpin-enlace {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.bpin-enlace .bpin-svg {
	width: 16px;
	height: 16px;
	color: var(--bpin-primario);
	transition: transform var(--bpin-transicion);
}

.bpin-enlace:hover {
	color: var(--bpin-primario);
}

.bpin-enlace:hover .bpin-svg {
	transform: translateX(4px);
}

.bpin-flecha {
	display: inline-grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 50%;
	background: transparent;
	color: #fff;
	transition: background-color var(--bpin-transicion), border-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-flecha:hover {
	border-color: var(--bpin-primario);
	background: var(--bpin-primario);
}

.bpin-flecha--oscura {
	border-color: var(--bpin-borde);
	background: #fff;
	color: var(--bpin-titulos);
}

.bpin-flecha--oscura:hover {
	color: #fff;
}

.bpin-flecha:disabled {
	opacity: .4;
	cursor: default;
	pointer-events: none;
}

.bpin-flecha .bpin-svg {
	width: 22px;
	height: 22px;
}

.bpin-puntos {
	display: flex;
	gap: 10px;
	align-items: center;
}

.bpin-puntos__item {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 10px;
	background: rgba(255, 255, 255, .45);
	transition: width var(--bpin-transicion), background-color var(--bpin-transicion);
}

.bpin-puntos__item.es-activo {
	width: 30px;
	background: #fff;
}

/* Botón de reproducción con ondas */
.bpin-play {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 0;
	border: 0;
	background: none;
	color: #fff;
	font-family: var(--bpin-fuente-titulos);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.bpin-play__circulo {
	position: relative;
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: #fff;
	color: var(--bpin-primario);
	transition: transform var(--bpin-transicion);
}

.bpin-play__circulo::before,
.bpin-play__circulo::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .6);
	animation: bpin-onda 2.4s ease-out infinite;
}

.bpin-play__circulo::after {
	animation-delay: 1.2s;
}

.bpin-play__circulo .bpin-svg {
	width: 22px;
	height: 22px;
	margin-left: 3px;
}

.bpin-play:hover .bpin-play__circulo {
	transform: scale(1.08);
}

.bpin-play--grande .bpin-play__circulo {
	width: 96px;
	height: 96px;
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-play--grande .bpin-play__circulo::before,
.bpin-play--grande .bpin-play__circulo::after {
	border-color: rgba(124, 18, 47, .7);
	border-width: 2px;
}

.bpin-play--grande .bpin-play__circulo .bpin-svg {
	width: 30px;
	height: 30px;
}

@keyframes bpin-onda {
	from { transform: scale(1); opacity: .9; }
	to { transform: scale(1.9); opacity: 0; }
}

/* Listas con marca de verificación */
.bpin-checks {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 24px;
	margin-bottom: 32px !important;
}

.bpin-checks li {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: 16px;
	font-weight: 500;
}

.bpin-checks .bpin-svg {
	flex: none;
	width: 26px;
	height: 26px;
	padding: 5px;
	border-radius: 50%;
	background: var(--bpin-primario);
	color: #fff;
	stroke-width: 3;
}

.bpin-checks--claros li {
	color: #fff;
}

/* Patrón de puntos decorativo */
.bpin-puntos-deco {
	position: absolute;
	top: -30px;
	left: -30px;
	z-index: 0;
	width: 170px;
	height: 170px;
	background: radial-gradient(circle, var(--bpin-primario) 2px, transparent 2.2px) 0 0 / 17px 17px;
	opacity: .35;
}

.bpin-puntos-deco--abajo {
	top: auto;
	left: auto;
	right: 0;
	bottom: -10px;
}

/* Animación de aparición */
.bpin-js .bpin-revelar {
	opacity: 0;
	transform: translateY(34px);
	transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
}

.bpin-js .bpin-revelar.es-visible {
	opacity: 1;
	transform: none;
}

/* =========================================================================
   Cabecera
   ========================================================================= */
.bpin-cabecera {
	position: relative;
	z-index: 100;
}

.bpin-barra {
	background: var(--bpin-primario);
	color: rgba(255, 255, 255, .9);
	font-size: 14px;
}

.bpin-barra__fila {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 46px;
}

.bpin-barra__datos,
.bpin-barra__derecha {
	display: flex;
	align-items: center;
	gap: 28px;
}

.bpin-barra__datos li,
.bpin-barra__fono {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.bpin-barra .bpin-svg {
	width: 16px;
	height: 16px;
	color: #fff;
	opacity: .8;
}

.bpin-barra a:hover {
	color: #fff;
}

.bpin-redes {
	display: flex;
	align-items: center;
	gap: 6px;
}

.bpin-redes__item {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	color: #fff !important;
	font-size: 14px;
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-redes__item svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

.bpin-barra .bpin-redes__item:hover {
	background: #fff;
	color: var(--bpin-primario) !important;
}

.bpin-cabecera__principal {
	position: relative;
	background: #fff;
	box-shadow: 0 1px 0 var(--bpin-borde);
}

.bpin-cabecera__principal.es-fija {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	box-shadow: 0 10px 30px rgba(35, 31, 32, .1);
	animation: bpin-bajar .45s ease;
}

.admin-bar .bpin-cabecera__principal.es-fija {
	top: 32px;
}

@keyframes bpin-bajar {
	from { transform: translateY(-100%); }
	to { transform: none; }
}

/* Como en Finbuzz, la cabecera usa un ancho mayor que el contenido. */
.bpin-cabecera__principal > .bpin-contenedor,
.bpin-barra > .bpin-contenedor {
	max-width: 1600px;
	padding-left: 40px;
	padding-right: 40px;
}

.bpin-cabecera__fila {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 92px;
}

.bpin-cabecera__logo {
	flex: none;
}

.bpin-cabecera__logo img {
	width: 200px;
	height: auto;
}

.bpin-cabecera__nav {
	flex: 1;
	display: flex;
	justify-content: center;
}

.bpin-menu {
	display: flex;
	align-items: center;
	gap: 4px;
}

.bpin-menu > li {
	position: relative;
}

.bpin-menu > li > a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 34px 12px;
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.bpin-menu > li > a::after {
	content: '';
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 26px;
	height: 2px;
	background: var(--bpin-primario);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform var(--bpin-transicion);
}

.bpin-menu > li:hover > a::after,
.bpin-menu > .current-menu-item > a::after,
.bpin-menu > .current-menu-ancestor > a::after {
	transform: scaleX(1);
	transform-origin: left;
}

.bpin-menu > li:hover > a,
.bpin-menu > .current-menu-item > a,
.bpin-menu > .current-menu-ancestor > a {
	color: var(--bpin-primario);
}

.bpin-cabecera__nav .menu-item-has-children > a::before {
	content: '';
	order: 2;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	opacity: .6;
}

.bpin-cabecera__nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 10;
	min-width: 240px;
	padding: 14px 0;
	border-top: 3px solid var(--bpin-primario);
	background: #fff;
	box-shadow: var(--bpin-sombra-alta);
	opacity: 0;
	visibility: hidden;
	transform: translateY(14px);
	transition: opacity var(--bpin-transicion), transform var(--bpin-transicion), visibility var(--bpin-transicion);
	list-style: none;
	margin: 0;
}

.bpin-cabecera__nav li:hover > .sub-menu,
.bpin-cabecera__nav li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.bpin-cabecera__nav .sub-menu a {
	display: block;
	padding: 9px 26px;
	color: var(--bpin-texto);
	font-family: var(--bpin-fuente-titulos);
	font-size: 15px;
	font-weight: 500;
	transition: color var(--bpin-transicion), padding var(--bpin-transicion);
}

.bpin-cabecera__nav .sub-menu a:hover {
	padding-left: 32px;
	color: var(--bpin-primario);
}

.bpin-cabecera__acciones {
	display: flex;
	align-items: center;
	gap: 22px;
	flex: none;
}

.bpin-cabecera__icono {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--bpin-claro);
	color: var(--bpin-titulos);
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-cabecera__icono:hover {
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-cabecera__icono .bpin-svg {
	width: 20px;
	height: 20px;
}

.bpin-cabecera__hamburguesa {
	display: none;
}

.bpin-cabecera__ayuda {
	display: flex;
	align-items: center;
	gap: 12px;
}

.bpin-cabecera__ayuda-icono {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--bpin-suave);
	color: var(--bpin-primario);
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-cabecera__ayuda-icono .bpin-svg {
	width: 20px;
	height: 20px;
}

.bpin-cabecera__ayuda:hover .bpin-cabecera__ayuda-icono {
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-cabecera__ayuda-texto {
	display: flex;
	flex-direction: column;
	line-height: 1.3;
}

.bpin-cabecera__ayuda-texto small {
	font-size: 13px;
	color: var(--bpin-texto);
}

.bpin-cabecera__ayuda-texto strong {
	font-family: var(--bpin-fuente-titulos);
	font-size: 16px;
	color: var(--bpin-titulos);
}

.bpin-buscador {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	padding: 22px 0;
	background: #fff;
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-buscador__form {
	display: flex;
	gap: 10px;
}

.bpin-buscador input {
	flex: 1;
	height: 54px;
	padding: 0 20px;
	border: 1px solid var(--bpin-borde);
	border-radius: 4px;
	font: inherit;
	color: var(--bpin-titulos);
}

.bpin-buscador button {
	width: 54px;
	border: 0;
	border-radius: 4px;
	background: var(--bpin-primario);
	color: #fff;
}

/* Menú móvil */
.bpin-movil {
	position: fixed;
	inset: 0;
	z-index: 10000;
}

.bpin-movil__fondo {
	position: absolute;
	inset: 0;
	background: rgba(28, 30, 34, .6);
	opacity: 0;
	transition: opacity .3s ease;
}

.bpin-movil__panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 26px;
	width: min(360px, 88vw);
	padding: 26px;
	overflow-y: auto;
	background: #fff;
	transform: translateX(100%);
	transition: transform .3s ease;
}

.bpin-movil.es-visible .bpin-movil__fondo { opacity: 1; }
.bpin-movil.es-visible .bpin-movil__panel { transform: none; }

.bpin-movil__cabeza {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.bpin-movil__cabeza img {
	width: 160px;
}

.bpin-menu--movil {
	display: block;
}

.bpin-menu--movil li {
	position: relative;
	border-bottom: 1px solid var(--bpin-borde);
}

.bpin-menu--movil a {
	display: block;
	padding: 13px 44px 13px 0;
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
}

.bpin-menu--movil .current-menu-item > a {
	color: var(--bpin-primario);
}

.bpin-menu--movil .sub-menu {
	display: none;
	margin: 0 0 10px;
	padding: 0 0 0 14px;
	list-style: none;
	border-left: 2px solid var(--bpin-primario);
}

.bpin-menu--movil .es-abierto > .sub-menu {
	display: block;
}

.bpin-menu--movil .sub-menu li {
	border: 0;
}

.bpin-menu--movil .sub-menu a {
	padding: 8px 0;
	font-weight: 500;
	text-transform: none;
}

.bpin-menu__desplegar {
	position: absolute;
	top: 6px;
	right: 0;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 4px;
	background: var(--bpin-claro);
	color: var(--bpin-titulos);
	transition: transform var(--bpin-transicion);
}

.es-abierto > .bpin-menu__desplegar {
	transform: rotate(180deg);
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-movil__boton {
	justify-content: center;
}

.bpin-redes--oscuras .bpin-redes__item {
	background: var(--bpin-claro);
	color: var(--bpin-titulos) !important;
}

.bpin-redes--oscuras .bpin-redes__item:hover {
	background: var(--bpin-primario);
	color: #fff !important;
}

/* =========================================================================
   Portada
   ========================================================================= */
.bpin-portada {
	position: relative;
	background: #fff;
}

/*
 * Todas las diapositivas comparten la misma celda del grid: la portada toma el alto de la más alta
 * y no cambia al pasar de una a otra (las ocultas siguen ocupando espacio).
 */
.bpin-portada__slider {
	position: relative;
	display: grid;
	grid-template: minmax(780px, auto) / minmax(0, 1fr);
	overflow: hidden;
	background: var(--bpin-oscuro);
}

.bpin-portada__diapositiva {
	position: relative;
	grid-area: 1 / 1;
	display: flex;
	align-items: center;
	padding: 90px 0 200px;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease, visibility 1s ease;
}

.bpin-portada__diapositiva.es-activa {
	z-index: 1;
	opacity: 1;
	visibility: visible;
}

.bpin-portada__fondo {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.bpin-portada__fondo::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(28, 30, 34, .92) 0%, rgba(28, 30, 34, .72) 42%, rgba(28, 30, 34, .25) 75%, rgba(124, 18, 47, .25) 100%),
		linear-gradient(0deg, rgba(28, 30, 34, .55) 0%, transparent 35%);
}

.bpin-portada__img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	transform: scale(1.12);
	transition: transform 7s ease-out;
}

.es-activa .bpin-portada__img {
	transform: scale(1);
}

.bpin-portada__contenido {
	position: relative;
	z-index: 1;
}

.bpin-portada__contenido > * {
	max-width: 680px;
	opacity: 0;
	transform: translateY(30px);
	transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
}

.es-activa .bpin-portada__contenido > * {
	opacity: 1;
	transform: none;
}

.es-activa .bpin-portada__contenido > *:nth-child(2) { transition-delay: .15s; }
.es-activa .bpin-portada__contenido > *:nth-child(3) { transition-delay: .3s; }
.es-activa .bpin-portada__contenido > *:nth-child(4) { transition-delay: .45s; }

.bpin-portada__titulo {
	margin-bottom: 22px !important;
	color: #fff !important;
	font-size: clamp(38px, 5.2vw, 66px);
	font-weight: 800;
	line-height: 1.1;
}

.bpin-portada__titulo span {
	color: var(--bpin-acento);
}

.bpin-portada__texto {
	margin-bottom: 38px !important;
	color: rgba(255, 255, 255, .85);
	font-size: 19px;
}

.bpin-portada__acciones {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
}

.bpin-portada__controles {
	position: absolute;
	right: max(15px, calc((100vw - 1200px) / 2));
	bottom: 210px;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 18px;
}

.bpin-portada__tarjetas {
	position: relative;
	z-index: 3;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
	margin-top: -130px;
	padding-bottom: 20px;
}

.bpin-tarjeta-info {
	position: relative;
	padding: 40px 34px 36px;
	border-radius: var(--bpin-radio);
	background: #fff;
	box-shadow: var(--bpin-sombra-alta);
	overflow: hidden;
	transition: transform var(--bpin-transicion), box-shadow var(--bpin-transicion);
}

.bpin-tarjeta-info::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: var(--bpin-primario);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--bpin-transicion);
}

.bpin-tarjeta-info:hover {
	transform: translateY(-8px);
}

.bpin-tarjeta-info:hover::before {
	transform: scaleX(1);
}

.bpin-tarjeta-info__icono {
	display: grid;
	place-items: center;
	width: 68px;
	height: 68px;
	margin-bottom: 24px;
	border-radius: 50%;
	background: var(--bpin-suave);
	color: var(--bpin-primario);
	font-size: 28px;
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-tarjeta-info__icono svg {
	width: 28px;
	height: 28px;
	fill: currentColor;
}

.bpin-tarjeta-info:hover .bpin-tarjeta-info__icono {
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-tarjeta-info__titulo {
	margin-bottom: 12px !important;
	font-size: 22px;
	font-weight: 700;
}

.bpin-tarjeta-info p {
	margin-bottom: 18px;
}

/* =========================================================================
   Nosotros
   ========================================================================= */
.bpin-nosotros {
	padding-top: 90px;
}

.bpin-nosotros__media {
	position: relative;
	padding: 0 70px 70px 0;
}

.bpin-nosotros__principal {
	position: relative;
	z-index: 1;
	border-radius: var(--bpin-radio);
	overflow: hidden;
	aspect-ratio: 5 / 5.4;
	box-shadow: var(--bpin-sombra);
}

.bpin-nosotros__principal img,
.bpin-nosotros__secundaria img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}

.bpin-nosotros__secundaria {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 2;
	width: 52%;
	aspect-ratio: 1 / 1;
	border: 8px solid #fff;
	border-radius: var(--bpin-radio);
	overflow: hidden;
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-insignia {
	position: absolute;
	left: -30px;
	bottom: 40px;
	z-index: 3;
	display: grid;
	grid-template-columns: auto auto;
	align-items: end;
	gap: 2px 16px;
	max-width: 260px;
	padding: 22px 26px;
	border-radius: var(--bpin-radio);
	background: #fff;
	box-shadow: var(--bpin-sombra-alta);
	animation: bpin-flotar 5s ease-in-out infinite;
}

.bpin-insignia strong {
	grid-column: 1;
	color: var(--bpin-primario);
	font-family: var(--bpin-fuente-titulos);
	font-size: 34px;
	font-weight: 800;
	line-height: 1;
}

.bpin-insignia span {
	grid-column: 1 / -1;
	font-size: 14px;
	line-height: 1.4;
}

.bpin-insignia__barras {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	align-items: flex-end;
	gap: 4px;
	height: 34px;
}

.bpin-insignia__barras b {
	width: 7px;
	border-radius: 2px;
	background: var(--bpin-primario);
}

.bpin-insignia__barras b:nth-child(1) { height: 35%; opacity: .35; }
.bpin-insignia__barras b:nth-child(2) { height: 55%; opacity: .55; }
.bpin-insignia__barras b:nth-child(3) { height: 75%; opacity: .8; }
.bpin-insignia__barras b:nth-child(4) { height: 100%; background: var(--bpin-acento); }

@keyframes bpin-flotar {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-12px); }
}

.bpin-nosotros__cajas {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	margin-bottom: 36px;
	padding-top: 30px;
	border-top: 1px solid var(--bpin-borde);
}

.bpin-caja {
	display: flex;
	gap: 16px;
}

.bpin-caja__icono {
	flex: none;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: var(--bpin-radio);
	background: var(--bpin-primario);
	color: #fff;
	font-size: 22px;
}

.bpin-caja__icono svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

.bpin-caja h3 {
	margin-bottom: 4px !important;
	font-size: 19px;
	font-weight: 700;
}

.bpin-caja p {
	font-size: 15px;
	line-height: 1.6;
}

/* =========================================================================
   Cifras
   ========================================================================= */
.bpin-cifras {
	position: relative;
	padding: 70px 0;
	background:
		linear-gradient(100deg, rgba(124, 18, 47, .96) 0%, rgba(116, 18, 43, .9) 55%, rgba(35, 31, 32, .88) 100%),
		var(--bpin-fondo, none) center / cover no-repeat,
		var(--bpin-primario);
	color: rgba(255, 255, 255, .85);
}

.bpin-cifras__fila {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 30px;
}

.bpin-cifra {
	display: flex;
	align-items: center;
	gap: 18px;
	padding-right: 20px;
	border-right: 1px solid rgba(255, 255, 255, .18);
}

.bpin-cifra:last-child {
	border-right: 0;
}

.bpin-cifra__icono {
	flex: none;
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	border: 1px dashed rgba(255, 255, 255, .5);
	border-radius: 50%;
	color: #fff;
	font-size: 24px;
}

.bpin-cifra__icono svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.bpin-cifra__valor {
	display: block;
	color: #fff;
	font-family: var(--bpin-fuente-titulos);
	font-size: 40px;
	font-weight: 800;
	line-height: 1.1;
}

.bpin-cifra__texto {
	display: block;
	font-size: 15px;
	line-height: 1.4;
}

/* =========================================================================
   Servicios
   ========================================================================= */
.bpin-servicio {
	display: flex;
	flex-direction: column;
	border-radius: var(--bpin-radio);
	background: #fff;
	box-shadow: var(--bpin-sombra);
	transition: transform var(--bpin-transicion), box-shadow var(--bpin-transicion);
}

.bpin-servicio:hover {
	transform: translateY(-8px);
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-servicio__media {
	position: relative;
	aspect-ratio: 16 / 10;
	border-radius: var(--bpin-radio) var(--bpin-radio) 0 0;
}

.bpin-servicio__media img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	border-radius: var(--bpin-radio) var(--bpin-radio) 0 0;
}

.bpin-servicio__media::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(0deg, rgba(124, 18, 47, .55), transparent 60%);
	opacity: 0;
	transition: opacity var(--bpin-transicion);
}

.bpin-servicio:hover .bpin-servicio__media::after {
	opacity: 1;
}

.bpin-servicio__icono {
	position: absolute;
	left: 30px;
	bottom: -34px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 68px;
	height: 68px;
	border: 5px solid #fff;
	border-radius: 50%;
	background: var(--bpin-primario);
	color: #fff;
	font-size: 24px;
	transition: transform var(--bpin-transicion), background-color var(--bpin-transicion);
}

.bpin-servicio__icono svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.bpin-servicio:hover .bpin-servicio__icono {
	transform: rotateY(180deg);
	background: var(--bpin-titulos);
}

.bpin-servicio__cuerpo {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 52px 30px 32px;
}

.bpin-servicio__titulo {
	margin-bottom: 12px !important;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
}

.bpin-servicio__titulo a:hover {
	color: var(--bpin-primario);
}

.bpin-servicio p {
	flex: 1;
	margin-bottom: 20px;
}

.bpin-servicios__pie {
	margin-top: 50px !important;
	text-align: center;
	font-size: 17px;
}

.bpin-servicios__pie a {
	margin-left: 6px;
	color: var(--bpin-primario);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* =========================================================================
   Llamado a la acción
   ========================================================================= */
.bpin-cta--tarjeta {
	background: linear-gradient(var(--bpin-claro) 50%, #fff 50%);
}

.bpin-cta__caja {
	position: relative;
	display: flex;
	align-items: center;
	gap: 40px;
	padding: 56px 70px;
	border-radius: 8px;
	background:
		linear-gradient(115deg, var(--bpin-primario) 0%, var(--bpin-primario) 55%, var(--bpin-primario-hover) 55%, var(--bpin-primario-hover) 100%);
	color: rgba(255, 255, 255, .85);
	overflow: hidden;
	box-shadow: 0 24px 50px rgba(124, 18, 47, .28);
}

.bpin-cta__caja::before {
	content: '';
	position: absolute;
	top: -60%;
	left: 38%;
	width: 360px;
	height: 360px;
	border: 50px solid rgba(255, 255, 255, .05);
	border-radius: 50%;
}

.bpin-cta__marca {
	position: absolute;
	right: 240px;
	bottom: -40px;
	width: 160px;
	opacity: .08;
	pointer-events: none;
}

.bpin-cta__texto {
	position: relative;
	flex: 1;
}

.bpin-cta__texto h2 {
	margin-bottom: 8px !important;
	color: #fff;
	font-size: clamp(26px, 2.6vw, 34px);
	font-weight: 700;
	line-height: 1.25;
}

.bpin-cta .bpin-boton {
	flex: none;
}

.bpin-cta--banda {
	padding: 0;
	background: var(--bpin-primario);
}

.bpin-cta--banda .bpin-cta__caja {
	padding: 70px 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.bpin-cta--banda {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 12% 120%, rgba(203, 51, 67, .55) 0, transparent 40%),
		radial-gradient(circle at 92% -20%, rgba(35, 31, 32, .45) 0, transparent 45%),
		var(--bpin-primario);
}

.bpin-cta--banda .bpin-cta__marca {
	right: 30%;
	bottom: -60px;
	width: 220px;
}

/* =========================================================================
   Enfoque de trabajo
   ========================================================================= */
.bpin-enfoque__media {
	position: relative;
	max-width: 540px;
	padding: 30px;
}

.bpin-enfoque__circulo {
	position: relative;
	z-index: 1;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-enfoque__circulo img,
.bpin-enfoque__mini img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}

.bpin-enfoque__anillo {
	position: absolute;
	inset: 0;
	border: 14px solid var(--bpin-primario);
	border-color: var(--bpin-primario) transparent transparent var(--bpin-primario);
	border-radius: 50%;
	transform: rotate(-30deg);
	animation: bpin-girar 18s linear infinite;
}

@keyframes bpin-girar {
	to { transform: rotate(330deg); }
}

.bpin-enfoque__mini {
	position: absolute;
	top: 10px;
	right: -10px;
	z-index: 2;
	width: 38%;
	aspect-ratio: 1;
	border: 8px solid #fff;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-enfoque__items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 26px 30px;
	margin-bottom: 38px;
}

.bpin-enfoque__item {
	display: flex;
	gap: 16px;
}

.bpin-enfoque__icono {
	flex: none;
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	border-radius: var(--bpin-radio);
	background: var(--bpin-suave);
	color: var(--bpin-primario);
	font-size: 24px;
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion);
}

.bpin-enfoque__icono svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.bpin-enfoque__item:hover .bpin-enfoque__icono {
	background: var(--bpin-primario);
	color: #fff;
}

.bpin-enfoque__item h3 {
	margin-bottom: 4px !important;
	font-size: 19px;
	font-weight: 700;
}

.bpin-enfoque__item p {
	font-size: 15px;
	line-height: 1.6;
}

/* =========================================================================
   Experiencias
   ========================================================================= */
.bpin-experiencias__lado {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.bpin-experiencias__flechas {
	display: flex;
	gap: 12px;
}

/* El carrusel vive dentro del contenedor: mismos márgenes a ambos lados. */
.bpin-carrusel {
	--bpin-carrusel-gap: 30px;
	--bpin-carrusel-vista: 2;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--bpin-carrusel-vista) - 1) * var(--bpin-carrusel-gap)) / var(--bpin-carrusel-vista));
	gap: var(--bpin-carrusel-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	border-radius: var(--bpin-radio);
}

.bpin-carrusel::-webkit-scrollbar {
	display: none;
}

.bpin-carrusel:focus-visible {
	outline: 2px solid var(--bpin-primario);
	outline-offset: 4px;
}

/*
 * Tarjeta apaisada (15:8) anclada arriba: las fotos de los eventos (3:2) se muestran casi completas,
 * sin ampliarse, y su franja inferior de marca de agua queda fuera del recorte.
 */
.bpin-experiencia {
	position: relative;
	display: grid;
	/* Una sola celda del alto de la tarjeta: la foto no la estira. */
	grid-template: minmax(0, 1fr) / minmax(0, 1fr);
	margin: 0;
	aspect-ratio: 15 / 8;
	border-radius: var(--bpin-radio);
	overflow: hidden;
	scroll-snap-align: start;
	background: var(--bpin-oscuro);
}

.bpin-experiencia > img,
.bpin-experiencia__pie {
	grid-area: 1 / 1;
}

.bpin-experiencia img {
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: 50% 0;
	transition: transform 1s ease;
}

.bpin-experiencia::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(28, 30, 34, .9) 0%, rgba(28, 30, 34, .5) 35%, rgba(28, 30, 34, 0) 65%);
	pointer-events: none;
}

.bpin-experiencia:hover img {
	transform: scale(1.05);
}

.bpin-experiencia__pie {
	z-index: 1;
	align-self: end;
	padding: 0 100px 28px 30px;
	color: #fff;
}

.bpin-experiencia__pie > span:first-child {
	display: inline-block;
	margin-bottom: 12px;
	padding: 5px 12px;
	border-radius: 3px;
	background: var(--bpin-primario);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	line-height: 1.4;
	text-transform: uppercase;
}

.bpin-experiencia__pie strong {
	display: block;
	color: #fff;
	font-family: var(--bpin-fuente-titulos);
	font-size: 22px;
	line-height: 1.3;
}

/* El tema colorea a:visited (morado) y a:hover (azul): el título se mantiene blanco en todos los estados. */
.bpin-experiencia__pie a:is(:link, :visited, :hover, :focus, :active) {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
	transition: text-decoration-color var(--bpin-transicion);
}

.bpin-experiencia__pie a:is(:hover, :focus-visible) {
	text-decoration-color: #fff;
}

/* Toda la tarjeta es clicable. */
.bpin-experiencia__pie a::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
}

.bpin-experiencia__ir {
	position: absolute;
	right: 30px;
	bottom: 28px;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #fff;
	color: var(--bpin-primario);
	transition: background-color var(--bpin-transicion), color var(--bpin-transicion), transform var(--bpin-transicion);
}

.bpin-experiencia:hover .bpin-experiencia__ir {
	background: var(--bpin-primario);
	color: #fff;
	transform: rotate(45deg);
}

.bpin-experiencia__ir .bpin-svg {
	width: 18px;
	height: 18px;
}

.bpin-carrusel__progreso {
	position: relative;
	height: 3px;
	margin-top: 40px;
	border-radius: 3px;
	background: rgba(124, 18, 47, .14);
	overflow: hidden;
}

.bpin-carrusel__progreso span {
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 100%;
	border-radius: inherit;
	background: var(--bpin-primario);
	transition: transform .2s linear;
}

/* =========================================================================
   Video y por qué elegirnos
   ========================================================================= */
.bpin-video__media {
	position: relative;
	border-radius: var(--bpin-radio);
	overflow: hidden;
	aspect-ratio: 5 / 4.4;
}

.bpin-video__media img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}

.bpin-video__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(28, 30, 34, .3);
}

.bpin-video__media .bpin-play {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	transform: translate(-50%, -50%);
}

.bpin-video .bpin-parrafo {
	color: rgba(255, 255, 255, .72);
}

.bpin-video__fono {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 18px 30px 18px 18px;
	border-radius: var(--bpin-radio);
	background: var(--bpin-primario);
	color: #fff !important;
	transition: background-color var(--bpin-transicion);
}

.bpin-video__fono:hover {
	background: var(--bpin-acento);
}

.bpin-video__fono-icono {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #fff;
	color: var(--bpin-primario);
}

.bpin-video__fono-icono .bpin-svg {
	width: 22px;
	height: 22px;
}

.bpin-video__fono small {
	display: block;
	font-size: 14px;
	opacity: .85;
}

.bpin-video__fono strong {
	display: block;
	font-family: var(--bpin-fuente-titulos);
	font-size: 22px;
	line-height: 1.2;
}

/* =========================================================================
   Equipo
   ========================================================================= */
.bpin-miembro {
	text-align: center;
}

.bpin-miembro__foto {
	position: relative;
	aspect-ratio: 4 / 4.7;
	border-radius: var(--bpin-radio);
	overflow: hidden;
	background: var(--bpin-claro);
}

.bpin-miembro__foto img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: top center;
	transition: transform 1s ease;
}

.bpin-miembro__foto::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(124, 18, 47, .6), transparent 50%);
	opacity: 0;
	transition: opacity var(--bpin-transicion);
}

.bpin-miembro:hover .bpin-miembro__foto img {
	transform: scale(1.06);
}

.bpin-miembro:hover .bpin-miembro__foto::after {
	opacity: 1;
}

.bpin-miembro__ir {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--bpin-primario);
	color: #fff !important;
	opacity: 0;
	transform: scale(.6);
	transition: opacity var(--bpin-transicion), transform var(--bpin-transicion), background-color var(--bpin-transicion);
}

.bpin-miembro:hover .bpin-miembro__ir,
.bpin-miembro__ir:focus-visible {
	opacity: 1;
	transform: none;
}

.bpin-miembro__ir:hover {
	background: var(--bpin-titulos);
}

.bpin-miembro__ir .bpin-svg {
	width: 20px;
	height: 20px;
}

.bpin-miembro__datos {
	position: relative;
	z-index: 2;
	margin: -34px 20px 0;
	padding: 20px 14px;
	border-radius: var(--bpin-radio);
	background: #fff;
	box-shadow: var(--bpin-sombra);
	transition: transform var(--bpin-transicion);
}

.bpin-miembro:hover .bpin-miembro__datos {
	transform: translateY(-6px);
}

.bpin-miembro__datos h3 {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
}

.bpin-miembro__datos span {
	color: var(--bpin-primario);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
}

/* =========================================================================
   Frases
   ========================================================================= */
.bpin-frases__banda {
	position: relative;
	padding: 110px 0 120px;
	background:
		radial-gradient(circle at 0% 0%, rgba(203, 51, 67, .6) 0, transparent 35%),
		radial-gradient(circle at 100% 100%, rgba(35, 31, 32, .5) 0, transparent 40%),
		var(--bpin-primario);
	overflow: hidden;
}

.bpin-frases__banda::before,
.bpin-frases__banda::after {
	content: '';
	position: absolute;
	border: 2px solid rgba(255, 255, 255, .08);
	border-radius: 50%;
}

.bpin-frases__banda::before {
	top: -120px;
	right: -80px;
	width: 380px;
	height: 380px;
}

.bpin-frases__banda::after {
	bottom: -160px;
	left: 8%;
	width: 300px;
	height: 300px;
}

.bpin-frases .bpin-titulo {
	color: #fff;
}

.bpin-frases__slider {
	position: relative;
	display: grid;
	max-width: 900px;
	margin: 0 auto;
	padding: 0 90px;
}

.bpin-frase {
	grid-area: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0;
	padding: 56px 60px 44px;
	border-radius: 8px;
	background: #fff;
	text-align: center;
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
	transition: opacity .7s ease, transform .7s ease, visibility .7s;
	box-shadow: 0 30px 60px rgba(35, 31, 32, .25);
}

.bpin-frase.es-activa {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.bpin-frase__comillas {
	position: absolute;
	top: -30px;
	left: 50%;
	display: grid;
	place-items: center;
	width: 60px;
	height: 60px;
	border: 5px solid #fff;
	border-radius: 50%;
	background: var(--bpin-acento);
	color: #fff;
	transform: translateX(-50%);
}

.bpin-frase__comillas .bpin-svg {
	width: 22px;
	height: 22px;
}

.bpin-frase p {
	margin-bottom: 28px;
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: clamp(19px, 1.8vw, 24px);
	font-style: italic;
	font-weight: 400;
	line-height: 1.55;
}

.bpin-frase footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.bpin-frase__avatar {
	display: grid;
	place-items: center;
	width: 66px;
	height: 66px;
	margin-bottom: 10px;
	padding: 12px;
	border: 2px solid var(--bpin-suave);
	border-radius: 50%;
	background: #fff;
}

.bpin-frase__avatar img {
	width: 100%;
	height: 100% !important;
	object-fit: contain;
}

.bpin-frase cite {
	color: var(--bpin-titulos);
	font-family: var(--bpin-fuente-titulos);
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
}

.bpin-frase footer > span:last-child {
	color: var(--bpin-primario);
	font-size: 14px;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.bpin-frases__anterior,
.bpin-frases__siguiente {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.bpin-frases__anterior { left: 0; }
.bpin-frases__siguiente { right: 0; }

.bpin-frases .bpin-flecha:hover {
	border-color: #fff;
	background: #fff;
	color: var(--bpin-primario);
}

.bpin-frases .bpin-puntos {
	justify-content: center;
	margin-top: 36px;
}

.bpin-valores {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	padding: 60px 0 !important;
}

.bpin-valores li {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	color: var(--bpin-gris);
	font-family: var(--bpin-fuente-titulos);
	font-size: 22px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	transition: color var(--bpin-transicion);
}

.bpin-valores li:hover {
	color: var(--bpin-primario);
}

.bpin-valores svg,
.bpin-valores i {
	width: 30px;
	height: 30px;
	font-size: 28px;
	fill: currentColor;
}

/* =========================================================================
   Contacto
   ========================================================================= */
.bpin-contacto__fila {
	align-items: start;
}

.bpin-contacto .bpin-parrafo {
	color: rgba(255, 255, 255, .72);
}

.bpin-contacto__datos {
	display: grid;
	gap: 24px;
}

.bpin-contacto__datos li {
	display: flex;
	align-items: center;
	gap: 18px;
}

.bpin-contacto__icono {
	flex: none;
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--bpin-primario);
	color: #fff;
	font-size: 20px;
}

.bpin-contacto__icono svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.bpin-contacto__datos small {
	display: block;
	color: rgba(255, 255, 255, .6);
	font-size: 14px;
}

.bpin-contacto__datos a,
.bpin-contacto__datos span {
	color: #fff;
	font-family: var(--bpin-fuente-titulos);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.45;
}

.bpin-contacto__datos a:hover {
	color: var(--bpin-acento);
}

.bpin-contacto__tarjeta {
	padding: 50px 46px;
	border-top: 4px solid var(--bpin-primario);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 30px 60px rgba(0, 0, 0, .3);
}

.bpin-contacto__tarjeta h3 {
	margin-bottom: 26px !important;
	color: var(--bpin-titulos) !important;
	font-size: 26px;
	font-weight: 700;
}

.bpin-contacto__aviso {
	padding: 16px;
	border-radius: 4px;
	background: var(--bpin-claro);
	font-size: 15px;
}

/* Formulario (Contact Form 7) */
.bpin-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.bpin-form__campo {
	display: block;
	margin: 0;
}

.bpin-form__campo--ancho {
	grid-column: 1 / -1;
}

.bpin .wpcf7 p {
	margin: 0;
}

/* Contact Form 7 envuelve los campos en <p>: se ignoran para que la rejilla vea cada campo. */
.bpin-form > p,
.bpin-form__campo > p {
	display: contents;
}

.bpin .wpcf7 br {
	display: none;
}

.bpin .wpcf7-form-control-wrap {
	display: block;
}

.bpin .wpcf7 input[type="text"],
.bpin .wpcf7 input[type="email"],
.bpin .wpcf7 input[type="tel"],
.bpin .wpcf7 textarea {
	width: 100%;
	height: 56px;
	padding: 0 20px;
	border: 1px solid transparent;
	border-radius: 4px;
	background: var(--bpin-claro);
	color: var(--bpin-titulos);
	font: inherit;
	font-size: 16px;
	transition: border-color var(--bpin-transicion), background-color var(--bpin-transicion);
}

.bpin .wpcf7 textarea {
	height: 130px;
	padding: 16px 20px;
	resize: vertical;
}

.bpin .wpcf7 input:focus,
.bpin .wpcf7 textarea:focus {
	border-color: var(--bpin-primario);
	background: #fff;
	outline: none;
}

.bpin .wpcf7 ::placeholder {
	color: #8a8b8e;
}

.bpin .wpcf7-submit.bpin-boton {
	width: 100%;
	height: auto;
	justify-content: center;
	padding: 18px 28px;
	border: 0;
	background: var(--bpin-primario);
	color: #fff;
	cursor: pointer;
	opacity: 1;
}

.bpin .wpcf7-submit.bpin-boton:hover {
	background: var(--bpin-titulos);
}

.bpin .wpcf7-spinner {
	display: block;
	margin: 10px auto 0;
}

.bpin .wpcf7-not-valid-tip {
	margin-top: 4px;
	color: var(--bpin-acento);
	font-size: 14px;
}

.bpin .wpcf7 form .wpcf7-response-output {
	margin: 18px 0 0;
	padding: 12px 16px;
	border-radius: 4px;
	font-size: 15px;
}

/* =========================================================================
   Noticias
   ========================================================================= */
.bpin-noticias {
	background:
		radial-gradient(circle, rgba(124, 18, 47, .06) 1.5px, transparent 1.6px) 0 0 / 22px 22px,
		#fff;
}

.bpin-noticia {
	display: flex;
	flex-direction: column;
	border-radius: var(--bpin-radio);
	background: #fff;
	box-shadow: var(--bpin-sombra);
	overflow: hidden;
	transition: transform var(--bpin-transicion), box-shadow var(--bpin-transicion);
}

.bpin-noticia:hover {
	transform: translateY(-8px);
	box-shadow: var(--bpin-sombra-alta);
}

.bpin-noticia__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10.5;
	overflow: hidden;
	background: var(--bpin-claro);
}

.bpin-noticia__media img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	transition: transform 1s ease;
}

.bpin-noticia__media .bpin-noticia__sin-imagen {
	width: 40%;
	margin: 12% auto;
	object-fit: contain;
	opacity: .3;
}

.bpin-noticia:hover .bpin-noticia__media img {
	transform: scale(1.07);
}

.bpin-noticia__fecha {
	position: absolute;
	top: 20px;
	left: 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 66px;
	padding: 8px 10px;
	border-radius: 4px;
	background: var(--bpin-primario);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: uppercase;
}

.bpin-noticia__fecha strong {
	font-family: var(--bpin-fuente-titulos);
	font-size: 26px;
	line-height: 1.1;
}

.bpin-noticia__cuerpo {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 28px 30px 32px;
}

.bpin-noticia__meta {
	margin-bottom: 10px;
	color: var(--bpin-primario);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.bpin-noticia h3 {
	margin-bottom: 12px !important;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.35;
}

.bpin-noticia h3 a:hover {
	color: var(--bpin-primario);
}

.bpin-noticia p {
	flex: 1;
	margin-bottom: 20px;
	font-size: 16px;
}

/* =========================================================================
   Pie de página
   ========================================================================= */
.bpin-pie {
	position: relative;
	background:
		radial-gradient(circle at 100% 0%, rgba(124, 18, 47, .35) 0, transparent 35%),
		var(--bpin-oscuro);
	color: rgba(255, 255, 255, .68);
	font-size: 16px;
}

.bpin-pie__columnas {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1.2fr 1.4fr;
	gap: 50px;
	padding-top: 90px;
	padding-bottom: 70px;
}

.bpin-pie__logo img {
	width: 210px;
	margin-bottom: 24px;
}

.bpin-pie__marca p {
	margin-bottom: 26px;
}

.bpin-redes--pie {
	gap: 10px;
}

.bpin-redes--pie .bpin-redes__item {
	width: 40px;
	height: 40px;
	background: rgba(255, 255, 255, .08);
	font-size: 15px;
}

.bpin-redes--pie .bpin-redes__item:hover {
	background: var(--bpin-primario);
}

.bpin-pie h3 {
	position: relative;
	margin-bottom: 30px !important;
	padding-bottom: 14px;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
}

.bpin-pie h3::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 40px;
	height: 3px;
	background: var(--bpin-acento);
}

.bpin-pie__lista {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bpin-pie__lista a {
	position: relative;
	display: inline-block;
	transition: color var(--bpin-transicion), padding var(--bpin-transicion);
}

/* El tema pinta a:visited (morado) y a:focus (azul): sobre el fondo oscuro del pie esos enlaces se perdían. */
.bpin-pie__lista a:is(:visited, :focus, :active),
.bpin-pie__contacto a:is(:visited, :focus, :active) {
	color: inherit;
}

.bpin-pie__lista a::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 0;
	height: 2px;
	background: var(--bpin-acento);
	transition: width var(--bpin-transicion);
}

.bpin-pie__lista a:hover {
	padding-left: 18px;
	color: #fff;
}

.bpin-pie__lista a:hover::before {
	width: 10px;
}

.bpin-pie__contacto {
	display: grid;
	gap: 16px;
}

.bpin-pie__contacto li {
	display: flex;
	gap: 14px;
	line-height: 1.5;
}

.bpin-pie__contacto i,
.bpin-pie__contacto svg {
	flex: none;
	width: 16px;
	margin-top: 5px;
	color: var(--bpin-acento);
	fill: var(--bpin-acento);
	font-size: 16px;
}

.bpin-pie__contacto a:hover {
	color: #fff;
}

.bpin-pie__base {
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.bpin-pie__base-fila {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 76px;
	font-size: 15px;
}

.bpin-pie__arriba {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 4px;
	background: var(--bpin-primario);
	color: #fff !important;
}

.bpin-pie__arriba .bpin-svg {
	transform: rotate(180deg);
}

.bpin-pie__arriba:hover {
	background: var(--bpin-acento);
}

/* =========================================================================
   Video emergente
   ========================================================================= */
.bpin-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 20px;
}

.bpin-modal[hidden] {
	display: none;
}

.bpin-modal__fondo {
	position: absolute;
	inset: 0;
	background: rgba(28, 30, 34, .9);
}

.bpin-modal__caja {
	position: relative;
	width: min(1000px, 100%);
}

.bpin-modal__video {
	aspect-ratio: 16 / 9;
	background: #000;
}

.bpin-modal__video iframe {
	width: 100%;
	height: 100%;
	border: 0;
}

.bpin-modal__cerrar {
	position: absolute;
	top: -52px;
	right: 0;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: var(--bpin-primario);
	color: #fff;
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1599px) {
	.bpin-cabecera__ayuda {
		display: none;
	}

	.bpin-menu > li > a {
		padding-left: 9px;
		padding-right: 9px;
		font-size: 13px;
	}

	.bpin-menu > li > a::after {
		left: 9px;
		right: 9px;
	}
}

@media (max-width: 1365px) {
	.bpin-cabecera__boton {
		display: none;
	}
}

@media (max-width: 1199px) {
	.bpin-experiencia__pie strong {
		font-size: 19px;
	}

	.bpin-cta__marca {
		display: none;
	}
}

@media (max-width: 991px) {
	.bpin-seccion {
		padding: 80px 0;
	}

	.bpin-cabecera__nav,
	.bpin-cabecera__boton,
	.bpin-barra__datos li:first-child {
		display: none;
	}

	.bpin-cabecera__acciones {
		margin-left: auto;
	}

	.bpin-cabecera__hamburguesa {
		display: inline-grid;
	}

	.bpin-cabecera__fila {
		min-height: 80px;
	}

	.bpin-cabecera__logo img {
		width: 170px;
	}

	.bpin-portada__slider {
		grid-template-rows: minmax(680px, auto);
	}

	.bpin-portada__diapositiva {
		padding-bottom: 130px;
	}

	.bpin-portada__controles {
		bottom: 40px;
	}

	.bpin-portada__tarjetas {
		grid-template-columns: 1fr;
		gap: 20px;
		margin-top: 50px;
	}

	.bpin-tarjeta-info {
		box-shadow: var(--bpin-sombra);
	}

	.bpin-dos-columnas,
	.bpin-encabezado--partido {
		grid-template-columns: 1fr;
		gap: 50px;
	}

	.bpin-encabezado--partido {
		gap: 20px;
		align-items: start;
	}

	.bpin-encabezado--boton {
		justify-items: start;
	}

	.bpin-nosotros__media,
	.bpin-enfoque__media {
		max-width: 560px;
		margin: 0 auto;
		width: 100%;
	}

	.bpin-insignia {
		left: 0;
	}

	.bpin-rejilla--3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bpin-rejilla--4,
	.bpin-cifras__fila {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bpin-cifra:nth-child(2n) {
		border-right: 0;
	}

	.bpin-cta__caja {
		flex-direction: column;
		align-items: flex-start;
		gap: 26px;
		padding: 46px 40px;
	}

	.bpin-cta--banda .bpin-cta__caja {
		padding: 60px 0;
	}

	.bpin-carrusel {
		--bpin-carrusel-gap: 20px;
	}

	.bpin-experiencia__pie {
		padding: 0 82px 22px 22px;
	}

	.bpin-experiencia__ir {
		right: 22px;
		bottom: 22px;
		width: 40px;
		height: 40px;
	}

	.bpin-cabecera__principal > .bpin-contenedor,
	.bpin-barra > .bpin-contenedor {
		padding-left: 15px;
		padding-right: 15px;
	}

	.bpin-frases__slider {
		padding: 0;
	}

	.bpin-frases__anterior,
	.bpin-frases__siguiente {
		display: none;
	}

	.bpin-valores {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 28px;
	}

	.bpin-pie__columnas {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 44px;
	}
}

@media (max-width: 767px) {
	.bpin {
		font-size: 16px;
	}

	.bpin-seccion {
		padding: 70px 0;
	}

	.bpin-barra__datos {
		display: none;
	}

	.bpin-barra__fila {
		justify-content: center;
	}

	.bpin-barra__derecha {
		gap: 14px;
	}

	.bpin-cabecera__acciones {
		gap: 10px;
	}

	.bpin-cabecera__logo img {
		width: 150px;
	}

	.bpin-portada__slider {
		grid-template-rows: minmax(620px, auto);
	}

	.bpin-portada__diapositiva {
		padding: 70px 0 120px;
	}

	.bpin-portada__texto {
		font-size: 17px;
	}

	.bpin-portada__fondo::after {
		background: linear-gradient(90deg, rgba(28, 30, 34, .9), rgba(28, 30, 34, .7));
	}

	.bpin-portada__controles {
		left: 15px;
		right: auto;
	}

	.bpin-portada__controles .bpin-flecha {
		width: 44px;
		height: 44px;
	}

	.bpin-nosotros__media {
		padding: 0 30px 50px 0;
	}

	.bpin-insignia {
		bottom: 10px;
		padding: 16px 18px;
	}

	.bpin-insignia strong {
		font-size: 26px;
	}

	.bpin-checks,
	.bpin-nosotros__cajas,
	.bpin-enfoque__items,
	.bpin-rejilla--3,
	.bpin-rejilla--4,
	.bpin-cifras__fila,
	.bpin-form {
		grid-template-columns: 1fr;
	}

	.bpin-cifra {
		padding: 0 0 22px;
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, .18);
	}

	.bpin-cifra:last-child {
		padding-bottom: 0;
		border-bottom: 0;
	}

	.bpin-cta__caja {
		padding: 38px 26px;
	}

	.bpin-carrusel {
		--bpin-carrusel-vista: 1;
		--bpin-carrusel-gap: 16px;
	}

	.bpin-experiencia__pie {
		padding: 0 70px 18px 18px;
	}

	.bpin-experiencia__pie > span:first-child {
		margin-bottom: 8px;
		padding: 4px 10px;
		font-size: 11px;
	}

	.bpin-experiencia__pie strong {
		font-size: 17px;
	}

	.bpin-experiencia__ir {
		right: 18px;
		bottom: 18px;
		width: 38px;
		height: 38px;
	}

	.bpin-carrusel__progreso {
		margin-top: 28px;
	}

	.bpin-frases__banda {
		padding: 80px 0;
	}

	.bpin-frase {
		padding: 50px 24px 34px;
	}

	.bpin-valores li {
		font-size: 17px;
	}

	.bpin-contacto__tarjeta {
		padding: 36px 22px;
	}

	.bpin-pie__columnas {
		grid-template-columns: 1fr;
		padding-top: 70px;
	}

	.bpin-pie__base-fila {
		padding-top: 18px;
		padding-bottom: 18px;
	}
}

@media (max-width: 782px) {
	.admin-bar .bpin-cabecera__principal.es-fija {
		top: 46px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bpin *,
	.bpin *::before,
	.bpin *::after {
		animation: none !important;
		transition: none !important;
	}
}
