/* Pillar page and decision guides per axis (pilot sites only, inc-pilote-pilier.php). Theme tokens from app.css. */

.qp{padding-bottom:40px}
.qp .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
@media(max-width:600px){.qp .wrap{padding:0 16px}}
.qp-tete{padding:26px 0 10px}
.qp-tete .breadcrumb{font-size:13px;color:var(--ink-mute);margin-bottom:18px}
.qp-surtitre,.qp-label,.qp-etape-sur,.qp-besoin-lib{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--forest-2);margin:0 0 8px}
.qp-tete h1{font-size:clamp(30px,5vw,46px);line-height:1.1;letter-spacing:-.02em;margin:0 0 14px}
.qp-chapeau{font-size:18px;color:var(--ink-soft);max-width:62ch;margin:0 0 12px;line-height:1.55}
.qp-signature{font-size:13.5px;color:var(--ink-mute);margin:0 0 20px}
.qp-signature a{color:var(--ink);font-weight:600}

/* Key figures: as many cells as there are figures, never a fixed count. */
.qp-chiffres{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0 0 20px;padding:0}
.qp-chiffres>div{background:var(--paper);border:1px solid var(--line);border-radius:calc(14px*var(--rk,1));padding:14px 16px;display:flex;flex-direction:column-reverse;gap:2px}
.qp-chiffres dt{font-size:13px;color:var(--ink-mute);margin:0}
.qp-chiffres dd{margin:0;font-family:var(--serif);font-size:26px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}

.qp-sommaire{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.qp-sommaire a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-size:13.5px;color:var(--ink-soft)}
.qp-sommaire a:hover{border-color:var(--forest-2);color:var(--ink)}
.qp-num{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;border-radius:999px;background:var(--forest);color:#fff;font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;padding:0 6px}
.qp-n{font-size:12.5px;color:var(--ink-mute);font-variant-numeric:tabular-nums}

.qp-bloc{padding:30px 0}
.qp-bloc h2{margin:0 0 16px}
.qp-bloc .sec-head{margin-bottom:18px}

/* Steps: compact cards, top aligned (a card never stretches to its neighbour's height). */
.qp-etapes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.qp-etape{align-self:start;background:var(--paper);border:1px solid var(--line);border-radius:calc(18px*var(--rk,1));padding:22px;scroll-margin-top:90px}
.qp-etape-sur{display:flex;align-items:center;gap:8px}
.qp-etape h3{font-size:20px;line-height:1.25;margin:4px 0 8px}
.qp-etape h3 a{color:var(--ink)}
.qp-etape-texte{color:var(--ink-soft);font-size:15px;margin:0 0 14px;line-height:1.55}
.qp-phares{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.qp-phares a{display:inline-flex;gap:6px;align-items:center;padding:6px 10px;border-radius:10px;background:var(--cream);border:1px solid var(--line);font-size:13.5px;color:var(--ink)}
.qp-phares a:hover{border-color:var(--forest-2)}
.qp-compte{display:block;margin-top:6px;font-size:12.5px;color:var(--ink-mute)}

/* Best for each need. */
.qp-besoins{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.qp-besoin{align-self:start;background:var(--paper);border:1px solid var(--line);border-radius:calc(16px*var(--rk,1));padding:18px}
.qp-besoin h3{font-size:17px;line-height:1.3;margin:0 0 6px}
.qp-besoin h3 a{color:var(--ink)}
.qp-besoin-note{font-size:13.5px;color:var(--ink-mute);margin:0 0 10px}
.qp-besoin-note strong{color:var(--forest);font-variant-numeric:tabular-nums}

/* Every analysed brand: the grid holds 6, 15 or 30 brands alike. */
.qp-marques{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.qp-marques li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;background:var(--paper);border:1px solid var(--line);border-radius:12px;font-size:14.5px}
.qp-marques a{color:var(--ink);font-weight:600}

.qp-lecture{max-width:760px}
.qp-faq{border-bottom:1px solid var(--line);padding:12px 0}
.qp-faq summary{cursor:pointer;font-weight:600;color:var(--ink)}
.qp-faq p{margin:8px 0 0;color:var(--ink-soft);line-height:1.6}

.qp-autres{display:flex;flex-wrap:wrap;gap:8px}
.qp-autres a{padding:9px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);font-size:14px;color:var(--ink)}
.qp-autres a.qp-autres-pilier{border-color:var(--forest-2);font-weight:600}

/* Guide: options table and option cards. */
.qp-table td:nth-child(2),.qp-table td:nth-child(3),.qp-table td:nth-child(4){font-variant-numeric:tabular-nums;white-space:nowrap}
.qp-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.qp-option{align-self:start;background:var(--paper);border:1px solid var(--line);border-radius:calc(18px*var(--rk,1));padding:22px;scroll-margin-top:90px}
.qp-option h3{font-size:20px;margin:0 0 8px}
.qp-option h3 a{color:var(--ink)}
.qp-option-chiffres{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13.5px;color:var(--ink-mute);margin:0 0 10px}
.qp-option-chiffres strong{color:var(--ink);font-variant-numeric:tabular-nums}
.qp-option-texte{color:var(--ink-soft);font-size:15px;margin:0 0 12px}
.qp-repere{margin:0 0 12px}
.qp-repere>div{margin:0 0 8px}
.qp-repere dt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--forest-2)}
.qp-repere dd{margin:2px 0 0;color:var(--ink-soft);font-size:15px}
.qp-top{margin:0 0 12px;padding-left:20px;font-size:14.5px}
.qp-top li{margin:3px 0}
.qp-aussi{font-size:13.5px;color:var(--ink-mute);margin:0 0 10px}

/* Home block (front-page.php, one line added by the controller). */
.qp-accueil{padding:34px 0}
.qp-accueil-etapes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.qp-accueil-etapes a{display:flex;flex-direction:column;gap:6px;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:calc(14px*var(--rk,1));color:var(--ink);height:100%}
.qp-accueil-etapes a:hover{border-color:var(--forest-2)}
.qp-accueil-t{font-weight:600}
.qp-accueil-n{font-size:13px;color:var(--ink-mute)}

/* audit3-fixes (01/10/2026): "Lire le guide : quel type de navigation choisir pour votre robot
 * tondeuse ?" is a sentence, not a short "Voir tout" link: app.css's .link-more (nowrap) made the
 * pillar 573 px wide on a 390 px phone (and 1 458 px on a computer). On the pillar and the guides
 * the link wraps like text, and no grid or flex child may grow past its column. */
.qp .link-more{white-space:normal;max-width:100%;overflow-wrap:anywhere;display:inline;line-height:1.45}
.qp .qp-etape,.qp .qp-besoin,.qp .sec-head>div{min-width:0}