:root {
    /* ---- Spacing System ---- */
    --space-base: 1.5rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-base-cols: 1.5rem;
    --space-lg: 2rem;
    --space-xl: 3rem;
    /* ---- Colors ---- */
    --color-primary: #00315c;
    --color-secondary: #ee6600;
    --color-accent: #0081c3;
    --color-accent2: #fab001;
    --color-dark: #222222;
    --color-light: #e6ecf0;
    --color-primary-10: #19466c;
    --color-primary-20: #335a7d;
    --color-primary-30: #4d6f8d;
    --color-primary-40: #66839d;
    --color-primary-50: #8098ae;
    --color-primary-60: #99adbe;
    --color-primary-70: #b3c1ce;
    --color-primary-80: #ccd6de;
    --color-primary-90: #e6eaef;
    --color-secondary-10: #f07519;
    --color-secondary-20: #f18533;
    --color-secondary-30: #f3944d;
    --color-secondary-40: #f5a366;
    --color-secondary-50: #f7b380;
    --color-secondary-60: #f8c299;
    --color-secondary-70: #fad1b3;
    --color-secondary-80: #fce0cc;
    --color-secondary-90: #fdf0e6;
    --color-accent-10: #198ec9;
    --color-accent-20: #339acf;
    --color-accent-30: #4da7d5;
    --color-accent-40: #66b3db;
    --color-accent-50: #80c0e1;
    --color-accent-60: #99cde7;
    --color-accent-70: #b3d9ed;
    --color-accent-80: #cce6f3;
    --color-accent-90: #e6f2f9;
    --color-accent2-10: #fbb81a;
    --color-accent2-20: #fbc034;
    --color-accent2-30: #fcc84d;
    --color-accent2-40: #fcd067;
    --color-accent2-50: #fdd880;
    --color-accent2-60: #fddf99;
    --color-accent2-70: #fee7b3;
    --color-accent2-80: #feefcc;
    --color-accent2-90: #fff7e6;
    --color-dark-10: #383838;
    --color-dark-20: #4e4e4e;
    --color-dark-30: #646464;
    --color-dark-40: #7a7a7a;
    --color-dark-50: #919191;
    --color-dark-60: #a7a7a7;
    --color-dark-70: #bdbdbd;
    --color-dark-80: #d3d3d3;
    --color-dark-90: #e9e9e9;
    --color-light-10: #e9eef2;
    --color-light-20: #ebf0f3;
    --color-light-30: #eef2f5;
    --color-light-40: #f0f4f6;
    --color-light-50: #f3f6f8;
    --color-light-60: #f5f7f9;
    --color-light-70: #f8f9fb;
    --color-light-80: #fafbfc;
    --color-light-90: #fdfdfe;
    /* ---- Border Radius ---- */
    --br-base: 0.5rem;
    --br-sm: 1rem;
    --br-md: 1.5rem;
    --br-lg: 2rem;
    --br-circle: 50%;
    /* ---- Font Stack ---- */
    --font-stack-base: Inter, serif;
    --font-stack-second: Jost, sans-serif;
}

html {
    font-size: 16px;
}
@media (max-width: 992px) {
    html {
        font-size: 16px;
    }
}
@media (max-width: 768px) {
    html {
        font-size: 15px;
    }
}
@media (max-width: 480px) {
    html {
        font-size: 14px;
    }
}

* {
    font-size: 16px;
}

/* Base Typography */
body {
    font-family: var(--font-stack-base);
    background: rgba(230, 234, 239, 0.5);
    color: var(--color-dark);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.01em;
    padding: 0;
    margin: 0;
}

/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

a,
button,
[class*=z-bgh-],
[class*=z-th-] {
    transition: background-color 0.3s ease, color 0.3s ease;
}

button,
input[type=button],
input[type=submit],
input[type=reset] {
    all: unset;
    display: inline-block;
    cursor: pointer;
    font: inherit;
    line-height: 1;
    box-sizing: border-box;
}

a {
    color: var(--color-primary);
    text-decoration: none;
}
a:hover, a:focus {
    color: var(--color-secondary);
    outline: none;
}

.center-col {
    display: flex;
    justify-content: center;
}

.v-align {
    display: flex;
    align-items: center;
}

.v-align-row {
    display: flex;
    align-items: center;
    height: 100%;
}

/* Typography elements (using em for text sizing) */
h1,
h2,
h3,
h4,
h5,
h6,
.disp-1,
.disp-2,
.disp-3,
.disp-4,
.disp-5,
.disp-6 {
    font-family: var(--font-stack-second);
    margin: 0;
    padding: 0;
    font-weight: 900;
    display: inline-block;
    width: 100%;
    line-height: 1.2;
    margin-bottom: 0.2rem;
}

span {
    font-size: inherit;
}

h1,
.disp-1 {
    font-size: clamp(28px, 3vw + 8px, 32px);
}

h2,
.disp-2 {
    font-size: clamp(24px, 2vw + 8px, 28px);
}

h3,
.disp-3 {
    font-size: clamp(20px, 2vw + 8px, 24px);
}

h4,
.disp-4 {
    font-size: clamp(16px, 2vw + 8px, 20px);
}

h5,
.disp-5 {
    font-size: clamp(16px, 1vw + 8px, 16px);
}

h6,
.disp-6 {
    font-size: clamp(16px, 1vw + 8px, 16px);
}

.z-fw-100 {
    font-weight: 100;
}

.z-fw-200 {
    font-weight: 200;
}

