:root{
  --navy:#0B1F3A; --graphite:#2B2F36; --off:#F7F8FA; --teal:#2BC4B6; --gold:#C9A227;
}
*{box-sizing:border-box}
html,body{
  margin:0; padding:0; background:var(--off); color:#111;
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;
}
img{max-width:100%; display:block}

.container{max-width:1120px; margin:0 auto; padding:0 20px}

/* HEADER */
header{padding:16px 0; background:#fff; border-bottom:1px solid #eef0f4}
.brand{display:flex; align-items:center; gap:12px}
.brand img{height:44px; width:auto}
.brand h1{margin:0; font-size:1.25rem; color:var(--navy)}
.brand p{margin:2px 0 0; color:#586070; font-size:.95rem}
nav{margin-top:8px}
nav a{margin-right:14px; color:#2b2f36; text-decoration:none; font-weight:600}
nav a:hover{color:var(--navy)}

/* HERO */
.hero{padding:48px 0}
.hero h2{margin:0 0 8px; font-size:2rem; color:var(--navy)}
.hero p{margin:0 0 14px; color:#3b4353; max-width:760px}
.note{
  background:#fff; border:1px solid #e8ebf0; padding:10px 12px;
  border-radius:10px; display:inline-block; color:#374151
}
.cta-row{display:flex; gap:12px; margin-top:16px; flex-wrap:wrap}
.btn{
  display:inline-block; padding:12px 16px; border-radius:12px;
  text-decoration:none; font-weight:700; border:2px solid transparent
}
.btn.primary{background:var(--navy); color:#fff}
.btn.primary:hover{opacity:.95}
.btn.ghost{border-color:var(--navy); color:var(--navy)}
.btn.ghost:hover{background:#e7eef6}
.btn.small{padding:8px 12px; border-radius:10px; font-size:.92rem}
.btn.secondary{background:var(--teal); color:#052b28}

/* SECTIONS & CARDS */
.section{padding:28px 0}
.section h3{margin:0 0 16px; color:var(--navy)}
.grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.grid-2{grid-template-columns:1fr 2fr}
.card{
  background:#fff; border:1px solid #eaecef; border-radius:16px;
  padding:16px; display:flex; flex-direction:column; gap:8px
}
.card.center{align-items:center; justify-content:center}
.logo-nexus-gpt{max-width:260px}
.card h4{margin:6px 0; color:#222}
.card p{margin:0; color:#485063}
.price{margin-top:auto; font-weight:800; color:#111}
.card-cta{display:flex; gap:8px; margin-top:8px; flex-wrap:wrap}

/* TABELA (se ainda usar em outra seção) */
.table{
  background:#fff; border:1px solid #eaecef; border-radius:12px; overflow:hidden
}
.row{
  display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:8px;
  padding:12px 14px; border-top:1px solid #f0f2f6; align-items:center
}
.row.header{background:#f8fafc; border-top:none; font-weight:800}
.row a{color:var(--navy); text-decoration:none}
.row a:hover{text-decoration:underline}

/* ==== PLANOS (cards) ==== */
.plan-note {
  background:#fff; border:1px solid #e8ebf0; padding:10px 12px; border-radius:10px;
  display:inline-block; color:#374151; margin-bottom:14px;
}
.plan-grid {
  display:grid; gap:16px; grid-template-columns:repeat(3, 1fr);
}
.plan {
  background:#fff; border:1px solid #eaecef; border-radius:16px; padding:18px;
  display:flex; flex-direction:column; gap:10px; position:relative;
}
.plan h4 { margin:0; color:#0B1F3A; }
.plan .badge {
  position:absolute; top:14px; right:14px; font-size:.78rem; font-weight:800;
  padding:6px 10px; border-radius:999px; background:#e7eef6; color:#0B1F3A; border:1px solid #d7e2ee;
}
.plan.featured { border:2px solid var(--gold); box-shadow:0 8px 22px rgba(0,0,0,.06); }
.plan.featured .badge { background:var(--gold); color:#2b2f36; border-color:#d9c271; }

.plan .price {
  display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; margin-top:2px;
}
.plan .price .m { font-size:1.45rem; font-weight:800; color:#111; }
.plan .price .y { color:#374151; font-weight:700; }
.promo-note { margin:0; color:#444; font-size:.92rem }

.plan ul { margin:0; padding-left:18px; color:#485063; }
.plan .cta { display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; }
.plan .cta .btn { flex:1; text-align:center; }

/* FOOTER */
footer { background: var(--graphite); color: #e9edf3; margin-top: 40px; }
.footer-inner { padding: 22px 0; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 18px; }
footer .logo { height: 56px; width: auto; margin-bottom: 10px; }
footer a { color: #cfe7ff; text-decoration: none; }
footer a:hover { text-decoration: underline; }
.disclaimer { font-size: .88rem; opacity: .95; margin-top: 10px; max-width: 46ch; }

/* RESPONSIVO */
@media (max-width:1080px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .grid-2{grid-template-columns:1fr}
}
@media (max-width:820px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .row{grid-template-columns:1.6fr .9fr .9fr 1fr}
  .footer-grid { grid-template-columns: 1fr; }
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr}
  .cta-row{flex-direction:column; align-items:flex-start}
  .row{grid-template-columns:1.3fr .8fr .8fr 1fr}
  footer .logo { height: 44px; }
  .plan-grid{grid-template-columns:1fr}
}