/*
    Theme Name: Atracsys
    Author: Egloo
    Author URI: https://egloo.it
    Version: 2.0.4
    Text Domain: atracsys
    Description: A custom WordPress theme for Atracsys, designed by Egloo.
    License: GNU General Public License v2 or later
    License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

dialog {
    margin: auto;
}

a,
input,
textarea,
select,
button,
h1,
h2,
h3,
h4,
h5,
h6 {
    font: inherit;
    color: inherit;
}

a {
    text-decoration: none;
}

a,
button,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

img,
video,
iframe {
    display: block;
    width: 100%;
    height: auto;
}

iframe {
    height: 100%;
}

button,
label,
input {
    cursor: pointer;
}

input[type="submit"],
button {
    border: none;
    background-color: transparent;
}

svg {
    line-height: 0;
}

ul {
    list-style-type: none;
}

html {
    scroll-behavior: smooth;
    scroll-padding: 10.25rem;
}

input[type="checkbox"] {
    flex-shrink: 0;
    appearance: none;
    width: 1.125rem;
    height: 1.125rem;
    border: 2px solid var(--c-blue-purple);
    border-radius: 2px;
    outline-offset: 4px;
    background-color: var(--bg);
}

input[type="checkbox"]:checked {
    background-color: var(--c-blue-purple);
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1jaGVjay1pY29uIGx1Y2lkZS1jaGVjayI+PHBhdGggZD0iTTIwIDYgOSAxN2wtNS01Ii8+PC9zdmc+");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1rem;
}

label:has(input[type="checkbox"]) {
    display: flex;
    align-items: center;
    gap: 0.4375rem;
}

/* ======================================== */
/* THEME */
/* ======================================== */

.hidden {
    display: none !important;
}

.rich-text p:not(:last-child) {
    margin-block-end: 1lh;
}

.rich-text strong {
    font-weight: 700;
}

.rich-text ul {
    list-style-type: disc;
}

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

.rich-text ul,
.rich-text ol {
    padding-inline-start: 1rem;
}

.rich-text a {
    text-decoration: underline;
    color: var(--c-orange);
}

.rich-text p:has(+ p > small:only-child) {
    margin-bottom: 1.8125rem;
}

.rich-text p:has(small:only-child),
.rich-text sup,
.rich-text small {
    font-size: 0.75rem;
    line-height: 1.5;
}

