/* Alinhamentos — ronda 20 (10/10/2026), spec SPEC-20261009-ronda20-alinhamentos-telemovel. Só aspecto: nenhum texto, preço
   ou foto muda, e nenhum ficheiro do tema é mexido. Carregado pelo evento do rodapé (formularios.php::rodape).
   Os cartões das peças (usados/fim de stock) estão em usados.php e o botão dos cartões de produtos em em-cartoes.css. */

/* §1 Cartões dos serviços (módulos 798 e 797 da página inicial): as fotos de cada par tinham alturas diferentes (cada imagem
   com a sua proporção) e o texto por baixo começava a alturas diferentes. Agora: a mesma proporção, a foto recortada ao centro
   (object-fit) e a ligação da foto sem crescer — o texto começa logo a seguir, à mesma altura nos dois cartões do par.
   Telemóvel e tablet: 4:5 nos quatro. Computador (o mosaico): 3:4 no par alto da esquerda e 1:1 no par de baixo da direita,
   próximas das de antes, para o mosaico não mudar de forma. «Cozinhas por Medida» (sozinho na sua fila) fica como está. */
.module-banners-798 .module-item > a,
.module-banners-797 .module-item-4 > a,
.module-banners-797 .module-item-6 > a { flex: 0 0 auto; }
.module-banners-798 .module-item > a > img,
.module-banners-797 .module-item-4 > a > img,
.module-banners-797 .module-item-6 > a > img { display: block; width: 100%; height: auto; object-fit: cover; aspect-ratio: 4 / 5; }
@media (min-width: 1024px) {
  .module-banners-798 .module-item > a > img { aspect-ratio: 3 / 4; }
  .module-banners-797 .module-item-4 > a > img,
  .module-banners-797 .module-item-6 > a > img { aspect-ratio: 1 / 1; }
}

/* §4 Rodapé — «Visto recentemente»: o texto das peças usadas (as que mostram preço) ficava a 14 px da foto e o dos outros
   produtos a 20 px (a margem de 12 px do em-cartoes.css só os apanhava a eles). Agora 20 px em todos. */
/* (com .product-layout à frente: a regra do módulo, .module-side_products-1113 .side-product .caption, tem mais força do que só
   html body .side-product > .caption e punha 6 px nas usadas) */
html body .product-layout .side-product > .caption { padding-left: 12px; }

/* §4 Rodapé — meios de pagamento: no telemóvel o MB WAY caía sozinho para a linha de baixo (5 + 1). Fica 3 + 3. */
@media (max-width: 575px) {
  .icons-menu-228 > ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-items: center; row-gap: 10px; }
}

/* Botão «voltar ao topo» do tema (decisão do Nelson, 10/10): no telemóvel, nas páginas sem a barra «Pedir Orçamento», ficava
   EM CIMA do WhatsApp; na ficha ficava a meio do ecrã, por cima do texto. Passa a ficar sempre logo acima do WhatsApp, a 12 px.
   O tema posiciona-o com bottom:0 + margem de baixo + uma translação igual à que sobe o WhatsApp acima do menu de baixo do tema
   (por isso, sem barra, basta a margem); com a barra fixa (html.em-com-barra, ver em-ficha.css B6) e acima de 640 px, a
   translação não acompanha o WhatsApp e sai. WhatsApp: 54 px a 16 px do fundo até 640 px; 58 px a 22 px acima disso. */
@media (max-width: 640px) {
  html body .scroll-top { margin-bottom: calc(16px + 54px + 12px) !important; }
  html.em-com-barra body .scroll-top { transform: none !important; margin-bottom: 0 !important; bottom: calc(var(--em-barra, 64px) + 14px + 54px + 12px) !important; }
}
@media (min-width: 641px) {
  html body .scroll-top { transform: none !important; margin-bottom: calc(22px + 58px + 12px) !important; }
}
@media (min-width: 641px) and (max-width: 767px) {
  html.em-com-barra body .scroll-top { margin-bottom: 0 !important; bottom: calc(var(--em-barra, 64px) + 14px + 58px + 12px) !important; }
}