/* ============================================================ Catálogo de escovas limpa-vidros por marca e modelo (/escovas/... — servido pelo escovas.php) Só as regras NOVAS destas páginas. Os cartões de produto (.esc-prod, .esc-medidas, .esc-notas, .esc-acoes...) já estão em escovas-aplicacoes.css, com o scope .page-escovas-app — é por isso que a vista do catálogo também traz essa classe no . Aqui só entra o que o seletor não tinha: o hero, as listas de marcas e modelos, e a moldura de cada período. Ficheiro próprio, e não o custom.css, pela mesma razão do escovas-aplicacoes.css: o site serve CSS com cache longa. ============================================================ */ /* --- hero --- */ .page-escovas-cat .hero-escovas { background: linear-gradient(135deg, #0a0a0a 0%, #2a2a2a 100%); color: #fff; padding: 46px 0; text-align: center; } .page-escovas-cat .hero-escovas h1 { font-size: 2rem; font-weight: 800; margin-bottom: 10px; } .page-escovas-cat .hero-escovas .lead { max-width: 820px; margin: 0 auto; color: #d8d8d8; font-size: 1rem; } .page-escovas-cat h2 { font-size: 1.3rem; font-weight: 800; margin: 34px 0 14px; } .page-escovas-cat h2 small { font-weight: 600; color: #888; font-size: .85rem; } /* --- listas de marcas e modelos --- */ .page-escovas-cat .esc-marcas, .page-escovas-cat .esc-modelos, .esc-marcas-atalho ul { list-style: none; padding: 0; margin: 0 0 10px; display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; } .page-escovas-cat .esc-marcas a, .page-escovas-cat .esc-modelos a, .esc-marcas-atalho a { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: #fff; border: 1px solid #e3e3e3; border-radius: 8px; padding: 10px 12px; font-weight: 700; font-size: .92rem; color: #1a1a1a; text-decoration: none; transition: border-color .15s, box-shadow .15s; } .page-escovas-cat .esc-marcas a:hover, .page-escovas-cat .esc-modelos a:hover, .esc-marcas-atalho a:hover { border-color: var(--primary-color); box-shadow: 0 4px 14px rgba(0,0,0,.08); } .page-escovas-cat .esc-marcas a small { font-weight: 600; font-size: .78rem; color: #999; } /* O atalho na página comercial não é uma grelha de cartões dentro de outra grelha: fica com a largura do conteúdo e sem borda própria. */ .esc-marcas-atalho { max-width: 980px; margin: 0 auto; } .esc-marcas-atalho p a { display: inline; border: 0; padding: 0; background: none; color: var(--primary-color); } .esc-marcas-atalho p a:hover { box-shadow: none; text-decoration: underline; } /* Variante de contorno do .esc-btn, para o botão secundário da nota final. O escovas-aplicacoes.css só traz --wa, --comprar e --copiar: esta faltava e o botão saía sem moldura nenhuma (apanhado pela auditoria). */ .page-escovas-cat .esc-btn--linha { background: #fff; border-color: #1a1a1a; color: #1a1a1a; } .page-escovas-cat .esc-btn--linha:hover { border-color: var(--primary-color); color: #1a1a1a; } /* --- um bloco por período de fabrico --- */ .page-escovas-cat .esc-periodo { border-top: 1px solid #e3e3e3; padding-top: 6px; margin-bottom: 26px; } .page-escovas-cat .esc-periodo:first-of-type { border-top: 0; } @media (max-width: 575.98px) { .page-escovas-cat .hero-escovas { padding: 34px 0; } .page-escovas-cat .hero-escovas h1 { font-size: 1.5rem; } .page-escovas-cat .esc-marcas, .page-escovas-cat .esc-modelos, .esc-marcas-atalho ul { grid-template-columns: 1fr 1fr; } }