/**
 * Footer Styles (BEM)
 * Block: .footer
 */

/* ==========================================================================
   Footer Block
   ========================================================================== */

.footer {
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
}

/* ==========================================================================
   Footer Main Section
   ========================================================================== */

.footer__main {
	width: 100%;
	background-color: var(--color-dark-bg);
}

.footer__main-wrapper {
	padding: var(--spacing-4xl) 0;
	display: flex;
	align-items: flex-start;
	gap: 0;
}

/* ==========================================================================
   Footer Logo
   ========================================================================== */

.footer__logo {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start; 
	justify-content: space-between;
	align-self: stretch;
}

.footer__logo svg {
	width: 17.6rem;
}

.footer__sublogo svg {
	width: 8.7rem;
}


/* ==========================================================================
   Footer Content (Nav + Contacts)
   ========================================================================== */

.footer__content {
	flex: 1;
	display: flex;
	gap: 0;
}

/* ==========================================================================
   Footer Navigation
   ========================================================================== */

.footer__nav {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.footer__nav-list {
	display: flex;
	flex-direction: column;
}

.footer__nav-item {
	padding: 1.4rem 0;
}

.footer__nav-link {
	color: var(--color-white);
	font-family: var(--font-inter);
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-snug);
	transition: opacity var(--transition-fast);
}

.footer__nav-link:hover {
	opacity: 0.7;
}

/* ==========================================================================
   Footer Contacts
   ========================================================================== */

.footer__contacts {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.footer__contact-item {
	padding: 1.4rem 0;
}

.footer__contact-link,
.footer__contact-text {
	color: var(--color-white);
	font-family: var(--font-inter);
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-snug);
	transition: opacity var(--transition-fast);
}

.footer__contact-link:hover {
	opacity: 0.7;
}

.footer__address {
	padding: 1.4rem 0;
	min-height: 9.2rem;
}

.footer__address-text {
	color: var(--color-white);
	font-family: var(--font-inter);
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-snug);
}

/* ==========================================================================
   Footer Divider
   ========================================================================== */

.footer__divider {
	width: 100%;
	height: 0.1rem;
	background-color: var(--color-black-700);
}

/* ==========================================================================
   Footer Bottom Section (Legal Links)
   ========================================================================== */
.footer__bottom {
	width: 100%;
	background-color: var(--color-dark-footer);
}

.footer__bottom-wrapper {
	padding: var(--spacing-xl) 0;
	display: flex;
	align-items: flex-start;
	gap: var(--spacing-lg);
	flex-wrap: wrap;
}

.footer__legal-links .menu {
	display: flex;
	align-items: center;
	gap: var(--spacing-lg);
	flex-wrap: wrap;
}

.footer__legal-links a {
	color: var(--color-black-600);
	font-family: var(--font-inter);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-height-snug);
	transition: color var(--transition-fast);
}

.footer__legal-links a:hover {
	color: var(--color-white);
}

/* ==========================================================================
   Footer Disclaimer
   ========================================================================== */

.footer__disclaimer {
	width: 100%;
	background-color: var(--color-dark-footer);
}

.footer__disclaimer-wrapper {
	padding: var(--spacing-xl) 0;
	display: flex;
	align-items: center;
	gap: var(--spacing-lg);
	flex-wrap: wrap;
}

.footer__disclaimer-text {
	color: var(--color-black-600);
	font-family: var(--font-inter);
	font-size: 4.95rem;
	font-weight: var(--font-weight-regular);
	line-height: var(--line-height-snug);
	text-transform: uppercase;
}

.footer__disclaimer-text span:nth-child(1) {
    letter-spacing: 0.1rem;
}

.footer__disclaimer-text span:nth-child(2) {
    letter-spacing: 0.255rem;
}

.footer__disclaimer-text span:nth-child(3) {
    letter-spacing: 0.24rem;
}

/* ==========================================================================
   Footer Copyright
   ========================================================================== */

.footer__copyright {
	color: var(--color-black-600);
	font-family: var(--font-inter);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-height-snug);
	margin-left: auto;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1089px) {

	.footer__main {
		padding: 4rem 0;
		flex-direction: column;
		gap: var(--spacing-3xl);
	}

	.footer__main-wrapper {
		padding: 0;
		flex-direction: column;
		gap: 4rem;
	}

	.footer__bottom {
		padding: 1.6rem 0;
	}

	.footer__bottom-wrapper {
		padding: 0;
		display: flex;
		align-items: flex-start;
		gap: 1.6rem;
		flex-wrap: wrap;
		flex-direction: column;
	}

	.footer__logo {
		width: 100%;
		margin-bottom: 0;
		flex-direction: row;
	}

	.footer__logo svg,
	.footer__sublogo svg {
		width: auto;
		height: 4.4rem;
	}

	.footer__content {
		width: 100%;
		flex-direction: column;
		gap: 4rem;
	}

	.footer__contact-item,
	.footer__nav-item {
		padding: 1.2rem 0;
	}

	.footer__contact-link,
	.footer__nav-link {
		font-size: var(--font-size-md);
		line-height: var(--line-height-snug);
	}

	.footer__address {
		padding: 1.2rem 0;
		min-height: fit-content;
	}

	.footer__address-text {
		font-size: var(--font-size-md);
		line-height: var(--line-height-snug);
	}

	.footer__nav,
	.footer__contacts {
		width: 100%;
	}

	.footer__legal-links .menu {
		flex-direction: column;
		align-items: flex-start;
		gap: .6rem;
	}

	.footer__legal-links a {
		font-size: var(--font-size-sm);
		line-height: var(--line-height-snug);
	}

	.footer__copyright {
		margin-left: 0;
		margin-top: 0;
	}

	.footer__disclaimer-wrapper {
		padding: var(--spacing-lg) 0;
	}

	.footer__disclaimer-text {
		font-size: var(--font-size-lg);
		line-height: var(--line-height-snug);
	}
}
