.hero { position: relative; width: 100%; min-height: 610px; display: flex; align-items: center; padding: 80px max(32px, calc((100% - 1240px) / 2)); background: var(--ink); color: white; overflow: hidden; }
h1 { max-width: 680px; margin: 0 0 34px; font-size: clamp(44px, 6vw, 78px); line-height: .96; letter-spacing: -.075em; font-weight: 700; }
.hero-title em { font-style: normal; }
.hero-copy { max-width: 455px; margin-bottom: 38px; color: rgba(255, 255, 255, .78); font-size: 17px; line-height: 1.65; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(0,0,0,.64) 0%, rgba(0,0,0,.32) 45%, rgba(0,0,0,.06) 100%); }
.hero-slides, .hero-slide { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-slides { z-index: 0; }
.hero-slide { object-fit: cover; object-position: center; opacity: 0; filter: saturate(.9) brightness(1.08); transition: opacity 1.2s ease; }
.hero-slide.active { opacity: 1; }
.hero-content { position: relative; z-index: 2; }
.hero .eyebrow { color: var(--coral); }
.hero-dots { position: absolute; z-index: 2; right: max(32px, calc((100% - 1240px) / 2)); top: 42px; display: flex; gap: 8px; }
.hero-dot { width: 8px; height: 8px; padding: 0; border: 1px solid white; border-radius: 50%; background: transparent; }
.hero-dot.active { background: var(--coral); border-color: var(--coral); }

.hero-tag {
	position: absolute;
	z-index: 2;
	right: max(32px, calc((100% - 1240px) / 2));
	bottom: 0;
	width: min(466px, calc(100% - 64px));
	padding: 10px 18px 12px;
	background: var(--coral);
	color: white;
	border-radius: 0 20px 0 20px;
	box-shadow: 0 8px 22px rgba(0,0,0,.18);
	text-align: center;
	font: 500 17px/1.35 var(--sans);
}

@media (max-width: 760px) {
	.hero { min-height: 560px; padding: 68px 20px 87px; }
	h1 { font-size: clamp(44px, 13vw, 70px); }
	.hero-dots { right: 20px; }
	.hero-tag {
		right: 20px;
		bottom: 25px;
		width: calc(100% - 64px);
	}
}