/* =========================================================
   DISPLAY
========================================================= */
.hidden {
    display: none !important;
}

.block {
    display: block;
}

.inline-block {
    display: inline-block;
}

.inline {
    display: inline;
}

/* =========================================================
   TEXT ALIGN
========================================================= */
.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

/* =========================================================
   MARGENS (BOTTOM)
========================================================= */
.mb-0 { margin-bottom: 0; }
.mb-xs { margin-bottom: var(--space-xs); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }

/* =========================================================
   PADDING
========================================================= */
.p-sm { padding: var(--space-sm); }
.p-md { padding: var(--space-md); }
.p-lg { padding: var(--space-lg); }

/* =========================================================
   WIDTH
========================================================= */
.w-100 {
    width: 100%;
}

/* =========================================================
   FLEX
========================================================= */
.flex {
    display: flex;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* =========================================================
   GRID (ADICIONAL ÚTIL)
========================================================= */
.grid {
    display: grid;
}

/* =========================================================
   RESPONSIVO
========================================================= */
.mobile-only {
    display: none;
}

.desktop-only {
    display: block;
}

@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }

    .desktop-only {
        display: none;
    }
}

.lp-image-center {
  margin: var(--space-xl) auto;
  text-align: center;
}

.lp-content-narrow {
  max-width: 700px;
  margin: 0 auto;
}

.lp-form-wrap {
  max-width: 800px;
  margin: 0 auto;
}