/* =========================================================
   LAYOUT — STRUCTURAL LAYOUT
   =========================================================

   Responsável pela estrutura e organização espacial
   global do projecto.

   Depende de:
   - tokens.css
   - base.css

   Este ficheiro contém:
   - Containers
   - Wrappers
   - Sections
   - Content widths
   - Grid estrutural
   - Flex layouts estruturais
   - Main content
   - Sidebars
   - Estruturas reutilizáveis de layout

   Não colocar aqui:
   - Botões
   - Cards
   - Formulários
   - Utilities
   - Estilos exclusivos de páginas
   - Overrides de temas ou plugins

   Regra:
   Este ficheiro deve controlar apenas estrutura,
   largura, alinhamento e distribuição espacial.
   ========================================================= */

/*
========================================================
01. CONTAINERS
========================================================
*/

/*
========================================================
02. CONTENT WIDTH
========================================================
*/

/*
========================================================
03. SECTIONS
========================================================
*/

/*
========================================================
04. SECTION STRUCTURE
========================================================
*/

/*
========================================================
05. WRAPPERS
========================================================
*/

/*
========================================================
06. STACK
========================================================

Layout vertical reutilizável.

O espaçamento entre elementos é controlado através
da propriedade gap.
========================================================
*/

/*
========================================================
07. CLUSTER
========================================================

Layout horizontal flexível para grupos de elementos
como acções, meta informações e pequenos grupos UI.
========================================================
*/

/*
========================================================
08. GRID
========================================================
*/

/*
========================================================
09. AUTO GRID
========================================================

Grid responsivo automático.

O tamanho mínimo dos itens é controlado através
de --grid-min-card.
========================================================
*/

/*
========================================================
10. SPLIT LAYOUT
========================================================

Estrutura de duas colunas flexíveis.

Útil para:
- Texto + imagem
- Conteúdo + formulário
- Conteúdo + informação complementar
========================================================
*/

/*
========================================================
11. SIDEBAR LAYOUT
========================================================
*/

/*
========================================================
12. MAIN CONTENT
========================================================
*/

/*
========================================================
13. FULL WIDTH
========================================================
*/

/*
========================================================
14. FULL BLEED
========================================================

Permite que um elemento ultrapasse a largura normal
do conteúdo e ocupe toda a largura disponível.
========================================================
*/

/*
========================================================
15. MEDIA WRAPPER
========================================================
*/

/*
========================================================
16. ASPECT RATIO
========================================================
*/