.sr-only {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.img-wrapper.img-wrapper-ratio > picture,
.img-wrapper.img-wrapper-ratio {
    overflow: hidden;
    position: relative;
    block-size: 0;
}

.img-wrapper.img-wrapper-ratio > picture {
    block-size: 100%;
    display: block;
}

.img-wrapper.img-wrapper-ratio > video,
.img-wrapper.img-wrapper-ratio > picture > video,
.img-wrapper.img-wrapper-ratio > picture > img,
.img-wrapper.img-wrapper-ratio > img {
    inline-size: 100%;
    block-size: 100%;
    position: absolute;
    object-fit: cover;
    inset: 0;
}

:root {
    --container-columns: 12;
    --container-gap: 1.25rem;
    --container-column-width: 6.0625rem;
    --container-x-padding: 2rem;

    --header-height: 7.75rem;

    --c-blue-purple: #2f0e53;
    --c-orange: #e94f1c;
    --c-teal: #2c5166;
    --c-light-gray: #f2f2f2;
    --c-gray: #edf1f3;
    --c-white: #fff;
    --c-black: #000;

    --z-references-filters: 999;
    --z-header: 998;
    --z-info-popup: 997;
    --z-content-blocks-bar: 990;

    --fg: var(--c-blue-purple);
    --bg: var(--c-white);
}

@media (max-width: 768px) {
    :root {
        --header-height: 5rem;
    }
}

.bg-gray {
    --bg: #edf1f3;
    background-color: var(--bg);
    display: flow-root;
}

.bg-orange {
    --fg: var(--c-white);
    --bg: var(--c-orange);
    color: var(--fg);
    background-color: var(--bg);
    display: flow-root;
}

.bg-dots {
    background-image: url(assets/img/bg-dots.webp);
    background-size: 100% 626px;
    background-position: center bottom;
    display: flow-root;
    background-repeat: no-repeat;
}

.bg-dark {
    --fg: var(--c-white);
    --bg: #050612;
    color: var(--fg);
    background-color: var(--bg);
}

.bg-dark-wave {
    background-image: url(assets/img/dark-wave.webp);
    background-size: cover;
    background-position: center center;
    display: flow-root;
}

.bg-dark-dots {
    background-image: url(assets/img/dots-opacity.webp);
    background-size: 100% 626px;
    background-position: center bottom;
    display: flow-root;
    background-repeat: no-repeat;
}

.bg-blobs {
    isolation: isolate;
    display: flow-root;
    position: relative;
    overflow: hidden;
}

.bg-blobs::before,
.bg-blobs::after {
    content: "";
    width: 1577px;
    height: 1577px;
    background-image: radial-gradient(closest-side, rgb(150 52 255 / 0.38), transparent);
    position: absolute;
    z-index: -1;
}

body.campaign-landing-template-default .bg-blobs::after,
body.campaign-landing-template-default .bg-blobs::before {
    z-index: 0;
}

.bg-blobs::after {
    right: -788.5px;
    top: -9.5rem;
}

.bg-blobs::before {
    left: -788.5px;
    top: -26.3125rem;
}

.trimmed {
    text-box: trim-both cap alphabetic;
}

.layers {
    display: grid;
}

.layers > .layer {
    grid-column: -1/1;
    grid-row: -1/1;
}

.layers > .layer.layer-bg {
    position: relative;
}

.layers > .layer.layer-bg::before,
.layers > .layer.layer-bg::after {
    content: "";
    pointer-events: none;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 100%;
    block-size: 100%;
    position: absolute;
}

.layers > .layer.layer-fg {
    position: relative;
    z-index: 1;
}

.container {
    inline-size: 100%;
    max-inline-size: calc((var(--container-x-padding) * 2) + ((var(--container-columns) - 1) * var(--container-gap)) + (var(--container-columns) * var(--container-column-width)));
    margin-inline: auto;
    padding-inline: var(--container-x-padding);
}
.container.container-10 {
    --container-columns: 10;
}
.container.container-8 {
    --container-columns: 8;
}
.container.container-6 {
    --container-columns: 6;
}
.container.container-5 {
    --container-columns: 5;
}
.container.container-4 {
    --container-columns: 4;
}

.fs-title-1 {
    font-size: 3.75rem;
    line-height: 1.1666666666667;
}

.fs-title-2 {
    font-size: 3.125rem;
    line-height: 1.2;
}

.fs-title-3 {
    font-size: 2.5rem;
    line-height: 1.25;
}

.fs-paragraph {
    font-size: 1.25rem;
    line-height: 1.5;
}

.fs-paragraph-comparison {
    font-size: 1.125rem;
    line-height: 1.2222222222222;
}

.fs-box-title {
    font-size: 2.125rem;
    line-height: 1.1764705882353;
}

.fs-box-text {
    font-size: 1rem;
    line-height: 1.5;
}

.fs-news-title {
    font-size: 2.1875rem;
    line-height: 1.1428571428571;
}

.fs-subtitle-news {
    font-size: 1.5625rem;
    line-height: 1.32;
}

.fs-case-title {
    font-size: 1.875rem;
    line-height: 1.1666666666667;
}

.fs-case-paragraph {
    font-size: 1.125rem;
    line-height: 1.3888888888889;
}
@media (max-width: 767px) {
    .fs-title-1 {
        font-size: 2.5rem;
        line-height: 1.2;
    }
    .fs-title-2 {
        font-size: 2.125rem;
        line-height: 1.2352941176471;
    }
    .fs-title-3 {
        font-size: 1.875rem;
        line-height: 1.3333333333333;
    }
    .fs-paragraph {
        font-size: 1rem;
        line-height: 1.5;
    }
    .fs-paragraph-comparison {
        font-size: 1rem;
        line-height: 1.375;
    }
    .fs-box-title {
        font-size: 1.625rem;
        line-height: 1.2307692307692;
    }
    .fs-box-text {
        font-size: 0.875rem;
        line-height: 1.5714285714286;
    }
    .fs-news-title {
        font-size: 1.75rem;
        line-height: 1.2142857142857;
    }
    .fs-subtitle-news {
        font-size: 1.25rem;
        line-height: 1.4;
    }
    .fs-case-title {
        font-size: 1.5rem;
        line-height: 1.25;
    }
    .fs-case-paragraph {
        font-size: 1rem;
        line-height: 1.5;
    }
}

html,
body {
    color: var(--fg);
    background-color: var(--bg);
    font-family: "Poppins";
}

body.post-type-archive-faq {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100svh;
}

body.post-type-archive-faq footer {
    margin-top: auto;
}

input[type="submit"],
.btn.btn-primary {
    text-align: center;
    font-weight: 500;
    display: inline-flex;
    justify-content: center;
    font-size: 1.125rem;
    padding: 0.75rem 1.1875rem;
    border: 2px solid var(--c-orange);
    color: currentColor;
    background-color: transparent;
    border-radius: 999px;
    transition:
        color 0.2s ease-in-out,
        background-color 0.2s ease-in-out,
        border-color 0.2s ease-in-out;
}

input[type="submit"],
.btn.btn-primary.btn-smaller {
    padding: 0.40625rem 1.1875rem;
}

@media (max-width: 768px) {
    .btn.btn-primary {
        padding: 0.40625rem 1.1875rem;
        font-size: 1rem;
    }
}

.bg-orange .btn.btn-primary:not(.card .btn.btn-primary) {
    background-color: #d64b1c;
    border-color: var(--fg);
}

input[type="submit"]:where(:hover, :focus-visible),
label.btn.btn-primary:has(input:checked),
.btn.btn-primary:where(:hover, :focus-visible) {
    background-color: var(--c-orange);
    color: var(--c-white);
    border-color: var(--c-white);
}

.bg-orange label.btn.btn-primary:has(input:checked):not(.card .btn.btn-primary),
.bg-orange .btn.btn-primary:not(.card .btn.btn-primary):where(:hover, :focus-visible) {
    border-color: var(--fg);
    background-color: var(--fg);
    color: var(--bg);
}

.btn.btn-primary:focus-visible {
    outline: 4px solid var(--fg);
    outline-offset: 4px;
}

.wpcf7 div[data-id="group-support"] + p {
    margin-top: 1.75rem;
}

.wpcf7 .wpcf7-form-control-wrap {
    display: grid;
}

.wpcf7-styled .align-center {
    text-align: center;
}

.wpcf7-styled :is(textarea, select, input:not([type="checkbox"], [type="radio"], [type="submit"])) {
    border: 1px solid var(--c-orange);
    background-color: #f8fafc;
    font-size: 1rem;
    line-height: 1.5;
    padding: 0.6875rem 0.75rem;
    border-radius: 0.25rem;
    width: 100%;
}

.wpcf7-styled :is(textarea, select, input:not([type="checkbox"], [type="radio"], [type="submit"])):focus-visible {
    outline-color: var(--c-orange);
}

.wpcf7-styled :is(textarea, select, input:not([type="checkbox"], [type="radio"], [type="submit"]))::placeholder {
    color: #b8bcca;
}

.wpcf7-styled label:has(input:not(:checkbox), select, textarea) {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.wpcf7-styled label:has(input:not(:checkbox), select, textarea) > span:first-child {
    font-size: 1rem;
    line-height: 1.5;
    display: block;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"]) {
    margin-block: 1.75rem;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p {
    display: grid;
    --grid-item-width: 25rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    row-gap: 1.75rem;
    column-gap: 1.25rem;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p br:not(.normal-text br) {
    display: none;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wpcf7-submit,
.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wide {
    grid-column: -1/1;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wpcf7-submit {
    width: fit-content;
    margin-inline: auto;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .normal-text {
    line-height: 2;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wpcf7-spinner {
    display: none;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wpcf7-not-valid-tip {
    font-size: 0.75rem;
    margin-top: 0.125rem;
}

body .wpcf7 form .wpcf7-response-output {
    border-radius: 0.25rem;
    text-align: center;
    margin-bottom: 0;
    width: fit-content;
    margin-inline: auto;
    background: #ffb9001c;
    margin-left: auto;
    margin-right: auto;
}

.wpcf7-styled .wpcf7 form.sent .wpcf7-response-output {
    background-color: #46b45030;
}

.wpcf7-styled :is([data-class="wpcf7cf_group"], form) > p .wide > label > span:first-child {
    margin-bottom: 0.2rem;
    display: flex;
}

/* ======================================== */
/* HEADER */
/* ======================================== */

header.egloo {
    z-index: var(--z-header);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding-block: 2rem;
}

body.campaign-landing-template-default header.egloo {
    position: absolute;
}

header.egloo[data-theme="dark"] {
    background-image: linear-gradient(to right, #330e5b 0%, #030105 25%, #030105 75%, #330e5b 100%);
}

body.single-news header.egloo[data-theme="dark"] + main {
    margin-top: var(--header-height);
}

header.egloo .header-bar {
    color: var(--c-white);
}

header.egloo ul[data-level="1"] > li > .item-title-wrapper > .item-title > span {
    cursor: default;
}

body.campaign-landing-template-default header.egloo #hamburger,
body.campaign-landing-template-default header.egloo .header-bar .main-menu {
    display: none !important;
}

@media (min-width: 900px) and (hover: hover) {
    header.egloo .container {
        position: relative;
    }

    header.egloo #hamburger {
        display: none;
    }

    header.egloo .header-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 2rem;
    }

    header.egloo .header-bar .logo {
        max-width: 13.3125rem;
    }

    header.egloo .header-bar .main-menu {
        background-color: rgb(255 255 255 / 0.16);
        border-radius: 999px;
    }

    header.egloo ul[data-level="1"] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 2.34375rem;
    }

    header.egloo ul[data-level="1"] > li > .item-title-wrapper {
        position: relative;
    }

    header.egloo ul[data-level="1"] > li > .item-title-wrapper .item-title a,
    header.egloo ul[data-level="1"] > li > .item-title-wrapper .item-title span {
        padding: 1.25rem;
        padding-bottom: 1.0625rem;
        font-size: 0.9375rem;
        text-transform: uppercase;
        display: flex;
        align-items: center;
    }

    header.egloo ul .item-title label.plus-wrapper {
        line-height: 0;
    }

    header.egloo ul .item-title label.plus-wrapper .plus {
        width: 1rem;
        height: 1rem;
        transition: rotate 0.2s ease;
    }

    header.egloo ul[data-level="1"] > li:first-child > .item-title-wrapper .item-title a,
    header.egloo ul[data-level="1"] > li:first-child > .item-title-wrapper .item-title span {
        padding-left: 3.125rem;
    }

    header.egloo ul[data-level="1"] > li:last-child > .item-title-wrapper .item-title a,
    header.egloo ul[data-level="1"] > li:last-child > .item-title-wrapper .item-title span {
        padding-right: 3.125rem;
    }

    header.egloo ul[data-level="1"] > li > .item-title-wrapper label {
        display: none;
    }

    header.egloo ul[data-level="1"] > li:where(:hover, :has(:focus-visible)) > .item-title-wrapper {
        color: var(--c-orange);
    }

    header.egloo ul[data-level="1"] > li[data-with-submenus="true"] > .item-title-wrapper::after {
        content: "";
        z-index: 1;
        position: absolute;
        top: 100%;
        height: 1.625rem;
        background-color: var(--c-white);
        width: 100%;
        left: 0;
        opacity: 0;
        pointer-events: none;
        transform-origin: bottom center;
        transform: scaleY(0);
        mask-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNiAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjE3NCAwLjgxMzIzMkwzNS40OTQ1IDE5LjU2MzJIMC44NTM1MTZMMTguMTc0IDAuODEzMjMyWiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==");
        mask-repeat: no-repeat;
        mask-position: bottom center;
        transition:
            transform 150ms ease-out 50ms,
            opacity 150ms ease-out;
    }

    header.egloo ul[data-level="1"] > li[data-with-submenus="true"]:where(:hover, :has(:focus-visible)) > .item-title-wrapper::after {
        pointer-events: auto;
        transform: scaleY(1);
        opacity: 1;
        transition:
            transform 150ms ease-in,
            opacity 150ms ease-in;
    }

    header.egloo ul[data-level="1"] > li:has(:focus-visible) > .item-title-wrapper {
        text-decoration: underline;
    }

    header.egloo .submenu-wrapper[data-level="2"] {
        position: absolute;
        top: calc(100% + 1.3125rem);
        width: fit-content;
        max-width: calc(100vw - var(--container-x-padding) - var(--container-x-padding));
        left: 50%;
        border-radius: 1.25rem;
        background-color: var(--c-white);
        border: 1px solid #c0c0c0;
        transform: translateX(-50%);
        color: var(--c-black);
        padding: 2.5rem 1.875rem 2.6875rem;
        transform-origin: top left;
        scale: 0.95;
        opacity: 0;
        pointer-events: none;
        transition:
            scale 150ms ease-out,
            opacity 150ms ease-out;
    }

    header.egloo .submenu-wrapper[data-level="2"] li[data-type] {
        width: 100vw;
    }

    /* if it has a li with type accordion
    * and it doesnt have any other li of other types
    * and it doesnt have .menu-wrapper
    */
    header.egloo .submenu-wrapper[data-level="2"]:has(li[data-type="accordions"]):not(:has(li:not([data-type="accordions"]))):not(:has(.menu-wrapper)) {
        padding-block: 2.5rem;
    }

    header.egloo .submenu-wrapper[data-level="2"]:has(li[data-type="accordions"]):not(:has(li:not([data-type="accordions"]))):not(:has(.menu-wrapper)) .item-title {
        padding-bottom: 0;
        border-bottom: 0;
    }

    header.egloo ul[data-level="1"] > li:where(:hover, :has(:focus-visible)) .submenu-wrapper[data-level="2"] {
        pointer-events: auto;
        scale: 1;
        opacity: 1;
        transition:
            scale 150ms ease-in,
            opacity 150ms ease-in;
    }

    header.egloo ul[data-level="2"] {
        display: flex;
        align-items: start;
        justify-content: space-between;
        gap: 1rem;
    }

    header.egloo ul[data-level="2"] > li {
        max-width: 20.625rem;
        flex-grow: 1;
    }

    header.egloo ul[data-level="2"] .item-title {
        font-weight: 700;
        color: var(--c-orange);
        padding-bottom: 1rem;
        border-bottom: 1px solid #dfdfdf;
    }

    header.egloo ul[data-level="2"] > li[data-type="image"] .img-wrapper {
        height: 9.375rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="image"] .description {
        font-size: 0.9375rem;
        line-height: 1.333333;
        color: var(--c-blue-purple);
        padding-block: 1rem;
        border-bottom: 1px solid #dfdfdf;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] .item-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] ul .item-title {
        border-bottom: none;
        padding-left: 0rem;
        padding-top: 1rem;
        font-weight: 400;
        font-size: 0.9375rem;
        line-height: 1.333333;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] :is(a, li, .item-title span) {
        text-box: trim-both cap alphabetic;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li {
        border-bottom: 1px solid #dfdfdf;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li:has(.item-title) > .menu-wrapper > ul > li {
        padding-left: 1.5625rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li > .menu-wrapper > ul > li {
        padding-block: 0.5rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li:not(:has(.item-title)) > .menu-wrapper > ul > li {
        line-height: 1;
        padding-block: 1rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li:not(:has(.item-title)) > .menu-wrapper > ul > li:not(:last-child) {
        border-bottom: 1px solid #dfdfdf;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li > .menu-wrapper > ul > li:first-child {
        padding-block-start: 0;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li:not(:has(.item-title)) > .menu-wrapper > ul > li:first-child {
        padding-block-start: 1rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li > .menu-wrapper > ul > li:last-child {
        padding-block-end: 1rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] > .menu-wrapper > ul > li:not(:has(.item-title)) > .menu-wrapper > ul > li:last-child {
        padding-block-end: 1rem;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] .item-title + .menu-wrapper {
        display: grid;
        grid-template-rows: 0fr;
        grid-template-rows: 1fr;
        /* overflow: hidden; */
        transition: grid-template-rows 0.3s ease;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] li:where(:hover, :focus-within) > .item-title .plus,
    header.egloo ul[data-level="2"] > li[data-type="accordions"]:where(:hover, :focus-within) > .item-title .plus {
        rotate: 45deg;
    }

    /* header.egloo ul[data-level="2"] > li[data-type="accordions"] li:where(:hover, :focus-within) > .item-title + .menu-wrapper, */
    /* header.egloo ul[data-level="2"] > li[data-type="accordions"]:where(:hover, :focus-within) > .item-title + .menu-wrapper { */
    /*     grid-template-rows: 1fr; */
    /* } */

    header.egloo .plus {
        display: none;
    }

    header.egloo ul[data-level="2"] > li[data-type="accordions"] .menu-wrapper > ul {
        min-height: 0;
    }
}

@media (max-width: 900px) or (hover: none) {
    body.menu-open {
        overflow: hidden;
    }

    header.egloo.open *,
    header.egloo.open {
        touch-action: none;
    }

    header.egloo {
        --_header-height: 5.0625rem;
        padding-block: 0.9375rem;
        transition: background-color background-image 0.2s ease;
    }

    header.egloo.open {
        background-color: #050612;
        background-image: none;
    }

    header.egloo .header-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 2rem;
    }

    header.egloo .header-bar button#hamburger {
        width: 2rem;
        height: 2rem;
        display: block;
    }

    header.egloo.open .header-bar button#hamburger .hamburger-icon,
    header.egloo:not(.open) .header-bar button#hamburger .close-icon {
        display: none;
    }

    header.egloo .header-bar .main-menu {
        position: fixed;
        --bg: #050612;
        --fg: var(--c-white);
        color: var(--fg);
        background-color: var(--bg);
        top: var(--_header-height);
        left: 0;
        width: 100%;
        height: calc(100% - var(--_header-height));
        pointer-events: none;
        translate: -100%;
        transition: translate 0.3s ease-in;
        padding-inline: var(--container-x-padding);
        padding-block: 0.5rem 3.125rem;
        overflow: auto;
        scrollbar-width: none;
        overscroll-behavior: none;
        z-index: 9;
    }

    header.egloo.open .header-bar .main-menu {
        pointer-events: auto;
        translate: 0;
        transition: translate 0.3s ease-out;
    }

    header.egloo .header-bar .main-menu,
    header.egloo .header-bar .main-menu * {
        touch-action: auto;
    }

    header.egloo .header-bar .main-menu .menu .item-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    header.egloo .header-bar .main-menu .menu .item-title .plus {
        width: 1rem;
        height: 1rem;
        display: block;
        transition: rotate 0.3s ease-in-out;
    }

    header.egloo .header-bar .main-menu .menu .submenu-wrapper {
        padding-left: 1.5rem;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] input:checked ~ .menu-wrapper,
    header.egloo .header-bar .main-menu .menu input:checked ~ .submenu-wrapper[data-level="2"] {
        grid-template-rows: 1fr;
        padding-block-end: 1rem;
    }

    header.egloo .header-bar .main-menu .menu input:checked ~ .item-title-wrapper .plus,
    header.egloo .header-bar .main-menu .menu input:checked ~ .item-title .plus {
        rotate: 45deg;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] .menu-wrapper,
    header.egloo .header-bar .main-menu .menu .submenu-wrapper[data-level="2"] {
        display: grid;
        grid-template-rows: 0fr;
        overflow: hidden;
        transition: grid-template-rows 0.3s ease;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] .menu-wrapper > ul,
    header.egloo .header-bar .main-menu .menu .submenu-wrapper[data-level="2"] > ul[data-level="2"] {
        min-height: 0;
    }

    header.egloo .header-bar .main-menu .menu ul[data-level="1"] > li > .item-title-wrapper > .item-title {
        padding-block: 0.5rem;
        font-size: 1.5rem;
    }

    header.egloo .header-bar .main-menu .menu ul[data-level="1"] > li:not(:first-child) > .item-title-wrapper > .item-title {
        border-block-start: 1px solid rgb(from var(--fg) r g b / 0.2);
    }

    header.egloo .header-bar .main-menu .menu ul[data-level="2"] > li > .item-title {
        padding-block: 0.5rem;
    }

    /*header.egloo .header-bar .main-menu .menu ul[data-level="2"] > li:last-child {
        padding-block-end: 1rem;
    }*/

    header.egloo .header-bar .main-menu .menu li[data-type="image"],
    header.egloo .header-bar .main-menu .menu li[data-type="empty"] {
        display: none;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="image"] .description {
        opacity: 0.85;
        line-height: 1.8;
        padding-left: 1.5rem;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] > .item-title {
        font-weight: 500;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] .menu-wrapper {
        padding-left: 1.5rem;
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] > .menu-wrapper ul li > .item-title {
        padding-block: 0.5rem;
        color: var(--c-orange);
    }

    header.egloo .header-bar .main-menu .menu li[data-type="accordions"] > .menu-wrapper ul li > .menu-wrapper li {
        padding-block: 0.5rem;
    }

    header.egloo .header-bar .main-menu .menu .plus-wrapper {
        flex-grow: 1;
        display: flex;
        justify-content: end;
        align-items: center;
    }
}

/* ======================================== */
/* HERO SIMPLE */
/* ======================================== */

section.hero.hero-simple .layers .layer-bg::after {
    height: 5rem;
    background-image: linear-gradient(transparent, #050612);
    bottom: 0;
    top: auto;
}

section.hero.hero-simple .layers .layer-bg .img-wrapper {
    height: 100%;
}

section.hero.hero-simple .layers .layer-fg {
    padding-block: 14.625rem 11.75rem;
    color: var(--c-white);
}

section.hero.hero-simple .layers .layer-fg .text {
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
    text-align: center;
    font-size: 1.875rem;
    line-height: 1.5;
}

section.hero.hero-simple .layers .layer-fg .text .subtitle {
    font-size: 1.875rem;
    line-height: 1.5;
    text-align: center;
}

@media (max-width: 768px) {
    section.hero.hero-simple .layers .layer-fg {
        padding-block: 7rem 3.125rem;
    }

    section.hero.hero-simple .layers .layer-fg .text {
        gap: 1rem;
    }

    section.hero.hero-simple .layers .layer-fg .text {
        font-size: 1.25rem;
    }

    section.hero.hero-simple .layers .layer-fg .text .title {
        font-size: 2rem;
    }
}

/* ======================================== */
/* CARD ARCHIVE */
/* ======================================== */

article.card.card-archive {
    color: var(--c-blue-purple);
    display: grid;
    grid-template-columns: [all-start] 1.4375rem [content-start] 1fr [content-end] 1.4375rem [all-end];
    position: relative;
    background-color: #f2f2f2;
}

@media (forced-colors: active) {
    article.card.card-archive {
        border: 1px solid CanvasText;
    }
}

article.card.card-archive:has(:focus-visible) {
    outline: 4px solid var(--fg);
    outline-offset: 4px;
}

article.card.card-archive a {
    outline: none;
}

article.card.card-archive a::after {
    content: "";
    inset: 0;
    position: absolute;
    z-index: 1;
}

article.card.card-archive > * {
    grid-column: content;
}

article.card.card-archive .img-wrapper {
    order: -1;
    height: 12.5rem;
    grid-column: all;
}

article.card.card-archive .title {
    color: var(--c-blue-purple);
    margin-block: 2.125rem;
    font-weight: 700;
}

article.card.card-archive:not(:has(.description)) .title {
    margin-block-end: 0;
}

article.card.card-archive .description {
    color: #707070;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

article.card.card-archive .cta {
    margin-top: 2.0625rem;
    padding-top: 1.375rem;
    border-top: 1px solid #b5b4b4;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 1.4375rem;
}

/* ======================================== */
/* ARCHIVE CARDS */
/* ======================================== */

section.archive-cards {
    padding-block: 5.625rem;
}

section.archive-cards .filters {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

section.archive-cards .filters #categories {
    display: flex;
    align-items: center;
    gap: 2.375rem;
}

section.archive-cards .filters #categories label {
    border: 2px solid transparent;
    border-radius: 999px;
    color: var(--c-orange);
    padding: 0.75rem 1.1875rem;
    transition: border-color 150ms ease-in-out;
}

section.archive-cards .filters #categories label:has(:focus-visible) {
    outline: 4px solid var(--fg);
    outline-offset: 4px;
}

section.archive-cards .filters #categories label:where(:has(:focus-visible), :hover) {
    font-weight: 900;
}

section.archive-cards .filters #categories label:has(input:checked) {
    border-color: var(--c-orange);
}

section.archive-cards .filters #search .input-wrapper {
    overflow: hidden;
    height: 3.375rem;
    width: 4.125rem;
    border-radius: 999px;
    border: 2px solid var(--c-orange);
    transition: width 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    justify-content: end;
    padding-right: 1.0625rem;
}

section.archive-cards .filters #search .input-wrapper .icon {
    flex-shrink: 0;
    width: 1.875rem;
    height: 1.875rem;
    color: var(--c-orange);
}

section.archive-cards .filters #search .input-wrapper:where(:focus-within, :hover, :not(:has(:placeholder-shown))) {
    width: 15.6875rem;
}

section.archive-cards .filters #search .input-wrapper input {
    width: 100%;
    border-radius: 9999px;
    height: 3.375rem;
    background-color: transparent;
    color: var(--fg);
    font-size: 1.125rem;
    padding-left: 1.5rem;
    border: none;
    outline: none;
}

section.archive-cards .filters #search .input-wrapper input::placeholder {
    color: var(--c-orange);
}

section.archive-cards .cards-wrapper {
    display: grid;
    --grid-item-width: 25rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    gap: 1.25rem;
    row-gap: 2.5rem;
    margin-block-start: 2.9375rem;
}

section.archive-cards .cards-wrapper p.empty {
    grid-column: -1/1;
    text-align: center;
}

section.archive-cards #eg-pagination {
    margin-block-start: 3.75rem;
}

@media (max-width: 768px) {
    section.archive-cards {
        padding-block: 3.125rem;
    }

    section.archive-cards .filters {
        row-gap: 1rem;
        flex-direction: column-reverse;
    }

    section.archive-cards .filters #search {
        align-self: end;
    }

    section.archive-cards .filters #categories {
        overflow: auto;
        scrollbar-width: none;
        position: relative;
        margin-inline: calc(-1 * var(--container-x-padding));
        padding-inline: var(--container-x-padding);
        width: calc(100% + var(--container-x-padding) + var(--container-x-padding));
        gap: 1rem;
    }

    section.archive-cards .filters #categories label {
        flex-shrink: 0;
    }

    section.archive-cards .cards-wrapper {
        row-gap: 1rem;
    }

    section.archive-cards #eg-pagination {
        margin-top: 2rem;
    }
}

