/* ==========================================================
   UNIPROTEL — home.css
   Estilos usados SÓ na index.html (hero + mural de câmeras).
   ========================================================== */

.hero{
  padding:168px 0 96px;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(600px 380px at 85% -10%, rgba(242,169,59,.10), transparent 60%),
    radial-gradient(500px 400px at 0% 100%, rgba(46,217,160,.06), transparent 60%);
  pointer-events:none;
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;
  position:relative;
}
@media(max-width:960px){ .hero-grid{grid-template-columns:1fr;} }
.hero h1{
  font-size:clamp(34px, 4.6vw, 54px);
  line-height:1.08;
  margin:18px 0 20px;
}
.hero h1 em{color:var(--amber); font-style:normal;}
.hero p.lead{
  font-size:17.5px; color:var(--text-muted); max-width:520px; margin-bottom:32px;
}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:40px;}
.trust-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.trust-row span.label{
  font-family:var(--font-mono); font-size:11px; color:var(--text-muted); text-transform:uppercase; letter-spacing:.08em;
  margin-right:4px;
}
.trust-chip{
  font-family:var(--font-mono); font-size:12px; color:var(--text-muted);
  padding:6px 10px; border:1px solid var(--border); border-radius:6px;
  background:var(--surface);
}

/* Foto de destaque (elemento assinatura) */
.featured-photo{
  position:relative;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.55);
  aspect-ratio:4/3;
}
.featured-photo img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(1.05) contrast(1.03);
}
.featured-photo::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(16,20,26,0) 55%, rgba(16,20,26,.78) 100%);
  pointer-events:none;
}
.photo-tag{
  position:absolute; left:16px; bottom:16px; z-index:1;
  display:flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:12px; color:#fff;
  background:rgba(16,20,26,.55); backdrop-filter:blur(4px);
  padding:8px 14px; border-radius:8px; border:1px solid rgba(255,255,255,.14);
}