/* Refonte B de bmkd.be (31/10/2026) — système visuel des pages refaites (thème enfant, refonte/).
   Couleurs et polices du thème parent ; mise en page de la maquette B validée par Ben.
   Toutes les classes sont préfixées bmk- : rien ici ne touche aux pages encore servies par le thème parent ou Elementor. */
:root {
	--bmk-violet: #58468c; --bmk-nuit: #2b1d4f; --bmk-saumon: #ff8a73; --bmk-terre: #c4462c; --bmk-bleu: #3367ff;
	--bmk-lavande: #eef1ff; --bmk-lavande-2: #f6f7ff; --bmk-texte: #716c80; --bmk-bord: #e6e8f6;
	--bmk-sombre: #343351; --bmk-sombre-2: #2f2e49; --bmk-clair: #c9c7dc; --bmk-ombre: 0 18px 50px rgba(137, 173, 255, .22);
}
.bmk-refonte .mkdf-content { background: #fff; }
.bmk-grille { width: min(1240px, calc(100% - 40px)); margin: 0 auto; }
.bmk-sec { padding: 96px 0; font: 300 17px/1.7 Nunito, sans-serif; color: var(--bmk-texte); }
.bmk-sec p { margin: 0; }
.bmk-centre { text-align: center; }
.bmk-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bmk-ic { width: 44px; height: 44px; color: var(--bmk-violet); flex: none; display: block; }
.bmk-ic.bmk-fl { width: 20px; height: 20px; }

/* ---------- briques ---------- */
.bmk-surtitre { margin: 0 0 18px; font: 500 12px/1.6 Poppins, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: var(--bmk-violet); }
/* sur-titre en étiquette arrondie (variante C choisie par Ben le 31/10 ; avant : un trait devant, comme chez Unité
   Graphik). Le sur-titre court (type de projet, « Référence ») garde son petit trait. */
.bmk-surtitre:not(.bmk-surtitre-court) { display: inline-block; padding: 7px 14px 6px; border-radius: 999px; background: rgba(88, 70, 140, .09); }
.bmk-sec-sombre .bmk-surtitre:not(.bmk-surtitre-court), .bmk-sec-appel .bmk-surtitre { background: rgba(255, 255, 255, .1); }
.bmk-surtitre-court::before { content: ''; display: inline-block; vertical-align: middle; width: 24px; height: 2px; margin: -2px 10px 0 0; background: var(--bmk-saumon); }
/* le saumon du thème sur fond sombre ; sur fond clair, sa version foncée (#c4462c : 4,9:1 sur blanc, 4,6:1 sur lavande) */
.bmk-surtitre b { color: var(--bmk-terre); font-weight: 600; }
.bmk-bandeau .bmk-surtitre b, .bmk-sec-sombre .bmk-surtitre b, .bmk-sec-appel .bmk-surtitre b { color: var(--bmk-saumon); }
.bmk-surtitre-court { margin-bottom: 10px; font-size: 11px; letter-spacing: .16em; }
.bmk-titre { margin: 0; font: 300 clamp(32px, 4.4vw, 54px)/1.12 Poppins, sans-serif; letter-spacing: -.01em; color: var(--bmk-violet); text-transform: none; }
.bmk-titre strong { display: block; font-weight: 600; color: var(--bmk-nuit); }
.bmk-point { color: var(--bmk-saumon); }
.bmk-tete { display: grid; gap: 22px; margin-bottom: 52px; }
.bmk-sec .bmk-intro { max-width: 460px; font-size: 18px; }
.bmk-intro::after { content: ''; display: block; width: 60px; height: 2px; margin-top: 20px; background: var(--bmk-saumon); }
.bmk-trait { display: block; width: 32px; height: 2px; margin: 22px 0 14px; background: var(--bmk-saumon); }

.bmk-bouton { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 17px 34px; border: 1px solid var(--bmk-saumon); border-radius: 3em; background: var(--bmk-saumon); color: var(--bmk-nuit); font: 500 12px/1 Poppins, sans-serif; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; transition: box-shadow .3s; }
.bmk-bouton:hover, .bmk-bouton:focus-visible { color: var(--bmk-nuit); box-shadow: 0 10px 25px rgba(255, 138, 115, .5); }
.bmk-bouton-ligne { background: transparent; color: var(--bmk-violet); border-color: var(--bmk-violet); }
.bmk-bouton-ligne:hover, .bmk-bouton-ligne:focus-visible { color: var(--bmk-violet); box-shadow: none; background: rgba(88, 70, 140, .06); }
.bmk-boutons { display: flex; flex-wrap: wrap; gap: 12px; }
.bmk-lien-fleche { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 8px; border-bottom: 2px solid var(--bmk-saumon); font: 500 12px/1 Poppins, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--bmk-violet); text-decoration: none; }
.bmk-lien-fleche:hover { color: var(--bmk-violet); }
.bmk-lien-fleche .bmk-ic { width: 18px; height: 18px; color: var(--bmk-saumon); }
.bmk-lien-tout { margin-top: 44px; }

