/*
 * ParentRoute
 * Policy Page template
 *
 * Ce fichier s’applique uniquement au HTML généré par :
 * page-templates/policy-page.php
 */

/* =========================================================
   Page foundation
   ========================================================= */

.pr-policy-page {
	--pr-policy-background: #f5f6f2;
	--pr-policy-surface: #ffffff;
	--pr-policy-text: #17231e;
	--pr-policy-muted: #66716b;
	--pr-policy-accent: #6f8979;
	--pr-policy-border: rgba(23, 35, 30, 0.11);
	--pr-policy-radius: 28px;

	width: 100%;
	margin: 0;
	padding: 0;
	background:
		var(--pr-policy-background);
	color:
		var(--pr-policy-text);
}

.pr-policy-page,
.pr-policy-page * {
	box-sizing: border-box;
}

/* =========================================================
   Main container
   ========================================================= */

.pr-policy-page__container {
	width:
		min(
			calc(100% - 40px),
			1040px
		);
	margin-inline: auto;
	padding:
		clamp(56px, 7vw, 96px)
		0
		clamp(76px, 9vw, 120px);
}

/* =========================================================
   Article
   ========================================================= */

.pr-policy-page__article {
	width: 100%;
	margin: 0;
	padding: 0;
}

/* =========================================================
   Header
   ========================================================= */

.pr-policy-page__header {
	margin: 0 0 34px;
	padding: 0 0 31px;
	border-bottom:
		1px solid
		var(--pr-policy-border);
}

.pr-policy-page__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 18px;
	color:
		var(--pr-policy-accent);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.pr-policy-page__eyebrow::before {
	flex: 0 0 auto;
	width: 22px;
	height: 1.5px;
	background:
		currentColor;
	content: "";
}

.pr-policy-page__title {
	max-width: 860px;
	margin: 0;
	color:
		var(--pr-policy-text);
	font-family:
		var(--font-heading-family, inherit);
	font-size:
		clamp(42px, 5vw, 66px);
	font-weight:
		var(--font-heading-weight, 600);
	line-height: 1.03;
	letter-spacing: -0.045em;
	text-wrap: balance;
}

/* =========================================================
   Content card
   ========================================================= */

.pr-policy-page__content {
	width: 100%;
	margin: 0;
	padding:
		clamp(34px, 5vw, 64px)
		clamp(26px, 5vw, 68px);
	border:
		1px solid
		var(--pr-policy-border);
	border-radius:
		var(--pr-policy-radius);
	background:
		var(--pr-policy-surface);
	color:
		var(--pr-policy-text);
	box-shadow:
		0 28px 80px
		rgba(23, 35, 30, 0.07);
}

/* Remove Gutenberg width limitations inside the card. */

.pr-policy-page__content > *,
.pr-policy-page__content .alignwide,
.pr-policy-page__content .alignfull {
	max-width: none;
	margin-right: 0;
	margin-left: 0;
}

/* =========================================================
   Paragraphs
   ========================================================= */

.pr-policy-page__content p {
	margin:
		0
		0
		19px;
	color:
		var(--pr-policy-muted);
	font-size:
		clamp(15px, 1.15vw, 17px);
	line-height: 1.78;
}

.pr-policy-page__content > p:last-child {
	margin-bottom: 0;
}

/* =========================================================
   Headings
   ========================================================= */

.pr-policy-page__content h2 {
	margin:
		clamp(44px, 6vw, 68px)
		0
		18px;
	color:
		var(--pr-policy-text);
	font-family:
		var(--font-heading-family, inherit);
	font-size:
		clamp(27px, 3vw, 38px);
	font-weight: 600;
	line-height: 1.14;
	letter-spacing: -0.035em;
	text-wrap: balance;
}

.pr-policy-page__content h2:first-child {
	margin-top: 0;
}

.pr-policy-page__content h3 {
	margin:
		34px
		0
		13px;
	color:
		var(--pr-policy-text);
	font-family:
		var(--font-heading-family, inherit);
	font-size:
		clamp(20px, 2vw, 25px);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.025em;
}

.pr-policy-page__content h4 {
	margin:
		28px
		0
		11px;
	color:
		var(--pr-policy-text);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.35;
}

