/* Los Diaz · footer.css — footer global (Theme Builder → Footer global).
   Marca (logo + texto + redes) | Tienda | Ayuda, y franja legal.
   El fondo es el color global "Texto" (lo pone Divi en la sección). */

:root {
	--cc-footer-logo: 112px;
}

#page-container #et-boc .cc-footer {
	padding: 0;
}

#page-container #et-boc .cc-footer-fila {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr;
	gap: 48px;
	width: min(100% - 2 * var(--gvid-cc-margen-lateral), var(--gvid-cc-ancho-contenido));
	max-width: none;
	padding: 64px 0 32px;
}

#page-container #et-boc .cc-footer-fila > .et_pb_column {
	width: auto;
	margin: 0;
	float: none;
}

/* Marca: logo a la izquierda, texto y redes a la derecha. */
#page-container #et-boc .cc-footer-marca {
	display: grid;
	grid-template-columns: var(--cc-footer-logo) 1fr;
	column-gap: 20px;
	align-content: start;
}

#page-container #et-boc .cc-footer-logo {
	grid-row: span 2;
	width: var(--cc-footer-logo);
	margin: 0;
}

#page-container #et-boc .cc-footer-logo img {
	width: var(--cc-footer-logo);
	height: var(--cc-footer-logo);
	/* El logo es marrón: se pasa a claro sobre el fondo oscuro. */
	filter: brightness(0) invert(1);
	opacity: 0.95;
}

#page-container #et-boc .cc-footer p {
	padding: 0;
	color: var(--cc-texto-sobre-oscuro);
}

#page-container #et-boc .cc-footer .cc-etiqueta {
	color: var(--cc-crema);
}

#page-container #et-boc .cc-footer-texto p + p {
	max-width: 280px;
	margin-top: 14px;
}

#page-container #et-boc .cc-footer-redes {
	margin-top: 16px;
}

/* Columnas de enlaces. */
#page-container #et-boc .cc-footer-titulo {
	margin: 0 0 18px;
	padding: 0;
	color: var(--cc-texto-sobre-oscuro);
	font-family: var(--et_global_body_font);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0;
}

#page-container #et-boc .cc-footer-links {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#page-container #et-boc .cc-footer a {
	color: var(--cc-texto-sobre-oscuro);
	font-size: var(--gvid-cc-texto-chico);
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 3px;
	transition: text-decoration-color var(--cc-duracion) var(--cc-curva);
}

#page-container #et-boc .cc-footer a:hover {
	color: var(--cc-superficie);
	text-decoration-color: currentColor;
}

/* Redes: círculos con borde tenue. */
#page-container #et-boc .cc-redes {
	display: flex;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Divi pone viñeta a las listas dentro de módulos Texto. */
#page-container #et-boc .cc-redes li,
#page-container #et-boc .cc-footer-links li {
	padding: 0;
	list-style: none;
}

#page-container #et-boc .cc-redes a.cc-red {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: var(--gvid-cc-borde) solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	transition:
		border-color var(--cc-duracion) var(--cc-curva),
		background-color var(--cc-duracion) var(--cc-curva);
}

#page-container #et-boc .cc-redes a.cc-red:hover {
	border-color: var(--cc-superficie);
	background-color: rgba(255, 255, 255, 0.08);
}

/* Franja legal. */
#page-container #et-boc .cc-footer-legal {
	width: 100%;
	max-width: none;
	padding: 20px var(--gvid-cc-margen-lateral);
	border-top: var(--gvid-cc-borde) solid rgba(255, 255, 255, 0.14);
}

#page-container #et-boc .cc-footer-legal-texto .et_pb_text_inner {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	width: min(100%, var(--gvid-cc-ancho-contenido));
	margin-inline: auto;
}

#page-container #et-boc .cc-footer-legal p,
#page-container #et-boc .cc-footer-legal a {
	color: var(--cc-crema);
	font-size: var(--gvid-cc-texto-etiqueta);
}

#page-container #et-boc .cc-footer-legal-texto .et_pb_text_inner {
	align-items: center;
}

/* ---- Crédito de la agencia (barra legal, a la derecha) -------------------------
   El de Ishiku Lemu, sin «Agencia digital» (pedido 17-10): «Tregul» en Unbounded (fuente
   recortada a esas letras, 2 KB) con un puntero tornasol que hace clic cada 3,2 s. Puntero
   y anillo son pseudoelementos. */
