/* Page « Vendre ma collection » : style cartoon cosmique (palette et mascottes maison Booster Breakerz). */

@font-face {
	font-family: "Lilita One";
	src: url("../fonts/lilita-one-latin-400.woff2") format("woff2");
	font-weight: 400; font-style: normal; font-display: swap;
}

.bbz-rachat-page .hero-section { display: none; }

.bbr {
	--ink: #14102A;
	--lav: #EFE7FF;
	--pink: #C2006A;
	--yel: #FFCC2E;
	--cyan: #2EE6D6;
	--paper: #FFFDF8;
	--toon: "Lilita One", "Arial Rounded MT Bold", "Onest", system-ui, sans-serif;
	--gap: clamp(16px, 2.4vw, 26px);

	position: relative;
	max-width: var(--fl-max, 1200px);
	margin: 12px auto 48px;
	padding: clamp(14px, 3vw, 36px);
	display: flex; flex-direction: column; gap: clamp(30px, 4.5vw, 54px);
	color: var(--ink);
	font-family: var(--fl-font-body);
	font-size: 1.02rem; line-height: 1.6;
	background:
		radial-gradient(circle at 12px 12px, rgba(20, 16, 42, .09) 2px, transparent 2.5px) 0 0 / 28px 28px,
		var(--lav);
	border: 3px solid var(--ink);
	border-radius: 30px;
	box-shadow: 8px 8px 0 var(--ink);
}
.bbr *, .bbr *::before, .bbr *::after { box-sizing: border-box; }

.bbr h1, .bbr h2, .bbr h3 {
	font-family: var(--toon); font-weight: 400; letter-spacing: .01em;
	color: var(--ink); line-height: 1.08; margin: 0 0 14px;
}
.bbr h1 { font-size: clamp(2.1rem, 5vw, 3.6rem); }
.bbr h2 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); }
.bbr h3 { font-size: 1.3rem; }
.bbr p { margin: 0 0 12px; }
.bbr p:last-child { margin-bottom: 0; }
.bbr ul { margin: 0; padding: 0; list-style: none; }
.bbr ul li { position: relative; padding-left: 26px; margin: 0 0 8px; }
.bbr ul li::before {
	content: ""; position: absolute; left: 0; top: .42em;
	width: 14px; height: 14px; border-radius: 50%;
	background: var(--cyan); border: 2.5px solid var(--ink);
}
.bbr strong { font-weight: 800; }

/* Titres de section : surligneur jaune */
.bbr-section > h2 {
	display: inline-block;
	padding: 0 6px;
	background: linear-gradient(transparent 58%, var(--yel) 58%, var(--yel) 92%, transparent 92%);
}

