/* LinkedClean — Responsive overrides (mobile) Os componentes usam style inline (specificity alta), por isso aqui usamos !important. */ /* Sliders/inputs: previne overflow horizontal global. Importante: aplicado SÓ no , não no . Quando o tem overflow-x: hidden, o browser implicitamente trata overflow-y como auto e quebra `position: sticky` da nav. */ body { max-width: 100%; overflow-x: hidden; } /* ===== Tablet & abaixo ===== */ @media (max-width: 1024px) { /* Popup demo (Painel) — empilha texto + popup */ #popup [style*="grid-template-columns"] { grid-template-columns: 1fr !important; gap: 48px !important; align-items: start !important; } } /* ===== Mobile ===== */ @media (max-width: 768px) { /* === Sections: padding lateral menor + vertical reduzido === */ section { padding-left: 20px !important; padding-right: 20px !important; padding-top: 72px !important; padding-bottom: 72px !important; } /* === Tipografia === */ h1 { font-size: clamp(36px, 10vw, 64px) !important; letter-spacing: -0.03em !important; line-height: 1.05 !important; } h2 { font-size: clamp(26px, 7.5vw, 40px) !important; line-height: 1.12 !important; letter-spacing: -0.025em !important; } /* === Nav: esconde links do meio em mobile === */ .lc-nav-link { display: none !important; } /* Nav pill: padding interno menor pra caber logo + CTA */ body nav { padding: 6px 6px 6px 14px !important; } /* Logo da nav: tira o border-right divisor (ficaria solto sem os links) */ body nav > a:first-child { border-right: none !important; padding-right: 8px !important; margin-right: 0 !important; } /* === Grids principais → 1 coluna === */ /* Categorias 5 cards */ #categorias [style*="grid-template-columns"] { grid-template-columns: 1fr !important; } /* Como funciona 3 cards */ #como-funciona [style*="grid-template-columns"] { grid-template-columns: 1fr !important; } /* Popup demo já coberto no breakpoint 1024 */ /* === Antes/Depois — limita largura, evita overflow === */ #antes-depois [style*="maxWidth"] { max-width: 100% !important; } /* === Popup shell (PopupV2Shell): largura fluida === */ .lc-popup-shell { max-width: 100% !important; width: 100% !important; } /* === Footer === */ footer > div:first-child { grid-template-columns: 1fr !important; gap: 36px !important; } footer > div:nth-of-type(2) { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; } /* === Hero (landing) — ícone menor === */ /* paddingTop:64 paddingBottom:96 ainda OK; só ajusta no clamp do h1 */ /* === Manifesto/Privacidade — corpo container já é 720px, fica fluido === */ } /* ===== Phones pequenos ===== */ @media (max-width: 480px) { h1 { font-size: clamp(32px, 9.5vw, 44px) !important; } h2 { font-size: clamp(24px, 7vw, 32px) !important; } section { padding-top: 56px !important; padding-bottom: 56px !important; padding-left: 18px !important; padding-right: 18px !important; } }