* {
    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;
}

img,
video,
iframe {
    display: block;
    inline-size: 100%;
    block-size: auto;
}

button,
label,
input {
    cursor: pointer;
}

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

span:has(> svg:only-child),
svg {
    line-height: 0;
}

ul {
    list-style-type: none;
}

html {
    scroll-behavior: smooth;
    scroll-padding: 6.25rem;
    -webkit-tap-highlight-color: transparent;
}

body:has(dialog[open]) {
    overflow: hidden;
}

/* ======================================== */
/* UTILS */
/* ======================================== */

.titles-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1.875rem;
}

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

.rich-text :is(ul, ol) > *:not(:last-child) {
    margin-block-end: 0.3lh;
}

.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;
}

.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;
}

.sr-only-not-focused:not(:focus-visible) {
    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;
}

.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;
}

.layers {
    display: grid;
}

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

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

.layers > .layer.layer-bg > .img-wrapper.img-wrapper-ratio:only-child {
    block-size: 100%;
}

.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;
}

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

.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;
}

@media (max-width: 768px) {
    :root {
        --container-x-padding: 1.25rem;
    }
}

/* ======================================== */
/* WPCF7 */
/* ======================================== */

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration,
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    display: none;
}

input[type="checkbox"],
input[type="radio"] {
    appearance: none;
    inline-size: var(--eg-form-checkbox-size);
    block-size: var(--eg-form-checkbox-size);
    background-color: var(--eg-form-checkbox-bg);
    flex-shrink: 0;
    cursor: pointer;
}

input[type="checkbox"] {
    border-radius: var(--eg-form-border-radius-checkbox);
}

input[type="radio"] {
    border-radius: var(--eg-form-border-radius-radio);
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
    background-color: var(--eg-form-checkbox-checked-bg);
    background-image: var(--eg-form-icon-check);
    background-repeat: no-repeat;
    background-position: center;
}

input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
    outline: 2px solid var(--on-surface);
    outline-offset: 2px;
}

input:is([type="text"], [type="number"], [type="email"], [type="tel"]),
.wpcf7-styled textarea {
    inline-size: 100%;
    padding-block: var(--eg-form-input-padding-block);
    padding-inline: var(--eg-form-input-padding-inline);
    border: 1px solid var(--eg-form-input-border);
    background-color: var(--eg-form-input-bg);
    border-radius: var(--eg-form-border-radius-input);
    font-size: var(--eg-form-input-font-size);
    font-weight: var(--eg-form-input-weight);
    outline: none;
}

input::placeholder,
textarea::placeholder,
label:has(input[type="file"]) > span:first-child {
    color: rgb(from var(--on-surface) r g b / 0.4);
}

input:is([type="text"], [type="number"], [type="email"], [type="tel"]):focus-visible,
textarea:focus-visible {
    border-color: var(--accent);
    outline: 1px solid var(--accent);
    outline-offset: 0;
}

/* lato-100 - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 100;
    src: url("assets/fonts/lato/lato-v25-latin-100.woff2") format("woff2");
} */
/* lato-100italic - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 100;
    src: url("assets/fonts/lato/lato-v25-latin-100italic.woff2") format("woff2");
} */
/* lato-300 - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 300;
    src: url("assets/fonts/lato/lato-v25-latin-300.woff2") format("woff2");
} */
/* lato-300italic - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 300;
    src: url("assets/fonts/lato/lato-v25-latin-300italic.woff2") format("woff2");
} */
/* lato-regular - latin */
@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 400;
    src: url("assets/fonts/lato/lato-v25-latin-regular.woff2") format("woff2");
}
/* lato-italic - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 400;
    src: url("assets/fonts/lato/lato-v25-latin-italic.woff2") format("woff2");
} */
/* lato-700 - latin */
@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 700;
    src: url("assets/fonts/lato/lato-v25-latin-700.woff2") format("woff2");
}
/* lato-700italic - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 700;
    src: url("assets/fonts/lato/lato-v25-latin-700italic.woff2") format("woff2");
} */
/* lato-900 - latin */
@font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: normal;
    font-weight: 900;
    src: url("assets/fonts/lato/lato-v25-latin-900.woff2") format("woff2");
}
/* lato-900italic - latin */
/* @font-face {
    font-display: swap;
    font-family: "Lato";
    font-style: italic;
    font-weight: 900;
    src: url("assets/fonts/lato/lato-v25-latin-900italic.woff2") format("woff2");
} */

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

