/* at_placement — ADAPTATEURS des cibles du builder, au front et dans l'aperçu de l'éditeur.
   Les formules (colonnes, idéalement, grille, masqué) sont communes à toutes les cibles et
   vivent dans le noyau : attps-get-field/assets/css/atgf-placement.css, chargée avant
   celle-ci. Elles lisent `--atp-w` (poids effectif), `--atp-mw` (largeur mini) et `--atp-gap`
   (écart des colonnes), que cette feuille fait pointer sur les variables du builder.
   Cibles : assets/json/placement-targets.json (`element` : groupe ; `column` : ligne).
   Lignes et groupes à deux niveaux (`frame`) : l'hôte du placement est la disposition
   (`__layout`), la boîte reçoit les classes compat et les variables d'écart ; dans la scène
   de l'éditeur, un seul élément porte les deux (d'où `.atb-row` ET `.atb-row__layout`).
   Audit : attps-get-field/docs/audit-at-placement.md. */

/* Alignement propre à l'élément : jamais hérité (audit 1.8). */
@property --atb-element-align { syntax: '*'; inherits: false; }

/* Variables du conteneur remises à zéro à chaque groupe, placé ou non (un groupe non
   réglé, imbriqué dans un groupe réglé, repart des défauts). */
.atb-group {
    --atp-keep: 0;
    --atp-tracks: initial;
    --atp-cols: initial;
    --atp-row: initial;
    --atp-n: initial;
    --atp-min: initial;
    --atp-repeat: initial;
}

/* --- Cible `element` : .atb-group > .atb-group__layout (hôte du placement) > .atb-element.
   La boîte porte l'écart en variable, la disposition le lit par héritage. ---------------- */
.atb-group__layout.atp-host {
    --atp-gap: var(--atb-group-gap, 0rem);
    --atp-bleed: 1.5rem; /* Carrousel : place pour l'ombre des cartes (atb-card…) */
}

.atb-group__layout.atp-host > .atb-element {
    --atp-w: var(--atb-element-weight-eff, 6);
    --atp-mw: var(--atb-element-min-width, 250px);
    --atp-item-ct: inline-size;
}

/* --- Cible `column` : .atb-row > .atb-row__layout (hôte du placement) > .atb-column ------- */
.atb-row__layout.atp-host {
    --atp-gap: var(--atb-column-gap, 0rem);
    --atp-bleed: 1.5rem;
}

.atb-row__layout.atp-host > .atb-column {
    --atp-w: var(--atb-column-weight-eff, 6);
    --atp-mw: var(--atb-column-min-width, 250px);
    --atp-item-ct: inline-size;
}

/* --- Cible `modal-column` : corps d'une modale en colonnes (.atb-modal__body--columns,
   classe `atb-modal-cols` posée par le pont) > .atb-column. Écart par défaut 1.5rem, comme
   atb-modal.css. Ses exceptions y sont redites à une spécificité qui bat la formule
   commune : boîtes à largeur INTRINSÈQUE (centrée « auto », ancrée « auto ») = colonne à
   la largeur de son contenu, sans mini ; `column-shrink` = 1 1. */
.atb-modal-cols.atp-host {
    --atp-gap: var(--atb-column-gap, 1.5rem);
}

.atb-modal-cols.atp-host > .atb-column,
.lv-scene .atb-modal-cols.atp-host > .lv-item {
    --atp-w: var(--atb-column-weight-eff, 6);
    --atp-mw: var(--atb-column-min-width, 250px);
}

.atb-modal--anchor[data-atb-anchor-width="auto"] .atb-modal-cols.atp-host--flow > .atb-column,
.atb-modal--size-auto .atb-modal-cols.atp-host--flow > .atb-column {
    flex: var(--atb-column-weight-eff, 6) 1 auto;
    min-width: 0;
    max-width: 100%;
}

.atb-modal-cols.atp-host--flow > .atb-column.column-shrink {
    flex: 1 1;
}

/* --- Cible `faq` : .atb-faq-list > .atb-faq-item (aucune classe ajoutée). Les écarts
   restent ceux du CSS de la FAQ, qui dépendent de la variante et du rendu : entre les
   rangées `--atb-faq-gap` (règle `gap` de la liste), entre les colonnes `--atb-faq-col-gap`
   — le pont n'émet que ce qui est saisi. Mini vide = 0 (comme l'ancien gabarit). En
   Colonnes, la liste (une colonne flex) passe en lignes qui s'enroulent. */
/* Deux niveaux : la FAQ placée est la boîte mesurée par les points « conteneur ». */
.atb-faq.atb-faq--placed {
    container-type: inline-size;
}

