/* =========================================================
   BoClic — module de base (commun à tous les sites clients)
   Ne pas modifier par client : surcharger dans style.css.
   ========================================================= */

/* ---------- Variables par défaut ---------- */
:root {
	--bc-accent: var(--theme-palette-color-2);
	--bc-on-accent: var(--theme-palette-color-4);
	--bc-dark: var(--theme-palette-color-4);
	--bc-text: var(--theme-palette-color-3);
	--bc-border: var(--theme-palette-color-5);
	--bc-alt: var(--theme-palette-color-6);
	--bc-bg: var(--theme-palette-color-7);
	--bc-surface: var(--theme-palette-color-8);
	--bc-shadow-rgb: 14, 18, 38;

	--bc-radius: 24px;
	--bc-radius-sm: 16px;
	--bc-radius-img: 28px;
	--bc-radius-btn: 999px;

	--bc-section-y: clamp(2.75rem, 5.5vw, 4.5rem);
	--bc-gutter: 24px;
	--bc-title-xl: clamp(2.5rem, 5.2vw, 4.25rem);
	--bc-title-lg: clamp(2rem, 4vw, 3rem);
	--bc-title-tracking: -0.02em;

	--bc-footer-bg: var(--bc-dark);
	--bc-featured-label: "Recommandé";

	--bc-shadow-sm: 0 1px 2px rgba(var(--bc-shadow-rgb), .04), 0 12px 32px -18px rgba(var(--bc-shadow-rgb), .25);
	--bc-shadow-md: 0 2px 4px rgba(var(--bc-shadow-rgb), .05), 0 28px 48px -20px rgba(var(--bc-shadow-rgb), .35);
	--bc-shadow-lg: 0 34px 60px -24px rgba(var(--bc-shadow-rgb), .45);
	--bc-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Sections pleine largeur ---------- */
.bc-section {
	padding: var(--bc-section-y) var(--bc-gutter) !important;
}
.bc-section--tight {
	padding-block: clamp(1.75rem, 3.5vw, 2.5rem) !important;
}
/* Sections collées les unes aux autres, sans bande blanche */
.entry-content > .alignfull + .alignfull { margin-top: 0 !important; }
.entry-content > .alignfull { margin-bottom: 0 !important; }
/* Page composée de sections pleine largeur : pas de marge autour du contenu */
.ct-container-full:has(> article > .entry-content > .alignfull:first-child) { padding-top: 0; }
.ct-container-full:has(> article > .entry-content > .alignfull:last-child) { padding-bottom: 0; }

/* En-tête de section (sur-titre + titre + intro) */
.bc-section-head {
	max-width: 760px;
	margin-inline: auto !important;
	margin-bottom: 2.25rem !important;
}
.bc-section-head > * { margin-block: 0 .75rem; }
.bc-section-head > *:last-child { margin-bottom: 0; }

/* ---------- Typographie ---------- */
.bc-eyebrow {
	font-size: .8rem !important;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--bc-text);
}
.bc-title-xl,
.bc-title-lg {
	letter-spacing: var(--bc-title-tracking);
	line-height: 1.08 !important;
	text-wrap: balance;
}
.bc-title-xl { font-size: var(--bc-title-xl) !important; }
.bc-title-lg { font-size: var(--bc-title-lg) !important; }
.bc-lead {
	font-size: clamp(1.05rem, 1.6vw, 1.2rem) !important;
	line-height: 1.6;
}
.bc-small { font-size: .9rem !important; }

/* Mot mis en valeur dans un titre (format « Surligner » de l'éditeur) */
.wp-block-heading mark.has-inline-color { padding: 0; }

/* ---------- Sections sombres : texte clair automatique ---------- */
.bc-on-dark,
.bc-on-dark :where(h1, h2, h3, h4, h5, h6, p, li, summary) {
	color: var(--bc-surface);
}
.bc-on-dark :where(p, li) { opacity: .88; }
.bc-on-dark .bc-eyebrow { color: var(--bc-accent); opacity: 1; }

/* ---------- Boutons ---------- */
.wp-block-button__link {
	border-radius: var(--bc-radius-btn);
	padding: .9rem 1.75rem;
	font-weight: 700;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px -10px color-mix(in srgb, var(--bc-accent) 70%, transparent);
}
/* Bouton principal = couleur d'accent (classe sur le bloc Bouton) */
.bc-btn--accent .wp-block-button__link {
	background: var(--bc-accent);
	color: var(--bc-on-accent);
}
.bc-btn--accent .wp-block-button__link:hover {
	background: var(--bc-dark);
	color: var(--bc-surface);
}
/* Bouton contour : la bordure suit la couleur du texte */
.is-style-outline > .wp-block-button__link {
	border: 2px solid currentColor;
	background: transparent;
	color: inherit;
}
.bc-on-dark .is-style-outline > .wp-block-button__link:hover {
	background: var(--bc-surface);
	color: var(--bc-dark);
}

/* Lien « En savoir plus → » */
.bc-more { font-weight: 700; }
.bc-more a {
	color: inherit;
	text-decoration: none;
	border-bottom: 2px solid var(--bc-accent);
	padding-bottom: 2px;
	transition: color .2s ease;
}
.bc-more a:hover { color: var(--bc-accent); }

/* ---------- Listes à coches ---------- */
.bc-check {
	list-style: none;
	padding-left: 0 !important;
}
.bc-check li {
	position: relative;
	padding-left: 1.7rem;
	margin-bottom: .45rem;
}
.bc-check li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .25em;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 50%;
	background: var(--bc-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 62% no-repeat;
}
.bc-check--2col { columns: 2; column-gap: 2rem; }
.bc-check--2col li { break-inside: avoid; }
@media (max-width: 781px) {
	.bc-check--2col { columns: 1; }
}

/* ---------- Photos ---------- */
.bc-media img {
	border-radius: var(--bc-radius-img);
	box-shadow: var(--bc-shadow-lg);
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}
.bc-media--wide img { aspect-ratio: 16 / 10; }
.bc-media--flat img { box-shadow: none; }

/* ---------- Champ à compléter (surligné, à faire disparaître avant l'ouverture) ---------- */
.bc-todo {
	background: #fff3a3 !important;
	color: #5c4a00 !important;
	outline: 2px dashed #e0b400;
	outline-offset: 1px;
	padding: 0 .2em;
	border-radius: 3px;
}

/* ---------- Apparition au défilement (sans JavaScript) ----------
   Navigateurs récents uniquement ; les autres affichent tout normalement. */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.bc-reveal,
		.bc-cards > .wp-block-column {
			animation: bc-reveal linear both;
			animation-timeline: view();
			animation-range: entry 0% cover 28%;
		}
	}
}
@keyframes bc-reveal {
	from { opacity: 0; transform: translateY(48px); }
	to   { opacity: 1; transform: none; }
}
@keyframes bc-up {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: none; }
}