/** BASE **/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 CSS Variables
2.0 Body
3.0 Styles from design
4.0 Layout
5.0 Core Gutenberg blocks

--------------------------------------------------------------*/
/* montserrat-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/montserrat-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-500 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/montserrat-v30-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/montserrat-v30-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/montserrat-v30-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/*- 1.0 CSS Variables */
:root {
    /* Defined by WP through theme.json */

    --wp--style--root--padding-top: 0px;
    --wp--style--root--padding-right: 64px;
    --wp--style--root--padding-bottom: 0px;
    --wp--style--root--padding-left: 64px;

    --wp--style--global--content-size: 1312px;
    --wp--style--global--wide-size: 1440px;
    /*
    Variables below are generated by WordPress based on theme.json

    --wp--preset--color--blue: #2023DE;
    --wp--preset--color--blue-alt: #4C4FE6;
    --wp--preset--color--dark-blue: #0F0836;
    --wp--preset--color--orange: #F86015;
    --wp--preset--color--red: #D80E0E;
    --wp--preset--color--grey-98: #F0F0F5;
    --wp--preset--color--grey-95: #F0F0F5;
    --wp--preset--color--grey-92: #E7E7EE;
    --wp--preset--color--grey-72: #ACABC4;
    --wp--preset--color--grey-50: #6B6996;
     */

    /* Utils */
    --scrollbar-width: 0px;
    --admin-bar-height: 0px;
    --viewport-height-diff: 0px;

    --custom-theme-z-index-nav: 2000;
    --custom-theme-z-index-overlay: 4000;

    --custom-theme-flex-span: 1;
    --custom-theme-flex-gap: 32px;

    /* Put custom css variables here */
    --custom-theme-site-header-height: 128px;
    --custom-theme-footer-margin-top: 128px;
}