.atb-faq .atb-faq-list.atp-host {
    --atp-gap: var(--atb-faq-col-gap);
    --atp-min: 0px;
    column-gap: var(--atb-faq-col-gap);
}

.atb-faq .atb-faq-list.atp-host--grid {
    display: grid;
}

.atb-faq .atb-faq-list.atp-host--flow {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
}

.atb-faq .atb-faq-list.atp-host > .atb-faq-item,
.lv-scene .lv-target-faq > .lv-item {
    --atb-faq-item-weight-eff: var(--atb-faq-item-weight, 12);
    --atp-w: var(--atb-faq-item-weight-eff, 12);
    --atp-mw: var(--atb-faq-item-min-width, 250px);
    box-sizing: border-box;
}

/* --- Cibles `list-flow`, `list-cards`, `list-simple` : rendus des listes à icônes et de
   cartes. La liste du rendu est l'hôte (`.atb-list__layout`), la boîte du bloc le conteneur
   mesuré (`.atb-list-box`, custom.css). Chaque famille garde SA variable d'écart (`--gap`,
   `--atb-column-gap`, `--atb-list-simple-gap`) : les thèmes la redéfinissent, le pont ne
   l'écrit sur la liste que si un écart est saisi. Mêmes défauts que custom.css. */
:is(.atb-points-fort, .atb-solutions-list).atp-host {
    --atp-gap: var(--gap, 1rem);
}

.atb-stats.atp-host {
    --atp-gap: var(--gap, 1.5rem);
}

.atb-card-lateral.atp-host {
    --atp-gap: var(--atb-column-gap, 1rem);
}

.atb-cards.atp-host {
    --atp-gap: var(--atb-column-gap, 1.5rem);
}

.atb-list-simple.atp-host {
    --atp-gap: var(--atb-list-simple-gap, var(--atb-space-6));
    column-gap: var(--atb-list-simple-gap, var(--atb-space-6));
}

:is(.atb-points-fort.atp-host > .atb-points-fort__item, .atb-solutions-list.atp-host > .atb-solutions-list__item, .atb-stats.atp-host > .atb-stats__item, .atb-card-lateral.atp-host > .atb-card-lateral__item, .atb-cards.atp-host > .atb-cards__item, .atb-list-simple.atp-host > .atb-list-simple__item),
.lv-scene :is(.lv-target-list-flow, .lv-target-list-cards, .lv-target-list-simple) > .lv-item {
    --atb-list-item-weight-eff: var(--atb-list-item-weight, 4);
    --atp-w: var(--atb-list-item-weight-eff, 4);
    --atp-mw: var(--atb-list-item-min-width, 250px);
    align-self: var(--atb-list-item-align, auto);
}

.atb-stats.atp-host > .atb-stats__item {
    --atp-mw: var(--atb-list-item-min-width, 160px);
}

.atb-cards.atp-host > .atb-cards__item {
    --atp-mw: var(--atb-list-item-min-width, var(--atb-column-min-width, 240px));
}

/* --- Cible `content-list` : Liste de contenus, rendus Grille / Liste. La liste est l'hôte
   (`.atb-list__layout`), la boîte du bloc le conteneur mesuré ; l'écart en variable
   `--atb-cl-gap` sur la boîte (CSS perso compris), mini vide = 0 comme l'ancienne grille.
   Liste générée : aucune déclaration en ligne sur les éléments, tout vient des règles par
   rang de la boîte (Placement_Bridge::rank_css). En Colonnes, la liste (une pile) passe
   en lignes qui s'enroulent. */
.atb-content-list.atp-host {
    --atp-gap: var(--atb-cl-gap, 1.5rem);
    --atp-min: 0px;
}

.atb-content-list.atp-host--flow {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
}

.atb-content-list.atp-host > .atp-item,
.lv-scene .lv-target-content-list > .lv-item {
    --atb-cl-item-weight-eff: var(--atb-cl-item-weight, 12);
    --atp-w: var(--atb-cl-item-weight-eff, 12);
    --atp-mw: var(--atb-cl-item-min-width, 0px);
    align-self: var(--atb-cl-item-align, auto);
    box-sizing: border-box;
}

/* --- Cible `bloc` : les blocs d'un conteneur (colonne, élément de groupe, élément flexible,
   slide), 25/09/2026. Posée par Blocs_Placement SEULEMENT quand le placement est réglé :
   disposition `.atb-blocs` (hôte) > cases `.atb-bloc-slot` (éléments) > bloc. Défauts = le
   rendu à plat : chaque bloc sur toute la largeur (poids 12, pas de mini), les rangées
   espacées du rythme des blocs (`--atb-blocs-gap-base`), écart des colonnes 1rem. La case
   est une pile flex : un bloc qui s'étire (`atb-image-fill`, `atb-h-full`) remplit sa case
   de grille. Le bloc dans sa case n'a plus de marge de série (`.atb-column > *` ne le vise
   pas) : l'écart des rangées la remplace. */
