/* QTouch — téléphone (html.qt-ph) : captures par étape, cartes chiffrées des héros, décorations des héros. Bureau inchangé. */

/* ---------- visites guidées : une capture sous chaque étape ---------- */
/* masquée dès le premier rendu (avant, elle n'était cachée qu'une fois stp9.js passé : la maquette bureau apparaissait puis disparaissait) */
.qt-ph .a7-tour .a7-in > .a7-frame{display:none!important}
.qt-ph .a7-tour.stp9 .a7-steps li{cursor:default;padding-bottom:22px}
.qt-ph .a7-tour.stp9 .a7-steps li::before{background:#F97316!important;border-color:#F97316!important;color:#fff!important}
.qt-ph .a7-tour.stp9 .a7-steps li{border-left-color:#F8C9A8!important}
.qt-ph .a7-tour.stp9 .a7-steps li > b{color:#1D1B26!important}
.qt-ph .a7-tour.stp9 .a7-steps li > p{max-height:none!important;opacity:1!important;margin-top:6px!important}
.qt-ph .a7-tour.stp9 .stp9-shot{display:block!important;position:relative;margin:16px 0 4px -30px;width:calc(100% + 30px);transform:none!important;border-radius:14px;box-shadow:0 22px 44px -22px rgba(30,20,60,.35),0 0 0 1px rgba(30,20,60,.07);overflow:hidden;background:#fff}
.qt-ph .a7-tour.stp9 .stp9-shot .a7-bar{padding:8px 10px;gap:5px}
.qt-ph .a7-tour.stp9 .stp9-shot .a7-bar i{width:8px;height:8px}
.qt-ph .a7-tour.stp9 .stp9-shot .a7-bar span{font-size:10.5px;padding:4px 10px}
.qt-ph .a7-tour.stp9 .stp9-shot .a7-scr > img,.qt-ph .a7-tour.stp9 .stp9-shot .a7-scr > .a7-ld,.qt-ph .a7-tour.stp9 .stp9-shot .lp.on{opacity:1!important;transform:none!important;transition:none!important}
.qt-ph .a7-tour.stp9 .a7-go{margin-top:8px}

/* ---------- cartes chiffrées sous les titres des héros : compactes, 2 par ligne + 1 centrée ---------- */
.qt-ph .hx-chips{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;width:100%;max-width:360px;margin:26px auto 0!important;box-sizing:border-box}
.qt-ph .hx-chip{min-width:0;gap:8px!important;padding:8px 10px 8px 8px!important;border-radius:14px!important;transform:none!important;margin:0!important;box-sizing:border-box}
.qt-ph .hx-chip:nth-child(3):last-child{grid-column:1 / -1;justify-self:center;width:calc(50% - 4px)}
.qt-ph .hx-chip i{width:30px!important;height:30px!important;border-radius:9px!important;flex:none}
.qt-ph .hx-chip i .qm{width:18px!important;height:18px!important}
.qt-ph .hx-chip > div{min-width:0}
.qt-ph .hx-chip b{font-size:14.5px!important;line-height:1.15!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qt-ph .hx-chip small{font-size:10.5px!important;line-height:1.25!important;margin-top:1px!important}
@media(min-width:420px){.qt-ph .hx-chip b{font-size:15.5px!important}.qt-ph .hx-chip small{font-size:11px!important}}

/* ---------- héros : texte toujours au-dessus des décorations, route discrète derrière ---------- */
.qt-ph .st6 .st6-head{position:relative;z-index:3}
.qt-ph .st6 .st6-head p,.qt-ph .st6 .st6-head .st6-p{text-shadow:0 0 6px #fff,0 0 14px #fff,0 0 22px rgba(255,255,255,.9)}
.qt-ph .st6 .st6-sky{z-index:1}
.qt-ph .st6 .st6-s{opacity:.7}
/* licences : la capture prend la hauteur de son contenu (pas de grand vide sous le panneau) */
.qt-ph .lt7.stp9 .stp9-shot .lt-scr{aspect-ratio:auto!important;height:auto!important;min-height:0}
.qt-ph .lt7.stp9 .stp9-shot .lt-scr .lp.on{position:relative!important;inset:auto!important;height:auto!important}
.qt-ph .lt7.stp9 .stp9-shot .lt-scr .lp.on .lpfw{height:auto}
.qt-ph .lt7.stp9 .stp9-shot .p4{grid-template-rows:auto auto!important}
.qt-ph .lt7.stp9 .stp9-shot .p4 .ok{min-height:auto!important;height:auto!important}
.qt-ph .lt7.stp9 .stp9-shot .p4 .ad{aspect-ratio:16/10;min-height:0}
.qt-ph .lt7.stp9 .stp9-shot .p4 .pay{display:flex!important;padding:12px 14px}
.qt-ph .lt7.stp9 .stp9-shot .p4 .pay small{font-size:11px}
.qt-ph .lt7.stp9 .stp9-shot .p4 .pay b{font-size:24px}
.qt-ph .lt7.stp9 .stp9-shot .p4 .pay span{font-size:10.5px}
.qt-ph .lt7.stp9 .stp9-shot .p4 .br{min-height:34px;margin:8px 0}
/* route du héros : discrète tant qu'elle passe derrière le titre et le texte, pleine ensuite */
.qt-ph .st6 .st6-rib{-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.28) 0,rgba(0,0,0,.28) 620px,#000 860px);mask-image:linear-gradient(to bottom,rgba(0,0,0,.28) 0,rgba(0,0,0,.28) 620px,#000 860px)}

/* décorations des héros : masquées tant que stp9.js n'a pas vérifié qu'elles ne touchent aucun texte (évite le flash à chaque changement d'onglet) */
.qt-ph .st6 .st6-sky .st6-s{visibility:hidden}
/* tête de la route (prise / licence) : sur téléphone elle n'est jamais visible (route déjà tracée) ; avant le 1er calcul elle s'affichait en haut à gauche */
.qt-ph .st6-hd{opacity:0!important}