/* BP Legal Widgets
 *
 * Shared styles for:
 *   - BP_Legal_Notice_Widget   (slug: bp-legal-notice)
 *   - BP_Privacy_Policy_Widget (slug: bp-privacy-policy)
 *
 * Composition (desktop):
 *   - cream surface, full-bleed
 *   - 1320px outer container, 880px readable legal-text inner
 *   - small hero: eyebrow (gold line) + serif H1 + intro
 *   - subtle gold divider
 *   - repeater of legal sections (H2 + body)
 *   - restrained gold separator between sections
 *   - "[INFORMATION À CONFIRMER]" renders as a small
 *     gold-accent notice chip (block-level, no text wrapping
 *     issues)
 *
 * Tokens reused (no new tokens introduced):
 *   cream        #F4EFE3
 *   dark green   #2F4A2F
 *   gold         #B8B25A
 *
 * Typography reused (no new fonts introduced):
 *   serif        var(--bp-bp-serif, "Cormorant Garamond", "EB Garamond", Georgia, serif)
 *   sans         var(--bp-bp-sans,  "Inter", "Helvetica Neue", Arial, sans-serif)
 *   eyebrow      var(--bp-bp-eyebrow-font, "Inter", "Helvetica Neue", Arial, sans-serif)
 */

.bp-legal {
	--bp-legal-cream:   #F4EFE3;
	--bp-legal-cream-2: #ECE4D0;
	--bp-legal-green:   #2F4A2F;
	--bp-legal-green-2: #233823;
	--bp-legal-gold:    #B8B25A;
	--bp-legal-gold-soft: rgba(184, 178, 90, 0.45);
	--bp-legal-gold-tint: rgba(184, 178, 90, 0.18);

	--bp-legal-page-pad-y: clamp(64px, 8vw, 112px);
	--bp-legal-page-pad-x: clamp(20px, 4vw, 32px);
	--bp-legal-max:        1320px;
	--bp-legal-text-max:   880px;
	--bp-legal-section-gap: 32px;

	background: transparent;
	color: var(--bp-legal-green);
	box-sizing: border-box;
	padding-block: var(--bp-legal-page-pad-y);
	padding-inline: var(--bp-legal-page-pad-x);
	width: 100%;
}
.bp-legal *,
.bp-legal *::before,
.bp-legal *::after { box-sizing: border-box; }

.bp-legal__inner {
	max-width: var(--bp-legal-max);
	margin-inline: auto;
}

/* =====================================================
 * Hero (eyebrow + H1 + intro)
 * ===================================================== */
.bp-legal__hero {
	max-width: var(--bp-legal-text-max);
	margin-inline: auto;
}

.bp-legal__eyebrow {
	margin: 0 0 18px;
	font-family: var(--bp-bp-eyebrow-font, "Inter", "Helvetica Neue", Arial, sans-serif);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--bp-legal-green);
	line-height: 1.2;
}

.bp-legal__title {
	margin: 0 0 22px;
	font-family: var(--bp-bp-serif, "Cormorant Garamond", "EB Garamond", Georgia, serif);
	font-weight: 500;
	font-size: clamp(40px, 4.4vw, 58px);
	line-height: 1.08;
	letter-spacing: -0.01em;
	color: #374F3C;
}

/* Title divider — mirrors the bp-why-choose reference:
 * 40px line + 6px rotated gold diamond + 40px line, 10px gap. */
.bp-legal__divider {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	margin: 0 0 24px;
}
.bp-legal__divider-line {
	display: block;
	inline-size: 40px;
	block-size: 1px;
	background: var(--bp-legal-gold);
	opacity: 0.95;
}
.bp-legal__divider-diamond {
	display: block;
	inline-size: 6px;
	block-size: 6px;
	background: var(--bp-legal-gold);
	transform: rotate(45deg);
}

.bp-legal__intro {
	margin: 0 0 8px;
	font-family: var(--bp-bp-sans, "Inter", "Helvetica Neue", Arial, sans-serif);
	font-size: clamp(15px, 1.05vw, 17px);
	line-height: 1.65;
	color: var(--bp-legal-green-2);
	opacity: 0.92;
	max-width: 64ch;
}

/* =====================================================
 * Section rule (subtle gold, ~36px vertical rhythm)
 * ===================================================== */
.bp-legal__rule {
	height: 1px;
	border: 0;
	background: var(--bp-legal-gold-soft);
	max-width: var(--bp-legal-text-max);
	margin: var(--bp-legal-section-gap) auto;
	padding: 0;
}

/* =====================================================
 * Sections
 * ===================================================== */
.bp-legal__sections {
	max-width: var(--bp-legal-text-max);
	margin-inline: auto;
}

.bp-legal__section {
	margin: 0;
}

.bp-legal__section-title {
	margin: 0 0 14px;
	padding-top: clamp(24px, 2.4vw, 40px);
	font-family: var(--bp-bp-serif, "Cormorant Garamond", "EB Garamond", Georgia, serif);
	font-weight: 500;
	font-size: clamp(24px, 2.4vw, 30px);
	line-height: 1.18;
	letter-spacing: -0.005em;
	color: var(--bp-legal-green);
}

.bp-legal__section-content {
	font-family: var(--bp-bp-sans, "Inter", "Helvetica Neue", Arial, sans-serif);
	font-size: clamp(15px, 1.05vw, 17px);
	line-height: 1.7;
	color: var(--bp-legal-green-2);
}

.bp-legal__section-content p {
	margin: 0 0 14px;
}
.bp-legal__section-content p:last-child {
	margin-bottom: 0;
}

/* =====================================================
 * Placeholder notice chip
 *
 * The literal text "[INFORMATION À CONFIRMER]" is
 * automatically replaced with this block-level chip
 * by the widget render.
 * ===================================================== */
.bp-legal__placeholder {
	display: inline-block;
	background: var(--bp-legal-gold-tint);
	border-left: 2px solid var(--bp-legal-gold);
	color: var(--bp-legal-green);
	padding: 8px 14px;
	font-family: var(--bp-bp-eyebrow-font, "Inter", "Helvetica Neue", Arial, sans-serif);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.4;
	margin: 4px 0;
}

/* =====================================================
 * Responsive
 * ===================================================== */
@media (max-width: 1024px) {
	.bp-legal__title { font-size: clamp(34px, 5.5vw, 48px); }
}

@media (max-width: 768px) {
	.bp-legal {
		--bp-legal-page-pad-y: clamp(48px, 10vw, 72px);
		--bp-legal-page-pad-x: 20px;
		--bp-legal-section-gap: 28px;
	}
	.bp-legal__eyebrow { font-size: 11px; letter-spacing: 0.16em; }
	.bp-legal__title { font-size: clamp(30px, 7vw, 40px); }
	.bp-legal__intro { font-size: 16px; line-height: 1.6; }
	.bp-legal__section-title { font-size: clamp(22px, 5vw, 26px); }
	.bp-legal__section-content { font-size: 16px; line-height: 1.65; }
}

@media (max-width: 480px) {
	.bp-legal { --bp-legal-page-pad-x: 16px; }
	.bp-legal__placeholder { font-size: 11px; padding: 7px 12px; }
}