/* ============================================================
   FOOTER — LEGALZONE 4.0

   Cuatro franjas, de mayor a menor peso:

     .lz-footer__responsible  aviso de juego responsable
     .lz-footer__main         marca, menús y contacto
     .lz-footer__compliance   sellos y organismos
     .lz-footer__legal        copyright y enlaces legales
   ============================================================ */

.lz-site-footer {
	background: var(--lz-surface-footer);
	color: var(--lz-muted-on-inverse);
	font-size: var(--lz-text-base);
	/* Separa el footer del contenido sin depender de la plantilla. */
	margin-top: var(--lz-space-16);
}

.lz-site-footer a {
	color: var(--lz-muted-on-inverse);
}

.lz-site-footer a:hover {
	color: var(--lz-accent);
}

/* Teléfono de ayuda: el dato más accionable de la franja. */
.lz-footer__helpline {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	background: rgba(255, 251, 235, .06);
	border: 1px solid rgba(249, 115, 22, .3);
	border-radius: var(--lz-radius);
	padding: var(--lz-space-3) var(--lz-space-6);
	text-align: center;
	flex-shrink: 0;
}

.lz-footer__helpline-label {
	font-size: var(--lz-text-xs);
	letter-spacing: .04em;
	color: var(--lz-muted-on-inverse);
}

.lz-footer__helpline-number {
	font-family: var(--lz-font-display);
	font-size: var(--lz-text-xl);
	color: var(--lz-accent);
	white-space: nowrap;
}

.lz-footer__helpline-number:hover {
	color: var(--lz-accent-hover);
}


/* ============================================================
   ZONA PRINCIPAL
   ============================================================ */

.lz-footer__main {
	padding-block: var(--lz-space-12) var(--lz-space-10);
}

.lz-footer__grid {
	display: grid;
	/* La columna de marca pesa más que las de enlaces. */
	grid-template-columns: 1.6fr repeat(3, minmax(0, 1fr));
	gap: var(--lz-space-8);
}

/* --- Columna de marca -------------------------------------- */

.lz-footer__brand-logo {
	display: inline-flex;
	margin-bottom: var(--lz-space-4);
}

.lz-footer__brand-logo img {
	width: auto;
	height: 28px;
}

.lz-footer__brand-text {
	font-family: var(--lz-font-display);
	font-size: var(--lz-text-xl);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--lz-ink-on-inverse);
}

.lz-footer__brand-text span { color: var(--lz-accent); }

.lz-footer__about {
	font-size: var(--lz-text-base);
	line-height: var(--lz-leading-normal);
	margin-bottom: var(--lz-space-5);
	max-width: 46ch;
}

/* Declaración de afiliación: exigible por transparencia. */
.lz-footer__disclosure {
	padding-bottom: var(--lz-space-4);
	font-size: var(--lz-text-sm);
	line-height: var(--lz-leading-normal);
	color: var(--lz-muted-on-inverse);
}

/* --- Columnas de enlaces ----------------------------------- */

.lz-footer__col-title {
	font-family: var(--lz-font-display);
	font-size: var(--lz-text-sm);
	text-transform: uppercase;
	letter-spacing: var(--lz-tracking-wide);
	color: var(--lz-ink-on-inverse);
	margin-bottom: var(--lz-space-4);
	padding-bottom: var(--lz-space-2);
	border-bottom: 1px solid var(--lz-line-inverse);
}

.lz-footer__menu {
	display: flex;
	flex-direction: column;
	gap: var(--lz-space-2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.lz-footer__menu a {
	display: inline-block;
	font-size: var(--lz-text-base);
	/* Objetivo táctil holgado sin separar visualmente las filas. */
	padding-block: var(--lz-space-1);
}

.lz-footer__menu .sub-menu {
	display: none;
}

/* --- Redes en el footer ------------------------------------ */

.lz-footer__social {
	display: flex;
	align-items: center;
	gap: var(--lz-space-2);
	list-style: none;
	margin: var(--lz-space-5) 0 0;
	padding: 0;
}

.lz-footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--lz-line-inverse);
	border-radius: var(--lz-radius-sm);
	transition: border-color var(--lz-duration) var(--lz-ease),
	            color var(--lz-duration) var(--lz-ease);
}

.lz-footer__social a:hover {
	border-color: var(--lz-accent);
}


/* ============================================================
   CUMPLIMIENTO
   ============================================================ */

.lz-footer__compliance {
	border-top: 1px solid var(--lz-line-inverse);
	border-bottom: 1px solid var(--lz-line-inverse);
	padding-block: var(--lz-space-5);
}

.lz-footer__compliance-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--lz-space-3) var(--lz-space-5);
}