/* ---------- bandeau (sombre) ---------- */
.bmk-bandeau { position: relative; overflow: hidden; background: var(--bmk-sombre-2); color: var(--bmk-clair); font: 300 17px/1.7 Nunito, sans-serif; }
.bmk-bandeau::before, .bmk-bandeau::after { content: ''; position: absolute; border-radius: 50%; }
.bmk-bandeau::before { width: 520px; height: 520px; right: -120px; top: -140px; background: rgba(255, 255, 255, .035); }
.bmk-bandeau::after { width: 140px; height: 140px; left: 42%; bottom: 40px; background: rgba(255, 138, 115, .08); }
.bmk-bandeau-in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); align-items: center; gap: 10px; padding: 170px 0 100px; }
.bmk-bandeau .bmk-surtitre, .bmk-bandeau .bmk-titre, .bmk-bandeau .bmk-titre strong, .bmk-bandeau .bmk-etiquettes, .bmk-bandeau .bmk-lieu b { color: #fff; }
.bmk-titre-bandeau { font-size: clamp(40px, 5vw, 64px); margin-bottom: 24px; }
.bmk-bandeau .bmk-bandeau-sous { max-width: 540px; margin: 0 0 26px; font-size: 19px; }
.bmk-etiquettes { display: flex; flex-wrap: wrap; gap: 6px 0; margin: 0 0 34px; padding: 0; list-style: none; font: 500 14px/1.4 Poppins, sans-serif; }
.bmk-etiquettes li { margin: 0; padding: 0; }
.bmk-etiquettes li:not(:last-child)::after { content: '|'; margin: 0 12px; color: rgba(255, 255, 255, .3); font-weight: 300; }
.bmk-bandeau .bmk-bouton-ligne { color: #fff; border-color: rgba(255, 255, 255, .5); }
.bmk-bandeau .bmk-bouton-ligne:hover { background: rgba(255, 255, 255, .08); }
.bmk-bandeau .bmk-lieu { display: flex; align-items: center; gap: 12px; margin: 34px 0 0; font: 500 11px/1.5 Poppins, sans-serif; letter-spacing: .2em; text-transform: uppercase; }
.bmk-lieu .bmk-ic { width: 30px; height: 30px; color: var(--bmk-saumon); }
.bmk-lieu b { display: block; font-weight: 600; }
.bmk-bandeau-visuel img { display: block; width: 112%; max-width: none; height: auto; margin-left: -6%; filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .35)); }

