/* ==========================================================================
   Gabarit « page de prestation » (Maçonnerie, Toiture, Isolation, Plâtrerie peinture).
   Chargé après style.css. Générateur : /root/build/prestation.php. Tailles de police en rem.
   ========================================================================== */

/* ----------------------------------------------------------------- Colonnes texte + média */
.pb-prest-texte { min-width: 0; }
.pb-prest-photo { line-height: 0; }
@media (min-width: 1025px) {
	/* La photo cède de la place en desktop étroit plutôt que d'écraser le texte. */
	.pb-prest-colonnes > .e-con-inner > .pb-prest-photo, .pb-section-savoir > .e-con-inner > .pb-prest-photo, .pb-section-savoir > .e-con-inner > .pb-photo-chiffres { flex: 0 1 auto; min-width: 380px; }
	.pb-prest-colonnes > .e-con-inner > .pb-bloc-texte, .pb-section-savoir > .e-con-inner > .pb-bloc-texte { flex: 1 1 0; min-width: 0; }
	.pb-prest-colonnes > .e-con-inner > .pb-prest-faq { flex: 0 1 631px; }
}

/* Deux photos superposées : grande en haut à droite, petite bordée de blanc en bas à gauche. */
.pb-prest-duo .pb-photos-duo-1 { align-self: flex-end; }
.pb-prest-duo .pb-photos-duo-2 { right: auto; left: 0; }
.pb-prest-duo--large .pb-photos-duo-1 { width: 86% !important; }
.pb-prest-duo--large .pb-photos-duo-2 { width: 64% !important; }
@media (max-width: 1024px) { .pb-prest-duo { max-width: 600px; align-self: center; } }

/* Chiffres clés sur la photo : photo au bord du contenu, pastilles qui dépassent de 16 px (à gauche ou à droite). */
.pb-prest-chiffres .pb-photo-chiffres-img { padding-left: 0; }
.pb-prest-chiffres .pb-chiffres { left: -16px; bottom: 22px; }
.pb-prest-chiffres--d .pb-chiffres { left: auto; right: -15px; align-items: flex-end; }
.pb-prest-chiffres--d .pb-chiffres::before { left: auto; right: -14px; transform: scaleX(-1); }
@media (max-width: 1340px) {
	.pb-prest-chiffres .pb-chiffres { left: -10px; }
	.pb-prest-chiffres--d .pb-chiffres { left: auto; right: -10px; }
}

