/* ─── GS ODONTOLOGIA — MODERN CSS RESET ─────────────────────────── */ *, *::before, *::after { box-sizing: border-box; } * { margin: 0; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--header-h); /* O contêiner de rolagem é o , não o — só travar o body deixava a página arrastar ~63px para o lado no mobile, porque o drawer do menu fica estacionado fora da tela à direita e continua contando para o scrollWidth mesmo com `visibility: hidden`. `clip` é o correto (recorta sem criar contexto de rolagem, então não interfere no pin do ScrollTrigger); `hidden` fica como reserva para navegadores que não conhecem `clip`. */ overflow-x: hidden; overflow-x: clip; } body { min-height: 100vh; font-family: var(--font-body); font-size: var(--text-base); font-weight: 400; line-height: var(--leading-normal); color: var(--gs-text); background: var(--gs-bg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; overflow-x: hidden; } img, picture, video, canvas, svg { display: block; max-width: 100%; } img, video { height: auto; } input, button, textarea, select { font: inherit; color: inherit; } button { background: none; border: none; cursor: pointer; } p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; } h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: var(--leading-tight); } ul, ol { list-style: none; padding: 0; } a { color: inherit; text-decoration: none; } address { font-style: normal; } fieldset { border: none; padding: 0; margin: 0; } legend { padding: 0; } table { border-collapse: collapse; width: 100%; } /* foco visível e consistente em toda a interface */ :focus-visible { outline: 2px solid var(--gs-primary); outline-offset: 3px; border-radius: var(--radius-sm); } /* Em fundo navy o contorno navy some. Toda seção de fundo escuro precisa entrar nesta lista, ou o foco do teclado fica invisível. */ :where([data-theme-dark]) :focus-visible, .gs-hero :focus-visible, .gs-cta-inv :focus-visible, .gs-equipe :focus-visible, .gs-agendamento :focus-visible, .gs-localizacao :focus-visible, .gs-footer :focus-visible { outline-color: var(--gs-secondary); } /* O `display` do agente de usuário para [hidden] tem especificidade zero e perde para qualquer regra de classe (`.gs-numeros__item { display: grid }`, por exemplo). Como o JS usa o atributo `hidden` para esconder blocos sem dado real, ele precisa vencer sempre. */ [hidden] { display: none !important; } /* conteúdo visualmente oculto mas acessível a leitores de tela */ .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; } /* pula direto para o conteúdo (teclado) */ .skip-link { position: absolute; top: var(--space-4); left: var(--space-4); z-index: var(--z-toast); padding: var(--space-3) var(--space-5); background: var(--gs-primary); color: var(--gs-text-inverse); font-size: var(--text-sm); font-weight: 600; border-radius: var(--radius-md); transform: translateY(-160%); transition: transform var(--dur-fast) var(--ease-smooth); } .skip-link:focus-visible { transform: translateY(0); } ::selection { background: var(--gs-primary); color: var(--gs-text-inverse); }