
:root {

    /* Colors */
    --color-green:          #A9C9BF;
    --color-dark-green:     #024544;
    --color-light-green:    #78D4A5;
    --color-white:          #FFFFFF;
    --color-grey:           #505F74;
    --color-light-grey:     #FBFAF9;
    --color-background-green: #EAF0EE;

    /* Optilume Theme Colors */
    --body: #505F74;
    --white: #FFFFFF;
    --bg-grey: #FBFAF9;
    --pine: #025A59;
    --mint: #78D4A5;
    --sherpa: #024544;
    --patina: #629691;
    --sage: #A9C9BF;
    --urology-blue: #A8DCF0;
    --orange: #F26F24;
    --deep-blue: #053947;
    --light-blue: #D7E1F3;
    --light-grey: #D9D9D9;
    
    /* Typography */
    --font-heading:         'Bitter', serif;
    --font-body:            'Roboto', sans-serif;
    --font-size-base:       18px;
    --font-size-small:      16px;
    --font-size-xsmall:     14px;
    --font-size-heading-1:  52px;
    --font-size-heading-1-min:  40px;
    --font-size-heading-1-max:  52px;
    --font-size-heading-2:  38px;
    --font-size-heading-3:  38px;
    --font-size-heading-4:  30px;
    --font-size-heading-5:  24px;

    /* Spacing */
    --block-spacing: 52px;

    @media (min-width: 767px) {
        --block-spacing: 64px;
        --font-size-heading-1:  64px;
        --font-size-heading-1-min:  52px;
        --font-size-heading-1-max:  64px;
        --font-size-heading-2:  42px;
    }

}


.heading-1 { 
    font-size: clamp(var(--font-size-heading-1-min), 6vw, var(--font-size-heading-1-max));
    line-height: 1;
}


.heading-2 { font-size: var(--font-size-heading-2); line-height: 1.2;}
.heading-3 { font-size: var(--font-size-heading-3); line-height: 1.2;}
.heading-4 { font-size: var(--font-size-heading-4); line-height: 1.2;}
.heading-5 { font-size: var(--font-size-heading-5); line-height: 1.4;}