:root {
    --primary-1: #132b46;
    --primary-2: #3ba7b8;
    --accent-color: #00b6e6;
    --background-2: #e9eef4;
    --background-1: #ffffff;
    --secondary: #2f97a8;
    --background-3: #5eb8c7;

    --ff-primary: "Lato", sans-serif;
}

.ff-primary {
    font-family: var(--ff-primary);
}

.fs-title-1 {
    font-size: 2.813rem;
    line-height: 1.111;
    letter-spacing: -0.01em;
    font-weight: 400;
}

.fs-title-2 {
    font-size: 2.188rem;
    line-height: 1.229;
    letter-spacing: -0.01em;
    font-weight: 400;
}

.fs-title-3 {
    font-size: 1.875rem;
}

.fs-title-4 {
    font-size: 1.5625rem;
}

.fs-title-5 {
    font-size: 1.4375rem;
}

.fs-body-large {
    font-size: 1.3125rem;
}

.fs-body {
    font-size: 1.125rem;
}

.fs-body-small {
    font-size: 1rem;
    line-height: 1.375;
}

@media only screen and (max-width: 768px) {
    .fs-title-1 {
        font-size: 2rem;
    }

    .fs-title-2 {
        font-size: 1.625rem;
    }
}

.fw-bold {
    font-weight: 700;
}

.fw-black {
    font-weight: 900;
}

[data-theme="light"] {
    --surface: var(--background-1);
    --on-surface: var(--primary-1);
    --accent: var(--accent-color);
    --on-accent: var(--background-1);
    background-color: var(--surface);
    color: var(--on-surface);
}

[data-theme="gray"] {
    --surface: var(--background-2);
    --on-surface: var(--primary-1);
    --accent: var(--accent-color);
    --on-accent: var(--background-1);
    background-color: var(--surface);
    color: var(--on-surface);
}

[data-theme="dark"] {
    --surface: var(--primary-1);
    --on-surface: var(--background-2);
    --accent: var(--accent-color);
    --on-accent: var(--background-1);
    background-color: var(--surface);
    color: var(--on-surface);
}

[data-theme="accent"] {
    --surface: var(--accent-color);
    --on-surface: var(--background-1);
    --accent: var(--background-1);
    --on-accent: var(--primary-1);
    background-color: var(--surface);
    color: var(--on-surface);
}

.chip {
    font-weight: 700;
    font-size: 0.9375rem;
    line-height: 1.333333;
    padding-block: 0.3125rem;
    padding-inline: 0.9375rem;
    border-radius: 999px;
    background-color: var(--background-2);
}

[data-theme="gray"] .chip {
    background-color: var(--background-1);
}

[data-theme="dark"] .chip {
    background-color: rgb(from var(--on-surface) r g b / 0.1);
}

:focus-visible {
    outline-offset: 4px;
    outline: 0px solid var(--on-surface);
    animation:
        focus-ring-in 0.2s forwards,
        focus-ring-out 0.2s 0.2s forwards;
}

@keyframes focus-ring-in {
    to {
        outline-width: 8px;
    }
}

@keyframes focus-ring-out {
    to {
        outline-width: 4px;
    }
}

.btn.btn-secondary,
.btn.btn-primary {
    font-size: 1.125rem;
    letter-spacing: -0.01em;
    padding-block: 1.25rem;
    padding-inline: 1.875rem;
    border-radius: 0.3125rem;
    display: inline-flex;
}