/* Enlace a un organismo oficial (DGOJ, RGIAJ, FEJAR…).
   Los logotipos son a color y el pie es navy, así que el enlace lleva
   fondo claro. No se recolorean ni se filtran: son marcas registradas
   y alterarlas sería reproducirlas mal. */
.lz-footer__seal {
	display: inline-flex;
	align-items: center;
	gap: var(--lz-space-2);
	background: var(--lz-white);
	border: 1px solid rgba(255, 251, 235, .28);
	border-radius: var(--lz-radius-sm);
	padding: var(--lz-space-2) var(--lz-space-3);
	font-size: var(--lz-text-xs);
	letter-spacing: .03em;
	white-space: nowrap;
	transition: border-color var(--lz-duration) var(--lz-ease);
}

.lz-footer__seal:hover {
	border-color: var(--lz-accent);
}

/* Sin logotipo disponible: enlace de texto, sin caja blanca. */
.lz-footer__seal--texto {
	background: none;
	border-color: var(--lz-line-inverse);
	padding-inline: var(--lz-space-4);
	color: var(--lz-muted-on-inverse);
}

.lz-footer__seal--texto .lz-icon { color: var(--lz-accent); }

/* Altura fija y ancho automático. Sin max-width: los sellos son muy
   apaisados —«juego seguro» tiene proporción 6,9:1, o sea 178px de
   ancho a 26 de alto— y un tope los recortaba por la mitad. */
.lz-footer__seal img {
	display: block;
	height: 26px;
	width: auto;
	max-width: none;
}


/* ============================================================
   FRANJA LEGAL
   ============================================================ */

.lz-footer__legal {
	padding-block: var(--lz-space-5);
	font-size: var(--lz-text-xs);
	color: var(--lz-muted-on-inverse);
}

.lz-footer__legal-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--lz-space-3) var(--lz-space-5);
}

.lz-footer__legal a {
	color: var(--lz-muted-on-inverse);
}

.lz-footer__legal-menu {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--lz-space-2) var(--lz-space-4);
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Separador entre enlaces legales, oculto para lectores de pantalla. */
.lz-footer__legal-menu li + li::before {
	content: "·";
	margin-inline-end: var(--lz-space-4);
	color: var(--lz-muted-on-inverse);
}

.lz-footer__copyright {
	margin: 0;
}


/* ============================================================
   VOLVER ARRIBA
   ============================================================ */

.lz-to-top {
	position: fixed;
	right: var(--lz-gutter);
	bottom: var(--lz-gutter);
	z-index: var(--lz-z-sticky);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--lz-line);
	border-radius: var(--lz-radius);
	background: var(--lz-surface);
	color: var(--lz-heading);
	box-shadow: var(--lz-shadow-md);
	cursor: pointer;
	/* Oculto hasta que haya scroll suficiente. */
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity var(--lz-duration) var(--lz-ease),
	            visibility var(--lz-duration) var(--lz-ease),
	            transform var(--lz-duration) var(--lz-ease),
	            border-color var(--lz-duration) var(--lz-ease),
	            color var(--lz-duration) var(--lz-ease);
}

.lz-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.lz-to-top:hover {
	border-color: var(--lz-accent);
	color: var(--lz-accent);
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 991px) {
	.lz-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--lz-space-8) var(--lz-space-6);
	}

	/* La marca ocupa el ancho completo sobre las columnas. */
	.lz-footer__brand { grid-column: 1 / -1; }

	.lz-footer__responsible-inner {
		grid-template-columns: 1fr;
		gap: var(--lz-space-4);
	}

	.lz-footer__helpline {
		align-self: stretch;
		flex-direction: row;
		justify-content: center;
		gap: var(--lz-space-3);
	}
}

@media (max-width: 767px) {
	.lz-site-footer { margin-top: var(--lz-space-10); }

	.lz-footer__main {
		padding-block: var(--lz-space-8) var(--lz-space-6);
	}

	.lz-footer__grid { grid-template-columns: 1fr; }

	.lz-footer__col-title {
		margin-bottom: var(--lz-space-3);
	}

	.lz-footer__legal-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--lz-space-3);
	}

	.lz-footer__helpline {
		flex-direction: column;
		gap: 2px;
	}

	.lz-to-top {
		width: 40px;
		height: 40px;
	}
}

@media (max-width: 575px) {
	.lz-footer__compliance-inner {
		gap: var(--lz-space-2);
	}

	.lz-footer__seal {
		font-size: 11px;
		padding: var(--lz-space-1) var(--lz-space-2);
	}

	/* Seis sellos apaisados no caben a 26px en una pantalla estrecha. */
	.lz-footer__seal img { height: 20px; }
}


/* ============================================================
   MOVIMIENTO REDUCIDO
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
	.lz-to-top,
	.lz-footer__social a,
	.lz-footer__seal {
		transition: none;
	}
}