/* =========================================================
   RT•Nexus — GLOBAL CSS (refinado, sem perdas)
   ========================================================= */

/* ===============================
   Reset + base layout improvement
   =============================== */

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
html, body { height: 100%; }

body{
  margin: 0;
  padding: 0;
}

/* Acessibilidade: foco visível */
:focus-visible{
  outline: 2px solid rgba(94,234,212,.75);
  outline-offset: 3px;
  border-radius: 10px;
}

/* ===============================
   Tokens
   =============================== */

:root{
  --bg:#070A10;
  --card:#0B1220;
  --text:#EAF0FF;
  --muted:rgba(234,240,255,.68);
  --muted2:rgba(234,240,255,.52);
  --line:rgba(234,240,255,.10);
  --shadow: 0 18px 60px rgba(0,0,0,.45);
  --radius: 18px;

  /* container */
  --max: 1320px;

  /* accents */
  --accent: rgba(94,234,212,.95);

  /* font */
  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}

/* ===============================
   Base typography + background
   =============================== */

body{
  font-family: var(--font);
  background:
    radial-gradient(900px 600px at 25% 0%, rgba(96,165,250,.14), transparent 60%),
    radial-gradient(900px 600px at 75% 10%, rgba(94,234,212,.12), transparent 60%),
    var(--bg);
  color: var(--text);
  line-height: 1.55;
}

a{ color: inherit; text-decoration: none; }

/* container único (sem duplicidade) */
.container{
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

/* ===============================
   TOPBAR
   =============================== */

.topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(10px);
  background: rgba(7,10,16,.60);
  border-bottom: 1px solid var(--line);
}

.topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 0;
  gap: 16px;
}

.brand{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 850;
  letter-spacing:-.02em;
}

.dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background: var(--accent);
  box-shadow: 0 0 22px rgba(94,234,212,.35);
}

.brand small{
  color: var(--muted2);
  font-weight:650;
  font-size:12px;
  margin-left: 6px;
}

.nav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
}

/* ===============================
   BUTTONS
   =============================== */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(234,240,255,.03);
  color: var(--text);
  font-weight: 850;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
  transition: transform .06s ease, background .15s ease, border-color .15s ease, opacity .15s ease;
}

.btn:hover{ background: rgba(234,240,255,.06); border-color: rgba(234,240,255,.18); }
.btn:active{ transform: translateY(1px); }

.btn-primary{
  border-color: rgba(94,234,212,.35);
  background: linear-gradient(135deg, rgba(94,234,212,.22), rgba(96,165,250,.12));
  box-shadow: 0 10px 30px rgba(94,234,212,.10);
}

.btn-primary:hover{
  border-color: rgba(94,234,212,.55);
  background: linear-gradient(135deg, rgba(94,234,212,.28), rgba(96,165,250,.14));
}

.btn-ghost{
  border-color: rgba(234,240,255,.10);
  background: rgba(234,240,255,.02);
  color: var(--muted);
}

/* ===============================
   HERO
   =============================== */

.hero{ padding: 56px 0 22px; }

.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border: 1px solid rgba(94,234,212,.25);
  background: rgba(94,234,212,.06);
  border-radius: 999px;
  color: var(--muted);
  font-weight: 650;
  font-size: 13px;
}

h1{
  margin: 14px 0 10px;
  font-size: clamp(30px, 4vw, 46px);
  line-height:1.1;
  letter-spacing:-.03em;
}

/* você usa "lede" no Nexus, e "lead" em outros lugares: suporte ambos */
.lead, .lede{
  margin:0 0 16px;
  color: var(--muted);
  font-size: 16px;
  max-width: 72ch;
}

.card{
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(11,18,32,.92), rgba(11,18,32,.82));
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px;
}

.section{
  margin:0 0 8px;
  font-size: 13px;
  color: var(--muted2);
  text-transform: uppercase;
  letter-spacing:.02em;
}

.bullets{ margin: 10px 0 0; padding-left: 18px; color: rgba(234,240,255,.86); }
.bullets li{ margin: 10px 0; }
.muted{ color: var(--muted); }

.grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:14px;
  align-items:start;
  margin-top: 16px;
}

@media (max-width: 980px){
  .grid{ grid-template-columns: 1fr; }
}