.btn.btn-secondary > span,
.btn.btn-primary > span {
    overflow: hidden;
    display: grid;
}

.btn.btn-secondary > span > span,
.btn.btn-primary > span > span {
    grid-area: 1/1;
    transition: translate 0.2s ease;
}

.btn.btn-secondary > span > span:last-child,
.btn.btn-primary > span > span:last-child {
    translate: 0 100%;
}

.btn.btn-secondary:where(:hover, :focus-visible) > span > span:first-child,
.btn.btn-primary:where(:hover, :focus-visible) > span > span:first-child {
    translate: 0 -100%;
}

.btn.btn-secondary:where(:hover, :focus-visible) > span > span:last-child,
.btn.btn-primary:where(:hover, :focus-visible) > span > span:last-child {
    translate: 0 0;
}

.btn.btn-primary {
    color: var(--background-1);
    background-image: linear-gradient(95deg, var(--accent), var(--primary-2));
}

.btn.btn-secondary {
    color: var(--primary-1);
    background-image: linear-gradient(95deg, var(--background-2), #ced6e0);
}

@media (max-width: 768px) {
    .btn.btn-secondary,
    .btn.btn-primary {
        padding-block: 1rem;
        padding-inline: 1.5rem;
    }
}

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

header.egloo {
    position: absolute;
    inset-block-start: 3.125rem;
    inline-size: 100%;
    z-index: 2;
}

header.egloo img {
    inline-size: auto;
    object-fit: contain;
    max-inline-size: 12.5rem;
    block-size: 4rem;
}

@media (max-width: 768px) {
    header.egloo {
        inset-block-start: 1.5rem;
    }
}

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

section.hero.hero-basic .layers {
    min-block-size: 100vh;
    min-block-size: 100svh;
}

section.hero.hero-basic .layer-bg::after {
    background-image: linear-gradient(rgb(from var(--surface) r g b / 0.2), var(--surface));
}

section.hero.hero-basic .container {
    block-size: 100%;
    display: grid;
    align-content: end;
    padding-block-end: 6.25rem;
}

section.hero.hero-basic .text {
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
    max-inline-size: 48.8125rem;
}

section.hero.hero-basic .ctas {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

@media (max-width: 768px) {
    section.hero.hero-basic .container {
        padding-block-end: 1.75rem;
    }

    section.hero.hero-basic .text {
        gap: 1.875rem;
    }

    section.hero.hero-basic .ctas {
        flex-direction: column;
        align-items: stretch;
    }

    section.hero.hero-basic .ctas .btn {
        text-align: center;
        justify-content: center;
    }
}

/* ======================================== */
/* SLIDER BASE */
/* ======================================== */

section.slider.slider-base {
    overflow: hidden;
}

section.slider.slider-base .container {
    padding-block: 7.5rem;
    display: flex;
    flex-direction: column;
    gap: 4.375rem;
}

section.slider.slider-base .titles-wrapper .description {
    max-inline-size: 55.4375rem;
    margin-inline: auto;
}

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

section.slider.slider-base .swiper-slide {
    max-inline-size: 25rem;
    text-align: center;
}

section.slider.slider-base .swiper-slide .img-wrapper {
    aspect-ratio: 400/281;
    border-radius: 0.5rem;
    margin-block-end: 1.875rem;
}

section.slider.slider-base .swiper-slide .slide-description {
    margin-block-start: 0.9375rem;
    opacity: 0.65;
}

@media (max-width: 768px) {
    section.slider.slider-base .container {
        padding-block: 4.375rem;
        gap: 2.5rem;
    }
}

/* ======================================== */
/* BOXES SHOWCASE */
/* ======================================== */

section.boxes-showcase {
    overflow: hidden;
}

section.boxes-showcase .container {
    padding-block: 7.5rem;
    display: flex;
    flex-direction: column;
    gap: 4.375rem;
}

section.boxes-showcase .titles-wrapper {
    max-inline-size: 48.4375rem;
    margin-inline: auto;
}

section.boxes-showcase .items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--container-gap);
    grid-auto-flow: column;
}