/* ----------------------------------------------------------------- Petites cartes à marque rouge */
.pb-grille-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px !important; }
@media (max-width: 1240px) { .pb-grille-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .pb-grille-6 { grid-template-columns: minmax(0, 1fr); gap: 14px !important; } }
@media (max-width: 1024px) { .pb-grille:has(> .pb-carte-marque) { gap: 16px 20px !important; } }
.pb-carte-marque { position: relative; min-height: 129px; transition: background-color .3s ease, border-color .3s ease; }
.pb-grille-6 .pb-carte-marque { min-height: 105px; --padding-left: 15px; --padding-right: 12px; }
.pb-carte-marque::before { content: ""; position: absolute; left: -8px; top: 15px; width: 40px; height: 11px; background: var(--dj-rouge); transition: opacity .3s ease; }
.pb-grille-6 .pb-carte-marque::before { width: 46px; left: -9px; }
.pb-carte-marque::after { content: ""; position: absolute; left: -12px; top: -12px; width: 36px; height: 26px; background: url("../img/equerre-fine.svg") center / contain no-repeat; opacity: 0; transition: opacity .3s ease; pointer-events: none; }
.pb-carte-marque .elementor-heading-title { transition: color .3s ease; overflow-wrap: break-word; hyphens: auto; }
.pb-carte-marque:hover { background-color: var(--dj-rouge) !important; border-color: var(--dj-rouge) !important; }
.pb-carte-marque:hover::before { opacity: 0; }
.pb-carte-marque:hover::after { opacity: 1; }
.pb-carte-marque:hover .elementor-heading-title { color: #fff !important; }
@media (max-width: 767px) { .pb-carte-marque, .pb-grille-6 .pb-carte-marque { min-height: 0; } }

/* ----------------------------------------------------------------- Deux grandes cartes (la seconde rouge en permanence) */
.pb-grandes-cartes { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 46px !important; }
.pb-grandes-cartes > .e-con { width: auto !important; max-width: none; }
@media (max-width: 1100px) { .pb-grandes-cartes { gap: 24px !important; } }
@media (max-width: 899px) { .pb-grandes-cartes { grid-template-columns: minmax(0, 1fr); } }
.pb-grande-carte .pb-puces .elementor-icon-list-text { font-weight: 700; }
.pb-grande-carte .pb-puces { margin-top: 5px; }
/* Sur fond rouge : équerre blanche à rectangle noir, puces noire + blanche. */
.pb-grande-carte--rouge .pb-surtitre .elementor-heading-title::before { background-image: url("data:image/svg+xml,%3Csvg width='35.7136' height='25.7718' viewBox='0 0 35.7136 25.7718' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='9.58105' y='9.1805' width='22.9655' height='12.7586' fill='%231D1D1B'/%3E%3Cpath d='M35.7133 4.57845L2.82178 4.55628M2.59334 4.56771L1.2959 4.56771M0.778604 4.56771L0 4.56771M5.19238 25.7718L5.19238 2.82692M5.19238 2.48856L5.19238 1.19112M5.19238 0.778604L5.19238 0' stroke='%23FFFFFF' stroke-miterlimit='10'/%3E%3C/svg%3E"); }
.pb-grande-carte--rouge .pb-puces .elementor-icon-list-item::before { background: linear-gradient(90deg, var(--dj-noir) 0 18px, transparent 18px 21.5px, #fff 21.5px 27px); }
.pb-grande-carte--rouge .elementor-widget-text-editor strong { font-weight: 700; }

/* ----------------------------------------------------------------- Frise des 7 étapes */
.pb-etapes-frise { display: grid !important; grid-template-columns: 160fr 166fr 214fr 169fr 200fr 200fr 157fr; gap: 0 !important; border-top: 0; }
.pb-etapes-frise > .pb-etape { width: auto !important; max-width: none; border-top: 2px solid var(--dj-bordure); --padding-top: 14px; --padding-right: 24px; padding: 14px 24px 0 0; }
.pb-etapes-frise > .pb-etape:last-child { --padding-right: 0px; padding-right: 0; }
@media (max-width: 1280px) { .pb-etapes-frise { grid-template-columns: repeat(7, minmax(0, 1fr)); } .pb-etapes-frise > .pb-etape { --padding-right: 14px; padding-right: 14px; } }
@media (max-width: 1024px) { .pb-etapes-frise { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 36px !important; } .pb-etapes-frise > .pb-etape { --padding-right: 20px; padding-right: 20px; } }
@media (max-width: 899px) { .pb-etapes-frise { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.pb-etapes-frise { grid-template-columns: minmax(0, 1fr); row-gap: 24px !important; border-left: 2px solid var(--dj-bordure); padding-left: 20px; }
	.pb-etapes-frise > .pb-etape { border-top: 0; --padding-top: 0px; --padding-right: 0px; padding: 0; }
	.pb-etapes-frise > .pb-etape::before { left: -22px; top: 3px; width: 2px; height: 18px; background: var(--dj-rouge); }
}

/* ----------------------------------------------------------------- « Ce que vous y gagnez » : avantages en grille 3 × 2 */
.pb-gains .elementor-icon-list-items { display: grid; grid-template-columns: repeat(3, auto); justify-content: center; gap: 22px 88px; }
.pb-gains .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.pb-gains .elementor-icon-list-item::after { display: none !important; }
.pb-gains--cote { flex: 1 1 0; min-width: 0; }
.pb-gains--cote .elementor-icon-list-items { justify-content: space-between; gap: 22px 32px; }
@media (max-width: 1240px) { .pb-gains .elementor-icon-list-items { gap: 22px 40px; } .pb-gains--cote .elementor-icon-list-items { gap: 22px 20px; } }
@media (max-width: 1024px) { .pb-gains .elementor-icon-list-items, .pb-gains--cote .elementor-icon-list-items { grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; gap: 20px 32px; } .pb-gains--cote { flex: none; } }
@media (max-width: 767px) { .pb-gains .elementor-icon-list-items, .pb-gains--cote .elementor-icon-list-items { grid-template-columns: minmax(0, 1fr); gap: 16px; } .pb-gains br { display: none; } }

/* ----------------------------------------------------------------- FAQ à côté de la photo */
.pb-prest-faq .pb-faq { margin-top: 12px; }
/* Chevron de la question calé au bord droit (la maquette), question sur toute la largeur. */
.pb-prest-faq .pb-faq .e-n-accordion-item-title { justify-content: space-between; }
.pb-prest-faq .pb-faq .e-n-accordion-item-title-header { flex: 1 1 auto; min-width: 0; }
.pb-prest-faq .pb-faq .e-n-accordion-item-title-icon { flex: none; }
/* Desktop étroit : avantages à côté du texte sur 2 colonnes (3 lignes) pour garder les libellés sur deux lignes. */
@media (min-width: 1025px) and (max-width: 1280px) { .pb-gains--cote .elementor-icon-list-items { grid-template-columns: repeat(2, auto); } }
