/* ═══════════════════════════════════════════════════════════════════════════
   Template EARTHY TERRACOTTA — Tons terre, automne romantique, vintage 70s
   Inspirations : Marrakech, Sienna, soleil bas, arches arabes
   Effets : arches CSS clip-path, filtre sépia léger, gradient lava
   ═══════════════════════════════════════════════════════════════════════════ */

.wpm--terracotta {
	background-color: var(--wpm-surface);
	background-image:
		radial-gradient(ellipse 60% 50% at 0% 0%,   color-mix(in srgb, var(--wpm-primary) 18%, transparent) 0%, transparent 60%),
		radial-gradient(ellipse 70% 60% at 100% 100%, color-mix(in srgb, var(--wpm-secondary) 22%, transparent) 0%, transparent 60%);
}

.wpm--terracotta > section {
	padding: 120px 32px;
	max-width: 1020px;
	position: relative;
}

/* ────── Titres : Fraunces serif italique soleil ────── */
.wpm--terracotta .wpm-section-title {
	font-family: 'Fraunces', serif;
	font-variation-settings: 'opsz' 144, 'wght' 400;
	font-weight: 400;
	font-style: italic;
	position: relative;
}
.wpm--terracotta .wpm-section-title::before {
	content: '◐';
	display: block;
	font-size: 1.4rem;
	color: var(--wpm-primary);
	margin-bottom: 12px;
	opacity: .7;
	font-style: normal;
}
.wpm--terracotta .wpm-section-title::after {
	width: 72px; height: 1px;
	background: linear-gradient(90deg, var(--wpm-primary), transparent);
	opacity: .65;
}

/* ────── HERO : arche centrale, photo en archway clip ────── */
.wpm--terracotta .wpm-hero {
	min-height: 100vh;
	background-color: var(--wpm-primary);
	overflow: hidden;
}
.wpm--terracotta .wpm-hero__overlay {
	background:
		radial-gradient(ellipse at 50% 100%, color-mix(in srgb, var(--wpm-primary) 50%, transparent) 0%, transparent 40%),
		linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.6) 100%);
}
.wpm--terracotta .wpm-hero__inner {
	animation: wpm-fade-up 1.6s cubic-bezier(.2,.7,.2,1) both;
	position: relative;
}
/* Arche centrale décor en arrière-plan */
.wpm--terracotta .wpm-hero__inner::before {
	content: '';
	position: absolute;
	top: -40px; left: 50%; transform: translateX(-50%);
	width: 320px; height: 440px;
	border: 1.5px solid rgba(255,255,255,.35);
	border-radius: 50% 50% 0 0 / 60% 60% 0 0;
	z-index: -1;
	pointer-events: none;
}
.wpm--terracotta .wpm-hero__names {
	font-family: 'Fraunces', serif;
	font-variation-settings: 'opsz' 144, 'wght' 400;
}
.wpm--terracotta .wpm-hero__amp {
	font-style: italic;
	color: var(--wpm-secondary);
	font-variation-settings: 'opsz' 9, 'wght' 300;
}

/* Soleil bas décoratif (gradient radial demi-cercle) */
.wpm--terracotta .wpm-hero::after {
	content: '';
	position: absolute;
	bottom: -160px; left: 50%; transform: translateX(-50%);
	width: 600px; height: 600px;
	border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--wpm-primary) 60%, #fff) 0%, transparent 60%);
	mix-blend-mode: screen;
	pointer-events: none;
	animation: wpm-float 12s ease-in-out infinite;
}

/* ────── COUNTDOWN : pavement terreux ────── */
.wpm--terracotta .wpm-countdown {
	background: linear-gradient(135deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 60%, var(--wpm-ink)) 100%);
	color: #fff;
}
.wpm--terracotta .wpm-countdown__grid > div {
	background: rgba(255,255,255,.12);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 50% 50% 0 0 / 30% 30% 0 0;
}
.wpm--terracotta .wpm-countdown__grid strong {
	font-family: 'Fraunces', serif;
}

/* ────── CARDS : arches doucement encadrées ────── */
.wpm--terracotta .wpm-lieu__step,
.wpm--terracotta .wpm-menu__card,
.wpm--terracotta .wpm-places__card,
.wpm--terracotta .wpm-prestas__card,
.wpm--terracotta .wpm-livre__msg {
	border-radius: 18px 18px 0 0;
	background: var(--wpm-surface);
	border: 1px solid color-mix(in srgb, var(--wpm-secondary) 60%, transparent);
	box-shadow: 0 16px 36px -20px color-mix(in srgb, var(--wpm-primary) 60%, transparent);
	overflow: hidden;
	transition: transform .35s, box-shadow .35s;
}
.wpm--terracotta .wpm-lieu__step:hover,
.wpm--terracotta .wpm-places__card:hover {
	transform: translateY(-5px);
	box-shadow: 0 28px 48px -20px color-mix(in srgb, var(--wpm-primary) 80%, transparent);
}
.wpm--terracotta .wpm-lieu__step-img,
.wpm--terracotta .wpm-places__img {
	filter: sepia(.2) saturate(1.05);
}
.wpm--terracotta .wpm-lieu__step-type {
	background: linear-gradient(135deg, var(--wpm-primary), color-mix(in srgb, var(--wpm-primary) 60%, var(--wpm-ink)));
}

/* ────── RSVP / CTA : pierre cuite ────── */
.wpm--terracotta .wpm-rsvp,
.wpm--terracotta .wpm-countdown {
	background: var(--wpm-primary); color: var(--wpm-on-primary);
}
.wpm--terracotta .wpm-rsvp__cta,
.wpm--terracotta .wpm-liste__cta {
	background: var(--wpm-ink);
	color: #fff;
	border-radius: 999px;
	padding: 16px 36px;
	letter-spacing: .12em;
	box-shadow: 0 14px 28px -14px var(--wpm-ink);
}

/* ────── GALERIE : sépia ambré + arches ────── */
.wpm--terracotta .wpm-galerie__item {
	border-radius: 100% 100% 12px 12px / 50% 50% 12px 12px;
}
.wpm--terracotta .wpm-galerie__item img {
	filter: sepia(.25) contrast(1.05) saturate(1.1);
}

/* ────── FOOTER : terre cuite profonde ────── */
.wpm--terracotta .wpm-footer {
	background: linear-gradient(180deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 60%, var(--wpm-ink)) 100%);
}
.wpm--terracotta .wpm-footer__love {
	font-family: 'Fraunces', serif;
	font-style: italic;
	font-variation-settings: 'opsz' 144, 'wght' 400;
}
