/*
STANDARD BREAKPOINTS
----------------------------------------------------
X-Small  : max-width = 575px
Small    : min-width = 576px  : max-width = 767px
Medium   : min-width = 768px  : max-width = 991px
Large    : min-width = 992px  : max-width = 1199px
X-Large  : min-width = 1200px : max-width = 1399px
XX-Large : min-width = 1400px 
*/

:root {
    /* Color Palette - Primary */
    --color-primary-teal: #035F5E;
    --color-primary-teal-opaque: #035F5E40;
    --color-secondary-teal: #408483;
    --color-secondary-teal-opaque: #40848340;
    --color-tertiary-teal: #2D4F4F;
    --color-tertiary-teal-opaque: #2D4F4F40;
    /* Color Palette - Text */
    --color-text-dark: #323437;
    --color-text-medium: #5E6C7A;
    --color-text-muted: #3F4347;
    /* Color Palette - Backgrounds */
    --color-bg-sage: #E4EEEE;
    --color-bg-offwhite: #F6F7F4;
    --color-bg-cream: #FFFFFB;
    --color-bg-lightgray: #F1F4F6;
    /* Color Palette - Accents */
    --color-cta-purple: #AE99BE;
    --color-footer-dark: #2D4F4F;
    /* Neutral Colors */
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-border: #E0E3E8;
    --color-border-light: #EFF1F5;
    /* Status Colors */
    --color-red: #D9534F;
    --color-red-light: #E67A77;
    --color-red-dark: #B44441;
    --color-red-opaque: #D9534F40;
    --color-orange: #F0AD4E;
    --color-orange-light: #F5C57A;
    --color-orange-dark: #C98C3F;
    --color-orange-opaque: #F0AD4E40;
    --color-green: #5CB85C;
    --color-green-light: #84CC84;
    --color-green-dark: #4A9A4A;
    --color-green-opaque: #5CB85C40;
    /* Typography */
    --font-heading: "Wix Madefor Display", "Wix Madefor Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-body: "Wix Madefor Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
    /* Font Sizes */
    --font-size-h1: 24px;
    --font-size-h2: 20px;
    --font-size-h3: 18px;
    --font-size-h4: 20px;
    --font-size-body: 16px;
    --font-size-small: 14px;
    --font-size-tiny: 12px;
    /* Font Weights */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    /* Spacing Scale */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 2rem;
    --spacing-3xl: 3rem;
    --spacing-4xl: 4rem;
    --spacing-5xl: 6rem;
    /* Border Radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;
    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);
    --shadow-subtle: 0 2px 8px rgba(3, 95, 94, 0.08);
    /* Transitions */
    --transition-fast: 150ms ease-in-out;
    --transition-base: 300ms ease-in-out;
    --transition-slow: 500ms ease-in-out;
    /* Containers */
    --max-width: 1400px;
    --max-width-narrow: 900px;
    --max-width-wide: 1600px;
    --gutter: 16px;
}
@media(min-width: 576px) {
    :root {
        --spacing-2xl: 3rem;
        --spacing-3xl: 4rem;
        --spacing-4xl: 6rem;
        --spacing-5xl: 8rem;
        --font-size-h1: 32px;
        --font-size-h2: 26px;
        --font-size-h3: 20px;
        --font-size-h4: 18px;
        --font-size-body: 15px;
    }
}
@media (min-width: 768px) {
    :root {
        --gutter: 48px;
        --font-size-h1: 50px;
        --font-size-h2: 35px;
        --font-size-h3: 25px;
        --font-size-h4: 20px;
        --font-size-body: 16px;
    }
}

/* ========================================
ROWS & COLUMNS
======================================== */

.row {
    --row-gutter-y: var(--gutter);
    --row-gutter-x: calc(var(--gutter) * 0.5);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: calc(var(--row-gutter-x) * -1);
    margin-right: calc(var(--row-gutter-x) * -1);
    margin-top: calc(var(--row-gutter-y) * -1);
    /* width: calc(calc(var(--row-gutter-x) * 2) + 100%); */
    min-width: calc(calc(var(--row-gutter-x) * 2) + 100%);
}
.row.gutter-sm {
    --row-gutter-y: calc(var(--gutter) * 0.5);
    --row-gutter-x: calc(var(--gutter) * 0.25);
}
.row + .row {
    margin-top: 0px;
}
.row > * {
    padding-left: var(--row-gutter-x);
    padding-right: var(--row-gutter-x);
    padding-top: var(--row-gutter-y);
}

