/* =========================================================
   ADITI PROMOTERS — PREMIUM DARK FOOTER
   ========================================================= */

.site-footer {
	--footer-bg: #0b0e13;
	--footer-bg-deep: #080a0e;
	--footer-text: #f4f0e8;
	--footer-muted: #a6adb7;
	--footer-dim: #707781;
	--footer-gold: #c99a3e;
	--footer-line: rgba(255, 255, 255, 0.10);

	position: relative;
	z-index: 10;

	margin-top: 88px;

	color: var(--footer-text);

	background:
		radial-gradient(
			circle at 12% 18%,
			rgba(255, 255, 255, 0.035),
			transparent 30%
		),
		linear-gradient(
			180deg,
			#171a20 0%,
			#0d1015 52%,
			#080a0d 100%
		);

	border-top: 1px solid rgba(255, 255, 255, 0.12);

	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);

	overflow: hidden;
}


/* =========================================================
   MAIN
   ========================================================= */

.site-footer__main {
	padding: 68px 0 84px;
}

.site-footer__container {
	width: min(1280px, calc(100% - 64px));
	margin: 0 auto;

	display: grid;

	grid-template-columns:
		1.55fr
		0.72fr
		1fr
		1fr;

	column-gap: 72px;
}


/* =========================================================
   BRAND
   ========================================================= */

.site-footer__brand {
	max-width: 395px;
}

.site-footer__logo {
	display: inline-flex;
	align-items: center;

	margin-bottom: 30px;
}

.site-footer__logo a {
	display: inline-flex;
	align-items: baseline;
	gap: 9px;

	color: var(--footer-text);

	text-decoration: none;
}


/* WordPress custom logo */

.site-footer__logo .custom-logo-link {
	display: inline-flex;
	align-items: center;
}

.site-footer__logo .custom-logo {
	display: block;

	width: auto;
	max-width: 170px;
	height: auto;
	max-height: 52px;

	object-fit: contain;

	filter: brightness(0) invert(1);

	opacity: 0.95;

	transition:
		opacity 250ms ease,
		transform 250ms ease;
}

.site-footer__logo .custom-logo-link:hover .custom-logo {
	opacity: 1;
	transform: translateY(-2px);
}


/* Text fallback */

.site-footer__logo-text {
	font-family:
		"DM Serif Display",
		Georgia,
		serif;

	font-size: 25px;
	line-height: 1;

	letter-spacing: 0.08em;
}

.site-footer__logo-sub {
	font-family:
		"Inter",
		Arial,
		sans-serif;

	font-size: 8px;
	font-weight: 700;

	letter-spacing: 0.18em;

	color: var(--footer-gold);
}


.site-footer__accent {
	width: 44px;
	height: 2px;

	margin-bottom: 27px;

	background: var(--footer-gold);
}


/* =========================================================
   BRAND STATEMENT
   ========================================================= */

.site-footer__statement {
	max-width: 390px;

	margin: 0 0 20px;

	font-family:
		"DM Serif Display",
		"Playfair Display",
		Georgia,
		serif;

	font-size: clamp(32px, 3vw, 44px);
	font-weight: 400;

	line-height: 1.04;

	letter-spacing: -0.025em;

	color: var(--footer-text);
}


.site-footer__description {
	max-width: 375px;

	margin: 0;

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 13px;
	font-weight: 400;

	line-height: 1.8;

	color: var(--footer-muted);
}


/* =========================================================
   SOCIAL
   ========================================================= */

.site-footer__social {
	display: flex;
	align-items: center;
	flex-wrap: wrap;

	gap: 26px;

	margin-top: 37px;
}

.site-footer__social-link {
	display: inline-flex;
	align-items: center;
	gap: 9px;

	color: var(--footer-text);

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 10px;
	font-weight: 700;

	letter-spacing: 0.15em;
	text-transform: uppercase;

	text-decoration: none;

	transition:
		color 250ms ease,
		transform 250ms ease;
}

.site-footer__social-link > svg:first-child {
	width: 16px;
	height: 16px;

	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;

	flex: 0 0 auto;
}

.site-footer__social-link:nth-child(2) > svg:first-child {
	fill: currentColor;
	stroke: none;
}

.site-footer__social-link .site-footer__arrow {
	width: 12px;
	height: 12px;

	fill: none;
	stroke: var(--footer-gold);
	stroke-width: 1.6;

	transition: transform 250ms ease;
}

.site-footer__social-link:hover {
	color: var(--footer-gold);

	transform: translateY(-2px);
}

.site-footer__social-link:hover .site-footer__arrow {
	transform: translate(3px, -3px);
}


/* =========================================================
   COLUMNS
   ========================================================= */

.site-footer__column {
	padding-top: 4px;
}

