:root {
    --color-white: #fff;
    --color-black: #0a0a0a;
    --color-darkblue: #0078a9;
    --color-darkblue-95: rgb(0 121 168 / 95%);
    --color-darkblue-deep: #005a80;
    --color-darkblue-ring: rgb(0 120 169 / 25%);
    --color-blue: #53bcf8;
    --color-blue-heading: #0880c4;
    --color-blue-strong: #0773b0;
    --color-red: #f85353;
    --color-red-text: #c81e1e;
    --color-teal: #00ccc5;
    --color-orange: #ff9758;
    --color-orange-strong: #c24800;
    --color-orange-text: #bb4700;
    --color-green: #5db071;
    --color-green-dark: #35b26a;
    --color-green-strong: #408350;
    --color-green-text: #257b49;
    --color-newsletter: #006ba6;
    --color-grey: #808080;
    --color-grey-text: #666;
    --color-grey-50: #f8f8f8;
    --color-grey-100: #f0f0f0;
    --color-grey-200: #eee;
    --color-grey-300: #ddd;
    --color-grey-400: #b8b8b8;
    --color-grey-500: #888;
    --color-grey-700: #5c5b5b;
    --color-grey-800: #333;
    --color-white-20: rgb(255 255 255 / 20%);
    --color-white-60: rgb(255 255 255 / 60%);
    --color-white-90: rgb(255 255 255 / 90%);
    --color-overlay-40: rgb(0 0 0 / 40%);
    --color-overlay-50: rgb(0 0 0 / 50%);
    --color-overlay-70: rgb(0 0 0 / 70%);
    --color-focus-ring: rgb(0 0 0 / 12%);
    --color-line: #e2e8ec;
    --color-line-strong: #b9c5cc;
    --color-surface-alt: #f4f8fa;
    --color-darkblue-tint: rgb(0 120 169 / 7%);
    --color-success-bg: #e7f4ec;

    --font-body: 'Roboto', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    --font-heading: 'Russo One', 'Roboto', system-ui, sans-serif;

    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --radius-pill: 999px;
    --radius-control: 6px;

    --control-height: 46px;

    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.2rem;
    --text-xl: 1.5rem;

    --header-height: 80px;
    --header-height-compact: 64px;

    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 48px;
    --space-6: 64px;

    --shadow-card: 0 100px 80px rgb(0 0 0 / 2%),
                   0 64.8px 46.9px rgb(0 0 0 / 1.5%),
                   0 38.5px 25.5px rgb(0 0 0 / 1.2%),
                   0 20px 13px rgb(0 0 0 / 1%),
                   0 8.1px 6.5px rgb(0 0 0 / 0.8%),
                   0 1.9px 3.1px rgb(0 0 0 / 0.5%);
    --shadow-listitem: rgb(50 50 93 / 15%) 0 10px 28px -12px,
                       rgb(0 0 0 / 20%) 0 10px 20px -19px;
    --shadow-header: 0 20px 35px rgb(93 176 113 / 20%);
    --shadow-overlay: 0 20px 35px rgb(0 0 0 / 20%);
    --shadow-nav: 0 1px 0 var(--color-line), 0 4px 12px rgb(16 40 60 / 6%);
    --shadow-dropdown: 0 8px 20px rgb(16 40 60 / 12%), 0 1px 3px rgb(16 40 60 / 8%);
    --shadow-panel: 0 1px 2px rgb(16 40 60 / 6%);
}

@font-face {
    font-family: 'Russo One';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/russo-one-latin-400-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Russo One';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/russo-one-latin-ext-400-normal.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Russo One';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/russo-one-cyrillic-400-normal.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(../fonts/roboto-latin-300-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(../fonts/roboto-latin-ext-300-normal.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(../fonts/roboto-cyrillic-300-normal.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-latin-400-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-latin-ext-400-normal.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-cyrillic-400-normal.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/roboto-latin-500-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/roboto-latin-ext-500-normal.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/roboto-cyrillic-500-normal.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/roboto-latin-700-normal.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/roboto-latin-ext-700-normal.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/roboto-cyrillic-700-normal.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-latin-400-italic.woff2) format('woff2');
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-latin-ext-400-italic.woff2) format('woff2');
    unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/roboto-cyrillic-400-italic.woff2) format('woff2');
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

html,
body {
    height: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-height);
}

