/* WP BrandFlow - Spacing */
/* Auto-generated - Do not edit manually */

:root {
  --space-xs: clamp(0.5rem, 1vw, 0.75rem);
  --space-s: clamp(0.75rem, 1.5vw, 1rem);
  --space-m: clamp(1rem, 2vw, 1.5rem);
  --space-l: clamp(1.5rem, 3vw, 2rem);
  --space-xl: clamp(2rem, 4vw, 3rem);
  --space-2xl: clamp(2.5rem, 5vw, 4rem);
  --space-3xl: clamp(3rem, 6vw, 5rem);
}

/* Universal Gaps */
body.brandflow .gap-xs { gap: var(--space-xs) !important; }
body.brandflow .gap-s { gap: var(--space-s) !important; }
body.brandflow .gap-m { gap: var(--space-m) !important; }
body.brandflow .gap-l { gap: var(--space-l) !important; }
body.brandflow .gap-xl { gap: var(--space-xl) !important; }
body.brandflow .gap-2xl { gap: var(--space-2xl) !important; }
body.brandflow .gap-3xl { gap: var(--space-3xl) !important; }

/* Row Gaps */
body.brandflow .row-gap-xs { row-gap: var(--space-xs) !important; }
body.brandflow .row-gap-s { row-gap: var(--space-s) !important; }
body.brandflow .row-gap-m { row-gap: var(--space-m) !important; }
body.brandflow .row-gap-l { row-gap: var(--space-l) !important; }
body.brandflow .row-gap-xl { row-gap: var(--space-xl) !important; }
body.brandflow .row-gap-2xl { row-gap: var(--space-2xl) !important; }
body.brandflow .row-gap-3xl { row-gap: var(--space-3xl) !important; }

/* Column Gaps */
body.brandflow .col-gap-xs { column-gap: var(--space-xs) !important; }
body.brandflow .col-gap-s { column-gap: var(--space-s) !important; }
body.brandflow .col-gap-m { column-gap: var(--space-m) !important; }
body.brandflow .col-gap-l { column-gap: var(--space-l) !important; }
body.brandflow .col-gap-xl { column-gap: var(--space-xl) !important; }
body.brandflow .col-gap-2xl { column-gap: var(--space-2xl) !important; }
body.brandflow .col-gap-3xl { column-gap: var(--space-3xl) !important; }

/* Padding - All Around */
body.brandflow .padding-xs { padding: var(--space-xs) !important; }
body.brandflow .padding-s { padding: var(--space-s) !important; }
body.brandflow .padding-m { padding: var(--space-m) !important; }
body.brandflow .padding-l { padding: var(--space-l) !important; }
body.brandflow .padding-xl { padding: var(--space-xl) !important; }
body.brandflow .padding-2xl { padding: var(--space-2xl) !important; }
body.brandflow .padding-3xl { padding: var(--space-3xl) !important; }

/* Padding - Horizontal (X Axis) */
body.brandflow .padding-x-xs { padding-left: var(--space-xs) !important; padding-right: var(--space-xs) !important; }
body.brandflow .padding-x-s { padding-left: var(--space-s) !important; padding-right: var(--space-s) !important; }
body.brandflow .padding-x-m { padding-left: var(--space-m) !important; padding-right: var(--space-m) !important; }
body.brandflow .padding-x-l { padding-left: var(--space-l) !important; padding-right: var(--space-l) !important; }
body.brandflow .padding-x-xl { padding-left: var(--space-xl) !important; padding-right: var(--space-xl) !important; }
body.brandflow .padding-x-2xl { padding-left: var(--space-2xl) !important; padding-right: var(--space-2xl) !important; }
body.brandflow .padding-x-3xl { padding-left: var(--space-3xl) !important; padding-right: var(--space-3xl) !important; }

/* Padding - Vertical (Y Axis) */
body.brandflow .padding-y-xs { padding-top: var(--space-xs) !important; padding-bottom: var(--space-xs) !important; }
body.brandflow .padding-y-s { padding-top: var(--space-s) !important; padding-bottom: var(--space-s) !important; }
body.brandflow .padding-y-m { padding-top: var(--space-m) !important; padding-bottom: var(--space-m) !important; }
body.brandflow .padding-y-l { padding-top: var(--space-l) !important; padding-bottom: var(--space-l) !important; }
body.brandflow .padding-y-xl { padding-top: var(--space-xl) !important; padding-bottom: var(--space-xl) !important; }
body.brandflow .padding-y-2xl { padding-top: var(--space-2xl) !important; padding-bottom: var(--space-2xl) !important; }
body.brandflow .padding-y-3xl { padding-top: var(--space-3xl) !important; padding-bottom: var(--space-3xl) !important; }

