/* F.A.Q. em duas colunas: ímpares à esquerda, pares à direita (01 | 02, 03 | 04 …).
   Em ecrã estreito as colunas empilham-se e a leitura ficava 1, 3, 5 … 2, 4, 6.
   Aqui as colunas deixam de ser caixas (display: contents) e cada pergunta
   ganha o seu lugar pela ordem: esquerda k -> 2k-1, direita k -> 2k.
   Serve as 352 páginas com .faq-area .row > .col-md-6 > .panel-group (19/09/2026).
   Sem :has() — o Chrome não recalcula os netos quando o :has() passa a valer.
   Ficheiro: static/css/faq-ordem.css — igual nas 4 marcas. */
@media (max-width: 991px) {
  .faq-area .row { display: flex; flex-direction: column; row-gap: 30px; }
  .faq-area .row::before, .faq-area .row::after { display: none; }
  .faq-area .row > .col-md-6, .faq-area .row > .col-md-6 > .panel-group { display: contents; }
  /* o tema separa com «.panel + .panel { margin-top: 30px }», que só vê irmãos da
     mesma coluna — o 02 ficava colado ao 01. O espaço passa a ser o row-gap. */
  .faq-area .row > .col-md-6 > .panel-group > .panel.panel-default { margin-top: 0; }
  /* sem a caixa da coluna perde-se o padding de 15px que anulava a margem negativa da .row */
  .faq-area .row > .col-md-6 > .panel-group > .panel { margin-left: 15px; margin-right: 15px; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(1) { order: 1; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(1) { order: 2; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(2) { order: 3; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(2) { order: 4; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(3) { order: 5; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(3) { order: 6; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(4) { order: 7; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(4) { order: 8; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(5) { order: 9; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(5) { order: 10; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(6) { order: 11; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(6) { order: 12; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(7) { order: 13; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(7) { order: 14; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(8) { order: 15; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(8) { order: 16; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(9) { order: 17; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(9) { order: 18; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(10) { order: 19; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(10) { order: 20; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(11) { order: 21; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(11) { order: 22; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(12) { order: 23; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(12) { order: 24; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(13) { order: 25; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(13) { order: 26; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(14) { order: 27; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(14) { order: 28; }
  .faq-area .row > .col-md-6:not(.col-md-6 ~ .col-md-6) > .panel-group > .panel:nth-child(15) { order: 29; }
  .faq-area .row > .col-md-6 ~ .col-md-6 > .panel-group > .panel:nth-child(15) { order: 30; }
}

/* PERGUNTA E RESPOSTA COM PESOS DIFERENTES (dono, 19/09/2026: «o peso da
   fonte da pergunta não deve ser o mesmo que a resposta»). O tema dava 500 à
   pergunta e 400 à resposta, na mesma cor: lia-se tudo como um bloco. Agora a
   pergunta fica no peso do tema (500) e a resposta desce a 300, num
   cinzento-carvão mais leve (dono: «a pergunta deve voltar no peso inicial»).
   Serve os três desenhos de F.A.Q. do site: o acordeão .faq-area (as páginas
   de produto), o .cs-faq (criador de sites) e o .ab-faq (denunciar abuso).
   !important porque o tema pinta a resposta por id (#accordion1 … p). */
.faq-area .panel-body, .faq-area .panel-body p,
#main .cs-faq details > div, #main .cs-faq details > div p, .ab-faq .ab-faq-r p { font-weight: 300 !important; color: #4a5566 !important; }
/* a ligação dentro da resposta sobe ao peso da pergunta (dono, 19/09/2026:
   «se for link deve aumentar o peso») — a 300 perdia-se no texto */
.faq-area .panel-body a, #main .cs-faq details > div a, .ab-faq .ab-faq-r a { font-weight: 500 !important; }
