.yd-footer-v2 {
	/* --- Surface --- */
	--yd-f2-bg: var( --yd-black, #000 );
	--yd-f2-card: #0d0d0d;
	--yd-f2-card-hover: #151515;
	--yd-f2-border: rgba( 255, 255, 255, 0.09 );
	--yd-f2-border-strong: rgba( 255, 255, 255, 0.16 );

	/* --- Type --- */
	--yd-f2-heading: #fff;
	--yd-f2-text: rgba( 255, 255, 255, 0.62 );
	--yd-f2-text-strong: rgba( 255, 255, 255, 0.86 );
	--yd-f2-accent: var(--yd-primary);

	/* --- Rhythm --- */
	--yd-f2-radius: 20px;
	--yd-f2-gap: clamp( 28px, 3.2vw, 56px );
	--yd-f2-ease: cubic-bezier( 0.22, 1, 0.36, 1 );

	position: relative;
	z-index: 1;                
	margin-top: -120px;        
	background: var( --yd-f2-bg );
	color: var( --yd-f2-text );
	font-family: var( --yd-font);
}
.yd-footer-v2__container {
	width: 100%;
	max-width: var( --yd-container, 1600px );
	margin: 0 auto;
	padding: 220px clamp( 22px, 3vw, 40px ) clamp( 24px, 2.4vw, 36px );
}

.yd-footer-v2__features {
	display: grid;
	grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
	overflow: hidden;
	border: 1px solid var( --yd-f2-border );
	border-radius: var( --yd-f2-radius );
	background: var( --yd-f2-card );
	box-shadow: 0 24px 60px rgba( 0, 0, 0, 0.45 );
}
.yd-footer-v2__feature {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: clamp( 22px, 2.2vw, 34px );
	border-left: 1px solid var( --yd-f2-border );
	transition: background 0.35s var( --yd-f2-ease ), transform 0.35s var( --yd-f2-ease );
}
.yd-footer-v2__feature:first-child {
	border-left: 0;
}
.yd-footer-v2__feature-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	color: var(--yd-primary);
	transition: transform 0.35s var( --yd-f2-ease ), filter 0.35s var( --yd-f2-ease );
}
.yd-footer-v2__feature-icon svg {
	width: 100%;
	height: 100%;
}
.yd-footer-v2__feature-body {
	min-width: 0;
}
.yd-footer-v2__feature-title {
	margin: 0;
	color: var( --yd-f2-heading );
	font-size: clamp( 15px, 1.1vw, 16.5px );
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	transition: color 0.35s var( --yd-f2-ease ), letter-spacing 0.35s var( --yd-f2-ease );
}
.yd-footer-v2__feature-text {
	margin: 7px 0 0;
	color: var( --yd-f2-text );
	font-size: 13.5px;
	line-height: 1.6;
}

@media ( hover: hover ) and ( pointer: fine ) {
	.yd-footer-v2__feature:hover {
		background: var( --yd-f2-card-hover );
		transform: translateY( -3px );
	}
	/* With no tile behind it the glow has to come from a drop-shadow on the
	   stroke itself, which is what keeps the icon reading as a bare line mark. */
	.yd-footer-v2__feature:hover .yd-footer-v2__feature-icon {
		filter: drop-shadow( 0 0 10px rgba( 255, 57, 81, 0.55 ) );
		transform: scale( 1.1 ) rotate( -4deg );
	}
	.yd-footer-v2__feature:hover .yd-footer-v2__feature-title {
		color: var(--yd-primary);
		letter-spacing: 0.02em;
	}
}

.yd-footer-v2__main {
	display: grid;
	grid-template-columns: 1.55fr 1fr 1fr 0.9fr 1.2fr;
	gap: clamp( 22px, 2.4vw, 44px );
	/* The red hairline that separates the feature bar from the columns. */
	margin-top: clamp( 30px, 3.2vw, 48px );
	padding: clamp( 34px, 3.6vw, 54px ) 0 clamp( 30px, 3.4vw, 52px );
	border-top: 1px solid var(--yd-primary);
}

/* Vertical rule to the left of the contact column, as in the reference. */
.yd-footer-v2__col--contact {
	padding-left: clamp( 20px, 2.2vw, 40px );
	border-left: 1px solid var( --yd-f2-border );
}