@font-face {
	font-family: "Unbounded Tregul";
	src: url("../fonts/unbounded-tregul.woff2") format("woff2");
	font-weight: 200 900;
	font-display: swap;
}

#page-container #et-boc .cc-footer-legal p.cc-credito {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 0.25rem 0.75rem;
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

/* Nebula Studio: su logo redondo, a la izquierda del de Tregul (pedido 19-10). Va como
   fondo para no escribir la URL del tema en el footer de Divi. */
#page-container #et-boc .cc-footer-legal a.cc-credito__nebula {
	display: block;
	align-self: center;
	width: 2.75rem;
	height: 2.75rem;
	background: url("../img/nebula-studio.webp") center / contain no-repeat;
	opacity: 0.9;
	transition: opacity var(--cc-duracion) var(--cc-curva), transform var(--cc-duracion) var(--cc-curva);
}

#page-container #et-boc .cc-footer-legal a.cc-credito__nebula:hover,
#page-container #et-boc .cc-footer-legal a.cc-credito__nebula:focus-visible {
	opacity: 1;
	transform: rotate(-8deg);
}

#page-container #et-boc .cc-footer-legal a.cc-credito__marca {
	color: var(--cc-crema);
	font-size: 1.375rem;
	line-height: 1;
	text-decoration: none;
}

.cc-credito__nombre {
	position: relative;
	padding-right: 0.5em;
	font-family: "Unbounded Tregul", var(--et_global_body_font), sans-serif;
	font-weight: 700;
	letter-spacing: -0.01em;
}

/* Anillo del clic. */
.cc-credito__nombre::before {
	content: "";
	position: absolute;
	right: 0.26em;
	bottom: 0.1em;
	width: 0.4em;
	height: 0.4em;
	border: 0.045em solid #4FD8EB;
	border-radius: 50%;
	opacity: 0;
	animation: cc-credito-clic 3.2s cubic-bezier(0.2, 0.8, 0.2, 1) infinite;
}

/* Puntero tornasol (cian → verde → ámbar, los colores de Tregul). */
.cc-credito__nombre::after {
	content: "";
	position: absolute;
	right: -0.02em;
	bottom: -0.24em;
	width: 0.6em;
	height: 0.6em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' x2='1'%3E%3Cstop offset='0' stop-color='%234fd8eb'/%3E%3Cstop offset='.5' stop-color='%23a6d89b'/%3E%3Cstop offset='1' stop-color='%23ffb547'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M3 2l17 9-7.5 1.8L9 20z' fill='url(%23g)' stroke='%230b1a1f' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	animation: cc-credito-presion 3.2s cubic-bezier(0.2, 0.8, 0.2, 1) infinite;
}

.cc-credito__marca:hover .cc-credito__nombre::before,
.cc-credito__marca:hover .cc-credito__nombre::after,
.cc-credito__marca:focus-visible .cc-credito__nombre::before,
.cc-credito__marca:focus-visible .cc-credito__nombre::after {
	animation-duration: 1.2s;
}

@keyframes cc-credito-presion {
	0%, 62%, 100% { transform: translate(0, 0); }
	68% { transform: translate(-0.04em, -0.04em) scale(0.9); }
}

@keyframes cc-credito-clic {
	0%, 64% { transform: scale(0.4); opacity: 0; }
	70% { opacity: 0.85; }
	100% { transform: scale(1.5); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.cc-credito__nombre::after {
		animation: none;
	}

	.cc-credito__nombre::before {
		animation: none;
		opacity: 0.7;
	}
}

@media (max-width: 980px) {
	#page-container #et-boc .cc-footer-fila {
		grid-template-columns: 1fr 1fr;
		gap: 36px;
	}

	#page-container #et-boc .cc-footer-marca {
		grid-column: 1 / -1;
	}
}

@media (max-width: 600px) {
	#page-container #et-boc .cc-footer-fila {
		grid-template-columns: 1fr;
	}

	#page-container #et-boc .cc-footer-marca {
		grid-template-columns: 1fr;
		row-gap: 16px;
	}

	#page-container #et-boc .cc-footer-logo {
		grid-row: auto;
	}

	#page-container #et-boc .cc-footer-legal-texto .et_pb_text_inner {
		flex-direction: column;
		align-items: center;
		gap: 14px;
		text-align: center;
	}

	#page-container #et-boc .cc-footer-legal p.cc-credito {
		justify-content: center;
	}
}