/* Xenaos : pages métier /automobile/ et /immobilier/ (27/10/2026)
   Complète accueil.css (système .h5). Tout est préfixé .h5 .vt- */

/* Hero métier : sous-métiers sous le bouton */
.h5 .vt-subs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.h5 .vt-subs a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--ink);font:500 .95rem var(--f-b);text-decoration:none;transition:border-color .2s,transform .2s}
.h5 .vt-subs a:hover{border-color:var(--or-200);transform:translateY(-1px)}
.h5 .vt-subs svg{color:var(--or)}

/* Grille de cartes en 3 colonnes (problèmes, rôles, direction) */
.h5 .vt-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.h5 .vt-card{background:#fff;border-radius:24px;padding:28px;display:grid;gap:12px;align-content:start;border:1px solid var(--line)}
.h5 .h5-soft .vt-card{border-color:transparent}
.h5 .vt-card .h5-gi{width:52px;height:52px;border-radius:16px;background:var(--or-50);color:var(--or);display:grid;place-items:center}
.h5 .vt-card small{font:700 .72rem/1 var(--f-d);letter-spacing:.16em;text-transform:uppercase;color:var(--or)}
.h5 .vt-card h3{font-size:1.2rem}
.h5 .vt-card p{font-size:.98rem;margin:0}

/* Vécu : avant / avec Sophia */
.h5 .vt-origin{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
.h5 .vt-origin .h5-head{text-align:left;justify-items:start;margin:0}
.h5 .vt-sign{font-size:.95rem;color:var(--muted);border-left:3px solid var(--or);padding-left:14px;margin:6px 0 0}
.h5 .vt-lived{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.h5 .vt-lived li{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px 22px;display:grid;gap:6px}
.h5 .vt-lived .was{margin:0;color:var(--muted);font-size:.98rem;text-decoration:line-through;text-decoration-color:rgba(138,139,146,.45)}
.h5 .vt-lived .now{margin:0;color:var(--ink);font-weight:500;display:flex;gap:10px;align-items:flex-start}
.h5 .vt-lived .now svg{flex:none;color:var(--or);margin-top:4px}

/* Onglets métiers */
.h5 .vt-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 auto 34px;padding:6px;background:var(--soft);border-radius:999px;width:max-content;max-width:100%}
.h5 .h5-soft .vt-tabs{background:#fff}
.h5 .vt-tab{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;padding:12px 20px;border-radius:999px;font:600 1rem var(--f-d);color:var(--text);cursor:pointer;transition:background .2s,color .2s}
.h5 .vt-tab svg{color:var(--or)}
.h5 .vt-tab[aria-selected="true"]{background:var(--ink);color:#fff}
.h5 .vt-tab[aria-selected="true"] svg{color:#FFB48F}
.h5 .vt-panel{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:start}
.h5 .vt-panel[hidden]{display:none}
.h5 .vt-panel h3{font-size:1.6rem;margin-bottom:6px}
.h5 .vt-panel .vt-intro{margin:0 0 20px;color:var(--text)}
.h5 .vt-lbl{display:block;font:700 .72rem/1 var(--f-d);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:22px 0 12px}
.h5 .vt-chips{display:flex;flex-wrap:wrap;gap:8px}
.h5 .vt-chips span{padding:8px 14px;border-radius:999px;background:var(--soft);font:500 .9rem var(--f-b);color:var(--ink)}
.h5 .h5-soft .vt-chips span{background:#fff}
.h5 .vt-reflex{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.h5 .vt-reflex li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}
.h5 .vt-reflex li>span{width:28px;height:28px;border-radius:9px;background:var(--or-50);color:var(--or);display:grid;place-items:center;font:700 .85rem var(--f-d)}
.h5 .vt-reflex b{display:block;color:var(--ink);font:600 1.05rem/1.35 var(--f-d);margin-bottom:2px}
.h5 .vt-reflex p{margin:0;font-size:.98rem}
.h5 .vt-opp{margin-top:24px;padding:18px 20px;border-radius:18px;background:var(--ink);color:#D9D7D1;font-size:.98rem}
.h5 .vt-opp b{display:block;color:#FFB48F;font:700 .72rem/1 var(--f-d);letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}

/* Extrait d'appel */
.h5 .vt-dlg{background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--shadow)}
.h5 .h5-soft .vt-dlg{border-color:transparent}
.h5 .vt-dlg-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.h5 .vt-dlg-h span{font:600 .9rem var(--f-d);color:var(--ink);display:flex;align-items:center;gap:8px}
.h5 .vt-dlg-h span i{width:8px;height:8px;border-radius:50%;background:var(--or)}
.h5 .vt-dlg-h small{color:var(--muted);font-size:.8rem}
.h5 .vt-msgs{display:grid;gap:10px}
.h5 .vt-msg{max-width:88%;padding:11px 15px;border-radius:16px;font-size:.93rem;line-height:1.5}
.h5 .vt-msg.s{background:var(--soft);color:var(--ink);border-top-left-radius:6px}
.h5 .vt-msg.c{background:var(--or-50);color:var(--ink);margin-left:auto;border-top-right-radius:6px}
.h5 .vt-msg b{display:block;font:700 .68rem/1 var(--f-d);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.h5 .vt-msg.c b{color:var(--or-d)}
.h5 .vt-play{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:#fff;width:100%;cursor:pointer;font:500 .92rem var(--f-b);color:var(--ink);text-align:left}
.h5 .vt-play i{width:38px;height:38px;border-radius:50%;background:var(--or);color:#fff;display:grid;place-items:center;flex:none}
.h5 .vt-play small{display:block;color:var(--muted);font-size:.8rem}
.h5 .vt-play .vt-bar{flex:1;height:4px;border-radius:4px;background:var(--line);overflow:hidden;min-width:40px}
.h5 .vt-play .vt-bar em{display:block;height:100%;width:0;background:var(--or)}
.h5 .vt-dlg-note{margin:12px 0 0;color:var(--muted);font-size:.8rem}

/* Une année */
.h5 .vt-year{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:y}
.h5 .vt-year li{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px 24px 22px}
.h5 .h5-soft .vt-year li{border-color:transparent}
.h5 .vt-year b{display:block;font:700 .8rem/1 var(--f-d);letter-spacing:.12em;text-transform:uppercase;color:var(--or);margin-bottom:10px}
.h5 .vt-year h3{font-size:1.12rem;margin-bottom:6px}
.h5 .vt-year p{margin:0;font-size:.96rem}

/* Mise en place */
.h5 .vt-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.h5 .vt-steps li{display:grid;gap:10px;align-content:start}
.h5 .vt-steps li>i{font:800 1rem var(--f-d);font-style:normal;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center}
.h5 .vt-steps h3{font-size:1.12rem}
.h5 .vt-steps p{margin:0;font-size:.96rem}
.h5 .vt-assure{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;margin-top:40px;padding:18px 24px;border-radius:18px;background:var(--soft);font-size:.95rem;color:var(--text)}
.h5 .vt-assure span{display:inline-flex;gap:8px;align-items:center}
.h5 .vt-assure svg{color:var(--or)}

@media (max-width:1000px){
  .h5 .vt-grid3,.h5 .vt-year{grid-template-columns:1fr 1fr}
  .h5 .vt-steps{grid-template-columns:1fr 1fr}
  .h5 .vt-origin,.h5 .vt-panel{grid-template-columns:1fr;gap:28px}
}
@media (max-width:620px){
  .h5 .vt-grid3,.h5 .vt-year,.h5 .vt-steps{grid-template-columns:1fr}
  .h5 .vt-tabs{width:100%;border-radius:18px;justify-content:stretch}
  .h5 .vt-tab{flex:1 1 auto;justify-content:center;padding:11px 12px;font-size:.92rem}
  .h5 .vt-msg{max-width:94%}
}