section.boxes-showcase .item {
    background-color: rgb(248 248 248 / 0.7);
    padding-block: 2.5rem;
    padding-inline: 1.5625rem;
    text-align: center;
    border-radius: 0.5rem;
    border: 1px solid rgb(from currentColor r g b / 0.1);
}

section.boxes-showcase .item h3 {
    display: flex;
    flex-direction: column;
    gap: 1.875rem;
}

section.boxes-showcase .item-value {
    font-size: 4.0625rem;
    line-height: 0.769231;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--primary-2);
}

section.boxes-showcase .item-description {
    opacity: 0.63;
    margin-block-start: 0.9375rem;
}

section.boxes-showcase .item:last-child {
    grid-column: span 2;
    grid-row: span 2;
}

section.boxes-showcase .item:has(img) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: white;
    display: grid;
    place-items: center;
}

section.boxes-showcase .item:has(img) .item-value {
    color: inherit;
    font-size: 5.625rem;
    line-height: 0.888889;
}

section.boxes-showcase .item:has(img) .item-title {
    max-inline-size: 20rem;
}

section.boxes-showcase .item:has(img)::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: black;
    opacity: 0.4;
    z-index: -1;
}

section.boxes-showcase .item:has(img) img {
    position: absolute;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    inset: 0;
    z-index: -2;
}

section.boxes-showcase .ctas {
    display: grid;
    place-items: center;
}

@media (max-width: 768px) {
    section.boxes-showcase .container {
        padding-block: 4.375rem;
        gap: 2.5rem;
    }

    section.boxes-showcase .items {
        grid-template-columns: 1fr;
        grid-auto-flow: row;
    }

    section.boxes-showcase .item:last-child {
        grid-column: span 1;
        grid-row: span 1;
    }
}

/* ======================================== */
/* PRICE TABLES */
/* ======================================== */

section.price-tables .container {
    padding-block: 7.5rem;
    display: flex;
    flex-direction: column;
    gap: 4.375rem;
}

section.price-tables .titles-wrapper {
    max-inline-size: 48.4375rem;
    margin-inline: auto;
}

section.price-tables .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));
    gap: 1.875rem;
}

section.price-tables .item {
    border-radius: 0.625rem;
    position: relative;
}

section.price-tables .item:has(.item-chip) {
    outline: 0.375rem solid var(--accent);
}

section.price-tables .item .item-chip {
    position: absolute;
    inset-inline-start: 50%;
    inset-block-start: 0;
    translate: -50% -50%;
    font-size: 0.875rem;
    line-height: 1.428571;
    background-color: var(--accent);
    padding-block: 0.5rem;
    padding-inline: 1.25rem;
    border-radius: 0.625rem;
    color: var(--on-accent);
}

section.price-tables .item .img-wrapper {
    aspect-ratio: 544/339;
    border-start-start-radius: 0.625rem;
    border-start-end-radius: 0.625rem;
}

section.price-tables .item-content {
    padding-block: 2.5rem;
    padding-inline: 2.1875rem;
}

section.price-tables .item-price {
    margin-block: 0.625rem;
    color: var(--accent);
    display: flex;
    align-items: end;
    gap: 0.625rem;
}

section.price-tables .item-price sup {
    vertical-align: top;
}

section.price-tables .item-price-deleted {
    font-size: 1.5625rem;
}

section.price-tables .item-price-current {
    font-size: 2.1875rem;
    line-height: 1.228571;
    font-weight: 900;
}

section.price-tables .item-average {
    margin-block-start: 0.625rem;
    margin-block-end: 1.875rem;
}

section.price-tables .item-description {
    margin-block: 1.875rem;
    color: #364153;
    text-wrap: balance;
}