/* ============================ */
/* EG PAGINATION */
/* ============================ */

#eg-pagination {
    display: flex;
    gap: 1rem;
    justify-content: center;
    align-items: center;
}

#eg-pagination[aria-hidden="true"] {
    display: none;
}

#eg-pagination .page-btn:disabled,
#eg-pagination .page-separator {
    opacity: 0.4;
}

#eg-pagination .page.page-current {
    color: var(--c-orange);
    font-weight: 700;
}

#eg-pagination .page-btn {
    line-height: 0;
    color: var(--c-orange);
}

#eg-pagination .page-btn svg {
    width: 1.5rem;
    height: 1.5rem;
}

#eg-pagination .page-btn.page-btn-next {
    margin-left: 0.3125rem;
}

#eg-pagination .page-btn.page-btn-prev {
    margin-right: 0.3125rem;
}

#eg-pagination .page-btn.page-btn-prev svg {
    rotate: 180deg;
}

#eg-pagination :disabled {
    pointer-events: none;
}

/* ======================================== */
/* CONTENT BLOCKS */
/* ======================================== */

article.content-blocks {
    --_space-y: 5.625rem;
    --_space-y-small: 3.125rem;
}

article.content-blocks .block[data-name="iframe"],
article.content-blocks .block[data-name="img"],
article.content-blocks .block[data-name="text"][data-background="default"] {
    margin-block: var(--_space-y);
}

article.content-blocks .block[data-name="text"]:not([data-background="default"]) {
    padding-block: var(--_space-y);
}

article.content-blocks .block[data-name="text"] {
    --_title-color: var(--c-orange);
    --_body-color: var(--c-blue-purple);

    color: var(--_body-color);
}

article.content-blocks .block[data-background="gray"] {
    background-color: #edf1f3;
}

article.content-blocks .block[data-background="orange"] {
    background-color: var(--c-orange);
    --_title-color: var(--c-white);
    --_body-color: var(--c-white);
}

article.content-blocks .block:not([data-background="default"]) + .block:not([data-background="default"]) {
    padding-block-start: 0;
}

article.content-blocks .block[data-name="text"][data-text-align="center"] .text {
    text-align: center;
}

article.content-blocks .block[data-name="text"][data-text-align="center"] .text :is(ul, ol) {
    list-style-position: inside;
}

article.content-blocks .block[data-name="text"] .text {
    display: grid;
    gap: 2.25rem;
}

article.content-blocks .block[data-name="text"] .text .title {
    font-weight: 300;
    color: var(--_title-color);
}

article.content-blocks .block[data-name="text"][data-title-size="large"] .text .title {
    font-size: 2.5rem;
    line-height: 1.25;
    font-weight: 400;
}

article.content-blocks .block[data-name="text"][data-img-side] .container {
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    row-gap: var(--_space-y-small);
}

article.content-blocks .block[data-name="text"][data-img-side] figure {
    flex-grow: 1;
}

article.content-blocks .block[data-name="text"][data-img-side] .text {
    flex-basis: 40ch;
    flex-grow: 99999;
}

article.content-blocks .block[data-name="text"][data-img-side="right"] .container figure {
    order: 1;
}

article.content-blocks .block[data-name="text"][data-img-side="left"] figure {
    order: -1;
}

article.content-blocks .block[data-name="text"][data-img-size="large"] .container {
    column-gap: 2.3125rem;
}

article.content-blocks .block[data-name="text"][data-img-size="small"] .container {
    column-gap: 1.25rem;
}

article.content-blocks .block[data-name="text"][data-img-size="large"] figure {
    flex-basis: 35.25rem;
}

article.content-blocks .block[data-name="text"][data-img-size="small"] figure {
    flex-basis: 13.4375rem;
}

article.content-blocks .block[data-name="text"] figure figcaption {
    font-size: 0.75rem;
    line-height: 1.5;
    margin-top: 0.75rem;
    letter-spacing: -0.1px;
}

article.content-blocks .block[data-name="img"] .img-wrapper {
    max-height: 36.25rem;
    margin-inline: auto;
}

article.content-blocks .block[data-name="iframe"] .img-wrapper {
    height: auto;
}

article.content-blocks .block[data-name="gallery"] {
    margin-block: var(--_space-y);
}

article.content-blocks .block[data-name="gallery"] .container {
    display: grid;
    gap: 3.75rem;
}

article.content-blocks .block[data-name="gallery"] .title {
    color: var(--c-orange);
    font-weight: 300;
}

article.content-blocks .block[data-name="gallery"] .gallery {
    display: grid;
    --grid-item-width: 14.75rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    row-gap: 1.25rem;
    column-gap: 6.25rem;
}

article.content-blocks .block[data-name="interview"] .container {
    margin-block: var(--_space-y-small) var(--_space-y);
    display: grid;
    gap: 4.5625rem;
}

article.content-blocks .block[data-name="interview"] .introduction {
    display: flex;
    align-items: start;
    gap: 3.625rem;
    flex-wrap: wrap;
}

article.content-blocks .block[data-name="interview"] .introduction .text-wrapper {
    flex-grow: 9999999;
    flex-basis: 31.25rem;
}

article.content-blocks .block[data-name="interview"] .introduction .text-wrapper .single-question {
    margin-top: 2.25rem;
}

article.content-blocks .block[data-name="interview"] .introduction .text-wrapper .title {
    font-size: 2.1875rem;
    line-height: 1.142857;
    font-weight: 300;
    color: var(--c-orange);
    margin-bottom: 0.6em;
}

article.content-blocks .block[data-name="interview"] .introduction .text-wrapper .description {
    font-size: 1.75rem;
    line-height: 1.428571429;
    font-weight: 300;
    color: var(--c-orange);
}

article.content-blocks .block[data-name="interview"] .introduction figure {
    flex-basis: 13.375rem;
    flex-grow: 1;
}

article.content-blocks .block[data-name="interview"] .introduction figure figcaption {
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.5;
    margin-top: 0.75rem;
    letter-spacing: -0.1px;
}

article.content-blocks .block[data-name="interview"] .container .questions {
    display: grid;
    --grid-item-width: 99999rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    row-gap: 3.125rem;
    column-gap: 1.25rem;
}

article.content-blocks .block[data-name="interview"] .container .single-question[data-layout="wide"] {
    grid-column: -1/1;
}

article.content-blocks .block[data-name="interview"] .container .single-question {
    display: flex;
    flex-direction: column;
    gap: 2.25rem;
}

article.content-blocks .block[data-name="interview"] .container .single-question .question {
    font-size: 2.1875rem;
    line-height: 1.142857;
    font-weight: 300;
    color: var(--c-orange);
}

@media (max-width: 768px) {
    article.content-blocks {
        --_space-y: 3.125rem;
        --_space-y-small: 3.125rem;
    }

    article.content-blocks .block[data-name="interview"] .container {
        gap: 3.125rem;
    }

    article.content-blocks .block[data-name="interview"] .introduction .text-wrapper .description {
        font-size: 1.5rem;
    }

    article.content-blocks .block[data-name="interview"] .introduction .text-wrapper .title,
    article.content-blocks .block[data-name="interview"] .container .single-question .question {
        font-size: 1.75rem;
    }

    article.content-blocks .block[data-name="interview"] .container .single-question {
        gap: 1.5rem;
    }

    article.content-blocks .block[data-name="interview"] figure .img-wrapper {
        max-width: 10rem;
        margin-inline: auto;
    }

    article.content-blocks .block[data-name="gallery"] .gallery {
        column-gap: var(--container-gap);
        row-gap: var(--container-gap);
        --grid-item-width: 7rem;
    }
}

/* ======================================== */
/* CONTENT BLOCKS BAR */
/* ======================================== */