.bbr-eyebrow {
	display: inline-block; margin-bottom: 14px;
	padding: 6px 14px;
	font: 400 .95rem/1 var(--toon); letter-spacing: .04em; text-transform: uppercase;
	color: var(--ink); background: var(--yel);
	border: 3px solid var(--ink); border-radius: 999px;
	box-shadow: 3px 3px 0 var(--ink);
	transform: rotate(-2deg);
}
.bbr-muted, .bbr-small { color: #4a4566; }
.bbr-small { font-size: .92rem; margin-top: 14px; }

/* Boutons cartoon */
.bbr .fl-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 13px 24px;
	font: 400 1.1rem/1 var(--toon); letter-spacing: .02em;
	color: var(--ink); text-decoration: none;
	border: 3px solid var(--ink); border-radius: 999px;
	box-shadow: 4px 4px 0 var(--ink);
	transition: transform .12s ease, box-shadow .12s ease;
	cursor: pointer;
}
.bbr .fl-btn:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink); color: var(--ink); }
.bbr .fl-btn:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--ink); }
.bbr .fl-btn--booster { background: var(--yel); }
.bbr .fl-btn--ghost { background: #fff; }
.bbr .fl-btn:focus-visible { outline: 3px solid var(--pink); outline-offset: 3px; }

/* ---------- Bandeau d'en-tête : ciel étoilé, planète, monstre sorti du booster ---------- */
.bbr-hero {
	position: relative; overflow: hidden;
	padding: clamp(28px, 5vw, 60px);
	padding-right: clamp(28px, 34%, 420px);
	min-height: 380px;
	border: 3px solid var(--ink); border-radius: 26px;
	box-shadow: 7px 7px 0 var(--pink);
	color: #fff;
	background:
		radial-gradient(circle, #fff 1.2px, transparent 1.8px) 0 0 / 46px 46px,
		radial-gradient(circle, rgba(255, 255, 255, .7) 1px, transparent 1.6px) 23px 17px / 61px 61px,
		radial-gradient(circle, var(--cyan) 1.5px, transparent 2.2px) 9px 31px / 97px 97px,
		radial-gradient(ellipse 60% 70% at 85% 110%, rgba(194, 0, 106, .55), transparent 70%),
		radial-gradient(ellipse 50% 60% at 0% 0%, rgba(46, 230, 214, .22), transparent 70%),
		var(--ink);
}
.bbr-hero::before {
	content: ""; position: absolute; top: 18px; right: 30%;
	width: 92px; height: 70px;
	background: url("../img/bb-planete.svg") center / contain no-repeat;
	transform: rotate(-8deg);
	pointer-events: none;
	filter: drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff);
}
.bbr-hero::after {
	content: ""; position: absolute; right: clamp(8px, 3vw, 44px); bottom: -6px;
	width: clamp(200px, 30%, 330px); aspect-ratio: 220 / 248;
	background: url("../img/bb-monstre-booster.svg") bottom center / contain no-repeat;
	pointer-events: none;
	filter: drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff);
	animation: bbr-bob 3.2s ease-in-out infinite;
}
.bbr-hero h1 { color: #fff; text-shadow: 3px 3px 0 var(--pink), 6px 6px 0 var(--ink); max-width: 720px; }
.bbr-lead { font-size: clamp(1.05rem, 1.7vw, 1.22rem); max-width: 620px; color: var(--lav); }
.bbr-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }

@keyframes bbr-bob { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-8px) rotate(1.5deg); } }
@media (prefers-reduced-motion: reduce) { .bbr-hero::after { animation: none; } }

@media (max-width: 860px) {
	.bbr-hero { padding-right: clamp(28px, 5vw, 60px); padding-bottom: 230px; min-height: 0; }
	.bbr-hero::after { width: 200px; right: 50%; transform: translateX(50%); animation: none; }
	.bbr-hero::before { right: 18px; top: auto; bottom: 150px; width: 70px; }
}

