/* Página inicial — usa as cores do style.css */

.btn-lg{font-size:14.5px; padding:12px 20px; border-radius:9px;}
.btn i{font-size:17px;}

/* ---------- Topo em duas colunas ---------- */
.home-hero{
  display:grid; grid-template-columns:1.05fr 1fr; gap:48px; align-items:center;
  padding-top:64px; padding-bottom:56px;
}
.home-hero .eyebrow{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--green-text); margin-bottom:14px;}
.home-hero h1{font-size:clamp(30px,4vw,46px); line-height:1.12; margin-bottom:18px;}
.home-hero h1 span{color:var(--green-text);}
.home-hero .lead{font-size:16px; max-width:520px; margin-bottom:26px;}
.home-actions{display:flex; gap:10px; flex-wrap:wrap;}

.home-stats{list-style:none; padding:0; margin:34px 0 0; display:flex; gap:28px; flex-wrap:wrap;}
.home-stats li{display:flex; flex-direction:column; padding-left:14px; border-left:2px solid var(--green);}
.home-stats strong{font-family:var(--font-head); font-size:24px; font-weight:600; color:var(--white); line-height:1.2;}
.home-stats span{font-size:12.5px; color:var(--muted);}

.home-hero-sim{
  position:relative; display:block; border-radius:14px; overflow:hidden;
  border:1px solid rgba(0,200,255,.28); background:#0a1418;
  box-shadow:0 20px 50px rgba(0,0,0,.45), 0 0 0 6px rgba(47,174,82,.05);
  transition:transform .2s, box-shadow .2s;
}
.home-hero-sim:hover{transform:translateY(-3px); box-shadow:0 26px 60px rgba(0,0,0,.5), 0 0 0 6px rgba(0,200,255,.08);}
.home-hero-sim img{width:100%;}
.sim-tag{
  position:absolute; top:12px; left:12px; display:inline-flex; align-items:center; gap:4px;
  font-family:var(--font-mono); font-size:11px; padding:5px 10px; border-radius:6px;
  background:#0b0d0c; border:1px solid var(--border-strong); color:var(--green-text);
}
.sim-hint{
  position:absolute; right:12px; bottom:12px; display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:500; padding:6px 11px; border-radius:6px; background:var(--green); color:#07140c;
}

/* ---------- O que tem aqui ---------- */
.home-features{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.feature{background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:22px;}
.feature .ic,.home-areas .ic{
  width:38px; height:38px; border-radius:9px; background:var(--green-dark); color:var(--green-text);
  display:flex; align-items:center; justify-content:center; font-size:19px; margin-bottom:14px;
}
.feature h3{font-size:16px; margin-bottom:6px;}
.feature p{font-size:13.5px; margin:0;}

/* ---------- Áreas ---------- */
.home-head-row{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.home-head-row p{margin:0; font-size:14px;}
.home-areas{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.home-areas .area-card{display:flex; flex-direction:column;}
.home-areas .area-card p{margin-bottom:14px;}
.home-areas .go{margin-top:auto; font-size:13px; font-weight:500; color:var(--green-text); display:inline-flex; align-items:center; gap:4px;}
.home-areas .area-card:hover .go i{transform:translateX(3px);}
.home-areas .go i{transition:transform .15s;}
.area-sim{border-color:rgba(0,200,255,.3); background:linear-gradient(160deg, rgba(0,200,255,.08), transparent 60%), var(--card);}
.area-sim .ic{background:rgba(0,200,255,.12); color:#5fd4ff;}
.area-sim .go{color:#5fd4ff;}

/* ---------- Simulador ---------- */
.home-sim{
  display:grid; grid-template-columns:1fr 1.1fr; gap:40px; align-items:center;
  padding:40px; border-radius:16px; border:1px solid var(--border);
  background:linear-gradient(140deg, rgba(47,174,82,.12), transparent 55%), var(--bg-alt);
}
.home-sim .eyebrow,.home-about .eyebrow{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--green-text); margin-bottom:8px;}
.home-sim h2{font-size:clamp(22px,2.6vw,30px);}
.home-sim p{margin-bottom:22px; max-width:440px;}
.home-steps{list-style:none; counter-reset:passo; padding:0; margin:0; display:grid; gap:12px;}
.home-steps li{
  counter-increment:passo; position:relative; padding:14px 16px 14px 58px;
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius);
}
.home-steps li::before{
  content:counter(passo); position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border-radius:7px; background:var(--green); color:#07140c;
  font-family:var(--font-head); font-weight:600; display:flex; align-items:center; justify-content:center;
}
.home-steps strong{display:block; font-size:14.5px; color:var(--white);}
.home-steps span{font-size:13px; color:var(--muted);}

/* ---------- Quem está por trás ---------- */
.home-about{
  display:grid; grid-template-columns:150px 1fr; gap:30px; align-items:center;
  padding:30px; border-radius:16px; border:1px solid var(--border); background:var(--card);
}
.home-about img{width:150px; height:150px; object-fit:cover; border-radius:14px; border:2px solid var(--green-dark);}
.home-about h2{font-size:24px; margin-bottom:8px;}
.home-about p{max-width:720px; margin-bottom:16px;}

/* ---------- Celular e tablet ---------- */
@media (max-width:980px){
  .home-hero{grid-template-columns:1fr; gap:34px; padding-top:44px;}
  .home-features,.home-areas{grid-template-columns:repeat(2,1fr);}
  .home-sim{grid-template-columns:1fr; padding:28px;}
}
@media (max-width:560px){
  .home-features,.home-areas{grid-template-columns:1fr;}
  .home-stats{gap:18px;}
  .home-about{grid-template-columns:1fr; text-align:left;}
  .home-about img{width:110px; height:110px;}
  .home-sim{padding:22px 18px;}
}
