/* helper classes */
.has-color-11-color { color: var(--color11) !important; }
.has-color-12-color { color: var(--color12) !important; }
.has-color-13-color { color: var(--color13) !important; }
.has-color-21-color { color: var(--color21) !important; }
.has-color-22-color { color: var(--color22) !important; }
.has-color-23-color { color: var(--color23) !important; }
.has-color-31-color { color: var(--color31) !important; }
.has-color-32-color { color: var(--color32) !important; }
.has-color-33-color { color: var(--color33) !important; }
.has-color-41-color { color: var(--color41) !important; }
.has-color-42-color { color: var(--color42) !important; }
.has-color-43-color { color: var(--color43) !important; }
.has-color-51-color { color: var(--color51) !important; }
.has-color-52-color { color: var(--color52) !important; }
.has-color-53-color { color: var(--color53) !important; }
.has-color-61-color { color: var(--color61) !important; }
.has-color-62-color { color: var(--color62) !important; }

.has-color-11-background-color { background-color: var(--color11) !important; }
.has-color-12-background-color { background-color: var(--color12) !important; }
.has-color-13-background-color { background-color: var(--color13) !important; }
.has-color-21-background-color { background-color: var(--color21) !important; }
.has-color-22-background-color { background-color: var(--color22) !important; }
.has-color-23-background-color { background-color: var(--color23) !important; }
.has-color-31-background-color { background-color: var(--color31) !important; }
.has-color-32-background-color { background-color: var(--color32) !important; }
.has-color-33-background-color { background-color: var(--color33) !important; }
.has-color-41-background-color { background-color: var(--color41) !important; }
.has-color-42-background-color { background-color: var(--color42) !important; }
.has-color-43-background-color { background-color: var(--color43) !important; }
.has-color-51-background-color { background-color: var(--color51) !important; }
.has-color-52-background-color { background-color: var(--color52) !important; }
.has-color-53-background-color { background-color: var(--color53) !important; }
.has-color-61-background-color { background-color: var(--color61) !important; }
.has-color-62-background-color { background-color: var(--color62) !important; }

.has-font-1 { font-family: var(--fontFamily1); }
.has-font-2 { font-family: var(--fontFamily2); }
.has-font-3 { font-family: var(--fontFamily3); }

.has-h-1-font-size { font-size: var(--H1fontSize); font-weight: var(--H1fontWeight); line-height: var(--H1lineHeight); }
.has-h-2-font-size { font-size: var(--H2fontSize); font-weight: var(--H2fontWeight); line-height: var(--H2lineHeight); }
.has-h-3-font-size { font-size: var(--H3fontSize); font-weight: var(--H3fontWeight); line-height: var(--H3lineHeight); }
.has-h-4-font-size { font-size: var(--H4fontSize); font-weight: var(--H4fontWeight); line-height: var(--H4lineHeight); }
.has-h-5-font-size { font-size: var(--H5fontSize); font-weight: var(--H5fontWeight); line-height: var(--H5lineHeight); }
.has-h-6-font-size { font-size: var(--H6fontSize); font-weight: var(--H6fontWeight); line-height: var(--H6lineHeight); }
.has-txt-font-size { font-size: var(--fontSize); }
.has-fontsize-small { font-size: .85rem; }
@media (max-width: var(grid_xl)) {
    .has-h-1-font-size { font-size: calc(var(--H1fontSize) * 0.9); }
    .has-h-2-font-size { font-size: calc(var(--H2fontSize) * 0.9); }
    .has-h-3-font-size { font-size: calc(var(--H3fontSize) * 0.9); }
    .has-h-4-font-size { font-size: calc(var(--H4fontSize) * 0.9); }
}
@media (max-width: var(grid_sm)) {
    .has-h-1-font-size { font-size: calc(var(--H1fontSize) * 0.8); }
    .has-h-2-font-size { font-size: calc(var(--H2fontSize) * 0.8); }
}

.has-color11-to-color12-gradient-background { background: linear-gradient(130deg,var(--color11) 0%,var(--color12) 100%); }
.has-color11-to-color13-gradient-background { background: linear-gradient(130deg,var(--color11) 0%,var(--color12) 50%,var(--color13) 100%); }
.has-color12-to-color13-gradient-background { background: linear-gradient(130deg,var(--color12) 0%,var(--color13) 100%); }
.has-color11-to-color31-gradient-background { background: linear-gradient(130deg,var(--color11) 0%,var(--color12) 33%,var(--color13) 66%,var(--color31) 100%); }
.has-branding-steps-gradient-background {     background: linear-gradient(130deg,var(--color11) 0%,var(--color12) 50%,var(--color11) 50%,var(--color12) 75%,var(--color13) 75%,var(--color12) 100%); }
.has-branding-experiment-gradient-background { background: linear-gradient(130deg,var(--color13) 50%,var(--color12) 50%,var(--color12) 60%,var(--color11) 60%,var(--color11) 70%,var(--color12) 80%,var(--color13) 80%,var(--color13) 90%,var(--color11) 90%); }

.has-color62-to-color22-gradient-background { background: linear-gradient(130deg,var(--color62) 0%,var(--color22) 100%); }
.has-color23-to-color32-gradient-background { background: linear-gradient(130deg,var(--color23) 0%,var(--color22) 50%,var(--color32) 100%); }
.has-color62-to-color21-gradient-background { background: linear-gradient(130deg,var(--color62) 0%,var(--color33) 33%,var(--color32) 66%,var(--color21) 100%); }
.has-color33-to-color31-gradient-background { background: linear-gradient(130deg,var(--color33) 0%,var(--color21) 66%,var(--color31) 100%); }
.has-darken-steps-gradient-background {       background: linear-gradient(130deg,var(--color23) 0%,var(--color22) 50%,var(--color33) 50%,var(--color22) 75%,var(--color32) 75%,var(--color21) 100%); }
.has-color63-to-color62-gradient-background { background: linear-gradient(180deg,var(--color63) 0%,var(--color62) 100%); }

.has-color-11-to-color-12-se-gradient-background { background: linear-gradient(145deg,var(--color11) 0%,var(--color12) 100%); }
.has-color-11-to-color-12-sw-gradient-background { background: linear-gradient(202deg,var(--color11) 0%,var(--color12) 100%); }
.has-color-11-to-color-12-ne-gradient-background { background: linear-gradient(29deg,var(--color11) 0%,var(--color12) 100%); }
.has-color-31-to-color-63-s-gradient-background { background: linear-gradient(180deg,var(--color31) 0%,var(--color63) 100%); }
.has-color-21-to-color-31-ne-gradient-background { background: linear-gradient(29deg,var(--color21) 0%,var(--color31) 100%); }
.has-color-32-to-color-23-ne-gradient-background { background: linear-gradient(45deg,var(--color32) 0%,var(--color23) 100%); }
.has-color-33-to-color-62-n-gradient-background { background: linear-gradient(0deg,var(--color33) 0%,var(--color62) 100%); }
.has-color-33-to-color-23-s-gradient-background { background: linear-gradient(180deg,var(--color33) 49.99%,var(--color23) 50%); }