/* Compléments auto : la charte et le parcours restent ceux des autres questionnaires. */
.q_auto_marques { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; max-height: 350px; overflow-y: auto; padding: 4px; border: 0; min-width: 0; scrollbar-gutter: stable; }
.q_auto_marque { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-width: 0; min-height: 100px; padding: 12px 6px; border: 1px solid var(--q_ligne); border-radius: 10px; background: #fff; cursor: pointer; }
.q_auto_marque:hover { border-color: #6077aa; background: #f8faff; }
.q_auto_marque:has(input:checked) { border-color: var(--q_bleu); background: #f0f4fc; box-shadow: inset 0 0 0 1px var(--q_bleu); }
.q_auto_marque:has(input:focus-visible) { outline: 2px solid var(--q_bleu); outline-offset: 2px; }
.q_auto_marque input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.q_auto_marque img { width: 76px; max-width: 100%; height: 46px; object-fit: contain; }
.q_auto_marque .q_logo_dark { background: var(--q_encre); padding: 5px; border-radius: 4px; }
.q_auto_marque span { font-size: 11px; line-height: 1.5; text-align: center; overflow-wrap: anywhere; }
.q_auto_compteur { margin: 13px 0 !important; font-size: 11px; color: var(--q_texte); }
.q_auto_autre { display: flex; align-items: center; gap: 10px; margin: 18px 0; padding: 16px; border: 1px solid var(--q_ligne); border-radius: 10px; cursor: pointer; font-size: 12px; }
.q_auto_autre:has(input:checked) { border-color: var(--q_bleu); background: #f0f4fc; }
.q_auto_autre input { accent-color: var(--q_bleu); }
.q_auto_selection { display: flex; align-items: center; gap: 12px; padding: 12px 15px; margin-bottom: 20px !important; border-radius: 9px; background: #f0f4fc; font-weight: 500; }
.questionnaire_auto_page .q_sous_question + .q_champ { margin-top: 18px; }
.questionnaire_auto_page .q_conseil > img { width: 100%; height: 250px; object-fit: cover; }
@media (max-width: 1000px) { .q_auto_marques { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 700px) { .q_auto_marques { grid-template-columns: repeat(3, minmax(0, 1fr)); max-height: 330px; gap: 8px; } }
@media (max-width: 359px) { .q_auto_marques { grid-template-columns: repeat(2, minmax(0, 1fr)); } }