.og-cow-1 { width: var(--cow-full); }
.og-cow-2 { width: var(--cow-wide); }
.og-cow-3 { width: var(--cow-main); }
.og-cow-4 { width: var(--cow-compact); }
.og-cow-5 { width: var(--cow-slim); }
.og-cow-6 { width: fit-content; }

.og-h-1 { height: 100%; }

/* TEXT CLASSES */
/* Font Sizes */
.og-fs-1 { font-size: var(--fs-1) !important; }
.og-fs-2 { font-size: var(--fs-2) !important; }
.og-fs-3 { font-size: var(--fs-3) !important; }
.og-fs-4 { font-size: var(--fs-4) !important; }
.og-fs-5 { font-size: var(--fs-5) !important; }
.og-fs-6 { font-size: var(--fs-6) !important; }
.og-fs-7 { font-size: var(--fs-7) !important; }
.og-fs-0 {
    font-size: var(--fs-0) !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

/* Font Family */
.og-ff-1 { font-family: var(--ff-1); }
.og-ff-2 { font-family: var(--ff-2); }
.og-ff-3 { font-family: var(--ff-3); }

/* Line Height */
.og-lh-1 { line-height: var(--lh-1); }
.og-lh-2 { line-height: var(--lh-2); }
.og-lh-3 { line-height: var(--lh-3); }

/* Font Weight */
.og-fw-1 { font-weight: 700; }
.og-fw-2 { font-weight: 600; }
.og-fw-3 { font-weight: 500; }
.og-fw-4 { font-weight: 400; }
.og-fw-5 { font-weight: 300; }

/* Letter Spacing */
.og-ls-1 { letter-spacing: var(--ls-1); }
.og-ls-2 { letter-spacing: var(--ls-2); }
.og-ls-3 { letter-spacing: var(--ls-3); }

/* Text Decoration */
.og-td-0 { text-decoration: none; }
.og-td-1 { text-decoration: underline; }

/* Text Align */
.og-ta-1 { text-align: left; }
.og-ta-2 { text-align: center; }
.og-ta-3 { text-align: right; }

/* Text Transform */
.og-tt-0 { text-transform: none;}
.og-tt-1 { text-transform: uppercase;}
.og-tt-2 { text-transform: capitalize;}

/* SPACING CLASSES */
/* Margin-Top */
.og-mt-0 { margin-top: 0!important; }
.og-mt-1 { margin-top: var(--spc-1); }
.og-mt-2 { margin-top: var(--spc-2); }
.og-mt-3 { margin-top: var(--spc-3); }
.og-mt-4 { margin-top: var(--spc-4); }
.og-mt-5 { margin-top: var(--spc-5); }
.og-mt-6 { margin-top: var(--spc-6); }
.og-mt-7 { margin-top: var(--spc-7); }
.og-mt-8 { margin-top: var(--spc-8); }
.og-mt-9 { margin-top: var(--spc-9); }

/* Margin-Auto */
.og-ml-a { margin-left: auto; }
.og-mr-a { margin-right: auto; }
.og-mi-a { margin-inline: auto; }

/* Margin-Bottom */
.og-mb-0 { margin-bottom: 0!important; }
.og-mb-1 { margin-bottom: var(--spc-1); }
.og-mb-2 { margin-bottom: var(--spc-2); }
.og-mb-3 { margin-bottom: var(--spc-3); }
.og-mb-4 { margin-bottom: var(--spc-4); }
.og-mb-5 { margin-bottom: var(--spc-5); }
.og-mb-6 { margin-bottom: var(--spc-6); }
.og-mb-7 { margin-bottom: var(--spc-7); }
.og-mb-8 { margin-bottom: var(--spc-8); }
.og-mb-9 { margin-bottom: var(--spc-9); }

/* Margin-Right */
.og-mr-0 { margin-right: 0!important; }
.og-mr-1 { margin-right: var(--spc-1); }
.og-mr-2 { margin-right: var(--spc-2); }
.og-mr-3 { margin-right: var(--spc-3); }
.og-mr-4 { margin-right: var(--spc-4); }
.og-mr-5 { margin-right: var(--spc-5); }
.og-mr-6 { margin-right: var(--spc-6); }
.og-mr-7 { margin-right: var(--spc-7); }
.og-mr-8 { margin-right: var(--spc-8); }
.og-mr-9 { margin-right: var(--spc-9); }

/* Margin-Left */
.og-ml-0 { margin-left: 0!important; }
.og-ml-1 { margin-left: var(--spc-1); }
.og-ml-2 { margin-left: var(--spc-2); }
.og-ml-3 { margin-left: var(--spc-3); }
.og-ml-4 { margin-left: var(--spc-4); }
.og-ml-5 { margin-left: var(--spc-5); }
.og-ml-6 { margin-left: var(--spc-6); }
.og-ml-7 { margin-left: var(--spc-7); }
.og-ml-8 { margin-left: var(--spc-8); }
.og-ml-9 { margin-left: var(--spc-9); }


/* PADDING */
/* Padding-Top */
.og-pt-0 { padding-top: 0!important; }
.og-pt-1 { padding-top: var(--spc-1); }
.og-pt-2 { padding-top: var(--spc-2); }
.og-pt-3 { padding-top: var(--spc-3); }
.og-pt-4 { padding-top: var(--spc-4); }
.og-pt-5 { padding-top: var(--spc-5); }
.og-pt-6 { padding-top: var(--spc-6); }
.og-pt-7 { padding-top: var(--spc-7); }
.og-pt-8 { padding-top: var(--spc-8); }
.og-pt-9 { padding-top: var(--spc-9); }

/* Padding-Bottom */
.og-pb-0 { padding-bottom: 0!important; }
.og-pb-1 { padding-bottom: var(--spc-1); }
.og-pb-2 { padding-bottom: var(--spc-2); }
.og-pb-3 { padding-bottom: var(--spc-3); }
.og-pb-4 { padding-bottom: var(--spc-4); }
.og-pb-5 { padding-bottom: var(--spc-5); }
.og-pb-6 { padding-bottom: var(--spc-6); }
.og-pb-7 { padding-bottom: var(--spc-7); }
.og-pb-8 { padding-bottom: var(--spc-8); }
.og-pb-9 { padding-bottom: var(--spc-9); }

/* Padding-Right */
.og-pr-0 { padding-right: 0!important; }
.og-pr-1 { padding-right: var(--spc-1); }
.og-pr-2 { padding-right: var(--spc-2); }
.og-pr-3 { padding-right: var(--spc-3); }
.og-pr-4 { padding-right: var(--spc-4); }
.og-pr-5 { padding-right: var(--spc-5); }
.og-pr-6 { padding-right: var(--spc-6); }
.og-pr-7 { padding-right: var(--spc-7); }
.og-pr-8 { padding-right: var(--spc-8); }
.og-pr-9 { padding-right: var(--spc-9); }

/* Padding-Left */
.og-pl-0 { padding-left: 0!important; }
.og-pl-1 { padding-left: var(--spc-1); }
.og-pl-2 { padding-left: var(--spc-2); }
.og-pl-3 { padding-left: var(--spc-3); }
.og-pl-4 { padding-left: var(--spc-4); }
.og-pl-5 { padding-left: var(--spc-5); }
.og-pl-6 { padding-left: var(--spc-6); }
.og-pl-7 { padding-left: var(--spc-7); }
.og-pl-8 { padding-left: var(--spc-8); }
.og-pl-9 { padding-left: var(--spc-9); }

/* Padding-Inline */
.og-pi-05 { padding-inline: var(--spc-i-05); }
.og-pi-1 { padding-inline: var(--spc-i-1); }
.og-pi-2 { padding-inline: var(--spc-i-2); }
.og-pi-3 { padding-inline: var(--spc-i-3); }

.og-pi-1-05 { padding-inline: var(--spc-i-1); }
.og-pi-2-05 { padding-inline: var(--spc-i-2); }

/* Padding Block */
.og-pbk-0 { padding-block: 0!important; }
.og-pbk-1 { padding-block: var(--spc-1); }
.og-pbk-2 { padding-block: var(--spc-2); }
.og-pbk-3 { padding-block: var(--spc-3); }
.og-pbk-4 { padding-block: var(--spc-4); }
.og-pbk-5 { padding-block: var(--spc-5); }
.og-pbk-6 { padding-block: var(--spc-6); }
.og-pbk-7 { padding-block: var(--spc-7); }
.og-pbk-8 { padding-block: var(--spc-8); }
.og-pbk-9 { padding-block: var(--spc-9); }

@media (max-width: 767px) {
  .og-pi-1-05 { padding-inline: var(--spc-i-05); }
  .og-pi-2-05 { padding-inline: var(--spc-i-05); }
}

/* Gap */
.og-gp-0 { gap: 0!important; }
.og-gp-1 { gap: var(--spc-1); }
.og-gp-2 { gap: var(--spc-2); }
.og-gp-3 { gap: var(--spc-3); }
.og-gp-4 { gap: var(--spc-4); }
.og-gp-5 { gap: var(--spc-5); }
.og-gp-6 { gap: var(--spc-6); }
.og-gp-7 { gap: var(--spc-7); }
.og-gp-8 { gap: var(--spc-8); }
.og-gp-9 { gap: var(--spc-9); }

/* Column-Gap */
.og-cgp-0 { column-gap: 0!important; }
.og-cgp-1 { column-gap: var(--spc-1); }
.og-cgp-2 { column-gap: var(--spc-2); }
.og-cgp-3 { column-gap: var(--spc-3); }
.og-cgp-4 { column-gap: var(--spc-4); }
.og-cgp-5 { column-gap: var(--spc-5); }
.og-cgp-6 { column-gap: var(--spc-6); }
.og-cgp-7 { column-gap: var(--spc-7); }
.og-cgp-8 { column-gap: var(--spc-8); }
.og-cgp-9 { column-gap: var(--spc-9); }

/* Row-Gap */
.og-rgp-0 { row-gap: 0!important; }
.og-rgp-1 { row-gap: var(--spc-1); }
.og-rgp-2 { row-gap: var(--spc-2); }
.og-rgp-3 { row-gap: var(--spc-3); }
.og-rgp-4 { row-gap: var(--spc-4); }
.og-rgp-5 { row-gap: var(--spc-5); }
.og-rgp-6 { row-gap: var(--spc-6); }
.og-rgp-7 { row-gap: var(--spc-7); }
.og-rgp-8 { row-gap: var(--spc-8); }
.og-rgp-9 { row-gap: var(--spc-9); }

/* FLEX */
/* Flex Flow */
.og-fx-1,
.og-fx-1-2 { 
    display: flex;
    flex-flow: row;
}

.og-fx-2,
.og-fx-2-1 { 
    display: flex;
    flex-flow: column;
}

@media (max-width: 767px) {
    .og-fx-1-2 {
        flex-flow: column;
    }

    .og-fx-2-1 {
        flex-flow: row;
    }
}


/* Align Items */
.og-ai-1 { align-items: start; }
.og-ai-2 { align-items: center; }
.og-ai-3 { align-items: end; }
.og-ai-4 { align-items: stretch; }


/* Justify Content */
.og-jc-1{ justify-content: start; }
.og-jc-2 { justify-content: center; }
.og-jc-3 { justify-content: end; }
.og-jc-4 { justify-content: space-between; }
.og-jc-5 { justify-content: space-around; }
.og-jc-6 { justify-content: space-evenly; }


/* GENERAL */
/* Opacity */
.og-op-1 { opacity: .8; }
.og-op-2 { opacity: .5; }

/* Position Relative */
.og-p-2 { position: relative; }

/* Position Sticky */
.og-p-5 { 
    position: sticky;
    z-index: 1;
}

.og-p-5-0 { 
    top: 0;
    position: sticky;
    z-index: 1;
}

/* Nowrap */
.og-ws-1 { white-space: nowrap; }

/* Text Wrap */
.og-tw-1 { text-wrap: balance; }
.og-tw-2 { text-wrap: pretty; }

/* Image Object Fit */
.og-of-0 { object-fit: cover; }
.og-of-1 { object-fit: contain; }

/* Is Hidden */
.og-d-0 {
  display: none!important;
}

@media (max-width: 767px) {
    .og-d-1-0 {
        display: none;
    }
}

@media (min-width: 768px) {
    .og-d-0-1 {
        display: none;
  }
}

/* Border-Radius */
.og-br-100 { border-radius: 100vw; }
.og-br-1,
.og-br-1-0 { border-radius: .75em; }
.og-br-2,
.og-br-2-0 { border-radius: .5em; }

@media (max-width: 767px) {
  .og-br-1-0,
  .og-br-2-0 {
    border-radius: 0;
  }
}

.og-pe-0 {
  pointer-events: none!important;
}

.og-us-0 {
  user-select: none;
}

.og-text-muted   { color: var(--contrast-1); }
.og-text-subtle  { color: var(--contrast-2); }
.og-text-accent  { color: var(--clr-accent-1); }
.og-text-brand-1   { color: var(--clr-brand-1); }
.og-text-brand-2   { color: var(--clr-brand-2); }
.og-text-brand-3   { color: var(--clr-brand-3); }
.og-text-brand-4   { color: var(--clr-brand-4); }

.og-uppercase  { text-transform: uppercase; letter-spacing: var(--ls-3); }
.og-italic     { font-style: italic; }
.og-no-wrap    { white-space: nowrap; }