:root{
  --brand-blue:#0A1D3A;
  --brand-blue-2:#16315E;
  --brand-orange:#FF6A00;
  --brand-orange-2:#FF8A33;
  --text:#101217;
  --muted:#6B7280;
  --bg:#FFFFFF;
  --panel:#F5F7FB;
  --radius:18px;
  --shadow:0 10px 30px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Arial; color:var(--text); background:var(--bg)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1120px,92vw);margin:auto}
.btn{display:inline-flex;gap:.6rem;align-items:center;padding:.9rem 1.2rem;border-radius:calc(var(--radius) - 6px);font-weight:700;cursor:pointer}
.btn.primary{background:var(--brand-orange);color:#fff;box-shadow:var(--shadow)}
.btn.primary:hover{filter:brightness(.96)}
.btn.outline{border:2px solid var(--brand-orange);color:var(--brand-orange)}
/* Header */
header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.75);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid #eaeef7}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.75rem}
.brand img{height:60px;width:auto}
.brand .name{font-weight:800;letter-spacing:.3px}
.nav .links{display:flex;gap:1.2rem;align-items:center}
.nav .links a{color:#334155;font-weight:600}
.nav .links a:hover{color:var(--brand-orange)}
/* Hero */
.hero{position:relative;isolation:isolate;overflow:hidden; background: radial-gradient(1200px 600px at 20% 10%, rgba(255,106,0,.12), transparent 60%), radial-gradient(1000px 500px at 80% 30%, rgba(10,29,58,.25), transparent 55%), linear-gradient(135deg, #0A1D3A 0%, #0f2752 40%, #132b58 100%);}
.hero::after{content:""; position:absolute; inset:0; background: url("assets/robot-consultor.svg") right -6% top 30% / 60% auto no-repeat; opacity:1; pointer-events:none;}
.hero .inner{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;padding:4.5rem 0}
.super{display:inline-flex;align-items:center;gap:.5rem;background:#0a1d3a10;border:1px solid #0a1d3a1c;color:#cfe3ff;padding:.35rem .7rem;border-radius:999px;font-weight:700;margin-bottom:1rem}
.title{font-size:clamp(1.9rem, 2.6vw + 1rem, 3.2rem);line-height:1.08;margin:0 0 .75rem 0;font-weight:900;color:#eaf2ff}
.subtitle{color:#d7e3ff;font-size:1.1rem;max-width:52ch}
.cta{margin-top:1.4rem;display:flex;gap:.8rem;flex-wrap:wrap}
.hero-card{background:linear-gradient(180deg, #ffffffcc, #ffffff);border:1px solid #e9eef9;border-radius:var(--radius);padding:1.2rem;box-shadow:var(--shadow)}
/* Sections */
section{padding:3.6rem 0}
h2.section-title{font-size:2rem;margin:0 0 1.2rem 0}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.kpis .kpi{background:var(--brand-blue-2);border-radius:var(--radius);padding:1.2rem;text-align:center;color:#fff;border:1px solid var(--brand-orange)}
.kpi b{font-size:1.6rem;color:var(--brand-orange)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.card{background:#fff;border:1px solid #e9eef9;border-radius:var(--radius);padding:1.2rem;box-shadow:var(--shadow)}
.card h3{margin:.2rem 0 .4rem;font-size:1.1rem}
.tag{display:inline-block;background:#0a1d3a0f;color:var(--brand-blue);padding:.25rem .55rem;border-radius:999px;font-size:.8rem;font-weight:700}
/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.step{background:var(--brand-blue-2);border-radius:var(--radius);padding:1.2rem;border:1px solid var(--brand-orange);color:#fff}
/* FAQ */
details{background:#fff;border:1px solid #e9eef9;border-radius:var(--radius);padding:1rem;margin:.6rem 0}
summary{cursor:pointer;font-weight:700}
/* CTA Final */
.cta-final{background:var(--brand-blue);color:#fff;border-radius:calc(var(--radius) + 6px);padding:2rem;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:1.5rem}
.cta-final .btn{background:var(--brand-orange);}
/* Footer */
footer{background:#0b1322;color:#c9d4ef;padding:2rem 0;margin-top:2rem}
footer a{color:#e7efff}
/* WhatsApp Float */
.wpp{position:fixed;bottom:18px;right:18px;z-index:50;display:flex;align-items:center;gap:.6rem;background:#25D366;color:#fff;padding:.9rem 1rem;border-radius:999px;box-shadow:0 10px 24px rgba(37,211,102,.45)}
.wpp:hover{transform:translateY(-2px)}
.wpp svg{width:22px;height:22px}
/* Responsive */
@media (max-width: 980px){
  .hero .inner{grid-template-columns:1fr; padding:2.8rem 0}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2,1fr)}
  .cta-final{grid-template-columns:1fr}
  .hero::after{background-position: right -16% top 35%; background-size: 85% auto;}
}
@media (max-width: 520px){
  .kpis{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
}
/* Fade-in */
[data-anim]{opacity:0;transform:translateY(12px);animation:fadeUp .8s ease forwards;}
[data-anim="2"]{animation-delay:.12s}
[data-anim="3"]{animation-delay:.24s}
[data-anim="4"]{animation-delay:.36s}
@keyframes fadeUp{to{opacity:1; transform:none}}


.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
}

.service-card {
  background: #1a1a1a;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
}

.service-card img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.service-card .card-content {
  padding: 0.8rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.service-card .card-tag {
  display: inline-block;
  background: var(--brand-orange);
  color: #fff;
  padding: .25rem .55rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.service-card h3 {
  font-size: 0.95rem;
  color: #fff;
  margin: 0.3rem 0;
  line-height: 1.3;
}

.service-card p {
  font-size: 0.8rem;
  color: #ccc;
  line-height: 1.3;
}

/* Adjustments for existing elements to match new card style */
.card {
  background: #1a1a1a;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #fff;
}

.card h3 {
  color: #fff;
}

.tag {
  background: rgba(255, 255, 255, 0.1);
  color: var(--brand-orange);
}

@media (max-width: 1200px) {
  .services-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

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

@media (max-width: 768px) {
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

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



/* Specific styles for agents grid */
#agentes-grid {
  grid-template-columns: repeat(5, 1fr);
}

/* Specific styles for other services grid */
#outros-servicos-grid {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1200px) {
  #agentes-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  
  #outros-servicos-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 980px) {
  #agentes-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  #outros-servicos-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  #agentes-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  #outros-servicos-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  #agentes-grid {
    grid-template-columns: 1fr;
  }
  
  #outros-servicos-grid {
    grid-template-columns: 1fr;
  }
}