.col {
    width: 100%;
    flex: 1 0 0%;
}
[class^="col-"] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.col-auto { flex: 0 0 auto; width: auto; }
.col-1  { flex: 0 0 auto; width: 8.333333%;  }
.col-2  { flex: 0 0 auto; width: 16.666667%; }
.col-3  { flex: 0 0 auto; width: 25%;        }
.col-4  { flex: 0 0 auto; width: 33.333333%; }
.col-5  { flex: 0 0 auto; width: 41.666667%; }
.col-6  { flex: 0 0 auto; width: 50%;        }
.col-7  { flex: 0 0 auto; width: 58.333333%; }
.col-8  { flex: 0 0 auto; width: 66.666667%; }
.col-9  { flex: 0 0 auto; width: 75%;        }
.col-10 { flex: 0 0 auto; width: 83.333333%; }
.col-11 { flex: 0 0 auto; width: 91.666667%; }
.col-12 { flex: 0 0 auto; width: 100%;       }
.offset-0  { margin-left: 0%;         }
.offset-1  { margin-left: 8.333333%;  }
.offset-2  { margin-left: 16.666667%; }
.offset-3  { margin-left: 25%;        }
.offset-4  { margin-left: 33.333333%; }
.offset-5  { margin-left: 41.666667%; }
.offset-6  { margin-left: 50%;        }
.offset-7  { margin-left: 58.333333%; }
.offset-8  { margin-left: 66.666667%; }
.offset-9  { margin-left: 75%;        }
.offset-10 { margin-left: 83.333333%; }
.offset-11 { margin-left: 91.666667%; }
.offset-12 { margin-left: 100%;       }
.order-0 { order: 0; }
.order-1 { order: 1; }
.order-2 { order: 2; }
.order-3 { order: 3; }
.order-4 { order: 4; }
.order-5 { order: 5; }

