/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/
/* ==========================================================================
   Contenu éditorial importé de reconvpro.com (articles, fiches métiers, pages)
   Cible : élément Bricks « Post content » et texte riche portant la classe .contenu-editorial
   ========================================================================== */
.contenu-editorial { max-width: 78ch; }
.contenu-editorial > * + * { margin-top: var(--space-s); }
.contenu-editorial h2 { margin-top: var(--space-l); font-size: var(--text-xl); text-wrap: balance; }
.contenu-editorial h3 { margin-top: var(--space-m); font-size: var(--text-l); text-wrap: balance; }
.contenu-editorial h4 { margin-top: var(--space-s); font-size: var(--text-m); }
.contenu-editorial p, .contenu-editorial li { font-size: var(--text-m); line-height: 1.6; }
.contenu-editorial ul, .contenu-editorial ol { padding-left: 1.4em; }
.contenu-editorial li + li { margin-top: .35em; }
.contenu-editorial a:not(.bouton) { color: var(--primary); text-decoration: underline; text-underline-offset: .15em; }
.contenu-editorial figure { margin: var(--space-m) 0; }
.contenu-editorial figure img { width: 100%; height: auto; border-radius: var(--radius-m); }
.contenu-editorial figcaption { font-size: var(--text-s); color: var(--dark-60); margin-top: .5em; }
.contenu-editorial .accroche { font-size: var(--text-l); color: var(--dark-70); }

/* Boutons issus des pages Elementor */
.contenu-editorial .boutons { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin-top: var(--space-m); }
.contenu-editorial .bouton { display: inline-flex; align-items: center; gap: .5em; padding: .8em 1.4em; background: var(--primary); color: var(--light); border-radius: var(--radius-m); font-weight: 600; text-decoration: none; line-height: 1.2; transition: background .15s; }
.contenu-editorial .bouton:hover, .contenu-editorial .bouton:focus-visible { background: var(--primary-d-1, #c95f00); color: var(--light); }

/* Dépliants (FAQ, « lire plus ») */
.contenu-editorial details.pli { border: 1px solid var(--dark-10); border-radius: var(--radius-m); background: var(--light); }
.contenu-editorial details.pli + details.pli { margin-top: var(--space-2xs); }
.contenu-editorial details.pli summary { cursor: pointer; padding: var(--space-xs) var(--space-s); font-weight: 600; list-style: none; position: relative; padding-right: 3rem; }
.contenu-editorial details.pli summary::-webkit-details-marker { display: none; }
.contenu-editorial details.pli summary::after { content: "+"; position: absolute; right: var(--space-s); top: 50%; transform: translateY(-50%); color: var(--primary); font-size: 1.4em; font-weight: 400; line-height: 1; }
.contenu-editorial details.pli[open] summary::after { content: "−"; }
.contenu-editorial details.pli .pli-contenu { padding: 0 var(--space-s) var(--space-s); }
.contenu-editorial details.pli .pli-contenu > * + * { margin-top: var(--space-xs); }

/* Chiffres clés des fiches métiers */
.contenu-editorial .metier-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--space-xs); margin: var(--space-m) 0; }
.contenu-editorial .metier-stats .stat { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .35em; padding: var(--space-s) var(--space-xs); background: var(--dark-5); border-radius: var(--radius-m); }
.contenu-editorial .metier-stats img { width: 56px; height: 56px; object-fit: contain; border-radius: 0; }
.contenu-editorial .metier-stats .stat-label { font-size: var(--text-s); color: var(--dark-60); }
.contenu-editorial .metier-stats .stat-value { font-size: var(--text-m); color: var(--text-title); }

/* Cartes et listes à puces issues d'Unlimited Elements */
.contenu-editorial .cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-s); margin: var(--space-m) 0; }
.contenu-editorial .cartes .carte { padding: var(--space-s); border: 1px solid var(--dark-10); border-left: 3px solid var(--primary); border-radius: var(--radius-m); background: var(--light); }
.contenu-editorial .cartes .carte h3 { margin: 0 0 .5em; font-size: var(--text-m); }
.contenu-editorial .cartes .carte p { font-size: var(--text-s); }
.contenu-editorial ul.puces { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .5em var(--space-s); }
.contenu-editorial ul.puces li { padding-left: 1.5em; position: relative; }
.contenu-editorial ul.puces li::before { content: "✓"; position: absolute; left: 0; color: var(--primary); font-weight: 700; }

