
/* JUALMA Tecnologia - template.css (dark, charcoal, gold) */
:root{
  --bg-main: #0e0e0e;
  --bg-secondary: #1c1c1c;
  --gold: #d4af37;
  --text-main: #f5f5f5;
  --text-muted: #bbbbbb;
  --container-width: 1100px;
}

*{box-sizing:border-box}
body.jualma-body{
  margin:0;
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  background: var(--bg-main);
  color: var(--text-main);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Container */
.container{
  width:95%;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 30px 0;
}

/* Header */
.jualma-header{
  position: fixed;
  top:0;
  left:0;
  right:0;
  background: rgba(10,10,10,0.85);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(212,175,55,0.06);
  z-index:1000;
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:12px 0;
}
.logo-wrap img.jualma-logo{
  width:160px;
  height:48px;
  object-fit:cover;
  border-radius:6px;
  background:linear-gradient(135deg,#111,#222);
  padding:6px;
}
.jualma-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
.jualma-nav a{color:var(--text-main);text-decoration:none;padding:8px 10px;border-radius:6px;font-weight:600;font-size:0.95rem}
.jualma-nav a:hover{background:rgba(212,175,55,0.06);color:var(--gold)}

/* Buttons */
.btn-gold{background:var(--gold);color:#0b0b0b;padding:10px 16px;border-radius:8px;text-decoration:none;font-weight:700}
.btn-outline{border:2px solid rgba(212,175,55,0.12);color:var(--text-main);padding:10px 14px;border-radius:8px;text-decoration:none;font-weight:700}
.btn-gold:hover{filter:brightness(0.95)}

.hero{
  padding-top:120px;
  padding-bottom:40px;
  background: linear-gradient(180deg, rgba(20,20,20,0.9), rgba(10,10,10,0.6));
}
.hero-inner{display:flex;gap:30px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.hero-text{flex:1;min-width:280px}
.hero-text h1{font-size:2.2rem;margin:0 0 10px;color:var(--text-main)}
.hero-text .lead{font-size:1.1rem;color:var(--text-muted)}
.hero-text .sublead{font-size:0.95rem;color:var(--text-muted);margin-bottom:18px}
.hero-image img{max-width:420px;border-radius:12px;box-shadow:0 6px 30px rgba(0,0,0,0.6);}

/* Quem somos */
.quem-somos{background:var(--bg-secondary);border-radius:10px;padding:40px;margin-top:30px;text-align:center}
.quem-somos h2{color:var(--gold)}

/* Serviços */
.servicos{padding-top:40px}
.servicos h2{color:var(--gold);text-align:center}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:20px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:20px;border-radius:12px;text-align:center;border:1px solid rgba(255,255,255,0.03)}
.card img{width:80px;height:80px;object-fit:contain;margin-bottom:12px}
.card h3{margin:6px 0;color:var(--text-main)}
.card p{color:var(--text-muted);font-size:0.95rem}

/* Contato */
.contato{background:transparent;padding:40px 0;text-align:center;border-top:1px solid rgba(255,255,255,0.02);margin-top:30px}
.contato a{color:var(--gold);text-decoration:none;font-weight:700}

/* Footer */
.jualma-footer{border-top:1px solid rgba(255,255,255,0.03);padding:18px 0;text-align:center;color:var(--text-muted);background:transparent}

/* Responsive */
@media (max-width:800px){
  .logo-wrap img.jualma-logo{width:130px}
  .hero-image img{max-width:320px}
  .header-inner{padding:8px 0}
  .jualma-nav{display:none}
}