.has-white-color { color: #FFF; }
.has-black-color { color: #000; }

.has-white-background-color { background-color: #FFF; }
.has-black-background-color { background-color: #000; }

.has-blue-color { color: var(--wp--preset--color--blue); }
.has-blue-background-color { background-color: var(--wp--preset--color--blue); }
.has-blue-alt-color { color: var(--wp--preset--color--blue-alt); }
.has-blue-alt-background-color { background-color: var(--wp--preset--color--blue-alt); }
.has-dark-blue-color { color: var(--wp--preset--color--dark-blue); }
.has-dark-blue-background-color { background-color: var(--wp--preset--color--dark-blue); }
.has-orange-color { color: var(--wp--preset--color--orange); }
.has-orange-background-color { background-color: var(--wp--preset--color--orange); }
.has-red-color { color: var(--wp--preset--color--red); }
.has-red-background-color { background-color: var(--wp--preset--color--red); }
.has-grey-98-color { color: var(--wp--preset--color--grey-98); }
.has-grey-98-background-color { background-color: var(--wp--preset--color--grey-98); }
.has-grey-95-color { color: var(--wp--preset--color--grey-95); }
.has-grey-95-background-color { background-color: var(--wp--preset--color--grey-95); }
.has-grey-92-color { color: var(--wp--preset--color--grey-92); }
.has-grey-92-background-color { background-color: var(--wp--preset--color--grey-92); }
.has-grey-72-color { color: var(--wp--preset--color--grey-72); }
.has-grey-72-background-color { background-color: var(--wp--preset--color--grey-72); }
.has-grey-50-color { color: var(--wp--preset--color--grey-50); }
.has-grey-50-background-color { background-color: var(--wp--preset--color--grey-50); }


.has-dark-blue-background-color {
    color: var(--wp--preset--color--grey-98);
}
.block-solution.has-dark-blue-background-color :not([class*="is-style"]) > .wp-block-button__link,
.has-blue-background-color :not([class*="is-style"]) > .wp-block-button__link,
.has-orange-background-color :not([class*="is-style"]) > .wp-block-button__link {
    --custom-theme-button-bg-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-bg-color-alt: var(--wp--preset--color--grey-92);
    --custom-theme-button-border-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-border-color-alt: var(--wp--preset--color--grey-92);
    --custom-theme-button-text-color: var(--wp--preset--color--dark-blue);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--dark-blue);
}
.has-dark-blue-background-color .is-style-secondary .wp-block-button__link,
.has-blue-background-color .is-style-secondary .wp-block-button__link,
.has-orange-background-color .is-style-secondary .wp-block-button__link {
    --custom-theme-button-bg-color: transparent;
    --custom-theme-button-bg-color-alt: var(--wp--preset--color--grey-98);
    --custom-theme-button-border-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-border-color-alt: var(--wp--preset--color--grey-98);
    --custom-theme-button-text-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--dark-blue);
}

@media screen and (max-width: 1279px) {
    :root {
        --custom-theme-site-header-height: 64px;

        --wp--style--root--padding-right: 32px;
        --wp--style--root--padding-left: 32px;
    }
}
@media screen and (max-width: 991px) {
    :root {
        --custom-theme-footer-margin-top: 64px;
    }
}

@media screen and (max-width: 767px) {
    :root {
        --wp--style--root--padding-right: 20px;
        --wp--style--root--padding-left: 20px;
    }
}

/*- 2.0 Body */
.editor-styles-wrapper,
body:not(.wp-admin) {
    font-family: Montserrat, sans-serif;
    color: var(--wp--preset--color--dark-blue);
    font-weight: 500;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background: var(--wp--preset--color--grey-98);
}

/*- 3.0 Styles from design */

/*- 4.0 Layout */
.layout-width {
    max-width: var(--wp--style--global--wide-size);
    margin: 0 auto;
}
.content-width {
    max-width: var(--wp--style--global--content-size);
    margin: 0 auto;
}
.has-block-layout > *:not(.alignfull),
.is-layout-constrained > *:not(.alignfull) {
    margin-right: auto;
    margin-left: auto;
    max-width: var(--wp--style--global--content-size);
}
.has-global-padding .alignfull {
    margin-left: calc(var(--wp--style--root--padding-left) * -1);
    margin-right: calc(var(--wp--style--root--padding-right) * -1);
}
.alignwide {
    max-width: var(--wp--style--global--wide-size);
}

.content-width .alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw + var(--scrollbar-width) / 2);
    margin-right: calc(50% - 50vw + var(--scrollbar-width) / 2);
    max-width: calc(100vw - var(--scrollbar-width));
    width: calc(100vw - var(--scrollbar-width));
}

.custom-theme-flex-grid,
.gform_fields,
.ginput_complex {
    display: flex;
    gap: var(--custom-theme-flex-gap);
}
.custom-theme-flex-grid > *,
.gform_fields > *,
.ginput_complex > * {
    flex: 0 0 calc((100% - 11 * var(--custom-theme-flex-gap)) / 12 * var(--custom-theme-flex-span) + var(--custom-theme-flex-gap) * (var(--custom-theme-flex-span) - 1));
}

.site-content::after {
    content: '';
    display: block;
    margin-top: var(--custom-theme-footer-margin-top);
}

/*- 5.0 Core Gutenberg blocks */

.custom-block-title {
    background: #CCC;
    color: #333;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    padding: 5px 20px;
    grid-row: -1;
    grid-column: span 12;
}
.custom-block-title--lvl2 {
    font-size: 80%;
    background: #DDD;
    grid-row: -1;
    grid-column: span 12;
}

p[data-type="core/paragraph"],
.block-paragraph {
    margin-top: 0;
    margin-bottom: 2em;
    line-height: 1.5;
    font-size: 1rem;
}

p[data-type="core/paragraph"] a,
.block-paragraph a,
[data-type="core/list"] a,
.block-list a {
    color: inherit;
    text-decoration: underline;
}

h1[data-type="core/heading"],
.block-h1 {
    font-size: 2.75rem;
    font-weight: 700;
    line-height: 1.1;
    margin-top: 0;
    margin-bottom: 0.72em;
}

h2[data-type="core/heading"],
.block-h2 {
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 1.33em;
    margin-bottom: 0.88em;
}
h2[data-type="core/heading"] strong,
.block-h2 strong {
    color: var(--wp--preset--color--blue);
    font-weight: inherit;
}

