/* RAPID Seguros e Rastreadores - Estilos custom */
:root{
  --primary:#0E3A67; /* azul principal RAPID */
  --accent:#8CC63F; /* verde RAPID (pingo do i) */
  --gray:#6B7280; /* slate-500 */
}

html{scroll-behavior:smooth}

/* Microanimações suaves (mantidas com intensidade menor) */
.card, .plan-card, .testimonial, .assist-item{transition:transform .15s ease, box-shadow .15s ease}
.card:hover, .plan-card:hover, .testimonial:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(0,0,0,.05)}
.assist-item:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(2,6,23,.06)}

.icon i, .assist-item i{transition:color .2s ease, opacity .2s ease}

.btn-cta{transition:filter .2s, transform .05s}
.btn-cta:hover{filter:brightness(1.05)}
.btn-cta:active{transform:translateY(1px)}


/* Componentes utilitários que complementam o Tailwind */
.label{display:block;font-size:.875rem;color:#334155;margin-bottom:.375rem}
.input{width:100%;border:1px solid #E2E8F0;border-radius:.75rem;padding:.625rem .875rem;background:#fff;outline:none;transition:box-shadow .2s,border-color .2s}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(140,198,63,.15)}
.btn-cta{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--accent);color:var(--primary);padding:.75rem 1rem;border-radius:.75rem;font-weight:600;box-shadow:0 10px 25px rgba(140,198,63,.3);border:2px solid var(--primary)}
.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:#fff;color:var(--primary);padding:.75rem 1rem;border-radius:.75rem;font-weight:600;border:2px solid var(--primary)}

/* Cards */
.card{background:#fff;border:1px solid #E2E8F0;border-radius:1rem;padding:1rem;box-shadow:0 1px 2px rgba(2,6,23,.04)}
.card .icon{height:48px;width:48px;border-radius:.75rem;display:flex;align-items:center;justify-content:center;background:rgba(140,198,63,.12);color:var(--accent);font-size:1.25rem;margin-bottom:.75rem}
.card .title{font-weight:700;color:var(--primary)}
.card .desc{color:#475569;font-size:.95rem}

/* Steps */
.step{background:#fff;border:1px solid #E2E8F0;border-radius:1rem;padding:1rem;position:relative}
.step-number{position:absolute;top:-12px;left:-12px;height:36px;width:36px;border-radius:.75rem;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}

/* Planos */
.plan-card{background:#fff;border:1px solid #E2E8F0;border-radius:1rem;padding:1rem;box-shadow:0 1px 2px rgba(2,6,23,.04)}
.plan-card .features{margin-top:.75rem}
/* Espaço equivalente a uma linha antes dos bullets (adiciona espaço acima da lista) */
.mt-line{margin-top:1em}
.plan-card .features li{display:flex;gap:.5rem;align-items:center;color:#334155}
.plan-card .features i{color:var(--accent)}
/* Espaçamento entre textos e botões nos cards de plano (padrão) */
.plan-card .btn-cta{margin-top:20px}
/* Alinhar botões dos planos Essencial e Proteção com o Premium */
#planos .grid > .plan-card:nth-child(1),
#planos .grid > .plan-card:nth-child(2){display:flex;flex-direction:column}
#planos .grid > .plan-card:nth-child(1) .features,
#planos .grid > .plan-card:nth-child(2) .features{margin-bottom:20px}
#planos .grid > .plan-card:nth-child(1) .btn-cta,
#planos .grid > .plan-card:nth-child(2) .btn-cta{margin-top:auto}

.badge{background:#F1F5F9;color:#0f172a;border:1px solid #E2E8F0;font-size:.75rem;padding:.25rem .5rem;border-radius:.5rem}
.badge-accent{background:rgba(140,198,63,.12);color:#4F7A1A;border-color:rgba(140,198,63,.35)}

/* Depoimentos */
.testimonial{background:#fff;border:1px solid #E2E8F0;border-radius:1rem;padding:1rem;box-shadow:0 1px 2px rgba(2,6,23,.04)}

/* Assistência */
.assist-item{background:rgba(255,255,255,.85);border:1px solid #E2E8F0;border-radius:1rem;padding:.875rem 1rem;display:flex;align-items:center;gap:.5rem;box-shadow:0 1px 2px rgba(2,6,23,.03);transition:transform .15s ease, box-shadow .15s ease}
.assist-item i{color:var(--accent); font-size:1rem}

/* Botões e links - estados de foco e consistência */
button, .btn-cta, .btn-secondary, a{
  outline: none;
}
button:focus-visible, .btn-cta:focus-visible, .btn-secondary:focus-visible, a:focus-visible{
  box-shadow: 0 0 0 3px rgba(140,198,63,.35), 0 0 0 6px rgba(255,255,255,.9);
  border-radius:.75rem;
}

/* WhatsApp Float */
.whatsapp-float{position:fixed;right:1rem;bottom:1rem;height:56px;width:56px;border-radius:9999px;background:#25D366;color:white;display:flex;align-items:center;justify-content:center;font-size:1.5rem;box-shadow:0 10px 25px rgba(37,211,102,.4);z-index:50}
.whatsapp-float:hover{filter:brightness(1.05)}

/* Radar Effect */
.radar{background:
  radial-gradient(circle at 30% 30%, rgba(140,198,63,.25), transparent 40%),
  radial-gradient(circle at 70% 60%, rgba(51,168,220,.25), transparent 45%),
  url('https://images.unsplash.com/photo-1517940310602-75f39fa4971e?auto=format&fit=crop&w=1600&q=60');
  background-size:cover;
  filter:saturate(1.05) contrast(1.05);
}

/* Acessibilidade */
:focus-visible{outline:2px dashed var(--accent);outline-offset:2px}

/* Textura discreta para a seção FAQ (coerente com o visual do site) */
.faq-texture{
  background:
    radial-gradient(circle at 12% 8%, rgba(2,6,23,.04), transparent 35%),
    radial-gradient(circle at 88% 16%, rgba(2,6,23,.035), transparent 40%),
    radial-gradient(circle at 20% 84%, rgba(140,198,63,.05), transparent 46%),
    linear-gradient(to bottom, #ffffff 0%, #f8fafc 100%);
}

/* Chart responsive height (menor no mobile) */
/* Redução de ~60% no mobile (de 360px para 144px) */
.chart-card{width:100%;max-width:100%}
.chart-canvas{display:block;width:100% !important;height:144px}
@media (min-width:640px){.chart-canvas{height:240px}}
@media (min-width:1024px){.chart-canvas{height:360px}}