/* Padding - Individual Directions (Optional) */
body.brandflow .padding-t-xs { padding-top: var(--space-xs) !important; }
body.brandflow .padding-t-s { padding-top: var(--space-s) !important; }
body.brandflow .padding-t-m { padding-top: var(--space-m) !important; }
body.brandflow .padding-t-l { padding-top: var(--space-l) !important; }
body.brandflow .padding-t-xl { padding-top: var(--space-xl) !important; }
body.brandflow .padding-t-2xl { padding-top: var(--space-2xl) !important; }
body.brandflow .padding-t-3xl { padding-top: var(--space-3xl) !important; }
body.brandflow .padding-b-xs { padding-bottom: var(--space-xs) !important; }
body.brandflow .padding-b-s { padding-bottom: var(--space-s) !important; }
body.brandflow .padding-b-m { padding-bottom: var(--space-m) !important; }
body.brandflow .padding-b-l { padding-bottom: var(--space-l) !important; }
body.brandflow .padding-b-xl { padding-bottom: var(--space-xl) !important; }
body.brandflow .padding-b-2xl { padding-bottom: var(--space-2xl) !important; }
body.brandflow .padding-b-3xl { padding-bottom: var(--space-3xl) !important; }
body.brandflow .padding-l-xs { padding-left: var(--space-xs) !important; }
body.brandflow .padding-l-s { padding-left: var(--space-s) !important; }
body.brandflow .padding-l-m { padding-left: var(--space-m) !important; }
body.brandflow .padding-l-l { padding-left: var(--space-l) !important; }
body.brandflow .padding-l-xl { padding-left: var(--space-xl) !important; }
body.brandflow .padding-l-2xl { padding-left: var(--space-2xl) !important; }
body.brandflow .padding-l-3xl { padding-left: var(--space-3xl) !important; }
body.brandflow .padding-r-xs { padding-right: var(--space-xs) !important; }
body.brandflow .padding-r-s { padding-right: var(--space-s) !important; }
body.brandflow .padding-r-m { padding-right: var(--space-m) !important; }
body.brandflow .padding-r-l { padding-right: var(--space-l) !important; }
body.brandflow .padding-r-xl { padding-right: var(--space-xl) !important; }
body.brandflow .padding-r-2xl { padding-right: var(--space-2xl) !important; }
body.brandflow .padding-r-3xl { padding-right: var(--space-3xl) !important; }

/* Margin - All Around */
body.brandflow .margin-xs { margin: var(--space-xs) !important; }
body.brandflow .margin-s { margin: var(--space-s) !important; }
body.brandflow .margin-m { margin: var(--space-m) !important; }
body.brandflow .margin-l { margin: var(--space-l) !important; }
body.brandflow .margin-xl { margin: var(--space-xl) !important; }
body.brandflow .margin-2xl { margin: var(--space-2xl) !important; }
body.brandflow .margin-3xl { margin: var(--space-3xl) !important; }

/* Margin - Horizontal (X Axis) */
body.brandflow .margin-x-xs { margin-left: var(--space-xs) !important; margin-right: var(--space-xs) !important; }
body.brandflow .margin-x-s { margin-left: var(--space-s) !important; margin-right: var(--space-s) !important; }
body.brandflow .margin-x-m { margin-left: var(--space-m) !important; margin-right: var(--space-m) !important; }
body.brandflow .margin-x-l { margin-left: var(--space-l) !important; margin-right: var(--space-l) !important; }
body.brandflow .margin-x-xl { margin-left: var(--space-xl) !important; margin-right: var(--space-xl) !important; }
body.brandflow .margin-x-2xl { margin-left: var(--space-2xl) !important; margin-right: var(--space-2xl) !important; }
body.brandflow .margin-x-3xl { margin-left: var(--space-3xl) !important; margin-right: var(--space-3xl) !important; }

/* Margin - Vertical (Y Axis) */
body.brandflow .margin-y-xs { margin-top: var(--space-xs) !important; margin-bottom: var(--space-xs) !important; }
body.brandflow .margin-y-s { margin-top: var(--space-s) !important; margin-bottom: var(--space-s) !important; }
body.brandflow .margin-y-m { margin-top: var(--space-m) !important; margin-bottom: var(--space-m) !important; }
body.brandflow .margin-y-l { margin-top: var(--space-l) !important; margin-bottom: var(--space-l) !important; }
body.brandflow .margin-y-xl { margin-top: var(--space-xl) !important; margin-bottom: var(--space-xl) !important; }
body.brandflow .margin-y-2xl { margin-top: var(--space-2xl) !important; margin-bottom: var(--space-2xl) !important; }
body.brandflow .margin-y-3xl { margin-top: var(--space-3xl) !important; margin-bottom: var(--space-3xl) !important; }

