/*
 * Site footer — Figma "SAP Footer / Global" (CRH file CPO8VrN83OFQrdnEQ6hRGX,
 * 6338:74694: Desktop 6276:52962, Tablet 6338:74695, Mobile 6338:74822) and
 * its bottom line "Footer / Secure" (28356:53414).
 *
 * Served directly, like block CSS; bin/add-fallbacks.mjs generates the var()
 * fallbacks. Type metrics come from the composite classes in the markup
 * (.text-label-sm, .text-paragraph-sm, .text-paragraph-xs); this file is
 * color and layout only. Side padding is --section-hr-padding, which the
 * token layer already steps down per breakpoint (64 / 32 / 20px).
 */

.site-footer {
	background: var(--background, #ffffff);
	color: var(--muted-foreground, #666666);
}

.site-footer__inner {
	max-width: var(--container-max-width, 1440px);
	margin-inline: auto;
	padding: var(--spacing-10, 40px) var(--section-hr-padding, 64px) var(--spacing-7, 28px);
}

/* Logo wall ------------------------------------------------------------------ */

.site-footer__logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-6, 24px) var(--spacing-8, 32px);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Every logo fits the comp's largest box, whatever its proportions. */
.site-footer__logo img {
	display: block;
	width: auto;
	height: auto;
	max-width: 112px;
	max-height: 60px;
	object-fit: contain;
}

.site-footer__logo a,
.site-footer__logo a:hover {
	display: block;
	border-bottom-color: transparent;
}

/* Dividers ------------------------------------------------------------------- */

/* Figma: a 1px muted-foreground stroke at 20% opacity, 28px above and below. */
.site-footer__divider {
	height: 0;
	margin: var(--spacing-7, 28px) 0;
	border: 0;
	border-top: var(--border-width-1, 1px) solid var(--muted-foreground, #666666);
	opacity: 0.2;
}

/* Link columns --------------------------------------------------------------- */

.site-footer__columns {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--spacing-6, 24px);
}

.site-footer__column {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-2, 8px);
	min-width: 128px;
}

.site-footer__heading {
	margin: 0;
	padding-bottom: var(--spacing-2, 8px);
	color: var(--foreground, #333333);
}

.site-footer__lines {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-2, 8px);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Links read as the surrounding copy; the global link rule adds the hover
   underline in the same color. */
.site-footer__link {
	color: var(--muted-foreground, #666666);
}

/* Disclaimer ----------------------------------------------------------------- */

.site-footer__disclaimer {
	max-width: 600px;
	margin-inline: auto;
	text-align: center;
}

.site-footer__disclaimer p {
	margin: 0;
}

/* The comp separates the two paragraphs with one empty line of the same size. */
.site-footer__disclaimer p + p {
	margin-top: 1.2em;
}

/* Bottom line ---------------------------------------------------------------- */

.site-footer__bottom {
	max-width: var(--container-max-width, 1440px);
	margin-inline: auto;
	padding: var(--spacing-4, 16px) var(--section-hr-padding, 64px);
}

.site-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--spacing-4, 16px);
}

.site-footer__legal p {
	margin: 0;
}

/* Mobile --------------------------------------------------------------------- */

@media (max-width: 767px) {
	.site-footer__logos {
		gap: var(--spacing-6, 24px);
	}

	.site-footer__logo img {
		max-width: 88px;
		max-height: 45px;
	}

	.site-footer__columns {
		flex-direction: column;
	}

	.site-footer__disclaimer {
		max-width: none;
	}
}

/* DANCEQUEST footer — the live Divi footer: #f9f9f9 band with logo · address ·
   map · links in four columns, then a dark credit bar. */
.site-footer--dq .site-footer__main {
	background: #f9f9f9;
}

.site-footer__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--spacing-8, 32px);
	align-items: center;
	padding-block: var(--spacing-16, 64px);
}

.site-footer__col--logo img {
	display: block;
	width: 100%;
	max-width: 240px;
	height: auto;
}

.site-footer__col--address {
	line-height: 2;
	color: var(--muted-foreground, #666666);
}

.site-footer__col--map iframe {
	display: block;
	width: 100%;
	height: 240px;
	border: 0;
}

.site-footer__menu {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 2;
}

.site-footer__menu a {
	color: #6d6d6d;
	text-transform: lowercase;
	border-bottom: 0;
}

.site-footer__menu a:hover {
	color: var(--primary, #325cb2);
}

.site-footer--dq .site-footer__bottom {
	background: #1f1f1f;
}

.site-footer__credit {
	max-width: var(--container-max-width, 1440px);
	margin-inline: auto;
	padding: var(--spacing-4, 16px) var(--section-hr-padding, 64px);
	color: #666666;
}

.site-footer__credit p { margin: 0; }

.site-footer__credit a {
	font-weight: 700;
	color: #666666;
	border-bottom: 0;
}

@media (max-width: 980px) {
	.site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
	.site-footer__grid { grid-template-columns: 1fr; text-align: center; }
	.site-footer__col--logo img { margin-inline: auto; }
}

/* DANCEQUEST container — the live footer and credit bar sit in Divi's 80% column. */
@media (min-width: 768px) {
	.site-footer--dq .site-footer__inner,
	.site-footer--dq .site-footer__credit {
		width: 80%;
		max-width: none;
		padding-inline: 0;
	}
}
.site-footer__credit { text-align: left; }

/* DANCEQUEST bar — full-bleed dark bar, credit left-aligned in the 80% column;
   on phones the whole footer stays left-aligned in that column too. */
.site-footer--dq .site-footer__bottom {
	max-width: none;
	padding: 0;
}
.site-footer--dq .site-footer__legal {
	justify-content: flex-start;
}
@media (max-width: 767px) {
	.site-footer--dq .site-footer__inner,
	.site-footer--dq .site-footer__credit {
		width: 80%;
		padding-inline: 0;
	}
	.site-footer__grid { text-align: left; gap: var(--spacing-6, 24px); }
	.site-footer__col--logo img { margin-inline: 0; max-width: 100%; }
}
