/* Ai4HER — styles propres au test « Quel est votre profil IA ? ».
   Feuille séparée de ai4her.css (servie immutable un an) : on n'y touche
   pas pour éviter de bumper ?v= dans toutes les pages. Les jetons viennent
   de ai4her.css. Téléphone d'abord : le test s'ouvre depuis WhatsApp. */

.profil-hero p.meta-line { margin-top: 18px; font-size: 14px; color: #c9c2d6; }
.profil-hero .btn-row { margin-top: 24px; }

#profil-app { padding-top: 40px; padding-bottom: 56px; }
#profil-app [hidden] { display: none !important; }
.panel { max-width: 720px; margin: 0 auto; }

/* Questions */
.progress { height: 6px; background: var(--line); border-radius: 999px; overflow: hidden; margin: 16px 0 28px; }
.progress__bar { height: 100%; width: 0; background: var(--indigo); transition: width .3s ease; }
.q-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.q-head .meta { white-space: nowrap; }
.q-text { font-family: var(--serif); font-size: 26px; line-height: 1.25; margin: 10px 0 22px; }
@media (min-width: 760px) { .q-text { font-size: 32px; } }
.answers { display: grid; gap: 10px; }
.answer {
  text-align: left; font: inherit; font-size: 17px; line-height: 1.4;
  padding: 14px 16px; border: 1.5px solid var(--line); border-radius: var(--radius);
  background: #fff; color: var(--text); cursor: pointer; transition: border-color .15s, background .15s;
}
.answer:hover, .answer:focus-visible { border-color: var(--indigo); outline: none; background: #f6f4ff; }
.answer.is-picked { border-color: var(--indigo); background: #efedff; }
.q-foot { margin-top: 22px; display: flex; justify-content: space-between; align-items: center; }
.q-foot .meta { max-width: 60%; }

/* Résultat */
.result-head h2 { font-family: var(--serif); font-size: 40px; line-height: 1.05; margin: 6px 0 14px; }
@media (min-width: 760px) { .result-head h2 { font-size: 56px; } }
.result-head p { font-size: 18px; line-height: 1.5; }
.force { border-left: 4px solid var(--green); padding: 10px 16px; margin: 20px 0; background: var(--paper-2); font-size: 17px; }
.force b { display: block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--green-t); margin-bottom: 4px; }
.garde { font-size: 15px; color: var(--muted); border-left: 4px solid var(--purple); padding: 10px 16px; background: var(--paper-2); }

.gauges { display: grid; gap: 14px; margin: 28px 0 10px; }
.gauge { display: grid; grid-template-columns: 120px 1fr 48px; align-items: center; gap: 12px; font-size: 15px; }
.gauge__track { height: 10px; background: var(--line); border-radius: 999px; overflow: hidden; }
.gauge__fill { height: 100%; width: 0; background: var(--indigo); transition: width .5s ease; }
.gauge.is-fort .gauge__fill { background: var(--green); }
.gauge.is-pas .gauge__fill { background: var(--pink); }
.gauge__val { text-align: right; font-variant-numeric: tabular-nums; color: var(--muted); }

.lecture { display: grid; gap: 16px; margin: 22px 0 30px; }
@media (min-width: 640px) { .lecture { grid-template-columns: 1fr 1fr; } }
.lecture > div { border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; }
.lecture b { display: block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; }
.lecture .fort b { color: var(--green-t); }
.lecture .pas b { color: var(--pink-t); }
.lecture .dim { font-family: var(--serif); font-size: 20px; margin-bottom: 6px; }
.lecture p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.5; }

.pas-list { padding-left: 22px; margin: 10px 0 8px; display: grid; gap: 10px; font-size: 17px; line-height: 1.45; }
.ebook-line { font-size: 15px; color: var(--muted); margin: 0 0 30px; }

.share { border-top: 1px solid var(--line); padding-top: 24px; margin-top: 8px; }
.share h3, .group h3 { font-family: var(--serif); font-size: 24px; margin: 0 0 6px; }
.share p, .group p { color: var(--muted); margin: 0 0 14px; font-size: 15px; }
.btn--wa { background: #25d366; color: var(--ink); }
.btn--wa:hover { background: #1fbf5b; }
.btn--li { background: #0a66c2; color: #fff; }
.btn--li:hover { background: #0957a8; }
.group { margin-top: 32px; background: var(--ink); color: #fff; padding: 24px; border-radius: var(--radius); }
.group p { color: #c9c2d6; }
.group .soon { color: #c9c2d6; font-weight: 600; margin: 0; }
.again { margin-top: 28px; font-size: 14px; }
.again button { font: inherit; background: none; border: 0; color: var(--indigo-t); text-decoration: underline; cursor: pointer; padding: 0; }

/* Inscription facultative (bloc groupe, fond encre) */
.inscription { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--ink-line); }
.inscription input:not([type="checkbox"]) { border-color: var(--ink-line); background: var(--ink-2); color: #fff; }
.inscription .consent { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; color: #c9c2d6; margin: 0; }
.inscription .consent input { width: auto; margin-top: 3px; }
.inscription .hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.inscription__msg { margin: 0; font-weight: 600; min-height: 1em; }
.inscription__msg.is-ok { color: #9fe0b8; }
.inscription__msg.is-err { color: #ffb3c7; }