.bg-green      { background-color: var(--color-green); }
.bg-dark-green { background-color: var(--color-dark-green); }
.bg-light-grey { background-color: var(--color-light-grey); }
.bg-white      { background-color: var(--color-white); }
.bg-grey       { background-color: var(--color-grey); }
.bg-light-green       { background-color: rgba(169, 201, 191, 0.3);}
.bg-background-green { background-color: var(--color-background-green, #EAF0EE)}

.color-grey { color: var(--color-grey); }
.color-white { color: var(--color-white); }
.color-dark-green { color: var(--color-dark-green); }
.color-pine { color: var(--pine, #025A59); }
.color-body { color: var(--body, #505F74); }


.color-white a,
.color-white a:hover,
.color-dark-green a,
.color-dark-green a:hover,
.color-grey a,
.color-grey a:hover {
    color: inherit;
}

.weight-300 { font-weight: 300; }
.weight-400 { font-weight: 400; }
.weight-500 { font-weight: 500; }
.weight-700 { font-weight: 700; }

.block-section {
    padding-top: var(--block-spacing);
    padding-bottom: var(--block-spacing);
}

.wrapper {
    width: 1200px;
    margin: 0 auto;
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
}

.wrapper--md {
    width: 800px;
}


.user-content h1 {
    font-size: var(--font-size-heading-1);
    line-height: 1;
}

.user-content h2 {
    font-size: var(--font-size-heading-2);
    line-height: 1.33;
    font-weight: 300;
    letter-spacing: 0.025em;
}

.user-content h3 {
    font-size: var(--font-size-heading-3);
    line-height: 1.2;
    font-weight: 300;
    letter-spacing: 0.01973684211em;
}

.user-content h4 {
    font-size: var(--font-size-heading-4);
    line-height: 1.33;
    font-weight: 300;
    letter-spacing: 0.025em;
    text-transform: none;
}

.tick-lists ul {
    list-style: none;
    padding: 0;;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tick-lists ul {
    margin-bottom: 20px;
}

.tick-lists ul:last-child {
    margin-bottom: 0;
}

.tick-lists ul li,
.wp-block-list.is-style-checklist li {
    position: relative;
    padding: 0 0 0 34px;
    margin: 0;
    line-height: 1.875;
    letter-spacing: 0.03125em;
}

.tick-lists ul li:before,
.wp-block-list.is-style-checklist li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 22px;
    height: 22px;
    background-color: transparent;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDIyIDIyIiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTExLjAwMDEgMEM0LjkzNDYgMCAwIDQuOTM0NTMgMCAxMC45OTk5QzAgMTcuMDY1MyA0LjkzNDYgMjEuOTk5OSAxMS4wMDAxIDIxLjk5OTlDMTcuMDY1NSAyMS45OTk5IDIyIDE3LjA2NTMgMjIgMTAuOTk5OUMyMiA0LjkzNDUzIDE3LjA2NTUgMCAxMS4wMDAxIDBaTTExLjAwMDEgMjAuMTk2NkM1LjkyODkyIDIwLjE5NjYgMS44MDMyNyAxNi4wNzExIDEuODAzMjcgMTAuOTk5OUMxLjgwMzI3IDUuOTI4ODUgNS45Mjg5MiAxLjgwMzI3IDExLjAwMDEgMS44MDMyN0MxNi4wNzExIDEuODAzMjcgMjAuMTk2NyA1LjkyODg1IDIwLjE5NjcgMTAuOTk5OUMyMC4xOTY3IDE2LjA3MTEgMTYuMDcxMSAyMC4xOTY2IDExLjAwMDEgMjAuMTk2NloiIGZpbGw9IiM3OEQ0QTUiLz4KPHBhdGggZD0iTTE1Ljc1ODUgNi43Nzc3Mkw5LjIyNzM5IDEzLjMwODlMNi4yNDEzMyAxMC4zMjI5QzUuODg5MTggOS45NzA4IDUuMzE4MzQgOS45NzA4IDQuOTY2MiAxMC4zMjI5QzQuNjE0MTMgMTAuNjc1IDQuNjE0MTMgMTEuMjQ1OCA0Ljk2NjIgMTEuNTk4TDguNTg5ODMgMTUuMjIxNkM4Ljc2NTkgMTUuMzk3NiA4Ljk5NjY1IDE1LjQ4NTcgOS4yMjczOSAxNS40ODU3QzkuNDU4MTQgMTUuNDg1NyA5LjY4ODg5IDE1LjM5NzYgOS44NjQ5NiAxNS4yMjE2TDE3LjAzMzcgOC4wNTI5MUMxNy4zODU3IDcuNzAwNzcgMTcuMzg1NyA3LjEyOTkzIDE3LjAzMzcgNi43Nzc3OUMxNi42ODE1IDYuNDI1NjUgMTYuMTEwNiA2LjQyNTY1IDE1Ljc1ODUgNi43Nzc3MloiIGZpbGw9IiM3OEQ0QTUiLz4KPC9zdmc+");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.wp-block-list.is-style-checklist {
    padding-left: 0;
}

/* 
====================================================================
= BUTTONS
====================================================================
*/

.btn--optilume,
.btn-primary,
.wp-block-button.is-style-optilume .wp-element-button {
    text-transform: none;
    background-color: var(--mint);
    color: var(--sherpa) !important;
    padding: 16px 32px;
    font-weight: 600;
    letter-spacing: 0.025em;
    line-height: 1.4;
}

.btn--optilume:hover,
.btn-primary:hover,
.wp-block-button.is-style-optilume .wp-element-button:hover {
    background-color: var(--patina);
    color: var(--white) !important;
}


.btn-tertiary::before {
    filter: brightness(0) invert(1);
}

.wp-block-button.is-style-text .wp-block-button__link {
    display: inline-flex;
    padding: 1rem 0;
    background: transparent;
    color: var(--pine, #025A59);
    text-decoration: underline;
    gap: 0.375rem;
    border-radius: 0;
    border: none;
    align-items: center;
    font-weight: 600;
}

.wp-block-button.is-style-text .wp-block-button__link:hover {
    text-decoration-thickness: 2px;
}

.wp-block-button.is-style-text .wp-block-button__link:hover:after {
    transform: translateX(4px);
}

.wp-block-button__link {
    border: none;
}

.wp-block-button__link:after {
    display: none;
}

.wp-block-button.is-style-text .wp-block-button__link:after {
    content: "";
    width: 1.2em;
    height: 1.2em;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj48cGF0aCBkPSJNOSAxOEwxNSAxMkw5IDYiIHN0cm9rZT0iIzAyNUE1OSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: static;
    display: block;
    transform: none;
    background-color: transparent;
}


.icon-list-block p {
    padding: 0;
}

.icon-list-block + .icon-list-block {
    margin-top: 0.5rem;
}

.wp-block-image.is-style-rounded-corners img {
    border-radius: 0.75rem;
}


.u-m0 { margin: 0 !important; }
.u-p0 { padding: 0 !important; }

.u-weight-300 { font-weight: 300 !important; }
.u-weight-400 { font-weight: 400 !important; }
.u-weight-500 { font-weight: 500 !important; }
.u-weight-700 { font-weight: 700 !important; }
.u-weight-800 { font-weight: 800 !important; }