/* --- Brand column --- */

.yd-footer-v2__logo {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	text-decoration: none;
	line-height: 1;
}
img.footer-logo {
    max-height: 105px;
    width: auto;
    display: block;
}

.yd-footer-v2__logo-mark {
	position: relative;
	padding-bottom: 7px;
	color: #fff;
	font-size: clamp( 34px, 2.8vw, 44px );
	font-weight: 800;
	letter-spacing: -0.02em;
}
.yd-footer-v2__logo-mark::after {
	content: "";
	position: absolute;
	right: 4px;
	bottom: 0;
	left: 4px;
	height: 2px;
	background: var(--yd-primary);
}
.yd-footer-v2__logo-sub {
	color: #fff;
	font-size: clamp( 19px, 1.5vw, 24px );
	font-weight: 400;
	letter-spacing: 0.01em;
}
.yd-footer-v2__about {
	margin: clamp( 18px, 1.8vw, 26px ) 0 0;
	max-width: 38ch;
	color: var( --yd-f2-text );
	font-size: 14.5px;
	line-height: 1.7;
}
.yd-footer-v2__social {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: clamp( 20px, 2vw, 28px ) 0 0;
	padding: 0;
	list-style: none;
}
.yd-footer-v2__social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border: 1px solid var( --yd-f2-border-strong );
	border-radius: 50%;
	color: var( --yd-f2-text-strong );
	transition: color 0.3s var( --yd-f2-ease ), border-color 0.3s var( --yd-f2-ease ),
		background 0.3s var( --yd-f2-ease ), box-shadow 0.3s var( --yd-f2-ease ),
		transform 0.3s var( --yd-f2-ease );
}
.yd-footer-v2__social-link svg {
	width: 17px;
	height: 17px;
}
@media ( hover: hover ) and ( pointer: fine ) {
	.yd-footer-v2__social-link:hover {
		border-color: var(--yd-primary);;
		background: var(--yd-primary);;
		color: #fff;
		box-shadow: 0 8px 22px rgba( 255, 57, 81, 0.35 );
		transform: translateY( -3px ) scale( 1.06 );
	}
}

/* --- Link columns --- */
.yd-footer-v2__heading {
	margin: 0 0 clamp( 16px, 1.6vw, 22px );
	padding-bottom: 10px;
	color: var( --yd-f2-heading );
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
}
/* Short accent rule under each column heading, as in the reference. */
.yd-footer-v2__heading::after {
	content: "";
	display: block;
	width: 26px;
	height: 2px;
	margin-top: 10px;
	background: var(--yd-primary);
}
.yd-footer-v2__links {
	display: flex;
	flex-direction: column;
	gap: 11px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.yd-footer-v2__links a,
.yd-footer-v2__contact-link {
	color: var( --yd-f2-text );
	font-size: 14.5px;
	line-height: 1.5;
	text-decoration: none;
	background-image: linear-gradient( var(--yd-primary), var(--yd-primary) );
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 1px;
	transition: color 0.3s var( --yd-f2-ease ), background-size 0.35s var( --yd-f2-ease ),
		transform 0.3s var( --yd-f2-ease );
}
.yd-footer-v2__links a {
	display: inline-block;
}
@media ( hover: hover ) and ( pointer: fine ) {
	.yd-footer-v2__links a:hover,
	.yd-footer-v2__contact-link:hover {
		color: #fff;
		background-size: 100% 1px;
	}
	.yd-footer-v2__links a:hover {
		transform: translateX( 4px );
	}
}
.yd-footer-v2__view-all {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: clamp( 16px, 1.6vw, 22px );
	color: var(--yd-primary);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: gap 0.3s var( --yd-f2-ease );
}
.yd-footer-v2__view-all svg {
	width: 17px;
	height: 17px;
	transition: transform 0.3s var( --yd-f2-ease );
}
@media ( hover: hover ) and ( pointer: fine ) {
	.yd-footer-v2__view-all:hover svg {
		transform: translateX( 4px );
	}
}

/* --- Contact column --- */
.yd-footer-v2__contact {
	display: flex;
	flex-direction: column;
	gap: 16px;
	font-style: normal;    
}
.yd-footer-v2__contact-row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
}
.yd-footer-v2__contact-icon {
	display: flex;
	flex-shrink: 0;
	width: 19px;
	height: 19px;
	margin-top: 2px;
	color: var(--yd-primary);
}
.yd-footer-v2__contact-icon svg {
	width: 100%;
	height: 100%;
}
.yd-footer-v2__contact-text {
	color: var( --yd-f2-text );
	font-size: 14.5px;
	line-height: 1.65;
}

