/**
 * PX Footer Base — Shared styles for all footer modules
 *
 * Logo section + bottom bar (cert, copyright, legal links).
 * Used by: px-footer, px-lp-footer, px-winkel-footer.
 */


/* ==========================================================================
   Back to Top
   ========================================================================== */

.px-footer-base__back-top {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: calc(-1 * var(--space-d15));
}


/* ==========================================================================
   Logo
   ========================================================================== */

.px-footer-base__logo {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-d15);
}

.px-footer-base__logo svg {
	width: clamp(165px, 15vw, 263px);
	height: auto;
}


/* ==========================================================================
   Footer Bottom
   ========================================================================== */

.px-footer-base__bottom {
	max-width: var(--row-width);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-d3);
}

/* Certification image */
.px-footer-base__cert {
	max-height: var(--space-d3);
	width: auto;
	max-width: fit-content;
}

/* Bottom bar: copyright + legal links in a horizontal row */
.px-footer-base__bottom-bar {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: var(--space-d1);
	width: 100%;
}

/* Copyright text */
.px-footer-base__copyright {
	margin: 0;
	font-family: var(--font-body);
	font-weight: var(--weight-regular);
	font-size: var(--text-d075);
	line-height: var(--lh-normal);
	color: var(--gray-dark);
}

/* Legal links nav */
.px-footer-base__legal {
	display: flex;
	gap: var(--space-d1);
}

.px-footer-base__legal-link {
	font-family: var(--font-display);
	font-weight: var(--weight-medium);
	font-size: var(--text-d075);
	line-height: var(--lh-normal);
	color: var(--gray-dark);
	text-decoration: underline;
	padding: var(--space-d05) 0;
	transition: color var(--duration-normal) var(--ease-smooth);
}

.px-footer-base__legal-link:hover {
	color: var(--action);
	text-decoration: none;
}

.px-footer-base__legal-link:focus-visible {
	outline: solid 3px var(--btn-focus-ring);
	outline-offset: 2px;
}


/* ==========================================================================
   Responsive — Mobile
   ========================================================================== */

@media screen and (max-width: 767px) {
	.px-footer-base__bottom-bar {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-d05);
	}

	.px-footer-base__legal {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-d05);
	}
}