/* ===== Reset leve ===== */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color:#0b1220;
  background:#ffffff;
  line-height:1.55;
}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid rgba(214,40,40,.35); outline-offset:2px}

.container{
  width:min(1120px, 92vw);
  margin:0 auto;
}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  border-radius:14px;
  padding:.85rem 1rem;
  font-weight:700;
  border:1px solid transparent;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
  user-select:none;
}
.btn:hover{transform: translateY(-1px)}
.btn:active{transform: translateY(0)}
.btn-lg{padding:1rem 1.15rem;border-radius:16px}
.btn-block{width:100%}

.btn-primary{
  background: var(--red);
  color:#fff;
  box-shadow: 0 10px 26px rgba(214,40,40,.22);
}
.btn-primary:hover{box-shadow: 0 14px 34px rgba(214,40,40,.26)}
.btn-ghost{
  background:#fff;
  color: var(--blue);
  border-color: rgba(10,42,102,.18);
}
.btn-ghost:hover{border-color: rgba(10,42,102,.28); box-shadow:0 10px 26px rgba(10,42,102,.10)}

/* ===== Topbar ===== */
.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(10,42,102,.10);
}
.topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.85rem 0;
  gap:1rem;
}
.brand{
  display:flex;
  align-items:center;
  gap:.65rem;
}
.brand-mark{
  width:36px;height:36px;border-radius:12px;
  background:
    linear-gradient(135deg, var(--blue), #1b4fb8);
  position:relative;
}
.brand-mark:after{
  content:"";
  position:absolute; inset:8px;
  border-radius:10px;
  background: linear-gradient(135deg, var(--red), #ff5a5a);
  opacity:.22;
}
.brand-name{
  font-weight:900;
  letter-spacing:-.02em;
}

.nav{
  display:flex;
  align-items:center;
  gap:1rem;
}
.nav a{font-weight:700; color:#0b1220; opacity:.9}
.nav a:hover{opacity:1}
.hamb{display:none; border:1px solid rgba(10,42,102,.18); background:#fff; border-radius:14px; padding:.6rem .65rem}
.hamb span{display:block; width:20px; height:2px; background:#0b1220; margin:4px 0; border-radius:10px}

.mobile-nav{
  display:none;
  padding: .75rem 0 1rem;
  border-top:1px solid rgba(10,42,102,.08);
}
.mobile-nav a{
  display:block;
  padding:.8rem 0;
  font-weight:800;
}
.mobile-nav .btn{margin-top:.6rem}

/* ===== Hero ===== */
.hero{
  padding: 3.2rem 0 2.2rem;
  background:
    radial-gradient(1200px 500px at 10% 0%, rgba(10,42,102,.10), transparent 55%),
    radial-gradient(900px 500px at 85% 10%, rgba(214,40,40,.10), transparent 55%),
    linear-gradient(#fff, #fbfcff);
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 2rem;
  align-items: start;
}
.pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.45rem .7rem;
  border-radius:999px;
  border:1px solid rgba(10,42,102,.14);
  background: rgba(255,255,255,.75);
  font-weight:800;
  color: var(--blue);
}
h1{
  margin:.9rem 0 .6rem;
  font-size: clamp(2rem, 3.6vw, 3.1rem);
  line-height:1.06;
  letter-spacing:-.03em;
}
.lead{
  font-size:1.08rem;
  color:#1c2433;
  opacity:.92;
  margin:0 0 1.2rem;
}
.hero-cta{display:flex; gap:.8rem; flex-wrap:wrap; margin: 1.05rem 0 1.2rem}

.trust{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1.2rem;
}
.trust-item{
  border:1px solid rgba(10,42,102,.12);
  background: rgba(255,255,255,.78);
  border-radius:16px;
  padding:.85rem .9rem;
}
.trust-title{display:block; font-weight:900}
.trust-desc{display:block; color:#4a5568; font-weight:700; font-size:.92rem; margin-top:.15rem}

.hero-card{position:relative}
.card{
  background:#fff;
  border:1px solid rgba(10,42,102,.12);
  border-radius:20px;
  box-shadow: 0 18px 50px rgba(10,42,102,.10);
  padding: 1.2rem 1.2rem 1.1rem;
}
.card h2{margin:.1rem 0 .35rem; letter-spacing:-.02em}
.muted{color:#4a5568; font-weight:650}
.mini{margin: 1rem 0 1.05rem; display:grid; gap:.55rem}
.mini-row{display:flex; justify-content:space-between; gap:1rem; padding:.65rem .7rem; border-radius:14px; background: rgba(10,42,102,.04); border:1px solid rgba(10,42,102,.08)}
.mini-label{color:#4a5568; font-weight:800}
.mini-value{font-weight:900}
.fineprint{font-size:.88rem; color:#667085; margin:.85rem 0 0}

.stripe{
  position:absolute;
  inset:auto -10px -10px auto;
  width:140px;
  height:140px;
  border-radius: 26px;
  overflow:hidden;
  box-shadow: 0 18px 40px rgba(11,18,32,.10);
  transform: rotate(6deg);
  border:1px solid rgba(255,255,255,.75);
}
.stripe span{display:block; height:16.666%}
.stripe span:nth-child(odd){background: var(--blue)}
.stripe span:nth-child(even){background: var(--red)}

/* ===== Sections ===== */
.section{padding: 3rem 0}
.section.alt{
  background:
    radial-gradient(900px 450px at 15% 0%, rgba(10,42,102,.06), transparent 50%),
    radial-gradient(900px 450px at 85% 10%, rgba(214,40,40,.06), transparent 55%),
    #ffffff;
  border-top:1px solid rgba(10,42,102,.06);
  border-bottom:1px solid rgba(10,42,102,.06);
}
.section-head{display:flex; justify-content:space-between; gap:1rem; align-items:flex-end; margin-bottom: 1.25rem}
.section-head h2{margin:0; font-size: clamp(1.6rem, 2.4vw, 2rem); letter-spacing:-.02em}
.section-head p{margin:0}

/* ===== Cards grids ===== */
.grid-3{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem}
.grid-2{display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem}

.service{
  border:1px solid rgba(10,42,102,.12);
  border-radius:20px;
  padding: 1.1rem;
  background:#fff;
  box-shadow: 0 12px 30px rgba(10,42,102,.06);
}
.service h3{margin:.2rem 0 .5rem; letter-spacing:-.02em}
.service p{margin:0 0 .7rem; color:#334155; font-weight:650}
.check{margin:.7rem 0 .9rem; padding-left: 1.1rem}
.check li{margin:.25rem 0; color:#1f2937; font-weight:700}
.link{
  color: var(--red);
  font-weight:900;
}
.link:hover{text-decoration:underline}

.highlight{
  margin-top: 1rem;
  padding: 1.1rem;
  border-radius: 22px;
  border: 1px solid rgba(214,40,40,.18);
  background: rgba(214,40,40,.06);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.highlight h3{margin:.2rem 0 .35rem; letter-spacing:-.02em}
.highlight p{margin:0}

/* ===== Fees ===== */
.fee-card{
  border:1px solid rgba(10,42,102,.12);
  border-radius:20px;
  padding: 1.1rem;
  background:#fff;
  box-shadow: 0 12px 30px rgba(10,42,102,.06);
}
.fee-card h3{margin:.2rem 0 .35rem}
.big{font-size:2rem; margin:.2rem 0 .5rem; letter-spacing:-.02em}

/* ===== Steps ===== */
.steps{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.step{
  border:1px solid rgba(10,42,102,.12);
  border-radius:20px;
  padding: 1.1rem;
  background:#fff;
  box-shadow: 0 12px 30px rgba(10,42,102,.06);
}
.num{
  display:inline-flex;
  width:36px;height:36px;
  align-items:center; justify-content:center;
  border-radius:14px;
  background: rgba(10,42,102,.08);
  border:1px solid rgba(10,42,102,.10);
  font-weight:950;
  color: var(--blue);
}
.step h3{margin:.65rem 0 .35rem}
.step p{margin:0; color:#334155; font-weight:650}

.cta-band{
  margin-top: 1.1rem;
  border-radius: 22px;
  padding: 1.2rem;
  border:1px solid rgba(10,42,102,.14);
  background: linear-gradient(135deg, rgba(10,42,102,.08), rgba(214,40,40,.06));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.cta-band h3{margin:.1rem 0 .25rem}
.cta-band p{margin:0}

/* ===== FAQ ===== */
.faq details{
  border:1px solid rgba(10,42,102,.12);
  border-radius:18px;
  padding: .9rem 1rem;
  background:#fff;
  box-shadow: 0 12px 30px rgba(10,42,102,.05);
  margin-bottom:.75rem;
}
.faq summary{
  cursor:pointer;
  font-weight:900;
  letter-spacing:-.01em;
}
.faq p{margin:.65rem 0 0; color:#334155; font-weight:650}

/* ===== Footer ===== */
.footer{
  padding: 2.5rem 0 1.3rem;
  background:#0b1220;
  color:#e8eefc;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.4fr .8fr .8fr;
  gap:1.2rem;
  align-items:start;
}
.footer a{color:#e8eefc; opacity:.9}
.footer a:hover{opacity:1; text-decoration:underline}
.footer-col h4{margin:.2rem 0 .6rem}
.footer-bottom{
  margin-top: 1.6rem;
  padding-top: 1rem;
  border-top:1px solid rgba(232,238,252,.12);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  font-weight:700;
}
.footer-brand .brand-mark{box-shadow: 0 12px 24px rgba(0,0,0,.25)}
.footer .muted{color: rgba(232,238,252,.72)}

/* ===== WhatsApp Float ===== */
.wa-float{
  position:fixed;
  right: 16px;
  bottom: 16px;
  z-index:60;
  background:#25D366;
  color:#fff;
  padding:.85rem 1rem;
  border-radius: 999px;
  font-weight:950;
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.3);
}
.wa-float:hover{transform: translateY(-1px)}
.wa-float span{display:inline-block}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .hero-grid{grid-template-columns: 1fr; }
  .trust{grid-template-columns: 1fr; }
  .grid-3{grid-template-columns: 1fr; }
  .grid-2{grid-template-columns: 1fr; }
  .steps{grid-template-columns: 1fr; }
  .footer-grid{grid-template-columns: 1fr; }
  .nav{display:none}
  .hamb{display:inline-block}
  .mobile-nav{display:none}
  .mobile-nav.open{display:block}
}



/* =========================
   TRUST + SALES THEME PATCH
   cole no FINAL do style.css
========================= */

:root{
  --navy: #0B1F3B;
  --navy-2:#0A2A66;
  --cta:  #C1121F;
  --cta-2:#E11D2E;
  --ink:  #0B1220;
  --muted:#526175;
  --bg:   #F6F8FC;
  --card: #FFFFFF;
  --line: rgba(11,31,59,.12);
  --shadow: 0 18px 50px rgba(11,31,59,.10);
}

/* base */
body{
  color: var(--ink);
  background: var(--bg);
}
.muted{ color: var(--muted); font-weight: 650; }
.section.alt{
  background:
    radial-gradient(900px 450px at 15% 0%, rgba(11,31,59,.06), transparent 55%),
    radial-gradient(900px 450px at 85% 10%, rgba(193,18,31,.06), transparent 55%),
    var(--bg);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.section{ background: transparent; }

/* topbar mais “premium” */
.topbar{
  background: rgba(255,255,255,.92);
  border-bottom:1px solid var(--line);
}
.nav a{ color: var(--ink); opacity:.92; }
.nav a:hover{ opacity:1; }

/* botões mais persuasivos */
.btn{
  border-radius: 16px;
  letter-spacing: .2px;
}
.btn-primary{
  background: linear-gradient(135deg, var(--cta), var(--cta-2));
  box-shadow: 0 16px 34px rgba(193,18,31,.22);
}
.btn-primary:hover{
  box-shadow: 0 20px 46px rgba(193,18,31,.28);
}
.btn-ghost{
  background: #fff;
  color: var(--navy);
  border-color: rgba(11,31,59,.18);
  box-shadow: 0 10px 26px rgba(11,31,59,.06);
}
.btn-ghost:hover{
  border-color: rgba(11,31,59,.26);
  box-shadow: 0 16px 38px rgba(11,31,59,.10);
}

/* HERO mais “confiança + autoridade” */
.hero{
  background:
    radial-gradient(1200px 520px at 8% 0%, rgba(11,31,59,.12), transparent 56%),
    radial-gradient(900px 520px at 92% 10%, rgba(193,18,31,.10), transparent 58%),
    linear-gradient(#ffffff, var(--bg));
  border-bottom: 1px solid var(--line);
}
.pill{
  border: 1px solid rgba(11,31,59,.16);
  background: rgba(255,255,255,.85);
  color: var(--navy);
}
h1{
  color: var(--navy);
}
.lead{
  color: #1b2a3f;
}

/* cards e caixas (mais limpos) */
.card, .service, .fee-card, .step, .faq details, .why-main{
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

/* mini rows mais “consultoria” */
.mini-row{
  background: rgba(11,31,59,.035);
  border: 1px solid rgba(11,31,59,.10);
}
.mini-label{ color: var(--muted); }
.mini-value{ color: var(--ink); }

/* trust cards com destaque sutil */
.trust-item{
  border:1px solid rgba(11,31,59,.12);
  background: rgba(255,255,255,.86);
}
.trust-title{ color: var(--navy); }

/* bloco “antecipar vagas” mais vendedor */
.highlight{
  border: 1px solid rgba(193,18,31,.20);
  background: rgba(193,18,31,.06);
}
.highlight h3{ color: var(--navy); }

/* WHY SDC refinado */
.why{
  background:
    radial-gradient(900px 450px at 15% 0%, rgba(11,31,59,.08), transparent 60%),
    radial-gradient(900px 450px at 85% 10%, rgba(193,18,31,.07), transparent 60%),
    linear-gradient(#ffffff, var(--bg));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.why-point{
  background: rgba(11,31,59,.03);
  border: 1px solid rgba(11,31,59,.12);
}
.badge{
  background: rgba(193,18,31,.10);
  border: 1px solid rgba(193,18,31,.20);
}

/* FAQ mais clean */
.faq summary{ color: var(--navy); }

/* WhatsApp flutuante mais “premium” */
.wa-float{
  border-radius: 999px;
  box-shadow: 0 20px 50px rgba(0,0,0,.18);
}

/* rodapé mais “autoridade” */
.footer{
  background: var(--navy);
}
.footer .muted{ color: rgba(255,255,255,.78); }

/* melhora da “marca” caso ainda use brand-mark em algum lugar */
.brand-mark{
  background: linear-gradient(135deg, var(--navy), var(--navy-2));
}
.brand-mark:after{
  background: linear-gradient(135deg, var(--cta), var(--cta-2));
}