/* =========================================================
   Lists
   ========================================================= */

.pr-policy-page__content ul,
.pr-policy-page__content ol {
	margin:
		10px
		0
		26px;
	padding-left: 24px;
}

.pr-policy-page__content li {
	margin-bottom: 9px;
	padding-left: 5px;
	color:
		var(--pr-policy-muted);
	font-size:
		clamp(15px, 1.15vw, 17px);
	line-height: 1.75;
}

.pr-policy-page__content li::marker {
	color:
		var(--pr-policy-accent);
}

.pr-policy-page__content li > ul,
.pr-policy-page__content li > ol {
	margin-top: 9px;
	margin-bottom: 8px;
}

/* =========================================================
   Strong text and links
   ========================================================= */

.pr-policy-page__content strong,
.pr-policy-page__content b {
	color:
		var(--pr-policy-text);
	font-weight: 700;
}

.pr-policy-page__content a {
	color:
		var(--pr-policy-accent);
	font-weight: 600;
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition:
		color 180ms ease;
}

.pr-policy-page__content a:hover {
	color:
		var(--pr-policy-text);
}

.pr-policy-page__content a:focus-visible {
	outline:
		2px solid
		var(--pr-policy-accent);
	outline-offset: 4px;
}

/* =========================================================
   Separators
   ========================================================= */

.pr-policy-page__content hr,
.pr-policy-page__content .wp-block-separator {
	height: 1px;
	margin:
		44px
		0;
	border: 0;
	background:
		var(--pr-policy-border);
}

/* =========================================================
   Quotes
   ========================================================= */

.pr-policy-page__content blockquote,
.pr-policy-page__content .wp-block-quote {
	margin:
		31px
		0;
	padding:
		21px
		25px;
	border:
		0;
	border-left:
		3px solid
		var(--pr-policy-accent);
	border-radius:
		0
		16px
		16px
		0;
	background:
		color-mix(
			in srgb,
			var(--pr-policy-accent) 8%,
			white
		);
}

.pr-policy-page__content blockquote p,
.pr-policy-page__content .wp-block-quote p {
	margin: 0;
	color:
		var(--pr-policy-text);
}

/* =========================================================
   Tables
   ========================================================= */

.pr-policy-page__content .wp-block-table {
	margin:
		31px
		0;
	overflow-x: auto;
	border:
		1px solid
		var(--pr-policy-border);
	border-radius: 16px;
}

.pr-policy-page__content table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}

.pr-policy-page__content th,
.pr-policy-page__content td {
	padding: 14px 16px;
	border:
		0;
	border-bottom:
		1px solid
		var(--pr-policy-border);
	color:
		var(--pr-policy-muted);
	font-size: 14px;
	line-height: 1.6;
	text-align: left;
}

.pr-policy-page__content tr:last-child td {
	border-bottom: 0;
}

.pr-policy-page__content th {
	color:
		var(--pr-policy-text);
	font-weight: 700;
}

/* =========================================================
   Gutenberg groups
   ========================================================= */

.pr-policy-page__content
	.wp-block-group {
	margin-top: 28px;
	margin-bottom: 28px;
}

.pr-policy-page__content
	.wp-block-columns {
	gap: 24px;
	margin-top: 30px;
	margin-bottom: 30px;
}

/* =========================================================
   Mobile
   ========================================================= */

@media screen and (max-width: 749px) {
	.pr-policy-page__container {
		width:
			calc(100% - 32px);
		padding:
			48px
			0
			72px;
	}

	.pr-policy-page__header {
		margin-bottom: 24px;
		padding-bottom: 23px;
	}

	.pr-policy-page__title {
		font-size:
			clamp(38px, 11vw, 52px);
	}

	.pr-policy-page__content {
		padding:
			31px
			21px;
		border-radius: 22px;
	}

	.pr-policy-page__content h2 {
		margin-top: 42px;
	}

	.pr-policy-page__content ul,
	.pr-policy-page__content ol {
		padding-left: 20px;
	}

	.pr-policy-page__content
		.wp-block-columns {
		gap: 16px;
	}
}

/* =========================================================
   Reduced motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
	.pr-policy-page__content a {
		transition: none;
	}
}