@property --atb-bloc-align { syntax: '*'; inherits: false; }

.atb-blocs.atp-host {
    --atp-gap: var(--atb-blocs-place-gap, 1rem);
    box-sizing: border-box;
    width: 100%;
    column-gap: var(--atp-gap);
    row-gap: var(--atb-blocs-gap-base, 1rem);
}

.atb-blocs.atp-host--flow {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}

.atb-blocs.atp-host > .atb-bloc-slot,
.lv-scene .lv-target-bloc > .lv-item {
    --atb-bloc-weight-eff: var(--atb-bloc-weight, 12);
    --atp-w: var(--atb-bloc-weight-eff, 12);
    --atp-mw: var(--atb-bloc-min-width, 0px);
    align-self: var(--atb-bloc-align, auto);
    box-sizing: border-box;
    min-width: 0;
}

/* Pas sur une case masquée : même spécificité que `.atp-host .atp-item.atp-item--hidden` (noyau,
   chargé avant), elle la battait — « Masqué » sans effet. */
.atb-blocs.atp-host > .atb-bloc-slot:not(.atp-item--hidden) {
    display: flex;
    flex-direction: column;
}

/* --- Flex (`flexbox`, étude .claude/etude-mode-flex) : formules dans le noyau. Les listes
   qui sont des piles (FAQ, liste de contenus) partent en rangée, comme en Colonnes ; un mini
   saisi bat le « pas de mini » d'une case de blocs (même spécificité, feuille chargée après). */
.atb-faq .atb-faq-list.atp-host--flexbox,
.atb-content-list.atp-host--flexbox {
    flex-direction: row;
    flex-wrap: wrap;
}

.atb-blocs.atp-host--flexbox > .atb-bloc-slot {
    min-width: var(--atp-fmin, auto);
}

/* --- Sections d'une page, lignes d'une section (Structure_Placement, étude
   .claude/etude-placement-structure). Hôtes : `.atb-sections` (enveloppe posée par le placement,
   qui ne contient que les sections) et `.atb-section` elle-même (déjà un flex en colonne centré,
   custom.css). Leurs défauts sont CE CSS (spécificité d'une classe : les utilitaires posés sur une
   section gardent la main) ; le pont n'émet que l'écart (descripteur `defaults` des cibles).
   Éléments : sections et lignes restent conteneurs de requêtes (points « conteneur » des colonnes,
   `@container atb-row`) ; une ligne garde la largeur de sa taille tant qu'aucun maxi n'est saisi. */
.atb-sections {
    display: flex;
    flex-direction: column;
    /* Sur une ligne (défaut de la cible, comme `.atb-section`) : un flex MULTILIGNE ne donne pas de
       largeur définie à ses éléments étirés quand il calcule leur hauteur — une section se
       mesurait « à la largeur de son contenu », quasi nulle (lignes conteneurs de requêtes). */
    flex-wrap: nowrap;
    align-items: stretch;
    row-gap: 0;
    column-gap: var(--atb-sections-gap, 0px);
}

:is(.atb-sections, .atb-section).atp-host--flow {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
}

.atb-sections.atp-host > .atb-section.atp-item {
    container-type: var(--atp-fct, inline-size);
}

/* Enfant de l'enveloppe (section, globale, landing imbriquée, rendu Divi) : hauteur mini 0, comme
   en flux normal. Élément flex, sa hauteur mini serait « au contenu » — et pour un conteneur de
   requêtes, ce contenu se mesure à largeur nulle : la section gonflait (en-tête 267 → 744 px).
   Spécificité nulle : un utilitaire (`atb-min-h-screen`…) garde la main. */
:where(.atb-sections > *, .atb-sections > .atb-cond-wrap > *) {
    min-height: 0;
}

.atb-section.atp-host > .atb-row.atp-item {
    container-type: inline-size;
}

.atb-section.atp-host--flexbox > .atb-row.atp-item {
    max-width: var(--atp-fmax, var(--atgf-max-w, var(--atb-row-maxw, 1150px))); /* placement > at_dimensions > taille */
}

/* Scène de l'éditeur : une ligne a la largeur d'une ligne (90 %), une section toute la largeur. */
.lv-scene .lv-target-section-rows > .lv-item {
    width: 90%;
}