section.content-blocks-bar {
    background-image: linear-gradient(to right, #330e5b 0%, #030105 25%, #030105 75%, #330e5b 100%);
    font-size: 0.9375rem;
    line-height: 1;
    color: var(--c-white);
    position: sticky;
    top: var(--header-height);
    z-index: var(--z-content-blocks-bar);
}

section.content-blocks-bar ul {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

section.content-blocks-bar ul a {
    display: inline-block;
    padding-block: 1.375rem 1.4375rem;
    transition: color 0.15s ease;
}

section.content-blocks-bar ul a:hover {
    color: var(--c-orange);
}

section.content-blocks-bar ul a:focus-visible {
    outline: 4px solid var(--c-orange);
    outline-offset: 4px;
}

@media (max-width: 768px) {
    section.content-blocks-bar {
        display: none;
    }
}

/* ======================================== */
/* BANNER SIMPLE */
/* ======================================== */

section.banner.banner-simple {
    --fg: var(--c-white);
    background: radial-gradient(ellipse at 300% -200%, #9634ff, #060612);
}

section.banner.banner-simple .layer-bg::after {
    height: 100%;
    background-image: linear-gradient(#0036bc, #4b00bc);
    opacity: 0.81;
    mix-blend-mode: color;
}

section.banner.banner-simple .layer-bg .img-wrapper {
    height: 100%;
}

section.banner.banner-simple .layer-bg .img-wrapper video {
    object-position: 0% 79%;
}

section.banner.banner-simple .text {
    padding-block: 5.625rem;
    display: flex;
    flex-direction: column;
    gap: 3.375rem;
    text-align: center;
    align-items: center;
    color: var(--c-white);
}

@media (max-width: 768px) {
    section.banner.banner-simple .text {
        padding-block: 3.125rem;
    }

    section.banner.banner-simple .text .title {
        font-size: 2rem;
    }
}

/* ======================================== */
/* HERO IMG DATE */
/* ======================================== */

section.hero.hero-img-date {
    padding-block-start: 4.25rem;
}

section.hero.hero-img-date .container {
    display: flex;
    flex-direction: column;
}

section.hero.hero-img-date .container .text {
    display: flex;
    flex-direction: column-reverse;
    gap: 1.5rem;
}

section.hero.hero-img-date .container .text time {
    color: var(--c-orange);
}

section.hero.hero-img-date .thumbnail {
    margin-top: 5.625rem;
}

section.hero.hero-img-date .container .img-wrapper {
    height: 33.4375rem;
}

section.hero.hero-img-date[data-thumbnail-size="fullscreen"] .img-wrapper {
    height: 28.125rem;
}

section.hero.hero-img-date .container .img-wrapper img {
    width: auto;
    height: 100%;
    margin-inline: auto;
}

@media (max-width: 768px) {
    section.hero.hero-img-date {
        padding-block-start: 3.125rem;
    }
    section.hero.hero-img-date .thumbnail {
        margin-top: 3.125rem;
    }
}

/* ======================================== */
/* CARDS-SLIDER */
/* ======================================== */

section.cards-slider {
    padding-block: 5.625rem;
}

section.cards-slider .container {
    display: flex;
    flex-direction: column;
    gap: 4.5625rem;
}

section.cards-slider .container .top .title {
    text-align: center;
    text-wrap: balance;
}

section.cards-slider .bottom {
    position: relative;
}

section.cards-slider .controls {
    --_x-offset: 3rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: calc(100% + (2 * var(--_x-offset)));
    width: min(100% + (2 * var(--_x-offset)), 100vw - (2 * var(--container-x-padding)));
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    pointer-events: none;
}

section.cards-slider .controls button {
    pointer-events: auto;
    line-height: 0;
}

@media (max-width: 768px) {
    section.cards-slider {
        padding-block: 3.125rem;
        overflow: hidden;
    }

    section.cards-slider .top .title {
        font-size: 1.6rem;
    }

    section.cards-slider .container {
        gap: 2rem;
    }

    section.cards-slider .controls {
        display: none;
    }

    section.cards-slider .swiper {
        overflow: visible;
    }
}

/* ======================================== */
/* TEXT BLOCK */
/* ======================================== */

section.text-block {
    margin-block: 5.625rem;
}

section.text-block[data-img="true"] .container {
    display: flex;
    gap: 5.75rem;
}

section.text-block .container .text {
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
    flex-grow: 99999;
    flex-basis: 40rem;
}

section.text-block .container .text .btn {
    width: fit-content;
    margin-inline: auto;
}

section.text-block .container[data-img="false"] .text {
    align-items: center;
}

section.text-block .container .text p {
    text-box: trim-both cap alphabetic;
}

section.text-block[data-img="false"] .container .text {
    text-align: center;
}

section.text-block[data-img-size="small"] .container .img-wrapper {
    flex-basis: 16.125rem;
    width: 100%;
    flex-grow: 1;
}

@media (max-width: 768px) {
    section.text-block {
        margin-block: 3.125rem;
    }
    section.text-block .container .text {
        gap: 2rem;
        flex-basis: auto;
    }

    section.text-block[data-img="true"] .container {
        gap: 2rem;
        flex-direction: column-reverse;
    }

    section.text-block[data-img-size="small"] .container .img-wrapper {
        flex-basis: auto;
        max-width: 10rem;
    }
}

/* ======================================== */
/* ICON TABS */
/* ======================================== */

section.icon-tabs {
    padding-block: 5.625rem;
    overflow: hidden;
    position: relative;
}

section.icon-tabs::before,
section.icon-tabs::after {
    content: "";
    width: 1577px;
    height: 1577px;
    background-image: radial-gradient(closest-side, rgb(150 52 255 / 0.38), transparent);
    position: absolute;
}

section.icon-tabs::after {
    right: -788.5px;
    top: -9.5rem;
}

section.icon-tabs::before {
    left: -788.5px;
    top: -26.3125rem;
}

section.icon-tabs .zones {
    display: grid;
    gap: 3.75rem;
    position: relative;
    z-index: 1;
}

section.icon-tabs .zones .zone-title {
    text-align: center;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button {
    flex-basis: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    flex-grow: 1;
    position: relative;
    padding-bottom: 1rem;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button[aria-selected="true"]::after {
    content: "";
    view-transition-name: tab-arrow;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzUiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAzNSAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3LjQwODQgMC40MTcyMzZMMzQuNzI4OSAxOS4xNjcyTDAuMDg3ODkwNiAxOS4xNjcyTDE3LjQwODQgMC40MTcyMzZaIiBmaWxsPSIjRTk0RjFDIi8+Cjwvc3ZnPgo=");
    height: 1.171875rem;
    width: 2.165rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(-100%);
    top: calc(100%);
}

section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button .title {
    line-height: 1.9;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button[aria-selected="false"]:focus-visible .icon,
section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button[aria-selected="false"]:not(:focus-visible) .icon-active,
section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button[aria-selected="true"] .icon {
    display: none;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"]:not([hidden]) {
    border-block: 2px solid var(--c-orange);
    text-align: center;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"] .text {
    margin-block: 3.125rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: center;
    gap: 0.3125rem;
}

section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"] .text h3 {
    font-size: 1.875rem;
    color: var(--c-orange);
}

section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"] .text .btn {
    margin-top: 1.375rem;
}

@media (max-width: 768px) {
    section.icon-tabs {
        padding-block: 3.125rem;
    }

    section.icon-tabs .zones {
        gap: 2rem;
    }

    section.icon-tabs .zones .zone-title {
        text-align: left;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        margin-bottom: 2rem;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button {
        width: 100%;
        display: flex;
        flex-direction: row;
        gap: 1rem;
        text-align: left;
        padding-bottom: 0;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button :is(.icon, .icon-active) {
        width: 3rem;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tablist"] button[aria-selected="true"]::after {
        content: initial;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"] .text {
        margin-block: 2rem;
        text-align: left;
        align-items: start;
    }

    section.icon-tabs .zones .zone-tabs .tabs [role="tabpanel"] .text h3 {
        font-size: 1.6rem;
    }
}

/* ======================================== */
/* NUMBERS DATA */
/* ======================================== */

section.numbers-data .layer-fg {
    padding-block: 5.625rem;
}

section.numbers-data .layer-bg .img-wrapper {
    height: 100%;
}

section.numbers-data .zones {
    display: grid;
    gap: 5.625rem;
}

section.numbers-data .zones .zone-title {
    text-align: center;
}

section.numbers-data .zones .zone-numbers {
    row-gap: 5.625rem;
    column-gap: 1rem;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

section.numbers-data .zones .zone-numbers .item {
    font-size: 2.1875rem;
    line-height: 1.142857;
    flex-basis: 25rem;
}

section.numbers-data .zones .zone-numbers .item .is-number {
    font-size: 3.125rem;
    line-height: 0.8;
}

@media (max-width: 768px) {
    section.numbers-data .layer-fg {
        padding-block: 3.125rem;
    }

    section.numbers-data .zones {
        gap: 2rem;
    }

    section.numbers-data .zones .zone-numbers .item {
        font-size: 1.25rem;
    }

    section.numbers-data .zones .zone-numbers .item .is-number {
        font-size: 1.8rem;
    }

    section.numbers-data .zones .zone-numbers {
        row-gap: 2.5rem;
        --grid-item-width: 10rem;
    }
}

/* ======================================== */
/* TEAM SLIDER */
/* ======================================== */

section.team-slider {
    margin-block: 5.625rem;
}

section.team-slider .zones {
    display: grid;
    gap: 3.75rem;
}

section.team-slider .zones .zone.zone-title .container {
    text-align: center;
    display: grid;
    gap: 3.125rem;
}

section.team-slider .zones .zone.zone-slider .swiper {
    width: 0;
    min-width: 100%;
}

section.team-slider .zones .zone.zone-slider .container {
    position: relative;
}

section.team-slider .zones .zone.zone-slider .controls {
    --_x-offset: 3rem;
    color: var(--c-orange);
    position: absolute;
    top: 7.8125rem;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: calc(100% + (2 * var(--_x-offset)));
    width: min(100% + (2 * var(--_x-offset)), 100vw - (2 * var(--container-x-padding)));
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    pointer-events: none;
}

section.team-slider .zones .zone.zone-slider .controls button {
    pointer-events: auto;
    line-height: 0;
}

@media (max-width: 768px) {
    section.team-slider {
        margin-block: 3.125rem;
    }

    section.team-slider .zones .zone.zone-title .container {
        gap: 2rem;
    }

    section.team-slider .zones {
        gap: 2rem;
    }
}

/* ======================================== */
/* CARD EMPLOYEE */
/* ======================================== */

article.card.card-employee {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
}

article.card.card-employee .name {
    font-size: 1.5625rem;
    line-height: 1.2;
    margin-bottom: 1.8125rem;
}

article.card.card-employee .job {
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.5;
}

article.card.card-employee .link {
    color: #0a66c2;
    text-decoration: underline;
    font-size: 1.25rem;
    line-height: 1.5;
}

article.card.card-employee .img-wrapper {
    width: 100%;
    max-width: 15.625rem;
    aspect-ratio: 1/1;
    border-radius: 9999px;
    height: auto;
    order: -1;
    margin-bottom: 1.25rem;
}

/* ======================================== */
/* HERO PRODUCT */
/* ======================================== */

body.campaign-landing-template-default section.hero.hero-product.bg-dark {
    background-color: transparent;
}

@media only screen and (min-width: 768px) {
    body.campaign-landing-template-default section.hero.hero-product .layer-bg .img-wrapper img {
        object-fit: contain;
        object-position: right;
        max-width: 50%;
        margin-left: auto;
    }
}

section.hero.hero-product .layer-bg .img-wrapper {
    height: 100%;
}

section.hero.hero-product .layer-fg {
    padding-block: 12.625rem 7.4375rem;
}

section.hero.hero-product .layer-fg .text {
    max-width: 46.5rem;
    display: grid;
    gap: 3.875rem;
}

section.hero.hero-product .layer-fg .text .description {
    font-size: 1.875rem;
}

@media (max-width: 768px) {
    section.hero.hero-product .layer-bg::after {
        background-image: linear-gradient(transparent, #000000bf);
        background-image: url(/wp-content/uploads/2025/07/Fondo-scuro-2.webp);
        background-position: bottom center;
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    body section.hero.hero-video .layers .layer-fg {
        padding-top: 10.5625rem;
    }
    section.hero.hero-product .layer-bg img {
        object-position: 80%;
    }
    section.hero.hero-product .layer-fg {
        padding-block: 3.125rem 3.125rem;
        min-height: 50vh;
        min-height: 20rem;
    }

    section.hero.hero-product .layer-fg .container {
        height: 100%;
    }

    section.hero.hero-product .layer-fg .text {
        height: 100%;
        gap: 2rem;
        align-content: end;
    }

    section.hero.hero-product .layer-fg .text .description {
        font-size: 1.2rem;
    }
}

/* ======================================== */
/* HERO PRODUCT 2 */
/* ======================================== */

section.hero-product-2 .layer-bg .img-wrapper {
    height: 100%;
}

section.hero-product-2 .layer-fg .container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: end;
    padding-top: 3rem;
    min-height: 33.125rem;
}

section.hero-product-2 .layer-fg .text {
    align-self: center;
    max-width: 46.5rem;
    display: grid;
    gap: 3.875rem;
}

section.hero-product-2 .layer-fg .description {
    font-size: 1.875rem;
}

section.hero-product-2 .layer-fg .images-wrapper .layers {
    place-items: center;
}

section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-bg {
    align-self: end;
    display: grid;
    align-items: end;
    height: 100%;
}

section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-bg img {
    height: calc(100% - var(--header-height) + 12%);
    object-fit: contain;
    object-position: bottom;
}

section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-fg {
    padding-block: var(--header-height) 0;
}

section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-fg img {
    max-height: 22.5rem;
}

body.postid-514 section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-fg img {
    max-height: 17rem;
}

body.postid-541 section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-fg img,
body.tax-eg-product-category.term-passive section.hero-product-2 .layer-fg .images-wrapper .layers > .layer-fg img {
    max-height: 20.5rem;
}

@media only screen and (max-width: 768px) {
    section.hero-product-2 > .layers > .layer-bg img {
        object-fit: fill;
    }

    section.hero-product-2 .layer-fg .container {
        display: flex;
        flex-direction: column-reverse;
        padding-block: 17rem 4rem;
        gap: 2rem;
        min-height: unset;
    }

    section.hero-product-2 .layer-fg .images-wrapper {
        display: none;
    }

    section.hero.hero-product-2 .layer-fg .text {
/*         height: 100%; */
        gap: 1.5rem;
        align-content: end;
    }

    section.hero.hero-product-2 .layer-fg .text .description {
        font-size: 1.2rem;
    }
}

/* ======================================== */
/* PRODUCT INTRODUCTION */
/* ======================================== */

section.product-introduction .zones .zone-title {
    margin-bottom: 5.3125rem;
    padding-top: 5.3125rem;
    text-align: center;
}

section.product-introduction .zones .zone-light {
    margin-block: 5.625rem;
}

section.product-introduction .zones .zone-light .container {
    display: flex;
    gap: 1.625rem;
}

section.product-introduction .zones .zone-light .container .text {
    align-items: center;
    flex-basis: 27.4375rem;
    flex-grow: 1;
    display: grid;
    gap: 2.875rem;
}

section.product-introduction .zones .zone-light .container .text .title {
    color: var(--c-orange);
    font-size: 2.1875rem;
    line-height: 1.25;
}

section.product-introduction .zones .zone-light .container .img-wrapper {
    flex-grow: 999999999;
    flex-basis: 42.375rem;
    height: auto;
    min-height: 18.75rem;
}

section.product-introduction .zones .zone-gray {
    background-color: #edf1f3;
    padding-block: 5.625rem;
    text-align: center;
}

section.product-introduction .zones .zone-gray .container {
    display: grid;
    gap: 5.625rem;
}

section.product-introduction .zones .zone-gray .container .mini-banner {
    display: grid;
    gap: 2.5rem;
}

body.campaign-landing-template-default section.product-introduction .zones .zone-gray {
    padding-block: 3.125rem;
}

body.campaign-landing-template-default section.product-introduction .zones .zone-gray .container {
    gap: 3.125rem;
}

body.campaign-landing-template-default section.product-introduction .zones .zone-light {
    margin-block: 3.5rem 3.125rem;
}

body.campaign-landing-template-default section.product-introduction .zones .zone-title {
    margin-bottom: 3.125rem;
}

@media (max-width: 768px) {
    section.product-introduction .zones .zone-light {
        margin-block: 3.125rem;
    }
    section.product-introduction .zones .zone-gray {
        padding-block: 3.125rem;
    }

    section.product-introduction .zones .zone-gray .container {
        gap: 2rem;
    }

    section.product-introduction .zones .zone-gray .container .title {
        font-size: 1.8rem;
    }

    section.product-introduction .zones .zone-title {
        margin-bottom: 3.125rem;
        padding-left: 2rem;
        padding-right: 2rem;
        padding-top: 3.125rem;
    }

    section.product-introduction .zones .zone-light .container {
        display: flex;
        flex-direction: column-reverse;
        gap: 2rem;
    }

    section.product-introduction .zones .zone-light .container .img-wrapper {
        min-height: unset;
        flex-basis: auto;
    }

    section.product-introduction .zones .zone-light .container .img-wrapper img {
        position: relative;
    }

    section.product-introduction .zones .zone-light .container .text {
        gap: 2rem;
        flex-basis: auto;
    }
}

/* ======================================== */
/* PRODUCT FEATURES */
/* ======================================== */

section.product-features {
    background-color: rgb(5 6 18 / 1);
    padding-block: 5.625rem;
    text-align: center;
    overflow: hidden;
    isolation: isolate;
    position: relative;
}

section.product-features::after {
    content: "";
    z-index: -1;
    width: 1577px;
    height: 1577px;
    background-image: radial-gradient(closest-side, rgb(150 52 255 / 0.38), transparent);
    position: absolute;
    top: -474px;
    left: -694px;
}

section.product-features .title {
    margin-bottom: 3.125rem;
}

section.product-features .img-wrapper {
    max-width: 59.1875rem;
    margin-inline: auto;
    margin-block: 2.8125rem;
}

body.tax-eg-product-category section.product-features .img-wrapper {
    max-width: 25rem;
}

section.product-features .btn {
    margin-block-start: 3.25rem;
}

@media (max-width: 768px) {
    section.product-features {
        padding-block: 3.125rem;
    }
    section.product-features .img-wrapper,
    section.product-features .title {
        margin-bottom: 2rem;
    }
}

/* ======================================== */
/* ICON TEXTS */
/* ======================================== */

section.icon-texts {
    padding-block: 5.625rem;
    isolation: isolate;
    background-image: url(assets/img/bg-dots.webp);
}

section.icon-texts .zones {
    display: grid;
    gap: 4.8125rem;
}

section.icon-texts .zones .zone.zone-title {
    text-align: center;
}

section.icon-texts .zones .zone.zone-icons {
    display: grid;
    --grid-item-width: 25rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    column-gap: 2.3125rem;
    row-gap: 3.125rem;
}

section.icon-texts .zones .zone.zone-icons:not(:has(.description)) {
    --grid-item-width: 18rem;
}

section.icon-texts .zones .zone.zone-icons .icon {
    display: flex;
    align-items: start;
    flex-direction: row-reverse;
    gap: 1.375rem;
}

section.icon-texts .zones .zone.zone-icons .icon:not(:has(.description)) {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    text-align: center;
}

section.icon-texts .zones .zone.zone-icons .icon .text {
    display: grid;
    gap: 1.0625rem;
}

section.icon-texts .zones .zone.zone-icons .icon .text .title {
    font-size: 2.125rem;
}

section.icon-texts .zones .zone.zone-icons .icon .text .description {
    font-size: 1rem;
    line-height: 1.5;
}

section.icon-texts .zones .zone.zone-icons .icon .img-wrapper {
    height: 6rem;
    width: 6rem;
    flex-shrink: 0;
}

section.icon-texts .zones .zone.zone-cta {
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    section.icon-texts {
        padding-block: 3.125rem;
    }

    section.icon-texts .zones {
        gap: 2rem;
    }

    section.icon-texts .zones .zone.zone-icons {
        row-gap: 2rem;
    }

    section.icon-texts .zones .zone.zone-icons .icon .text .title {
        font-size: 1.5rem;
    }

    section.icon-texts .zones .zone.zone-icons .icon {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
    }

    section.icon-texts .zones .zone.zone-icons .icon .img-wrapper {
        width: 4rem;
        height: 4rem;
        margin-bottom: -0.6rem;
    }

    section.icon-texts .zones .zone.zone-icons:not(:has(.description)) {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    section.icon-texts .zones .zone.zone-icons .icon:not(:has(.description)) {
        justify-content: start;
    }
}

/* ======================================== */
/* PRODUCT SPECS */
/* ======================================== */

section.product-specs {
    margin-block: 5.625rem;
    scroll-margin: 5.625rem;
}

section.product-specs .zones {
    display: grid;
    gap: 4.6875rem;
}

section.product-specs .zones .zone.zone-title {
    text-align: center;
}

section.product-specs .zone-specs .container {
    display: grid;
    grid-template-columns: 7fr 5fr;
    column-gap: var(--container-gap);
    grid-template-areas:
        "table graph"
        "footnotes cta";
}

section.product-specs .zone-specs .container table {
    grid-area: table;
    border-collapse: collapse;
}

section.product-specs .zone-specs .container table th {
    padding-right: 1.25rem;
    vertical-align: top;
}

section.product-specs .zone-specs .container table td,
section.product-specs .zone-specs .container table th {
    padding-top: 1rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #b5b4b4;
}

section.product-specs .zone-specs .container table th {
    font-size: 1.875rem;
    line-height: 1.333333;
    color: var(--c-orange);
    font-weight: 300;
    text-align: start;
}

section.product-specs .zone-specs .container table th sup {
    font-size: 0.7em;
}

section.product-specs .zone-specs .container .footnotes {
    grid-area: footnotes;
    font-size: 0.875rem;
    line-height: 1.5;
    padding-top: 1.0625rem;
}

section.product-specs .zone-specs .container .graph {
    grid-area: graph;
}

section.product-specs .zone-specs .container .graph .img-wrapper {
    max-width: 29.0625rem;
    margin-inline: auto;
}

section.product-specs .zone-specs .container .cta-wrapper {
    grid-area: cta;
    padding-top: 1.375rem;
    display: flex;
    align-items: center;
    flex-direction: column;
    border-top: 1px solid #b5b4b4;
    margin-top: -0.0625rem;
}

@media (max-width: 768px) {
    section.product-specs .zone-specs .container {
        grid-template-columns: 1fr;
        grid-template-areas:
            "graph"
            "table"
            "footnotes"
            "cta";
        row-gap: 2rem;
    }

    section.product-specs {
        margin-block: 3.125rem;
    }

    section.product-specs .zones {
        gap: 2rem;
    }

    section.product-specs .zone-specs .container table th {
        padding-right: 1rem;
    }

    section.product-specs .zone-specs .container table th {
        font-size: 1rem;
    }

    section.product-specs .zone-specs .container .footnotes {
        padding-top: 0;
    }

    section.product-specs .zone-specs .container .cta-wrapper {
        padding-top: 2rem;
    }
}

/* ======================================== */
/* FOOTER */
/* ======================================== */

footer {
    background-color: var(--c-teal);
    color: white;
    font-size: 1.125rem;
    padding: 1.625rem 0 3.125rem 0;
}

footer .content-wrap {
    display: flex;
    gap: 4.9375rem;
    align-items: flex-end;
}

footer .content-wrap .logo .img-wrap img {
    max-width: 10.9rem;
}

footer .content-wrap .logo .address-wrap {
    font-size: 0.9375rem;
    margin-top: 0.625rem;
    font-weight: 300;
}

footer .content-wrap .quick-links {
    flex-grow: 1;
}

footer .content-wrap .quick-links .links-wrap ul {
    display: flex;
    gap: 3.625rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

body.campaign-landing-template-default footer .content-wrap .quick-links {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: end;
}

body.campaign-landing-template-default footer .content-wrap .quick-links .social-wrap {
    margin-top: 0;
}

body.campaign-landing-template-default footer .content-wrap .quick-links .links-wrap ul li:not(:last-child) {
    display: none;
}

footer .content-wrap .quick-links .socials-wrap {
    display: flex;
    gap: 1.5rem;
    justify-content: flex-end;
    margin-top: 1rem;
}

footer .content-wrap .quick-links .socials-wrap img {
    width: 1.6875rem;
}

@media (max-width: 768px) {
    footer {
        padding-block: 3.125rem 6.25rem;
    }

    footer .content-wrap {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: 2rem;
    }

    footer .content-wrap .quick-links .links-wrap ul {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    footer .content-wrap .quick-links .socials-wrap {
        justify-content: start;
        margin-top: 1rem;
    }

    footer .content-wrap .quick-links .socials-wrap img {
        width: 2.5rem;
    }
}

/* ======================================== */
/* LOGIN */
/* ======================================== */

section.login {
    position: relative;
    color: white;
    padding-top: 12.125rem;
    padding-bottom: 5.625rem;
}

section.login .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

section.login .bg-img img {
    height: 100%;
    object-fit: cover;
}

section.login .content-wrap {
    position: relative;
    text-align: center;
}

section.login .content-wrap .title {
    margin-bottom: 2rem;
}

section.login .content-wrap .title,
section.login .content-wrap .subtitle {
    font-size: 1.25rem;
}

section.login .content-wrap .login-form {
    max-width: 20.625rem;
    margin: 3.5rem auto 5.625rem auto;
}

section.login .content-wrap .login-form form p.username {
    margin-bottom: 1.5rem;
}

section.login .content-wrap .login-form form p:not(.submit) {
    display: grid;
    text-align: left;
    gap: 0.2rem;
}

section.login .content-wrap .login-form form p.submit {
    margin-top: 3.125rem;
}

section.login .content-wrap .login-form form input {
    color: var(--fg);
    border: 1px solid var(--c-orange);
    border-radius: 4px;
    height: 2.5rem;
    padding: 0.75rem;
}

section.login .content-wrap .login-form form .cp-error {
    color: var(--c-orange);
    margin-bottom: 2.2rem;
}

/* ======================================== */
/* HERO LEFT */
/* ======================================== */

section.hero.hero-left .layers .layer-bg .img-wrapper {
    height: 100%;
}

section.hero.hero-left .layers .layer-fg {
    padding-block: 12.375rem 7.5rem;
    color: var(--c-white);
}

section.hero.hero-left .layers .layer-fg .text {
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
    font-size: 1.875rem;
    line-height: 1.5;
    max-width: 34.375rem;
}

/* ======================================== */
/* ARCHIVE CUSTOMER PORTAL */
/* ======================================== */

section.archive-cp-intro {
    padding-block: 5.875rem;
}

section.archive-cp-intro .text-wrap {
    max-width: 44.125rem;
    margin: 0 auto;
    font-size: 1.25rem;
    line-height: 1.5;
    text-align: center;
}

section.archive-cp-posts .posts-wrap {
    display: grid;
    --grid-item-width: 34.375rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    gap: 2.5rem;
    margin-bottom: 5.875rem;
}

section.archive-cp-posts .posts-wrap:has(> :nth-child(3):last-child) {
    --grid-item-width: 24rem;
}

@media (max-width: 768px) {
    section.archive-cp-intro {
        padding-block: 3.125rem;
    }

    section.archive-cp-posts .posts-wrap {
        margin-bottom: 3.125rem;
        gap: var(--container-x-padding);
    }
}

/* ======================================== */
/* CARD PRODUCT */
/* ======================================== */

article.card.card-product {
    display: grid;
    grid-template-columns: [all-start] 1.4375rem [content-start] 1fr [content-end] 1.4375rem [all-end];
    position: relative;
    background-color: #f2f2f2;
}

@media (forced-colors: active) {
    article.card.card-product {
        border: 1px solid CanvasText;
    }
}

article.card.card-product:has(:focus-visible) {
    outline: 4px solid var(--fg);
    outline-offset: 4px;
}

article.card.card-product a {
    outline: none;
}

article.card.card-product a::after {
    content: "";
    inset: 0;
    position: absolute;
    z-index: 1;
}

article.card.card-product > * {
    grid-column: content;
}

article.card.card-product .img-wrapper {
    order: -1;
    height: 16.5rem;
    grid-column: all;
    margin-top: 1.5rem;
}

article.card.card-product .img-wrapper img {
    object-fit: contain;
    object-position: center;
    inline-size: calc(100% - 8rem);
    margin: 0 auto;
}

article.card.card-product .title {
    color: var(--c-blue-purple);
    margin-block: 2.25rem;
    text-align: center;
    font-weight: 400;
}

article.card.card-product:not(:has(.description)) .title {
    margin-block-end: 0;
}

article.card.card-product .description {
    color: #707070;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

article.card.card-product .cta {
    margin-top: 2.0625rem;
    padding-top: 1.375rem;
    border-top: 1px solid #b5b4b4;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 1.4375rem;
}

article.card.card-product .cta .btn {
    color: var(--c-blue-purple);
}

@media (max-width: 767px) {
    article.card.card-product .img-wrapper {
        height: 10.5rem;
    }
}

/* ======================================== */
/* ACCORDIONS IMG */
/* ======================================== */

section.accordions-img {
    margin-block: 5.625rem;
}

section.accordions-img .zones {
    display: grid;
    gap: 5.125rem;
}

section.accordions-img .zones .zone.zone-title {
    text-align: center;
}

section.accordions-img .zones .zone.zone-accordions .container {
    display: grid;
    --grid-item-width: 37.5rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    gap: var(--container-gap);
}

section.accordions-img .zones .zone.zone-accordions .accordion {
    padding-left: 2.6875rem;
    border-left: 1px solid var(--fg);
    padding-block: 2.1875rem;
    transition: padding-block 0.3s ease;
}

section.accordions-img .zones .zone.zone-accordions input:checked + .accordion {
    padding-block: 3.125rem;
    border-color: var(--c-orange);
}

section.accordions-img .zones .zone.zone-accordions input:focus-visible + .accordion {
    outline: 4px solid currentColor;
    outline-offset: 4px;
}

section.accordions-img .zones .zone.zone-accordions .accordion label {
    transition: color 300ms ease;
}

section.accordions-img .zones .zone.zone-accordions input:checked + .accordion label {
    color: var(--c-orange);
}

@media (min-width: 768px) {
    section.accordions-img .zones .zone.zone-accordions .accordion:hover label {
        color: var(--c-orange);
    }
}

section.accordions-img .zones .zone.zone-accordions input:checked + .accordion:first-of-type,
section.accordions-img .zones .zone.zone-accordions .accordion:first-of-type {
    padding-block-start: 0;
}

section.accordions-img .zones .zone.zone-accordions input:checked + .accordion:last-of-type,
section.accordions-img .zones .zone.zone-accordions .accordion:last-of-type {
    padding-block-end: 0;
}

section.accordions-img .zones .zone.zone-accordions .accordion label {
    font-size: 2.125rem;
    font-weight: 300;
}

section.accordions-img .zones .zone.zone-accordions .accordion .accordion-body {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows 0.3s ease;
}

section.accordions-img .zones .zone.zone-accordions input:checked + .accordion .accordion-body {
    grid-template-rows: 1fr;
}

section.accordions-img .zones .zone.zone-accordions .accordion .accordion-body > div {
    min-height: 0;
}

section.accordions-img .zones .zone.zone-accordions .accordion .accordion-body .description {
    word-break: break-word;
}

@media (max-width: 768px) {
    section.accordions-img {
        margin-block: 3.125rem;
    }
    section.accordions-img .zones {
        gap: 2rem;
    }

    section.accordions-img .zones .zone.zone-accordions .accordion,
    section.accordions-img .zones .zone.zone-accordions input:checked + .accordion {
        padding-block: 1rem;
    }

    section.accordions-img .zones .zone.zone-accordions .accordion {
        padding-left: 1rem;
    }
    section.accordions-img .zones .zone.zone-accordions .accordion label {
        font-size: 1.5rem;
    }

    section.accordions-img .zones .zone.zone-accordions .accordion .accordion-body .accordion-content .description {
        font-size: 1rem;
    }
}

/* ======================================== */
/* CARD CATEGORY */
/* ======================================== */

article.card.card-category {
    text-align: center;
    container: cardcategory / inline-size;
    position: relative;
    cursor: pointer;
}

article.card.card-category .content {
    margin-bottom: 0;
}

article.card.card-category .text,
article.card.card-category .content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2.875rem;
}

@media (min-width: 768px) {
    article.card.card-category .text,
    article.card.card-category .content {
        height: 100%;
    }

    article.card.card-category .text {
        display: flex;
    }
}

article.card.card-category .text .title {
    font-size: 2rem;
}

article.card.card-category .img-wrapper {
    width: 100%;
    max-width: 14.375rem;
}

article.card.card-category .img-layers {
    display: grid;
    position: relative;
    min-height: 12.5rem;
    display: grid;
    place-items: center;
}

article.card.card-category .img-layers .img-layer {
    grid-area: 1/1;
}

article.card.card-category .img-layers .img-layer.img-layer-fg {
    position: relative;
    isolation: isolate;
}

.bg-blobs article.card.card-category .img-layers .img-layer.img-layer-fg::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    scale: 1.75;
    background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
}

article.card.card-category .img-layers .img-layer.img-layer-bg {
    mix-blend-mode: screen;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    opacity: 0.5;
}

article.card.card-category .img-layers .img-layer.img-layer-bg::after {
    content: "";
    position: absolute;
    background: linear-gradient(90deg, rgba(0, 54, 188, 0.8) 0%, rgba(102, 93, 205, 0.8) 100%);
    inset: 0;
    mix-blend-mode: color;
}

article.card.card-category .img-layers .img-layer.img-layer-bg::after,
article.card.card-category .img-layers .img-layer.img-layer-bg video {
    scale: 0;
    opacity: 0;
    transition:
        scale 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
}

article.card.card-category .img-layers .img-layer.img-layer-bg video {
    transition:
        scale 0.3s ease-in-out 0.1s,
        opacity 0.3s ease-in-out 0.1s;
}

@container cardcategory (width < 700px) {
    article.card.card-category .text,
    article.card.card-category .img-layer {
        transition: transform 0.3s ease;
    }

    article.card.card-category .btn {
        margin-top: auto;
    }
}

@container cardcategory (width > 700px) {
    article.card.card-category .content {
        display: flex;
        flex-direction: row;
        align-items: center;
        text-align: start;
        margin-inline: auto;
        justify-content: center;
    }

    article.card.card-category[data-flipped="true"] .content {
        flex-direction: row-reverse;
    }

    article.card.card-category .content .text {
        height: fit-content;
        max-width: 35.25rem;
        align-items: start;
        flex-grow: 9999;
        flex-basis: 25rem;
    }

    article.card.card-category .text .title {
        font-size: 2.5rem;
        color: var(--c-orange);
    }

    article.card.card-category .content .img-wrapper {
        flex-grow: 1;
        flex-basis: 28.125rem;
        max-width: 25.9375rem;
    }
}

@media (hover: hover) {
    @container cardcategory (width < 700px) {
        article.card.card-category:where(:hover, :has(:focus-visible)) .img-layers .img-layer.img-layer-bg::after,
        article.card.card-category:where(:hover, :has(:focus-visible)) .img-layers .img-layer.img-layer-bg video {
            scale: 1;
            opacity: 1;
            transition:
                scale 0.3s ease-in-out,
                opacity 0.3s ease-in-out;
        }

        article.card.card-category:where(:hover, :has(:focus-visible)) .img-layers .img-layer.img-layer-bg::after {
            transition:
                scale 0.3s ease-in-out 0.1s,
                opacity 0.3s ease-in-out 0.1s;
        }

        article.card.card-category:where(:hover, :has(:focus-visible)) .text,
        article.card.card-category:where(:hover, :has(:focus-visible)) .img-layer {
            transform: translateY(-0.8rem);
        }

        article.card.card-category:where(:hover, :has(:focus-visible)) .img-layers .img-layer.img-layer-bg {
            transform: translate(-50%, calc(-50% - 2.125rem));
        }
    }

    @container cardcategory (width > 700px) {
        article.card.card-category:not(.no-video) .img-layers .img-layer.img-layer-bg::after,
        article.card.card-category:not(.no-video) .img-layers .img-layer.img-layer-bg video {
            scale: 0.8;
            opacity: 1;
        }
    }
}

@media (max-width: 768px) {
    article.card.card-category .text,
    article.card.card-category .content {
        gap: 1.5em;
    }

    article.card.card-category .img-wrapper {
        max-width: 12.375rem;
    }
}

/* ======================================== */
/* CATEGORY SIBLINGS */
/* ======================================== */

section.category-siblings {
    position: relative;
    z-index: 1;
    margin-block: 6.9375rem;
}

section.category-siblings .zones {
    display: grid;
    gap: 5.5rem;
}

section.category-siblings .zone.zone-title {
    text-align: center;
    display: grid;
    gap: 2.5rem;
}

section.category-siblings .zone.zone-title .description {
    max-width: 54.375rem;
    margin-inline: auto;
    margin-bottom: 5rem;
}

section.category-siblings .zone.zone-siblings {
    display: grid;
    --grid-item-width: 18.75rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    column-gap: 1.3125rem;
    row-gap: 3.125rem;
}

section.category-siblings .zone.zone-siblings img {
    max-height: 14rem;
}

section.category-siblings .zone.zone-mini-banner {
    display: grid;
    text-align: center;
    gap: 2.5rem;
}

@media (max-width: 768px) {
    section.category-siblings .zone.zone-title {
        gap: 2rem;
    }

    section.category-siblings .zone.zone-title .description {
        margin-bottom: 0;
    }

    section.category-siblings .zones {
        gap: 2rem;
    }
}

@media (max-width: 768px) {
    section.category-siblings .zone.zone-siblings {
        row-gap: 3.125rem;
    }

    section.category-siblings {
        margin-block: 3.125rem 3.125rem;
    }

    section.category-siblings .zone.zone-mini-banner {
        margin-top: 2rem;
    }
}

/* ======================================== */
/* CATEGORIES FLIPPER */
/* ======================================== */

section.categories-flipper {
    padding-block: 6.25rem;
}

section.categories-flipper .container {
    display: grid;
    gap: 9.375rem;
}

@media (max-width: 768px) {
    section.categories-flipper {
        padding-block: 3.125rem;
    }
    section.hero + section.categories-flipper {
        padding-block-start: 0;
    }
    section.categories-flipper .container {
        gap: 2rem;
    }
}

/* ======================================== */
/* MARQUEE BLOCK */
/* ======================================== */

section.marquee-block {
    margin-block: 5.625rem;
    overflow: hidden;
}

section.marquee-block .title {
    text-align: center;
    margin-bottom: 5.625rem;
}

section.marquee-block .marquee .marquee-section,
section.marquee-block .marquee {
    text-align: center;
    display: flex;
    align-items: center;
    gap: 6.6875rem;
    flex-shrink: 0;
}

section.marquee-block .marquee .marquee-section {
    animation: marquee 10s linear infinite;
}

section.marquee-block .marquee .marquee-section > * {
    flex-shrink: 0;
}

section.marquee-block .marquee .marquee-section .img-wrapper {
    height: 3.75rem;
}

@keyframes marquee {
    0% {
        translate: 0%;
    }
    100% {
        translate: calc(-100% - 6.6875rem);
    }
}

@media (max-width: 768px) {
    section.marquee-block {
        margin-block: 3.125rem;
    }

    section.marquee-block .title {
        margin-bottom: 2rem;
    }
}

/* ======================================== */
/* CASES SLIDER */
/* ======================================== */

.single-case-study section.hero.hero-simple .layers .layer-bg .img-wrapper:before {
    content: "";
    background-image: url(./assets/img/bg-case.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    background-position: center;
}

.single-case-study section.hero.hero-simple .layers .layer-bg .img-wrapper:after {
    content: "";
    background-color: rgba(26, 5, 49, 0.8);
    position: absolute;
    width: 100%;
    height: 100%;
}

section.cases-slider {
    margin-block: 5.625rem;
}

section.cases-slider .zones {
    display: flex;
    flex-direction: column;
    gap: 4.375rem;
}

section.cases-slider .zones .zone.zone-title {
    text-align: center;
}

section.cases-slider .zones .zone.zone-slider .container {
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    align-items: center;
}

section.cases-slider .zones .zone.zone-slider button {
    width: 6.625rem;
    height: 6.625rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background-color: rgb(239 241 255 / 0.15);
    flex-shrink: 0;
}

section.cases-slider .zones .zone.zone-slider button:active {
    scale: 0.97;
}

section.cases-slider .zones .zone.zone-slider button:disabled {
    opacity: 0.5;
}

section.cases-slider .zones .zone.zone-slider .swiper {
    flex-grow: 1;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide {
    display: flex;
    align-items: center;
    gap: 4.375rem;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide .img-wrapper {
    border-radius: 999px;
    aspect-ratio: 1/1;
    flex-basis: 25.875rem;
    max-width: 25.875rem;
    height: auto;
    flex-grow: 99999;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide .text {
    flex-basis: 31.25rem;
    flex-grow: 1;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide .text .title {
    margin-bottom: 1.0625rem;
    font-size: 2.125rem;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide .text .description {
    margin-bottom: 3.1875rem;
    line-height: 1.9;
}

section.cases-slider .zones .zone.zone-slider .swiper-slide .pagination {
    line-height: 0;
    --swiper-pagination-bullet-size: 0.875rem;
    --swiper-pagination-color: var(--fg);
    margin-top: 3.125rem;
}

@media (max-width: 768px) {
    section.cases-slider {
        margin-block: 3.125rem;
    }

    section.cases-slider .zones {
        row-gap: 2rem;
    }

    section.cases-slider .zones .zone.zone-slider button {
        display: none;
    }

    section.cases-slider .zones .zone.zone-slider .swiper-slide {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    section.cases-slider .zones .zone.zone-slider .swiper-slide .text .description {
        margin-bottom: 2rem;
    }
    section.cases-slider .zones .zone.zone-slider .swiper-slide .pagination {
        margin-top: 2rem;
    }

    section.cases-slider .zones .zone.zone-slider .swiper-slide .text .title {
        font-size: 1.5rem;
        line-height: 1.4;
    }
}

/* ======================================== */
/* TESTIMONIALS */
/* ======================================== */

section.testimonials {
    margin-block: 5.625rem;
}

section.testimonials .container {
    display: flex;
    flex-direction: column;
}

section.testimonials .content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

section.testimonials .pagination {
    line-height: 0;
    --swiper-pagination-bullet-size: 0.875rem;
    --swiper-pagination-color: var(--fg);
    margin-inline: auto;
    width: fit-content;
}

section.testimonials button {
    width: 6.625rem;
    height: 6.625rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background-color: rgb(239 241 255 / 0.15);
    flex-shrink: 0;
}

section.testimonials button:active {
    scale: 0.97;
}

section.testimonials button:disabled {
    opacity: 0.5;
}

section.testimonials .swiper {
    padding-block: 4.125rem 4.5625rem;
}

section.testimonials .swiper-slide .slide-content {
    display: grid;
    column-gap: 95px;
    grid-template-columns: auto auto;
    grid-template-areas: "description name";
    max-width: 53.1875rem;
    margin-inline: auto;
}

section.testimonials .swiper-slide .description {
    grid-area: description;
}

section.testimonials .swiper-slide .img-wrapper {
    z-index: 1;
    grid-area: description;
    height: 6.875rem;
    width: 6.875rem;
    border-radius: 99px;
    box-shadow: 3px 5px 6.1px rgb(0 0 0 / 0.25);
    transform: translate(-50%, -50%);
    scale: 0;
    transition: scale 0.2s ease-in;
    transform-origin: top left;
}

section.testimonials .swiper-slide.swiper-slide-active .img-wrapper {
    scale: 1;
    transition: scale 0.2s ease-out 0.2s;
}

section.testimonials .swiper-slide .description {
    padding: 1.9375rem 3.9375rem;
    background-color: #ea6f49;
    border: 1px solid rgb(239 241 255 / 0.32);
    font-size: 1rem;
    line-height: 1.9;
    text-align: center;
    max-width: 31.9375rem;
    color: rgb(255 255 255 / 0.93);
    position: relative;
}

section.testimonials .swiper-slide .description::after {
    content: "";
    position: absolute;
    right: 2px;
    width: 81px;
    height: 70px;
    background-image: url(assets/img/testimonial-triangle.svg);
    transform: translateX(100%);
    top: 45px;
    background-repeat: no-repeat;
}

section.testimonials .swiper-slide .name {
    margin-top: 1.375rem;
    font-size: 1.875rem;
    line-height: 1.9;
}

@media (max-width: 768px) {
    section.testimonials {
        margin-block: 3.125rem;
    }

    section.testimonials .swiper {
        padding-block: 0 2rem;
    }

    section.testimonials .content > button {
        display: none;
    }

    section.testimonials .swiper-slide .slide-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    section.testimonials .swiper-slide .img-wrapper {
        transform: none;
        order: -1;
        scale: 1;
    }

    section.testimonials .swiper-slide .name {
        margin-block: 1rem;
    }

    section.testimonials .swiper-slide .description {
        padding: 2rem 1rem;
    }
}

/* ======================================== */
/* HERO VIDEO */
/* ======================================== */

section.hero.hero-video .layers .layer-bg .img-wrapper {
    height: 100%;
}

section.hero.hero-video .layers .layer-bg::before {
    z-index: 1;
    height: 12.5rem;
    background-image: linear-gradient(transparent, black, transparent);
    top: auto;
    bottom: 0;
    transform: translateY(50%);
}

section.hero.hero-video .layers .layer-bg::after {
}

section.hero.hero-video .layers .layer-fg {
    padding-top: 14.5625rem;
    padding-bottom: 9rem;
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    align-items: center;
}

section.hero.hero-video .layers .layer-fg .container {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
}

@media (max-width: 768px) {
    section.hero.hero-video .layers .layer-fg .container {
        gap: 2rem;
    }

    section.hero.hero-video .layers .layer-bg::before {
        height: 7rem;
    }
}

/* ======================================== */
/* QRS GRID */
/* ======================================== */

section.qrs-grid {
    margin-block: 5.625rem;
}

section.qrs-grid .container {
    display: grid;
    --grid-item-width: 25rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    column-gap: 1.3125rem;
    row-gap: 3.125rem;
}

section.qrs-grid .container .single-qr {
    background-color: #f2f2f2;
    padding: 1.25rem;
    padding-bottom: 3.125rem;
}

section.qrs-grid .container .single-qr .logo {
    height: 4.375rem;
    margin-bottom: 0.3125rem;
}

section.qrs-grid .container .single-qr .logo img {
    height: 100%;
    object-fit: contain;
}

section.qrs-grid .container .single-qr .qr {
    aspect-ratio: 1/1;
}

section.qrs-grid .container .single-qr .title {
    margin-block: 2.0625rem;
    text-align: center;
    font-size: 1.5625rem;
    line-height: 1.2;
}

section.qrs-grid .container .single-qr .description {
    padding-top: 1.9375rem;
    border-top: 1px solid #b5b4b4;
    text-align: center;
    font-size: 1.125rem;
    line-height: 1.388889;
}

@media (max-width: 768px) {
    section.qrs-grid {
        margin-block: 3.125rem;
    }

    section.qrs-grid .container {
        row-gap: var(--container-x-padding);
    }

    section.qrs-grid .container .single-qr .logo:not(:has(*)) {
        display: none;
    }

    section.qrs-grid .container .single-qr {
        padding-bottom: 2rem;
    }

    section.qrs-grid .container .single-qr .title {
        margin-block: 1rem;
        font-size: 1.4rem;
    }

    section.qrs-grid .container .single-qr .description {
        padding-top: 1rem;
        font-size: 1rem;
    }
}

/* ======================================== */
/* PARENT CATEGORIES */
/* ======================================== */

section.parent-categories {
    padding-block: 3.125rem;
}

section.parent-categories .container {
    display: flex;
    align-items: center;
    gap: 4.8125rem;
    flex-wrap: wrap;
    justify-content: center;
}

section.parent-categories .container form {
    display: flex;
    align-items: center;
    gap: 4.8125rem;
    flex-wrap: wrap;
    justify-content: center;
}

@media (max-width: 768px) {
    section.parent-categories .container form {
        row-gap: 1.5625rem;
    }
}

/* ======================================== */
/* ACCORDIONS */
/* ======================================== */

section.accordions {
    padding-top: 3.125rem;
    padding-bottom: 5.3125rem;
}

section.accordions .zones {
    display: grid;
    gap: 3.125rem;
}

section.accordions .zones .zone.zone-categories {
    display: grid;
    gap: 3.125rem;
}

section.accordions .zones #categories {
    display: flex;
    align-items: center;
    gap: 2.375rem;
}

section.accordions .zones #categories label {
    border: 2px solid transparent;
    border-radius: 999px;
    color: var(--c-orange);
    padding: 0.75rem 1.1875rem;
    transition: border-color 150ms ease-in-out;
}

section.accordions .zones #categories input:focus-visible + label {
    outline: 4px solid var(--fg);
    outline-offset: 4px;
}

section.accordions .zones #categories input:checked + label {
    border-color: var(--c-orange);
}

section.accordions .zones .zone-titles {
    text-align: center;
}

section.accordions .zones .zone-accordions .accordion {
    border-bottom: 1px solid #b5b4b4;
}

section.accordions .zones .zone-accordions .accordion:first-child {
    border-top: 1px solid #b5b4b4;
}

section.accordions .zones .zone-accordions .accordion:nth-child(odd of :not([hidden])) {
    background-color: #faf9f9;
}

section.accordions .zones .zone-accordions .accordion .accordion-head button {
    text-align: left;
    padding-inline: 0.625rem;
    color: var(--c-orange);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-block: 2.25rem;
    font-size: 1.5625rem;
    line-height: 1.4;
}

section.accordions .zones .zone-accordions .accordion:not(:has(.accordion-body[inert])) .accordion-head button .plus,
section.accordions .zones .zone-accordions .accordion:has(.accordion-body[inert]) .accordion-head button .minus {
    display: none;
}

section.accordions .zones .zone-accordions .accordion .accordion-body {
    display: grid;
    grid-template-rows: 1fr;
    overflow: hidden;
    transition: grid-template-rows 0.3s ease;
}

section.accordions .zones .zone-accordions .accordion .accordion-body[inert] {
    grid-template-rows: 0fr;
}

section.accordions .zones .zone-accordions .accordion .accordion-body > div {
    min-height: 0;
}

section.accordions .zones .zone-accordions .accordion .accordion-body > div > .accordion-content {
    padding-inline: 0.625rem;
    padding-bottom: 2.25rem;
}

section.accordions .zones .zone-accordions .accordion .accordion-body > div > .accordion-content .description {
    font-size: 1.125rem;
    line-height: 1.388889;
}

@media (max-width: 768px) {
    section.accordions {
        padding-block: 3.125rem 0;
    }
    section.accordions .container {
        padding: 0;
    }

    section.accordions .zones .zone.zone-categories #categories {
        overflow: auto;
        scrollbar-width: none;
        position: relative;
        padding-inline: var(--container-x-padding);
        gap: 1rem;
    }

    section.accordions .zones .zone.zone-categories #categories > * {
        flex-shrink: 0;
    }

    section.accordions .zones .zone-accordions .accordion .accordion-head button {
        padding-block: 1.5rem;
        font-size: 1.2rem;
        padding-inline: var(--container-x-padding);
    }

    section.accordions .zones .zone-accordions .accordion .accordion-body > div > .accordion-content {
        padding-block-end: 1.5rem;
        padding-inline: var(--container-x-padding);
    }

    section.accordions .zones {
        gap: 3.125rem;
    }
}

/* ======================================== */
/* TABLES REPEATER */
/* ======================================== */

section.tables-repeater .zones .zone.zone-title {
    text-align: center;
    margin-top: 5.625rem;
}

section.tables-repeater .zones .zone.zone-title .title + .description {
    margin-top: 2.5rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles {
    margin-top: 5.625rem;
    text-align: center;
    margin-bottom: -0.625rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles {
    margin-top: 5.625rem;
    text-align: center;
    margin-bottom: -0.625rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles .title {
    color: var(--c-orange);
    font-weight: 300;
    font-size: 2.1875rem;
    line-height: 1.142857;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles .title + .description {
    margin-top: 1.875rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table {
    margin-top: 2.5rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-container {
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--c-orange) transparent;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table th[data-name="date"] {
    width: 13.375rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table th[data-name="type"] {
    width: 11.625rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table th[data-name="version"] {
    width: 9.625rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table th[data-name="file"] {
    width: 13.375rem;
}

section.tables-repeater .zones .zone.zone-tables .table-wrapper table th[data-name="description"] {
    width: 35.1875rem;
}

section.tables-repeater.issue-notification .zones .zone.zone-tables .table-wrapper table th[data-name="date"] {
    width: 13.375rem;
}

section.tables-repeater.issue-notification .zones .zone.zone-tables .table-wrapper table th[data-name="subject"] {
    width: 35.25rem;
}

section.tables-repeater.issue-notification .zones .zone.zone-tables .table-wrapper table th[data-name="file"] {
    width: 35.25rem;
}

section.tables-repeater .zones .zone.zone-message {
    margin-top: 5rem;
    margin-bottom: 5.8125rem;
    text-align: center;
}

@media (max-width: 768px) {
    section.tables-repeater .zones .zone.zone-title {
        margin-top: 3.125rem;
    }

    section.tables-repeater .zones .zone.zone-tables .table-wrapper table {
        margin-top: 2rem;
    }

    section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles {
        margin-top: 1.5rem;
    }

    section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles .title {
        font-size: 1.5rem;
    }

    section.tables-repeater .zones .zone.zone-tables .table-wrapper .table-titles .title + .description {
        margin-top: 1.5rem;
    }

    section.tables-repeater .zones .zone.zone-message {
        margin-block: 3.125rem;
    }
}

/* ======================================== */
/* BASIC TABLE */
/* ======================================== */

table.basic-table {
    font-size: 1.125rem;
    line-height: 1.388889;
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
}

table.basic-table caption {
    caption-side: bottom;
    padding-top: 1rem;
    font-size: 0.875rem;
    line-height: 1.5;
    text-align: left;
}

table.basic-table tbody tr:nth-child(even),
table.basic-table thead {
    background-color: #faf9f9;
}

table.basic-table tbody tr th:first-child,
table.basic-table thead th {
    text-align: left;
    color: var(--c-orange);
    font-weight: 400;
}

table.basic-table tbody tr th:first-child,
table.basic-table thead th,
table.basic-table tbody tr td {
    padding-block: 1.25rem;
    padding-inline: 0.625rem;
}

table.basic-table tbody tr th:first-child a:not(.btn),
table.basic-table thead th a:not(.btn),
table.basic-table tbody tr td a:not(.btn) {
    text-decoration: underline;
}

/* ======================================== */
/* PAGINATED TABLE */
/* ======================================== */

section.paginated-table .pagination-wrapper #eg-pagination {
    margin-top: 3.125rem;
}

@media (max-width: 768px) {
    section.paginated-table .pagination-wrapper #eg-pagination {
        margin-top: 2rem;
    }
}

/* ======================================== */
/* FILTERS-SIDEBAR */
/* ======================================== */

aside.filters-sidebar {
    border: 1px solid #b3b3b3;
    padding: 1.375rem 1.25rem;
}

aside.filters-sidebar .title {
    font-weight: 300;
    font-size: 1.5625rem;
    line-height: 1.4;
    color: var(--c-orange);
}

aside.filters-sidebar form fieldset {
    padding-block-end: 2rem;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

aside.filters-sidebar form fieldset legend {
    padding-top: 2rem;
    padding-bottom: 1.3125rem;
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.388889;
}

aside.filters-sidebar form fieldset:not(:first-child) legend {
    border-top: 1px solid #b3b3b3;
    width: 100%;
}

aside.filters-sidebar form fieldset label {
    display: flex;
    align-items: center;
    gap: 0.4375rem;
    font-size: 1.125rem;
    line-height: 1.388889;
}

aside.filters-sidebar form fieldset label .count {
    color: #adadad;
    margin-left: auto;
}

body.post-type-archive-reference main .container.content-container {
    display: flex;
    gap: 1.375rem;
    padding-top: 4.125rem;
    padding-bottom: 5.625rem;
    flex-wrap: wrap;
}

body.post-type-archive-reference main .container.content-container aside {
    flex-basis: 20.6875rem;
    flex-grow: 1;
}

body.post-type-archive-reference main .container.content-container section {
    flex-basis: 33rem;
    flex-grow: 9999999;
}

body.post-type-archive-reference main .container.content-container section table thead th:nth-child(1) {
    width: 6.5625rem;
}

body.post-type-archive-reference main .container.content-container section table thead th:nth-child(3) {
    width: 13.3125rem;
}

@media (min-width: 768px) {
    body.post-type-archive-reference main .container.content-container aside button .icon {
        display: none;
    }
    body.post-type-archive-reference main .container.content-container aside button[type="submit"] {
        display: none;
    }
}

@media (max-width: 768px) {
    body.post-type-archive-reference main .container.content-container {
        padding-block: 0 3.125rem;
        row-gap: 2rem;
    }
    body.post-type-archive-reference main .container.content-container section {
        flex-basis: auto;
    }
    body.post-type-archive-reference main .container.content-container section .table-wrapper {
        width: 0;
        min-width: 100%;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: var(--c-orange) transparent;
    }

    body.post-type-archive-reference main .container.content-container section table thead th:nth-child(2) {
        width: 50ch;
    }

    body.post-type-archive-reference main .container.content-container aside.open *,
    body.post-type-archive-reference main .container.content-container aside.open {
        touch-action: none;
    }

    body.post-type-archive-reference main .container.content-container aside {
        --_button-height: 5.0625rem;
        height: var(--_button-height);
        position: sticky;
        top: 0;
        background-color: var(--bg);
        margin-inline: calc(-1 * var(--container-x-padding));
        width: calc(100% + var(--container-x-padding) + var(--container-x-padding));
        flex-basis: auto;
        border-inline: none;
        z-index: 1;
    }

    body.post-type-archive-reference main .container.content-container .filters-sidebar.open {
        z-index: var(--z-references-filters);
    }

    body.post-type-archive-reference main .container.content-container aside .title button {
        width: 100%;
        text-align: left;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    body.post-type-archive-reference main .container.content-container aside .title button .icon {
        transition: rotate 0.15s ease-in-out;
        width: 1.25rem;
        height: 1.25rem;
        line-height: 0;
        display: block;
        rotate: 45deg;
    }

    body.post-type-archive-reference main .container.content-container aside.open .title button .icon {
        rotate: 0deg;
    }

    body.post-type-archive-reference main .container.content-container aside .categories-wrapper {
        position: fixed;
        background-color: var(--bg);
        width: 100%;
        left: 0;
        padding-inline: var(--container-x-padding);
        overflow: auto;
        scrollbar-width: none;
        translate: -100%;
        transition: translate 0.3s ease;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding-bottom: 2rem;
    }

    body.post-type-archive-reference main .container.content-container aside .categories-wrapper {
        height: calc(100% - var(--_button-height));
        top: calc(var(--_button-height));
    }

    body.post-type-archive-reference main .container.content-container aside:not(.stuck-top).open {
        position: fixed;
        top: 0;
        left: 0;
    }

    body.post-type-archive-reference main .container.content-container aside:not(.stuck-top).open > .title {
        padding-inline: var(--container-x-padding);
    }

    body.post-type-archive-reference main .container.content-container aside .categories-wrapper form {
        flex-grow: 1;
        min-height: 0;
        overflow: auto;
        overscroll-behavior: none;
        scrollbar-width: none;
        padding-bottom: 2rem;
    }

    body.post-type-archive-reference main .container.content-container aside .categories-wrapper form,
    body.post-type-archive-reference main .container.content-container aside .categories-wrapper form * {
        touch-action: pan-y;
    }

    body.post-type-archive-reference main .container.content-container aside .categories-wrapper button[type="submit"] {
        transform: translateY(-50%);
        background-color: var(--bg);
    }

    body.post-type-archive-reference main .container.content-container aside.open .categories-wrapper {
        translate: 0%;
    }

    body.post-type-archive-reference:has(aside.open) {
        overflow: hidden;
    }
}

/* ======================================== */
/* COMPARISON GRID */
/* ======================================== */

section.comparison-grid .items {
    display: grid;
    --grid-item-width: 25rem;
    grid-template-columns: repeat(auto-fill, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-item-width), 100%), 1fr));
    gap: 1.25rem;
    row-gap: 1.5625rem;
}

section.comparison-grid .items .card.card-product .cta {
    padding-block: 2.5rem;
    position: relative;
    z-index: 1;
}

section.comparison-grid .items + .cta {
    margin-block: 5.625rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

section.comparison-grid .items .card .img-wrapper img {
    margin: auto;
    max-height: 11rem;
}

/* ======================================== */
/* HERO ICONS */
/* ======================================== */

section.hero.hero-icons .layers .layer-bg .img-wrapper {
    height: 100%;
}

section.hero.hero-icons .layers .layer-fg {
    padding-top: 12.125rem;
    padding-bottom: 5.625rem;
    text-align: center;
}

section.hero.hero-icons .layers .layer-fg .items {
    margin-top: 4rem;
    display: grid;
    --grid-item-width: 16rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    gap: 1rem;
    row-gap: 2rem;
}

section.hero.hero-icons .layers .layer-fg .items .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.8rem;
}

section.hero.hero-icons .layers .layer-fg .items .item h2 {
    font-size: 2.125rem;
}

section.hero.hero-icons .layers .layer-fg .items .item img {
    max-width: 6.6875rem;
}

section.hero.hero-icons .layers .layer-fg .items .item a[href^="mailto:"]{
	white-space: nowrap;
}

@media (max-width: 768px) {
    section.hero.hero-icons .layers .layer-fg {
        padding-block: 7.25rem 3.125rem;
    }

    section.hero.hero-icons .layers .layer-fg .items {
        margin-top: 3.125rem;
        gap: 2rem;
    }

    section.hero.hero-icons .layers .layer-fg .items .item img {
        max-width: 4.6875rem;
    }
}

/* ======================================== */
/* FORM DISPLAYER */
/* ======================================== */

section.form-displayer {
    margin-block: 5.625rem;
}

section.form-displayer .titles {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 3.125rem;
    margin-bottom: 4.625rem;
}

@media (max-width: 768px) {
    section.form-displayer {
        margin-block: 3.125rem;
    }

    section.form-displayer .titles {
        margin-bottom: 2rem;
        gap: 2rem;
    }
}

/* ======================================== */
/* INFORMATION POPUP */
/* ======================================== */

#information-popup {
    position: fixed;
    right: 1rem;
    bottom: 2rem;
    z-index: var(--z-info-popup);
    background-color: white;
    display: flex;
    align-items: center;
    padding: 0.5rem;
    border-radius: 999px;
    border: 2px solid var(--c-orange);
    transform: scale3d(0, 0, 0);
    animation: tada 1s ease forwards 2s;
    transform-origin: bottom right;
    translate: 0 var(--_up-by);
}

#information-popup .information-popup-icon {
    height: 4.1875rem;
    width: 4.1875rem;
    border-radius: 999px;
    position: relative;
}

#information-popup .information-popup-icon svg {
    position: absolute;
    top: -0.5px;
    left: -1.5px;
}

#information-popup .information-popup-accordion {
    display: grid;
    grid-template-columns: 0fr;
    overflow: hidden;
    transition: grid-template-columns 0.2s ease-in-out;
}

@media (hover: hover) {
    #information-popup:where(:hover, :focus-visible) .information-popup-accordion {
        grid-template-columns: 1fr;
    }
}

#information-popup .information-popup-accordion .accent-text {
    color: var(--c-orange);
}

#information-popup .information-popup-accordion > span {
    min-width: 0;
    white-space: nowrap;
}

#information-popup .information-popup-accordion > span > .information-popup-content {
    padding-right: 0.875rem;
    padding-left: 1.125rem;
    font-size: 1.875rem;
}

@media (max-width: 768px) {
    #information-popup .information-popup-icon svg,
    #information-popup .information-popup-icon {
        height: 3rem;
        width: 3rem;
    }

    #information-popup .information-popup-icon svg {
        left: 0px;
        top: 0px;
    }
    #information-popup .information-popup-accordion > span > .information-popup-content {
        font-size: 1rem;
    }
}

@keyframes tada {
    0% {
        transform: scale3d(0, 0, 0);
    }

    10%,
    20% {
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }

    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }

    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }

    100% {
        transform: scale3d(1, 1, 1);
    }
}

/* ======================================== */
/* INFORMATION DIALOG */
/* ======================================== */

dialog#information-dialog {
    color: var(--c-blue-purple);
    max-height: 37.5rem;
    max-height: min(37.5rem, 100vh - 2rem);
    max-height: min(37.5rem, 100svh - 2rem);
    width: 100%;
    max-width: 73rem;
    max-width: min(73rem, 100vw - var(--container-x-padding) - var(--container-x-padding));
    border: none;
    outline: none;
    scrollbar-width: none;
}

dialog#information-dialog::backdrop {
    background-color: rgb(0 0 0 / 0.5);
}

dialog#information-dialog .dialog-content > .container {
    max-width: calc(61.375rem + var(--container-x-padding) + var(--container-x-padding));
}

dialog#information-dialog .dialog-closer {
    position: absolute;
    top: 0.625rem;
    background-color: var(--bg);
    border-radius: 999px;
    right: 0.625rem;
}

dialog#information-dialog section .container {
    padding-inline: 0;
}

