/* styles.css - simples, responsivo e pronto para personalizar */
:root{
  --accent:#0b6efd;
  --bg:#f7f8fb;
  --text:#111;
  --muted:#555;
  --card:#fff;
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:var(--text); background:var(--bg); line-height:1.5}
.container{max-width:1100px; margin:0 auto; padding:28px}
.site-header{background:#fff; box-shadow:0 2px 6px rgba(10,10,10,0.04); position:sticky; top:0; z-index:50}
.header-inner{display:flex; gap:16px; align-items:center; justify-content:space-between}
.brand{display:flex; gap:12px; align-items:center}
.logo{width:64px; height:64px}
.nav a{margin:0 8px; text-decoration:none; color:var(--muted)}
.nav .cta{background:var(--accent); color:#fff; padding:10px 14px; border-radius:8px; text-decoration:none}
.menu-toggle{display:none; background:none; border:0; font-size:20px}

/* Hero */
.hero{padding:72px 0; background:linear-gradient(180deg, rgba(11,110,253,0.05), transparent); border-bottom:1px solid rgba(0,0,0,0.03)}
.hero h2{font-size:32px; margin:0 0 12px}
.lead{font-size:18px; color:var(--muted)}
.primary-btn{display:inline-block; margin-top:12px; background:var(--accent); color:#fff; padding:12px 18px; border-radius:10px; text-decoration:none}

/* Sections */
.section{padding:42px 0; background:transparent}
.features-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px; margin-top:18px}
.service-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px}
.card{background:var(--card); padding:18px; border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,0.04)}
.product-list{list-style:disc; padding-left:18px}

/* Clients */
.client-logos{display:flex; gap:12px; flex-wrap:wrap}
.client{background:rgba(0,0,0,0.04); padding:16px; border-radius:8px}

/* Contact */
.contact-grid{display:grid; grid-template-columns:1fr 320px; gap:18px}
form label{display:block; margin-bottom:10px}
input, textarea{width:100%; padding:10px; border:1px solid rgba(0,0,0,0.08); border-radius:8px}
.primary-btn{border:0; cursor:pointer}

/* Footer */
.site-footer{background:#fff; border-top:1px solid rgba(0,0,0,0.04); padding:18px 0; margin-top:28px}
.footer-inner{display:flex; justify-content:space-between; align-items:center}

/* Responsive */
@media(max-width:900px){
  .nav{display:none}
  .menu-toggle{display:block}
  .contact-grid{grid-template-columns:1fr}
  .header-inner{padding:10px}
}