/* ══════════════════════════════════════════════
   SALVIX — Landing Page · styles.css
   Fontes, animações, estados hover e responsivo.
   O grosso do layout está inline no index.html.
   ══════════════════════════════════════════════ */

@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-Light.otf') format('opentype'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-Medium.otf') format('opentype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-Bold.otf') format('opentype'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-Heavy.otf') format('opentype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-BoldItalic.otf') format('opentype'); font-weight:700; font-style:italic; font-display:swap; }
@font-face { font-family:'Kallisto'; src:url('fonts/Kallisto-HeavyItalic.otf') format('opentype'); font-weight:800; font-style:italic; font-display:swap; }

html { scroll-behavior:smooth; }
body { margin:0; background:#0B0D12; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
::selection { background:#02CDEA; color:#00171C; }
a { color:#3AD9F0; }
a:hover { color:#02CDEA; }

/* ── animações ── */
@keyframes msgIn { from { opacity:0; transform:translateY(10px) scale(.97); } to { opacity:1; transform:none; } }
@keyframes dotPulse { 0%,80%,100% { opacity:.25; } 40% { opacity:1; } }
@keyframes pulseDot { 0%,100% { box-shadow:0 0 0 0 rgba(61,220,151,.5); } 50% { box-shadow:0 0 0 5px rgba(61,220,151,0); } }
@keyframes fabPulse { 0%,100% { box-shadow:0 10px 30px rgba(0,0,0,.5), 0 0 0 0 rgba(2,205,234,.5); } 50% { box-shadow:0 10px 30px rgba(0,0,0,.5), 0 0 0 13px rgba(2,205,234,0); } }
@keyframes ctaPulse { 0%,100% { box-shadow:0 0 36px rgba(2,205,234,.28); } 50% { box-shadow:0 0 68px rgba(2,205,234,.52); } }

/* ── hovers (sobrepõem estilos inline) ── */
.nav-link:hover { color:#EDF3F5 !important; }
.link-entrar:hover { color:#02CDEA !important; }
.btn-cyan:hover { background:#3AD9F0 !important; }
.btn-ghost:hover { border-color:#02CDEA !important; color:#3AD9F0 !important; }
.btn-outline:hover { border-color:#02CDEA !important; background:rgba(2,205,234,.08) !important; }
.btn-outline-2:hover { background:rgba(2,205,234,.1) !important; }
.card-dor:hover { border-color:rgba(2,205,234,.35) !important; }
.rec-card:hover { border-color:rgba(2,205,234,.4) !important; background:#151923 !important; }
.cta-tile:hover { border-color:#02CDEA !important; background:linear-gradient(90deg,rgba(2,205,234,.26),rgba(2,205,234,.09)) !important; }
.faq-q:hover { background:rgba(18,21,28,.5); }
.flink:hover { color:#3AD9F0 !important; }
.fab-close:hover { color:#EDF3F5 !important; }
.dim:hover { opacity:1 !important; }

/* ── FAQ ── */
.faq-a { display:none; }
.faq-item.open .faq-a { display:block; animation:msgIn .25s ease-out; }

/* ── navegação responsiva ── */
.nav-desktop { display:flex; align-items:center; gap:32px; }
.nav-mobile { display:none; align-items:center; gap:10px; }
#mobile-menu { display:none; }
#nav.menu-open #mobile-menu { display:flex; }
#menu-btn .icon-x { display:none; }
#nav.menu-open #menu-btn .icon-x { display:block; }
#nav.menu-open #menu-btn .icon-bars { display:none; }

@media (max-width:959px) {
  .nav-desktop { display:none; }
  .nav-mobile { display:flex; }
}

/* ── FAB WhatsApp (o JS exibe) ── */
#fab { display:none; }