/* ============================================================ Manual overrides on top of the Framer static export. This is the file for hand-authored visual/behavior tweaks that aren't specifically about breakpoint/responsive reconstruction (see breakpoints.css for those). Why !important is needed here: index.html's ships Framer's compiled CSS, which frequently targets the same elements via higher-specificity compound selectors (e.g. `.framer-k9o1Y .framer-6zute{...}` beats a plain `.framer-6zute` rule regardless of source order). !important is how a rule here reliably wins against that — it's the correct tool for this constraint, not a shortcut. (This used to also be needed because Framer's JS runtime re-asserted inline styles post-hydration — that runtime is gone now, but the CSS-specificity reason still fully applies on its own.) See CLAUDE.md for more on the site's overall architecture. ============================================================ */ /* Smooth-scroll for in-page anchor navigation (nav links -> #sobre etc., logo -> top; the logo's scroll-to-top is JS, see app.js) */ html{ scroll-behavior:smooth; } /* Header nav links (Sobre / Especialidades / Local de Atendimento / Dúvidas) — bumped from 14px */ .framer-e474qi a.framer-text{ font-size:16px !important; } /* Make the header stick to the top of the viewport while scrolling */ .framer-6zute{ position:sticky !important; top:0 !important; z-index:100 !important; background:#fff !important; } /* Offset anchor-link scroll targets so section titles aren't hidden under the sticky header (header height: 80px) */ #sobre,#especialidades,#consultorios,#perguntas{ scroll-margin-top:80px !important; }