/* Haircare Campaign Section Styles */

.section-kicker {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--faint);
}

.haircare-campaign {
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 480px;
	margin-top: clamp(100px, 9vw, 150px);
	background: linear-gradient(135deg, #fff 0%, #FCF8F7 52%, #F8DFE3 100%);
	overflow: hidden;
}

.haircare-copy {
	padding: clamp(40px, 7vw, 110px) 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.haircare-copy h2 {
	margin-top: 15px;
	font: 300 clamp(48px, 5.7vw, 88px) / 0.98 var(--serif);
	letter-spacing: -0.055em;
	margin-bottom: 0;
}

.haircare-copy h2 span {
	font-weight: 300;
	color: #DC9DA3;
}

.haircare-copy p {
	margin-top: 34px;
	color: var(--body);
	font-size: 16px;
	line-height: 1.7;
}

.haircare-copy .btn {
	margin-top: 34px;
}

/* Campaign Reference Image */
.campaign-reference-crop,
.story-reference-crop {
	position: relative;
	min-width: 0;
	overflow: hidden;
}

.campaign-reference-crop img,
.story-reference-crop img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -100%;
	width: 200%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
}

/* Tablet — max-width 940px */
@media (max-width: 940px) {
	.haircare-campaign {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.haircare-copy {
		min-height: 470px;
		padding: 50px 0;
	}

	.haircare-copy h2 {
		font-size: 50px;
	}

	.campaign-reference-crop {
		height: 470px;
	}
}

/* Mobile — max-width 560px */
@media (max-width: 560px) {
	.haircare-copy {
		padding: 40px 0;
		min-height: 0;
	}

	.campaign-reference-crop {
		height: 400px;
	}
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
	.haircare-campaign {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}