.yd-footer-v2__bottom {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 12px clamp( 20px, 2.4vw, 40px );
	padding-top: clamp( 20px, 2.2vw, 30px );
	border-top: 1px solid var( --yd-f2-border );
}
.yd-footer-v2__copy {
	margin: 0;
	color: var( --yd-f2-text );
	font-size: 13.5px;
	line-height: 1.5;
}
.yd-footer-v2__copy span {
	margin: 0 5px;
	opacity: 0.4;
}
.yd-footer-v2__legal ul {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px clamp( 14px, 1.4vw, 22px );
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Separators between legal links, drawn in CSS so the markup stays a clean list. */
.yd-footer-v2__legal li + li {
	position: relative;
}
.yd-footer-v2__legal li + li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: calc( -1 * clamp( 7px, 0.7vw, 11px ) );
	width: 1px;
	height: 12px;
	background: var( --yd-f2-border-strong );
	transform: translateY( -50% );
}
.yd-footer-v2__legal a {
	color: var( --yd-f2-text );
	font-size: 13.5px;
	text-decoration: none;
	transition: color 0.3s var( --yd-f2-ease );
}
.yd-footer-v2__legal a:hover {
	color: #fff;
}

/* =============================================================================
   Focus states — one visible ring for every interactive element
============================================================================= */
.yd-footer-v2 a:focus-visible {
	outline: 2px solid var(--yd-primary);
	outline-offset: 3px;
	border-radius: 4px;
}

/* =============================================================================
   Responsive
============================================================================= */

@media ( max-width: 1100px ) {
	.yd-footer-v2__features {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}
	.yd-footer-v2__feature:nth-child( odd ) {
		border-left: 0;
	}
	.yd-footer-v2__feature:nth-child( n + 3 ) {
		border-top: 1px solid var( --yd-f2-border );
	}
	/* Brand spans the top, the four link columns share the row below it. */
	.yd-footer-v2__main {
		grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
	}
	.yd-footer-v2__brand {
		grid-column: 1 / -1;
	}
	.yd-footer-v2__about {
		max-width: 60ch;
	}
	/* The rule only reads as a divider beside a neighbour on the same row. */
	.yd-footer-v2__col--contact {
		padding-left: 0;
		border-left: 0;
	}
}
@media ( max-width: 820px ) {
	.yd-footer-v2__main {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}
}

@media ( max-width: 900px ) {
	.yd-footer-v2 {
		margin-top: -70px;
	}
	.yd-footer-v2__container {
		padding-top: 150px;
	}
	.yd-footer-v2__bottom {
		grid-template-columns: minmax( 0, 1fr );
		justify-items: center;
		text-align: center;
	}
	.yd-footer-v2__legal ul {
		justify-content: center;
	}
}

/* Mobile: one column throughout. */
@media ( max-width: 700px ) {
	.yd-footer-v2__features {
		grid-template-columns: minmax( 0, 1fr );
	}
	.yd-footer-v2__feature {
		border-left: 0;
	}
	.yd-footer-v2__feature:not( :first-child ) {
		border-top: 1px solid var( --yd-f2-border );
	}
	.yd-footer-v2__main {
		grid-template-columns: minmax( 0, 1fr );
		gap: clamp( 30px, 6vw, 40px );
	}
	.yd-footer-v2__brand {
		grid-column: auto;
	}
	.yd-footer-v2__heading {
		margin-bottom: 14px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.yd-footer-v2 *,
	.yd-footer-v2 *::before,
	.yd-footer-v2 *::after {
		transition-duration: 0.01ms !important;
	}
	.yd-footer-v2__feature:hover,
	.yd-footer-v2__feature:hover .yd-footer-v2__feature-icon,
	.yd-footer-v2__social-link:hover {
		transform: none;
	}
}