.z-fw-300 {
    font-weight: 300;
}

.z-fw-400 {
    font-weight: 400;
}

.z-fw-500 {
    font-weight: 500;
}

.z-fw-600 {
    font-weight: 600;
}

.z-fw-700 {
    font-weight: 700;
}

.z-fw-800 {
    font-weight: 800;
}

.z-fw-900 {
    font-weight: 900;
}

/* Text alignment */
.z-t-center {
    text-align: center;
}

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

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

span.z-t-center,
span.z-t-left,
span.z-t-right,
p.z-t-center,
p.z-t-left,
p.z-t-right {
    display: inline-block;
    width: 100%;
}

.z-t-uppercase {
    text-transform: uppercase;
}

hr,
.divider {
    border: none;
    border-top: 1px solid currentColor;
    margin: 0.5rem 0;
    width: 100%;
    display: block;
    height: 0;
}

.z-font-base {
    font-family: Inter, serif;
}

.z-font-second {
    font-family: Jost, sans-serif;
}

.square-wrapper {
    width: 100%;
    aspect-ratio: 1/1;
    position: relative;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    width: 100%;
}

img.square {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    aspect-ratio: 1/1;
}

ul li {
    margin: 0;
    padding: 0;
}

ul,
ol {
    padding-left: 0rem;
    margin: 0 0 0.5rem;
    list-style-position: inside;
    font-size: 16px;
}
ul li,
ol li {
    margin-bottom: 0.25rem;
}

ul.clean,
ol.clean {
    list-style: none;
}

dl {
    margin: 0 0 1rem 0;
    padding: 0;
}
dl dt {
    font-weight: 600;
    margin-bottom: 0.25rem;
    color: var(--color-primary);
    font-size: 16px;
    letter-spacing: 0.01em;
}
dl dd {
    margin: 0 0 0.75rem 0;
    border-radius: 0 15px 15px 15px;
    color: var(--color-text-default);
    line-height: 1.5;
    border-left: 2px solid var(--color-primary);
    padding-left: 0.75rem;
}
dl dd dd {
    border-left: 0px solid var(--color-secondary);
    padding-left: 0;
}

mark {
    background: var(--color-primary);
    color: var(--color-light);
    padding: 0 0.25rem;
    border-radius: 2px;
}

p {
    color: inherit;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 400;
    float: left;
    width: 100%;
    margin-top: 0;
    margin-bottom: var(--space-sm);
}
p a {
    color: var(--color-primary);
}
p a:hover, p a:focus {
    color: var(--color-secondary);
}

blockquote {
    padding: var(--space-sm);
    margin: 0 0 var(--space-sm);
    border-left: 4px solid var(--color-primary);
    color: var(--color-primary);
    float: left;
    width: 100%;
    position: relative;
}

.z-fs-12,
.z-fs-12 * {
    font-size: 12px;
}

.z-fs-14,
.z-fs-14 * {
    font-size: 14px;
}

.z-fs-15,
.z-fs-15 * {
    font-size: 15px;
}

.z-fs-18,
.z-fs-18 * {
    font-size: 18px;
}

.z-container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    max-width: 1440px;
    padding-right: var(--space-base);
    padding-left: var(--space-base);
}

.z-container-fluid {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: var(--space-base);
    padding-left: var(--space-base);
}

.z-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(var(--space-base-cols) / -2);
    margin-left: calc(var(--space-base-cols) / -2);
}

.z-row.z-v-align {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-right: calc(var(--space-base-cols) / -2);
    margin-left: calc(var(--space-base-cols) / -2);
}