.page-type--retention h2[data-type="core/heading"] strong,
.page-type--retention .block-h2 strong {
    color: var(--wp--preset--color--red);
}

h3[data-type="core/heading"],
.block-h3 {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.3;
    margin-top: 1.14em;
    margin-bottom: 1.14em;
}

h4[data-type="core/heading"],
.block-h4 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    margin-top: 1.14em;
    margin-bottom: 1.14em;
}

[data-type="core/list"],
.wp-block-list {
    margin-top: 0;
    margin-bottom: 2em;
    line-height: 1.5;
    font-size: 1rem;
    padding-left: 1.5em;
}
[data-type="core/list"] li,
.wp-block-list li {
    margin-bottom: 16px;
}
ul[data-type="core/list"] li,
ul.wp-block-list li {
    list-style-type: none;
    position: relative;
}
ul[data-type="core/list"] li::before,
ul.wp-block-list li::before {
    content: '•';
    position: absolute;
    left: -0.75em;
    top: 0;
}

.wp-block-image {
    margin: 48px 0;
}
.page-body__content > .wp-block-image {
    margin-top: 128px;
    margin-bottom: 128px;
}
.wp-block-image img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}
.wp-block-image figcaption {
    margin-top: 16px;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.3;
}
.wp-block-image.aligncenter img {
    margin-left: auto;
    margin-right: auto;
}


.wp-block-buttons {
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 32px;
    margin-bottom: 32px;
}

.wp-block-button__link {
    --custom-theme-button-bg-color: var(--wp--preset--color--blue);
    --custom-theme-button-bg-color-alt: var(--wp--preset--color--blue-alt);
    --custom-theme-button-border-color: var(--wp--preset--color--blue);
    --custom-theme-button-border-color-alt: var(--wp--preset--color--blue-alt);
    --custom-theme-button-text-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--grey-98);
    position: relative;
    display: block;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    line-height: 1.6 !important;
    text-align: center !important;
    text-transform: uppercase;
    color: var(--custom-theme-button-text-color) !important;
    background-color: var(--custom-theme-button-bg-color) !important;
    border-radius: 4px !important;
    border: 1px solid var(--custom-theme-button-border-color) !important;
    padding: 0.8em 1.25em !important;
    text-decoration: none;
    cursor: pointer;
    transition: 0.2s ease-out;
}
.page-type--retention .wp-block-button__link {
    --custom-theme-button-bg-color: var(--wp--preset--color--red);
    --custom-theme-button-bg-color-alt: #C00C0C;
    --custom-theme-button-border-color: var(--wp--preset--color--red);
    --custom-theme-button-border-color-alt: #C00C0C;
    --custom-theme-button-text-color: var(--wp--preset--color--grey-98);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--grey-98);
}
/*  */

.wp-block-button__link:focus-visible,
.wp-block-button__link:hover {
    background-color: var(--custom-theme-button-bg-color-alt) !important;
    border-color: var(--custom-theme-button-border-color-alt)!important;
    color: var(--custom-theme-button-text-color-alt)!important;
}

.is-style-secondary .wp-block-button__link {
    --custom-theme-button-bg-color: transparent;
    --custom-theme-button-bg-color-alt: var(--wp--preset--color--dark-blue);
    --custom-theme-button-border-color: var(--wp--preset--color--dark-blue);
    --custom-theme-button-border-color-alt: var(--wp--preset--color--dark-blue);
    --custom-theme-button-text-color: var(--wp--preset--color--dark-blue);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--grey-98);
}

.is-style-download .wp-block-button__link {
    font-size: 0.875rem!important;
    line-height: 1.4!important;
    font-weight: 500!important;
    padding: 0.645em 1.14em!important;
    text-transform: none!important;
    border-radius: 1.375em!important;
    --custom-theme-button-bg-color: transparent;
    --custom-theme-button-bg-color-alt: var(--wp--preset--color--grey-92);
    --custom-theme-button-border-color: var(--wp--preset--color--grey-92);
    --custom-theme-button-border-color-alt: var(--wp--preset--color--grey-92);
    --custom-theme-button-text-color: var(--wp--preset--color--dark-blue);
    --custom-theme-button-text-color-alt: var(--wp--preset--color--blue);
}