/* Cartes des listes d'articles et de fiches (templates Bricks) */
.grille-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-m); }
@media (max-width: 991px) { .grille-cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .grille-cartes { grid-template-columns: 1fr; } }
.carte-article { display: flex; flex-direction: column; gap: var(--space-xs); height: 100%; }
.carte-article__img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; border-radius: var(--radius-m); }
.carte-article__meta { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-xs); font-size: var(--text-s); color: var(--dark-60); align-items: center; }
.carte-article__meta a { background: var(--dark-5); padding: .2em .6em; border-radius: 999px; color: var(--dark-80); text-decoration: none; }
.carte-article__titre { font-size: var(--text-l); line-height: 1.25; text-wrap: balance; }
.carte-article__titre a { color: var(--text-title); text-decoration: none; }
.carte-article__titre a:hover { color: var(--primary); }
.carte-article__extrait { font-size: var(--text-s); color: var(--dark-70); }
.carte-article__lien { margin-top: auto; font-weight: 600; color: var(--primary); text-decoration: none; }
.chips-termes { display: flex; flex-wrap: wrap; gap: var(--space-2xs); }
.chips-termes a { display: inline-block; padding: .4em .9em; border: 1px solid var(--dark-20); border-radius: 999px; font-size: var(--text-s); color: var(--dark-80); text-decoration: none; }
.chips-termes a:hover { border-color: var(--primary); color: var(--primary); }
/* Pages de catégorie de formation (template Bricks 1122) */
.cat-intro { font-size: var(--text-l); color: var(--dark-70); max-width: 78ch; }
.carte-formation { display: flex; flex-direction: column; gap: var(--space-xs); height: 100%; background: var(--light); border: 1px solid var(--dark-10); border-radius: var(--radius-m); overflow: hidden; }
.carte-formation__img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.carte-formation__corps { display: flex; flex-direction: column; gap: var(--space-2xs); padding: 0 var(--space-s) var(--space-s); flex: 1; }
.carte-formation__puces { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-xs); font-size: var(--text-s); color: var(--dark-60); }
.carte-formation__puces > * { display: inline-flex; align-items: center; gap: .35em; }
.carte-formation__puces > *::before { content: "✓"; color: var(--primary); font-weight: 700; }
.carte-formation__titre { font-size: var(--text-l); line-height: 1.2; text-wrap: balance; }
.carte-formation__titre a { color: var(--text-title); text-decoration: none; }
.carte-formation__titre a:hover { color: var(--primary); }
.carte-formation__accroche { font-size: var(--text-s); color: var(--dark-70); }
.carte-formation__prix { display: flex; align-items: baseline; gap: var(--space-xs); margin-top: auto; padding-top: var(--space-2xs); }
.carte-formation__barre { color: var(--dark-50); text-decoration: line-through; font-size: var(--text-s); }
.carte-formation__montant { color: var(--primary); font-weight: 700; font-size: var(--text-xl); }
.grille-arguments { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-m); }
.argument { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-xs); }
.argument__picto { width: 96px; height: 96px; object-fit: contain; }
.argument__titre { font-size: var(--text-l); text-wrap: balance; }
.grille-avantages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-m); }
.avantage { display: grid; grid-template-columns: auto 1fr; gap: var(--space-xs) var(--space-s); align-items: start; padding: var(--space-s); background: var(--light); border-radius: var(--radius-m); }
.avantage .brxe-icon { grid-row: span 2; font-size: 2.2rem; color: var(--primary); }
.avantage__titre { font-size: var(--text-m); font-weight: 600; margin: 0; }
.avantage__texte { font-size: var(--text-s); color: var(--dark-70); }
.inscription { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-l); align-items: start; }
.inscription__img { width: 100%; height: auto; border-radius: var(--radius-m); }
.carte-categorie { display: flex; flex-direction: column; gap: var(--space-2xs); }
.carte-categorie__img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; border-radius: var(--radius-m); }
.carte-categorie__titre { font-size: var(--text-m); font-weight: 600; }
.carte-categorie__titre a { color: var(--text-title); text-decoration: none; }
.bloc-question { text-align: center; max-width: 70ch; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: var(--space-s); }
@media (max-width: 991px) { .grille-arguments { grid-template-columns: 1fr; } .grille-avantages { grid-template-columns: 1fr; } .inscription { grid-template-columns: 1fr; } }
/* Images des cartes : Bricks pose la classe sur le lien <a> qui enveloppe l'<img> ; l'enveloppe fixe le ratio, l'image remplit en cover. */
.carte-article__img, .carte-formation__img, .carte-categorie__img { display: block; width: 100%; overflow: hidden; }
.carte-article__img { aspect-ratio: 16 / 9; border-radius: var(--radius-m); }
.carte-formation__img { aspect-ratio: 16 / 10; border-radius: 0; }
.carte-categorie__img { aspect-ratio: 4 / 3; border-radius: var(--radius-m); }
.carte-article__img img, .carte-formation__img img, .carte-categorie__img img,
img.carte-article__img, img.carte-formation__img, img.carte-categorie__img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* == Fiche métier v2 (template 2350) — compteurs des cartes et listes == */
.metier-grid, .metier-list { counter-reset: metier; }
.metier-count::before { counter-increment: metier; content: counter(metier); }
.metier-count--big::before { content: counter(metier, decimal-leading-zero); }
.brxe-accordion-nested .home-faq-11__item > .accordion-title-wrapper { width: 100%; text-align: left; cursor: pointer; }


/* == Checkout : mode de paiement (assets/js/checkout-mode-paiement.js) == */
#reconv-mode-paiement { display: flex; flex-direction: column; gap: 10px; margin: 0 0 24px; }
#reconv-mode-paiement[hidden] { display: none; }
.reconv-mode-paiement__title { font-weight: 600; font-size: 15px; color: var(--text-title, #1e1c1f); }
.reconv-mode-paiement__pills { display: flex; flex-wrap: wrap; gap: 10px; }
.reconv-pill { display: inline-flex; align-items: center; padding: 8px 16px; border: 2px solid var(--primary, #eb7000); border-radius: 999px; font-weight: 600; font-size: 15px; line-height: 1.3; color: var(--text-title, #1e1c1f); background: var(--light, #fff); text-decoration: none; transition: all .2s ease; }
a.reconv-pill:hover { background: var(--secondary, #fdc496); }
.reconv-pill.is-active { background: var(--primary, #eb7000); color: var(--light, #fff); }

/* Page Offrez une formation : numéros des étapes */
.cadeau-etapes { counter-reset: etape; }
.cadeau-etape__count::before { counter-increment: etape; content: counter(etape); }
