/* Utility classes for quickly applying the core palette */

/* Background colors */

.bg-white {
    background-color: var(--color-white);
}

.bg-surface {
    background-color: var(--color-surface);
}

.bg-brand-green {
    background-color: var(--color-brand-green);
}

.bg-brand-army {
    background-color: var(--color-brand-army);
}

.bg-brand-gray {
    background-color: var(--color-brand-gray);
}

.bg-brand-light-gray {
    background-color: var(--color-brand-light-gray);
}

.bg-brand-blue {
    background-color: var(--color-brand-blue);
}

.bg-brand-ice {
    background-color: var(--color-brand-ice);
}

.bg-brand-emerald {
    background-color: var(--color-brand-emerald);
}

.bg-brand-black {
    background-color: var(--color-brand-black);
}

.bg-pjh-green {
    background-color: var(--color-brand-pjh-green);
}

.bg-pjh-light-green {
    background-color: var(--color-brand-pjh-light-green);
}

.bg-pjh-mint {
    background-color: var(--color-brand-pjh-mint);
}

.bg-pjh-dark-green {
    background-color: var(--color-brand-pjh-dark-green);
}

/* Text colors */
.text-black {
    color: var(--color-text);
}

.text-gray {
    /* color: var(--color-text-gray); */
    color: var(--color-text);
}

.text-light-gray {
    color: var(--color-brand-light-gray);
}

.text-white {
    color: var(--color-white);
}

.text-brand-green {
    color: var(--color-brand-green);
}

.text-brand-army {
    color: var(--color-brand-army);
}

.text-brand-gray {
    color: var(--color-brand-gray);
}

.text-brand-blue {
    color: var(--color-brand-blue);
}

.text-brand-gradient {
    background: linear-gradient(120deg, var(--color-brand-blue), var(--color-brand-army));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.text-brand-emerald {
    color: var(--color-brand-emerald);
}

.text-brand-black {
    color: var(--color-brand-black);
}

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

.text-italic {
    font-style: italic;
}

/* Line-height helpers */
.lh-1 {
    line-height: 1 !important;
}

.lh-1-1 {
    line-height: 1.1 !important;
}

.lh-1-2 {
    line-height: 1.2 !important;
}

.lh-1-3 {
    line-height: 1.3 !important;
}

.lh-1-4 {
    line-height: 1.4 !important;
}

.lh-1-5 {
    line-height: 1.5 !important;
}

/* font weight */
.text-weight-thin {
    font-weight: 300 !important;
}

.text-weight-regular {
    font-weight: 400 !important;
}

.text-weight-medium {
    font-weight: 500 !important;
}

.text-weight-bold {
    font-weight: 700 !important;
}

.text-weight-black {
    font-weight: 900 !important;
}

.mega-title {
    /* KLCCH Mega Title 700 */
    font-family: var(--font-family-heading);
    font-size: 4rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h1,
.article-body h1 {


    /* KLCCH H1 700 */
    font-family: var(--font-family-heading);
    font-size: 3rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h2,
.article-body h2 {


    /* KLCCH H2 700 */
    font-family: var(--font-family-heading);
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h3,
.article-body h3 {


    /* KLCCH H3 700 */
    font-family: var(--font-family-heading);
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h4,
.article-body h4 {


    /* KLCCH H4 700 */
    font-family: var(--font-family-heading);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h5,
.article-body h5 {


    /* KLCCH H5 700 */
    font-family: var(--font-family-heading);
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    /* 120% */
}

.h6,
.article-body h6 {


    /* KLCCH H6 700 */
    font-family: var(--font-family-heading);
    font-size: 1.06rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
    /* 123.529% */
}

.thin {
    font-weight: 300 !important;
}

.p,
.article-body p,
.article-body li {


    /* KLCCH P Regular */
    font-family: Verdana;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.6;
    /* 160% */
}

.p a {
    text-decoration: underline;
    text-underline-offset: 0.3em;
}

.p.b {


    /* KLCCH P Bold */
    font-family: Verdana;
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.6;
    /* 160% */
}

.p.sm {


    /* KLCCH P Regular Small */
    font-family: Verdana;
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.6;
    /* 159.722% */
}

.p.b.sm {


    /* KLCCH P Bold Small */
    font-family: Verdana;
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.6;
    /* 159.722% */
}

.p.xsm {


    /* KLCCH P Regular X Small */
    font-family: Verdana;
    font-size: 0.8125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    /* 150% */
}

.menu-text {


    /* KLCCH Menu Text */
    font-family: var(--font-family-heading);
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1;
    /* 110% */
}

.btn-text {


    /* KLCCH Button Text */
    font-family: var(--font-family-heading);
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1;
    /* 110% */
}

.menu-subtext {


    /* KLCCH Menu Subtext */
    font-family: var(--font-family-heading);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1;
    /* 110% */
}

.map-label {


    /* KLCCH Map Label */
    font-family: var(--font-family-heading);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.running-num {


    /* KLCCH Running Number */
    font-family: var(--font-family-heading);
    font-size: 3rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    /* 120% */
}

.legacy-hero img {
    display: block;
    border-bottom-right-radius: var(--gap)
}

ol.ol-alpha-paren {
    list-style-type: lower-alpha;
}

ol.ol-alpha-upper-paren {
    list-style-type: upper-alpha;
}

ol.ol-roman-paren {
    list-style-type: lower-roman;
}

ol.ol-roman-upper-paren {
    list-style-type: upper-roman;
}

ol.ol-decimal {
    list-style-type: decimal;
}

ol.ol-alpha-paren>li::marker {
    content: counter(list-item, lower-alpha) ") ";
}

ol.ol-alpha-upper-paren>li::marker {
    content: counter(list-item, upper-alpha) ") ";
}

ol.ol-roman-paren>li::marker {
    content: counter(list-item, lower-roman) ") ";
}

ol.ol-roman-upper-paren>li::marker {
    content: counter(list-item, upper-roman) ") ";
}