/* ============================================================
   LZ-COMPONENT: HOME / LZ-C11-DOUBLE-BANNER
   v1.0.1 — Ajuste só pro desktop: imagem do card de Prêmios não
   corta mais na largura (background-size: 100% auto em vez de
   cover, telas ≥861px). Mobile ficou intocado (já estava bom).
   v1.0.2 — Card "Compartilhe com Quirinópolis" ganhou imagem de
   fundo (era gradiente solido), mesmo padrao overlay do card
   de Premios.
============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

.lz-duplo {
  font-family: 'Poppins', sans-serif;
  background: #ffffff;
  padding: 48px 24px 56px;
  border-top: 1px solid #eef1f0;
}
.lz-duplo__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.lz-duplo__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 220px;
  padding: 30px 32px;
  border-radius: 18px;
  text-decoration: none;
  overflow: hidden;
}

.lz-duplo__card--verde {
  background-color: #0b1a1e;
  background-size: cover;
  background-position: center;
}
.lz-duplo__card--verde::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(22,163,74,0.35), rgba(11,26,30,0.2));
}
.lz-duplo__card--verde > * { position: relative; z-index: 1; }

.lz-duplo__card--premios {
  background-color: #10231f;
  background-size: cover;
  background-position: center;
}
.lz-duplo__card--premios::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(6,14,13,0.9) 30%, rgba(6,14,13,0.25) 100%);
}
.lz-duplo__card--premios > * { position: relative; z-index: 1; }

.lz-duplo__icone {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

.lz-duplo__selo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(160deg, #f7d774, #d9a441);
  color: #3a2504;
  font-size: 11.5px;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 20px;
  margin-bottom: 14px;
}

.lz-duplo__titulo { color: #ffffff; font-size: 22px; font-weight: 700; margin-bottom: 8px; }
.lz-duplo__texto { color: rgba(255,255,255,0.85); font-size: 13.5px; margin: 0 0 18px; max-width: 320px; }
.lz-duplo__tag {
  display: inline-block;
  background: #22c55e;
  color: #06210f;
  font-size: 11.5px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 5px;
  margin-bottom: 18px;
}

.lz-duplo__botao {
  background: #ffffff;
  color: #10231f;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 20px;
  border-radius: 22px;
}
.lz-duplo__botao--dourado {
  background: linear-gradient(160deg, #f7d774, #d9a441);
  color: #3a2504;
}

@media (max-width: 860px) {
  .lz-duplo__inner { grid-template-columns: 1fr; }
}

/* Ajuste só pro desktop: no mobile a coluna já ficava larga o
   suficiente (cover cortava pouco); no desktop as duas colunas
   ficam mais estreitas lado a lado e o corte nas bordas fica
   visível. Aqui a imagem passa a mostrar a largura toda (sem
   cortar nos lados), com um pouco mais de altura pra caber. */
@media (min-width: 861px) {
  .lz-duplo__card--premios {
    background-size: 100% auto;
    background-position: top center;
    min-height: 300px;
  }
}
