/** * Botões — destaque minimalista: sombra em camadas suaves, borda fina, leve lift no hover. * Carregar no fim do (depois dos estilos inline da página). */ :root { --dua-btn-elev: 0 1px 2px rgba(0, 0, 0, 0.07), 0 5px 18px rgba(0, 0, 0, 0.1); --dua-btn-elev-hover: 0 2px 5px rgba(0, 0, 0, 0.09), 0 10px 26px rgba(0, 0, 0, 0.12); } .btn-primary, .btn-ghost, .dua-btn-area-entry { transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease, filter 0.15s ease; } .btn-primary { font-weight: 400; color: #fff !important; background: var(--card, #111214) !important; box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, 0.35)), var(--dua-btn-elev) !important; border-color: var(--form-border, #6b7280) !important; transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease, filter 0.15s ease, color 0.15s ease; } .btn-primary:hover, .btn-primary:focus-visible { color: var(--accent, #ffd700) !important; border-color: var(--accent, #ffd700) !important; filter: brightness(1.06); box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, 0.35)), var(--dua-btn-elev-hover) !important; transform: translateY(-1px); } .btn-ghost { font-weight: 400; color: #fff !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.14), var(--dua-btn-elev) !important; background: rgba(255, 255, 255, 0.055) !important; border-color: var(--form-border, #6b7280) !important; transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease, filter 0.15s ease, color 0.15s ease; } .btn-ghost:hover, .btn-ghost:focus-visible { color: var(--accent, #ffd700) !important; border-color: var(--accent, #ffd700) !important; transform: translateY(-1px); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12), var(--dua-btn-elev-hover) !important; } .dua-btn-area-entry { font-weight: 400; color: #fff !important; box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, 0.35)), var(--dua-btn-elev) !important; border-color: var(--form-border, #6b7280) !important; transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease, color 0.15s ease; } .dua-btn-area-entry:hover, .dua-btn-area-entry:focus-visible { color: var(--accent, #ffd700) !important; border-color: var(--accent, #ffd700) !important; box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, 0.35)), var(--dua-btn-elev-hover) !important; transform: translateY(-1px); } @media (prefers-reduced-motion: reduce) { .btn-primary, .btn-ghost, .dua-btn-area-entry { transition: none; } .btn-primary:hover, .btn-primary:focus-visible, .btn-ghost:hover, .btn-ghost:focus-visible, .dua-btn-area-entry:hover, .dua-btn-area-entry:focus-visible { transform: none; } }