/**
 * Site footer.
 *
 * Figma desktop 10210:4018 — outer bg #F8F8F8; black crest (curves 120 × 96,
 *   plate padding 24px 64px, logo 235 × 48); black body padding 60px 100px,
 *   gap 40; six columns space-between; title Bold 18/28, list gap 10, item
 *   gap 16, contact icon 28; divider then row gap 60; legal 16/24, privacy
 *   opacity .75; social 54 × 54 gap 8.
 * Figma mobile 10343:5169 — curves 75 × 60, plate padding 14px 39.9px, logo
 *   150 × 30.6; body padding 40px 20px, gap 32; columns stacked gap 40;
 *   legal and social stacked gap 32.
 */

.ae-footer {
	width: 100%;
	background-color: var(--ae-color-grey-100, #f8f8f8);
}

/* Crest ----------------------------------------------------------------- */

.ae-footer__crest {
	display: flex;
	align-items: stretch;
	justify-content: center;
	width: 100%;
}

.ae-footer__crest-curve {
	flex-shrink: 0;
	/* 75px at 375 → 120px at 1440 */
	width: clamp(75px, calc(75px + 45 * var(--ae-fluid)), 120px);
	height: auto;
	align-self: stretch;
	object-fit: fill;
}

.ae-footer__crest-plate {
	display: flex;
	align-items: center;
	justify-content: center;
	/* Mobile fills the space between the curves; desktop hugs the logo. */
	flex: 1 1 auto;
	min-width: 0;
	background-color: var(--ae-color-black, #000);
	padding-block: clamp(14px, calc(14px + 10 * var(--ae-fluid)), 24px);
	padding-inline: clamp(20px, calc(20px + 44 * var(--ae-fluid)), 64px);
}

.ae-footer__crest-link {
	display: block;
	line-height: 0;
}

.ae-footer__logo {
	width: auto;
	/* 30.638px at 375 → 48px at 1440 */
	max-height: clamp(30.638px, calc(30.638px + 17.362 * var(--ae-fluid)), 48px);
	object-fit: contain;
}

/* Body ------------------------------------------------------------------ */

.ae-footer__body {
	width: 100%;
	background-color: var(--ae-color-black, #000);
	color: var(--ae-color-white, #fff);
}

.ae-footer__inner {
	display: flex;
	flex-direction: column;
	/* 32px at 375 → 40px at 1440 */
	gap: clamp(32px, calc(32px + 8 * var(--ae-fluid)), 40px);
	width: 100%;
	max-width: 100%;
	margin-inline: auto;
	/* 40px at 375 → 60px at 1440 */
	padding-block: clamp(40px, calc(40px + 20 * var(--ae-fluid)), 60px);
	/* Section container rule: 20px mobile / 60px tablet / 100px÷1440 desktop */
	padding-inline: 20px;
}

@media (min-width: 768px) {
	.ae-footer__inner {
		padding-inline: 60px;
	}
}

@media (min-width: 1025px) {
	.ae-footer__inner {
		padding-inline: var(--ae-section-padding-desktop);
	}
}

/* Widget columns -------------------------------------------------------- */

.ae-footer__widgets {
	display: flex;
	flex-wrap: wrap;
	/* Stacked at 375 with 40px gap; spread across the row on desktop. */
	gap: 40px;
	width: 100%;
}

.ae-footer__widget {
	display: flex;
	flex-direction: column;
	gap: 16px;
	/* Full width while stacked; columns share the row once there is space. */
	flex: 1 1 100%;
	min-width: 0;
}

.ae-footer__widget-title {
	font-size: 18px;
	line-height: 28px;
	font-weight: 700;
	color: var(--ae-color-white, #fff);
}

.ae-footer__widget-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ae-footer__widget-item {
	display: block;
}

/* Figma Contact us rows: 28px icon, 16px gap, items-start. */
.ae-footer__widget-item--has-icon {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	max-width: 280px;
}

.ae-footer__widget-icon {
	display: block;
	flex-shrink: 0;
	width: 28px;
	height: 28px;
}

.ae-footer__widget-icon img {
	display: block;
	width: 28px;
	height: 28px;
	object-fit: contain;
}

.ae-footer__widget-link,
.ae-footer__widget-text {
	display: block;
	font-size: 18px;
	line-height: 28px;
	font-weight: 400;
	color: var(--ae-color-white, #fff);
	text-decoration: none;
}

.ae-footer__widget-link:hover,
.ae-footer__widget-link:focus-visible {
	text-decoration: underline;
}

/* Base row -------------------------------------------------------------- */

.ae-footer__base {
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
}

.ae-footer__divider {
	width: 100%;
	height: 0;
	margin: 0;
	border: 0;
	border-top: 2px solid rgba(255, 255, 255, 0.2);
}

.ae-footer__base-row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
	width: 100%;
}

.ae-footer__legal {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 auto;
	min-width: 0;
	font-size: 16px;
	line-height: 24px;
	color: var(--ae-color-white, #fff);
}

.ae-footer__legal p {
	margin: 0;
}

.ae-footer__privacy {
	opacity: 0.75;
}

.ae-footer__social {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ae-footer__social-link {
	display: block;
	width: 54px;
	height: 54px;
}

.ae-footer__social-link img {
	width: 54px;
	height: 54px;
	object-fit: contain;
}

.ae-footer__social-link:hover img,
.ae-footer__social-link:focus-visible img {
	opacity: 0.8;
}

/* Reflow ---------------------------------------------------------------- */

/* Columns start sharing the row once there is room for two. */
@media (min-width: 560px) {
	.ae-footer__widget {
		flex: 1 1 calc(50% - 20px);
	}
}

@media (min-width: 768px) {
	.ae-footer__widget {
		flex: 1 1 calc(33.3333% - 27px);
	}
}

@media (min-width: 1025px) {

	.ae-footer__crest-plate {
		flex: 0 0 auto;
	}

	.ae-footer__widgets {
		flex-wrap: nowrap;
		justify-content: space-between;
		gap: 32px;
	}

	.ae-footer__widget {
		flex: 0 1 auto;
	}

	/* The contact column carries the fixed 280px measure from Figma. */
	.ae-footer__widget:first-child {
		flex: 0 0 auto;
	}

	.ae-footer__base-row {
		flex-direction: row;
		align-items: center;
		gap: 60px;
	}

	.ae-footer__social {
		flex-wrap: nowrap;
	}
}
