
body {
  position: relative;
  z-index: 0;
}

main {
  position: relative;
  z-index: 1;
}

[data-lang] {
  display: none;
}

.atm-isrv-lib-backg-section-ecossistema {
background:
  linear-gradient(color-mix(in srgb, var(--atm-color-blue-900) 85%, var(--atm-color-blue-850) 15%) 1px, transparent 1px),
  linear-gradient(to right, color-mix( in srgb, var(--atm-color-blue-900) 85%, var(--atm-color-blue-850) 15% ) 1px, transparent 1px),
  linear-gradient(135deg, var(--atm-color-blue-900) 0%, var(--atm-color-blue-900) 15%, var(--atm-color-blue-850) 100%);
background-size: 10px 10px, 10px 10px, 100% 100%;
}


.hero-title {
	font-size:48px;
	font-weight:800;
	line-height:1.1
}

.hero-img-wrapper {
  width: 100%;
  height: 100%;
  min-height: 420px;      /* controla a altura do hero */
  max-width: 2560px;   /* ou 60%, 70%, etc */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hero-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* corta se precisar */
  border-radius: 16px;
}

.glass-card{
  background:rgba(255,255,255,0.06);
  backdrop-filter:blur(12px);
  border-radius:16px;
  padding:28px;
  border:1px solid rgba(255,255,255,0.08)
}

.feature-card{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.06);
  backdrop-filter:blur(12px);
  border-radius:16px;
  padding:24px;
  height:100%;
  transition:.3s
}
.feature-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 30px rgba(0,0,0,.3)
}
.step{
  width:48px;height:48px;
  border-radius:12px;
  background:linear-gradient(135deg,#0b63b8,#00bfa6);
  display:flex;align-items:center;justify-content:center;
  font-weight:800
}
.pricing{
  background:#111827;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.08)
}
.pricing.highlight{
  border:2px solid #0d6efd;
  transform:scale(1.03)
}


.preview-card {
  background: transparent;
  border-radius: 18px;
  padding: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform .25s ease, box-shadow .25s ease;
}

.preview-card img {
  width: 100%;
  max-width: 220px; /* controla o tamanho do celular */
  height: auto;
  display: block;
}

.preview-card:hover {
  transform: translateY(-4px);
}


