/* ===== BlackOrbit — nova skin escura com classes únicas (prefixo vnt-) ===== */

/* Design tokens */
:root{
  /* Cores base (mais escuras e menos saturadas) */
  --vnt-bg: #0b0f1a;           /* fundo geral */
  --vnt-surface: #0f172a;      /* painéis */
  --vnt-panel: #111827;        /* cartões */
  --vnt-elev: #0b1220;         /* camada elevada */

  /* Texto */
  --vnt-text: #e5e7eb;         /* texto principal */
  --vnt-muted: #9ca3af;        /* texto secundário */

  /* Linhas/sombras */
  --vnt-line: rgba(255,255,255,.10);
  --vnt-glow: 0 12px 32px rgba(0,0,0,.45);
  --vnt-radius: 18px;

  /* Acentos (discretos) */
  --vnt-primary: #8b5cf6;      /* violeta frio */
  --vnt-teal: #14b8a6;         /* verde-azulado */
  --vnt-amber: #f59e0b;        /* âmbar suave */
  --vnt-rose: #fb7185;         /* rosa queimado */

  /* Gradientes reduzidos (menos brilho) */
  --vnt-grad-hero: linear-gradient(135deg, rgba(20,31,54,.9) 0%, rgba(17,24,39,.9) 100%);
  --vnt-grad-cta: linear-gradient(135deg, #8b5cf6 0%, #14b8a6 100%);
}

/* Reset mínimo e base tipográfica */
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--vnt-text);
  background:
    radial-gradient(900px 420px at -15% -20%, rgba(139,92,246,.08), transparent 60%),
    radial-gradient(700px 360px at 120% 110%, rgba(20,184,166,.06), transparent 60%),
    var(--vnt-grad-hero);
  line-height: 1.65;
  font-size: 16px;
}

/* leve textura fixa (muito discreta, para profundidade) */
body::before{
  content:""; position:fixed; inset:0; z-index:-1;
  background:
    linear-gradient(0deg, rgba(11,15,26,.80), rgba(11,15,26,.88)),
    url('../images/aurora-texture.webp') center/cover no-repeat;
  opacity:.35; /* menos visível que antes */
}

/* Acessibilidade: foco consistente */
:where(a, button, [role="button"]):focus-visible{
  outline: 2px solid color-mix(in oklab, var(--vnt-primary) 65%, transparent);
  outline-offset: 2px;
}