/* ======================================== */
/* PRODUCT ITEMS */
/* ======================================== */

section.product-items {
    margin-block: 5rem 5.625rem;
}

section.product-items .container {
    display: grid;
    --grid-item-width: 44.25rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    row-gap: 5.625rem;
    column-gap: var(--container-gap);
}

section.product-items[data-columns="one"] .container {
    --grid-item-width: 44.25rem;
}

section.product-items[data-columns="two"] .container {
    --grid-item-width: 31.25rem;
}

section.product-items .container .card {
    background-color: #f2f2f2;
    padding: 1rem 1.4375rem 3.3125rem;
}

section.product-items .container .card .img-wrapper {
    height: 15.625rem;
    padding-bottom: 1.9375rem;
    border-bottom: 1px solid #b5b4b4;
    margin-bottom: 2.25rem;
}

section.product-items .container .card .img-wrapper img {
    width: auto;
    height: 100%;
    margin-inline: auto;
    max-width: 100%;
    object-fit: contain;
}

section.product-items .container .card .subtitle,
section.product-items .container .card .description,
section.product-items .container .card .title {
    text-align: center;
}

section.product-items .container .card .title {
    font-size: 2.1875rem;
    line-height: 1.142857;
    font-weight: 300;
}

section.product-items .container .card .subtitle {
    margin-top: 1.5rem;
    font-size: 1.5625rem;
    font-weight: 300;
}