section.price-tables .item ul {
    margin-block-start: 1.875rem;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    color: rgb(from var(--primary-1) r g b / 0.63);
}

section.price-tables .item ul li {
    padding-inline-start: 2rem;
    position: relative;
}

section.price-tables .item ul li::before {
    content: "";
    position: absolute;
    inline-size: 1rem;
    block-size: 0.75rem;
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.8333 1.5L5.66667 10.6667L1.5 6.5' stroke='%233BA7B8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    inset-inline-start: 0;
    inset-block-start: 0;
}

section.price-tables .item-footnote span {
    color: var(--accent);
}

section.price-tables .item-badge {
    position: absolute;
    inline-size: 12.5rem;
    block-size: 12.5rem;
    background-color: var(--accent);
    color: var(--on-accent);
    border-radius: 50%;
    inset-block-start: 30%;
    inset-inline-end: -1.2rem;
    rotate: 7.65deg;
}

section.price-tables .item-badge p {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    text-align: center;
    justify-content: center;
    align-items: center;
    block-size: 100%;
}

section.price-tables .item-badge p span:first-child {
    font-weight: 900;
    font-size: 0.9375rem;
}

section.price-tables .item-badge p span:nth-child(2) {
    font-weight: 700;
    font-size: 4.0625rem;
    line-height: 0.769231;
}

section.price-tables .icons ul {
    padding-block: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--container-gap);
}