.wp-block-button__link:has(.icon) {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.wp-block-button__link .icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
    order: -1;
}
.wp-block-button__link--icon-only {
    padding-left: 12px!important;
    padding-right: 12px!important;
}
.wp-block-button__link--orange,
.page-type--retention .wp-block-button__link--orange {
    --custom-theme-button-bg-color: var(--wp--preset--color--orange);
    --custom-theme-button-bg-color-alt: #F8702D;
    --custom-theme-button-border-color: var(--wp--preset--color--orange);
    --custom-theme-button-border-color-alt: #F8702D;
}
.wp-block-quote {
    margin: 32px 0;
}
.wp-block-quote p {
    font-size: 1.5rem;
    line-height: 1.4;
    font-weight: 500;
    font-style: italic;
    margin-bottom: 0;
}
.wp-block-quote p:before {
    content: '"';
}
.wp-block-quote p:after {
    content: '"';
}

.wp-block-embed {
    margin-top: 48px;
    margin-bottom: 48px;
}
.page-body__content > .wp-block-embed {
    margin-top: 128px;
    margin-bottom: 128px;
}

.wp-block-embed iframe {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    border-radius: 4px;
}
.wp-block-embed figcaption {
    margin-top: 16px;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.3;
}

.wp-block-columns {
    --wp--style--block-gap: 10px;
}

.is-style-surtitle {
    font-size: 0.875rem;
    line-height: 1.2;
    color: var(--wp--preset--color--grey-50);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 1em;
}
.is-style-surtitle + * {
    margin-top: 0;
}

.is-style-tagline {
    font-size: 0.875rem;
    line-height: 1.2;
    font-weight: 600;
}

.is-style-checked {
    padding-left: 0;
}
.is-style-checked li {
    display: flex;
    gap: 1em;
    line-height: 1.5;
    font-weight: 600;
    margin-bottom: 0.75em;
}
.is-style-checked li::before {
    display: none;
}
.is-style-checked li .icon {
    width: 1.5em;
    height: 1.5em;
    color: var(--wp--preset--color--orange);
}

.custom-theme-inline-image {
    display: flex;
    align-items: center;
    gap: 16px;
}

.page-type--retention .has-inline-color.has-blue-color,
.page-type--retention .has-text-color.has-blue-color {
    color: var(--wp--preset--color--red);
}

@media screen and (max-width: 1279px) {
    .block-h1 br {
        display: none;
    }
}

@media screen and (max-width: 991px) {
    .block-h1 {
        font-size: clamp(1.875rem, 8vw, 2.5rem);
        line-height: 1.2;
    }
    .block-h2 {
        font-size: clamp(1.5rem, 6.4vw, 2.25rem);
        margin-top: 64px;
    }

    .page-body__content > .wp-block-image,
    .page-body__content > .wp-block-embed {
        margin-top: 64px;
        margin-bottom: 64px;
    }

    .custom-theme-inline-image {
        flex-direction: column;
        align-items: center;
    }
}
@media screen and (max-width: 767px) {
    .block-h2 {
        margin-top: 56px;
    }
    .block-h2 br {
        display: none;
    }
    .block-h3 {
        font-size: 1.375rem;
        line-height: 1.3;
    }
    .block-h4 {
        font-size: 1.125rem;
        line-height: 1.3;
    }
    .is-style-surtitle + .block-h2 {
        margin-top: 16px;
    }
    .wp-block-button {
        width: 100%;
        max-width: 440px;
    }

    .is-style-download .wp-block-button__link {
        width: fit-content;
        justify-content: flex-start;
        text-align: left !important;
    }


    .page-body__content > .wp-block-image,
    .page-body__content > .wp-block-embed {
        margin-top: 56px;
        margin-bottom: 56px;
    }

    .wp-block-quote p {
        font-size: 1.25rem;
        line-height: 1.5;
    }
}

@media screen and (max-width: 374px) {
    .wp-block-button__link {
        font-size: 13px !important;
    }
}