/* Margin - Individual Directions (Optional) */
body.brandflow .margin-t-xs { margin-top: var(--space-xs) !important; }
body.brandflow .margin-t-s { margin-top: var(--space-s) !important; }
body.brandflow .margin-t-m { margin-top: var(--space-m) !important; }
body.brandflow .margin-t-l { margin-top: var(--space-l) !important; }
body.brandflow .margin-t-xl { margin-top: var(--space-xl) !important; }
body.brandflow .margin-t-2xl { margin-top: var(--space-2xl) !important; }
body.brandflow .margin-t-3xl { margin-top: var(--space-3xl) !important; }
body.brandflow .margin-b-xs { margin-bottom: var(--space-xs) !important; }
body.brandflow .margin-b-s { margin-bottom: var(--space-s) !important; }
body.brandflow .margin-b-m { margin-bottom: var(--space-m) !important; }
body.brandflow .margin-b-l { margin-bottom: var(--space-l) !important; }
body.brandflow .margin-b-xl { margin-bottom: var(--space-xl) !important; }
body.brandflow .margin-b-2xl { margin-bottom: var(--space-2xl) !important; }
body.brandflow .margin-b-3xl { margin-bottom: var(--space-3xl) !important; }
body.brandflow .margin-l-xs { margin-left: var(--space-xs) !important; }
body.brandflow .margin-l-s { margin-left: var(--space-s) !important; }
body.brandflow .margin-l-m { margin-left: var(--space-m) !important; }
body.brandflow .margin-l-l { margin-left: var(--space-l) !important; }
body.brandflow .margin-l-xl { margin-left: var(--space-xl) !important; }
body.brandflow .margin-l-2xl { margin-left: var(--space-2xl) !important; }
body.brandflow .margin-l-3xl { margin-left: var(--space-3xl) !important; }
body.brandflow .margin-r-xs { margin-right: var(--space-xs) !important; }
body.brandflow .margin-r-s { margin-right: var(--space-s) !important; }
body.brandflow .margin-r-m { margin-right: var(--space-m) !important; }
body.brandflow .margin-r-l { margin-right: var(--space-l) !important; }
body.brandflow .margin-r-xl { margin-right: var(--space-xl) !important; }
body.brandflow .margin-r-2xl { margin-right: var(--space-2xl) !important; }
body.brandflow .margin-r-3xl { margin-right: var(--space-3xl) !important; }

/* Layout Utilities */
body.brandflow .no-padding { padding: 0 !important; }
body.brandflow .no-margin { margin: 0 !important; }
body.brandflow .auto-margin { margin-left: auto; margin-right: auto; }

/* Flexbox Utilities */
body.brandflow .flex { display: flex !important; }
body.brandflow .flex-row { flex-direction: row !important; }
body.brandflow .flex-col { flex-direction: column !important; }
body.brandflow .flex-wrap { flex-wrap: wrap !important; }
body.brandflow .flex-nowrap { flex-wrap: nowrap !important; }
body.brandflow .items-center { align-items: center !important; }
body.brandflow .items-start { align-items: flex-start !important; }
body.brandflow .items-end { align-items: flex-end !important; }
body.brandflow .items-stretch { align-items: stretch !important; }
body.brandflow .justify-center { justify-content: center !important; }
body.brandflow .justify-start { justify-content: flex-start !important; }
body.brandflow .justify-end { justify-content: flex-end !important; }
body.brandflow .justify-between { justify-content: space-between !important; }
body.brandflow .justify-around { justify-content: space-around !important; }
body.brandflow .justify-evenly { justify-content: space-evenly !important; }
body.brandflow .flex-1 { flex: 1 1 0% !important; }
body.brandflow .flex-auto { flex: 1 1 auto !important; }
body.brandflow .flex-none { flex: none !important; }

/* Grid Utilities */
body.brandflow .grid { display: grid !important; }
body.brandflow .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
body.brandflow .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.brandflow .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
body.brandflow .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
body.brandflow .grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
body.brandflow .grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }

/* Text Utilities */
body.brandflow .text-left { text-align: left !important; }
body.brandflow .text-center { text-align: center !important; }
body.brandflow .text-right { text-align: right !important; }
body.brandflow .text-justify { text-align: justify !important; }
body.brandflow .uppercase { text-transform: uppercase !important; }
body.brandflow .lowercase { text-transform: lowercase !important; }
body.brandflow .capitalize { text-transform: capitalize !important; }
body.brandflow .no-underline { text-decoration: none !important; }
body.brandflow .underline { text-decoration: underline !important; }
body.brandflow .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
body.brandflow .line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden !important; }
body.brandflow .line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden !important; }