section.price-tables .icons li {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

section.price-tables .icons .icon {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    inline-size: 5rem;
    block-size: 5rem;
    background-color: rgb(from var(--primary-2) r g b / 0.1);
}

section.price-tables .icons li:nth-child(2) span {
    max-inline-size: 25.625rem;
}

section.price-tables .ctas {
    display: grid;
    place-items: center;
}

@media (max-width: 768px) {
    section.price-tables .container {
        padding-block: 4.375rem;
        gap: 2.5rem;
    }

    section.price-tables .item-badge {
        transform-origin: center right;
        inset-block-start: 20%;
        inset-inline-end: calc(-1 * (var(--container-x-padding) / 2));
        inline-size: 10rem;
        block-size: 10rem;
        scale: 0.8;
    }

    section.price-tables .item-badge p {
        gap: 0.5rem;
        padding-inline: 1rem;
    }

    section.price-tables .item-badge p span:nth-child(2) {
        font-size: 2.8125rem;
    }

    section.price-tables .icons ul {
        flex-direction: column;
        align-items: flex-start;
        padding-block: 1.5rem;
    }

    section.price-tables .icons li:nth-child(2) span {
        max-inline-size: 100%;
    }
}

/* ======================================== */
/* VIDEO SHOWCASE */
/* ======================================== */

section.video-showcase .container {
    padding-block: 7.5rem;
    display: flex;
    flex-direction: column;
    gap: 3.125rem;
}

section.video-showcase .video-wrapper {
    border-radius: 0.625rem;
    position: relative;
    overflow: hidden;
    aspect-ratio: 16/9;
}

section.video-showcase .play-btn {
    background-color: #3ba7b8;
    inline-size: 5rem;
    block-size: 5rem;
    position: relative;
    display: grid;
    place-items: center;
    border-radius: 50%;
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    translate: -50% -50%;
}

section.video-showcase .play-btn[data-playing="false"] svg:last-child,
section.video-showcase .play-btn[data-playing="true"] svg:first-child {
    display: none;
}

section.video-showcase .play-btn svg:first-child {
    translate: 19%;
}

section.video-showcase .play-btn {
    transition: opacity 0.4s ease;
}

section.video-showcase .video-wrapper.is-idle .play-btn[data-playing="true"] {
    opacity: 0;
    pointer-events: none;
}

@media (max-width: 768px) {
    section.video-showcase .container {
        padding-block: 4.375rem;
        gap: 2rem;
    }
}

/* ======================================== */
/* STATISTICS */
/* ======================================== */

section.statistics {
    background-image: linear-gradient(82deg, var(--primary-2), var(--accent-color));
}

section.statistics .container {
    padding-block: 3.125rem;
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: var(--container-gap);
    flex-wrap: wrap;
}

section.statistics p {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    text-align: center;
}

section.statistics span:first-child {
    font-size: 3rem;
    line-height: 1;
    font-weight: 700;
}

@media (max-width: 768px) {
    section.statistics .container {
        padding-block: 2.5rem;
        justify-content: center;
        gap: 1.5rem;
    }

    section.statistics p {
        flex: 0 0 40%;
    }

    section.statistics span:first-child {
        font-size: 2rem;
    }
}

/* ======================================== */
/* ICON CARDS */
/* ======================================== */

section.icon-cards .container {
    padding-block: 7.5rem;
    display: flex;
    flex-direction: column;
    gap: 4.375rem;
}

section.icon-cards .titles-wrapper {
    max-inline-size: 42.4375rem;
    margin-inline: auto;
}

section.icon-cards .items {
    display: grid;
    --grid-item-width: 17.5rem;
    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.875rem;
}

section.icon-cards .ctas {
    display: grid;
    place-items: center;
}

section.icon-cards .item {
    padding-block: 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-inline: 2.1875rem;
}

section.icon-cards .item .icon {
    display: grid;
    place-items: center;
    inline-size: 6.25rem;
    block-size: 6.25rem;
    border-radius: 50%;
    background-color: rgb(from var(--primary-2) r g b / 0.1);
    margin-block-end: 1.875rem;
}

section.icon-cards .item p {
    margin-block-start: 0.9375rem;
    opacity: 0.65;
}

@media (max-width: 768px) {
    section.icon-cards .container {
        padding-block: 4.375rem;
        gap: 2.5rem;
    }

    section.icon-cards .items {
        gap: 2.5rem;
    }

    section.icon-cards .item {
        padding: 0;
    }
}

/* ======================================== */
/* FORM WRAPPER */
/* ======================================== */

section.form-wrapper .container {
    padding-block: 7.5rem;
}

section.form-wrapper .container .titles {
    display: flex;
    flex-direction: column;
    gap: 1.875rem;
    text-align: center;
    margin-inline: -1px;
}

@media (max-width: 768px) {
    section.form-wrapper .container {
        padding-block: 4.375rem;
    }
}

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

section.accordions-side .container {
    padding-block: 7.5rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--container-gap);
    align-items: start;
}

section.accordions-side .titles {
    display: flex;
    flex-direction: column;
    align-items: start;
    max-inline-size: 34.0625rem;
}

section.accordions-side .titles .chip {
    margin-block-end: 1.875rem;
}

section.accordions-side .titles .description {
    margin-block-start: 1.25rem;
}

section.accordions-side .items {
    display: flex;
    flex-direction: column;
    gap: 0.9375rem;
}