/* ===============================
   NEXUS: brand block + Selo (corrigido)
   =============================== */

.nexus-brand-block{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
}

/* UMA única definição (sem duplicidade) */
.infra-badge-inline{
  display:inline-flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top: 14px;
  margin-bottom: 10px;
}

.infra-badge-inline span{
  display:inline-flex;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(94,234,212,.35);
  background: rgba(11,18,32,.20);
  color: rgba(234,240,255,.74);
  font-size: 11.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1;
}

.infra-badge-inline span:first-child{
  color: rgba(234,240,255,.86);
  border-color: rgba(94,234,212,.55);
}

/* ===============================
   FOOTER (institucional)
   =============================== */

.footer{
  margin-top:40px;
  border-top:1px solid rgba(234,240,255,.10);
  padding:36px 0 46px;
  color: var(--muted2);
  font-size: 13px;
}

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:28px;
}

.footer-brand{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.footer-text{
  color:rgba(234,240,255,.65);
  max-width:320px;
  font-size:14px;
}

.footer-copy{
  color:rgba(234,240,255,.45);
  font-size:12px;
}

.footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-title{
  font-weight:700;
  margin-bottom:4px;
}

.footer-col a{
  font-size:14px;
  color:rgba(234,240,255,.70);
  transition:opacity .2s;
}

.footer-col a:hover{ opacity:.9; }

/* ===============================
   Mobile improvement (global)
   =============================== */

@media (max-width: 900px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 768px){
  body{ font-size: 16px; }
  .container{ padding-left: 18px; padding-right: 18px; }
}

@media (max-width: 600px){
  .footer-grid{ grid-template-columns:1fr; }
}

/* ===============================
   Motion reduction
   =============================== */

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto !important; }
  *{ transition: none !important; }
  /* =================================
   FOOTER — RTNEXUS
================================= */

.footer{
  margin-top:48px;
  border-top:1px solid rgba(234,240,255,.10);
  padding:42px 0 48px;
}

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:36px;
}

