/* =========================================================
   MARIA LAVADEIRA ICONS — ICOMOON + ELEMENTOR
   VERSÃO NORMALIZADA
   ========================================================= */

/* =========================
   FONT FACE
   ========================= */
@font-face {
  font-family: 'MariaLavadeiraIcons';
  src: url('fonts/MariaLavadeiraIcons.woff2') format('woff2'),
       url('fonts/MariaLavadeiraIcons.woff') format('woff'),
       url('fonts/MariaLavadeiraIcons.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* =========================
   NORMALIZAÇÃO DOS ÍCONES
   ========================= */
[class^="mlav-"],
[class*=" mlav-"] {
  font-family: 'MariaLavadeiraIcons' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;

  /* Caixa visual uniforme */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
  min-width: 1em;
  min-height: 1em;

  /* Remove diferenças de baseline e espaçamentos herdados */
  line-height: 1 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle;
  box-sizing: border-box;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* =========================
   GLIFOS
   ========================= */
.mlav-pecas-finas::before      { content: "\e900"; }
.mlav-terno::before            { content: "\e901"; }
.mlav-jaleco::before           { content: "\e902"; }
.mlav-edredom-lencol::before   { content: "\e903"; }
.mlav-tenis::before            { content: "\e904"; }
.mlav-bone::before             { content: "\e905"; }
.mlav-camisa-social::before    { content: "\e906"; }
.mlav-cesta-roupas::before     { content: "\e907"; }
.mlav-ferro-vapor::before      { content: "\e908"; }
.mlav-maquina-lavar::before    { content: "\e909"; }

/* =========================================================
   ELEMENTOR — GRID DE SERVIÇOS
   Adicione a classe CSS "maria-servicos-grid" no container pai
   que contém os 6 serviços.
   ========================================================= */

/* =========================
   GRID DESKTOP / TABLET
   ========================= */
.maria-servicos-grid,
.maria-servicos-grid > .e-con-inner {
  --mlav-icon-box: 72px;
  --mlav-icon-size: 56px;
  --mlav-item-gap: 10px;
  --mlav-grid-column-gap: 24px;
  --mlav-grid-row-gap: 24px;

  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  column-gap: var(--mlav-grid-column-gap) !important;
  row-gap: var(--mlav-grid-row-gap) !important;
  align-items: start !important;
}

/* Remove larguras, margens e offsets que quebram a grade */
.maria-servicos-grid > .elementor-element,
.maria-servicos-grid > .e-con,
.maria-servicos-grid > .e-con-inner > .elementor-element,
.maria-servicos-grid > .e-con-inner > .e-con {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  inset: auto !important;
  transform: none !important;
}

/* =========================
   ITEM / ICON BOX
   ========================= */
.maria-servicos-grid .elementor-icon-box-wrapper,
.maria-servicos-grid .elementor-widget-icon-box .elementor-widget-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: var(--mlav-item-gap) !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

/* Zera o espaço nativo do Elementor ao redor do ícone */
.maria-servicos-grid .elementor-icon-box-icon,
.maria-servicos-grid .elementor-widget-icon .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

/* Caixa fixa: todos os ícones ocupam exatamente o mesmo espaço */
.maria-servicos-grid .elementor-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--mlav-icon-box) !important;
  height: var(--mlav-icon-box) !important;
  min-width: var(--mlav-icon-box) !important;
  min-height: var(--mlav-icon-box) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}

/* Tamanho visual único para todos os glifos Maria Lavadeira */
.maria-servicos-grid .elementor-icon [class^="mlav-"],
.maria-servicos-grid .elementor-icon [class*=" mlav-"],
.maria-servicos-grid [class^="mlav-"],
.maria-servicos-grid [class*=" mlav-"] {
  font-size: var(--mlav-icon-size) !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Texto sem margens negativas ou alturas artificiais */
.maria-servicos-grid .elementor-icon-box-content,
.maria-servicos-grid .elementor-icon-box-title,
.maria-servicos-grid .elementor-icon-box-title a,
.maria-servicos-grid .elementor-icon-box-description {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

/* =========================
   MOBILE — 2 × 3
   ========================= */
@media (max-width: 767px) {
  .maria-servicos-grid,
  .maria-servicos-grid > .e-con-inner {
    --mlav-icon-box: 60px;
    --mlav-icon-size: 46px;
    --mlav-item-gap: 8px;
    --mlav-grid-column-gap: 12px;
    --mlav-grid-row-gap: 18px;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .maria-servicos-grid > .elementor-element,
  .maria-servicos-grid > .e-con,
  .maria-servicos-grid > .e-con-inner > .elementor-element,
  .maria-servicos-grid > .e-con-inner > .e-con {
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .maria-servicos-grid .elementor-widget-container,
  .maria-servicos-grid .elementor-icon-box-wrapper {
    min-height: 0 !important;
    height: auto !important;
  }
}