/** * Largura mínima do site = telemóvel pequeno (ex.: ~320px CSS, iPhone SE). * Garante layout utilizável; em viewports mais estreitas o browser permite scroll horizontal. */ :root { --site-min-width: 320px; /* Largura máxima por defeito da página (conteúdo centrado). Alinhado ao cabeçalho global (--max-w em platform-global-chrome.css). */ --site-page-max-width: 1920px; /* Referência para media queries: mobile ≤480, tablet 481–1023, desktop 1024–1919, ≥1920 workstation */ --site-breakpoint-tablet-max: 1023px; --site-breakpoint-desktop-min: 1024px; } html { min-width: var(--site-min-width); max-width: 100%; overflow-x: clip; } body { min-width: var(--site-min-width); max-width: 100%; } /** * Bloco principal centrado até 1920px (útil em páginas simples). * O site público com chrome usa .wrap / main já limitados a var(--max-w). */ .site-page-shell { width: 100%; max-width: min(100%, var(--site-page-max-width)); margin-left: auto; margin-right: auto; box-sizing: border-box; } /** * Tipografia fluida (regra geral opcional): acrescente class="site-fluid-type" em . * O corpo do texto escala entre ~14px e ~18px conforme a largura do viewport (até monitores largos). */ html.site-fluid-type { font-size: clamp(14px, 11px + 0.55vw, 18px); }