section.product-items .container .card .description {
    margin-top: 2.25rem;
}

section.product-items .container .card .cta {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.25rem;
}

@media (max-width: 768px) {
    section.product-items {
        margin-block: 3.125rem;
    }
    section.product-items .container {
        row-gap: var(--container-x-padding);
    }

    section.product-items .container .card {
        padding-bottom: 2rem;
    }

    section.product-items .container .card .img-wrapper {
        padding-bottom: 1.5rem;
        margin-bottom: 1.5rem;
    }
    section.product-items .container .card .title {
        font-size: 1.8rem;
    }
    section.product-items .container .card .subtitle {
        font-size: 1.3rem;
    }
    section.product-items .container .card .description {
        margin-top: 1.5rem;
        font-size: 1rem;
    }
}

/* ======================================== */
/* INTRO TEXT */
/* ======================================== */

section.intro-text {
    margin-block: 5.125rem;
    text-align: center;
}

section.intro-text .title {
    margin-bottom: 3.1875rem;
}

section.intro-text .subtitle {
    margin-bottom: 2rem;
    font-size: 2.1875rem;
    line-height: 1.285714;
}

section.intro-text .img-wrapper {
    max-width: 42.9375rem;
    margin-block: 2rem;
    margin-inline: auto;
}

@media (max-width: 768px) {
    section.intro-text {
        margin-block: 3.125rem;
    }
    section.intro-text .title {
        margin-bottom: 2rem;
    }

    section.intro-text .subtitle {
        margin-bottom: 1.5rem;
        font-size: 1.6rem;
    }

    section.intro-text .img-wrapper {
        margin-block: 1.5rem;
    }
}

