/* ═══════════════════════════════════════════════════════════════════════════
   Template COASTAL — Plage chic, océan & corail, voile et sable
   Inspirations : Hamptons, Côte d'Azur, blanc bleuté, échancrures
   Effets : vagues SVG animées, formes asymétriques organiques
   ═══════════════════════════════════════════════════════════════════════════ */

.wpm--coastal {
	background:
		linear-gradient(180deg, color-mix(in srgb, var(--wpm-primary) 12%, transparent) 0%, transparent 25%, transparent 75%, color-mix(in srgb, var(--wpm-primary) 12%, transparent) 100%),
		var(--wpm-surface);
}

.wpm--coastal > section {
	padding: 110px 32px;
	max-width: 1080px;
	position: relative;
}

/* ────── Titres : italique avec ligne double "vague" ────── */
.wpm--coastal .wpm-section-title {
	font-style: italic;
	font-weight: 400;
}
.wpm--coastal .wpm-section-title::after {
	width: 120px; height: 12px;
	background:
		linear-gradient(to right,
			var(--wpm-primary) 50%, transparent 50%),
		linear-gradient(to right,
			var(--wpm-primary) 50%, transparent 50%);
	background-size: 12px 1px, 8px 1px;
	background-repeat: repeat-x;
	background-position: 0 4px, 4px 8px;
	border: 0;
	opacity: .6;
	margin-top: 16px;
}

/* ────── HERO : photo "Hamptons", prénoms italique central ────── */
.wpm--coastal .wpm-hero {
	background-color: var(--wpm-primary);
	min-height: 100vh;
	overflow: hidden;
}
.wpm--coastal .wpm-hero__overlay {
	background:
		linear-gradient(180deg, transparent 30%, rgba(0,0,0,.4) 100%);
}
.wpm--coastal .wpm-hero__inner {
	animation: wpm-fade-up 1.6s cubic-bezier(.2,.7,.2,1) both;
}
.wpm--coastal .wpm-hero__names {
	font-style: italic;
	font-weight: 400;
	letter-spacing: -.01em;
}
.wpm--coastal .wpm-hero__amp {
	color: var(--wpm-accent);
	font-style: italic;
	font-size: .75em;
}

/* Vague SVG en bas du hero */
.wpm--coastal .wpm-hero::after {
	content: '';
	position: absolute;
	bottom: 0; left: 0; right: 0;
	height: 80px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'><path d='M0 40 Q 360 0 720 40 T 1440 40 L 1440 80 L 0 80 Z' fill='%23F7F1E5'/></svg>") no-repeat center bottom / 100% 100%;
	z-index: 3;
	pointer-events: none;
}

/* ────── COUNTDOWN : marine + formes organiques ────── */
.wpm--coastal .wpm-countdown {
	background: linear-gradient(135deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 60%, #000) 100%);
	color: var(--wpm-on-primary);
}
.wpm--coastal .wpm-countdown__grid > div {
	background: rgba(255,255,255,.15);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 100px 24px 100px 24px;
	backdrop-filter: blur(8px);
}

/* ────── CARDS : formes asymétriques type "galet" ────── */
.wpm--coastal .wpm-lieu__step,
.wpm--coastal .wpm-menu__card,
.wpm--coastal .wpm-places__card,
.wpm--coastal .wpm-prestas__card,
.wpm--coastal .wpm-livre__msg {
	border-radius: 100px 24px 100px 24px;
	background: var(--wpm-surface);
	border: 1px solid color-mix(in srgb, var(--wpm-primary) 25%, transparent);
	box-shadow: 0 20px 40px -24px color-mix(in srgb, var(--wpm-primary) 50%, transparent);
	transition: transform .35s, box-shadow .35s;
}
.wpm--coastal .wpm-lieu__step:nth-child(even),
.wpm--coastal .wpm-places__card:nth-child(even),
.wpm--coastal .wpm-menu__card:nth-child(even) {
	border-radius: 24px 100px 24px 100px;
}
.wpm--coastal .wpm-lieu__step:hover {
	transform: translateY(-6px);
	box-shadow: 0 32px 56px -24px color-mix(in srgb, var(--wpm-primary) 70%, transparent);
}
.wpm--coastal .wpm-lieu__step-type {
	background: linear-gradient(135deg, var(--wpm-primary), color-mix(in srgb, var(--wpm-primary) 60%, var(--wpm-accent)));
	border-radius: 999px;
}

/* ────── RSVP : océan profond ────── */
.wpm--coastal .wpm-rsvp,
.wpm--coastal .wpm-liste {
	background: linear-gradient(135deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 60%, #000) 100%);
	color: #fff;
}
.wpm--coastal .wpm-rsvp__cta,
.wpm--coastal .wpm-liste__cta {
	background: var(--wpm-accent);
	color: #fff;
	border-radius: 100px 24px 100px 24px;
	padding: 16px 36px;
	box-shadow: 0 12px 28px -12px color-mix(in srgb, var(--wpm-accent) 70%, #000);
	transition: transform .25s, border-radius .25s;
}
.wpm--coastal .wpm-rsvp__cta:hover {
	transform: translateY(-3px);
	border-radius: 24px 100px 24px 100px;
}

/* ────── GALERIE : formes organiques + filtre marin ────── */
.wpm--coastal .wpm-galerie__item {
	border-radius: 100px 24px 100px 24px;
}
.wpm--coastal .wpm-galerie__item:nth-child(even) { border-radius: 24px 100px 24px 100px; }
.wpm--coastal .wpm-galerie__item img {
	filter: contrast(1.05) saturate(1.1);
}

/* ────── PROGRAMME : timeline en vague ────── */
.wpm--coastal .wpm-programme__timeline::before {
	background: linear-gradient(180deg, var(--wpm-primary), var(--wpm-accent));
	opacity: .35;
	width: 3px;
}
.wpm--coastal .wpm-programme__dot {
	background: var(--wpm-primary);
	border: 3px solid var(--wpm-surface);
	box-shadow:
		0 0 0 2px var(--wpm-primary),
		0 0 0 6px color-mix(in srgb, var(--wpm-primary) 25%, transparent);
}

/* ────── FOOTER : sable + bleu nuit ────── */
.wpm--coastal .wpm-footer {
	background: linear-gradient(180deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 60%, #000) 100%);
}
.wpm--coastal .wpm-footer__love {
	font-style: italic;
	color: var(--wpm-accent);
}