/* Width & Height Utilities */
body.brandflow .w-full { width: 100% !important; }
body.brandflow .w-auto { width: auto !important; }
body.brandflow .h-full { height: 100% !important; }
body.brandflow .h-auto { height: auto !important; }
body.brandflow .max-w-full { max-width: 100% !important; }

/* Display Utilities */
body.brandflow .block { display: block !important; }
body.brandflow .inline-block { display: inline-block !important; }
body.brandflow .inline { display: inline !important; }
body.brandflow .hidden { display: none !important; }

/* Shadow Utilities */
body.brandflow .shadow-none { box-shadow: none !important; }
body.brandflow .shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important; }
body.brandflow .shadow { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important; }
body.brandflow .shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }
body.brandflow .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }
body.brandflow .shadow-xl { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important; }
body.brandflow .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important; }

/* Border Width Utilities */
body.brandflow .border-0 { border-width: 0 !important; }
body.brandflow .border { border-width: 1px !important; }
body.brandflow .border-2 { border-width: 2px !important; }
body.brandflow .border-4 { border-width: 4px !important; }
body.brandflow .border-t { border-top-width: 1px !important; }
body.brandflow .border-r { border-right-width: 1px !important; }
body.brandflow .border-b { border-bottom-width: 1px !important; }
body.brandflow .border-l { border-left-width: 1px !important; }

/* Border Style Utilities */
body.brandflow .border-solid { border-style: solid !important; }
body.brandflow .border-dashed { border-style: dashed !important; }
body.brandflow .border-dotted { border-style: dotted !important; }

/* Position Utilities */
body.brandflow .relative { position: relative !important; }
body.brandflow .absolute { position: absolute !important; }
body.brandflow .fixed { position: fixed !important; }
body.brandflow .static { position: static !important; }

/* Overflow Utilities */
body.brandflow .overflow-auto { overflow: auto !important; }
body.brandflow .overflow-hidden { overflow: hidden !important; }
body.brandflow .overflow-visible { overflow: visible !important; }
body.brandflow .overflow-scroll { overflow: scroll !important; }

/* Z-Index Utilities */
body.brandflow .z-0 { z-index: 0 !important; }
body.brandflow .z-10 { z-index: 10 !important; }
body.brandflow .z-20 { z-index: 20 !important; }
body.brandflow .z-30 { z-index: 30 !important; }
body.brandflow .z-40 { z-index: 40 !important; }
body.brandflow .z-50 { z-index: 50 !important; }

/* Fallback utilities for Elementor editor (work without body.brandflow class) */
/* Padding - All Around */
.padding-xs { padding: var(--space-xs) !important; }
.padding-s { padding: var(--space-s) !important; }
.padding-m { padding: var(--space-m) !important; }
.padding-l { padding: var(--space-l) !important; }
.padding-xl { padding: var(--space-xl) !important; }
.padding-2xl { padding: var(--space-2xl) !important; }
.padding-3xl { padding: var(--space-3xl) !important; }

/* Padding - Horizontal & Vertical */
.padding-x-xs { padding-left: var(--space-xs) !important; padding-right: var(--space-xs) !important; }
.padding-y-xs { padding-top: var(--space-xs) !important; padding-bottom: var(--space-xs) !important; }
.padding-x-s { padding-left: var(--space-s) !important; padding-right: var(--space-s) !important; }
.padding-y-s { padding-top: var(--space-s) !important; padding-bottom: var(--space-s) !important; }
.padding-x-m { padding-left: var(--space-m) !important; padding-right: var(--space-m) !important; }
.padding-y-m { padding-top: var(--space-m) !important; padding-bottom: var(--space-m) !important; }
.padding-x-l { padding-left: var(--space-l) !important; padding-right: var(--space-l) !important; }
.padding-y-l { padding-top: var(--space-l) !important; padding-bottom: var(--space-l) !important; }
.padding-x-xl { padding-left: var(--space-xl) !important; padding-right: var(--space-xl) !important; }
.padding-y-xl { padding-top: var(--space-xl) !important; padding-bottom: var(--space-xl) !important; }
.padding-x-2xl { padding-left: var(--space-2xl) !important; padding-right: var(--space-2xl) !important; }
.padding-y-2xl { padding-top: var(--space-2xl) !important; padding-bottom: var(--space-2xl) !important; }
.padding-x-3xl { padding-left: var(--space-3xl) !important; padding-right: var(--space-3xl) !important; }
.padding-y-3xl { padding-top: var(--space-3xl) !important; padding-bottom: var(--space-3xl) !important; }