/* Original Figma glyphs, recolored through their alpha without editing the SVGs. */
body.ui-study.landing-v2 main#main #technologies .technology-card {
  --technology-icon-size: 124px;
  --technology-icon-color: #79ccea;
  min-height: 420px;
}

/* Flex spacing keeps every icon on the bottom baseline and clear of longer copy. */
body.ui-study.landing-v2 main#main #technologies .technology-card > p {
  margin-bottom: 24px;
}
body.ui-study.landing-v2 main#main #technologies .technology-card-icon {
  display: block;
  flex: none;
  align-self: flex-end;
  width: var(--technology-icon-size);
  height: var(--technology-icon-size);
  margin-top: auto;
  background-color: var(--technology-icon-color);
  -webkit-mask-image: var(--technology-icon);
  mask-image: var(--technology-icon);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-position: right bottom;
  mask-position: right bottom;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  pointer-events: none;
}

body.ui-study.landing-v2 #technologies [data-technology-icon="unified-checkout"] {
  --technology-icon: url("assets/technology-icons/unified-checkout.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="online-register"] {
  --technology-icon: url("assets/technology-icons/online-register.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="sales"] {
  --technology-icon: url("assets/technology-icons/sales.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="inventory"] {
  --technology-icon: url("assets/technology-icons/inventory.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="analytics"] {
  --technology-icon: url("assets/technology-icons/analytics.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="mobile-app"] {
  --technology-icon: url("assets/technology-icons/mobile-app.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="website"] {
  --technology-icon: url("assets/technology-icons/website.svg");
}
body.ui-study.landing-v2 #technologies [data-technology-icon="marketing"] {
  --technology-icon: url("assets/technology-icons/marketing.svg");
}

@media (max-width: 767px) {
  body.ui-study.landing-v2 main#main #technologies .technology-card {
    --technology-icon-size: 104px;
    min-height: 390px;
  }
  body.ui-study.landing-v2 main#main #technologies .technology-card-icon {
    margin-right: 4px;
  }
}