/* ---------- cartes de services ---------- */
.bmk-cartes { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border: 1px solid var(--bmk-bord); border-radius: 12px; background: #fff; }
.bmk-carte { position: relative; padding: 38px 30px 34px; border-right: 1px solid var(--bmk-bord); }
.bmk-carte:last-child { border-right: 0; }
.bmk-fantome { position: absolute; top: 18px; right: 22px; font: 600 64px/1 Poppins, sans-serif; letter-spacing: -.02em; color: #f0f1fa; }
.bmk-fantome::before { content: attr(data-num); }
.bmk-carte .bmk-ic { position: relative; }
.bmk-carte h3, .bmk-projet h3, .bmk-argument h3, .bmk-etape h3 { margin: 0; font: 500 24px/1.3 Poppins, sans-serif; color: var(--bmk-violet); text-transform: none; letter-spacing: 0; }
.bmk-sec .bmk-carte p { margin: 10px 0 18px; font-size: 16px; }
.bmk-liens { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--bmk-bord); }
.bmk-liens li { margin: 0; padding: 0; border-bottom: 1px solid var(--bmk-bord); }
.bmk-liens a { display: flex; justify-content: space-between; padding: 11px 0; font: 500 13px/1.3 Poppins, sans-serif; color: var(--bmk-violet); text-decoration: none; }
.bmk-liens a::after { content: '→'; color: var(--bmk-saumon); transition: transform .2s; }
.bmk-liens a:hover { color: var(--bmk-nuit); }
.bmk-liens a:hover::after { transform: translateX(4px); }
.bmk-urgence { display: flex; align-items: center; gap: 16px; margin-top: 26px; padding: 18px 24px; border-radius: 12px; background: #fff3f0; color: var(--bmk-nuit); font-size: 16px; text-decoration: none; }
.bmk-urgence:hover { color: var(--bmk-nuit); background: #ffece7; }
.bmk-urgence .bmk-ic { width: 28px; height: 28px; color: var(--bmk-saumon); }
.bmk-urgence .bmk-ic.bmk-fl { width: 20px; margin-left: auto; }
.bmk-urgence b { font-weight: 700; }

/* ---------- sections sombres (réalisations) ---------- */
.bmk-sec-sombre { background: var(--bmk-sombre); color: var(--bmk-clair); }
.bmk-sec-sombre .bmk-titre, .bmk-sec-sombre .bmk-titre strong, .bmk-sec-sombre .bmk-surtitre { color: #fff; }
.bmk-projets { display: grid; grid-template-columns: 1.35fr 1fr; grid-template-rows: auto auto; gap: 24px; }
.bmk-projet { display: flex; flex-direction: column; overflow: hidden; border-radius: 12px; background: #3d3c5e; }
.bmk-projet-grand { grid-row: span 2; }
.bmk-projet-img { display: block; padding: 22px 22px 0; background: #45446a; }
.bmk-projet-img img { display: block; width: 100%; height: auto; transition: transform .5s cubic-bezier(.2, .7, .25, 1); }
.bmk-projet:hover .bmk-projet-img img { transform: translateY(-6px); }
.bmk-projet-txt { padding: 24px 28px 28px; }
.bmk-projet .bmk-surtitre { color: var(--bmk-clair); }
.bmk-projet h3, .bmk-projet h3 a { color: #fff; text-decoration: none; } /* h3 sans lien : référence sans fiche (31/10) */
.bmk-sec .bmk-projet p { margin: 8px 0 18px; font-size: 16px; color: var(--bmk-clair); }
.bmk-projets .bmk-projet:not(.bmk-projet-grand) { flex-direction: row; }
.bmk-projets .bmk-projet:not(.bmk-projet-grand) .bmk-projet-img { display: flex; flex: 0 0 46%; align-items: center; padding: 18px; }
.bmk-sec-sombre .bmk-lien-fleche, .bmk-sec-sombre .bmk-lien-fleche:hover { color: #fff; }

/* ---------- arguments ---------- */
.bmk-arguments { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px 60px; }
.bmk-argument { display: flex; gap: 26px; align-items: flex-start; }
.bmk-rond { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 84px; height: 84px; border-radius: 50%; background: var(--bmk-lavande); }
.bmk-rond .bmk-ic { width: 38px; height: 38px; }
.bmk-argument .bmk-trait { margin: 4px 0 12px; }
.bmk-argument h3 { font-size: 22px; }
.bmk-sec .bmk-argument p { margin-top: 6px; font-size: 16px; }

/* ---------- méthode ---------- */
.bmk-sec-lavande { background: var(--bmk-lavande-2); }
/* méthode en cartes (31/10) : plus de ligne de temps numérotée */
.bmk-etapes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
.bmk-etape { margin: 0; padding: 28px 26px 30px; border: 1px solid var(--bmk-bord); border-radius: 16px; background: #fff; }
.bmk-etape-haut { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.bmk-etape-ic { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 14px; background: var(--bmk-lavande); color: var(--bmk-violet); }
.bmk-etape-ic .bmk-ic { width: 26px; height: 26px; }
.bmk-etape-n { font: 600 12px/1 Poppins, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: var(--bmk-terre); }
.bmk-num { font: 600 54px/1 Poppins, sans-serif; letter-spacing: -.02em; color: var(--bmk-nuit); }
.bmk-etape h3 { font-size: 21px; }
.bmk-sec .bmk-etape p { margin-top: 8px; font-size: 16px; }

/* ---------- guides ---------- */
.bmk-guides { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 30px; border-top: 1px solid var(--bmk-bord); }
.bmk-guide { display: flex; align-items: center; gap: 18px; padding: 26px 8px; border-bottom: 1px solid var(--bmk-bord); font: 400 19px/1.35 Poppins, sans-serif; color: var(--bmk-violet); text-decoration: none; }
.bmk-guide:hover { color: var(--bmk-nuit); }
.bmk-guide .bmk-num { font-size: 15px; color: var(--bmk-terre); }
.bmk-guide .bmk-ic.bmk-fl { margin-left: auto; color: var(--bmk-saumon); }

/* ---------- appel final (sombre) ---------- */
.bmk-sec-appel { position: relative; overflow: hidden; background: var(--bmk-sombre-2); color: var(--bmk-clair); }
/* anneau décoratif : un ton plus clair que le fond sombre (le saumon translucide virait au brun-rouge, remarque de Ben) */
.bmk-sec-appel::after { content: ''; position: absolute; right: -80px; top: -60px; width: 420px; height: 420px; border: 60px solid rgba(255, 255, 255, .045); border-radius: 50%; }
.bmk-appel-in { position: relative; z-index: 1; max-width: 760px; margin-left: max(20px, calc((100% - 1240px) / 2)); }
.bmk-sec-appel .bmk-titre, .bmk-sec-appel .bmk-titre strong, .bmk-sec-appel .bmk-surtitre { color: #fff; }
.bmk-titre-appel { font-size: clamp(36px, 5vw, 64px); margin-bottom: 22px; }
.bmk-sec .bmk-appel-texte { max-width: 520px; margin-bottom: 30px; font-size: 18px; }
.bmk-sec-appel .bmk-bouton-ligne { color: #fff; border-color: rgba(255, 255, 255, .5); }

/* ---------- bandeau illustré (pages de services) ---------- */
.bmk-bandeau-illustre .bmk-titre-bandeau { font-size: clamp(36px, 4.4vw, 58px); }
/* fond sombre : l'illustration du thème est posée sur un panneau clair (sur le violet nuit, ses personnages disparaissent) */
.bmk-bandeau-illustre .bmk-bandeau-visuel { padding: 14px; border-radius: 22px; background: var(--bmk-lavande); box-shadow: 0 30px 70px rgba(0, 0, 0, .3); }
.bmk-bandeau-illustre .bmk-bandeau-visuel img { width: 100%; margin: 0; filter: none; }
/* fond clair : bandeau lavande comme les pages du thème, en-tête normal, grande illustration */
.bmk-bandeau-clair { background: var(--bmk-lavande); color: var(--bmk-texte); }
.bmk-bandeau-clair::before { background: #e2e7ff; }
.bmk-bandeau-clair::after { background: #e6eaff; }
.bmk-bandeau-clair .bmk-bandeau-in { padding: 80px 0 70px; }
.bmk-bandeau-clair .bmk-surtitre, .bmk-bandeau-clair .bmk-titre { color: var(--bmk-violet); }
.bmk-bandeau-clair .bmk-titre strong { color: var(--bmk-nuit); }
.bmk-bandeau-clair .bmk-surtitre b { color: var(--bmk-terre); }
.bmk-bandeau-clair .bmk-bouton-ligne { color: var(--bmk-violet); border-color: var(--bmk-violet); }
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel { padding: 0; background: none; box-shadow: none; margin-right: calc(-1 * max(20px, (100vw - 1240px) / 2)); }
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel img { width: 118%; max-width: none; margin-left: -4%; }
/* le dessin repose sur le bas du bandeau (il « flottait », remarque de Ben) : les illustrations du thème ont 6 à 14 %
   de vide transparent sous le dessin (--vide, mesuré par fichier : wp/illustrations_vide.json) ; l'image descend
   d'autant, la partie vide passe sous le bord (section en overflow hidden). */
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-in { align-items: end; padding-bottom: 0; }
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-texte { align-self: center; padding-bottom: 70px; }
/* Décalage par « translate », pas par « transform » : l'animation de flottement des illustrations (bmkFlotte,
   bmk-hero.php) réécrit transform et effaçait ce décalage — le bas coupé du fond rond remontait à l'écran (Ben, 31/10).
   translate s'ajoute à l'animation. Pour les illustrations qui flottent (bmk-ill-*), 14 px de plus : le bas coupé
   reste sous le bord du bandeau même en haut du flottement (12 px). */
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel img { transform: none; translate: 0 calc(var(--vide, 0) * 100%); }
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel img[src*="bmk-ill-"] { translate: 0 calc(var(--vide, 0) * 100% + 14px); }

/* ---------- ce qu'on fait (liste numérotée) ---------- */
.bmk-faits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 40px; margin: 0; padding: 0; list-style: none; }
.bmk-faits-4 { grid-template-columns: repeat(4, 1fr); }
.bmk-fait { margin: 0; padding: 26px 0 30px; border-top: 1px solid var(--bmk-bord); }
.bmk-fait-num { display: block; margin-bottom: 14px; font: 600 15px/1 Poppins, sans-serif; color: var(--bmk-terre); }
.bmk-fait h3 { margin: 0; font: 500 21px/1.3 Poppins, sans-serif; color: var(--bmk-violet); text-transform: none; letter-spacing: 0; }
.bmk-sec .bmk-fait p { margin-top: 8px; font-size: 16px; }

/* ---------- référence seule ---------- */
.bmk-projet-seul { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; }
.bmk-projet-seul .bmk-projet-img { height: 100%; display: flex; align-items: center; padding: 28px; }
.bmk-projet-seul .bmk-projet-txt { padding: 36px 40px; }
.bmk-projet-seul h3 { font-size: 28px; }
.bmk-sec-reference .bmk-lien-tout { margin-top: 36px; }

/* ---------- questions fréquentes ---------- */
.bmk-faq { max-width: 900px; border-top: 1px solid var(--bmk-bord); }
.bmk-q { border-bottom: 1px solid var(--bmk-bord); }
.bmk-q summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; cursor: pointer; list-style: none; }
.bmk-q summary::-webkit-details-marker { display: none; }
.bmk-q summary::after { content: '+'; flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--bmk-lavande); color: var(--bmk-violet); font: 400 22px/34px Poppins, sans-serif; text-align: center; transition: transform .25s; }
.bmk-q[open] summary::after { transform: rotate(45deg); }
.bmk-q h3 { margin: 0; font: 500 20px/1.35 Poppins, sans-serif; color: var(--bmk-violet); text-transform: none; letter-spacing: 0; }
.bmk-sec .bmk-q p { max-width: 760px; padding: 0 0 24px; font-size: 16px; }
.bmk-q summary:focus-visible { outline: 2px solid var(--bmk-violet); outline-offset: 4px; }

/* ---------- pour aller plus loin ---------- */
.bmk-plus { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.bmk-sous-titre { margin: 0 0 16px; font: 500 13px/1.4 Poppins, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--bmk-violet); }
.bmk-plus .bmk-guides { grid-template-columns: 1fr; }

/* ---------- urgence (site piraté) ---------- */
.bmk-urgence-in { display: grid; grid-template-columns: 1fr 1.15fr; gap: 50px; align-items: start; }
.bmk-urgence-in .bmk-tete { grid-template-columns: 1fr; margin-bottom: 24px; }
.bmk-sec .bmk-texte { margin-bottom: 16px; font-size: 17px; }
.bmk-attente { padding: 16px 20px; border-left: 3px solid var(--bmk-saumon); background: #fff; border-radius: 0 10px 10px 0; }
.bmk-attente strong { color: var(--bmk-nuit); font-weight: 700; }
.bmk-formulaire { padding: 30px; border-radius: 14px; background: #fff; box-shadow: var(--bmk-ombre); }

/* ---------- bandeau court (sans visuel : contact, mentions, 404) ---------- */
.bmk-bandeau-court .bmk-bandeau-in { grid-template-columns: minmax(0, 860px); padding: 160px 0 70px; }
.bmk-bandeau-court .bmk-bandeau-sous { max-width: 680px; }

/* ---------- page Services : cartes de services ---------- */
.bmk-services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.bmk-service { display: flex; flex-direction: column; padding: 32px 30px 28px; border: 1px solid var(--bmk-bord); border-radius: 12px; background: #fff; color: var(--bmk-texte); text-decoration: none; transition: box-shadow .3s, transform .3s; }
.bmk-service:hover { color: var(--bmk-texte); box-shadow: var(--bmk-ombre); transform: translateY(-4px); }
.bmk-service .bmk-ic { width: 40px; height: 40px; }
.bmk-service h3 { margin: 0; font: 500 21px/1.3 Poppins, sans-serif; color: var(--bmk-violet); text-transform: none; letter-spacing: 0; }
.bmk-service p { flex: 1; margin: 8px 0 20px; font-size: 16px; }
.bmk-service-plus { display: inline-flex; align-items: center; gap: 8px; font: 500 12px/1 Poppins, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--bmk-violet); }
.bmk-service-plus .bmk-ic { width: 18px; height: 18px; color: var(--bmk-saumon); }
@media (hover: none) { .bmk-service:hover { transform: none; box-shadow: none; } }

/* ---------- à propos : histoire, chiffres, logos, zones ---------- */
.bmk-histoire { display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center; }
.bmk-sec .bmk-texte-grand { font-size: 19px; line-height: 1.8; }
.bmk-chiffres { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--bmk-bord); border-left: 1px solid var(--bmk-bord); }
.bmk-chiffres li { margin: 0; padding: 26px 24px; border-right: 1px solid var(--bmk-bord); border-bottom: 1px solid var(--bmk-bord); }
.bmk-chiffre { display: block; font: 600 46px/1 Poppins, sans-serif; color: var(--bmk-nuit); letter-spacing: -.02em; }
.bmk-chiffre-libelle { display: block; margin-top: 8px; font: 500 12px/1.4 Poppins, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--bmk-violet); }
.bmk-logos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--bmk-bord); border-left: 1px solid var(--bmk-bord); }
.bmk-logos li { display: flex; align-items: center; justify-content: center; margin: 0; padding: 30px 24px; border-right: 1px solid var(--bmk-bord); border-bottom: 1px solid var(--bmk-bord); }
.bmk-logos img { max-width: 170px; max-height: 70px; width: auto; height: auto; }
.bmk-sec-sombre .bmk-liens { border-top-color: rgba(255, 255, 255, .15); }
.bmk-sec-sombre .bmk-liens li { border-bottom-color: rgba(255, 255, 255, .15); }
.bmk-sec-sombre .bmk-liens a { color: #fff; font-size: 16px; padding: 16px 0; }
.bmk-sec-zones .bmk-liens { max-width: 760px; }
.bmk-sec-sombre .bmk-intro { color: var(--bmk-clair); }

/* ---------- contact ---------- */
.bmk-contact { display: grid; grid-template-columns: 1.35fr 1fr; gap: 50px; align-items: start; }
.bmk-coordonnees { margin: 0 0 24px; padding: 0; list-style: none; }
.bmk-coordonnees li { display: flex; align-items: center; gap: 18px; margin: 0; padding: 14px 0; border-bottom: 1px solid var(--bmk-bord); }
.bmk-coordonnees .bmk-rond { width: 56px; height: 56px; }
.bmk-coordonnees .bmk-rond .bmk-ic { width: 24px; height: 24px; }
.bmk-coord-libelle { display: block; font: 500 11px/1.4 Poppins, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--bmk-violet); }
.bmk-coord-valeur { display: block; font: 400 17px/1.4 Poppins, sans-serif; color: var(--bmk-nuit); }
.bmk-coord-valeur a { color: var(--bmk-nuit); text-decoration: none; }
.bmk-coord-valeur a:hover { color: var(--bmk-violet); }
.bmk-contact-infos .bmk-urgence { margin-top: 18px; }

/* ---------- réalisations : filtre et grille ---------- */
.bmk-filtres { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; }
.bmk-filtre { padding: 11px 22px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 3em; background: transparent; color: #fff; font: 500 12px/1 Poppins, sans-serif; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.bmk-filtre[aria-pressed="true"] { border-color: var(--bmk-saumon); background: var(--bmk-saumon); color: var(--bmk-nuit); }
.bmk-filtre:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.bmk-grille-projets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.bmk-projet-carte[hidden] { display: none; }
.bmk-projet-carte .bmk-projet-img { padding: 18px 18px 0; }
.bmk-projet-nom { margin: 0; font: 500 22px/1.3 Poppins, sans-serif; text-transform: none; letter-spacing: 0; }
.bmk-projet-nom a { color: #fff; text-decoration: none; }
.bmk-sec .bmk-projet-carte p { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- texte simple (mentions) et 404 ---------- */
.bmk-prose { max-width: 820px; }
.bmk-prose h2 { margin: 40px 0 12px; font: 500 26px/1.3 Poppins, sans-serif; color: var(--bmk-violet); text-transform: none; letter-spacing: 0; }
.bmk-prose h2:first-child { margin-top: 0; }
.bmk-sec .bmk-prose p { margin: 0 0 14px; }
.bmk-prose a { color: var(--bmk-violet); text-decoration: underline; text-underline-offset: 3px; }
.bmk-sec-introuvable .bmk-liens { max-width: 640px; }

/* ---------- tablette et téléphone ---------- */
@media (min-width: 900px) { .bmk-tete { grid-template-columns: 1.5fr 1fr; align-items: end; } }
@media (max-width: 1024px) {
	.bmk-bandeau-in { grid-template-columns: 1fr; padding: 56px 0 30px; }
	.bmk-bandeau-visuel { margin: 10px -20px 0; }
	.bmk-bandeau-visuel img { width: 112%; margin-left: -6%; }
	.bmk-cartes { grid-template-columns: repeat(2, 1fr); }
	.bmk-carte:nth-child(2) { border-right: 0; }
	.bmk-carte:nth-child(-n+2) { border-bottom: 1px solid var(--bmk-bord); }
	.bmk-projets { grid-template-columns: 1fr; }
	.bmk-projet-grand { grid-row: auto; }
	.bmk-etapes { grid-template-columns: repeat(2, 1fr); }
	.bmk-faits, .bmk-faits-4 { grid-template-columns: repeat(2, 1fr); }
	.bmk-projet-seul, .bmk-urgence-in { grid-template-columns: 1fr; }
	.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel { margin: 10px -20px 0; }
	.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel img { width: 124%; margin-left: -12%; }
	.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-texte { padding-bottom: 0; }
	.bmk-bandeau-illustre:not(.bmk-bandeau-clair) .bmk-bandeau-visuel { margin: 14px 0 0; }
	.bmk-bandeau-court .bmk-bandeau-in { padding: 56px 0 50px; }
	/* Ben, 31/10 : trop d'espace entre le menu et le sur-titre sur téléphone. La règle des bandeaux clairs (80 px,
	   hors media query) l'emportait sur celle de 56 px ci-dessus, plus précise ; on la reprend au même niveau. */
	.bmk-bandeau-clair .bmk-bandeau-in, .bmk-bandeau-clair.bmk-bandeau-court .bmk-bandeau-in { padding-top: 32px; }
	.bmk-services, .bmk-grille-projets { grid-template-columns: repeat(2, 1fr); }
	.bmk-histoire, .bmk-contact { grid-template-columns: 1fr; }
	.bmk-logos { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 680px) {
	.bmk-sec { padding: 64px 0; font-size: 16px; }
	.bmk-tete { margin-bottom: 36px; }
	.bmk-sec .bmk-intro { font-size: 16px; }
	.bmk-titre { font-size: 31px; }
	.bmk-titre-bandeau { font-size: 40px; }
	.bmk-bandeau .bmk-bandeau-sous { font-size: 17px; }
	.bmk-etiquettes { font-size: 13px; }
	.bmk-etiquettes li:not(:last-child)::after { margin: 0 8px; }
	.bmk-boutons .bmk-bouton { flex: 1 1 100%; }
	.bmk-cartes { grid-template-columns: 1fr; }
	.bmk-carte { padding: 32px 24px 28px; border-right: 0; border-bottom: 1px solid var(--bmk-bord); }
	.bmk-carte:last-child { border-bottom: 0; }
	.bmk-fantome { font-size: 52px; }
	.bmk-projets .bmk-projet:not(.bmk-projet-grand) { flex-direction: column; }
	/* flex: none — la base « 46 % » de l'ordinateur (largeur, en ligne) devenait 46 % d'une hauteur indéfinie en
	   colonne : carte trop courte, « Voir le projet » coupé (Ben, 31/10). */
	.bmk-projets .bmk-projet:not(.bmk-projet-grand) .bmk-projet-img { flex: none; padding: 18px 18px 0; }
	.bmk-arguments { grid-template-columns: 1fr; gap: 30px; }
	.bmk-rond { width: 66px; height: 66px; }
	.bmk-rond .bmk-ic { width: 30px; height: 30px; }
	.bmk-argument { gap: 18px; }
	.bmk-etapes { grid-template-columns: 1fr; gap: 14px; }
	.bmk-etape { padding: 22px 22px 24px; }
	.bmk-etape-haut { margin-bottom: 16px; }
	.bmk-num { font-size: 40px; }
	.bmk-guides { grid-template-columns: 1fr; }
	.bmk-guide { font-size: 17px; }
	.bmk-titre-appel { font-size: 36px; }
	.bmk-bandeau-illustre .bmk-titre-bandeau { font-size: 34px; }
	.bmk-faits, .bmk-faits-4 { grid-template-columns: 1fr; }
	.bmk-projet-seul .bmk-projet-txt { padding: 24px 24px 28px; }
	.bmk-projet-seul .bmk-projet-img { padding: 18px 18px 0; }
	.bmk-plus { grid-template-columns: 1fr; gap: 36px; }
	.bmk-q h3 { font-size: 18px; }
	.bmk-formulaire { padding: 20px 16px; }
	.bmk-services, .bmk-grille-projets { grid-template-columns: 1fr; }
	.bmk-logos { grid-template-columns: repeat(2, 1fr); }
	.bmk-logos li { padding: 22px 14px; }
	.bmk-chiffre { font-size: 36px; }
	.bmk-chiffres li { padding: 20px 16px; }
	.bmk-sec .bmk-texte-grand { font-size: 17px; }
}

/* ---------- bandeau clair (version C retenue) : textes, ombre, contraste ---------- */
.bmk-bandeau-clair .bmk-etiquettes, .bmk-bandeau-clair .bmk-lieu b { color: var(--bmk-violet); }
.bmk-bandeau-clair .bmk-etiquettes li:not(:last-child)::after { color: #c9c3e0; }
.bmk-bandeau-clair .bmk-bandeau-visuel img { filter: drop-shadow(0 30px 50px rgba(88, 70, 140, .18)); }
.bmk-bandeau-clair.bmk-bandeau-illustre .bmk-bandeau-visuel img { filter: none; }
/* sur la lavande foncée (#eef1ff), le gris du texte fait 4,47:1 : un ton plus sombre (5,6:1) */
.bmk-bandeau-clair { color: #625d74; }
.bmk-sec-lavande .bmk-q summary::after { background: #fff; }
/* bandeau de l'accueil : trois engagements sous les boutons (31/10, à la place de la liste à barres et du lieu) */
.bmk-preuves { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 30px 0 0; padding: 0; list-style: none; font: 500 14px/1.4 Poppins, sans-serif; color: var(--bmk-violet); }
.bmk-preuves li { display: flex; align-items: center; gap: 9px; margin: 0; }
.bmk-preuves .bmk-ic { width: 20px; height: 20px; flex: none; color: var(--bmk-terre); }
.bmk-preuves .bmk-preuve-lieu { flex-basis: 100%; } /* zone d'intervention : toujours sur sa propre ligne, sous les engagements */
@media (max-width: 680px) { .bmk-preuves { flex-direction: column; gap: 10px; margin-top: 26px; } }