:root { --brand:#c62828; --text:#1f2937; --muted:#6b7280; --bg:#ffffff; --bg-alt:#f8fafc; }
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;color:var(--text);background:var(--bg)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* Header */
.header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e5e7eb}
.nav{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:16px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:44px;height:auto}
.brand h1{font-size:18px;line-height:1.1;margin:0}
.brand small{display:block;font-weight:400;color:var(--muted)}

/* Desktop links */
.links{display:flex;align-items:center;gap:18px}
.links a{padding:8px 10px;border-radius:8px;font-weight:600}
/* não aplicar hover nos botões/CTAs do header */
.links a:not(.btn):not(.cta):hover{background:var(--bg-alt)}

/* Mobile menu */
.menu-btn{display:none;border:1px solid #e5e7eb;border-radius:10px;padding:8px 10px;background:#fff}
.mobile{display:none;position:absolute;top:60px;left:0;right:0;background:#fff;border-bottom:1px solid #e5e7eb}
.mobile a{display:block;padding:14px 16px;border-top:1px solid #f1f5f9}
.mobile .cta{margin:10px 16px}
/* opcional: permite usar classe .open em vez de inline style */
.mobile.open{display:block}
@media (max-width:840px){
  .links{display:none}
  .menu-btn{display:inline-flex;align-items:center;gap:8px}
}

/* Hero */
.hero{max-width:1100px;margin:0 auto;padding:40px 16px;display:grid;grid-template-columns:1.1fr 0.9fr;gap:32px;align-items:center}
.hero h2{font-size:36px;line-height:1.15;margin:0 0 10px}
.hero p{margin:0 0 20px;color:var(--muted)}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}

/* Botões/CTAs – baseline unificado */
.btn,
.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:10px;
  font-weight:700;
  border:1px solid transparent;
  text-decoration:none;
}

/* Primário (vermelho) – cobre todos os elementos/estados comuns */
:is(a, button, input[type="button"], input[type="submit"]).btn.primary,
:is(a, button, input[type="button"], input[type="submit"]).btn.primary:link,
:is(a, button, input[type="button"], input[type="submit"]).btn.primary:visited{
  background-color:var(--brand) !important;
  color:#fff !important;
  border-color:transparent !important;
}
:is(a, button, input[type="button"], input[type="submit"]).btn.primary:hover{
  filter:brightness(.95);
}

/* Ghost (contornado) */
.btn.ghost{
  background:#fff;
  color:var(--text);
  border-color:#e5e7eb;
}

/* CTA (link destacado vermelho) */
a.cta,
a.cta:link,
a.cta:visited{
  background-color:var(--brand) !important;
  color:#fff !important;
  border-color:transparent;
}
a.cta:hover{ filter:brightness(.95); }

/* Cards e seções */
.btn{ /* mantém borda em botões não-primários */
  border:1px solid #e5e7eb;
}
.hero-card{background:var(--bg-alt);border:1px solid #e5e7eb;border-radius:16px;padding:18px}
@media (max-width:840px){ .hero{grid-template-columns:1fr} .hero h2{font-size:28px} }

section{scroll-margin-top:80px}
.section{max-width:1100px;margin:0 auto;padding:40px 16px}
.section h3{margin:0 0 10px;font-size:26px}
.section p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.card{border:1px solid #e5e7eb;border-radius:14px;padding:16px;background:#fff}
.card h4{margin:0 0 6px}
.card p{margin:0;color:var(--muted)}
@media (max-width:840px){.cards{grid-template-columns:1fr}}

/* Footer */
footer{border-top:1px solid #e5e7eb;background:#fff}
.footer{max-width:1100px;margin:0 auto;padding:22px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footer a{font-weight:700;color:var(--brand)}

/* Botão flutuante (mobile) */
.float-call{position:fixed;bottom:18px;right:18px;display:none}
@media (max-width:840px){.float-call{display:inline-flex}}