/* ==========================================================================
   responsive.css — ajustes responsivos GLOBAIS

   Abordagem mobile-first: os demais arquivos descrevem a experiência mobile e
   ampliam conforme o espaço cresce.

   CONVENÇÃO: as regras responsivas de uma seção ficam NO BLOCO DESSA SEÇÃO, em
   sections.css (e as de um componente, junto dele em components.css), para que
   cada parte possa ser entendida em um único lugar. Este arquivo é só para o
   que atravessa várias partes do projeto.

   Hoje não há regra global: a altura do header (--header-height) e os ritmos
   verticais são fluidos (clamp com vw) e vivem em tokens.css.

   Breakpoints (espelham --bp-* de tokens.css, que não funcionam em @media):
     sm  40em  (640px)
     md  48em  (768px)
     lg  64em  (1024px)
     xl  80em  (1280px)
   ========================================================================== */