/* ======================================== */
/* PRODUCT RANGE */
/* ======================================== */

section.product-range {
    margin-block: 5.625rem;
}

section.product-range .titles {
    text-align: center;
    margin-block-end: 5.625rem;
}

section.product-range .items {
    display: grid;
    --grid-item-width: 31.25rem;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-item-width), 1fr));
    grid-template-columns: repeat(auto-fit, minmax(min(var(--grid-item-width), 100%), 1fr));
    row-gap: 2.75rem;
    column-gap: 1.25rem;
}

section.product-range .items .item {
    background-color: #f2f2f2;
    padding: 1rem 1.4375rem 3.3125rem;
}

section.product-range .items .item .img-wrapper {
    height: 15.625rem;
    padding-bottom: 1.9375rem;
    border-bottom: 1px solid #b5b4b4;
    margin-bottom: 2.25rem;
}

section.product-range .items .item .img-wrapper img {
    width: auto;
    height: 100%;
    margin-inline: auto;
    max-width: 100%;
    object-fit: contain;
}

section.product-range .items .item .title {
    font-size: 2.1875rem;
    line-height: 1.142857;
    font-weight: 300;
}

section.product-range .items .item .subtitle {
    margin-top: 1.5rem;
    font-size: 1.5625rem;
    font-weight: 300;
}

