/* ==========================================================
   Tony ScriptOps v2.1.7.2
   Ícones técnicos do bloco de benefícios do Hero
   ========================================================== */

.ts-hero-benefit-tech-v2172 {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;

  display: grid !important;
  place-items: center !important;

  border: 1px solid #dbe8fb !important;
  border-radius: 10px !important;

  background:
    linear-gradient(145deg, #f4f8ff 0%, #eaf2ff 100%) !important;

  position: relative !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}

/* ==========================================================
   PIX SEGURO
   Painel de transação + confirmação protegida
   ========================================================== */

.ts-hero-benefit-tech-v2172[data-tech="pix"]::before {
  content: "";
  position: absolute;

  width: 19px;
  height: 14px;

  border: 1.5px solid #315f9d;
  border-radius: 4px;

  background:
    linear-gradient(#9bc1ff 0 0) 4px 4px / 7px 2px no-repeat,
    linear-gradient(#2563eb 0 0) 4px 8px / 10px 2px no-repeat,
    #ffffff;

  box-shadow: 5px -4px 0 -2px #c7dcff;
}

.ts-hero-benefit-tech-v2172[data-tech="pix"]::after {
  content: "";

  position: absolute;
  right: 6px;
  bottom: 6px;

  width: 8px;
  height: 5px;

  border-left: 2px solid #16a34a;
  border-bottom: 2px solid #16a34a;

  transform: rotate(-45deg);
}

/* ==========================================================
   DOWNLOAD IMEDIATO
   Pacote digital + fluxo automático
   ========================================================== */

.ts-hero-benefit-tech-v2172[data-tech="download"]::before {
  content: "";
  position: absolute;

  width: 17px;
  height: 15px;

  left: 8px;
  bottom: 6px;

  border: 1.5px solid #315f9d;
  border-radius: 4px;

  background:
    linear-gradient(#bfdbfe 0 0) center 4px / 9px 2px no-repeat,
    linear-gradient(#2563eb 0 0) center 8px / 11px 2px no-repeat,
    #ffffff;
}

.ts-hero-benefit-tech-v2172[data-tech="download"]::after {
  content: "";

  position: absolute;
  top: 5px;
  left: 14px;

  width: 7px;
  height: 11px;

  border-left: 2px solid #2563eb;
}

.ts-hero-benefit-tech-v2172[data-tech="download"] {
  background:
    linear-gradient(145deg, #f4f8ff 0%, #eaf2ff 100%) !important;
}

.ts-hero-benefit-tech-v2172[data-tech="download"] span {
  display: none !important;
}

.ts-hero-benefit-tech-v2172[data-tech="download"] i {
  display: none !important;
}

/* seta do download */
.ts-hero-benefit-tech-v2172[data-tech="download"] .ts-arrow-v2172 {
  position: absolute;
  top: 9px;
  left: 11px;

  width: 8px;
  height: 8px;

  border-right: 2px solid #2563eb;
  border-bottom: 2px solid #2563eb;

  transform: rotate(45deg);
}

/* ==========================================================
   ATUALIZAÇÕES GRÁTIS
   Módulos de software em ciclo
   ========================================================== */

.ts-hero-benefit-tech-v2172[data-tech="updates"]::before {
  content: "";

  position: absolute;

  width: 18px;
  height: 18px;

  border: 2px solid #2563eb;
  border-right-color: #8fb7f5;

  border-radius: 6px;

  background:
    linear-gradient(#93c5fd 0 0) 4px 4px / 4px 4px no-repeat,
    linear-gradient(#60a5fa 0 0) 10px 4px / 4px 4px no-repeat,
    linear-gradient(#2563eb 0 0) 4px 10px / 4px 4px no-repeat,
    linear-gradient(#bfdbfe 0 0) 10px 10px / 4px 4px no-repeat,
    #fff;
}

.ts-hero-benefit-tech-v2172[data-tech="updates"]::after {
  content: "";

  position: absolute;
  right: 5px;
  top: 5px;

  width: 6px;
  height: 6px;

  border-top: 2px solid #22c55e;
  border-right: 2px solid #22c55e;
}

/* ==========================================================
   SUPORTE INCLUSO
   Console técnico + status de atendimento
   ========================================================== */

.ts-hero-benefit-tech-v2172[data-tech="support"]::before {
  content: "";

  position: absolute;

  width: 21px;
  height: 16px;

  border: 1.5px solid #315f9d;
  border-radius: 4px;

  background:
    linear-gradient(#60a5fa 0 0) 4px 4px / 4px 2px no-repeat,
    linear-gradient(#2563eb 0 0) 9px 4px / 7px 2px no-repeat,
    linear-gradient(#93c5fd 0 0) 4px 9px / 11px 2px no-repeat,
    #fff;
}

.ts-hero-benefit-tech-v2172[data-tech="support"]::after {
  content: "";

  position: absolute;
  right: 5px;
  bottom: 5px;

  width: 7px;
  height: 7px;

  border-radius: 50%;
  background: #22c55e;

  box-shadow:
    0 0 0 2px #dcfce7,
    0 0 0 3px #86efac;
}

/* remove eventual emoji/ícone anterior dentro do container convertido */
.ts-hero-benefit-tech-v2172 > *:not(.ts-arrow-v2172) {
  display: none !important;
}