section.accordions-side .accordion {
    --_px: 2.5rem;
    --_py: 1.5625rem;
    background-color: rgb(233 238 244 / 0.1);
    padding-block: var(--_py);
    padding-inline: var(--_px);
    border-radius: 0.5rem;
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

section.accordions-side .accordion:has([aria-expanded="true"]) {
    --on-surface: var(--primary-1);
    background-color: var(--background-2);
    color: var(--primary-1);
}

section.accordions-side .accordion-title {
    display: flex;
    align-items: start;
    gap: 0.9375rem;
    position: relative;
}

section.accordions-side .accordion-title button {
    text-align: start;
}

section.accordions-side .accordion-title button::after {
    content: "";
    position: absolute;
    inset-inline-start: calc(-1 * var(--_px));
    inset-block-start: calc(-1 * var(--_py));
    inline-size: calc(100% + (2 * var(--_px)));
    block-size: calc(100% + (2 * var(--_py)));
    opacity: 0.3;
}

section.accordions-side .accordion-title-text {
    margin-block-start: 0.2em;
}

section.accordions-side .accordion-title .icon {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: 50%;
    background-color: var(--surface);
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

section.accordions-side .accordion-title:has([aria-expanded="false"]) .icon svg:last-child,
section.accordions-side .accordion-title:has([aria-expanded="true"]) .icon svg:first-child {
    display: none;
}

section.accordions-side .accordion-title:has([aria-expanded="true"]) .icon {
    background-color: var(--background-1);
}

section.accordions-side .content-wrapper {
    display: grid;
    grid-template-rows: 1fr;
    overflow: hidden;
    transition: grid-template-rows 0.2s ease;
}

section.accordions-side .content-wrapper[inert] {
    grid-template-rows: 0fr;
}

section.accordions-side .content-wrapper > div {
    min-block-size: 0;
}

section.accordions-side .content {
    padding-block-start: 1.125rem;
}

@media (max-width: 768px) {
    section.accordions-side .container {
        padding-block: 4.375rem;
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    section.accordions-side .accordion {
        --_px: 1.2rem;
        --_py: 1.2rem;
    }

    section.accordions-side .accordion-title .icon {
        inline-size: 1.5rem;
        block-size: 1.5rem;
    }

    section.accordions-side .accordion-title .icon svg {
        scale: 0.8;
    }

    section.accordions-side .accordion-title-text {
        margin-block-start: 0;
    }
}

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

footer.egloo .start {
    padding-block: 6.5625rem 3.75rem;
    display: grid;
    grid-template-columns: 6fr 4fr 2fr;
    gap: var(--container-gap);
}

footer.egloo .start .intro {
    max-inline-size: 27.0625rem;
    display: flex;
    flex-direction: column;
    gap: 2.8125rem;
}

footer.egloo .start .intro img {
    max-inline-size: 14.5625rem;
}

footer.egloo .start :is(.contacts, .social-media) {
    display: flex;
    flex-direction: column;
    gap: 1.875rem;
}

footer.egloo .start .social-media a {
    display: grid;
    place-items: center;
    position: relative;
    inline-size: 3.125rem;
    block-size: 3.125rem;
    border: 1px solid rgb(from currentColor r g b / 0.1);
    border-radius: 50%;
}

footer.egloo .start .social-media ul {
    display: flex;
    align-items: center;
    gap: 1.875rem;
    flex-wrap: wrap;
}

footer.egloo .end {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: var(--container-gap);
    padding-block: 1.25rem 2.5rem;
    border-block-start: 1px solid rgb(from currentColor r g b / 0.2);
}

footer.egloo .end > * {
    opacity: 0.5;
}

footer.egloo .end ul {
    display: flex;
    align-items: center;
    gap: 3.125rem;
}

@media (max-width: 768px) {
    footer.egloo .start {
        padding-block: 3.75rem 2.5rem;
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    footer.egloo .end {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        text-align: center;
    }

    footer.egloo .end ul {
        justify-content: center;
        gap: 1.5rem;
        flex-wrap: wrap;
    }
}

/* ======================================== */
/* CURSOR */
/* ======================================== */

#custom-cursor {
    background-color: #3ba7b8;
    inline-size: 5.375rem;
    block-size: 5.375rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    scale: 0;
    transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    position: fixed;
    inset-inline-start: -2.6875rem;
    inset-block-start: -2.6875rem;
    z-index: 999;
}

#custom-cursor.visible {
    scale: 1;
}

/* Fade-in */
:where(.fade-in) {
    transition:
        opacity 0.6s ease,
        translate 0.6s ease;
    transition-delay: calc(var(--stagger-i, 0) * 0.1s);
}

:where(.fade-in:not(.fade-in-visible)) {
    opacity: 0;
    translate: 0 1rem;
}

@media (hover: none) {
    #custom-cursor {
        display: none !important;
    }
}
