/* ═══════════════════════════════════════════════════════════════════════════
   Template BOHÈME — Pampas, terracotta, soleil couchant, naturel organique
   Inspirations : mariages Mallorca, macramé, lin écru, plumes, gypsy
   Effets : gradients chauds, sections asymétriques, ornement plume SVG
   ═══════════════════════════════════════════════════════════════════════════ */

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

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

/* ────── Titres : minuscules, cercle décor, alignement gauche ────── */
.wpm--boheme .wpm-section-title {
	font-weight: 300;
	text-transform: lowercase;
	letter-spacing: .02em;
	text-align: left;
	padding-left: 36px;
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
}
.wpm--boheme .wpm-section-title::before {
	content: ''; position: absolute;
	left: 0; top: 50%; transform: translateY(-50%);
	width: 20px; height: 20px;
	background: radial-gradient(circle, transparent 40%, var(--wpm-primary) 41% 55%, transparent 56%);
	opacity: .65;
}
.wpm--boheme .wpm-section-title::after {
	width: 80px; height: 1px;
	background: linear-gradient(90deg, var(--wpm-primary), transparent);
	opacity: .55;
	margin: 14px 0 0 0;
}

/* ────── HERO : photo bottom, prénoms BAS-GAUCHE, cadre asymétrique ────── */
.wpm--boheme .wpm-hero {
	min-height: 96vh;
	background-position: center 70%;
}
.wpm--boheme .wpm-hero__overlay {
	background:
		linear-gradient(120deg, color-mix(in srgb, var(--wpm-primary) 30%, transparent) 0%, transparent 40%),
		linear-gradient(180deg, transparent 30%, rgba(0,0,0,.55) 100%);
}
.wpm--boheme .wpm-hero__inner {
	align-self: flex-end;
	text-align: left;
	padding: 80px 8vw 60px;
	max-width: 800px;
	margin-left: 0;
	animation: wpm-fade-up 1.4s cubic-bezier(.2,.7,.2,1) both;
}
.wpm--boheme .wpm-hero__names {
	letter-spacing: -.01em;
	font-weight: 300;
	text-transform: lowercase;
	align-items: flex-start;
	line-height: .9;
}
.wpm--boheme .wpm-hero__amp {
	font-size: .82em;
	opacity: .8;
	color: var(--wpm-accent);
	font-style: italic;
	font-weight: 300;
}
.wpm--boheme .wpm-hero__subtitle {
	font-style: italic;
	letter-spacing: .12em;
	text-transform: none;
	font-size: .95rem;
}
.wpm--boheme .wpm-hero__subtitle::before {
	content: '~ ';
}

/* Pampas SVG flottant en bordure */
.wpm--boheme .wpm-hero::after {
	content: '';
	position: absolute;
	right: -40px; top: 20%;
	width: 180px; height: 60%;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 300'><path d='M50 0 Q35 60 45 120 Q60 180 50 240 Q40 280 50 300' stroke='%23ffffff' stroke-width='1' fill='none' opacity='.4'/><circle cx='50' cy='10'  r='3' fill='%23ffffff' opacity='.5'/><circle cx='35' cy='60' r='2' fill='%23ffffff' opacity='.4'/><circle cx='60' cy='120' r='3' fill='%23ffffff' opacity='.5'/><circle cx='45' cy='180' r='2' fill='%23ffffff' opacity='.4'/><circle cx='55' cy='240' r='3' fill='%23ffffff' opacity='.5'/></svg>") no-repeat center / contain;
	pointer-events: none;
	animation: wpm-float 6s ease-in-out infinite;
}

/* ────── COUNTDOWN : cards transparentes brutes ────── */
.wpm--boheme .wpm-countdown {
	background: linear-gradient(135deg, var(--wpm-primary) 0%, color-mix(in srgb, var(--wpm-primary) 70%, var(--wpm-secondary)) 100%);
}
.wpm--boheme .wpm-countdown__grid > div {
	background: transparent;
	border: 1px solid currentColor;
	border-radius: 0;
	backdrop-filter: none;
}

/* ────── CARDS : style "carnet de voyage", bordures top+bottom ────── */
.wpm--boheme .wpm-lieu__step,
.wpm--boheme .wpm-menu__card,
.wpm--boheme .wpm-places__card,
.wpm--boheme .wpm-prestas__card,
.wpm--boheme .wpm-livre__msg {
	border-radius: 0;
	border: 0;
	border-top: 1px solid color-mix(in srgb, var(--wpm-primary) 50%, transparent);
	border-bottom: 1px solid color-mix(in srgb, var(--wpm-primary) 50%, transparent);
	box-shadow: none;
	background: transparent;
	transition: background .35s;
}
.wpm--boheme .wpm-lieu__step:hover,
.wpm--boheme .wpm-places__card:hover {
	background: color-mix(in srgb, var(--wpm-accent) 35%, transparent);
}
.wpm--boheme .wpm-lieu__step-type {
	background: transparent;
	color: var(--wpm-primary);
	border: 1px solid var(--wpm-primary);
	border-radius: 0;
	letter-spacing: .2em;
}

/* ────── CTAs en rectangle, lettres très espacées ────── */
.wpm--boheme .wpm-rsvp__cta,
.wpm--boheme .wpm-liste__cta {
	border-radius: 0;
	letter-spacing: .25em;
	text-transform: uppercase;
	font-size: .82rem;
	padding: 18px 44px;
	border: 1px solid currentColor;
	background: transparent;
	color: inherit;
	box-shadow: 4px 4px 0 var(--wpm-primary);
	transition: transform .2s, box-shadow .2s;
}
.wpm--boheme .wpm-rsvp__cta:hover,
.wpm--boheme .wpm-liste__cta:hover {
	transform: translate(-2px, -2px);
	box-shadow: 6px 6px 0 var(--wpm-primary);
}
.wpm--boheme .wpm-rsvp {
	background: var(--wpm-accent); color: var(--wpm-on-accent);
}

/* ────── GALERIE : grid carré, hover sépia → couleur ────── */
.wpm--boheme .wpm-galerie__item { border-radius: 0; }
.wpm--boheme .wpm-galerie__item img {
	filter: sepia(.25) saturate(1.1);
	transition: filter .4s, transform .5s;
}
.wpm--boheme .wpm-galerie__item:hover img { filter: sepia(0) saturate(1.15); transform: scale(1.04); }

/* ────── PROGRAMME : timeline organique avec dots variables ────── */
.wpm--boheme .wpm-programme__timeline::before {
	background: linear-gradient(180deg, var(--wpm-primary), transparent);
	opacity: .5;
}
.wpm--boheme .wpm-programme__dot {
	background: var(--wpm-primary);
	box-shadow: 0 0 0 2px var(--wpm-primary), 0 0 0 6px color-mix(in srgb, var(--wpm-primary) 25%, transparent);
}

/* ────── FOOTER : crème ocre ────── */
.wpm--boheme .wpm-footer {
	background: color-mix(in srgb, var(--wpm-primary) 90%, #000);
}
.wpm--boheme .wpm-footer__love {
	font-style: italic;
	font-weight: 300;
	letter-spacing: .04em;
}
.wpm--boheme .wpm-footer__love::before {
	content: '~ '; opacity: .6;
}
