.app-ContactBlock {
  --app-color-use-bg: var(--app-color-def-gray-white);
  --app-color-use-text: var(--app-color-def-gray-black);
  --app-color-use-accent: var(--app-color-def-red);
  --app-color-use-primary: var(--app-color-def-gray-dark);
  --app-color-use-border: var(--app-color-def-gray-dark);
  --app-color-use-bg: var(--app-color-def-turquoise--lighter);
  --app-color-use-bg--light: var(--app-color-def-turquoise--lightest);
  --app-color-use-primary: var(--app-color-def-turquoise);
  --app-color-use-primary--lighter: var(--app-color-def-turquoise--lighter);
  --app-color-use-primary--lightest: var(--app-color-def-turquoise--lightest);
  --app-color-use-text: var(--app-color-def-gray-black);
  accent-color: var(--app-color-use-accent);
  background-color: var(--app-color-use-bg--light);
  color: var(--app-color-use-text);
  container-type: inline-size;
  display: grid;
  margin-inline: var(--app-align-use-left--1) var(--app-align-use-right--1);
  gap: var(--app-spacing-400);
  grid-template-columns: 1fr;
  padding-block: var(--app-spacing-400);
}
.app-ContactBlock > * {
  --app-align-parent-left: var(--app-align-use-left--0);
  --app-align-parent-right: var(--app-align-use-right--0);
}
@container (min-width: 30rem) {
  .app-ContactBlock {
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  }
}
.app-ContactBlock-Entry {
  container-type: inline-size;
}
.app-ContactBlock-Entry-content {
  align-items: center;
  display: grid;
  gap: var(--app-spacing-400);
  grid-auto-flow: row;
  padding-inline: calc(var(--app-align-use-left--2) - var(--app-align-use-left--1)) calc(var(--app-align-use-right--2) - var(--app-align-use-right--1));
}
.app-ContactBlock-Entry .app-Typography {
  text-align: center;
  text-wrap: balance;
}
.app-ContactBlock-Entry-icon {
  --comp-shadow-delta: clamp(4px, calc(0.0049 * var(--app-alignment-pagewidth, 100vw) + 2.1px), 8px);
  aspect-ratio: 1;
  background-color: var(--app-color-def-gray-white);
  border: 4px solid var(--app-color-def-gray-dark);
  border-radius: 100%;
  display: grid;
  filter: drop-shadow(var(--comp-shadow-delta) var(--comp-shadow-delta) var(--comp-shadow-delta) rgba(0, 0, 0, 0.3));
  overflow: hidden;
  justify-self: center;
  order: -1;
  max-width: 100%;
  width: clamp(6rem, 15vw, 10.5rem);
}
.app-ContactBlock-Entry-icon > * {
  border-radius: 100%;
  display: block;
  scale: 0.88;
  transition: scale 0.2s;
}
.app-ContactBlock-Entry svg {
  color: var(--app-color-use-primary);
  display: block;
  height: auto;
  width: 100%;
}
@container (min-width: 25rem) {
  .app-ContactBlock-Entry-content {
    grid-auto-flow: column;
    grid-template-columns: 1fr 8rem;
  }
  .app-ContactBlock-Entry .app-Typography {
    text-align: left;
  }
  .app-ContactBlock-Entry-icon {
    order: 0;
  }
}