.z-col-1 {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-2 {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-3 {
    flex: 0 0 25%;
    max-width: 25%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-4 {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-5 {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-6 {
    flex: 0 0 50%;
    max-width: 50%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-7 {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-8 {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-9 {
    flex: 0 0 75%;
    max-width: 75%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-10 {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-11 {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-12 {
    flex: 0 0 100%;
    max-width: 100%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

.z-col-5of5 {
    flex: 0 0 20%;
    max-width: 20%;
    padding-right: calc(var(--space-base-cols) / 2);
    padding-left: calc(var(--space-base-cols) / 2);
}

@media (min-width: 577px) {
    .z-col-sm-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-3 {
        flex: 0 0 25%;
        max-width: 25%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-6 {
        flex: 0 0 50%;
        max-width: 50%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-9 {
        flex: 0 0 75%;
        max-width: 75%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-12 {
        flex: 0 0 100%;
        max-width: 100%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-sm-5of5 {
        flex: 0 0 20%;
        max-width: 20%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
}
@media (min-width: 991px) {
    .z-col-md-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-3 {
        flex: 0 0 25%;
        max-width: 25%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-6 {
        flex: 0 0 50%;
        max-width: 50%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-9 {
        flex: 0 0 75%;
        max-width: 75%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-12 {
        flex: 0 0 100%;
        max-width: 100%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-md-5of5 {
        flex: 0 0 20%;
        max-width: 20%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
}
@media (min-width: 1200px) {
    .z-col-lg-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-3 {
        flex: 0 0 25%;
        max-width: 25%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-6 {
        flex: 0 0 50%;
        max-width: 50%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-9 {
        flex: 0 0 75%;
        max-width: 75%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-12 {
        flex: 0 0 100%;
        max-width: 100%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
    .z-col-lg-5of5 {
        flex: 0 0 20%;
        max-width: 20%;
        padding-right: calc(var(--space-base-cols) / 2);
        padding-left: calc(var(--space-base-cols) / 2);
    }
}
.z-container.z-no-gutters,
.z-container-fluid.z-no-gutters,
.z-no-gutters.z-container,
.z-no-gutters.z-container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.z-container-fluid.z-no-gutters > .z-row,
.z-container-fluid.z-no-gutters > .z-row.z-no-gutters {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.z-col.z-no-gutters,
.z-no-gutters.z-col {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 0 !important;
}

.z-container-fluid.z-no-gutter,
.z-no-gutter.z-container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.z-d-none {
    display: none !important;
}

.z-d-block {
    display: block !important;
}

@media (min-width: 577px) {
    .z-d-none-sm {
        display: none !important;
    }
    .z-d-block-sm {
        display: block !important;
    }
}
@media (min-width: 991px) {
    .z-d-none-md {
        display: none !important;
    }
    .z-d-block-md {
        display: block !important;
    }
}
@media (min-width: 1200px) {
    .z-d-none-lg {
        display: none !important;
    }
    .z-d-block-lg {
        display: block !important;
    }
}
.z-px-base {
    padding-left: var(--space-base);
    padding-right: var(--space-base);
}

.z-py-base {
    padding-top: var(--space-base);
    padding-bottom: var(--space-base);
}

.z-pt-base {
    padding-top: var(--space-base);
}

.z-pr-base {
    padding-right: var(--space-base);
}

.z-pb-base {
    padding-bottom: var(--space-base);
}

.z-pl-base {
    padding-left: var(--space-base);
}

.z-mx-base {
    margin-left: var(--space-base);
    margin-right: var(--space-base);
}

.z-my-base {
    margin-top: var(--space-base);
    margin-bottom: var(--space-base);
}

.z-mt-base {
    margin-top: var(--space-base);
}

.z-mr-base {
    margin-right: var(--space-base);
}

.z-mb-base {
    margin-bottom: var(--space-base);
}

.z-ml-base {
    margin-left: var(--space-base);
}

.z-px-sm {
    padding-left: var(--space-sm);
    padding-right: var(--space-sm);
}

.z-py-sm {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
}

.z-pt-sm {
    padding-top: var(--space-sm);
}

.z-pr-sm {
    padding-right: var(--space-sm);
}

.z-pb-sm {
    padding-bottom: var(--space-sm);
}

.z-pl-sm {
    padding-left: var(--space-sm);
}

.z-mx-sm {
    margin-left: var(--space-sm);
    margin-right: var(--space-sm);
}

.z-my-sm {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
}

.z-mt-sm {
    margin-top: var(--space-sm);
}

.z-mr-sm {
    margin-right: var(--space-sm);
}

.z-mb-sm {
    margin-bottom: var(--space-sm);
}

.z-ml-sm {
    margin-left: var(--space-sm);
}

.z-px-md {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
}

.z-py-md {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
}

.z-pt-md {
    padding-top: var(--space-md);
}

.z-pr-md {
    padding-right: var(--space-md);
}

.z-pb-md {
    padding-bottom: var(--space-md);
}

.z-pl-md {
    padding-left: var(--space-md);
}

.z-mx-md {
    margin-left: var(--space-md);
    margin-right: var(--space-md);
}

.z-my-md {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
}

.z-mt-md {
    margin-top: var(--space-md);
}

.z-mr-md {
    margin-right: var(--space-md);
}

.z-mb-md {
    margin-bottom: var(--space-md);
}

.z-ml-md {
    margin-left: var(--space-md);
}

.z-px-base-cols {
    padding-left: var(--space-base-cols);
    padding-right: var(--space-base-cols);
}

.z-py-base-cols {
    padding-top: var(--space-base-cols);
    padding-bottom: var(--space-base-cols);
}

.z-pt-base-cols {
    padding-top: var(--space-base-cols);
}

.z-pr-base-cols {
    padding-right: var(--space-base-cols);
}

.z-pb-base-cols {
    padding-bottom: var(--space-base-cols);
}

.z-pl-base-cols {
    padding-left: var(--space-base-cols);
}

.z-mx-base-cols {
    margin-left: var(--space-base-cols);
    margin-right: var(--space-base-cols);
}

.z-my-base-cols {
    margin-top: var(--space-base-cols);
    margin-bottom: var(--space-base-cols);
}

.z-mt-base-cols {
    margin-top: var(--space-base-cols);
}

.z-mr-base-cols {
    margin-right: var(--space-base-cols);
}

.z-mb-base-cols {
    margin-bottom: var(--space-base-cols);
}

.z-ml-base-cols {
    margin-left: var(--space-base-cols);
}

.z-px-lg {
    padding-left: var(--space-lg);
    padding-right: var(--space-lg);
}

.z-py-lg {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
}

.z-pt-lg {
    padding-top: var(--space-lg);
}

.z-pr-lg {
    padding-right: var(--space-lg);
}

.z-pb-lg {
    padding-bottom: var(--space-lg);
}

.z-pl-lg {
    padding-left: var(--space-lg);
}

.z-mx-lg {
    margin-left: var(--space-lg);
    margin-right: var(--space-lg);
}

.z-my-lg {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
}

.z-mt-lg {
    margin-top: var(--space-lg);
}

.z-mr-lg {
    margin-right: var(--space-lg);
}

.z-mb-lg {
    margin-bottom: var(--space-lg);
}

.z-ml-lg {
    margin-left: var(--space-lg);
}

.z-px-xl {
    padding-left: var(--space-xl);
    padding-right: var(--space-xl);
}

.z-py-xl {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
}

.z-pt-xl {
    padding-top: var(--space-xl);
}

.z-pr-xl {
    padding-right: var(--space-xl);
}

.z-pb-xl {
    padding-bottom: var(--space-xl);
}

.z-pl-xl {
    padding-left: var(--space-xl);
}

.z-mx-xl {
    margin-left: var(--space-xl);
    margin-right: var(--space-xl);
}

.z-my-xl {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
}

.z-mt-xl {
    margin-top: var(--space-xl);
}

.z-mr-xl {
    margin-right: var(--space-xl);
}

.z-mb-xl {
    margin-bottom: var(--space-xl);
}

.z-ml-xl {
    margin-left: var(--space-xl);
}

.z-c-primary {
    color: #00315c;
}

.z-bg-primary {
    background-color: #00315c;
}

.z-c-secondary {
    color: #ee6600;
}

.z-bg-secondary {
    background-color: #ee6600;
}

.z-c-accent {
    color: #0081c3;
}

.z-bg-accent {
    background-color: #0081c3;
}

.z-c-accent2 {
    color: #fab001;
}

.z-bg-accent2 {
    background-color: #fab001;
}

.z-c-dark {
    color: #222222;
}

.z-bg-dark {
    background-color: #222222;
}

.z-c-light {
    color: #e6ecf0;
}

.z-bg-light {
    background-color: #e6ecf0;
}

.z-c-primary-10 {
    color: #19466c !important;
}

.z-bg-primary-10 {
    background-color: #19466c !important;
}

.z-ch-primary-10:hover,
.z-ch-primary-10:focus {
    color: #19466c !important;
}

.z-bgh-primary-10:hover,
.z-bgh-primary-10:focus {
    background-color: #19466c !important;
}

.z-c-primary-20 {
    color: #335a7d !important;
}

.z-bg-primary-20 {
    background-color: #335a7d !important;
}

.z-ch-primary-20:hover,
.z-ch-primary-20:focus {
    color: #335a7d !important;
}

.z-bgh-primary-20:hover,
.z-bgh-primary-20:focus {
    background-color: #335a7d !important;
}

.z-c-primary-30 {
    color: #4d6f8d !important;
}

.z-bg-primary-30 {
    background-color: #4d6f8d !important;
}

.z-ch-primary-30:hover,
.z-ch-primary-30:focus {
    color: #4d6f8d !important;
}

.z-bgh-primary-30:hover,
.z-bgh-primary-30:focus {
    background-color: #4d6f8d !important;
}

.z-c-primary-40 {
    color: #66839d !important;
}

.z-bg-primary-40 {
    background-color: #66839d !important;
}

.z-ch-primary-40:hover,
.z-ch-primary-40:focus {
    color: #66839d !important;
}

.z-bgh-primary-40:hover,
.z-bgh-primary-40:focus {
    background-color: #66839d !important;
}

.z-c-primary-50 {
    color: #8098ae !important;
}

.z-bg-primary-50 {
    background-color: #8098ae !important;
}

.z-ch-primary-50:hover,
.z-ch-primary-50:focus {
    color: #8098ae !important;
}

.z-bgh-primary-50:hover,
.z-bgh-primary-50:focus {
    background-color: #8098ae !important;
}

.z-c-primary-60 {
    color: #99adbe !important;
}

.z-bg-primary-60 {
    background-color: #99adbe !important;
}

.z-ch-primary-60:hover,
.z-ch-primary-60:focus {
    color: #99adbe !important;
}

.z-bgh-primary-60:hover,
.z-bgh-primary-60:focus {
    background-color: #99adbe !important;
}

.z-c-primary-70 {
    color: #b3c1ce !important;
}

.z-bg-primary-70 {
    background-color: #b3c1ce !important;
}

.z-ch-primary-70:hover,
.z-ch-primary-70:focus {
    color: #b3c1ce !important;
}

.z-bgh-primary-70:hover,
.z-bgh-primary-70:focus {
    background-color: #b3c1ce !important;
}

.z-c-primary-80 {
    color: #ccd6de !important;
}

.z-bg-primary-80 {
    background-color: #ccd6de !important;
}

.z-ch-primary-80:hover,
.z-ch-primary-80:focus {
    color: #ccd6de !important;
}

.z-bgh-primary-80:hover,
.z-bgh-primary-80:focus {
    background-color: #ccd6de !important;
}

.z-c-primary-90 {
    color: #e6eaef !important;
}

.z-bg-primary-90 {
    background-color: #e6eaef !important;
}

.z-ch-primary-90:hover,
.z-ch-primary-90:focus {
    color: #e6eaef !important;
}

.z-bgh-primary-90:hover,
.z-bgh-primary-90:focus {
    background-color: #e6eaef !important;
}

.z-c-secondary-10 {
    color: #f07519 !important;
}

.z-bg-secondary-10 {
    background-color: #f07519 !important;
}

.z-ch-secondary-10:hover,
.z-ch-secondary-10:focus {
    color: #f07519 !important;
}

.z-bgh-secondary-10:hover,
.z-bgh-secondary-10:focus {
    background-color: #f07519 !important;
}

.z-c-secondary-20 {
    color: #f18533 !important;
}

.z-bg-secondary-20 {
    background-color: #f18533 !important;
}

.z-ch-secondary-20:hover,
.z-ch-secondary-20:focus {
    color: #f18533 !important;
}

.z-bgh-secondary-20:hover,
.z-bgh-secondary-20:focus {
    background-color: #f18533 !important;
}

.z-c-secondary-30 {
    color: #f3944d !important;
}

.z-bg-secondary-30 {
    background-color: #f3944d !important;
}

.z-ch-secondary-30:hover,
.z-ch-secondary-30:focus {
    color: #f3944d !important;
}

.z-bgh-secondary-30:hover,
.z-bgh-secondary-30:focus {
    background-color: #f3944d !important;
}

.z-c-secondary-40 {
    color: #f5a366 !important;
}

.z-bg-secondary-40 {
    background-color: #f5a366 !important;
}

.z-ch-secondary-40:hover,
.z-ch-secondary-40:focus {
    color: #f5a366 !important;
}

.z-bgh-secondary-40:hover,
.z-bgh-secondary-40:focus {
    background-color: #f5a366 !important;
}

.z-c-secondary-50 {
    color: #f7b380 !important;
}

.z-bg-secondary-50 {
    background-color: #f7b380 !important;
}

.z-ch-secondary-50:hover,
.z-ch-secondary-50:focus {
    color: #f7b380 !important;
}

.z-bgh-secondary-50:hover,
.z-bgh-secondary-50:focus {
    background-color: #f7b380 !important;
}

.z-c-secondary-60 {
    color: #f8c299 !important;
}

.z-bg-secondary-60 {
    background-color: #f8c299 !important;
}

.z-ch-secondary-60:hover,
.z-ch-secondary-60:focus {
    color: #f8c299 !important;
}

.z-bgh-secondary-60:hover,
.z-bgh-secondary-60:focus {
    background-color: #f8c299 !important;
}

.z-c-secondary-70 {
    color: #fad1b3 !important;
}

.z-bg-secondary-70 {
    background-color: #fad1b3 !important;
}

.z-ch-secondary-70:hover,
.z-ch-secondary-70:focus {
    color: #fad1b3 !important;
}

.z-bgh-secondary-70:hover,
.z-bgh-secondary-70:focus {
    background-color: #fad1b3 !important;
}

.z-c-secondary-80 {
    color: #fce0cc !important;
}

.z-bg-secondary-80 {
    background-color: #fce0cc !important;
}

.z-ch-secondary-80:hover,
.z-ch-secondary-80:focus {
    color: #fce0cc !important;
}

.z-bgh-secondary-80:hover,
.z-bgh-secondary-80:focus {
    background-color: #fce0cc !important;
}

.z-c-secondary-90 {
    color: #fdf0e6 !important;
}

.z-bg-secondary-90 {
    background-color: #fdf0e6 !important;
}

.z-ch-secondary-90:hover,
.z-ch-secondary-90:focus {
    color: #fdf0e6 !important;
}

.z-bgh-secondary-90:hover,
.z-bgh-secondary-90:focus {
    background-color: #fdf0e6 !important;
}

.z-c-accent-10 {
    color: #198ec9 !important;
}

.z-bg-accent-10 {
    background-color: #198ec9 !important;
}

.z-ch-accent-10:hover,
.z-ch-accent-10:focus {
    color: #198ec9 !important;
}

.z-bgh-accent-10:hover,
.z-bgh-accent-10:focus {
    background-color: #198ec9 !important;
}

.z-c-accent-20 {
    color: #339acf !important;
}

.z-bg-accent-20 {
    background-color: #339acf !important;
}

.z-ch-accent-20:hover,
.z-ch-accent-20:focus {
    color: #339acf !important;
}

.z-bgh-accent-20:hover,
.z-bgh-accent-20:focus {
    background-color: #339acf !important;
}

.z-c-accent-30 {
    color: #4da7d5 !important;
}

.z-bg-accent-30 {
    background-color: #4da7d5 !important;
}

.z-ch-accent-30:hover,
.z-ch-accent-30:focus {
    color: #4da7d5 !important;
}

.z-bgh-accent-30:hover,
.z-bgh-accent-30:focus {
    background-color: #4da7d5 !important;
}

.z-c-accent-40 {
    color: #66b3db !important;
}

.z-bg-accent-40 {
    background-color: #66b3db !important;
}

.z-ch-accent-40:hover,
.z-ch-accent-40:focus {
    color: #66b3db !important;
}

.z-bgh-accent-40:hover,
.z-bgh-accent-40:focus {
    background-color: #66b3db !important;
}

.z-c-accent-50 {
    color: #80c0e1 !important;
}

.z-bg-accent-50 {
    background-color: #80c0e1 !important;
}

.z-ch-accent-50:hover,
.z-ch-accent-50:focus {
    color: #80c0e1 !important;
}

.z-bgh-accent-50:hover,
.z-bgh-accent-50:focus {
    background-color: #80c0e1 !important;
}

.z-c-accent-60 {
    color: #99cde7 !important;
}

.z-bg-accent-60 {
    background-color: #99cde7 !important;
}

.z-ch-accent-60:hover,
.z-ch-accent-60:focus {
    color: #99cde7 !important;
}

.z-bgh-accent-60:hover,
.z-bgh-accent-60:focus {
    background-color: #99cde7 !important;
}

.z-c-accent-70 {
    color: #b3d9ed !important;
}

.z-bg-accent-70 {
    background-color: #b3d9ed !important;
}

.z-ch-accent-70:hover,
.z-ch-accent-70:focus {
    color: #b3d9ed !important;
}

.z-bgh-accent-70:hover,
.z-bgh-accent-70:focus {
    background-color: #b3d9ed !important;
}

.z-c-accent-80 {
    color: #cce6f3 !important;
}

.z-bg-accent-80 {
    background-color: #cce6f3 !important;
}

.z-ch-accent-80:hover,
.z-ch-accent-80:focus {
    color: #cce6f3 !important;
}

.z-bgh-accent-80:hover,
.z-bgh-accent-80:focus {
    background-color: #cce6f3 !important;
}

.z-c-accent-90 {
    color: #e6f2f9 !important;
}

.z-bg-accent-90 {
    background-color: #e6f2f9 !important;
}

.z-ch-accent-90:hover,
.z-ch-accent-90:focus {
    color: #e6f2f9 !important;
}

.z-bgh-accent-90:hover,
.z-bgh-accent-90:focus {
    background-color: #e6f2f9 !important;
}

.z-c-accent2-10 {
    color: #fbb81a !important;
}

.z-bg-accent2-10 {
    background-color: #fbb81a !important;
}

.z-ch-accent2-10:hover,
.z-ch-accent2-10:focus {
    color: #fbb81a !important;
}

.z-bgh-accent2-10:hover,
.z-bgh-accent2-10:focus {
    background-color: #fbb81a !important;
}

.z-c-accent2-20 {
    color: #fbc034 !important;
}

.z-bg-accent2-20 {
    background-color: #fbc034 !important;
}

.z-ch-accent2-20:hover,
.z-ch-accent2-20:focus {
    color: #fbc034 !important;
}

.z-bgh-accent2-20:hover,
.z-bgh-accent2-20:focus {
    background-color: #fbc034 !important;
}

.z-c-accent2-30 {
    color: #fcc84d !important;
}

.z-bg-accent2-30 {
    background-color: #fcc84d !important;
}

.z-ch-accent2-30:hover,
.z-ch-accent2-30:focus {
    color: #fcc84d !important;
}

.z-bgh-accent2-30:hover,
.z-bgh-accent2-30:focus {
    background-color: #fcc84d !important;
}

.z-c-accent2-40 {
    color: #fcd067 !important;
}

.z-bg-accent2-40 {
    background-color: #fcd067 !important;
}

.z-ch-accent2-40:hover,
.z-ch-accent2-40:focus {
    color: #fcd067 !important;
}

.z-bgh-accent2-40:hover,
.z-bgh-accent2-40:focus {
    background-color: #fcd067 !important;
}

.z-c-accent2-50 {
    color: #fdd880 !important;
}

.z-bg-accent2-50 {
    background-color: #fdd880 !important;
}

.z-ch-accent2-50:hover,
.z-ch-accent2-50:focus {
    color: #fdd880 !important;
}

.z-bgh-accent2-50:hover,
.z-bgh-accent2-50:focus {
    background-color: #fdd880 !important;
}

.z-c-accent2-60 {
    color: #fddf99 !important;
}

.z-bg-accent2-60 {
    background-color: #fddf99 !important;
}

.z-ch-accent2-60:hover,
.z-ch-accent2-60:focus {
    color: #fddf99 !important;
}

.z-bgh-accent2-60:hover,
.z-bgh-accent2-60:focus {
    background-color: #fddf99 !important;
}

.z-c-accent2-70 {
    color: #fee7b3 !important;
}

.z-bg-accent2-70 {
    background-color: #fee7b3 !important;
}

.z-ch-accent2-70:hover,
.z-ch-accent2-70:focus {
    color: #fee7b3 !important;
}

.z-bgh-accent2-70:hover,
.z-bgh-accent2-70:focus {
    background-color: #fee7b3 !important;
}

.z-c-accent2-80 {
    color: #feefcc !important;
}

.z-bg-accent2-80 {
    background-color: #feefcc !important;
}

.z-ch-accent2-80:hover,
.z-ch-accent2-80:focus {
    color: #feefcc !important;
}

.z-bgh-accent2-80:hover,
.z-bgh-accent2-80:focus {
    background-color: #feefcc !important;
}

.z-c-accent2-90 {
    color: #fff7e6 !important;
}

.z-bg-accent2-90 {
    background-color: #fff7e6 !important;
}

.z-ch-accent2-90:hover,
.z-ch-accent2-90:focus {
    color: #fff7e6 !important;
}

.z-bgh-accent2-90:hover,
.z-bgh-accent2-90:focus {
    background-color: #fff7e6 !important;
}

.z-c-dark-10 {
    color: #383838 !important;
}

.z-bg-dark-10 {
    background-color: #383838 !important;
}

.z-ch-dark-10:hover,
.z-ch-dark-10:focus {
    color: #383838 !important;
}

.z-bgh-dark-10:hover,
.z-bgh-dark-10:focus {
    background-color: #383838 !important;
}

.z-c-dark-20 {
    color: #4e4e4e !important;
}

.z-bg-dark-20 {
    background-color: #4e4e4e !important;
}

.z-ch-dark-20:hover,
.z-ch-dark-20:focus {
    color: #4e4e4e !important;
}

.z-bgh-dark-20:hover,
.z-bgh-dark-20:focus {
    background-color: #4e4e4e !important;
}

.z-c-dark-30 {
    color: #646464 !important;
}

.z-bg-dark-30 {
    background-color: #646464 !important;
}

.z-ch-dark-30:hover,
.z-ch-dark-30:focus {
    color: #646464 !important;
}

.z-bgh-dark-30:hover,
.z-bgh-dark-30:focus {
    background-color: #646464 !important;
}

.z-c-dark-40 {
    color: #7a7a7a !important;
}

.z-bg-dark-40 {
    background-color: #7a7a7a !important;
}

.z-ch-dark-40:hover,
.z-ch-dark-40:focus {
    color: #7a7a7a !important;
}

.z-bgh-dark-40:hover,
.z-bgh-dark-40:focus {
    background-color: #7a7a7a !important;
}

.z-c-dark-50 {
    color: #919191 !important;
}

.z-bg-dark-50 {
    background-color: #919191 !important;
}

.z-ch-dark-50:hover,
.z-ch-dark-50:focus {
    color: #919191 !important;
}

.z-bgh-dark-50:hover,
.z-bgh-dark-50:focus {
    background-color: #919191 !important;
}

.z-c-dark-60 {
    color: #a7a7a7 !important;
}

.z-bg-dark-60 {
    background-color: #a7a7a7 !important;
}

.z-ch-dark-60:hover,
.z-ch-dark-60:focus {
    color: #a7a7a7 !important;
}

.z-bgh-dark-60:hover,
.z-bgh-dark-60:focus {
    background-color: #a7a7a7 !important;
}

.z-c-dark-70 {
    color: #bdbdbd !important;
}

.z-bg-dark-70 {
    background-color: #bdbdbd !important;
}

.z-ch-dark-70:hover,
.z-ch-dark-70:focus {
    color: #bdbdbd !important;
}

.z-bgh-dark-70:hover,
.z-bgh-dark-70:focus {
    background-color: #bdbdbd !important;
}

.z-c-dark-80 {
    color: #d3d3d3 !important;
}

.z-bg-dark-80 {
    background-color: #d3d3d3 !important;
}

.z-ch-dark-80:hover,
.z-ch-dark-80:focus {
    color: #d3d3d3 !important;
}

.z-bgh-dark-80:hover,
.z-bgh-dark-80:focus {
    background-color: #d3d3d3 !important;
}

.z-c-dark-90 {
    color: #e9e9e9 !important;
}

.z-bg-dark-90 {
    background-color: #e9e9e9 !important;
}

.z-ch-dark-90:hover,
.z-ch-dark-90:focus {
    color: #e9e9e9 !important;
}

.z-bgh-dark-90:hover,
.z-bgh-dark-90:focus {
    background-color: #e9e9e9 !important;
}

.z-c-light-10 {
    color: #e9eef2 !important;
}

.z-bg-light-10 {
    background-color: #e9eef2 !important;
}

.z-ch-light-10:hover,
.z-ch-light-10:focus {
    color: #e9eef2 !important;
}

.z-bgh-light-10:hover,
.z-bgh-light-10:focus {
    background-color: #e9eef2 !important;
}

.z-c-light-20 {
    color: #ebf0f3 !important;
}

.z-bg-light-20 {
    background-color: #ebf0f3 !important;
}

.z-ch-light-20:hover,
.z-ch-light-20:focus {
    color: #ebf0f3 !important;
}

.z-bgh-light-20:hover,
.z-bgh-light-20:focus {
    background-color: #ebf0f3 !important;
}

.z-c-light-30 {
    color: #eef2f5 !important;
}

.z-bg-light-30 {
    background-color: #eef2f5 !important;
}

.z-ch-light-30:hover,
.z-ch-light-30:focus {
    color: #eef2f5 !important;
}

.z-bgh-light-30:hover,
.z-bgh-light-30:focus {
    background-color: #eef2f5 !important;
}

.z-c-light-40 {
    color: #f0f4f6 !important;
}

.z-bg-light-40 {
    background-color: #f0f4f6 !important;
}

.z-ch-light-40:hover,
.z-ch-light-40:focus {
    color: #f0f4f6 !important;
}

.z-bgh-light-40:hover,
.z-bgh-light-40:focus {
    background-color: #f0f4f6 !important;
}

.z-c-light-50 {
    color: #f3f6f8 !important;
}

.z-bg-light-50 {
    background-color: #f3f6f8 !important;
}

.z-ch-light-50:hover,
.z-ch-light-50:focus {
    color: #f3f6f8 !important;
}

.z-bgh-light-50:hover,
.z-bgh-light-50:focus {
    background-color: #f3f6f8 !important;
}

.z-c-light-60 {
    color: #f5f7f9 !important;
}

.z-bg-light-60 {
    background-color: #f5f7f9 !important;
}

.z-ch-light-60:hover,
.z-ch-light-60:focus {
    color: #f5f7f9 !important;
}

.z-bgh-light-60:hover,
.z-bgh-light-60:focus {
    background-color: #f5f7f9 !important;
}

.z-c-light-70 {
    color: #f8f9fb !important;
}

.z-bg-light-70 {
    background-color: #f8f9fb !important;
}

.z-ch-light-70:hover,
.z-ch-light-70:focus {
    color: #f8f9fb !important;
}

.z-bgh-light-70:hover,
.z-bgh-light-70:focus {
    background-color: #f8f9fb !important;
}

.z-c-light-80 {
    color: #fafbfc !important;
}

.z-bg-light-80 {
    background-color: #fafbfc !important;
}

.z-ch-light-80:hover,
.z-ch-light-80:focus {
    color: #fafbfc !important;
}

.z-bgh-light-80:hover,
.z-bgh-light-80:focus {
    background-color: #fafbfc !important;
}

.z-c-light-90 {
    color: #fdfdfe !important;
}

.z-bg-light-90 {
    background-color: #fdfdfe !important;
}

.z-ch-light-90:hover,
.z-ch-light-90:focus {
    color: #fdfdfe !important;
}

.z-bgh-light-90:hover,
.z-bgh-light-90:focus {
    background-color: #fdfdfe !important;
}

.z-br-base {
    border-radius: var(--br-base, 0.5rem);
}

.z-br-x-base {
    border-top-right-radius: var(--br-base, 0.5rem);
    border-bottom-right-radius: var(--br-base, 0.5rem);
}

.z-br-y-base {
    border-top-left-radius: var(--br-base, 0.5rem);
    border-top-right-radius: var(--br-base, 0.5rem);
}

.z-br-top-base {
    border-top-left-radius: var(--br-base, 0.5rem);
    border-top-right-radius: var(--br-base, 0.5rem);
}

.z-br-bottom-base {
    border-bottom-left-radius: var(--br-base, 0.5rem);
    border-bottom-right-radius: var(--br-base, 0.5rem);
}

.z-br-sm {
    border-radius: var(--br-sm, 1rem);
}

.z-br-x-sm {
    border-top-right-radius: var(--br-sm, 1rem);
    border-bottom-right-radius: var(--br-sm, 1rem);
}

.z-br-y-sm {
    border-top-left-radius: var(--br-sm, 1rem);
    border-top-right-radius: var(--br-sm, 1rem);
}

.z-br-top-sm {
    border-top-left-radius: var(--br-sm, 1rem);
    border-top-right-radius: var(--br-sm, 1rem);
}

.z-br-bottom-sm {
    border-bottom-left-radius: var(--br-sm, 1rem);
    border-bottom-right-radius: var(--br-sm, 1rem);
}

.z-br-md {
    border-radius: var(--br-md, 1.5rem);
}

.z-br-x-md {
    border-top-right-radius: var(--br-md, 1.5rem);
    border-bottom-right-radius: var(--br-md, 1.5rem);
}

.z-br-y-md {
    border-top-left-radius: var(--br-md, 1.5rem);
    border-top-right-radius: var(--br-md, 1.5rem);
}

.z-br-top-md {
    border-top-left-radius: var(--br-md, 1.5rem);
    border-top-right-radius: var(--br-md, 1.5rem);
}

.z-br-bottom-md {
    border-bottom-left-radius: var(--br-md, 1.5rem);
    border-bottom-right-radius: var(--br-md, 1.5rem);
}

.z-br-lg {
    border-radius: var(--br-lg, 2rem);
}

.z-br-x-lg {
    border-top-right-radius: var(--br-lg, 2rem);
    border-bottom-right-radius: var(--br-lg, 2rem);
}

.z-br-y-lg {
    border-top-left-radius: var(--br-lg, 2rem);
    border-top-right-radius: var(--br-lg, 2rem);
}

.z-br-top-lg {
    border-top-left-radius: var(--br-lg, 2rem);
    border-top-right-radius: var(--br-lg, 2rem);
}

.z-br-bottom-lg {
    border-bottom-left-radius: var(--br-lg, 2rem);
    border-bottom-right-radius: var(--br-lg, 2rem);
}

.z-br-circle {
    border-radius: var(--br-circle, 50%);
    aspect-ratio: 1/1;
    display: inline-block;
    overflow: hidden;
}

img {
    vertical-align: middle;
    height: auto;
    width: auto;
}

img.cover {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    -o-object-position: center;
    object-position: center;
}

img.contain {
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%;
    height: 100%;
    -o-object-position: center;
    object-position: center;
    display: block;
}

img.square {
    width: 100%;
    aspect-ratio: 1/1;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    display: block;
}

figure {
    display: inline-block;
    max-width: 100%;
    text-align: center;
    width: 100%;
    height: auto;
    margin: 0;
    position: relative;
}

figure img {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    max-width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

figcaption {
    margin-top: 0.3rem;
    text-align: left;
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 9;
}

a.z-btn,
button {
    padding: 0.6rem 1.2rem;
    border: none;
    border-radius: 0.2rem;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    margin: 0.2rem 0;
    background: var(--color-primary);
    color: var(--color-light);
    transition: background-color 0.3s ease, color 0.3s ease;
    outline: none;
    line-height: inherit;
}
a.z-btn:hover, a.z-btn:focus,
button:hover,
button:focus {
    background: var(--color-secondary);
    color: var(--color-light);
}

.takevent-notice {
    text-align: center;
}

.takevent-notice p {
    margin-bottom: .45rem;
}

.takevent-notice p:last-child {
    margin-bottom: 0;
}

.takevent-logo {
    display: block;
    width: 150px;
    max-width: 100%;
    height: auto;
    margin: 0 auto .75rem;
}

.z-btn {
    background: var(--color-secondary);
    color: var(--color-light);
}
.z-btn:hover, .z-btn:focus {
    background: var(--color-secondary);
    color: var(--color-light);
}

.z-btn-sm {
    padding: 0.4rem 0.8rem;
    font-size: 0.875rem;
}

.z-btn-lg {
    padding: 0.8rem 1.6rem;
    font-size: 1.125rem;
}

.z-btn-outline {
    background: transparent;
    border: 1px solid currentColor;
}
.z-btn-outline:hover, .z-btn-outline:focus {
    background: currentColor;
    color: var(--color-light);
}

.z-btn-ghost {
    background: transparent;
    border: none;
}
.z-btn-ghost:hover, .z-btn-ghost:focus {
    background: rgba(0, 0, 0, 0.1);
}