/* Motorcheck Jurídico — estilos */
:root {
  --mc-primary: #2d50d7;
  --mc-dark: #0b1739;
}

body { font-family: 'Open Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif; }
h1,h2,h3,h4,.brand { font-family: 'Jost', 'Open Sans', sans-serif; }

.text-primary { color: var(--mc-primary) !important; }
.btn-primary { background: var(--mc-primary); border-color: var(--mc-primary); }
.btn-outline-primary { border-color: var(--mc-primary); color: var(--mc-primary); }
.btn-outline-primary:hover { background: var(--mc-primary); color: #fff; }

.topbar { background: #f6f8ff; border-bottom: 1px solid rgba(0,0,0,.06); }

.brand span { color: var(--mc-primary); }

.hero {
  background: linear-gradient(180deg, #ffffff 0%, #f3f6ff 100%);
  padding: 64px 0 48px;
}
.hero .hero-card { border: 1px solid rgba(0,0,0,.06); }
.shape-bottom {
  position: absolute; left:0; right:0; bottom:-1px; height: 40px;
  background: radial-gradient(120% 100% at 50% -10%, rgba(45,80,215,.18) 0%, rgba(45,80,215,0) 60%);
}

.py-6 { padding-top: 4rem; padding-bottom: 4rem; }

.feature {
  background: #fff; border: 1px solid rgba(0,0,0,.06); border-radius: 1rem;
}

.list-steps { list-style: none; padding-left: 0; }
.list-steps li { display: flex; align-items: center; gap: .75rem; margin: .5rem 0; }
.list-steps li span {
  display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%;
  background: #eef2ff; color: var(--mc-primary); font-weight:700;
}

.pricing {
  background: #fff; border: 1px solid rgba(0,0,0,.06); border-radius: 1rem; padding: 1.5rem;
}
.pricing.featured { border-width: 2px; border-color: var(--mc-primary); box-shadow: 0 10px 30px rgba(45,80,215,.12); }
.pricing-header .price { font-size: 2rem; font-weight: 700; }
.pricing-header .price small { font-size: 1rem; opacity:.7; margin-right:.25rem; }
.pricing-header .price span { font-size: .95rem; font-weight: 600; opacity:.7; }
.pricing-list { list-style: none; padding-left: 0; margin: 1rem 0 1.5rem; }
.pricing-list li { margin: .35rem 0; }
.pricing-list i { color: var(--mc-primary); }

footer a { text-decoration: none; color: inherit; }
footer a:hover { color: var(--mc-primary); }

@media (max-width: 991px) {
  .hero { padding-top: 36px; }
}
