/**
 * Shared hello-footer — template-parts/home/hello-footer.php (all native pages).
 */

body.da-native-shell .home-hello-footer .container {
	max-width: 1480px;
	margin: 0 auto;
	padding-left: var(--da-container-pad-x);
	padding-right: var(--da-container-pad-x);
	box-sizing: border-box;
	width: 100%;
}

.home-hello-footer .container {
	position: relative;
	z-index: 1;
	padding-top: clamp(64px, 9vw, 104px);
	padding-bottom: clamp(28px, 4vw, 30px);
}

.home-hello-footer__watermark {
	position: absolute;
	top: clamp(-12px, 1vw, 24px);
	right: clamp(-8px, 3vw, 50px);
	margin: 0;
	font-family: var(--fb, 'Biennale-Bold', Georgia, serif);
	font-weight: 700;
	font-size: clamp(80px, 18vw, 170px);
	line-height: 0.9;
	letter-spacing: -0.05em;
	color: rgba(21, 21, 21, 0.06);
	pointer-events: none;
	user-select: none;
}

.home-hello-footer__brand,
.home-hello-footer__brand:visited {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: #151515;
	margin-bottom: clamp(35px, 5vw, 50px);
}

.home-hello-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.home-hello-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: clamp(56px, 8vw, 60px);
	padding-top: clamp(28px, 4vw, 30px);
	border-top: 1px solid rgba(21, 21, 21, 0.2);
}

.home-hello-footer__links a,
.home-hello-footer__links a:visited {
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	font-family: var(--fs, 'Satoshi', system-ui, sans-serif);
	font-weight: 500;
	line-height: 1.4;
	color: rgba(21, 21, 21, 0.82);
	text-decoration: none;
	backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	transform: translate3d(0, 0, 0);
	transition: transform 160ms var(--ease-c);
}

@media (max-width: 767px) {
	.home-hello-footer .container {
		padding-top: 80px;
		padding-bottom: 20px;
	}

	.home-hello-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 5px;
		margin-top: var(--da-mobile-gap);
		padding-top: var(--da-mobile-gap);
	}
}
