.elementor-5283 .elementor-element.elementor-element-3dcbc181{--display:flex;}/* Start custom CSS for html, class: .elementor-element-a948dc5 *//* =========================================
   PHIVIA STUDIO | COMO FUNCIONA
   ETAPAS DELICADAS + CONTAINER SEM BORDAS
========================================= */

/* CONTAINER EXTERNO DO ELEMENTOR */

body:has(.ps-how) .e-con:has(.ps-how) {
  --padding-top: 0px !important;
  --padding-right: 0px !important;
  --padding-bottom: 0px !important;
  --padding-left: 0px !important;
  --gap: 0px !important;
  --row-gap: 0px !important;
  --column-gap: 0px !important;

  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* WIDGET HTML */

body:has(.ps-how) .elementor-widget-html:has(.ps-how),
body:has(.ps-how) .elementor-widget-html:has(.ps-how)
> .elementor-widget-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* CONTAINER PRINCIPAL */

.ps-how {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* SEÇÕES COM CANTOS RETOS */

.ps-how section,
.ps-how .psh-step,
.ps-how .psh-time-card,
.ps-how .psh-custom-note,
.ps-how .psh-checklist,
.ps-how .psh-faq-item {
  border-radius: 0 !important;
}

/* =========================================
   ETAPAS — VISUAL MAIS ELEGANTE
========================================= */

.ps-how .psh-step-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 40px 32px;
  border: none !important;
}

.ps-how .psh-step {
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* NÚMEROS NA COR OFICIAL STUDIO */

.ps-how .psh-step-num {
  display: block;
  color: #432444 !important;
  font-family: 'Manrope', sans-serif;
  font-size: 38px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -1.5px;
  margin: 0 0 14px !important;
}

/* TÍTULOS */

.ps-how .psh-step h3 {
  color: #432444 !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: -.3px;
  margin: 0 0 9px !important;
}

/* DESCRIÇÕES */

.ps-how .psh-step p {
  color: #625765 !important;
  font-family: 'Manrope', sans-serif;
  font-size: 12px !important;
  font-weight: 500;
  line-height: 1.8 !important;
  margin: 0 !important;
}

/* FUNDO CLARO DA SEÇÃO */

.ps-how .psh-steps {
  background: #F7F5F2 !important;
  border: none !important;
  border-radius: 0 !important;
}

/* DETALHES EM LILÁS STUDIO */

.ps-how .psh-step-num::selection,
.ps-how .psh-step h3::selection {
  background: #E2B0FF;
  color: #432444;
}

/* BOTÕES — MANTER 20PX */

.ps-how .psh-btn,
.ps-how .psh-btn:visited {
  border-radius: 20px !important;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1024px) {
  .ps-how .psh-step-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 25px;
  }
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {
  .ps-how .psh-step-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 18px;
  }

  .ps-how .psh-step-num {
    font-size: 32px !important;
    margin-bottom: 10px !important;
  }

  .ps-how .psh-step h3 {
    font-size: 14px !important;
  }

  .ps-how .psh-step p {
    font-size: 11px !important;
    line-height: 1.7 !important;
  }
}/* End custom CSS */