.site-footer__eyebrow {
	margin: 0 0 30px;

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 10px;
	font-weight: 700;

	line-height: 1;

	letter-spacing: 0.20em;

	text-transform: uppercase;

	color: var(--footer-gold);
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.site-footer__nav {
	display: flex;
	flex-direction: column;

	gap: 17px;
}

.site-footer__nav a {
	position: relative;

	display: inline-flex;
	align-items: center;

	width: fit-content;

	color: var(--footer-text);

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 13px;
	font-weight: 400;

	line-height: 1.5;

	text-decoration: none;

	transition:
		color 250ms ease,
		transform 250ms ease;
}

.site-footer__nav a::after {
	content: "";

	position: absolute;

	left: 0;
	bottom: -4px;

	width: 0;
	height: 1px;

	background: var(--footer-gold);

	transition: width 280ms ease;
}

.site-footer__nav a i {
	margin-left: 12px;

	color: var(--footer-gold);

	font-size: 12px;
	font-style: normal;

	opacity: 0;

	transform: translate(-4px, 4px);

	transition:
		opacity 250ms ease,
		transform 250ms ease;
}

.site-footer__nav a:hover {
	color: var(--footer-gold);

	transform: translateX(3px);
}

.site-footer__nav a:hover::after {
	width: 100%;
}

.site-footer__nav a:hover i {
	opacity: 1;

	transform: translate(0, 0);
}


/* =========================================================
   CONTACT
   ========================================================= */

.site-footer__contact {
	display: flex;
	flex-direction: column;

	gap: 19px;
}

.site-footer__contact a {
	display: flex;
	flex-direction: column;

	gap: 4px;

	color: var(--footer-text);

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 13px;
	line-height: 1.5;

	text-decoration: none;

	transition: color 250ms ease;
}

.site-footer__contact-label {
	font-size: 8px;
	font-weight: 700;

	line-height: 1;

	letter-spacing: 0.18em;
	text-transform: uppercase;

	color: var(--footer-dim);
}

.site-footer__contact a:hover {
	color: var(--footer-gold);
}


/* =========================================================
   ADDRESS
   ========================================================= */

.site-footer__address {
	margin: 0;

	color: var(--footer-muted);

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 13px;
	font-style: normal;

	line-height: 1.8;
}

.site-footer__whatsapp {
	display: inline-flex;
	align-items: center;
	gap: 10px;

	margin-top: 26px;

	color: var(--footer-text);

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 10px;
	font-weight: 700;

	letter-spacing: 0.14em;
	text-transform: uppercase;

	text-decoration: none;

	transition: color 250ms ease;
}

.site-footer__whatsapp svg {
	width: 16px;
	height: 16px;

	fill: none;
	stroke: var(--footer-gold);
	stroke-width: 1.6;

	transition: transform 250ms ease;
}

.site-footer__whatsapp:hover {
	color: var(--footer-gold);
}

.site-footer__whatsapp:hover svg {
	transform: translateX(5px);
}


/* =========================================================
   BOTTOM BAR
   ========================================================= */

.site-footer__bottom {
	background: #07090c;
	border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.site-footer__bottom-container {
	width: min(1280px, calc(100% - 64px));
	margin: 0 auto;

	min-height: 70px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 30px;
}

.site-footer__bottom p {
	margin: 0;

	color: #69717b;

	font-family:
		"Inter",
		"Helvetica Neue",
		Arial,
		sans-serif;

	font-size: 9px;
	font-weight: 500;

	line-height: 1.5;

	letter-spacing: 0.07em;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

	.site-footer__main {
		padding-top: 60px;
	}

	.site-footer__container {
		width: min(100% - 52px, 900px);

		grid-template-columns:
			1.5fr
			1fr
			1fr;

		row-gap: 60px;
		column-gap: 45px;
	}

	.site-footer__brand {
		grid-column: 1 / -1;

		max-width: 620px;
	}

	.site-footer__bottom-container {
		width: min(100% - 52px, 900px);
	}
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.site-footer {
		margin-top: 60px;
	}

	.site-footer__main {
		padding: 48px 0 60px;
	}

	.site-footer__container {
		width: calc(100% - 32px);

		grid-template-columns: 1fr;

		gap: 50px;
	}

	.site-footer__brand {
		grid-column: auto;
	}

	.site-footer__logo {
		margin-bottom: 24px;
	}

	.site-footer__logo .custom-logo {
		max-width: 150px;
		max-height: 45px;
	}

	.site-footer__accent {
		margin-bottom: 23px;
	}

	.site-footer__statement {
		font-size: 34px;
	}

	.site-footer__description {
		font-size: 13px;
	}

	.site-footer__social {
		margin-top: 29px;
		gap: 20px;
	}

	.site-footer__column {
		padding-top: 0;
	}

	.site-footer__eyebrow {
		margin-bottom: 22px;
	}

	.site-footer__bottom-container {
		width: calc(100% - 32px);

		min-height: auto;

		padding: 21px 0;

		flex-direction: column;
		align-items: flex-start;

		gap: 7px;
	}

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.site-footer a:focus-visible {
	outline: 1px solid var(--footer-gold);
	outline-offset: 5px;
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

	.site-footer *,
	.site-footer *::before,
	.site-footer *::after {
		transition: none !important;
		transform: none !important;
	}

}