/*!
Theme Name: Borema
Author: Gut Werbung
Author URI: https://gut-werbung.ch/
Description: Custom Responsive Theme.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: borema
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/*
Borema theme stylesheets:
1 - Normalize
    1.1 - Main tags
    1.2 - Form elements
    1.3 - Default WP templates
    1.4 - Accessibility
2 - Main
3 - Header & Footer
    3.1 - Header
    3.2 - Navigation
    3.3 - Footer
4 - Pages
    4.1 - hero banner
    4.2 - top banner
    4.3 - teaser boxes
    4.4 - blog
    4.5 - accordion
    4.6 - content gradient
    4.7 - team
*/

@font-face {
    font-family: 'Outfit-Regular';
    src: url('fonts/Outfit-Regular.woff2') format('woff2'),
         url('fonts/Outfit-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit-Medium';
    src: url('fonts/Outfit-Medium.woff2') format('woff2'),
         url('fonts/Outfit-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit-SemiBold';
    src: url('fonts/Outfit-SemiBold.woff2') format('woff2'),
         url('fonts/Outfit-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit-Bold';
    src: url('fonts/Outfit-Bold.woff2') format('woff2'),
         url('fonts/Outfit-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/******** 1 - Normalize ********/
:root {
    --color-primary: #015f98;   /* blue */
    --color-secondary: #4c7c9a; /* light grey */
    --color-accent: #016298;    /* blue #2 */
    --color-basic: #0a2c33;     /* dark */
    --color-bg-light: #edf7fa;  /* light blue */
    --size-sm: .813rem;         /* 13px */
    --size-md: 1.063rem;        /* 17px */
    --size-lg: 1.438rem;        /* 23px */
}

/*== 1.1 - Main tags ==*/
* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
html,
body {
    margin: 0;
    padding: 0;
}
body {
    font: var(--size-lg)/1.2 'Outfit-Regular';
    color: var(--color-basic);
    -webkit-font-smoothing: antialiased; /* Fix iOS default font-weight */
}
body *,
body *:focus {
    outline: none;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    margin: 0 0 1.5rem;
    line-height: 1.2;
    font-weight: normal;
    font-family: 'Outfit-SemiBold';
}
h1, .h1 {
    margin: 0 0 2.25rem;
    font-size: 3.313rem;
    font-family: 'Outfit-Regular';
}
.home h1 {
    line-height: 1;
    font-size: 4.438rem;
}
h2, .h2 {
    font-size: 2.5rem;
    font-family: 'Outfit-Regular';
}
.home h2 {
    line-height: 1;
    font-size: 3.313rem;
}
h3, .h3 {
    font-size: var(--size-lg);
}
h4, .h4 {
    font-size: var(--size-md);
}
h5, .h5 {
    font-size: 1rem;
}
h6, .h6 {

}
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
.h1:last-child,
.h2:last-child,
.h3:last-child,
.h4:last-child,
.h5:last-child,
.h6:last-child,
p:last-child,
figure,
blockquote:last-child,
table:last-child,
.site-main ul:not([class]):last-child,
.site-main ol:not([class]):last-child,
ul.wp-block-list:last-child,
.wp-block-image,
.content-item:last-child,
.box-toggle:last-child {
    margin: 0;
}
blockquote {
    margin: 3rem 0;
    font-style: italic;
    font-size: var(--size-lg);
    color: var(--color-primary);
}
ul,
ol,
li > ul,
li > ol {
    margin: 0;
    padding: 0;
}
ul[class],
ol[class] {
    list-style-type: none;
}
.site-main ul:not([class]),
.site-main ol:not([class]),
ul.wp-block-list,
ul.csc-uploads {
    list-style-type: "- ";
    margin: 0 0 2rem;
    padding: 0 0 0 1rem;
}
p {
    margin: 0 0 2rem;
}
a {
    color: inherit;
}
a:hover,
a:focus,
a:active {
    text-decoration: none;
    outline: none;
}
a[href^="mailto:"] {
    word-break: break-all;
}
a,
button,
input,
textarea {
    display: inline-block;
    transition: all .3s ease;
}
button {
    cursor: pointer;
}
img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border: 0;
}
img::selection {
    background: transparent !important;
}
b,
strong {
    font-weight: normal;
    font-family: 'Outfit-Bold';
}
sup,
sub,
small {
    font-size: .75em;
}
sup {
    vertical-align: top;
}
sub {
    vertical-align: bottom;
}
hr {
    margin: 1em 0;
    border: 0;
    border-top: 1px solid var(--color-basic);
}
table {
    table-layout: fixed;
    width: 100%;
    margin: 0 0 2rem;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1rem;
}
th {
    font-family: 'Outfit-Bold';
}
th,
td {
    border-bottom: 1px solid #eee;
    padding: 10px 10px 10px 0;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
th[style^="width: 23."],
td[style^="width: 23."] {
    width: 130px !important;
}
code,
pre {
    font-family: inherit;
}
iframe,
embed,
object {
    width: 100%;
    border: 0;
}
audio {
    display: block;
}
video {
    display: block;
    width: 100%;
    height: 100%;
    max-height: inherit;
    object-fit: cover;
}
.wp-video {
    width: 100% !important;
}

/*== 1.2 - Form elements ==*/
::-webkit-input-placeholder {
    color: var(--color-basic);
}
::-moz-placeholder {
    color: var(--color-basic);
    opacity: 1;
}
:-moz-placeholder {
    color: var(--color-basic);
    opacity: 1;
}
:-ms-input-placeholder {
    color: var(--color-basic);
    opacity: 1;
}
fieldset {
    margin: 0;
    border: 0;
    padding: 0;
}
legend {

}
abbr {
    
}
label {
    cursor: pointer;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type]:-webkit-autofill,
input[type]:-webkit-autofill:hover,
input[type]:-webkit-autofill:focus,
input[type]:-webkit-autofill:active { /* Fix input background with autocomplete */
    -webkit-text-fill-color: var(--color-basic);
    transition: background-color 5000s ease-in-out 0s;
    caret-color: var(--color-basic);
}
input[type="search"] {
    -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}
input[type="submit"] {
    min-width: 16rem;
    border: 0;
    border-radius: 3rem;
    padding: 1.15rem 1rem;
    text-transform: uppercase;
    font: var(--size-md) 'Outfit-SemiBold';
    color: var(--color-primary);
    background-color: var(--color-bg-light);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}
input[type="submit"]:hover {
    color: #fff;
    background-color: var(--color-primary);
}
input[type="submit"]:disabled,
button[type="submit"]:disabled {
    opacity: 1;
}
input[type="submit"]::-moz-focus-inner { /* Fix extra button padding in Firefox */
    border: 0;
    padding: 0;
    line-height: 1;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="url"],
input[type="search"],
select,
textarea {
    width: 100%;
    border: 1px solid var(--color-basic);
    border-radius: .5rem;
    padding: .65rem 1rem;
    font: inherit;
    font-size: var(--size-md);
    color: var(--color-basic);
}
input[type="number"] {
    width: 100px;
    -moz-appearance: textfield;
}
textarea {
    display: block;
    resize: none;
    overflow: auto;
    scrollbar-width: thin;
}
textarea::-webkit-scrollbar {
    width: 2px;
}

/*== 1.3 - Default WP navigation ==*/
.post-navigation {
    margin-left: auto;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous {
    width: 50%;
    margin-top: 1.5rem;
    float: left;
}
.post-navigation .nav-links {
    display: flex;
    column-gap: 2rem;
}
.post-navigation .screen-reader-text {
    display: none;
}
.posts-navigation a,
.post-navigation a {
    text-decoration: none;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next {
    width: 50%;
    margin-top: 1.5rem;
    text-align: right;
    float: right;
}
.widget {
    list-style-type: none;
    margin: 0 0 4rem;
}
.widget:last-child {
    margin: 0;
}
.widget ul {
    list-style-type: none;
    padding: 0 !important;
}
.widget_text li:not(:last-child) {
    margin-bottom: 1.5rem;
}
.widget_text a[href^="tel:"]:before,
.widget_text a[href^="mailto:"]:before {
    content: "\e906";
    display: inline-block;
    padding-right: 1.25rem;
    vertical-align: top;
    font: 1.25rem/1 'icomoon' !important;
    color: var(--color-primary);
    transition: inherit;
}
.widget_text li:not(:first-child) a[href^="tel:"]:before {
    content: "\e907";
}
.widget_text a[href^="mailto:"]:not(:hover) {
    text-decoration: underline;
}
.widget_text a[href^="mailto:"]:before {
    content: "\e908";
}
.widget_text a[href^="tel:"]:hover:before,
.widget_text a[href^="mailto:"]:hover:before {
    color: inherit;
}
.post-thumbnail {
    display: block;
    margin-bottom: 3rem;
}
.post-thumbnail img,
.post-thumbnail picture {
    display: inherit;
    max-height: inherit;
    width: 100%;
    object-fit: cover;
}
.wp-caption {
    max-width: 100%;
}
.entry-title a,
.csc-firstHeader a {
    text-decoration: none;
    font-family: inherit;
    color: inherit;
}
.search-form {
    display: flex;
    gap: 1rem;
}
.search-form label {
    flex-grow: 1;
}
.search-form + .custom-btn {
    margin-top: 2rem;
}

/*== 1.4 - Accessibility ==*/
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    word-wrap: normal !important;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    overflow: hidden;
}
.screen-reader-text:focus {
    top: 5px;
    left: 5px;
    display: block;
    width: auto;
    height: auto;
    border-radius: 3px;
    padding: 15px 23px 14px;
    text-decoration: none;
    line-height: normal;
    font-size: 14px;
    font-weight: bold;
    color: #21759b;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    background-color: #f1f1f1;
    z-index: 100000;
    clip: auto !important;
    clip-path: none;
}
/* Don't show the outline on the skip link target. */
#main[tabindex="-1"]:focus {
    outline: 0;
}

/******** 2 - Main ********/
@keyframes cubemove {
    25% {
        transform: translateX(42px) rotate(-90deg) scale(0.5);
    }
    50% {
        transform: translateX(42px) translateY(42px) rotate(-179deg);
    }
    50.1% {
        transform: translateX(42px) translateY(42px) rotate(-180deg);
    }
    75% {
        transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    }
    100% {
        transform: rotate(-360deg);
    }
}
#preloader {
    position: fixed;
    display: none;
    width: 2.5rem;
    height: 2.5rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
}
#preloader .cube1,
#preloader .cube2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 1rem;
    height: 1rem;
    background-color: var(--color-primary);
    -webkit-animation: cubemove 1.8s infinite ease-in-out;
    animation: cubemove 1.8s infinite ease-in-out;
}
#preloader .cube2 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}
.admin-bar .page-container {
    min-height: calc(100vh - 32px);
}
.page-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.site-main {
    flex-grow: 1;
    padding-top: 180px;
}
.container {
    max-width: 1152px;
    margin: 0 auto;
    padding: 0 1rem;
}
.ws-section {
    background: linear-gradient(0deg, #fff 0%, #edf7fa 100%);
}
.ws-section.flexible-section:before,
.single-post .ws-section:before {
    content: "";
    display: block;
    height: 7.5rem;
    background-color: #fff;
}
.ws-row {
    display: flex;
    gap: 2rem;
    max-width: 1152px;
    margin: 0 auto;
    padding: 5rem 1rem;
}
.ws-row + .ws-row {
    padding-top: 0;
}
.ws-row.full-width {
    max-width: 100%;
    margin-bottom: 5rem;
    padding-right: 0;
    padding-left: 0;
}
.ws-row.lg-width {
    max-width: 1332px;
}
.ws-row.inner-row {
    width: 100%;
    padding: 0;
}
.ws-row.full-width .ws-row.inner-row {
    padding-right: 1rem;
    padding-left: 1rem;
}
.ws-row.three-cols {
    flex-direction: column;
    align-items: flex-start;
}
.ws-row.partner,
.ws-row.team-items {
    flex-wrap: wrap;
}
.ws-row.partner .ws-col-6 {
    width: calc(50% - 1rem);
}
.ws-row.partner img {
    max-width: 8.5rem;
    mix-blend-mode: multiply;
}
.ws-row.partner .content-item-text {
    font-size: var(--size-md);
}
.ws-row.team-items .ws-col-4 {
    width: calc(33.33% - 4rem/3);
}
.ws-col-1 {
    width: 8.33%;
}
.ws-col-2 {
    width: 16.66%;
}
.ws-col-3 {
    width: 25%;
}
.ws-col-4 {
    width: 33.33%;
}
.ws-col-5 {
    width: 41.66%;
}
.ws-col-6 {
    width: 50%;
}
.ws-col-7 {
    width: 58.33%;
}
.ws-col-8 {
    width: 66.66%;
}
.ws-col-9 {
    width: 75%;
}
.ws-col-10 {
    width: 83.33%;
}
.ws-col-11 {
    width: 91.66%;
}
.ws-col-12 {
    width: 100%;
}
.content-item {
    margin-bottom: 4rem;
}
.content-item h2 {
    color: var(--color-accent);
}
.content-item h3,
.content-item .h3,
h2.headline,
h3.headline,
.team-item-text .h2,
.csc-textpicHeader h2,
.csc-header h2,
.head-toggle {
    font-size: var(--size-lg);
    font-family: 'Outfit-Bold';
    color: var(--color-accent);
}
.content-item-image img.has-rounded-corner,
.content-toggle img.has-rounded-corner {
    border-bottom-right-radius: 4rem;
}
.sidebar {
    flex-shrink: 0;
    flex-basis: 25%;
}
.flexbox {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: flex-start;
}
.flexbox-center {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.flexbox-center-between {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
.img-box {
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.img-box.alt {
    background-position: center;
    background-size: 118px;
}
.img-box .relative {
    z-index: 1;
}
.css-parallax {
    background-attachment: fixed;
}
.css-parallax.empty {
    min-height: 35vh;
}
.title-box {
    max-width: 52rem;
    width: 100%;
    margin: 0 auto 5rem;
    text-align: center;
}
.title-box .entry-title,
.top-banner .entry-title,
.single-post .entry-title,
.more-link,
.nav-menu a:hover,
.nav-menu > li.menu-item-has-children:hover > a,
.nav-menu > li.menu-item-has-children.show > a,
.nav-menu li.current-menu-item > a,
.nav-menu li.current-menu-ancestor > a {
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 100%), 
                linear-gradient(270deg, #02a77f -22.84%, #015f98 50.18%, #001f32 88.83%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}
.relative {
    position: relative;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-md {
    font-size: var(--size-md);
}
.align-center {
    margin-right: auto;
    margin-left: auto;
}
.align-right {
    margin-left: auto;
}
.no-text-transform {
    text-transform: none;
}
.no-padding {
    padding: 0 !important;
}
.show-on-mobile {
    display: none !important;
}
.has-gradient-dark {
    background: url(images/bg-circles.svg) no-repeat center, 
                linear-gradient(180deg, rgba(10, 44, 51, 0) 0%, #0a2c33 100%), 
                linear-gradient(180deg, #000203 0%, #013C5E 100%);
    background-size: cover;
}
.socials-list {
    display: flex;
}
.socials-list li:not(:last-child) {
    margin-right: 2rem;
}
.socials-list a {
    display: block;
    text-decoration: none;
    line-height: 1;
    font-size: 1.25rem;
    color: var(--color-primary);
}
.socials-list a:hover {
    color: var(--color-basic);
}
.custom-btn {
    border-bottom-right-radius: 1rem;
    padding: 1.25rem 2.5rem;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: .043em;
    font: var(--size-md) 'Outfit-SemiBold';
    color: #fff;
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 100%);
    transition: all .3s ease;
}
.custom-btn span {
    position: relative;
    display: inline-block;
    width: var(--size-md);
    height: var(--size-lg);
    margin-left: .75rem;
    vertical-align: middle;
    will-change: transform;
    overflow: hidden;
}
.custom-btn i {
    display: block;
    height: inherit;
    line-height: 21px;
    transition: transform .3s ease-in-out;
}
.custom-btn i:last-child {
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(-100%);
}
.custom-btn:hover {
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 160.5%);
}
.custom-btn:hover span i:first-child {
    transform: translateY(100%);
}
.custom-btn:hover span i:last-child {
    transform: translateY(0);
}
.more-link {
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: .043em;
    font: .938rem/1 'Outfit-SemiBold';
    transition: none !important;
}
.more-link i {
    margin-left: .5rem;
    font-size: 75%;
    transition: margin .3s ease !important;
}
.more-link i.icon-arrow-left-square {
    margin: 0 .5rem 0 0;
}
.more-link:hover {
    color: var(--color-primary);
    background: none;
    background-clip: inherit;
    -webkit-background-clip: inherit;
    -webkit-text-fill-color: inherit;
}
.more-link:hover i {
    margin-left: .75rem;
}
.more-link:hover i.icon-arrow-left-square {
    margin: 0 .75rem 0 0;
}

/******** 3 - Header & Footer ********/

/*== 3.1 - Header ==*/
.header-wrapper {
    position: fixed;
    top: 0;
    width: 100%;
    font-size: 1rem;
    color: var(--color-primary);
    background-color: #fff;
    transition: all .5s ease;
    z-index: 120;
}
.admin-bar .header-wrapper {
    top: 32px;
}
.fixed .header-wrapper {
    -webkit-box-shadow: 0 2px 10px -3px rgba(16, 26, 48, .2);
    box-shadow: 0 2px 10px -3px rgba(16, 26, 48, .2);
}
.header-wrapper .container,
.header-wrapper .flexbox-center-between {
    height: 100%;
}
.header-wrapper .flexbox-center-between > div:first-child {
    flex-shrink: 0;
    flex-basis: 206px;
}
.top-bar {
    height: 60px;
    padding-top: 40px;
}
.top-bar .header-options {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.top-bar .search-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
}
.top-bar .search-btn.open:before {
    content: "\e904";
    font-size: .75rem;
}
.top-bar .search-box {
    display: inherit;
    align-items: inherit;
    column-gap: 1rem;
}
.top-bar .search-form ::-webkit-input-placeholder {
    color: var(--color-primary);
}
.top-bar .search-form ::-moz-placeholder {
    color: var(--color-primary);
}
.top-bar .search-form :-moz-placeholder {
    color: var(--color-primary);
}
.top-bar .search-form :-ms-input-placeholder {
    color: var(--color-primary);
}
.top-bar .search-form,
.top-bar .search-form .screen-reader-text,
.top-bar .search-form input[type="submit"] {
    display: none;
}
.top-bar .search-form input[type="search"] {
    border: 0;
    border-radius: 0;
    padding: 0;
    font-size: inherit;
    color: inherit;
}
.wpml-ls-legacy-dropdown {
    display: flex;
    align-items: center;
    width: auto;
    margin-left: 1.5rem;
    border-left: 1px solid var(--color-secondary);
    padding-left: 1.5rem;
}
.wpml-ls-legacy-dropdown:before {
    content: "\e905";
    display: inline-block;
    margin: 0 1rem -2px 0;
    font: 1rem/1 'icomoon' !important;
}
.wpml-ls-legacy-dropdown a {
    line-height: inherit;
}
.wpml-ls-legacy-dropdown a {
    border: 0;
    padding: 0;
    color: inherit;
    background-color: transparent;
    transition: none;
}
.wpml-ls-legacy-dropdown a.wpml-ls-item-toggle {
    border: 0;
    padding: 0;
    background-color: transparent;
    color: inherit;
    cursor: default;
}
.wpml-ls-legacy-dropdown a.wpml-ls-item-toggle:after {
    content: none;
}
.wpml-ls-legacy-dropdown .wpml-ls-current-language:hover > a,
.wpml-ls-legacy-dropdown a:focus,
.wpml-ls-legacy-dropdown a:hover {
    color: inherit;
    background-color: transparent;
}
.wpml-ls-legacy-dropdown .wpml-ls-sub-menu {
    border: 0;
    transform: translateY(5px);
    transition: all 0.35s ease-in-out;
}
.wpml-ls-legacy-dropdown .wpml-ls-current-language:hover .wpml-ls-sub-menu {
    transform: none;
}
.main-nav-wrap {
    height: 120px;
}
.custom-logo-link,
.custom-logo {
    display: block;
}

/*== 3.2 - Navigation ==*/
.main-overlay,
.modal-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .75);
    transition: all .5s ease;
    z-index: 12;
    opacity: 0;
    visibility: hidden;
}
.close-btn {
    position: relative;
    display: block;
    width: 1rem;
    height: 1rem;
    font-style: normal;
    cursor: pointer;
}
.close-btn:before {
    content: "\e904";
    display: block;
    font: 1.25rem/1 'icomoon' !important;
}
.main-navigation .close-btn {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    display: none;
    margin: 0;
    z-index: 1;
}
.nav-btn {
    flex-shrink: 0;
    display: none;
    width: 24px;
    height: 20px;
    margin-left: 1.5rem;
    cursor: pointer;
}
.nav-btn span {
    position: relative;
    top: 9px;
    display: block;
    width: 100%;
    height: 3px;
    border-radius: 2px;
    background-color: var(--color-primary);
    transition: all 0.25s ease-in-out;
}
.nav-btn span:before,
.nav-btn span:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background-color: var(--color-primary);
    transition: inherit;
}
.nav-btn span:before {
    top: -8px;
}
.nav-btn span:after {
    top: 8px;
    width: 75%;
    left: auto;
    right: 0;
}
.nav-btn:hover span:after {
    width: 100%;
}
.nav-menu,
.copyright-menu {
    display: flex;
    align-items: flex-start;
    column-gap: 2rem;
}
.nav-menu li.menu-item-has-children {
    position: relative;
}
.nav-menu li.menu-item-has-children > a:after {
    content: "\e902";
    display: inline-block;
    margin-left: .5rem;
    vertical-align: middle;
    font: .75rem / 1 'icomoon' !important;
}
.nav-menu li.menu-item-has-children > a[href="#"] {
    pointer-events: none;
}
.nav-menu li.menu-item-has-children:hover > ul {
    pointer-events: inherit;
    opacity: 1;
    visibility: visible;
}
.nav-menu a {
    text-decoration: none;
    font-family: 'Outfit-Medium';
}
.nav-menu > li > a {
    font-size: 1.125rem;
}
.nav-menu .sub-menu {
    position: absolute;
    top: 100%;
    left: -1rem;
    width: 250px;
    padding: 1.5rem 1rem;
    -webkit-box-shadow: 0 2px 10px -3px rgba(16, 26, 48, .2);
    box-shadow: 0 2px 10px -3px rgba(16, 26, 48, .2);
    background-color: #fff;
    transition: all .5s ease;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
}
.nav-menu li:last-child .sub-menu {
    left: auto;
    right: 0;
}
.nav-menu .sub-menu li:not(:last-child) {
    margin-bottom: .5rem;
}

/*== 3.3 - Footer ==*/
.footer {
    padding: 6rem 0;
    font-size: var(--size-md);
    color: var(--color-secondary);
    background: linear-gradient(0deg, rgba(237, 247, 250, .2) 0%, #edf7fa 100%);
}
.footer a {
    text-decoration: none;
}
.footer a:hover,
.copyright-menu li.current-menu-item a {
    color: var(--color-basic);
}
.footer .widget_text br + a {
    margin-top: .875rem;
}
.footer h4 {
    text-transform: uppercase;
    font-family: 'Outfit-Bold';
    color: var(--color-primary);
}
.footer-content {
    display: flex;
    align-items: flex-start;
    gap: 7rem;
}
.footer-content > ul {
    flex: 1;
}
.footer-content > ul:first-child {
    flex: 0;
    flex-basis: 230px;
}
.footer-content > ul:not(:first-child) a {
    font-size: 1rem;
}
.copyright {
    margin-top: 3rem;
    border-top: 1px solid var(--color-secondary);
    padding-top: 2rem;
    font-size: var(--size-sm);
}

/******** 4 - Pages ********/
.single-post .post-thumbnail {
    max-height: 46rem;
    margin-top: -12.5rem;
    border-bottom-right-radius: 4rem;
    overflow: hidden;
}
.single-post .wp-block-image img {
    border-bottom-right-radius: 2rem;
}
.single-post .wp-block-columns.is-layout-flex {
    margin: 4rem 0;
}
.single-post .post-meta {
    display: flex;
    align-items: center;
    border-top: 1px solid;
    border-bottom: 1px solid;
    padding: 1.25rem 0;
}
.single-post .post-meta a,
.posts-wrapper .terms-list a {
    text-decoration: none;
}
.single-post .posted-on,
.single-post .cat-links {
    font-size: var(--size-sm);
    color: var(--color-secondary);
}
.single-post .cat-links:before,
.posts-wrapper .terms-list:before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    margin: -2px .5rem 0;
    border-radius: 50%;
    vertical-align: middle;
    background-color: var(--color-secondary);
}
.nf-before-form-content { /* ninja forms */
    display: none;
}
.nf-field .field-wrap {
    position: relative;
}
.label-above .nf-field .nf-field-label {
    margin: 0;
}
.label-right .nf-field .nf-field-label {
    padding-left: .5rem;
}
.nf-field .field-wrap:not(.checkbox-wrap) .nf-field-label {
    position: absolute;
    top: 6px;
    left: .5rem;
    padding: 0 .5rem;
    background-color: #fff;
    transition: transform .15s cubic-bezier(.4, 0, .2, 1);
    z-index: 1;
}
.nf-field .field-wrap.nf-error:not(.checkbox-wrap) .nf-field-label {
    top: 12px;
}
.nf-field.is-focused .field-wrap:not(.checkbox-wrap) .nf-field-label {
    transform: scale(0.75) translate(-8px, -28px);
}
.nf-field .field-wrap.checkbox-wrap input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    border-radius: 4px;
}
.nf-field .nf-field-label label {
    font-weight: normal;
    font-size: var(--size-md);
}
.nf-field-container.submit-container {
    margin: 2.5rem 0 0;
    text-align: center;
}
.nf-error {
    font-size: var(--size-sm);
}
.nf-form-cont[aria-labelledby="nf-form-title-4"] .nf-field-container.one-half {
    width: calc(37% - 2.5641025641%/2 - 66px);
}
.nf-form-cont[aria-labelledby="nf-form-title-4"] .nf-field-container.one-half.first,
.nf-form-cont[aria-labelledby="nf-form-title-4"] .nf-field-container.checkbox-container {
    margin-left: 26%;
}
.product-table {
    font-size: 15px;
}
.product-table:last-child {
    margin-bottom: 3rem;
}
.product-table th {
    padding: .625rem 1rem;
    text-align: center;
    font-family: 'Outfit-SemiBold';
    color: #fff;
    background-color: var(--color-accent);
}
.product-table th:first-child,
.product-table th:nth-child(2),
.product-table td:first-child,
.product-table td[rowspan] + td {
    text-align: left;
}
.product-table th:first-child {
    width: 26%;
}
.product-table th:nth-child(2) {
    width: 34%;
}
.product-table th:last-child {
    width: 132px;
}
.product-table td {
    padding: 1px 1rem;
    text-align: center;
}
.product-table td:not([rowspan]) {
    vertical-align: middle;
}
.product-table tr:first-child td,
.product-table td[rowspan],
.product-table td[colspan="4"] {
    padding-top: 1.25rem;
}
.product-table td[rowspan],
.product-table td:last-child {
    border-color: transparent;
}
.product-table input[type="number"] {
    width: 100px;
    border-radius: .25rem;
    padding: 1px 1rem;
    font-size: inherit;
}

/*== 4.1 - hero banner ==*/
@keyframes reveal-up {
    from {
        opacity: 0;
        transform: translateY(2rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes reveal-left {
    from {
        opacity: 0;
        transform: translateX(4rem);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
.hero-banner {
    position: relative;
    display: flex;
    align-items: flex-end;
    gap: 2rem;
    min-height: 34rem;
    margin-top: -12.5rem;
    border-bottom-right-radius: 2.25rem;
    padding: 5.5rem 4rem 0 5.5rem;
    background: url(images/layer-banner.svg) no-repeat bottom right,
                linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(1, 98, 152, .1) 100%), 
                linear-gradient(180deg, rgba(1, 95, 152, .5) 0%, rgba(2, 167, 127, .15) 49.04%), #ccc;
    background-blend-mode: normal, color, normal;
    overflow: hidden;
}
.hero-banner .text-box {
    padding-bottom: 5.5rem;
}
.hero-banner .text-box > div {
    animation: reveal-up 0.8s ease forwards;
}
.hero-banner .entry-title {
    color: #fff;
}
.hero-banner p {
    font: 1.875rem/1.1 'Outfit-Medium';
    color: #00436c;
}
.hero-banner img {
    display: block;
    max-width: 32rem;
    margin-bottom: -2px;
    animation: reveal-left 0.8s ease forwards;
}
.hero-banner .custom-btn {
    margin-top: 5rem;
}
.hero-banner + .teaser-boxes {
    margin-top: 6rem;
}

/*== 4.2 - top banner ==*/
.top-banner {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    height: 23rem;
    margin-top: -12.5rem;
    border-bottom-right-radius: 2rem;
    padding: 0 6rem;
    color: #fff;
    background: linear-gradient(180deg, #163840 0%, #135059 100%);
    overflow: hidden;
}
.top-banner .text-box {
    max-width: 34rem;
    width: 100%;
    padding: 3rem 0;
}
.top-banner img {
    width: 28rem;
    height: 25rem;
}

/*== 4.3 - teaser boxes ==*/
.teaser-boxes .flexbox {
    gap: 2rem;
}
.teaser-boxes .flexbox * {
    transition: inherit;
}
.teaser-boxes .flexbox > div {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    width: calc(33.33% - 4rem/3);
    height: 26.25rem;
    padding: 3rem;
    color: #fff;
    background: linear-gradient(180deg, #163840 0%, #135059 100%);
    transition: all .5s ease-in-out;
    overflow: hidden;
}
.teaser-boxes .flexbox > div:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 100%), 
                linear-gradient(270deg, #02a77f -22.84%, #015f98 50.18%, #001f32 88.83%);
}
.teaser-boxes .flexbox a {
    display: inherit;
    flex-direction: inherit;
    justify-content: inherit;
    align-items: inherit;
    width: calc(100% + 6rem);
    height: calc(100% + 6rem);
    margin: -3rem;
    padding: inherit;
    text-decoration: none;
    color: inherit;
}
.teaser-boxes .flexbox p {
    line-height: 1.5;
    font-size: var(--size-md);
}
.teaser-boxes .icon-box {
    flex-shrink: 0;
    display: flex;
    width: 4.125rem;
    height: 4.125rem;
}
.teaser-boxes .icon-box img {
    max-height: 100%;
}
.teaser-boxes .flexbox > div:hover {
    border-bottom-right-radius: 1.5rem;
    padding-top: 3.25rem;
    padding-bottom: 3.25rem;
    background: linear-gradient(180deg, #10333c 0%, #135969 100%);
}
.teaser-boxes .flexbox > div:hover .entry-title {
    margin-bottom: 2rem;
}
.teaser-boxes .flexbox > div:hover p:not(:last-child) {
    margin-bottom: 1rem;
}
.teaser-boxes .more-link:hover {
    color: #fff;
}

/*== 4.4 - blog ==*/
.filters-wrapper .cat-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem 1.125rem;
    margin-bottom: 4rem;
    border-radius: 3rem;
    padding: 1rem;
    background-color: #fff;
}
.filters-wrapper .cat-list a {
    position: relative;
    padding-left: 1.5rem;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: .043em;
    font-size: var(--size-md);
    color: var(--color-secondary);
}
.filters-wrapper .cat-list a:before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 14px;
    height: 14px;
    border: 1px solid var(--color-secondary);
    border-radius: 50%;
    box-sizing: border-box;
    transition: inherit;
}
.filters-wrapper .cat-list a.active {
    pointer-events: none;
}
.filters-wrapper .cat-list a.active:before {
    background-color: #02a77f;
}
.posts-wrapper .all-posts {
    display: flex;
    flex-wrap: wrap;
    gap: 3rem 2rem;
}
.posts-wrapper [class*="type-"] {
    width: calc(33.33% - 4rem/3);
}
.posts-wrapper figure {
    aspect-ratio: 3/2;
    margin-bottom: 2rem;
    border-bottom-right-radius: 2rem;
    overflow: hidden;
}
.posts-wrapper figure a,
.posts-wrapper figure picture,
.posts-wrapper figure img {
    display: block;
    width: 100%;
    height: 100%;
}
.posts-wrapper figure img {
    transition: all .3s linear;
    object-fit: cover;
    object-position: top;
}
.posts-wrapper [class*="type-"]:hover figure img {
    transform: scale(1.05);
}
.posts-wrapper figure.alt,
.posts-wrapper figure.alt a {
    display: flex;
    justify-content: center;
    align-items: center;
}
.posts-wrapper figure.alt img {
    width: 80%;
    height: auto;
    object-fit: contain;
}
.posts-wrapper .text-box .flexbox {
    margin-bottom: 1.5rem;
    font-size: var(--size-sm);
    color: var(--color-secondary);
}
.posts-wrapper .text-box .entry-title {
    font-family: 'Outfit-SemiBold';
    color: var(--color-primary);
}
.posts-wrapper .text-box p:empty,
.posts-wrapper.view-portrait .text-box p {
    display: none;
}
.posts-wrapper .terms-list {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
}
.posts-wrapper .terms-list:before {
    align-self: center;
    margin: 0 .25rem 0 .5rem;
}
.posts-wrapper .terms-list li:last-child i {
    display: none;
}
.posts-wrapper.view-portrait figure {
    aspect-ratio: 5/6;
    border-radius: 0;
}
.posts-wrapper select,
.not-found {
    display: none;
}
.not-found h3 {
    text-align: center;
}
.pagination-box {
    width: 100%;
    margin-top: 1rem;
}
.pagination-box ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .25rem;
    width: fit-content;
    min-width: 16rem;
    margin: 0 auto;
    border-radius: 3rem;
    padding: 1.125rem 1rem;
    text-align: center;
    font: var(--size-md) 'Outfit-SemiBold';
    color: var(--color-primary);
    background-color: var(--color-bg-light);
}
.pagination-box ul li a,
.pagination-box ul li span {
    display: block;
    min-width: var(--size-lg);
    padding: 0 .25rem;
    text-decoration: none;
}
.pagination-box ul i {
    font-size: 75%;
}
.pagination-box ul li span.current {
    pointer-events: none;
    color: #02a77f;
}
.pagination-box ul li span.dots {
    pointer-events: none;
}

/*== 4.5 - accordion ==*/
.box-toggle {
    margin-bottom: 1.5rem;
    border-left: 3px solid var(--color-accent);
    background-color: #fff;
}
.content-item-accordion-main .box-toggle {
    border-top: 3px solid var(--color-accent);
    border-left: 0;
    background-color: transparent;
}
.head-toggle {
    position: relative;
    padding: 1rem 1rem 1rem 3.5rem;
    cursor: pointer;
}
.head-toggle:before {
    content: "";
    position: absolute;
    top: calc(1rem - 2px);
    left: 1rem;
    width: 29px;
    height: 29px;
    background: url(images/plus.svg) no-repeat;
    background-size: contain;
    transition: transform .3s ease;
}
.content-toggle {
    display: none;
    padding: 0 1rem 1rem 3.5rem;
}
.content-toggle .flexbox {
    gap: 2rem;
}
.content-toggle .flexbox .pos-left {
    width: calc(33.33% - 1rem);
}
.content-toggle .flexbox .pos-left a,
.content-toggle .flexbox .pos-left img,
.content-toggle .flexbox .pos-top a,
.content-toggle .flexbox .pos-top img {
    display: block;
    width: 100%;
}
.content-toggle .flexbox .pos-top {
    max-width: 14rem;
}
.content-toggle .flexbox .pos-top img {
    mix-blend-mode: multiply;
}
.content-toggle .flexbox .pos-left + div {
    width: calc(66.66% - 1rem);
}
.content-toggle .flexbox .pos-top + div {
    width: 100%;
}
.box-toggle.open {
    border-color: #02a77f;
}
.box-toggle.open .head-toggle:before {
    transform: rotate(-45deg);
}
.content-item-accordion-main .box-toggle.open {
    border-top: 0;
    border-left: 3px solid #02a77f;
}
.content-item-accordion-main .accordion > h2 {
    margin: 3rem 0 .75rem;
}
.content-item-accordion-main .accordion > h2:first-child {
    margin-top: 0;
}

/*== 4.6 - content gradient ==*/
.content-item-text-gradient .flexbox {
    flex-wrap: nowrap;
    gap: 2rem 2.5rem;
    padding: 3.5rem 2.5rem;
    border-bottom-right-radius: 4rem;
    color: #fff;
    box-shadow: 0 4px 4px rgba(0, 0, 0, .25);
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 100%), 
                linear-gradient(270deg, #02a77f -22.84%, #015f98 50.18%, #001f32 88.83%);
    transition: all .3s ease;
}
.content-item-text-gradient .flexbox:hover {
    background: linear-gradient(90deg, #02a77f 0%, #50aad5 160.5%), 
                linear-gradient(270deg, #02a77f -22.84%, #015f98 50.18%, #001f32 88.83%);
}
.content-item-text-gradient .flexbox > div {
    flex: 1;
}

/*== 4.7 team ==*/
.team-item-image {
    margin-bottom: 1.5rem;
}
.team-item-image img {
    display: block;
    max-height: 470px;
    border-bottom-right-radius: 4rem;
    object-fit: cover;
}
.team-item-text .h2 {
    margin-bottom: .5rem;
}
.team-contact-list li {
    margin-top: .5rem;
}
.team-contact-list a {
    text-decoration: none;
}
.team-contact-list a:hover {
    color: var(--color-accent);
}
.team-contact-list i {
    margin-right: .5rem;
}