/* Custom helpers (além do Tailwind via CDN) */
:root {
  --edge-red: #FF3C1E;
  --edge-orange: #FF5C2E;
}

.grid-overlay {
  background-image:
    linear-gradient(to right, rgba(255,255,255,.15) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.15) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* Header */
.navlink { color: rgba(255,255,255,0.8); }
.navlink:hover { color: #fff; }

.cta {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem .875rem;
  border-radius:.75rem;
  background: linear-gradient(135deg, var(--edge-red), var(--edge-orange));
  font-weight:600; font-size:.875rem;
  transition: box-shadow .25s ease, transform .25s ease;
}
.cta:hover { box-shadow: 0 10px 30px -10px rgba(255,60,30,0.5); transform: translateY(-1px); }

/* Eyebrow / dot */
.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.05);
  padding:.25rem .75rem;
  font-size:.75rem; color:rgba(255,255,255,.8);
  backdrop-filter: blur(6px);
  border-radius:999px;
}
.dot{ display:inline-block; width:.375rem; height:.375rem; border-radius:999px;
  background:linear-gradient(135deg, var(--edge-red), var(--edge-orange)); }

.section-head .title{ margin-top:1.25rem; font-weight:600; font-size:1.5rem; }
@media (min-width:640px){ .section-head .title{ font-size:1.875rem; } }
.section-head .subtitle{ margin-top:.5rem; color:rgba(255,255,255,.7); }

/* Buttons */
.btn-primary{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.25rem; border-radius:.75rem;
  background:linear-gradient(135deg, var(--edge-red), var(--edge-orange));
  font-weight:600;
  box-shadow: 0 10px 30px -10px rgba(255,60,30,0.55);
}
.btn-outline{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.25rem; border-radius:.75rem;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.05);
  font-weight:500;
}
.btn-outline:hover{ background:rgba(255,255,255,.1); }

/* Showpiece value cards */
.value-card{ display:flex; gap:.75rem; align-items:flex-start; }
.value-card .desc{ margin-top:.25rem; color:rgba(255,255,255,.7); font-size:.875rem; }
.icon-badge{
  display:grid; place-items:center; width:2.5rem; height:2.5rem;
  border-radius:.75rem; color:#fff;
  background:linear-gradient(135deg, var(--edge-red), var(--edge-orange));
  border:1px solid rgba(255,255,255,.2);
}

 img.edge-imagem {
    height: 40px;   /* controla a altura */
    width: auto;
    border-radius: 16px;
    object-fit: contain;
   
  }
  



/* Marquee */
@keyframes marqueeEdge{ 0%{ transform: translateX(0); } 100%{ transform: translateX(-50%); } }
.marquee{
  width:200%; display:flex; gap:1.25rem; align-items:center;
  animation: marqueeEdge 22s linear infinite;
  opacity:.8; white-space:nowrap;
}
.pill{
  display:inline-block; border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);
  padding:.25rem .75rem; border-radius:999px;
}

/* Cards */
.card{
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(to bottom, rgba(255,255,255,.05), transparent);
  border-radius:1rem; padding:1.25rem;
}
.card-head{ display:flex; gap:.75rem; align-items:center; }
.card-desc{ margin-top:.75rem; color:rgba(255,255,255,.7); font-size:.9rem; }
.card-list{ margin-top:1rem; display:grid; gap:.4rem; color:rgba(255,255,255,.7); font-size:.9rem; }
.card-list li{ display:flex; gap:.5rem; align-items:flex-start; }

.step{
  position:relative;
  border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05);
  border-radius:1rem; padding:1.25rem;
}
.step .desc{ margin-top:.5rem; color:rgba(255,255,255,.7); font-size:.9rem; }
.step .badge{
  position:absolute; right:-.75rem; top:-.75rem;
  width:2rem; height:2rem; display:grid; place-items:center;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15);
  border-radius:999px; font-size:.75rem;
}

/* Case cards */
.kcard{
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(to bottom, rgba(255,255,255,.05), transparent);
  border-radius:1rem; padding:1.5rem;
}
.kcard .ktitle{ margin-top:.5rem; font-weight:600; font-size:1.125rem; }
.kcard .kdesc{ margin-top:.5rem; color:rgba(255,255,255,.7); font-size:.9rem; }

/* Testimonials */
.tcard{ overflow:hidden; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05); border-radius:1rem; }
.timg{ position:relative; height:13rem; }
.timg img{ width:100%; height:100%; object-fit:cover; object-position:center; opacity:.9; transition:opacity .25s; }
.tcard:hover .timg img{ opacity:1; }
.chip{ position:absolute; left:.75rem; top:.75rem; display:inline-flex; gap:.5rem; align-items:center;
  border:1px solid rgba(255,255,255,.15); background:rgba(0,0,0,.3);
  padding:.25rem .6rem; border-radius:999px; font-size:.7rem; backdrop-filter: blur(6px); }
.metric{ font-size:.75rem; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05); border-radius:999px; padding:.25rem .6rem; color:rgba(255,255,255,.7); }
.id{ margin-top:1.25rem; display:flex; gap:.75rem; align-items:center; }
.avatar{ display:grid; place-items:center; width:2.25rem; height:2.25rem; border-radius:999px; color:#fff; font-weight:600;
  background:linear-gradient(135deg, var(--edge-red), var(--edge-orange)); }
.who .name{ font-weight:500; }
.who .role{ font-size:.75rem; color:rgba(255,255,255,.6); }
.stars{ color:rgba(250,204,21,.8); /* amarelo-400 */ font-size:1rem; letter-spacing:.1rem; }

/* Info cards */
.infocard{ border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05); border-radius:1rem; padding:1.5rem; }

/* Form */
.field{
  width:100%; border-radius:.75rem; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.15); padding:.65rem .75rem; outline:none;
  color:#fff;
}
.field::placeholder{ color:rgba(255,255,255,.4); }
.field:focus{ box-shadow:0 0 0 4px rgba(255,60,30,.25); border-color:rgba(255,255,255,.25); }
.label{ font-size:.75rem; color:rgba(255,255,255,.7); }

/* Simple fade-in on load */
.fade-in{ animation: fadein .8s ease-out both; }
@keyframes fadein{ from{ opacity:0; transform: translateY(20px); } to { opacity:1; transform: translateY(0); } }