/* Skip link */
.vnt-skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.vnt-skip:focus{left:12px;top:12px;width:auto;height:auto;padding:.5rem .75rem;background:#0b1220;color:#fff;border-radius:10px;z-index:9999}

/* Container */
.vnt-wrap{width:min(1160px, 92%); margin-inline:auto}

/* Headings */
.vnt-title{
  font-family: "Space Grotesk", Inter, sans-serif;
  font-weight: 800;
  font-size: clamp(1.8rem, 1.1rem + 2vw, 2.4rem);
  margin: 0 0 10px;
}
.vnt-lead{color:var(--vnt-muted); margin:0 0 26px}

/* Botões */
.vnt-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.9rem 1.1rem; border-radius:14px; border:1px solid var(--vnt-line);
  background:#111a2d; color:#fff; text-decoration:none; cursor:pointer; line-height:1;
  transition: transform .16s ease, filter .16s ease, background-color .16s ease, border-color .16s ease;
  font-weight:700; font-size:1rem;
}
.vnt-btn--solid{ background:#1b2640; }
.vnt-btn--ghost{ background:transparent }
.vnt-btn--ghost:hover{ background:#0f172a }
.vnt-btn--cta{ background-image: var(--vnt-grad-cta); border:0; color:#0b1020; font-weight:800 }
.vnt-btn:hover{ transform: translateY(-1px); filter: brightness(1.03) }
.vnt-btn:active{ transform: translateY(0); filter: brightness(.98) }

/* Chips */
.vnt-chip{
  display:inline-flex; align-items:center; justify-content:center;
  background:#141e33; border:1px solid var(--vnt-line); color:#fff;
  padding:.35rem .7rem; border-radius:999px; font-weight:800; letter-spacing:.2px; font-size:.95rem;
}
.vnt-chip--age{ background:#211a3a; border-color:#3a2f6b }

/* Age Gate */
.vnt-gate{ position:fixed; inset:0; display:none; place-items:center; z-index:1000; backdrop-filter: blur(3px); background: rgba(5,10,18,.78); padding:24px }
.vnt-gate__box{ background:var(--vnt-panel); border:1px solid var(--vnt-line); border-radius:var(--vnt-radius); box-shadow: var(--vnt-glow); width:min(580px,100%); padding:28px; text-align:center }
.vnt-gate__badge{ width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;background:#2b1f4a;color:#fff;font-weight:900;border:2px solid #544194; font-size:.95rem }
.vnt-gate__title{ font-family:"Space Grotesk", Inter, sans-serif; margin:.25rem 0; font-size:1.5rem }
.vnt-gate__text{ color:var(--vnt-muted); margin:0 0 16px }
.vnt-gate__actions{ display:flex; gap:12px; justify-content:center }

/* Hero */
.vnt-hero{ padding:72px 0 36px }
.vnt-hero__wrap{ display:grid; gap:28px; grid-template-columns:1.1fr .9fr; align-items:start }
@media (max-width:900px){ .vnt-hero__wrap{ grid-template-columns:1fr } }

.vnt-hero__meta{ display:flex; align-items:center; gap:10px }
.vnt-hero__date{ color:var(--vnt-muted); font-size:.95rem }
.vnt-hero__title{
  font-family:"Space Grotesk", Inter, sans-serif; font-weight:800;
  font-size: clamp(2.4rem, 1.6rem + 2.8vw, 3.4rem);
  line-height:1.12; margin:.45rem 0 .6rem;
}
.vnt-hero__title em{ font-style:normal; color: color-mix(in oklab, var(--vnt-primary) 75%, #ffffff) }
.vnt-hero__sub{ color:#d7dde8; margin:0 0 18px }

.vnt-badges{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:8px 0 0 }
.vnt-badges__item{ background:#121a2f; border:1px solid var(--vnt-line); border-radius:999px; padding:.55rem .9rem; display:flex; align-items:center; gap:.55rem; color:#e5ecf5 }

/* Cartão do operador — novo visual */
.vnt-card{
  position:relative; overflow:hidden;
  background: linear-gradient(180deg, #0f172a 0%, #0b1220 100%);
  border: 1px solid var(--vnt-line); border-radius: var(--vnt-radius); box-shadow: var(--vnt-glow);
  padding: 18px; isolation:isolate;
}
.vnt-card::after{
  content:""; position:absolute; inset:auto -30% 0 -30%; height: 46px; z-index:0;
  background: linear-gradient(90deg, rgba(139,92,246,.25), rgba(20,184,166,.25), rgba(245,158,11,.25));
  filter: blur(18px); opacity:.35; pointer-events:none;
}
.vnt-card__head{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px }
.vnt-card__logo{     width: 170px;height:68px;border-radius:14px;display:grid;place-items:center;background:#0f1b30;border:1px solid var(--vnt-line);overflow:hidden; padding: 5px; }
.vnt-card__brand{     width: 100%;
    height: auto; }

/* rating circular */
.vnt-score{ position:relative; display:grid; place-items:center; width:60px; height:60px; border-radius:50%; background:#0e1a2e; border:1px solid var(--vnt-line) }
.vnt-score__ring{ position:absolute; inset:-2px; border-radius:50%; background:
  conic-gradient(var(--vnt-teal) 0 var(--vnt-score, 78%), rgba(255,255,255,.08) var(--vnt-score,78%) 100%);
  mask: radial-gradient(circle 24px at 50% 50%, transparent 60%, #000 61%);
}
.vnt-score__val{ position:relative; font-weight:900; font-size:.95rem }

.vnt-card__body{ position:relative; z-index:1; margin-top:14px }
.vnt-tag{ display:inline-block; background:#1a132a; color:#dec9ff; border:1px solid rgba(139,92,246,.45); padding:.4rem .7rem; border-radius:10px; margin-bottom:10px; font-weight:800; font-size:.95rem }
.vnt-card__bonus{ margin:0 0 12px }
.vnt-note{ color:var(--vnt-muted); margin:.6rem 0 0; font-size:.95rem }

/* Seções e grelha de features */
.vnt-section{ padding:44px 0 10px }
.vnt-grid{ display:grid; gap:18px; grid-template-columns:repeat(4,1fr) }
@media (max-width:900px){ .vnt-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){ .vnt-grid{ grid-template-columns:1fr } }

.vnt-feature{ background:var(--vnt-panel); border:1px solid var(--vnt-line); border-radius:16px; padding:18px; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease }
.vnt-feature:hover{ transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0,0,0,.35); border-color: rgba(139,92,246,.35) }
.vnt-feature__icon{ width:48px;height:48px;border-radius:12px;background:#0f213a;color:#c7d2fe;display:grid;place-items:center;margin-bottom:12px }
.vnt-feature__title{ margin:.25rem 0 .3rem; font-weight:800; font-size:1.2rem; font-family:"Space Grotesk", Inter, sans-serif }
.vnt-feature__text{ color:var(--vnt-muted); margin:0 }

.vnt-list{ list-style:none; padding:0; margin:12px 0; display:grid; gap:.6rem }
.vnt-list i{ color: var(--vnt-teal); margin-right:.55rem }

/* FAQ (acordeão) */
.vnt-faq{ padding:28px 0 60px }
.vnt-acc{ background:var(--vnt-panel); border:1px solid var(--vnt-line); border-radius:14px; margin:12px 0; overflow:hidden }
.vnt-acc__head{ width:100%; text-align:left; padding:16px 18px; background:transparent; color:#fff; font-weight:800; display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; border:0 }
.vnt-acc__ico{ transition: transform .22s ease }
.vnt-acc.is-open .vnt-acc__ico{ transform: rotate(180deg) }
.vnt-acc__body{ padding:0 18px; color:var(--vnt-muted); overflow:hidden; transition:max-height .28s ease }
.vnt-acc.is-open .vnt-acc__body{ padding:12px 18px 18px }

/* Footer */
.vnt-footer{ padding:40px 0; border-top:1px solid var(--vnt-line); background:#0a0f1c }
.vnt-footer__grid{ display:grid; grid-template-columns:2fr 1fr 1.2fr; gap:24px }
@media (max-width:900px){ .vnt-footer__grid{ grid-template-columns:1fr } }

.vnt-brand{ display:flex; align-items:center; gap:10px; margin-bottom:10px }
.vnt-brand__title{ font-family:"Space Grotesk", Inter, sans-serif; font-weight:800; font-size:1.25rem }
.vnt-foot__text{ color:#d6e6ff; margin:0 0 10px }
.vnt-foot__h4{ font-family:"Space Grotesk", Inter, sans-serif; font-weight:800; margin:.25rem 0 .5rem; font-size:1.125rem }

.vnt-links{ list-style:none; padding:0; margin:0; display:grid; gap:.45rem }
.vnt-link{ color:#d6e6ff; text-decoration:none; padding:.35rem .6rem; border:1px solid var(--vnt-line); border-radius:10px; display:inline-block }
.vnt-link:hover{ background:#10182b; border-color: rgba(139,92,246,.35) }

.vnt-social{ list-style:none; display:flex; gap:10px; padding:0; margin:8px 0 }
.vnt-social__link{ display:inline-flex; width:36px; height:36px; align-items:center; justify-content:center; border:1px solid var(--vnt-line); border-radius:10px; color:#eaf2ff; text-decoration:none; transition: transform .16s ease, border-color .16s ease }
.vnt-social__link:hover{ transform: translateY(-2px); border-color: rgba(20,184,166,.45) }

.vnt-foot__muted{ color:var(--vnt-muted); margin:6px 0 0 }
.vnt-foot__bar{ margin-top:18px; padding-top:14px; border-top:1px solid var(--vnt-line) }
.vnt-copy{ color:var(--vnt-muted); margin:0 }

/* Faixa de confiança */
.vnt-trust{ padding:12px 0 6px }
.vnt-trust__title{ font-family:"Space Grotesk", Inter, sans-serif; font-weight:800; font-size:1.2rem; margin:0 0 10px; color:#d7d3fe }
.vnt-trust__row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px }
.vnt-trust__item{ display:flex; align-items:center; justify-content:center; background:var(--vnt-panel); border:1px solid var(--vnt-line); border-radius:12px; padding:8px 12px; height:56px; min-width:72px; transition: border-color .16s ease, transform .16s ease }
.vnt-trust__item:hover{ border-color: rgba(139,92,246,.35); transform: translateY(-1px) }
.vnt-trust__item img{ max-height:55px; width:auto; display:block }

/* Cookie banner */
.vnt-cookie{ display:none; position:fixed; left:0; right:0; bottom:0; z-index:999; padding:14px 0; background:#0b1220f2; border-top:1px solid var(--vnt-line); backdrop-filter: blur(4px) }
.vnt-cookie__wrap{ display:flex; align-items:center; justify-content:space-between; gap:12px }
.vnt-cookie__text{ margin:0; color:#deecff }
.vnt-cookie__actions{ display:flex; gap:8px }

/* Utilitários */
.vnt-mt-48{ margin-top:48px }

/* Respeita reduce-motion */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ transition:none !important; animation:none !important }
}

@media (max-width:576px){
  .vnt-hero__title, .vnt-hero__sub,.vnt-card__body, .vnt-section,.vnt-title,.vnt-footer{
    text-align: center;
  }

  .vnt-feature__icon{
    margin-left: auto;
    margin-right: auto;
  }

  .vnt-badges,.vnt-trust__row,.vnt-brand{
    justify-content: center;
  }

  .vnt-hero{
    padding-top: 20px;
  }
}