html {
    font-size: 17px;
    overflow-y: scroll;
}

body {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 1em;
    line-height: 1.5;
    color: var(--color-black);
    background: var(--color-grey-100) url(../img/bg.svg) repeat-y center / cover;
    overflow-wrap: break-word;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body.featuredimg-single-none img.wp-post-image {
    display: none;
}

h1,
h2,
h3 {
    font-family: var(--font-heading);
    font-weight: 400;
    margin: 0;
    padding: 0;
    text-align: left;
    hyphens: auto;
}

h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-weight: 700;
    text-align: left;
    hyphens: auto;
}

h5,
h6 {
    font-size: 1rem;
}

:is(h1, h2, h3, h4, h5, h6) strong {
    font-weight: normal;
}

strong,
.strong,
.bold {
    font-weight: 700;
}

a {
    color: var(--color-darkblue);
    text-decoration: none;
    transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
    color: var(--color-blue-strong);
    text-decoration: none;
}

:focus-visible {
    outline: 2px solid var(--color-darkblue);
    outline-offset: 2px;
}

hr {
    display: block;
    height: 1px;
    margin: 1em 0;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--color-black);
}

iframe {
    max-width: 100%;
    margin-bottom: 10px;
    aspect-ratio: 16 / 9;
}

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

figure {
    max-width: 100%;
    height: auto;
    margin: 1em 0;
}

table td,
table th {
    vertical-align: top;
    padding: 5px;
}

blockquote {
    position: relative;
    width: 100%;
    margin: 20px auto;
    padding: 1.2em 30px 1.2em 75px;
    font-style: italic;
    line-height: 1.6;
    background: var(--color-white-60);
    border-left: 2px solid var(--color-black);
}

blockquote::before {
    content: "\201C";
    position: absolute;
    left: 10px;
    top: -10px;
    font-family: Arial, sans-serif;
    font-size: 4em;
}

blockquote span {
    display: block;
    margin-top: 1em;
    font-style: normal;
    font-weight: 700;
    color: var(--color-black);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: var(--color-black);
}

input[type="text"],
input[type="tel"],
input[type="search"],
input[type="email"],
input.wpcf7-file {
    padding: 10px 18px;
    font-family: var(--font-body);
    border: none;
    border-bottom: 1px solid var(--color-black);
}

textarea {
    width: 100%;
    height: 200px;
    padding: 10px 20px;
    font-family: var(--font-body);
    font-size: 1rem;
    border: none;
    border-bottom: 1px solid var(--color-black);
}

select {
    padding: 10px 0;
    font-family: var(--font-body);
    font-size: 1rem;
    background: transparent;
    border: 1px solid var(--color-black);
}

label {
    min-width: 200px;
    padding-top: 3px;
    vertical-align: top;
    font-weight: 700;
}

.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
    color: var(--color-grey-700);
    font-style: italic;
}

.btn,
button,
.button,
input[type="submit"],
input[type="button"],
input.search-submit,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    display: inline-block;
    padding: 10px 24px;
    font-family: var(--font-body);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    color: var(--color-white);
    background: var(--color-darkblue);
    border: 1px solid transparent;
    border-radius: var(--radius-control);
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, transform 0.15s ease;
}

.btn:hover,
.btn:focus-visible,
button:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input.search-submit:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    color: var(--color-white);
    text-decoration: none;
    background: var(--color-black);
}

.btn:hover,
.btn:focus-visible,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input.search-submit:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    box-shadow: 0 0 0 4px var(--color-darkblue-ring);
}

.btn:active,
.button:active,
input[type="submit"]:active {
    transform: translateY(1px);
}

.btn-grey,
.btn.btn-grey {
    color: var(--color-black);
    background: var(--color-grey-200);
}

.btn-grey:hover,
.btn.btn-grey:hover,
.btn.btn-grey:focus-visible {
    color: var(--color-white);
    background: var(--color-black);
}

button.submit,
input.wpcf7-submit,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    padding: 14px 40px;
    color: var(--color-white);
    background: var(--color-darkblue);
}

button.submit:hover,
input.wpcf7-submit:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
    color: var(--color-white);
    background: var(--color-black);
    box-shadow: 0 0 0 4px var(--color-darkblue-ring);
}

.readmore-arrow {
    display: inline-flex;
    align-items: center;
    padding: 4px 0;
    color: var(--color-darkblue);
    transition: color 0.25s ease;
}

