.countries {
  position: relative;
  overflow: hidden;
  text-align: center;
  background-color: var(--yellow-100);
  isolation: isolate;
  border-radius: 10px;
}
@media (min-width: 740px) {
  .countries {
    padding: 36px;
  }
}
@media (max-width: 739.98px) {
  .countries {
    padding: 14px;
  }
}
.countries::before, .countries::after {
  position: absolute;
  z-index: -1;
  aspect-ratio: 256/105;
  pointer-events: none;
  content: "";
  background-color: var(--yellow-400);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='105' fill='none'%3E%3Cg fill='%23FABD00' opacity='.2'%3E%3Cpath d='M92.49 105H52.91L0 52.5 52.9 0h39.6L39.6 52.5 92.5 105Z'/%3E%3Cpath d='M147 105h-39.6L54.5 52.5 107.4 0h39.58L94.1 52.5 147 105Z'/%3E%3Cpath d='M201.5 105h-39.6L109 52.5 161.9 0h39.59l-52.91 52.5 52.9 52.5Z'/%3E%3Cpath d='M256 105h-39.58L163.5 52.5 216.41 0H256l-52.9 52.5L256 105Z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
}
@media (min-width: 740px) {
  .countries::before, .countries::after {
    --position-x: -30px;
    --position-y: -20px;
    width: 256px;
  }
}
@media (max-width: 739.98px) {
  .countries::before, .countries::after {
    --position-x: -10px;
    --position-y: -10px;
    width: 125px;
  }
}
.countries::before {
  top: var(--position-y);
  right: var(--position-x);
}
.countries::after {
  bottom: var(--position-y);
  left: var(--position-x);
  transform: scaleX(-1);
}
@media (min-width: 740px) {
  .countries_descr {
    margin-top: 10px;
  }
}
@media (max-width: 739.98px) {
  .countries_descr {
    margin-top: 6px;
  }
}
.countries_list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--margin-heading);
  justify-content: center;
  max-width: 680px;
  margin-inline: auto;
  margin-top: var(--margin-block);
}
.countries_item {
  display: grid;
  row-gap: var(--margin-text);
  place-content: start center;
  justify-items: center;
}
@media (min-width: 740px) {
  .countries_item {
    width: 100px;
  }
}
@media (max-width: 739.98px) {
  .countries_item {
    width: 68px;
  }
}
.countries_item:is(a):hover, .countries_item:is(a):focus-visible {
  color: var(--accent);
}
.countries_pic {
  width: var(--_size);
  height: var(--_size);
  object-fit: contain;
  border-radius: 50%;
}
@media (min-width: 740px) {
  .countries_pic {
    --_size: 60px;
  }
}
@media (max-width: 739.98px) {
  .countries_pic {
    --_size: 40px;
  }
}