section.product-range .items .item .description {
    margin-top: 2.25rem;
}

@media (max-width: 768px) {
    section.product-range {
        margin-block: 3.125rem;
    }

    section.product-range .items {
        row-gap: var(--container-x-padding);
    }

    section.product-range .titles {
        margin-block-end: 2rem;
    }

    section.product-range .items .item {
        padding-bottom: 2rem;
    }

    section.product-range .items .item .img-wrapper {
        margin-bottom: 1.5rem;
        padding-bottom: 1.5rem;
    }

    section.product-range .items .item .title {
        font-size: 2rem;
    }
}

/* ======================================== */
/* PRODUCTS SLIDER */
/* ======================================== */

section.products-slider {
    padding-block: 5.625rem;
}

section.products-slider .titles {
    text-align: center;
    margin-bottom: 5.625rem;
}

section.products-slider .slider {
    position: relative;
}

section.products-slider .slider .controls {
    --_x-offset: 3rem;
    color: var(--c-white);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: calc(100% + (var(--container-x-padding) * 1.75));
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    pointer-events: none;
}

section.products-slider .slider .controls button {
    pointer-events: auto;
    line-height: 0;
}

@media (max-width: 768px) {
    section.products-slider {
        padding-block: 3.125rem;
        overflow: hidden;
    }

    section.products-slider .titles {
        margin-bottom: 2rem;
    }

    section.products-slider .slider .controls button {
        pointer-events: auto;
        line-height: 0;
        background-color: var(--c-orange);
        border-radius: 9999px;
        aspect-ratio: 1 / 1;
        height: 3rem;
        padding: 0.9rem;
    }

    section.products-slider .slider .controls button:disabled {
        opacity: 0;
        visibility: hidden;
    }

    section.products-slider .slider .controls button svg {
        line-height: 0;
        width: 100%;
        height: 100%;
    }

    section.products-slider .slider .swiper {
        overflow: visible;
    }
}

/* ======================================== */
/* COMPARATOR */
/* ======================================== */

section.comparator {
    margin-block-end: 3.125rem;
}

section.comparator .notes {
    margin-top: 2rem;
}

section.comparator table {
    overflow: hidden;
}

section.comparator table thead {
    background-color: transparent;
}

section.comparator table thead th:not(:empty) {
    background-color: #eeeeee;
    border-inline: 0.53125rem solid var(--bg);
    border-bottom: 1.0625rem solid var(--bg);
    padding-bottom: 8px;
    padding-top: 0;
    padding-inline: 0;
    position: relative;
}

section.comparator table thead th:not(:empty):last-child {
    border-right-width: 0;
}

section.comparator table thead th img {
    margin-block: 1rem;
    max-width: calc(100% - 1rem);
    margin-inline: auto;
    height: 8rem;
    object-fit: contain;
}

section.comparator table thead th span {
    font-size: 1.5625rem;
    color: var(--c-blue-purple);
    text-align: center;
    display: block;
    padding-inline: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #b5b4b4;
}

section.comparator table thead th span::after {
    content: "";
    height: 1px;
    bottom: -25px;
    width: 100vw;
    left: 0;
    border-bottom: 1px solid #b5b4b4;
    position: absolute;
    transform: translateX(-50vw);
}

@media only screen and (max-width: 768px) {
    section.comparator .container {
        overflow: auto;
        scrollbar-width: none;
    }

    section.comparator .container table thead th {
        width: 20ch;
    }
}

/* ======================================== */
/* AFTER TABLE */
/* ======================================== */

section.after-table {
    margin-block: 5.625rem;
    text-align: center;
}

section.after-table .container {
    display: grid;
    gap: 3.125rem;
}

.page-template-comparison section.after-table .container {
    max-width: 67rem;
}

/* ======================================== */
/* ACCENT CARDS */
/* ======================================== */

section.accent-cards {
    position: relative;
    z-index: 1;
    margin-block: 5.625rem;
}

section.accent-cards .container {
    display: grid;
    gap: 2.6875rem;
}

section.accent-cards .top {
    text-align: center;
    gap: 2.5rem;
    display: grid;
}

section.accent-cards .top .title {
    z-index: 1;
}

section.accent-cards .cards {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1.3125rem;
    row-gap: 5rem;
}

section.accent-cards .cards .card {
    display: grid;
    flex-grow: 1;
    flex-basis: 17.5rem;
    cursor: pointer;
}

section.accent-cards .cards .card .card-side {
    backface-visibility: hidden;
    grid-area: 1/1;
    background-color: var(--c-orange);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.875rem;
    text-align: center;
    padding: 3.75rem;
    padding-inline: 1.5rem;
    border: 2px solid var(--c-white);
    transform: rotateY(0deg);
    transition: transform 0.3s ease-in-out;
    position: relative;
}

section.accent-cards .cards .card.active .card-side.card-front,
section.accent-cards .cards .card:not(.active) .card-side.card-back {
    transform: rotateY(180deg);
}

section.accent-cards .cards .card .card-side.card-front {
    z-index: 1;
}

section.accent-cards .cards .card .card-side.card-back {
    padding-block: 2rem;
    background-color: var(--c-white);
    border-color: var(--c-orange);
    color: var(--c-blue-purple);
}

section.accent-cards .cards .card .card-side.card-back .card-title {
    font-size: 1.5rem;
    line-height: 1.041667;
    color: var(--c-orange);
}

section.accent-cards .cards .card .card-side.card-back .card-title br {
    display: none;
}

section.accent-cards .cards .card .card-side.card-back .description {
    font-size: 1;
    line-height: 1.5;
}

section.accent-cards .cards .card .card-side .img-wrapper {
    width: 6.6875rem;
    height: 6.6875rem;
}

@media only screen and (max-width: 768px) {
    section.accent-cards .cards {
        row-gap: 2rem;
    }

    section.accent-cards .cards .card .card-side {
        padding: 2rem;
    }
}