/*
--------------------------------------
Footer Template 1 - Responsive Styles
Breakpoints: 768px (mobile), 1024px (tablet)
--------------------------------------
*/

/*
--------------------------------------
Mobile: < 768px
--------------------------------------
*/

@media (max-width: 767px) {
	
	/* Top Section */
	.footer-variant-1 .footer-template-1__top {
		display: none;
	}

	.footer-variant-1 .footer-template-1__top-middle {
		display: grid;
		grid-template-columns: 1fr;
		row-gap: var(--spacing-lg, 24px);
	}
	
	.footer-variant-1 .footer-template-1__logo-img {
		height: 40px;
	}

	.footer-variant-1 .footer-template-1__logo-svg svg {
		height: 40px;
	}
	
	.footer-variant-1 .footer-template-1__social {
		width: 100%;
		justify-content: flex-start;
	}
	
	/* Middle Section */
	.footer-variant-1 .footer-template-1__middle {
		display: none;
	}
	
	.footer-variant-1 .footer-template-1__legal {
		max-width: 100%;
	}
	
	/* Bottom Section */
	.footer-variant-1 .footer-template-1__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--spacing-xl, 32px);
		padding-top: var(--spacing-xl, 32px);
	}
	
	.footer-variant-1 .footer-template-1__credit {
		order: 2;
	}
	
	.footer-variant-1 .footer-template-1__slogan {
		order: 1;
		justify-content: flex-start;
	}
	
	.footer-variant-1 .footer-template-1__slogan-text {
		font-size: clamp(20px, 6vw, 32px);
		white-space: normal;
		word-break: break-word;
	}
	
	/* Legal Links */
	
	.footer-variant-1 .footer-legal .footer-legal__link {
		font-size: var(--font-size-sm, 12px);
	}
}

/*
--------------------------------------
Tablet: 768px - 1023px
--------------------------------------
*/

@media (min-width: 768px) and (max-width: 1023px) {
	
	/* Top Section */
	.footer-variant-1 .footer-template-1__top {
		padding-bottom: var(--spacing-xl, 32px);
	}
	
	.footer-variant-1 .footer-template-1__logo-img {
		height: 45px;
	}

	.footer-variant-1 .footer-template-1__logo-svg svg {
		height: 45px;
	}
	
	/* Bottom Section */
	.footer-variant-1 .footer-template-1__bottom {
		flex-wrap: wrap;
		gap: var(--spacing-lg, 24px);
	}
	
	.footer-variant-1 .footer-template-1__slogan-text {
		font-size: clamp(28px, 5vw, 40px);
	}
}

/*
--------------------------------------
Desktop: > 1024px
--------------------------------------
*/

@media (min-width: 1024px) {
	
	/* Hover Effects Enhanced */
	.footer-variant-1 .footer-social .footer-social__link:hover {
		transform: translateY(-2px);
	}
	
	.footer-variant-1 .footer-legal .footer-legal__link:hover {
		transform: translateX(4px);
	}
}