/* Deux niveaux : le conteneur des blocs placés est la boîte mesurée (points « conteneur »).
   Colonne et élément de groupe le sont déjà ; élément flexible et slide le deviennent ici,
   seulement quand leurs blocs sont placés (aucun autre contenu ne change). */
/* Seulement si son placement a des points « conteneur » (classe posée par Blocs_Placement) : un conteneur de requêtes
   n'a plus de largeur de contenu, et tombait à 0 de large dans un parent en ligne (05/10/2026). */
.atb-item:has(> .atb-blocs.atb-blocs--cq),
.atb-slide:has(> .atb-blocs.atb-blocs--cq),
.atb-faq-answer:has(> .atb-blocs.atb-blocs--cq),
.atb-content-list__item:has(> .atb-blocs.atb-blocs--cq) {
    container-type: inline-size;
}

/* --- Aperçu de l'éditeur : socle des conteneurs et des éléments -----------------------
   (au front, custom.css le fournit ; ici seule la disposition compte, pas la peau).
   Spécificité minimale (`:where`) : les règles de placement l'emportent. */
.lv-scene :where(.atb-group, .atb-row, .atb-modal-cols) {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    margin: 0;
}

.lv-scene :where(.atb-group) {
    column-gap: var(--atb-group-gap, 0rem);
    row-gap: var(--atb-group-gap, 2rem);
    --atb-element-min-width: 250px;
}

.lv-scene :where(.atb-row) {
    column-gap: var(--atb-column-gap, 0rem);
    row-gap: var(--atb-columns-wrap-gap, 2rem);
    --atb-column-min-width: 250px;
}

.lv-scene :where(.atb-modal-cols) {
    column-gap: var(--atb-column-gap, 1.5rem);
    row-gap: var(--atb-columns-wrap-gap, 2rem);
    --atb-column-min-width: 250px;
}

.lv-scene :where(.atb-modal-cols > .lv-item) {
    --atb-column-weight-eff: var(--atb-column-weight, 6);
    align-self: var(--atb-column-align, auto);
    min-width: min(100%, var(--atb-column-min-width, 250px));
    max-width: 100%;
    box-sizing: border-box;
}

.lv-scene :where(.lv-target-faq) {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    --atb-faq-col-gap: 1rem;
    --atp-gap: var(--atb-faq-col-gap);
    --atp-min: 0px;
    column-gap: var(--atb-faq-col-gap);
    row-gap: 1rem;
}

.lv-scene :where(.lv-target-content-list) {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lv-scene .lv-target-content-list.atp-host {
    --atp-gap: var(--atb-cl-gap, 1.5rem);
    --atp-min: 0px;
    column-gap: var(--atb-cl-gap, 1.5rem);
    row-gap: var(--atb-cl-gap, 1.5rem);
}

.lv-scene :where(.lv-target-list-flow, .lv-target-list-cards, .lv-target-list-simple) {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Écart par défaut de la variante : posé en ligne par l'éditeur dans la variable de la cible. */
.lv-scene .lv-target-list-flow.atp-host {
    --atp-gap: var(--gap, 1rem);
    column-gap: var(--gap, 1rem);
    row-gap: var(--gap, 1rem);
}

.lv-scene .lv-target-list-cards.atp-host {
    --atp-gap: var(--atb-column-gap, 1.5rem);
    column-gap: var(--atb-column-gap, 1.5rem);
    row-gap: var(--atb-column-gap, 1.5rem);
}

.lv-scene .lv-target-list-simple.atp-host {
    --atp-gap: var(--atb-list-simple-gap, 1.5rem);
    column-gap: var(--atb-list-simple-gap, 1.5rem);
    row-gap: 1rem;
}

.lv-scene :where(.atb-group > .atb-element) {
    --atb-element-weight-eff: var(--atb-element-weight, 6);
    align-self: var(--atb-element-align, auto);
    min-width: min(100%, var(--atb-element-min-width, 250px));
    max-width: 100%;
    box-sizing: border-box;
}

.lv-scene :where(.atb-row > .atb-column) {
    --atb-column-weight-eff: var(--atb-column-weight, 6);
    align-self: var(--atb-column-align, auto);
    min-width: min(100%, var(--atb-column-min-width, 250px));
    max-width: 100%;
    box-sizing: border-box;
}

.lv-scene :where(.lv-target-bloc) {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
}

.lv-scene .lv-target-bloc.atp-host {
    --atp-gap: var(--atb-blocs-place-gap, 1rem);
    column-gap: var(--atb-blocs-place-gap, 1rem);
    row-gap: 1rem;
}