/* ---------- Cartes autocollants ---------- */
.bbr-card {
	position: relative;
	background: var(--paper);
	border: 3px solid var(--ink);
	border-radius: 20px;
	padding: clamp(20px, 2.8vw, 30px);
	box-shadow: 6px 6px 0 var(--ink);
}
.bbr-grid { display: grid; gap: var(--gap); }
.bbr-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bbr-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bbr-grid > .bbr-card { transition: transform .15s ease; }
.bbr-grid > .bbr-card:nth-child(odd) { transform: rotate(-1.2deg); }
.bbr-grid > .bbr-card:nth-child(even) { transform: rotate(1deg); }
.bbr-grid > .bbr-card:hover { transform: rotate(0) translateY(-4px); }
.bbr-grid-3 > .bbr-card:nth-child(1) { background: #fff; }
.bbr-grid-3 > .bbr-card:nth-child(2) { background: #FFE9F3; }
.bbr-grid-3 > .bbr-card:nth-child(3) { background: #E3FBF8; }

.bbr-steps { list-style: none; padding: 0; margin: 0; }
.bbr-steps li { margin: 0; padding-top: 34px; }
.bbr-steps li::before { display: none; }
.bbr-steps p { color: #3b3656; }
.bbr-num {
	position: absolute; top: -22px; left: 18px;
	display: grid; place-items: center;
	width: 52px; height: 52px;
	border-radius: 50%;
	background: var(--pink); color: #fff;
	border: 3px solid var(--ink);
	box-shadow: 3px 3px 0 var(--ink);
	font: 400 1.6rem/1 var(--toon);
	transform: rotate(-8deg);
}
.bbr-steps li:nth-child(2) .bbr-num { background: var(--cyan); color: var(--ink); }
.bbr-steps li:nth-child(3) .bbr-num { background: var(--yel); color: var(--ink); }
.bbr-steps li:nth-child(4) .bbr-num { background: var(--ink); color: var(--yel); }
.bbr-steps { margin-top: 26px; }

@media (max-width: 960px) {
	.bbr-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
	.bbr-grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 560px) { .bbr-grid-4 { grid-template-columns: 1fr; } }

/* ---------- Tableaux ---------- */
.bbr-table-wrap {
	overflow-x: auto; margin-top: 10px;
	border: 3px solid var(--ink); border-radius: 16px;
	background: #fff;
}
.bbr-table { width: 100%; border-collapse: collapse; font-size: 1rem; min-width: 540px; margin: 0; }
.bbr-table th, .bbr-table td { text-align: left; padding: 13px 16px; border: 0; border-bottom: 2px dashed rgba(20, 16, 42, .18); vertical-align: top; color: var(--ink); }
.bbr-table thead th { background: var(--ink); color: var(--yel); font: 400 1.08rem/1.2 var(--toon); letter-spacing: .02em; border-bottom: 0; }
.bbr-table tbody tr:nth-child(even) td { background: var(--lav); }
.bbr-table tbody tr:last-child td { border-bottom: 0; }
.bbr-table td.n { font: 400 1.12rem/1.2 var(--toon); color: var(--pink); white-space: nowrap; }

/* ---------- Encadré Bretagne ---------- */
.bbr-local { background: var(--cyan); box-shadow: 6px 6px 0 var(--pink); }
.bbr-local .bbr-eyebrow { background: #fff; }
.bbr-local p { max-width: 760px; }

/* ---------- Formulaire ---------- */
.bbr-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 22px; margin-top: 12px; }
.bbr-form > div { display: flex; flex-direction: column; gap: 7px; }
.bbr-form .is-full { grid-column: 1 / -1; }
.bbr-form label { font: 400 1.02rem/1.2 var(--toon); letter-spacing: .02em; color: var(--ink); }
.bbr-form input, .bbr-form select, .bbr-form textarea {
	width: 100%; padding: 12px 14px;
	border: 3px solid var(--ink); border-radius: 14px;
	background: #fff; color: var(--ink);
	font: inherit; font-size: 1rem;
	box-shadow: 3px 3px 0 rgba(20, 16, 42, .9);
	transition: box-shadow .12s ease, transform .12s ease;
}
.bbr-form input::placeholder, .bbr-form textarea::placeholder { color: #8a84a6; }
.bbr-form input[type="file"] { padding: 9px; background: var(--lav); }
.bbr-form input:focus, .bbr-form select:focus, .bbr-form textarea:focus {
	outline: none; transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--pink);
}
.bbr-form-foot { flex-direction: row !important; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px !important; margin-top: 4px; }
.bbr-form-foot span { font-size: .9rem; color: #4a4566; max-width: 520px; }
.bbr-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) { .bbr-form { grid-template-columns: 1fr; } }

.bbr-notice { padding: 14px 18px; border: 3px solid var(--ink); border-radius: 14px; margin: 8px 0 18px; box-shadow: 4px 4px 0 var(--ink); color: var(--ink); }
.bbr-notice.is-ok { background: var(--cyan); }
.bbr-notice.is-err { background: #FFD3E6; }

/* ---------- FAQ ---------- */
.bbr-faq {
	background: #fff; margin-bottom: 14px;
	border: 3px solid var(--ink); border-radius: 16px;
	box-shadow: 4px 4px 0 var(--ink);
	transition: box-shadow .12s ease, transform .12s ease;
}
.bbr-faq[open] { box-shadow: 6px 6px 0 var(--pink); }
.bbr-faq summary {
	cursor: pointer; position: relative;
	padding: 16px 62px 16px 18px;
	font-weight: 800; font-size: 1.04rem; color: var(--ink);
	list-style: none;
}
.bbr-faq summary::-webkit-details-marker { display: none; }
.bbr-faq summary::after {
	content: "+"; position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
	display: grid; place-items: center;
	width: 34px; height: 34px; border-radius: 50%;
	background: var(--yel); border: 3px solid var(--ink);
	font: 400 1.3rem/1 var(--toon); color: var(--ink);
}
.bbr-faq[open] summary::after { content: "−"; background: var(--pink); color: #fff; }
.bbr-faq p { padding: 0 18px 16px; color: #3b3656; }

/* ---------- Appel final : blob jaune qui tient une carte ---------- */
.bbr-cta {
	position: relative; overflow: hidden;
	display: flex; flex-wrap: wrap; gap: 18px; justify-content: space-between; align-items: center;
	padding: clamp(26px, 4vw, 44px);
	padding-left: clamp(26px, 22%, 240px);
	border: 3px solid var(--ink); border-radius: 26px;
	background:
		radial-gradient(circle, rgba(255, 255, 255, .25) 1.4px, transparent 2px) 0 0 / 30px 30px,
		var(--pink);
	box-shadow: 7px 7px 0 var(--ink);
	color: #fff;
}
.bbr-cta::before {
	content: ""; position: absolute; left: clamp(10px, 3vw, 36px); bottom: -10px;
	width: clamp(120px, 17%, 190px); aspect-ratio: 1;
	background: url("../img/bb-blob-carte.svg") bottom center / contain no-repeat;
	pointer-events: none;
}
.bbr-cta h2 { color: #fff; margin-bottom: 6px; text-shadow: 3px 3px 0 var(--ink); }
.bbr-cta p { color: #FFE9F3; font-weight: 600; }
@media (max-width: 700px) {
	.bbr-cta { padding-left: clamp(26px, 4vw, 44px); padding-bottom: 150px; }
	.bbr-cta::before { width: 130px; left: auto; right: 20px; }
}

#grille, #formulaire { scroll-margin-top: calc(var(--fl-header-h, 64px) + 16px); }

/* Champs : hauteur fixe pour éviter le texte rogné des listes déroulantes */
.bbr-form input:not([type="file"]), .bbr-form select { height: 52px; min-height: 52px; line-height: 1.3; padding-top: 0; padding-bottom: 0; }
.bbr-form select {
	-webkit-appearance: none; appearance: none; padding-right: 46px; cursor: pointer;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 7l5 6 5-6' fill='none' stroke='%2314102A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center / 18px;
}
.bbr-form input[type="file"] { height: auto; }

/* ---------- Fil d'Ariane cartoon ---------- */
.bbr-crumbs { max-width: var(--fl-max, 1200px); margin: 18px auto 0; }
.bbr-crumbs ol {
	display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px;
	margin: 0; padding: 7px 16px; list-style: none;
	background: #EFE7FF; border: 3px solid #14102A; border-radius: 999px;
	box-shadow: 4px 4px 0 #14102A;
	font: 400 .98rem/1.2 "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif; letter-spacing: .02em;
	transform: rotate(-1deg);
}
.bbr-crumbs li { margin: 0; padding: 0; color: #C2006A; }
.bbr-crumbs li + li::before { content: "›"; margin: 0 8px 0 4px; color: #14102A; }
.bbr-crumbs a { color: #14102A; text-decoration: none; }
.bbr-crumbs a:hover { color: #C2006A; text-decoration: underline; text-decoration-thickness: 2px; }

/* =====================================================================
   Header, fond de page et footer en style cartoon (page de rachat uniquement)
   ===================================================================== */
html body.bbz-rachat-page {
	background-color: #14102A !important;
	background-image:
		radial-gradient(circle, rgba(255, 255, 255, .55) 1px, transparent 1.6px),
		radial-gradient(circle, rgba(46, 230, 214, .55) 1.2px, transparent 1.8px),
		radial-gradient(circle, rgba(255, 204, 46, .5) 1.2px, transparent 1.8px) !important;
	background-size: 52px 52px, 83px 83px, 121px 121px !important;
	background-position: 0 0, 26px 19px, 11px 47px !important;
	color: #EFE7FF;
}

/* Promo Baba Poké du header : masquée sur cette page */
.bbz-rachat-page .fl-promo { display: none !important; }

/* ---------- Header ---------- */
.bbz-rachat-page .fl-header {
	background: #EFE7FF;
	border-bottom: 3px solid #14102A;
	box-shadow: 0 5px 0 #C2006A;
	-webkit-backdrop-filter: none; backdrop-filter: none;
}
.bbz-rachat-page .fl-header::after { display: none; }
.bbz-rachat-page .fl-logo { color: #14102A; }
.bbz-rachat-page .fl-logo > span:first-child,
.bbz-rachat-page .fl-logo { font-family: "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif; font-weight: 400; letter-spacing: .02em; }
.bbz-rachat-page .fl-logo-tag {
	background: #FFCC2E; color: #14102A;
	border: 2.5px solid #14102A; border-radius: 10px;
	box-shadow: 2px 2px 0 #14102A;
	transform: rotate(-2deg);
}

.bbz-rachat-page .fl-nav-list > li > a {
	color: #14102A;
	font-family: "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif; font-weight: 400; letter-spacing: .03em;
	border-radius: 999px;
	transition: background-color .12s ease, box-shadow .12s ease, transform .12s ease;
}
.bbz-rachat-page .fl-nav-list > li > a:hover,
.bbz-rachat-page .fl-nav-list > li:focus-within > a {
	background: #fff; color: #14102A;
	box-shadow: inset 0 0 0 2.5px #14102A, 3px 3px 0 #14102A;
	transform: translate(-1px, -1px);
}
.bbz-rachat-page .fl-nav-list .fl-sub-toggle,
.bbz-rachat-page .fl-nav-list svg { color: #14102A; }

/* Sous-menus */
.bbz-rachat-page .fl-nav-list .sub-menu {
	background: #FFFDF8;
	border: 3px solid #14102A; border-radius: 16px;
	box-shadow: 5px 5px 0 #14102A;
	padding: 8px;
}
.bbz-rachat-page .fl-nav-list .sub-menu a { color: #14102A; border-radius: 10px; font-weight: 600; }
.bbz-rachat-page .fl-nav-list .sub-menu a:hover { background: #2EE6D6; color: #14102A; }

/* Boutons ronds (recherche, thème, menu) */
.bbz-rachat-page .fl-icon-btn {
	color: #14102A; background: #fff;
	border: 2.5px solid #14102A; border-radius: 50%;
	box-shadow: 2px 2px 0 #14102A;
}
.bbz-rachat-page .fl-icon-btn:hover { background: #FFCC2E; color: #14102A; }

/* Bouton « On rachète votre collection » */
.bbz-rachat-page .fl-header-cta {
	background: #FFCC2E; color: #14102A;
	border: 2.5px solid #14102A;
	box-shadow: 3px 3px 0 #14102A;
	font-family: "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif; font-weight: 400; letter-spacing: .02em;
	transition: transform .12s ease, box-shadow .12s ease;
}
.bbz-rachat-page .fl-header-cta:hover { color: #14102A; box-shadow: 5px 5px 0 #14102A; transform: translate(-2px, -2px); }
.bbz-rachat-page .fl-header-cta small { color: #C2006A; font-family: var(--fl-font-body); font-weight: 800; }

/* Recherche déroulante */
.bbz-rachat-page .fl-search-panel { background: #EFE7FF; border-bottom: 3px solid #14102A; }
.bbz-rachat-page .fl-search-panel input {
	background: #fff; color: #14102A;
	border: 3px solid #14102A; border-radius: 14px;
}

/* Menu mobile ouvert */
@media (max-width: 960px) {
	.bbz-rachat-page .fl-nav {
		background: #EFE7FF;
		border-top: 3px solid #14102A;
	}
	.bbz-rachat-page .fl-nav-list > li { border-color: rgba(20, 16, 42, .15); }
	.bbz-rachat-page .fl-nav-list .sub-menu { box-shadow: none; }
}

/* Fil d'Ariane : ombre rose pour rester visible sur le fond sombre */
.bbz-rachat-page .bbr-crumbs ol { box-shadow: 4px 4px 0 #C2006A; }
/* Grand bloc lavande : ombre rose sur fond sombre */
.bbz-rachat-page .bbr { box-shadow: 8px 8px 0 #C2006A; }

/* ---------- Footer ---------- */
.bbz-rachat-page .fl-footer {
	position: relative;
	margin-top: 40px;
	background:
		radial-gradient(circle, rgba(20, 16, 42, .12) 2px, transparent 2.5px) 0 0 / 28px 28px,
		#EFE7FF;
	color: #14102A;
	border-top: 3px solid #14102A;
	box-shadow: 0 -5px 0 #2EE6D6;
}
.bbz-rachat-page .fl-footer-title {
	display: inline-block;
	font-family: "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif; font-weight: 400;
	font-size: 1.1rem; letter-spacing: .03em; text-transform: none;
	color: #14102A;
	padding: 0 6px;
	background: linear-gradient(transparent 55%, #FFCC2E 55%, #FFCC2E 92%, transparent 92%);
}
.bbz-rachat-page .fl-footer-brand p { color: #3b3656; }
.bbz-rachat-page .fl-footer-links a { color: #14102A; font-weight: 600; }
.bbz-rachat-page .fl-footer-links a:hover { color: #C2006A; text-decoration: underline; text-decoration-thickness: 2px; }
.bbz-rachat-page .fl-footer-bottom {
	background: #14102A; color: #EFE7FF;
	border-top: 3px solid #14102A;
}
.bbz-rachat-page .fl-footer-bottom a { color: #FFCC2E; }
.bbz-rachat-page .fl-footer-bottom a:hover { color: #2EE6D6; }
.bbz-rachat-page .fl-footer-bottom * { color: inherit; }

/* Bouton clair / sombre du pied de page */
.bbz-rachat-page .fl-footer-bottom .fl-icon-btn {
	width: auto; height: auto; padding: 7px 16px; gap: 8px;
	color: #14102A !important; background: #FFCC2E;
	border: 2.5px solid #EFE7FF; border-radius: 999px;
	box-shadow: 3px 3px 0 #C2006A;
	font-weight: 800;
}
.bbz-rachat-page .fl-footer-bottom .fl-icon-btn:hover { background: #2EE6D6; }

/* ---------- Page Bretagne : zones de déplacement ---------- */
.bbr-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .bbr-grid-2 { grid-template-columns: 1fr; } }
.bbr-intro { max-width: 860px; font-size: 1.06rem; }
.bbr-zones { margin-top: 30px; row-gap: 40px; }
.bbr-dept { padding-top: 34px; }
.bbr-dept h3 { font-size: 1.2rem; }
.bbr-dept-num {
	position: absolute; top: -24px; right: 20px;
	display: grid; place-items: center;
	min-width: 62px; height: 46px; padding: 0 10px;
	border: 3px solid #14102A; border-radius: 14px;
	box-shadow: 3px 3px 0 #14102A;
	font: 400 1.7rem/1 "Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif;
	background: #FFCC2E; color: #14102A;
	transform: rotate(5deg);
}
.bbr-zones > .bbr-dept:nth-child(2) .bbr-dept-num { background: #2EE6D6; transform: rotate(-4deg); }
.bbr-zones > .bbr-dept:nth-child(3) .bbr-dept-num { background: #C2006A; color: #fff; }
.bbr-zones > .bbr-dept:nth-child(4) .bbr-dept-num { background: #14102A; color: #FFCC2E; transform: rotate(-5deg); }
.bbr ul.bbr-villes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.bbr ul.bbr-villes li {
	margin: 0; padding: 6px 12px;
	background: #EFE7FF; color: #14102A;
	border: 2.5px solid #14102A; border-radius: 999px;
	font-weight: 700; font-size: .95rem; line-height: 1.2;
}
.bbr ul.bbr-villes li::before { display: none; }
.bbr ul.bbr-villes li:first-child { background: #FFCC2E; }
#zones { scroll-margin-top: calc(var(--fl-header-h, 64px) + 16px); }