/* =====================================================================
   HOME › AREE DI COMPETENZA — 4 card con icona in riquadro (mm-tile), tutta la card e' cliccabile.
   4 colonne da 1024px, 2 da 768px. Vedi design/DESIGN.md › Components › Card area di competenza.
   ===================================================================== */
.wp-block-group.mm-aree__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.wp-block-group.mm-aree__grid > * { margin: 0; }
@media (min-width: 768px) { .wp-block-group.mm-aree__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .wp-block-group.mm-aree__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.wp-block-group.mm-area {
  --mm-tile-inset: 28px auto auto 28px;
  display: flex;
  flex-direction: column;
  padding: 108px 28px 28px; /* 28 + riquadro icona 56 + 24 */
  border-radius: 24px;
  box-shadow: 0 4px 20px rgba(6, 51, 107, .04);
  transition: transform .3s, box-shadow .3s;
}
.wp-block-group.mm-area > * { margin: 0; }
.wp-block-group.mm-area:hover {
  --mm-tile-bg: var(--wp--preset--color--primary);
  --mm-ico-color: var(--wp--preset--color--surface);
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(6, 51, 107, .1);
}
.mm-area > .mm-area__label {
  margin-bottom: 8px;
  font-family: var(--wp--preset--font-family--plus-jakarta-sans);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.mm-area > .mm-area__title { margin-bottom: 12px; font-weight: 700; line-height: 1.35; letter-spacing: 0; }
.mm-area > .mm-area__text { line-height: 1.625; }
.mm-area > .mm-area__link { --mm-link-gap: 4px; margin-top: auto; padding-top: 24px; }