.footer-brand{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.footer-text{
  color:rgba(234,240,255,.65);
  max-width:360px;
  font-size:14px;
  line-height:1.55;
}

.footer-infra{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(234,240,255,.50);
  border:1px solid rgba(94,234,212,.25);
  border-radius:999px;
  padding:6px 10px;
  width:max-content;
}

.footer-copy{
  font-size:12px;
  color:rgba(234,240,255,.45);
}

.footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-title{
  font-weight:700;
  margin-bottom:6px;
}

.footer-col a{
  font-size:14px;
  color:rgba(234,240,255,.72);
  transition:opacity .2s ease;
}

.footer-col a:hover{
  opacity:.9;
}

/* mobile */

@media (max-width:900px){

  .footer-grid{
    grid-template-columns:1fr 1fr;
  }

}

@media (max-width:600px){

  .footer-grid{
    grid-template-columns:1fr;
  }
/* =========================================================
   UPGRADE — US$100M FEEL (TOPBAR + CTA + HERO)
   ========================================================= */

/* 1) TOPBAR premium glass */
.topbar{
  background: rgba(7,10,16,.72);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(234,240,255,.08);
}
.topbar-inner{ padding: 12px 0; }

/* 2) NAV vira “chip links” */
.nav{ gap: 8px; }
.nav a{
  display:inline-flex;
  align-items:center;
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(234,240,255,.08);
  background: rgba(234,240,255,.02);
  color: rgba(234,240,255,.76);
  font-size: 13px;
  font-weight: 750;
  transition: background .18s ease, border-color .18s ease, transform .12s ease, color .18s ease, box-shadow .18s ease;
}
.nav a:hover{
  background: rgba(94,234,212,.08);
  border-color: rgba(94,234,212,.22);
  color: rgba(234,240,255,.92);
  transform: translateY(-1px);
}

/* 3) CTA do MENU — “Quero meu diagnóstico”
   (sem HTML) — funciona se o href tiver “diagnostico/diagnóstico” */
.nav a[href*="diagnostico"],
.nav a[href*="diagnóstico"]{
  padding: 10px 16px;
  font-weight: 850;
  color: #EAF0FF;
  border: 1px solid rgba(94,234,212,.45);
  background: linear-gradient(135deg, rgba(94,234,212,.26), rgba(96,165,250,.14));
  box-shadow:
    0 12px 36px rgba(94,234,212,.18),
    inset 0 0 0 1px rgba(255,255,255,.06);
}
.nav a[href*="diagnostico"]:hover,
.nav a[href*="diagnóstico"]:hover{
  border-color: rgba(94,234,212,.70);
  box-shadow:
    0 16px 52px rgba(94,234,212,.24),
    inset 0 0 0 1px rgba(255,255,255,.10);
}

/* 4) HERO: glow discreto no headline */
.hero h1{
  text-shadow:
    0 0 18px rgba(255,255,255,.04),
    0 0 40px rgba(255,255,255,.04),
    0 0 90px rgba(94,234,212,.07);
}

/* 5) CTA do HERO premium (light sweep + depth)
   (suporta .btn.primary e .btn-primary) */
.hero .btn.primary,
.hero .btn-primary{
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(94,234,212,.55);
  background: linear-gradient(135deg, rgba(94,234,212,.35), rgba(96,165,250,.22));
  box-shadow:
    0 14px 44px rgba(94,234,212,.30),
    inset 0 0 0 1px rgba(255,255,255,.08);
  transition: all .25s ease;
}
.hero .btn.primary:hover,
.hero .btn-primary:hover{
  transform: translateY(-2px);
  box-shadow:
    0 22px 64px rgba(94,234,212,.45),
    inset 0 0 0 1px rgba(255,255,255,.14);
}
.hero .btn.primary::after,
.hero .btn-primary::after{
  content:"";
  position:absolute;
  top:-50%;
  left:-60%;
  width:40%;
  height:200%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
  transform: rotate(25deg);
  transition: all .6s ease;
}
.hero .btn.primary:hover::after,
.hero .btn-primary:hover::after{
  left:140%;
}
.cta-proof{
  margin-top: 10px;
  font-size: 13px;
  color: rgba(234,240,255,.60);
  letter-spacing:.02em;
}
.infra-strip{
  position: relative;
  z-index: 60;
  border-bottom: 1px solid rgba(234,240,255,.08);
  background: rgba(7,10,16,.65);
  backdrop-filter: blur(14px);
}
.infra-strip-inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 8px 0;
}
.infra-chip{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(94,234,212,.35);
  background: rgba(11,18,32,.28);
  color: rgba(234,240,255,.80);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 1;
  box-shadow: 0 0 18px rgba(94,234,212,.10);
}
.infra-text{
  color: rgba(234,240,255,.62);
  font-size: 12px;
  letter-spacing: .02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.infra-link{
  color: rgba(234,240,255,.70);
  font-size: 12px;
  transition: opacity .2s ease;
}
.infra-link:hover{ opacity: .9; }
.infra-sep{
  color: rgba(234,240,255,.35);
  font-size: 12px;
}
.infra-spacer{ flex: 1; }
@media (max-width: 768px){
  .infra-spacer{ display:none; }
  .infra-link, .infra-sep{ display:none; }
  .infra-text{ white-space: normal; }
}
/* =================================
   CTA reinforcement
   ================================= */

.cta-proof{

  margin-top:10px;

  font-size:13px;

  color:rgba(234,240,255,.65);

}

.cta-cred{

  margin-top:4px;

  font-size:12px;

  color:rgba(234,240,255,.45);

  letter-spacing:.02em;

}
/* CTA premium dentro do botão existente */
.heroCtas .btn.primary{
  padding:12px 16px;
}

.heroCtas .btn.primary .ctaMain{
  display:block;
  font-weight:900;
  font-size:15px;
  line-height:1.1;
}

.heroCtas .btn.primary .ctaSub{
  display:block;
  margin-top:3px;
  font-weight:750;
  font-size:11px;
  color:rgba(234,240,255,.70);
  letter-spacing:.02em;
}
/* CTA refinado: prova + assinatura institucional (fora do botão) */
.cta-proof{
  margin-top:10px;
  color: rgba(234,240,255,.72);
  font-size: 13px;
  line-height: 1.35;
}

.cta-subbrand{
  margin-top:6px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(94,234,212,.28);
  background: rgba(11,18,32,.22);
  color: rgba(234,240,255,.78);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .02em;
}

.cta-subbrand .sep{
  opacity:.55;
}

.cta-cred{
  margin-top:6px;
  color: rgba(234,240,255,.66);
  font-size: 13px;
}

/* Mobile: não estourar linha nem ficar enorme */
@media (max-width: 520px){
  .cta-subbrand{
    display:block;
    width:fit-content;
    max-width:100%;
    white-space:normal;


  }
  /* ===== CTA Stack refinado ===== */

.heroCtas{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}

.ctaStack{
  margin-top:10px;
  display:inline-flex;
  flex-direction:column;
  gap:4px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(234,240,255,.10);
  background:rgba(11,18,32,.28);
  backdrop-filter: blur(8px);
  max-width:68ch;
}

.ctaLine{
  color:rgba(234,240,255,.78);
  font-size:13px;
  line-height:1.3;
  font-weight:650;
}

.ctaLine.subtle{
  color:rgba(234,240,255,.62);
  font-weight:600;
}

.ctaLine .sep{
  opacity:.55;
  margin:0 6px;
}

@media (max-width:520px){
  .ctaStack{width:100%;}
}
/* ===== HERO CTA: não estrangular texto ===== */

.heroCtas{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}

/* botão principal: “contido”, não ocupa demais */
.ctaMain{
  padding: 12px 18px;
  white-space: nowrap;
  max-width: 100%;
}

/* secundários ficam em grupo e não empurram o layout */
.ctaSecondary{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* bloco abaixo vira “faixa” própria com respiro */
.ctaUnder{
  margin-top:10px;
  padding-top:10px;
  border-top: 1px dashed rgba(234,240,255,.10);
  max-width: 72ch;              /* controla leitura e evita “aperto” */
}

/* tipografia/ritmo */
.ctaLine{
  color: rgba(234,240,255,.78);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 650;
}
.ctaLine.subtle{
  color: rgba(234,240,255,.62);
  font-weight: 600;
}
.ctaLine .sep{
  opacity:.55;
  margin:0 6px;
}

/* mobile: CTA principal ocupa 100% e o resto quebra bonito */
@media (max-width: 560px){
  .ctaMain{ width:100%; justify-content:center; }
  .ctaSecondary{ width:100%; }
  .ctaUnder{ max-width: 100%; }


}
.btn.primary{
  padding: 10px 16px;
  font-weight: 650;
}
.hero h1{
  text-shadow:
    0 0 18px rgba(255,255,255,0.08),
    0 0 36px rgba(94,234,212,0.06);
}
.hero .lede{
  margin-top: 14px;
  max-width: 60ch;
  line-height: 1.55;
}

.heroCtas{
  margin-top: 18px;
}
.heroCtas .btn{
  transition: all .15s ease;
}

.heroCtas .btn:hover{
  transform: translateY(-1px);
}

.heroCtas .btn.primary{
  box-shadow: 0 6px 20px rgba(94,234,212,0.18);
}
/* CTA hero refinado */

.heroCtas .btn.primary{
  padding: 8px 14px;          /* antes estava alto demais */
  font-size: 14px;
  font-weight: 600;
  border-radius: 10px;        /* antes era muito “pílula” */
  box-shadow: 0 4px 12px rgba(94,234,212,.12);
}
.heroCtas{
  gap: 8px;
  margin-top: 14px;
}
.ctaUnder{
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.35;
}
/* =========================================================
   HERO (Nexus) — refinamento premium (sem mexer no HTML)
   Cole no FINAL do global.css
   ========================================================= */

/* 1) Respiro geral do hero */
.hero{
  padding-top: 54px;
  padding-bottom: 22px;
}

/* 2) Título principal (a frase grande) um pouco menos “pesado” */
.hero h1{
  letter-spacing: -0.025em;
  text-shadow: 0 8px 30px rgba(0,0,0,.22);
}

/* 3) Bloco RT•NEXUS: manter como H1 (ok), mas visualmente mais refinado */
.nexus-logo{
  margin: 14px 0 8px;
  font-size: clamp(26px, 3.2vw, 36px);
  letter-spacing: -0.02em;
  opacity: .95;
}

/* 4) Parágrafo do hero: melhora leitura e evita “estrangulamento” */
.lede, .lead{
  margin-top: 0;
  margin-bottom: 14px;
  max-width: 68ch;
}

/* 5) Alinhamento do brand-block (RT•NEXUS + badges à direita) */
.nexus-brand-block{
  align-items: center;
  gap: 14px;
}

/* 6) Badges: menos “chamativos” e mais “institucionais” */
.infra-badge-inline{
  margin-top: 8px;
  margin-bottom: 8px;
  justify-content: flex-end;
}
.infra-badge-inline span{
  padding: 6px 10px;
  font-size: 11px;
  letter-spacing: .09em;
  border-color: rgba(94,234,212,.28);
  background: rgba(11,18,32,.22);
  color: rgba(234,240,255,.74);
}

/* 7) Linha dos botões: ritmo melhor */
.heroCtas{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
  margin-bottom: 8px;
  align-items: center;
}

/* 8) CTA principal: resolver “botão gordo” (mais leve e elegante) */
.heroCtas .btn.primary{
  padding: 8px 14px;              /* afinou */
  font-size: 14px;
  font-weight: 650;               /* menos bloco */
  border-radius: 12px;            /* menos “pílula” */
  box-shadow: 0 6px 16px rgba(94,234,212,.12);
}
.heroCtas .btn.primary:hover{
  box-shadow: 0 10px 24px rgba(94,234,212,.14);
}

/* 9) Botões secundários: consistência com o principal */
.heroCtas .btn{
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 650;
  border-radius: 12px;
}

/* 10) Texto de prova logo abaixo do CTA (seu cta-proof/cta-cred) */
.cta-proof{
  margin-top: 6px;
  font-size: 13px;
  color: rgba(234,240,255,.72);
}
.cta-cred{
  margin-top: 4px;
  font-size: 13px;
  color: rgba(234,240,255,.62);
}

/* 11) Mobile: evitar aperto e manter hierarquia */
@media (max-width: 768px){
  .nexus-brand-block{
    align-items: flex-start;
  }
  .infra-badge-inline{
    justify-content: flex-start;
  }
  .heroCtas{
    gap: 8px;
  }
  .hero h1{ opacity: .96; }
}
/* HERO – melhoria de leitura */

.lede{
  line-height: 1.55;
  margin-bottom: 20px;
}
.heroCtas .btn.primary{
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(94,234,212,.12);
  margin-bottom: 10px; /* respiro novo */
}
.heroCtas{
  margin-top: 18px;
  margin-bottom: 8px;
  gap: 10px;
}
.lede{
  max-width: 64ch;
}
/* marca RT•NEXUS mais institucional */

.nexus-logo{
  font-weight: 600;
  letter-spacing: .02em;
  opacity: .92;
  margin-top: 10px;
  margin-bottom: 6px;
}
/* badges alinhados ao bloco institucional */

.infra-badge-inline{
  margin-top: 6px;
  gap: 8px;
  opacity: .9;
}
.infra-badge-inline span{
  padding: 5px 10px;
  font-size: 11px;
  letter-spacing: .08em;
  border-color: rgba(94,234,212,.35);
  background: rgba(11,18,32,.25);
}
.hero h1{
  margin-bottom: 14px;
}
/* tese institucional do produto */

.nexus-thesis{
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .02em;
  color: rgba(234,240,255,.72);
  margin-top: 2px;
  margin-bottom: 14px;
}
.nexus-logo{
  font-weight: 600;
  letter-spacing: .03em;
  margin-bottom: 2px;
}
/* HERO CTA — versão magra institucional */

.heroCtas .btn.primary{
  padding: 6px 12px;     /* reduz altura */
  font-size: 14px;
  font-weight: 600;

  border-radius: 10px;

  box-shadow: none;      /* remove glow pesado */
}
.heroCtas .btn{
  padding: 6px 12px;
  font-size: 14px;
  border-radius: 10px;
}
.heroCtas{
  margin-bottom: 12px;
}
.heroCtas .btn.primary{
  padding: 5px 12px;
}
/* HERO H1 — refinamento editorial */

.hero h1{
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.08;
  margin-bottom: 18px;
}
.hero h1 br{
  line-height: 1.3;
}
.hero h1{
  max-width: 18ch;
}
.hero h1{
  text-shadow: 0 10px 40px rgba(0,0,0,.35);
}
/* HERO GRID — alinhamento institucional */

.hero{
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.hero .lede{
  max-width: 64ch;
}
.hero h1{
  max-width: 18ch;
}
.hero-inner{
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.hero{
  padding-top: 72px;
  padding-bottom: 40px;
}
.infra-badge-inline{
  margin-top: 8px;
  margin-bottom: 8px;
}
/* HERO — halo de luz premium atrás do H1 */

.hero{
  position: relative;
  overflow: hidden;
}

.hero::before{
  content:"";
  position:absolute;

  width:900px;
  height:900px;

  top:-350px;
  left:-200px;

  background: radial-gradient(
    circle,
    rgba(94,234,212,.05) 0%,
    rgba(94,234,212,.04) 30%,
    rgba(0,0,0,0) 70%
  );

  filter: blur(80px);
  pointer-events:none;
}
.hero > *{
  position: relative;
  z-index: 1;
}
/* === HERO: alinhamento premium (marca à esquerda, selos à direita) === */
.nexus-brand-block{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 16px;
  margin-top: 10px;
}

.nexus-left{
  display:flex;
  flex-direction:column;
  gap: 6px;
  min-width: 0;
}

.nexus-logo{
  margin: 0;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.05;
  letter-spacing: -.03em;
}

.nexus-subtitle{
  color: rgba(234,240,255,.72);
  font-size: 13.5px;
  line-height: 1.25;
  letter-spacing: .01em;
  margin: 0;
}

/* selos não “quebram feio” */
.infra-badge-inline{
  margin: 0;
  justify-content: flex-end;
}

/* === CTA: deixar “magrinho” e elegante === */
.heroCtas{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  margin-top: 14px;
  margin-bottom: 10px; /* respiro para o texto abaixo */
}

/* reduz gordura só no HERO (não mexe no resto do site) */
.hero .btn{
  padding: 9px 14px;
  font-size: 13.5px;
  font-weight: 750;
  letter-spacing: .01em;
}

.hero .btn-primary{
  box-shadow: 0 8px 22px rgba(94,234,212,.10);
  border-color: rgba(94,234,212,.30);
  background: rgba(94,234,212,.10);
}

.hero .btn-primary:hover{
  border-color: rgba(94,234,212,.45);
  background: rgba(94,234,212,.14);
}

/* texto de prova/credenciais com respiro e menor “peso visual” */
.cta-proof,
.cta-cred{
  margin-top: 6px;
  color: rgba(234,240,255,.72);
  font-size: 13.5px;
  line-height: 1.35;
}

/* mobile: empilha selos abaixo da marca */
@media (max-width: 820px){
  .nexus-brand-block{
    flex-direction:column;
    align-items:flex-start;
    gap: 10px;
  }
  .infra-badge-inline{
    justify-content:flex-start;
  }
  /* === Nexus hero: acabamento premium (alinha tudo e tira “peso” do CTA) === */

/* 1) Amarra o bloco marca+subtítulo+selos */
.nexus-brand-block{
  align-items: center;            /* antes estava flex-end */
  margin-top: 12px;
  margin-bottom: 8px;
}

.nexus-left{ gap: 4px; }

.nexus-logo{
  margin: 0;
  line-height: 1.02;
}

/* subtítulo com “cara de assinatura”, não legenda */
.nexus-subtitle{
  font-size: 14px;
  color: rgba(234,240,255,.78);
  letter-spacing: .02em;
  margin-top: 2px;
}

/* selos “descem” e parecem parte do hero */
.infra-badge-inline{
  align-items: center;
  margin-top: 0;
  transform: translateY(6px);     /* baixa levemente sem mexer no HTML */
}

.infra-badge-inline span{
  padding: 6px 10px;              /* menos altos */
  font-size: 11px;
}

/* 2) Respiro do parágrafo principal (lede) */
.hero .lede{
  margin-top: 10px;
  margin-bottom: 14px;
  line-height: 1.6;
  max-width: 74ch;
}

/* 3) CTA “magrinho” no hero (sem mexer no resto do site) */
.heroCtas{
  gap: 10px;
  margin-top: 10px;
  margin-bottom: 12px;            /* cria ar antes do texto abaixo */
}

.hero .btn{
  padding: 7px 12px;              /* afina de verdade */
  font-size: 13px;
  font-weight: 750;
  line-height: 1.05;
  border-radius: 999px;
}

.hero .btn-primary{
  background: rgba(94,234,212,.11);
  border-color: rgba(94,234,212,.32);
  box-shadow: 0 6px 16px rgba(94,234,212,.10);
}

/* textos abaixo do CTA menos “colados” */
.cta-proof, .cta-cred{
  margin-top: 6px;
  line-height: 1.4;
}

/* mobile: garante hierarquia e evita quebra feia */
@media (max-width: 820px){
  .infra-badge-inline{ transform:none; }
  .hero .btn{ padding: 8px 12px; }
}
/* =========================================
   HERO — alinhar conteúdo com eixo do título
   ========================================= */

.hero .lede,
.hero .heroCtas,
.hero .cta-proof,
.hero .cta-cred,
.hero .metaRow{
  margin-left: 28px;   /* ajuste fino do eixo */
}
/* =========================
   HERO — alinhamento + tipografia + CTAs slim
   Cole no FINAL do CSS
   ========================= */

/* 1) Tipografia e respiro do bloco de texto do hero */
section.hero .lede{
  line-height: 1.45;
  margin-top: 10px;
  margin-bottom: 14px; /* dá “ar” antes dos botões */
  max-width: 72ch;
}

/* 2) Alinhar TODO o conjunto do hero no mesmo eixo do H1
   (parágrafo, botões, prova e pills) */
section.hero h1,
section.hero h2,
section.hero .lede,
section.hero .heroCtas,
section.hero .cta-proof,
section.hero .cta-cred,
section.hero .metaRow{
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Se existir algum wrapper interno que esteja “puxando” o texto,
   garanta que o conteúdo do hero não tenha recuo extra */
section.hero .nexus-brand-block,
section.hero .wrap,
section.hero #conteudo{
  padding-left: 0;
}

/* 3) CTAs: espaçamento e comportamento (não esmagar o texto abaixo) */
section.hero .heroCtas{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 12px; /* respiro abaixo dos botões */
}

/* 4) Botões SLIM (magrinhos como na 2ª foto) */
section.hero .btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 9px 14px;     /* <- AFINA a altura */
  border-radius: 999px;
  line-height: 1;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: .2px;

  /* evita botão “gordo” por min-height/line-height herdado */
  min-height: 36px;
  box-sizing: border-box;
}

/* Primary: menos preenchido e mais “clean” */
section.hero .btn.primary{
  padding: 9px 14px;        /* mantém slim */
  border-width: 1px;        /* borda mais fina */
  box-shadow: none;         /* sem volume excessivo */
}

/* Hover sutil (sem inflar visualmente) */
section.hero .btn:hover{
  transform: translateY(-1px);
}

/* 5) Prova/linha abaixo dos botões: dá mais respiro e evita “colar” */
section.hero .cta-proof{
  margin-top: 2px;
  line-height: 1.35;
  opacity: .9;
}

section.hero .cta-cred{
  margin-top: 4px;
  line-height: 1.35;
  opacity: .85;
}

/* 6) Pills: evita que empurrem o bloco pra cima e dá ar */
section.hero .metaRow{
  margin-top: 12px;
  gap: 10px;
}

/* 7) Responsivo: em telas menores, deixa os botões confortáveis */
@media (max-width: 720px){
  section.hero .heroCtas{
    gap: 8px;
    margin-bottom: 14px;
  }
  section.hero .btn{
    font-size: 14px;
    padding: 10px 14px;
    min-height: 38px;
  }
  /* FORÇA HERO CTAs (magrinho + respiro) */
.heroCtas { 
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:10px 0 14px !important;
}

/* se o seu botão é .btn */
.heroCtas .btn{
  padding: 8px 14px !important;   /* <- afina */
  min-height: 34px !important;    /* <- derruba altura herdada */
  line-height: 1 !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  box-sizing: border-box !important;
}

/* primary não pode inflar */
.heroCtas .btn.primary{
  padding: 8px 14px !important;
  border-width: 1px !important;
  box-shadow: none !important;
}

/* respiro do texto abaixo */
.cta-proof, .cta-cred{
  margin-top: 6px !important;
  line-height: 1.35 !important;
}

/* respiro do parágrafo do hero */
.lede{
  line-height: 1.45 !important;
  margin: 10px 0 14px !important;
  max-width: 72ch !important;
}
/* ALINHAR O “GRUPO” DO HERO NO MESMO EIXO (sem recuo estranho) */
.hero h1,
.hero h2,
.hero .lede,
.hero .heroCtas,
.hero .cta-proof,
.hero .cta-cred,
.hero .metaRow{
  margin-left: 0 !important;
  padding-left: 0 !important;
}
/* GARANTIR que o conteúdo do hero não tenha padding extra */
#conteudo .lede,
#conteudo .heroCtas,
#conteudo .cta-proof,
#conteudo .cta-cred,
#conteudo .metaRow{
  margin-left: 0 !important;
  padding-left: 0 !important;
}
body { outline: 3px solid red !important; }
}
.footer{
  border-top:1px solid var(--line);
  margin-top:60px;
  padding:50px 0;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:40px;
}

.footer-brand{
  max-width:320px;
}

.footer-text{
  margin:14px 0;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}

.footer-copy{
  margin-top:16px;
  font-size:12px;
  color:var(--muted2);
}

.footer-title{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted2);
  margin-bottom:10px;
}

.footer-col a{
  display:block;
  font-size:14px;
  color:var(--muted);
  margin:6px 0;
}

.footer-col a:hover{
  color:var(--text);
}

@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr;
  }
  /* HERO — refinamento tipográfico */

.hero h1{
  font-weight:900;
  letter-spacing:-0.8px;
  text-wrap:balance;
}

.lede{
  margin-top:6px;
  font-size: clamp(16px,1.4vw,18px);
  line-height:1.55;
  color:rgba(234,240,255,.72);
}
.btn{
  transition:
    transform .12s ease,
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.btn:hover{
  transform: translateY(-1px);
}

.btn.primary{
  box-shadow:
    0 10px 30px rgba(52,211,153,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
}
.card{
  transition:
    border-color .2s ease,
    transform .15s ease,
    box-shadow .2s ease;
}

.card:hover{
  border-color:rgba(234,240,255,.22);
  transform:translateY(-2px);
}
/* ===== RTNEXUS FOOTER REFINED ===== */

.footer{
  margin-top:40px;
  padding-top:20px;
  border-top:1px solid rgba(234,240,255,.10);
}

.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}

.footer-left{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
}

.footer-desc{
  color:var(--muted2);
  margin-left:8px;
  max-width:420px;
}

.footer-center{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.footer-center a{
  font-size:13px;
  color:var(--muted);
}

.footer-center a:hover{
  color:var(--text);
}

.footer-right .pill{
  font-size:12px;
}

.footer-bottom{
  margin-top:14px;
  font-size:12px;
  color:var(--muted2);
}

@media (max-width:900px){

  .footer-inner{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }

  .footer-desc{
    max-width:none;
  }

}
.footer{
  background:linear-gradient(
    180deg,
    rgba(7,10,16,0) 0%,
    rgba(7,10,16,.6) 40%,
    rgba(7,10,16,1) 100%
  )
  /* ===== FOOTER RTNEXUS ===== */

.footer{
  margin-top:60px;
  padding:60px 0 40px;
  border-top:1px solid rgba(255,255,255,.06);
  background:linear-gradient(
    180deg,
    rgba(10,14,20,0) 0%,
    rgba(10,14,20,.6) 100%
  );
}

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
  max-width:1200px;
  margin:auto;
  padding:0 20px;
}

.footer-brand{
  font-size:14px;
  color:rgba(255,255,255,.7);
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:600;
  font-size:16px;
  margin-bottom:14px;
}

.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#41ff9a;
  box-shadow:0 0 10px #41ff9a;
}

.footer-text{
  margin-bottom:12px;
  line-height:1.5;
}

.footer-infra{
  font-size:12px;
  opacity:.7;
  margin-bottom:12px;
}

.footer-copy{
  font-size:12px;
  opacity:.6;
}

.footer-title{
  font-size:13px;
  margin-bottom:12px;
  font-weight:600;
  opacity:.8;
}

.footer-col a{
  display:block;
  margin-bottom:8px;
  font-size:13px;
  color:rgba(255,255,255,.7);
  text-decoration:none;
  transition:.2s;
}

.footer-col a:hover{
  color:#41ff9a;
}

@media (max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:600px){
  .footer-grid{
    grid-template-columns:1fr;
  }

}
}
}

}
}
}
}
}