/* Ícones da apresentação: a geometria do símbolo é independente das regras
   de texto dos cards. Phosphor, masks, cores e animações internas são mantidos. */
.tupa-page .brand-icon {
  display: inline-grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  place-items: center;
  align-content: center;
  justify-content: center;
  box-sizing: border-box;
  width: 50px;
  height: 50px;
  min-width: 0;
  min-height: 0;
  flex-shrink: 0;
  padding: 0;
  line-height: 0;
  vertical-align: middle;
}
.tupa-page .brand-icon > :is(.brand-icon-glyph, svg) {
  display: block;
  position: static;
  inset: auto;
  width: 26px;
  height: 26px;
  min-width: 0;
  min-height: 0;
  flex: none;
  align-self: center;
  justify-self: center;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  color: inherit;
  line-height: 0;
  vertical-align: middle;
}
.tupa-page .brand-icon > .brand-icon-glyph {
  transform: none;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
}
.tupa-page .eyebrow > .brand-icon {
  width: 32px;
  height: 32px;
  margin: 0;
}
.tupa-page .eyebrow > .brand-icon > :is(.brand-icon-glyph, svg) {
  width: 18px;
  height: 18px;
}
.tupa-page .brand-icon.brand-icon-comparison {
  width: 37px;
  height: 37px;
  margin: 0;
  flex: 0 0 37px;
}
.tupa-page .brand-icon.brand-icon-comparison > :is(.brand-icon-glyph, svg) {
  width: 20px;
  height: 20px;
}
.tupa-page .comparison-solution .brand-icon-comparison {
  width: 30px;
  height: 30px;
  flex-basis: 30px;
}
.tupa-page .comparison-solution .brand-icon-comparison > :is(.brand-icon-glyph, svg) {
  width: 18px;
  height: 18px;
}

/* adjusted.css: `.problem-grid span` e o seletor do último card eram regras
   para a legenda, mas passaram a alcançar também os dois spans do ícone. */
.tupa-page .problem-grid > a > .brand-icon {
  display: inline-grid;
  justify-content: center;
  align-items: center;
  align-self: flex-start;
  margin: 0;
  color: var(--forest);
}
.tupa-page .problem-grid > a:last-child > .brand-icon {
  align-self: center;
  margin: 0;
}
.tupa-page .problem-grid > a .brand-icon > .brand-icon-glyph {
  display: block;
  margin: 0;
  padding: 0;
  color: inherit;
}

/* O wrapper antigo de escopo fica só com sua função de coluna e numeração;
   ele não cria uma segunda caixa menor atrás do container de 50px. */
.tupa-page .scope-item .scope-icon {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 54px;
  height: auto;
  min-height: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.tupa-page .scope-icon > .brand-icon { margin: 0 0 10px; }
.tupa-page .scope-icon > small {
  position: static;
  inset: auto;
  margin: 0;
}
.tupa-page .method-icon.brand-icon,
.tupa-page .technical-note > .brand-icon { margin: 0; }

/* Slots de botões e pequenos ícones em SVG permanecem nos seus tamanhos
   originais, com baseline removida e sem encolher no flex. */
.button-icon { line-height: 1; text-align: center; padding: 0; }
.tupa-page :is(.option-icon, .pillar-icon, .case-icon, .result-icon,
    .flow-node, .icon-button, .proof-icon, .next-play) {
  place-items: center;
  align-content: center;
  justify-content: center;
}
.tupa-page :is(.option-icon, .pillar-icon, .case-icon, .result-icon,
    .flow-node, .icon-button, .proof-icon, .next-play) > img {
  display: block;
  margin: 0;
  padding: 0;
  object-fit: contain;
  flex-shrink: 0;
}
.tupa-page :is(.eyebrow, .feature-benefit, .profile-benefit, .schedule-done,
    .component-heading, .appointment-note, .component-footnote,
    .epi-confirm, .mini-top) img,
.tupa-page .contact-benefits > span > img {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
}
.tupa-page .contact-option > .option-icon { align-self: center; margin: 0; }
.tupa-page .appointment-action button > img { display: block; flex-shrink: 0; object-fit: contain; }

@media (max-width: 520px) {
  .tupa-page .problem-grid > a:last-child > .brand-icon { align-self: flex-start; }
}