/* ==========================================================================
   AX — landing page
   A folha e curta de proposito: o desenho traz os estilos embutidos em cada
   elemento. Aqui ficam so a base da pagina e as regras de :hover, que nao
   cabem num atributo style.
   ========================================================================== */

html { scroll-behavior: smooth; scroll-padding-top: 96px; }
html, body {
  margin: 0; padding: 0;
  background: #08090A; color: #F2F4F5;
  font-family: Manrope, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: #F2F4F5; text-decoration: none; }
a:hover { color: #FF8095; }
button { font-family: inherit; }
img { display: block; max-width: 100%; }

@keyframes axIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes axBlink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

/* Hover de cada elemento do desenho. */
.h1:hover{color:#FF6E8C;border-bottom-color:#E01F3D}
.h2:hover{color:#5DE3A5;border-bottom-color:#12D18A}
.h3:hover{color:#C0A0FF;border-bottom-color:#9B5CFF}
.h4:hover{color:#F2F4F5;border-bottom-color:rgba(255,255,255,0.5)}
.h5:hover{color:#fff;filter:brightness(1.12)}
.h6:hover{color:#08090A;filter:brightness(0.9)}
.h7:hover{border-color:rgba(255,255,255,0.45)}
.h8:hover{transform:translateY(-4px);color:#F2F4F5}
.h9:hover{filter:brightness(1.12);color:#fff}
.h10:hover{color:#fff;filter:brightness(1.1)}
.h11:hover{color:#06130D;filter:brightness(1.12)}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}