@media(min-width: 576px) {
    .col-sm-auto { flex: 0 0 auto; width: auto; }
    .col-sm-1  { flex: 0 0 auto; width: 8.333333%;  }
    .col-sm-2  { flex: 0 0 auto; width: 16.666667%; }
    .col-sm-3  { flex: 0 0 auto; width: 25%;        }
    .col-sm-4  { flex: 0 0 auto; width: 33.333333%; }
    .col-sm-5  { flex: 0 0 auto; width: 41.666667%; }
    .col-sm-6  { flex: 0 0 auto; width: 50%;        }
    .col-sm-7  { flex: 0 0 auto; width: 58.333333%; }
    .col-sm-8  { flex: 0 0 auto; width: 66.666667%; }
    .col-sm-9  { flex: 0 0 auto; width: 75%;        }
    .col-sm-10 { flex: 0 0 auto; width: 83.333333%; }
    .col-sm-11 { flex: 0 0 auto; width: 91.666667%; }
    .col-sm-12 { flex: 0 0 auto; width: 100%;       }
    .offset-sm-0  { margin-left: 0%;         }
    .offset-sm-1  { margin-left: 8.333333%;  }
    .offset-sm-2  { margin-left: 16.666667%; }
    .offset-sm-3  { margin-left: 25%;        }
    .offset-sm-4  { margin-left: 33.333333%; }
    .offset-sm-5  { margin-left: 41.666667%; }
    .offset-sm-6  { margin-left: 50%;        }
    .offset-sm-7  { margin-left: 58.333333%; }
    .offset-sm-8  { margin-left: 66.666667%; }
    .offset-sm-9  { margin-left: 75%;        }
    .offset-sm-10 { margin-left: 83.333333%; }
    .offset-sm-11 { margin-left: 91.666667%; }
    .offset-sm-12 { margin-left: 100%;       }
    .order-sm-0 { order: 0; }
    .order-sm-1 { order: 1; }
    .order-sm-2 { order: 2; }
    .order-sm-3 { order: 3; }
    .order-sm-4 { order: 4; }
    .order-sm-5 { order: 5; }
}
@media(min-width: 768px) {
    .col-md-auto { flex: 0 0 auto; width: auto; }
    .col-md-1  { flex: 0 0 auto; width: 8.333333%;  }
    .col-md-2  { flex: 0 0 auto; width: 16.666667%; }
    .col-md-3  { flex: 0 0 auto; width: 25%;        }
    .col-md-4  { flex: 0 0 auto; width: 33.333333%; }
    .col-md-5  { flex: 0 0 auto; width: 41.666667%; }
    .col-md-6  { flex: 0 0 auto; width: 50%;        }
    .col-md-7  { flex: 0 0 auto; width: 58.333333%; }
    .col-md-8  { flex: 0 0 auto; width: 66.666667%; }
    .col-md-9  { flex: 0 0 auto; width: 75%;        }
    .col-md-10 { flex: 0 0 auto; width: 83.333333%; }
    .col-md-11 { flex: 0 0 auto; width: 91.666667%; }
    .col-md-12 { flex: 0 0 auto; width: 100%;       }
    .offset-md-0  { margin-left: 0%;         }
    .offset-md-1  { margin-left: 8.333333%;  }
    .offset-md-2  { margin-left: 16.666667%; }
    .offset-md-3  { margin-left: 25%;        }
    .offset-md-4  { margin-left: 33.333333%; }
    .offset-md-5  { margin-left: 41.666667%; }
    .offset-md-6  { margin-left: 50%;        }
    .offset-md-7  { margin-left: 58.333333%; }
    .offset-md-8  { margin-left: 66.666667%; }
    .offset-md-9  { margin-left: 75%;        }
    .offset-md-10 { margin-left: 83.333333%; }
    .offset-md-11 { margin-left: 91.666667%; }
    .offset-md-12 { margin-left: 100%;       }
    .order-md-0 { order: 0; }
    .order-md-1 { order: 1; }
    .order-md-2 { order: 2; }
    .order-md-3 { order: 3; }
    .order-md-4 { order: 4; }
    .order-md-5 { order: 5; }
}
@media(min-width: 992px) {
    .col-lg-auto { flex: 0 0 auto; width: auto; }
    .col-lg-1  { flex: 0 0 auto; width: 8.333333%;  }
    .col-lg-2  { flex: 0 0 auto; width: 16.666667%; }
    .col-lg-3  { flex: 0 0 auto; width: 25%;        }
    .col-lg-4  { flex: 0 0 auto; width: 33.333333%; }
    .col-lg-5  { flex: 0 0 auto; width: 41.666667%; }
    .col-lg-6  { flex: 0 0 auto; width: 50%;        }
    .col-lg-7  { flex: 0 0 auto; width: 58.333333%; }
    .col-lg-8  { flex: 0 0 auto; width: 66.666667%; }
    .col-lg-9  { flex: 0 0 auto; width: 75%;        }
    .col-lg-10 { flex: 0 0 auto; width: 83.333333%; }
    .col-lg-11 { flex: 0 0 auto; width: 91.666667%; }
    .col-lg-12 { flex: 0 0 auto; width: 100%;       }
    .offset-lg-0  { margin-left: 0%;         }
    .offset-lg-1  { margin-left: 8.333333%;  }
    .offset-lg-2  { margin-left: 16.666667%; }
    .offset-lg-3  { margin-left: 25%;        }
    .offset-lg-4  { margin-left: 33.333333%; }
    .offset-lg-5  { margin-left: 41.666667%; }
    .offset-lg-6  { margin-left: 50%;        }
    .offset-lg-7  { margin-left: 58.333333%; }
    .offset-lg-8  { margin-left: 66.666667%; }
    .offset-lg-9  { margin-left: 75%;        }
    .offset-lg-10 { margin-left: 83.333333%; }
    .offset-lg-11 { margin-left: 91.666667%; }
    .offset-lg-12 { margin-left: 100%;       }
    .order-lg-0 { order: 0; }
    .order-lg-1 { order: 1; }
    .order-lg-2 { order: 2; }
    .order-lg-3 { order: 3; }
    .order-lg-4 { order: 4; }
    .order-lg-5 { order: 5; }
}
@media(min-width: 1200px) {
    .col-xl-auto { flex: 0 0 auto; width: auto; }
    .col-xl-1  { flex: 0 0 auto; width: 8.333333%;  }
    .col-xl-2  { flex: 0 0 auto; width: 16.666667%; }
    .col-xl-3  { flex: 0 0 auto; width: 25%;        }
    .col-xl-4  { flex: 0 0 auto; width: 33.333333%; }
    .col-xl-5  { flex: 0 0 auto; width: 41.666667%; }
    .col-xl-6  { flex: 0 0 auto; width: 50%;        }
    .col-xl-7  { flex: 0 0 auto; width: 58.333333%; }
    .col-xl-8  { flex: 0 0 auto; width: 66.666667%; }
    .col-xl-9  { flex: 0 0 auto; width: 75%;        }
    .col-xl-10 { flex: 0 0 auto; width: 83.333333%; }
    .col-xl-11 { flex: 0 0 auto; width: 91.666667%; }
    .col-xl-12 { flex: 0 0 auto; width: 100%;       }
    .offset-xl-0  { margin-left: 0%;         }
    .offset-xl-1  { margin-left: 8.333333%;  }
    .offset-xl-2  { margin-left: 16.666667%; }
    .offset-xl-3  { margin-left: 25%;        }
    .offset-xl-4  { margin-left: 33.333333%; }
    .offset-xl-5  { margin-left: 41.666667%; }
    .offset-xl-6  { margin-left: 50%;        }
    .offset-xl-7  { margin-left: 58.333333%; }
    .offset-xl-8  { margin-left: 66.666667%; }
    .offset-xl-9  { margin-left: 75%;        }
    .offset-xl-10 { margin-left: 83.333333%; }
    .offset-xl-11 { margin-left: 91.666667%; }
    .offset-xl-12 { margin-left: 100%;       }
    .order-xl-0 { order: 0; }
    .order-xl-1 { order: 1; }
    .order-xl-2 { order: 2; }
    .order-xl-3 { order: 3; }
    .order-xl-4 { order: 4; }
    .order-xl-5 { order: 5; }
}
@media(min-width: 1400px) {
    .col-xxl-auto { flex: 0 0 auto; width: auto; }
    .col-xxl-1  { flex: 0 0 auto; width: 8.333333%;  }
    .col-xxl-2  { flex: 0 0 auto; width: 16.666667%; }
    .col-xxl-3  { flex: 0 0 auto; width: 25%;        }
    .col-xxl-4  { flex: 0 0 auto; width: 33.333333%; }
    .col-xxl-5  { flex: 0 0 auto; width: 41.666667%; }
    .col-xxl-6  { flex: 0 0 auto; width: 50%;        }
    .col-xxl-7  { flex: 0 0 auto; width: 58.333333%; }
    .col-xxl-8  { flex: 0 0 auto; width: 66.666667%; }
    .col-xxl-9  { flex: 0 0 auto; width: 75%;        }
    .col-xxl-10 { flex: 0 0 auto; width: 83.333333%; }
    .col-xxl-11 { flex: 0 0 auto; width: 91.666667%; }
    .col-xxl-12 { flex: 0 0 auto; width: 100%;       }
    .offset-xxl-0  { margin-left: 0%;         }
    .offset-xxl-1  { margin-left: 8.333333%;  }
    .offset-xxl-2  { margin-left: 16.666667%; }
    .offset-xxl-3  { margin-left: 25%;        }
    .offset-xxl-4  { margin-left: 33.333333%; }
    .offset-xxl-5  { margin-left: 41.666667%; }
    .offset-xxl-6  { margin-left: 50%;        }
    .offset-xxl-7  { margin-left: 58.333333%; }
    .offset-xxl-8  { margin-left: 66.666667%; }
    .offset-xxl-9  { margin-left: 75%;        }
    .offset-xxl-10 { margin-left: 83.333333%; }
    .offset-xxl-11 { margin-left: 91.666667%; }
    .offset-xxl-12 { margin-left: 100%;       }
    .order-xxl-0 { order: 0; }
    .order-xxl-1 { order: 1; }
    .order-xxl-2 { order: 2; }
    .order-xxl-3 { order: 3; }
    .order-xxl-4 { order: 4; }
    .order-xxl-5 { order: 5; }
}

