.ahm-hex-menu {
  --s: 276px;
  --g: 30px;
  display: flex;
  gap: var(--g);
  flex-wrap: wrap;
  padding-bottom: calc(var(--s)/(4*cos(30deg)));
  container-type: inline-size;
}

.ahm-hex-menu > * {
  width: var(--s);
  aspect-ratio: cos(30deg);
  border-radius: 50% / 25%;
  corner-shape: bevel;
  margin-bottom: calc(var(--s)/(-4*cos(30deg)));
  /* Dynamic indentation for smaller screens */
  --_n: round(down,(100cqw + var(--g))/(var(--s) + var(--g)));
  --_m: round(down,((100cqw - (var(--s) - var(--g))/2)/(var(--s) + var(--g))));
  --_c: round(down, 1 - mod((sibling-index() - 1 + var(--_n)) / (var(--_n) + var(--_m)), 1));
  margin-left: calc(var(--_c)*(var(--s) + var(--g))/2);
}

@media (max-width: 575px) {
    .ahm-hex-menu {
        flex-direction: column;
        align-items: center;
    }

    .ahm-hex-item {
        position: relative;
        left: auto !important;
        top: auto !important;
        margin-left: 0;
        margin-bottom: 0;
    }
}

@media (min-width: 576px) {
  .ahm-hex-menu {
  padding-left: 40px;
  }
}

@media (min-width: 768px) {
  .ahm-hex-menu {
  padding-left: 53px;
  }
  /* Row 1 (3 items): no indent */
  .ahm-hex-menu > *:nth-child(1),
  .ahm-hex-menu > *:nth-child(2) {
    margin-left: 0;
  }
  /* Row 2 (2 items): first item gets half-hex indent to centre the pair */
  .ahm-hex-menu > *:nth-child(3) {
    margin-left: calc((var(--s) + var(--g)) / 2);
  }
  .ahm-hex-menu > *:nth-child(4),
  .ahm-hex-menu > *:nth-child(5){
    margin-left: 0;
  }
  /* Row 3 (1 item): full-hex indent to centre under row 2 */
  .ahm-hex-menu > *:nth-child(6) {
    margin-left: calc((var(--s) + var(--g)) / 2);
  }
}

@media (min-width: 959px) {
  .ahm-hex-menu {
    padding-left: 15px;
  }
  /* Row 1 (3 items): no indent */
  .ahm-hex-menu > *:nth-child(1),
  .ahm-hex-menu > *:nth-child(2),
  .ahm-hex-menu > *:nth-child(3) {
    margin-left: 0;
  }
  /* Row 2 (2 items): first item gets half-hex indent to centre the pair */
  .ahm-hex-menu > *:nth-child(4) {
    margin-left: calc((var(--s) + var(--g)) / 2);
  }
  .ahm-hex-menu > *:nth-child(5) {
    margin-left: 0;
  }
  /* Row 3 (1 item): full-hex indent to centre under row 2 */
  .ahm-hex-menu > *:nth-child(6) {
    margin-left: calc(var(--s) + var(--g));
  }
}

@media (min-width: 1200px) {
  .ahm-hex-menu {
  padding-left: 106px;
  }
}

.ahm-hex-menu .ahm-hex-item {
  display: grid;
  place-items: center;
  border: 5px solid;
  box-sizing: border-box;
  color: #0494CA;
  text-align: center;
  padding: 1.25rem;
  text-decoration: none;
  max-width: 270px;
}

.ahm-hex-item {
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.ahm-hex-item:hover {
  transform: scale(1.05);
  background-color: rgba(4, 148, 202, 0.08);
}
.ahm-hex-title {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #000;
  margin: 0 0 0.75rem 0;
}
.ahm-hex-desc {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #333;
  margin: 0;
}
.ahm-hex-menu:hover .ahm-hex-item {
  opacity: 0.5;
}
.ahm-hex-menu:hover .ahm-hex-item:hover {
  opacity: 1;
}