.fgrid {
  margin: var(--section-margin) 0;
}
.fgrid__title {
  margin: 0 auto 20px;
  max-width: 800px;
  text-align: center;
}
.fgrid__snippet {
  margin: 0 auto clamp(20px, 4.5vw, 60px);
  max-width: 800px;
  text-align: center;
}
.fgrid__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.fgrid__item {
  padding: 32px 20px;
  border: 1px solid #e8e8e8;
  border-radius: 20px;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  min-height: 192px;
}
.fgrid__item:hover {
  border-color: #d0d0d0;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}
.fgrid__icon {
  width: clamp(42px, 5vw, 64px);
  height: clamp(42px, 5vw, 64px);
  background: #dbff99;
  border-radius: clamp(10px, 1vw, 16px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.fgrid__label {
  font-size: 20px;
}
.fgrid__icon img {
  max-width: clamp(24px, 2.5vw, 32px);
}
@media (width < 1160px) {
  .fgrid__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (width < 768px) {
  .fgrid__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .fgrid__item {
    padding: 20px;
    min-height: 150px;
  }
}