/* ========================================
HELPER CLASSES
======================================== */

/* MARGIN ------------------------------ */
.m-0  { margin: 0px !important; }
.mt-0 { margin-top: 0px !important; }
.mt-1 { margin-top: var(--spacing-xs) !important; }
.mt-2 { margin-top: var(--spacing-sm) !important; }
.mt-3 { margin-top: var(--spacing-md) !important; }
.mt-4 { margin-top: var(--spacing-lg) !important; }
.mt-5 { margin-top: var(--spacing-xl) !important; }

.mb-0 { margin-bottom: 0px !important; }
.mb-1 { margin-bottom: var(--spacing-xs) !important; }
.mb-2 { margin-bottom: var(--spacing-sm) !important; }
.mb-3 { margin-bottom: var(--spacing-md) !important; }
.mb-4 { margin-bottom: var(--spacing-lg) !important; }
.mb-5 { margin-bottom: var(--spacing-xl) !important; }

.mx-0 { margin-left: 0px !important; margin-right: 0px !important; }
.mx-1 { margin-left: var(--spacing-xs) !important; margin-right: var(--spacing-xs) !important; }
.mx-2 { margin-left: var(--spacing-sm) !important; margin-right: var(--spacing-sm) !important; }
.mx-3 { margin-left: var(--spacing-md) !important; margin-right: var(--spacing-md) !important; }
.mx-4 { margin-left: var(--spacing-lg) !important; margin-right: var(--spacing-lg) !important; }
.mx-5 { margin-left: var(--spacing-xl) !important; margin-right: var(--spacing-xl) !important; }