.readmore-arrow .icon {
    width: 48px;
    height: 24px;
    transition: transform 0.25s ease;
}

.readmore-arrow:hover,
a:hover > .readmore .readmore-arrow,
a:hover .readmore-arrow {
    color: var(--color-black);
}

.readmore-arrow:hover .icon,
a:hover .readmore-arrow .icon {
    transform: translateX(6px);
}

.icon-char {
    display: inline-block;
    margin: 0 0.2em;
    font-style: normal;
    font-family: inherit;
    line-height: 1;
    vertical-align: baseline;
}

.icon {
    display: inline-block;
    flex-shrink: 0;
    vertical-align: -0.125em;
}

.skip-link:focus {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 1000;
    padding: 10px 20px;
    color: var(--color-black);
    background: var(--color-white);
    box-shadow: var(--shadow-overlay);
}

.bg-white { background: var(--color-white) !important; }
.bg-darkblue { background: var(--color-darkblue); }
.bg-blue { background: var(--color-blue-strong); }
.bg-red { background: var(--color-red); }
.bg-teal { background: var(--color-teal); }
.bg-orange { background: var(--color-orange-strong); }
.bg-green { background: var(--color-green-strong); }

.txt-white { color: var(--color-white) !important; }
.txt-black { color: var(--color-black) !important; }
.txt-darkblue { color: var(--color-darkblue); }
.txt-blue { color: var(--color-blue-strong); }
.txt-red { color: var(--color-red-text); }
.txt-teal { color: var(--color-teal); }
.txt-orange { color: var(--color-orange-text); }
.txt-green { color: var(--color-green-text); }

.txt-darkblue-hover a:hover { color: var(--color-darkblue) !important; border-color: var(--color-darkblue) !important; }
.txt-red-hover a:hover { color: var(--color-red) !important; border-color: var(--color-red) !important; }
.txt-teal-hover a:hover { color: var(--color-teal) !important; border-color: var(--color-teal) !important; }
.txt-orange-hover a:hover { color: var(--color-orange) !important; border-color: var(--color-orange) !important; }
.txt-green-hover a:hover { color: var(--color-green) !important; border-color: var(--color-green) !important; }

.txt-darkblue-hover a::after { background: var(--color-darkblue) !important; }
.txt-red-hover a::after { background: var(--color-red) !important; }
.txt-teal-hover a::after { background: var(--color-teal) !important; }
.txt-orange-hover a::after { background: var(--color-orange) !important; }
.txt-green-hover a::after { background: var(--color-green) !important; }

.blue .border_color { border-color: var(--color-blue); }
.red .border_color { border-color: var(--color-red); }
.teal .border_color { border-color: var(--color-teal); }
.orange .border_color { border-color: var(--color-orange); }
.green .border_color { border-color: var(--color-green); }

.text-xs,
.txt-xs {
    font-size: 0.85rem;
    line-height: 1.2rem;
}

.small { font-size: 85%; }
.big { font-size: 125%; }
.uppercase { text-transform: uppercase; }
.semibold { font-weight: 500; }
.light { font-weight: 300; }

.inline-block { display: inline-block; }
.inline { display: inline; }
.table { display: table; }
.nodisplay { display: none !important; }
.opacity1 { opacity: 1; transition: opacity 0.5s; }
.opacity0 { opacity: 0; }

.row.nomargin {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.paddingleft0 { padding-left: 0 !important; }
.paddingright0 { padding-right: 0 !important; }

.clearfix,
.clr {
    clear: both;
}

.clearfix::before,
.clearfix::after,
.clr::before,
.clr::after {
    content: "";
    display: table;
    line-height: 0;
}

.clearfix::after,
.clr::after {
    clear: both;
}

.divider {
    width: 100%;
    height: 2px;
    background: var(--color-blue);
}

.divider40 {
    width: 100%;
    height: 40px;
    background: transparent;
}

@media (max-width: 767px) {
    input[type="text"],
    input[type="tel"],
    input[type="search"],
    input[type="email"],
    textarea,
    select,
    label {
        width: 100% !important;
    }
}

@media (min-width: 992px) {
    .txt-lg {
        font-size: 1.2rem;
        line-height: 1.4rem;
    }
}

@media (max-width: 1199px) {
    [class*='col-'] {
        margin-bottom: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html,
    body {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}