.my-0 { margin-top: 0px !important; margin-bottom: 0px !important; }
.my-1 { margin-top: var(--spacing-xs) !important; margin-bottom: var(--spacing-xs) !important; }
.my-2 { margin-top: var(--spacing-sm) !important; margin-bottom: var(--spacing-sm) !important; }
.my-3 { margin-top: var(--spacing-md) !important; margin-bottom: var(--spacing-md) !important; }
.my-4 { margin-top: var(--spacing-lg) !important; margin-bottom: var(--spacing-lg) !important; }
.my-5 { margin-top: var(--spacing-xl) !important; margin-bottom: var(--spacing-xl) !important; }

.mr-auto { margin-right: auto !important; }
.ml-auto { margin-left: auto !important; }
.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* PADDING ----------------------------- */
.p-0  { padding: 0px !important; }
.pt-0 { padding-top: 0px !important; }
.pt-1 { padding-top: var(--spacing-xs) !important; }
.pt-2 { padding-top: var(--spacing-sm) !important; }
.pt-3 { padding-top: var(--spacing-md) !important; }
.pt-4 { padding-top: var(--spacing-lg) !important; }
.pt-5 { padding-top: var(--spacing-xl) !important; }

.pb-0 { padding-bottom: 0px !important; }
.pb-1 { padding-bottom: var(--spacing-xs) !important; }
.pb-2 { padding-bottom: var(--spacing-sm) !important; }
.pb-3 { padding-bottom: var(--spacing-md) !important; }
.pb-4 { padding-bottom: var(--spacing-lg) !important; }
.pb-5 { padding-bottom: var(--spacing-xl) !important; }

.px-0 { padding-left: 0px !important; padding-right: 0px !important; }
.px-1 { padding-left: var(--spacing-xs) !important; padding-right: var(--spacing-xs) !important; }
.px-2 { padding-left: var(--spacing-sm) !important; padding-right: var(--spacing-sm) !important; }
.px-3 { padding-left: var(--spacing-md) !important; padding-right: var(--spacing-md) !important; }
.px-4 { padding-left: var(--spacing-lg) !important; padding-right: var(--spacing-lg) !important; }
.px-5 { padding-left: var(--spacing-xl) !important; padding-right: var(--spacing-xl) !important; }

.py-0 { padding-top: 0px !important; padding-bottom: 0px !important; }
.py-1 { padding-top: var(--spacing-xs) !important; padding-bottom: var(--spacing-xs) !important; }
.py-2 { padding-top: var(--spacing-sm) !important; padding-bottom: var(--spacing-sm) !important; }
.py-3 { padding-top: var(--spacing-md) !important; padding-bottom: var(--spacing-md) !important; }
.py-4 { padding-top: var(--spacing-lg) !important; padding-bottom: var(--spacing-lg) !important; }
.py-5 { padding-top: var(--spacing-xl) !important; padding-bottom: var(--spacing-xl) !important; }

/* ========================================
ANIMATIONS & TRANSITIONS
======================================== */

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes pulse {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}
@keyframes shimmer {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.animate-slide-in-up {
    animation: slideInUp var(--transition-slow) ease-out;
}
.animate-slide-in-down {
    animation: slideInDown var(--transition-slow) ease-out;
}
.animate-slide-in-left {
    animation: slideInLeft var(--transition-slow) ease-out;
}
.animate-slide-in-right {
    animation: slideInRight var(--transition-slow) ease-out;
}
.animate-fade-in {
    animation: fadeIn var(--transition-slow) ease-out;
}
.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.animate-shimmer {
    animation: shimmer 2s infinite;
}
.animate-spin {
    animation: spin 0.8s linear infinite;
}