@import "./vendors/owl.carousel.css";
@import "./vendors/owl.theme.default.css";
@import "./vendors/select2.css";

:root {
    --color-theme: #00446D;
    --color-text: #020202;
    font-size: 100%;
}

body {
    font-size: 1.6rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: var(--color-text);
}

:root {
    --page-width: 1462px;
}

body {
    margin: 0;
}

    body.no-overflow {
        overflow: hidden;
    }

* {
    box-sizing: border-box;
}

img {
    /*display: block;*/
    /*max-width: 100%;*/
    height: auto;
}

ul, ol {
    list-style-type: none;
    padding-left: 0;
}

a {
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    a:visited, a:-webkit-any-link {
        color: currentColor;
    }

        a:focus, a:hover, a:active, a:visited:focus, a:visited:hover, a:visited:active {
            color: var(--color-theme);
        }

figure {
    margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
    margin-block: 0;
}

body {
    min-height: 100vh;
}

.container {
    --padding-inline: 1.6rem;
    max-width: var(--page-width);
    margin-inline: auto;
    padding-inline: var(--padding-inline);
}

@media screen and (min-width: 1200px) {
    .container {
        --padding-inline: 0;
    }
}

.button,
a.button {
    --padding-inline: 2rem;
    --padding-block: 0.9rem;
    --color-primary: #fff;
    --color-secondary: var(--color-theme);
    border-radius: 0.4rem;
    padding: var(--padding-block) var(--padding-inline);
    color: var(--color-primary);
    background-color: var(--color-secondary);
    border: 1px solid var(--color-theme);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-weight: 600;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
}

.button--primary,
a.button--primary {
    --color-primary: #fff;
    --color-secondary: var(--color-theme);
}

    .button--primary:hover,
    a.button--primary:hover {
        --color-secondary: #0065A2;
    }

.button--secondary,
a.button--secondary {
    --color-primary: var(--color-theme);
    --color-secondary: transparent;
}

    .button--secondary:hover,
    a.button--secondary:hover {
        --color-primary: #fff;
        --color-secondary: var(--color-theme);
    }

a.button:hover, a.button:active, a.button:focus, a.button:visited {
    color: var(--color-primary);
}

.header {
    --header-height: 5rem;
    font-weight: 600;
    background-color: #fff;
    position: sticky;
    top: 0;
    z-index: 20;
    transition: top 0.3s ease-in-out;
}

@media screen and (min-width: 992px) {
    .header {
        --header-height: 10rem;
    }
}

.header.hidden {
    top: calc(var(--header-height) * -1);
}

body.no-overflow .header.hidden {
    top: 0;
}

.header.has-border {
    border-bottom: 1px solid #D1D1D1;
}

.header__content {
    display: grid;
    grid-auto-flow: column;
    align-content: center;
    height: var(--header-height);
    gap: 2rem;
}

@media screen and (min-width: 1200px) {
    .header__content {
        gap: 6rem;
    }
}

.header__logo {
    --logo-width: 8.6rem;
    width: var(--logo-width);
    display: flex;
    align-items: center;
}

@media screen and (min-width: 992px) {
    .header__logo {
        --logo-width: 12.2rem;
    }
}

.header__nav {
    display: none;
    transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@media screen and (min-width: 992px) {
    .header__nav {
        display: flex;
        align-items: center;
    }
}

.header__nav.active {
    display: block;
    position: fixed;
    top: var(--header-height);
    left: 0;
    width: 100vw;
    height: calc(100vh - var(--header-height));
    background-color: #fff;
    z-index: 100;
    padding-inline: 1.6rem;
}

@media screen and (min-width: 992px) {
    .header__nav.active {
        display: block;
        position: static;
        width: auto;
        height: auto;
        background-color: #fff;
        z-index: initial;
        padding-inline: initial;
    }
}

.header__nav.active .header__nav-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
    margin-block: 2rem;
}

@media screen and (min-width: 992px) {
    .header__nav.active .header__nav-list {
        flex-direction: initial;
        align-items: center;
        gap: 3rem;
    }
}

.header__nav.active .header__actions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-top: 4rem;
}

@media screen and (min-width: 992px) {
    .header__nav.active .header__actions {
        display: none;
    }
}

.header__nav.active .header__action {
    display: block;
    width: 100%;
}

@media screen and (min-width: 992px) {
    .header__nav.active .header__action {
        display: block;
        width: 100%;
    }
}

.header__nav.active .header__action .button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

@media screen and (min-width: 992px) {
    .header__nav.active .header__action .button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
}

@media screen and (min-width: 992px) {
    .header__nav .header__actions {
        display: none;
    }
}

.header__nav-list {
    display: flex;
    align-items: center;
    gap: 1.8rem;
}

@media screen and (min-width: 1200px) {
    .header__nav-list {
        gap: 3.8rem;
    }
}

.header__nav-link {
    transition: color 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    white-space: nowrap;
    font-size: 1.8rem;
    color: var(--color-text);
}

    .header__nav-link:hover {
        color: var(--color-theme);
    }

@media screen and (min-width: 992px) {
    .header__nav-link {
        font-size: 2rem;
    }
}

.header__actions {
    display: flex;
    align-items: center;
    justify-content: end;
}

@media screen and (min-width: 992px) {
    .header__actions {
        justify-content: initial;
    }
}

.header__action {
    display: none;
}

@media screen and (min-width: 992px) {
    .header__action {
        display: block;
    }
}

.header__action:nth-child(2) {
    margin-right: 1.2rem;
}

.header__action--tel, .header__action--menu {
    display: block;
}

    .header__action--tel .header__action-link {
        display: flex;
        align-items: center;
        color: #0277BD;
        gap: 0.5rem;
        margin-right: 2rem;
    }

@media screen and (min-width: 1200px) {
    .header__action--tel .header__action-link {
        margin-right: 4rem;
    }
}

.header__action--tel .header__action-icon {
    --size: 1.6rem;
    width: var(--size);
    height: var(--size);
}

@media screen and (min-width: 992px) {
    .header__action--menu {
        display: none;
    }
}

.header__action--menu.active .icon-hamburger__line:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.header__action--menu.active .icon-hamburger__line:nth-child(2) {
    opacity: 0;
}

.header__action--menu.active .icon-hamburger__line:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

.header .icon-hamburger {
    width: 1.8rem;
    height: 1.8rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
}

.header .icon-hamburger__line {
    width: 100%;
    height: 0.2rem;
    background-color: #000;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.footer {
    padding-top: 6rem;
    padding-bottom: 2rem;
    background-color: #F7F7F7;
}

@media screen and (min-width: 992px) {
    .footer__content {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-areas: "logo support" "about support" "socials support" "copyright copyright";
    }
}

.footer__logo {
    max-width: 12.2rem;
}

@media screen and (min-width: 992px) {
    .footer__logo {
        grid-area: logo;
    }
}

.footer__about {
    margin-top: 1.6rem;
    display: grid;
    gap: 1rem;
}

@media screen and (min-width: 992px) {
    .footer__about {
        grid-area: about;
        gap: 1.6rem;
    }
}

.footer__about-title {
    font-size: 1.6rem;
    font-weight: 700;
}

.footer__about-content--email {
    display: none;
}

@media screen and (min-width: 992px) {
    .footer__about-content--email {
        display: block;
    }
}

@media screen and (min-width: 992px) {
    .footer__about-content--address {
        max-width: 40rem;
    }
}

.footer__about-content strong {
    font-weight: 500;
}

.footer__about-content a {
    color: #212B22;
}

    .footer__about-content a:hover {
        color: var(--color-theme);
    }

.footer__contact {
    margin-top: 6rem;
}

@media screen and (min-width: 992px) {
    .footer__contact {
        display: none;
    }
}

.footer__contact-title {
    font-size: 2rem;
    font-weight: 600;
}

.footer__contact-description {
    font-size: 1.6rem;
    color: #606060;
    margin-top: 1.2rem;
}

.footer__contact-form {
    margin-top: 2rem;
    height: 4rem;
    width: 100%;
    max-width: 36rem;
    display: grid;
    grid-template-columns: 1fr 6rem;
    border: 1px solid #D4D4D4;
    border-radius: 0.4rem;
    overflow: hidden;
}

    .footer__contact-form input[type=text] {
        height: 100%;
        width: 100%;
        border: none;
        padding-inline: 1.2rem;
        font-size: 1.6rem;
    }

        .footer__contact-form input[type=text]::placeholder {
            color: #999999;
        }

        .footer__contact-form input[type=text]:focus-visible {
            outline-color: #0277BD;
        }

    .footer__contact-form label {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        background-color: var(--color-theme);
        font-weight: 600;
        color: #fff;
        cursor: pointer;
    }

.footer__support {
    display: none;
    justify-content: end;
    align-content: flex-start;
    padding-right: 11.6rem;
}

@media screen and (min-width: 992px) {
    .footer__support {
        display: grid;
        grid-area: support;
    }
}

.footer__support-title {
    font-weight: 600;
    font-size: 2rem;
}

.footer__support-list {
    display: grid;
    gap: 1.6rem;
    margin-top: 2rem;
}

.footer__support-link {
    color: #212B22;
}

.footer__socials {
    position: relative;
    margin-top: 6rem;
    padding-top: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
}

@media screen and (min-width: 992px) {
    .footer__socials {
        grid-area: socials;
        margin-top: 2rem;
        margin-bottom: 0;
        padding-top: 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
}

.footer__socials::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% + 3.2rem);
    height: 1px;
    background-color: #D1D1D1;
}

@media screen and (min-width: 992px) {
    .footer__socials::after {
        content: none;
    }
}

.footer__social-link {
    --size: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    border: 1px solid var(--color-text);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .footer__social-link:hover {
        border-color: var(--color-theme);
        color: var(--color-theme);
    }

    .footer__social-link img {
        max-width: 1.5rem;
    }

.footer__copyright {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
    font-size: 1.2rem;
    gap: 0.4rem;
}

@media screen and (min-width: 992px) {
    .footer__copyright {
        grid-area: copyright;
        padding-top: 2rem;
        border-top: 1px solid #D1D1D1;
    }
}

.breadcrumb {
    background-color: #F7F7F7;
    padding-block: 1.4rem;
}

.breadcrumb__list {
    display: flex;
    gap: 1.2rem;
    flex-wrap: wrap;
    align-items: center;
    margin-block: 0;
    padding-left: 15px;
}

.breadcrumb__item {
    display: flex;
    gap: 1.2rem;
    position: relative;
    align-items: center;
}

    .breadcrumb__item:not(:last-child):after {
        content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgNiAxMCI+CiAgPGcgaWQ9Im5vdW5fQXJyb3dfRG93bl8xMDg5NyIgZGF0YS1uYW1lPSJub3VuX0Fycm93IERvd25fMTA4OTciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYpIHJvdGF0ZSg5MCkiPgogICAgPHBhdGggaWQ9IlBhdGhfMTY2NCIgZGF0YS1uYW1lPSJQYXRoIDE2NjQiIGQ9Ik01LDBhLjU2OS41NjksMCwwLDAtLjQxNi4xODVMLjE3Miw0LjkyMmEuNjY1LjY2NSwwLDAsMCwwLC44OTMuNTYuNTYsMCwwLDAsLjgzMiwwTDUsMS41MjQsOSw1LjgxNWEuNTYuNTYsMCwwLDAsLjgzMiwwLC42NjUuNjY1LDAsMCwwLDAtLjg5M0w1LjQxNi4xODVBLjU2OS41NjksMCwwLDAsNSwwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIvPgogIDwvZz4KPC9zdmc+Cg==");
    }

.breadcrumb__link {
    transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
    white-space: normal;
}

    .breadcrumb__link:hover {
        color: var(--color-theme);
    }

.section {
    --padding-block: 3rem;
    padding-block: var(--padding-block);
}

.section--no-top-spacing {
    padding-top: 0;
}

.section--no-bottom-spacing {
    padding-bottom: 2rem;
}

.section--no-spacing {
    --padding-block: 0;
}

.section__header {
    margin-bottom: 3rem;
}

@media screen and (min-width: 992px) {
    .section__header {
        margin-bottom: 5rem;
    }
}

.section__title {
    font-size: 3rem;
    font-weight: 600;
    text-align: center;
    color: var(--color-text);
}

@media screen and (min-width: 992px) {
    .section__title {
        font-size: 3.6rem;
    }
}

.section__title--alternate {
    color: #fff;
}

.tabs {
    display: grid;
    gap: 3rem;
}

.tabs__list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;
}

@media screen and (min-width: 992px) {
    .tabs__list {
        gap: 4.4rem;
    }
}

.tabs__item-link {
    color: #606060;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .tabs__item-link:hover {
        color: var(--color-theme);
    }

.tabs__item.active .tabs__item-link {
    color: var(--color-theme);
}

.tabs__content-item {
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .tabs__content-item.active {
        opacity: 1;
        visibility: visible;
    }

.tabs__content-list {
    display: grid;
    overflow: hidden;
}

.tabs__content-item {
    grid-row: 1/2;
    grid-column: 1/2;
    height: min-content;
}

.news__list {
    display: grid;
    gap: 3rem;
}

@media screen and (min-width: 768px) {
    .news__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (min-width: 992px) {
    .news__list {
        grid-template-columns: repeat(3, 1fr);
    }
}

.news__item-image {
    border-radius: 1rem;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 361/250;
}

    .news__item-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.news__item-title {
    font-size: 2rem;
    font-weight: 600;
    margin-top: 2rem;
}

.news__item-date {
    color: #888888;
    margin-top: 1.6rem;
}

.news__item-link {
    color: var(--color-text);
    transition: color 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .news__item-link:hover {
        color: #2D8C28;
    }

.news__pagination {
    margin-top: 6rem;
}

.news__pagination-list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.6rem;
    color: #999;
}

.news__pagination-link {
    --size: 3rem;
    width: var(--size);
    height: var(--size);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #999;
    color: #999;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.news__pagination-item:not(.news__pagination-item--active) .news__pagination-link:hover {
    color: var(--color-theme);
    border-color: var(--color-theme);
}

.news__pagination-item--active:hover .news__pagination-link {
    color: #fff;
}

.news__pagination-item--active .news__pagination-link {
    color: #fff;
    border-color: var(--color-theme);
    background-color: var(--color-theme);
}

.news__pagination-item--active img {
    transform: rotateY(-180deg);
}

.news__pagination-item--prev .news__pagination-link::before {
    content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgNiAxMCI+CiAgPGcgaWQ9Im5vdW5fQXJyb3dfRG93bl8xMDg5NyIgZGF0YS1uYW1lPSJub3VuX0Fycm93IERvd25fMTA4OTciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYpIHJvdGF0ZSg5MCkiPgogICAgPHBhdGggaWQ9IlBhdGhfMTY2NCIgZGF0YS1uYW1lPSJQYXRoIDE2NjQiIGQ9Ik01LDZhLjU2OS41NjksMCwwLDEtLjQxNi0uMTg1TC4xNzIsMS4wNzhhLjY2NS42NjUsMCwwLDEsMC0uODkzQS41Ni41NiwwLDAsMSwxLC4xODVMNSw0LjQ3Niw5LC4xODVhLjU2LjU2LDAsMCwxLC44MzIsMCwuNjY1LjY2NSwwLDAsMSwwLC44OTNMNS40MTYsNS44MTVBLjU2OS41NjksMCwwLDEsNSw2WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIgZmlsbD0iIzY1Njc2YiIvPgogIDwvZz4KPC9zdmc+Cgo=");
}

.news__pagination-item--prev:hover .news__pagination-link::before {
    content: url("data:image/svg+xml;base64,CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDYgMTAiPgogIDxnIGlkPSJub3VuX0Fycm93X0Rvd25fMTA4OTciIGRhdGEtbmFtZT0ibm91bl9BcnJvdyBEb3duXzEwODk3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2KSByb3RhdGUoOTApIj4KICAgIDxwYXRoIGlkPSJQYXRoXzE2NjQiIGRhdGEtbmFtZT0iUGF0aCAxNjY0IiBkPSJNNSw2YS41NjkuNTY5LDAsMCwxLS40MTYtLjE4NUwuMTcyLDEuMDc4YS42NjUuNjY1LDAsMCwxLDAtLjg5M0EuNTYuNTYsMCwwLDEsMSwuMTg1TDUsNC40NzYsOSwuMTg1YS41Ni41NiwwLDAsMSwuODMyLDAsLjY2NS42NjUsMCwwLDEsMCwuODkzTDUuNDE2LDUuODE1QS41NjkuNTY5LDAsMCwxLDUsNloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGZpbGw9IiMyRDhDMjgiLz4KICA8L2c+Cjwvc3ZnPgoK");
}

.news__pagination-item--next .news__pagination-link::before {
    content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2IiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgNiAxMCI+CiAgPGcgaWQ9Im5vdW5fQXJyb3dfRG93bl8xMDg5NyIgZGF0YS1uYW1lPSJub3VuX0Fycm93IERvd25fMTA4OTciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYpIHJvdGF0ZSg5MCkiPgogICAgPHBhdGggaWQ9IlBhdGhfMTY2NCIgZGF0YS1uYW1lPSJQYXRoIDE2NjQiIGQ9Ik01LDBhLjU2OS41NjksMCwwLDAtLjQxNi4xODVMLjE3Miw0LjkyMmEuNjY1LjY2NSwwLDAsMCwwLC44OTMuNTYuNTYsMCwwLDAsLjgzMiwwTDUsMS41MjQsOSw1LjgxNWEuNTYuNTYsMCwwLDAsLjgzMiwwLC42NjUuNjY1LDAsMCwwLDAtLjg5M0w1LjQxNi4xODVBLjU2OS41NjksMCwwLDAsNSwwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIgZmlsbD0iIzY1Njc2YiIvPgogIDwvZz4KPC9zdmc+CgoK");
}

.news__pagination-item--next:hover .news__pagination-link::before {
    content: url("data:image/svg+xml;base64,CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDYgMTAiPgogIDxnIGlkPSJub3VuX0Fycm93X0Rvd25fMTA4OTciIGRhdGEtbmFtZT0ibm91bl9BcnJvdyBEb3duXzEwODk3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2KSByb3RhdGUoOTApIj4KICAgIDxwYXRoIGlkPSJQYXRoXzE2NjQiIGRhdGEtbmFtZT0iUGF0aCAxNjY0IiBkPSJNNSwwYS41NjkuNTY5LDAsMCwwLS40MTYuMTg1TC4xNzIsNC45MjJhLjY2NS42NjUsMCwwLDAsMCwuODkzLjU2LjU2LDAsMCwwLC44MzIsMEw1LDEuNTI0LDksNS44MTVhLjU2LjU2LDAsMCwwLC44MzIsMCwuNjY1LjY2NSwwLDAsMCwwLS44OTNMNS40MTYuMTg1QS41NjkuNTY5LDAsMCwwLDUsMFoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGZpbGw9IiMyRDhDMjgiLz4KICA8L2c+Cjwvc3ZnPgo=");
}

.customers {
    background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8) 100%), url(/assets/image/3d-rendering-point-sale-system-store-management.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.customer {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    gap: 1rem;
}

@media screen and (min-width: 992px) {
    .customer {
        grid-template-columns: unset;
        justify-items: center;
        gap: unset;
    }
}

.customer__image {
    --size: 13rem;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    border: 5px solid #fff;
    overflow: hidden;
}

    .customer__image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.customer__content {
    display: grid;
    align-items: center;
    align-content: center;
    gap: 1rem;
}

@media screen and (min-width: 992px) {
    .customer__content {
        text-align: center;
    }
}

.customer__title {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
}

@media screen and (min-width: 992px) {
    .customer__title {
        font-size: 2.2rem;
        margin-top: 1.6rem;
    }
}

.customer__description {
    color: #C5C5C5;
}

    .customer__description:last-child {
        display: none;
    }

@media screen and (min-width: 992px) {
    .customer__description:last-child {
        display: block;
    }
}

.products__list {
    display: grid;
    column-gap: 1.6rem;
    row-gap: 3rem;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
}

@media screen and (min-width: 992px) {
    .products__list {
        grid-template-columns: repeat(4, 1fr);
        column-gap: 3rem;
    }
}

.product:hover .product__image::before,
.product:hover .product__image .button {
    opacity: 1;
    visibility: visible;
}

.product__image {
    background-color: #F7F7F7;
    aspect-ratio: 270/230;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 1rem;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

    .product__image::before {
        content: "";
        background-color: rgba(0, 0, 0, 0.4);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .product__image img {
        max-width: 65%;
        max-height: 90%;
    }

@media screen and (min-width: 992px) {
    .product__image img {
        max-width: 80%;
        max-height: 90%;
    }
}

.product__image .button {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.product__title {
    font-size: 2rem;
    font-weight: 600;
    margin-top: 2rem;
}

@media screen and (min-width: 992px) {
    .product__title {
        font-size: 2.2rem;
    }
}

.product__brand {
    color: #606060;
    margin-top: 1.6rem;
}

@media screen and (min-width: 992px) {
    .product__brand {
        font-size: 1.8rem;
    }
}

.product__prices {
    margin-top: 1.6rem;
    display: flex;
    align-items: center;
    gap: 1.6rem;
}

.product__price {
    font-size: 2rem;
    font-weight: 600;
    color: #2D8C28;
}

.product__price--sale {
    color: #EF5E4C;
}

    .product__price--sale + .product__price.product__price--old {
        color: #606060;
        font-size: 1.6rem;
        font-weight: 400;
        text-decoration: line-through;
    }

.product__load-more-button {
    margin-top: 4rem;
    width: min-content;
    min-width: 17.8rem;
    margin-inline: auto;
}

/* Search box */
.search {
    position: relative;
    width: 95%;
}

.search__input {
    height: 4rem;
    border-radius: 1rem;
    border: 1px solid #D4D4D4;
    width: 100%;
    padding-left: 4rem;
    font-size: 1.6rem;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .search__input:focus, .search__input:focus-visible {
        outline-color: #0277BD;
    }

    .search__input::placeholder {
        color: #999999;
    }

.search__label {
    --size: 4rem;
    position: absolute;
    top: 0;
    left: 0;
    width: var(--size);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* Select box */
/*.form .custom-select + .select2 {
    width: 100% !important;
}

.select2 {
    --border-radius: 0.6rem;
}

.select2-container.select2-container--default.select2-container--open .select2-selection--single {
    border-bottom-right-radius: 0.6rem;
    border-bottom-left-radius: 0.6rem;
    border-color: #D4D4D4;
}

.select2-container.select2-container--default.select2-container--open .select2-dropdown {
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.12);
    border: none;
    margin-bottom: 0.2rem;
    overflow: hidden;
}

.select2-container.select2-container--default.select2-container--open .select2-dropdown--below {
    margin-top: 0.2rem;
    margin-bottom: 0;
    border-top-left-radius: 0.6rem;
    border-top-right-radius: 0.6rem;
}

.select2-container.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #0277BD;
}

.select2-container.select2-container--default.select2-container--focus .select2-selection__arrow::before {
    content: url("data:image/svg+xml;base64,PHN2ZyBpZD0iR3JvdXBfMjM1MTEiIGRhdGEtbmFtZT0iR3JvdXAgMjM1MTEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMjAgMjAiPgogIDxyZWN0IGlkPSJSZWN0YW5nbGVfMTA0NDQiIGRhdGEtbmFtZT0iUmVjdGFuZ2xlIDEwNDQ0IiB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IiNmZmYiLz4KICA8ZyBpZD0ibm91bl9BcnJvd19Eb3duXzEwODk3IiBkYXRhLW5hbWU9Im5vdW5fQXJyb3cgRG93bl8xMDg5NyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyA3KSI+CiAgICA8cGF0aCBpZD0iUGF0aF8xNjY0IiBkYXRhLW5hbWU9IlBhdGggMTY2NCIgZD0iTTcsN2EuODc2Ljg3NiwwLDAsMS0uNTgyLS4yMTZMLjI0MSwxLjI1N2EuNjgzLjY4MywwLDAsMSwwLTEuMDQyLjg5NC44OTQsMCwwLDEsMS4xNjQsMEw3LDUuMjIyLDEyLjU5NC4yMTZhLjg5NC44OTQsMCwwLDEsMS4xNjQsMCwuNjgzLjY4MywwLDAsMSwwLDEuMDQyTDcuNTgyLDYuNzg0QS44NzYuODc2LDAsMCwxLDcsN1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGZpbGw9IiMwMjc3QkQiLz4KICA8L2c+Cjwvc3ZnPgoK");
}

.select2-container.select2-container--default.select2-container--disabled {
    pointer-events: none;
    cursor: pointer;
}

    .select2-container.select2-container--default.select2-container--disabled .select2-selection--single {
        background-color: #F3F3F3;
    }

        .select2-container.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
            color: #C5C5C5;
        }

.select2-container.select2-container--default .select2-results .select2-results__option {
    padding-inline: 1.2rem;
    color: var(--color-text);
    min-height: 4rem;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.select2-container.select2-container--default .select2-results .select2-results__option--highlighted[aria-selected] {
    background-color: #F3F3F3;
}

    .select2-container.select2-container--default .select2-results .select2-results__option--highlighted[aria-selected]::after {
        content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8ZyBpZD0iR3JvdXBfMzQ3MyIgZGF0YS1uYW1lPSJHcm91cCAzNDczIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzQ1IC0yMzc3KSI+CiAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlXzEwNDM0IiBkYXRhLW5hbWU9IlJlY3RhbmdsZSAxMDQzNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3NDUgMjM3NykiCiAgICAgIGZpbGw9InRyYW5zcGFyZW50IiAvPgogICAgPGcgaWQ9Ikdyb3VwXzM0NjAiIGRhdGEtbmFtZT0iR3JvdXAgMzQ2MCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzQ1IDIzNzkpIj4KICAgICAgPHBhdGggaWQ9IlBhdGhfMTc2NTAiIGRhdGEtbmFtZT0iUGF0aCAxNzY1MCIKICAgICAgICBkPSJNMzUuNjkyLDk4MS4zNGExLjA3OCwxLjA3OCwwLDAsMC0uNzU0LjM0OGMtMi43MjMsMi44MzktNS42MzcsNi4wOTItOC4zNTcsOC45NjNMMjIuNyw5ODcuMzI0YTEuMDY3LDEuMDY3LDAsMCwwLTEuMTIzLS4yNjUsMS4xMzIsMS4xMzIsMCwwLDAtLjczMi45MjYsMS4xNjEsMS4xNjEsMCwwLDAsLjQ2NywxLjFsNC42NjMsNGExLjA2NiwxLjA2NiwwLDAsMCwxLjQ3NC0uMDcxYzIuOTQ4LTMuMDc0LDYuMTQ4LTYuNjc2LDkuMDUxLTkuN2ExLjE3NSwxLjE3NSwwLDAsMCwuMjQ3LTEuMjcsMS4xLDEuMSwwLDAsMC0xLjA1My0uNjkyWiIKICAgICAgICB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjAuODMyIC05ODEuMzM5KSIgZmlsbD0iIzAyNzdCRCIgLz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPg==");
    }

.select2-container.select2-container--default .select2-results .select2-dropdown {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
}

.select2 .select2-selection {
    border-radius: var(--border-radius);
    border-color: #D4D4D4;
    height: 4rem;
    display: flex;
    align-items: center;
}

.form .select2 .select2-selection {
    height: 5.6rem;
}

.select2 .select2-selection .select2-selection__arrow {
    top: 60%;
    transform: translateY(-50%);
    right: 1.2rem;
}

    .select2 .select2-selection .select2-selection__arrow::before {
        content: url("data:image/svg+xml;base64,PHN2ZyBpZD0iR3JvdXBfMjM1MTEiIGRhdGEtbmFtZT0iR3JvdXAgMjM1MTEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMjAgMjAiPgogIDxyZWN0IGlkPSJSZWN0YW5nbGVfMTA0NDQiIGRhdGEtbmFtZT0iUmVjdGFuZ2xlIDEwNDQ0IiB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9InRyYW5zcGFyZW50Ii8+CiAgPGcgaWQ9Im5vdW5fQXJyb3dfRG93bl8xMDg5NyIgZGF0YS1uYW1lPSJub3VuX0Fycm93IERvd25fMTA4OTciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMgNykiPgogICAgPHBhdGggaWQ9IlBhdGhfMTY2NCIgZGF0YS1uYW1lPSJQYXRoIDE2NjQiIGQ9Ik03LDdhLjg3Ni44NzYsMCwwLDEtLjU4Mi0uMjE2TC4yNDEsMS4yNTdhLjY4My42ODMsMCwwLDEsMC0xLjA0Mi44OTQuODk0LDAsMCwxLDEuMTY0LDBMNyw1LjIyMiwxMi41OTQuMjE2YS44OTQuODk0LDAsMCwxLDEuMTY0LDAsLjY4My42ODMsMCwwLDEsMCwxLjA0Mkw3LjU4Miw2Ljc4NEEuODc2Ljg3NiwwLDAsMSw3LDdaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIiBmaWxsPSIjOTk5Ii8+CiAgPC9nPgo8L3N2Zz4K");
    }

    .select2 .select2-selection .select2-selection__arrow [role=presentation] {
        display: none;
    }

.select2 .select2-selection .select2-selection__rendered {
    padding-left: 1.2rem;
}*/

/* Form elements */
.form__input:focus,
.form.submitted .form__group:not(.form__group--has-overlay) .form__input:required:focus,
.form.submitted .form__group--has-overlay:has(.form__input:required:focus),
.form__group.form__group--has-overlay:has(.form__input:focus),
.form.submitted select:focus + .select2 .select2-selection,
.form__textarea:focus {
    border-color: #0277BD;
    outline: 1px solid #0277BD;
    outline-color: #0277BD;
}

.form.submitted .form__group:not(.form__group--has-overlay) .form__input:required:invalid:focus,
.form.submitted .form__group--has-overlay:has(.form__input:required:invalid:focus) {
    border-color: #EF5E4C;
    outline: 1px solid #EF5E4C;
    outline-color: #EF5E4C;
}

.form {
    display: grid;
    gap: 1.2rem;
}

.form__row {
    display: grid;
    gap: 1.2rem;
}

@media screen and (min-width: 992px) {
    .form__row {
        grid-template-columns: repeat(2, 1fr);
    }
}

.form__group {
    position: relative;
    background-color: #fff;
}

.form__group--has-overlay {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    padding-block: 0.4rem;
    padding-right: 0.4rem;
    border-radius: 0.6rem;
    border: 1px solid #D4D4D4;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .form__group--has-overlay .form__input {
        height: 100%;
        border: none;
        outline: none;
    }

.form__group:has(.form__input:focus) .form__label:not(.form__label--static), .form__group:has(.form__input:not(:placeholder-shown)) .form__label:not(.form__label--static) {
    font-size: 1.2rem;
    top: 0.7rem;
    transform: none;
}

.form__group:has(:required) .form__label::after {
    content: "*";
    color: #EF5E4C;
    display: inline-block;
    margin-left: 0.4rem;
    font-weight: 600;
    vertical-align: middle;
}

.form__group:has(option:checked:not([value=""])) .form__label:not(.form__label--static) {
    display: none;
}

.form__label {
    position: absolute;
    left: 1.2rem;
    top: 50%;
    font-size: 1.6rem;
    transform: translateY(-50%);
    line-height: 1;
    transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    color: #65676B;
}

.form__label--static {
    position: static;
    transform: none;
}

.form__input, .form__textarea {
    border-radius: 0.6rem;
    border: 1px solid #D4D4D4;
    overflow: hidden;
    width: 100%;
    padding-inline: 1.2rem;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.form__input {
    font-size: 1.6rem;
    /*height: 5.6rem;*/
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .form__input::placeholder {
        opacity: 0;
        visibility: hidden;
    }

    .form__input:focus, .form__input:not(:placeholder-shown) {
        padding-top: 2rem;
    }

        .form__input:focus::placeholder {
            opacity: 0;
            visibility: hidden;
        }

.form__textarea {
    min-height: 8rem;
    font-size: 1.6rem;
    font-family: inherit;
}

.form__input-overlay {
    height: 4.8rem;
    border-radius: 0.5rem;
    right: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F3F3F3;
    padding-inline: 0.7rem;
    line-height: 1;
}

.form .button {
    --padding-block: 1.1rem;
}

.form.submitted .form__input:required:invalid, .form.submitted select:invalid + .select2 .select2-selection, .form.submitted .form__group--has-overlay:has(.form__input:required:invalid) {
    border-color: #EF5E4C;
}

.modal {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
}

    .modal.active {
        display: grid;
        align-items: center;
        justify-content: center;
        z-index: 99999;
        overflow-y: scroll;
        max-height: 100%;
    }

.modal__inner {
    width: fit-content;
    position: relative;
}

.modal__content {
    border-radius: 1rem;
    overflow: hidden;
    background-color: #fff;
    position: relative;
}

.modal__title {
    font-size: 2.4rem;
    font-weight: 600;
    text-align: center;
}

@media screen and (min-width: 992px) {
    .modal__title {
        font-size: 2.6rem;
    }
}

.modal__close {
    --offset: 2rem;
    position: absolute;
    top: var(--offset);
    right: var(--offset);
}

    .modal__close:after {
        content: url(/assets/image/icon/crossmark.svg);
    }

.owl-carousel.owl-carousel {
    display: block;
    opacity: 0;
    visibility: hidden;
}

.owl-carousel.owl-loaded {
    opacity: 1;
    visibility: visible;
}

.owl-carousel .owl-stage-outer,
.owl-carousel .owl-stage,
.owl-carousel .owl-item {
    height: 100%;
}

.owl-carousel .owl-dots {
    /*--offset: 1rem;*/
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    position: absolute;
    bottom: var(--offset);
    left: 0;
    width: 100%;
}

.owl-carousel .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
}

    .owl-carousel .owl-nav button[class^=owl] {
        --size: 5rem;
        --color-border: var(--color-theme);
        --offset: 3rem;
        width: var(--size);
        height: var(--size);
        border-radius: 50%;
        border: 1px solid var(--color-border);
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
    }

.owl-carousel .owl-nav button[class^=owl]::before {
    display: block;
    width: 2rem;
    height: 2rem;
    content: url(/assets/image/icon/chevron-right-green.svg);
}

.owl-carousel .owl-nav button[class^=owl].owl-prev {
    left: calc((var(--size) + var(--offset)) * -1);
}

.owl-carousel .owl-nav button[class^=owl].owl-prev::before {
    transform: rotate(-180deg);
}

.owl-carousel .owl-nav button[class^=owl].owl-next {
    right: calc((var(--size) + var(--offset)) * -1);
}

.owl-carousel .owl-nav button[class^=owl].owl-next::before {
    position: relative;
    left: 0.1rem;
}

.owl-carousel .owl-nav button[class^=owl].disabled {
    --color-border: #CED0D4;
}

.owl-carousel .owl-nav button[class^=owl].disabled::before {
    content: url(/assets/image/icon/chevron-right.svg);
}

.owl-carousel .owl-nav button[class^=owl] span {
    display: none;
}

.owl-carousel button.owl-dot {
    --size: 0.8rem;
    width: var(--size);
    height: var(--size);
    background: #C5C5C5;
    border-radius: 50%;
    overflow: hidden;
}

.owl-carousel button.owl-dot.active {
    background-color: var(--color-theme);
}

.owl-carousel button.owl-dot:focus-visible {
    outline-color: transparent;
}

.hero__slider {
    margin-block: 0;
    position: relative;
}

.hero__slide {
    background-color: #F6FEF8;
    position: relative;
}

.hero__slide-inner {
    padding-top: 1.2rem;
    padding-bottom: 3.4rem;
    display: grid;
    justify-items: center;
    text-align: center;
    position: absolute;
    z-index: 1;
}

.hero__slide-inner[data-position="1"] {
    top: 0%;
    left: 10%;
}

.hero__slide-inner[data-position="2"] {
    top: 0%;
    left: 55%;
}

.hero__slide-inner[data-color="1"] {
    color: #eee
}

.hero__slide-inner[data-color="2"] {
    color: black
}

.hero__slide-inner[data-color="3"] {
    color: limegreen
}

.hero__slide-inner[data-color="4"] {
    color: #005d8c
}

@media screen and (min-width: 992px) {
    .hero__slide-inner {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        min-height: 60rem;
    }
}

@media screen and (min-width: 992px) {
    .hero__slide-content {
        display: grid;
        align-content: center;
    }
}

.hero__slide-deco-image {
    width: 60%;
    position: absolute;
    top: -26%;
    right: -9%;
}

@media screen and (min-width: 992px) {
    .hero__slide-deco-image {
        display: none;
    }
}

.hero__slide-image {
    position: relative;
    display: block;
    z-index: 1;
}

.hero__slide-image--mobile {
    min-width: 22.6rem;
    width: 50%;
}

@media screen and (min-width: 992px) {
    .hero__slide-image--mobile {
        display: none;
    }
}

.hero__slide-image--desktop {
    display: none;
    width: 50%;
    position: absolute;
    right: 0;
    height: 100%;
}

@media screen and (min-width: 992px) {
    .hero__slide-image--desktop {
        display: block;
    }
}

.hero__slide-image--desktop::after {
    content: "";
    position: absolute;
    left: 0%;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #F6FEF8, transparent 15%);
}

.hero__slide-image--desktop img {
    height: 100%;
    object-fit: cover;
}

.hero__slide-title {
    font-size: 3.5rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.15;
    margin-top: 2rem;
}

@media screen and (min-width: 992px) {
    .hero__slide-title {
        font-size: 4.5rem;
        font-weight: 600;
        text-align: left;
        white-space: nowrap;
        z-index: 1;
    }
}

.hero__slide-description {
    font-size: 1.2rem;
    margin-top: 0.5rem;
}

@media screen and (min-width: 992px) {
    .hero__slide-description {
        font-size: 2.2rem;
        text-align: left;
        margin-top: 1.2rem;
        z-index: 1;
    }
}

.hero__slide .button {
    margin-top: 2rem;
    color: #fff;
}

@media screen and (min-width: 992px) {
    .hero__slide .button {
        --padding-block: 1.7rem;
        justify-self: flex-start;
        margin-top: 3.8rem;
    }
}

.intro__list {
    display: grid;
    gap: 1.6rem;
}

@media screen and (min-width: 992px) {
    .intro__list {
        grid-template-columns: repeat(3, 1fr);
        gap: 3rem;
    }
}

.intro__item {
    border-radius: 1rem;
    border: 1px solid #D4D4D4;
    padding-block: 4rem;
    padding-inline: 1rem;
    text-align: center;
}

@media screen and (min-width: 992px) {
    .intro__item {
        padding-block: 4rem;
        padding-inline: 2rem;
    }
}

.intro__item-illustration {
    display: block;
    width: fit-content;
    position: relative;
    margin-inline: auto;
}

.intro__item-icon {
    position: absolute;
    top: 10%;
    left: -25%;
}

.intro__item-title {
    font-size: 2rem;
    font-weight: 600;
    margin-top: 2.4rem;
}

@media screen and (min-width: 992px) {
    .intro__item-title {
        font-size: 2.2rem;
    }
}

.intro__item-description {
    color: #606060;
    margin-top: 1.2rem;
}

.features__cards {
    display: grid;
    gap: 1.6rem;
}

@media screen and (min-width: 992px) {
    .features__cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 3rem;
    }
}

.features__card {
    border-radius: 1rem;
    border: 1px solid #D4D4D4;
    padding: 3rem;
    display: grid;
}

.features__card-icon {
    --size: 5rem;
    border-radius: 1rem;
    overflow: hidden;
    background-color: #E0F5E4;
    display: grid;
    place-content: center;
    width: var(--size);
    height: var(--size);
}

.features__card-title {
    font-size: 2rem;
    font-weight: 600;
    margin-top: 2.4rem;
}

.features__list {
    padding-left: 2.3rem;
    margin-top: 1.6rem;
    display: grid;
    gap: 0.8rem;
}

.features__item {
    list-style-image: url(/assets/image/icon/checkmark.svg);
    padding-left: 1rem;
}

.page-home .categories {
    /*background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8) 100%), url("/assets/image/market.jpg");*/
    background-size: cover;
    background-repeat: no-repeat;
}

.page-home .categories__list {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 13.2rem;
}

@media screen and (min-width: 568px) {
    .page-home .categories__list {
        grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    }
}

@media screen and (min-width: 992px) {
    .page-home .categories__list {
        grid-template-columns: repeat(auto-fill, minmax(27rem, 1fr));
        grid-auto-rows: 15.2rem;
        gap: 3rem;
    }
}

.page-home .categories__item {
    border-radius: 1rem;
    background-color: #fff;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 1.2rem;
    padding: 2rem;
}

.page-home .categories__item-icon {
    width: 3rem;
}

@media screen and (min-width: 992px) {
    .page-home .categories__item-icon {
        width: 5rem;
    }
}

.page-home .categories__item-title {
    font-size: 2rem;
    font-weight: 600;
    text-align: center;
}

.page-home .intro-video__content {
    display: flex;
    justify-content: center;
}

    .page-home .intro-video__content iframe {
        aspect-ratio: 16/9;
        width: 100%;
        max-width: 80rem;
    }

.page-home .section.support {
    --padding-block: 4rem;
}

@media screen and (min-width: 768px) {
    .page-home .section.support {
        --padding-block: 2rem;
    }
}

.page-home .support {
    background-color: var(--color-theme);
}

.page-home .support__list {
    display: grid;
    gap: 4rem;
    margin: 0;
}

@media screen and (min-width: 568px) {
    .page-home .support__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (min-width: 768px) {
    .page-home .support__list {
        grid-template-columns: repeat(3, 1fr);
    }
}

.page-home .support__item {
    display: grid;
    gap: 1.5rem;
    justify-items: center;
}

@media screen and (min-width: 992px) {
    .page-home .support__item {
        grid-auto-flow: column;
        justify-items: initial;
        justify-content: start;
    }
}

.page-home .support__item-icon {
    --size: 6rem;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-home .support__item-header {
    display: grid;
    align-content: center;
    text-align: center;
    gap: 0.5rem;
}

@media screen and (min-width: 992px) {
    .page-home .support__item-header {
        text-align: left;
    }
}

.page-home .support__item-title {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
}

.page-home .support__item-description {
    color: #D4D4D4;
}

.page-home .products {
    background-color: #F7F7F7;
}

    .page-home .products .product__image {
        background-color: #fff;
    }

    .page-home .products .owl-carousel .owl-dots {
        --offset: -0.8rem;
    }

.page-home .products__list {
    margin: 0;
    padding-bottom: 3rem;
}

    .page-home .products__list.owl-carousel {
        opacity: 1;
        visibility: visible;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    }

@media screen and (min-width: 768px) {
    .page-home .products__list.owl-carousel {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (min-width: 992px) {
    .page-home .products__list.owl-carousel {
        display: block;
    }
}

.page-home .products .product__load-more-button {
    --padding-block: 1.4rem;
    margin-top: 4.8rem;
}

.products-manage {
    background-color: #F7F7F7;
}

.products-manage__inner {
    display: grid;
    gap: 3rem;
}

@media screen and (min-width: 992px) {
    .products-manage__inner {
        grid-template-columns: 2.3fr 3fr;
        gap: 3rem;
    }
}

.products-manage__content {
    display: grid;
    gap: 4rem;
    justify-items: center;
}

@media screen and (min-width: 992px) {
    .products-manage__content {
        justify-items: start;
        align-items: start;
        align-content: center;
        width: 100%;
    }

        .products-manage__content.container {
            padding-inline: 0;
        }
}

.products-manage__image {
    aspect-ratio: 845/540;
    max-width: 100%;
    width: 100%;
}

@media screen and (min-width: 992px) {
    .products-manage__image {
        max-height: 54rem;
    }
}

.products-manage__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.products-manage__list {
    display: grid;
    gap: 2rem;
    padding-left: 3rem;
}

@media screen and (min-width: 992px) {
    .products-manage__list {
        max-width: 67rem;
    }
}

.products-manage__item {
    list-style-image: url(/assets/image/icon/custom-bullet.svg);
}

    .products-manage__item span {
        vertical-align: 0.4em;
        line-height: 1;
    }

.products-manage .button {
    --padding-block: 1.4rem;
}

.intro-hero__inner {
    display: grid;
    gap: 3rem;
}

@media screen and (min-width: 768px) {
    .intro-hero__inner {
        grid-template-columns: repeat(2, 1fr);
    }
}

.intro-hero__image {
    aspect-ratio: 570/330;
}

@media screen and (min-width: 768px) {
    .intro-hero__image {
        aspect-ratio: auto;
    }
}

.intro-hero__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.intro-hero__title {
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: 600;
}

.intro-hero__list {
    width: 70%;
    margin: 0 auto;
    margin-top: 2.4rem;
    display: grid;
    gap: 1.6rem;
    padding-left: 3rem;
}

.intro-hero__item {
    color: #606060;
    list-style-image: url(/assets/image/icon/checkmark-circle-fill.svg);
    padding-left: 0.3rem;
}

    .intro-hero__item span {
        vertical-align: 0.3em;
    }

.intro-features__rows {
    display: grid;
    gap: 5rem;
    margin-top: 5rem;
}

.intro-features__row {
    display: grid;
    gap: 3rem;
    align-items: center;
}

@media screen and (min-width: 992px) {
    .intro-features__row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (min-width: 992px) {
    .intro-features__row:nth-child(odd) .intro-features__illustration {
        order: 1;
    }
}

.intro-features__illustration {
    max-width: 40rem;
    margin-inline: auto;
}

@media screen and (min-width: 992px) {
    .intro-features__illustration {
        max-width: 100%;
    }
}

.intro-features__list {
    display: grid;
    gap: 3rem;
    padding-left: 2.2rem;
}

@media screen and (min-width: 992px) {
    .intro-features__list {
        gap: 5rem;
        align-content: center;
    }
}

.intro-features__item {
    display: grid;
    gap: 2rem;
    justify-items: center;
}

@media screen and (min-width: 992px) {
    .intro-features__item {
        justify-items: left;
        align-content: start;
    }
}

.intro-features__item-title {
    font-size: 2rem;
    font-weight: 600;
    text-align: center;
}

@media screen and (min-width: 992px) {
    .intro-features__item-title {
        font-size: 2.2rem;
        text-align: left;
    }
}

.intro-features__details-list {
    display: grid;
    gap: 1rem;
    max-width: 80%;
}

@media screen and (min-width: 992px) {
    .intro-features__details-list {
        padding-left: 2rem;
    }
}

.intro-features__details-item {
    color: #606060;
    list-style-type: disc;
}

    .intro-features__details-item::marker {
        color: #7BC48A;
    }

.intro-gallery__description {
    font-size: 1.8rem;
}

@media screen and (min-width: 992px) {
    .intro-gallery__description {
        font-size: 2.2rem;
    }
}

.intro-gallery__content {
    display: grid;
    gap: 2rem;
    margin-top: 3rem;
}

@media screen and (min-width: 992px) {
    .intro-gallery__content {
        gap: 3rem;
        grid-template-columns: repeat(2, 1fr);
    }
}

.intro-gallery__images {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin: 0;
}

@media screen and (min-width: 992px) {
    .intro-gallery__images {
        gap: 3rem;
    }

        .intro-gallery__images:nth-child(even) .intro-gallery__image.intro-gallery__image--large {
            order: 1;
        }
}

.intro-gallery__image {
    border-radius: 1rem;
    overflow: hidden;
    display: block;
}

.intro-gallery__image--large {
    grid-column: 1/span 2;
    aspect-ratio: 570/300;
}

.intro-gallery__image:not(.intro-gallery__image--large) {
    aspect-ratio: 270/380;
}

.intro-gallery__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news {
    margin-bottom: 3rem;
    display: grid;
    gap: 3rem;
    grid-template-columns: 100%;
}

@media screen and (min-width: 992px) {
    .news {
        grid-template-columns: repeat(3, 1fr);
        grid-template-areas: "slider slider highlight-list" "new-list new-list new-list" "pagination pagination pagination";
    }
}

.news .section__header {
    grid-column: 1/-1;
    margin-bottom: 3rem;
}

.news__highlight {
    border-radius: 1rem;
    overflow: hidden;
    position: relative;
    height: 100%;
}

.news__highlights-container {
    min-width: 100%;
}

@media screen and (min-width: 992px) {
    .news__highlights-container {
        grid-area: slider;
    }
}

.news__highlights,
.news__highlights .news__link {
    display: block;
    height: 100%;
}

.news__highlight-thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (min-width: 992px) {
    .news__highlight-thumbnail {
        position: absolute;
    }
}

.news__highlight-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.2);
    display: grid;
    align-content: flex-end;
    padding: 2rem;
}

@media screen and (min-width: 992px) {
    .news__highlight-header {
        padding: 3rem;
    }
}

.news__highlight-title {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
}

@media screen and (min-width: 992px) {
    .news__highlight-title {
        font-size: 2.4rem;
    }
}

.news__highlight-list {
    display: grid;
    gap: 3rem;
    grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr));
    margin: 0;
}

@media screen and (min-width: 992px) {
    .news__highlight-list {
        display: grid;
        gap: 0;
        grid-template-columns: none;
        align-content: space-between;
        margin: 0;
        height: min-content;
        grid-area: highlight-list;
    }
}

.news__highlight-item {
    max-width: 100%;
}

@media screen and (min-width: 992px) {
    .news__highlight-item:first-child {
        padding-bottom: 1.6rem;
    }

    .news__highlight-item:last-child {
        padding-top: 1.6rem;
    }

    .news__highlight-item:not(:first-child) {
        border-top: 1px solid #D4D4D4;
    }

        .news__highlight-item:not(:first-child):not(:last-child) {
            padding-block: 1.6rem;
        }
}

.news__highlight-item-link {
    display: grid;
    grid-template-columns: 12rem 1fr;
    align-items: center;
    gap: 1.2rem;
    color: var(--color-text);
}

.news__highlight-item-thumbnail {
    border-radius: 1rem;
    overflow: hidden;
    aspect-ratio: 120/94;
}

    .news__highlight-item-thumbnail img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.news__list {
    margin: 0;
}

@media screen and (min-width: 992px) {
    .news__list {
        grid-area: new-list;
    }
}

@media screen and (min-width: 992px) {
    .news__pagination {
        grid-area: pagination;
        margin-block: 3rem;
    }
}

.news__pagination-list {
    margin: 0;
}

.new-detail {
    --content-width: 120rem;
}

    .new-detail .section__header,
    .new-detail .new-detail__description,
    .new-detail .new-detail__content,
    .new-detail .new-detail__socials {
        max-width: var(--content-width);
        margin-inline: auto;
    }

    .new-detail .section__header {
        margin-bottom: 3rem;
        margin-top: 3rem;
    }

    .new-detail .section__title {
        text-align: left;
    }

.new-detail__date {
    font-size: 2rem;
    color: #888888;
    margin-top: 2rem;
}

.new-detail__content {
    margin-top: 4rem;
}

.new-detail__description {
    margin-top: 3rem;
}

.new-detail__content p {
    margin-top: 3rem;
    font-size: 1.8rem;
}

.new-detail__content hr {
    height: 1px;
    background-color: #D4D4D4;
    margin-block: 3rem;
}

.new-detail__content img {
    display: block;
    border-radius: 1rem;
    overflow: hidden;
}

@media screen and (min-width: 992px) {
    .new-detail__content img {
        width: calc(100% + 10rem);
        position: relative;
        left: -5rem;
        max-width: none;
    }
}

@media screen and (min-width: 1200px) {
    .new-detail__content img {
        width: calc(95%);
        left: 2rem;
    }
}

.new-detail__socials {
    display: flex;
    justify-content: end;
    margin-top: 4rem;
}

.new-detail__socials-list {
    display: flex;
    gap: 1rem;
    margin: 0;
}

.new-detail__social-link {
    --size: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    border: 1px solid #D4D4D4;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .new-detail__social-link:hover {
        color: var(--color-theme);
        border-color: var(--color-theme);
    }

.pricing__packages {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(28rem, 1fr));
    gap: 2rem;
}

@media screen and (min-width: 992px) {
    .pricing__packages {
        gap: 3rem;
    }
}

.pricing__package {
    padding-top: 4rem;
    padding-bottom: 5rem;
    padding-inline: 3rem;
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid #CED0D4;
}

    .pricing__package .button {
        --padding-block: 1.4rem;
        margin-top: 4rem;
        width: fit-content;
        margin-inline: auto;
    }

.pricing__package-header {
    text-align: center;
    padding-bottom: 2rem;
}

.pricing__package-title {
    font-size: 2.2rem;
    font-weight: 600;
}

.pricing__package-price {
    font-size: 3.4rem;
    font-weight: 700;
    margin-top: 1.6rem;
    color: #2D8C28;
}

.pricing__package-price-currency {
    font-size: 1.8rem;
    vertical-align: super;
}

.pricing__package-description {
    color: #888888;
    margin-top: 0.6rem;
}

.pricing__package-description--highlight {
    color: #EF5E4C;
    font-weight: 600;
}

.pricing__package-features {
    padding-top: 2rem;
    border-top: 1px solid #CED0D4;
    padding-left: 2.7rem;
    display: grid;
    gap: 1.6rem;
}

.pricing__package-feature {
    list-style-image: url(/assets/image/icon/checkmark-circle-fill.svg);
    padding-left: 0.3rem;
}

.pricing__package-feature--disabled {
    list-style-image: url(/assets/image/icon/crossmark-circle.svg);
}

.pricing__package-feature span {
    vertical-align: 0.3em;
}

.faqs__search {
    display: flex;
    justify-content: center;
}

.faqs__search-form {
    max-width: 57rem;
}

.faqs__list {
    margin-top: 5rem;
    padding-left: 2.3rem;
}

.faqs__item {
    padding-block: 2rem;
    list-style-type: disc;
    position: relative;
}

    .faqs__item::before {
        content: "";
        width: calc(100% + 2rem);
        height: 1px;
        background-color: #D4D4D4;
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .faqs__item:first-child {
        padding-top: 0;
    }

.faqs__item-header {
    display: flex;
    justify-content: space-between;
}

.faqs__item-question {
    font-size: 1.6rem;
    font-weight: 400;
    max-width: 80%;
    cursor: pointer;
}

.faqs__item--toggler {
    cursor: pointer;
    display: block;
    padding-top: 0.3rem;
}

    .faqs__item--toggler::before {
        content: url(/assets/image/icon/expand.svg);
    }

.faqs__item-header.active .faqs__item--toggler::before {
    content: url(/assets/image/icon/colllapse.svg);
}

.faqs__item-answer {
    color: var(--color-theme);
    margin-top: 1.6rem;
    display: none;
}

.resource-videos__search-form {
    display: grid;
    /*gap: 2rem;*/
    grid-template-areas: "search-box" "categories" "toggler" "options";
    margin-bottom: 5rem;
}

@media screen and (min-width: 992px) {
    .resource-videos__search-form {
        grid-template-columns: auto 1fr auto;
        grid-template-areas: "toggler search-box categories" "options options options";
    }
}

.resource-videos__search-form.active + .resource-videos__list {
    margin-top: 4rem;
}

.resource-videos__search-form .custom-select {
    min-width: 17rem;
}

.resource-videos__search-form .filter {
    order: -1;
}

.resource-videos__search {
    grid-area: search-box;
}

.resource-videos__categories {
    grid-area: categories;
}

.resource-videos__list {
    display: grid;
    gap: 2rem;
    margin-top: 2rem;
}

@media screen and (min-width: 568px) {
    .resource-videos__list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (min-width: 992px) {
    .resource-videos__list {
        gap: 3rem;
        grid-template-columns: repeat(3, 1fr);
    }
}

.resource-videos__item-thumbnail {
    aspect-ratio: 370/250;
    border-radius: 1rem;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

    .resource-videos__item-thumbnail::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.4);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    }

    .resource-videos__item-thumbnail a {
        display: block;
        height: 100%;
    }

    .resource-videos__item-thumbnail img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.resource-videos__item:hover .resource-videos__item-thumbnail::before {
    opacity: 1;
    visibility: visible;
}

.resource-videos__item:hover .resource-videos__item-play-btn::before {
    content: url(/assets/image/icon/play-button.svg);
}

.resource-videos__item-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

    .resource-videos__item-play-btn::before {
        content: url(/assets/image/icon/play-button-active.svg);
    }

.resource-videos__item-title {
    font-size: 2rem;
    font-weight: 600;
    margin-top: 2rem;
}

.filter-toggler {
    height: 4rem;
    padding-inline: 1.2rem;
    border-radius: 1rem;
    border: 1px solid #0277BD;
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-self: start;
    cursor: pointer;
    gap: 0.8rem;
    grid-area: toggler;
}

.filter-toggler__icon {
    --size: 2rem;
    width: var(--size);
    height: var(--size);
    display: block;
}

.filter-toggler__label {
    color: #0277BD;
}

.filter-toggler__count-number {
    --size: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #EF5E4C;
    font-size: 1.3rem;
    color: #fff;
    width: var(--size);
    height: var(--size);
    padding-bottom: 0.1rem;
}

.filter-options {
    grid-area: options;
    display: none;
}

.filter-options__list {
    display: grid;
    gap: 2rem;
    margin: 0;
}

@media screen and (min-width: 992px) {
    .filter-options__list {
        grid-template-columns: repeat(2, min-content);
    }
}

.filter-options__item {
    display: grid;
    gap: 0.4rem;
}

    .filter-options__item .select2 {
        width: 100%;
        max-width: 32rem;
    }

@media screen and (min-width: 992px) {
    .filter-options__item .select2 {
        min-width: 32rem;
    }
}

.filter-options__item-options {
    width: 32rem;
    max-width: 100%;
}

.product-detail {
    padding: 3rem;
}

.product-detail__inner {
    margin-top: 3rem;
    display: grid;
    gap: 3rem;
}

@media screen and (min-width: 992px) {
    .product-detail__inner {
        grid-template-columns: repeat(2, 42rem);
    }
}

.product-detail__image {
    aspect-ratio: 1;
    background-color: #F7F7F7;
    border-radius: 1rem;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-inline: auto;
    max-width: 35rem;
}

@media screen and (min-width: 992px) {
    .product-detail__image {
        max-width: none;
    }
}

.product-detail__image img {
    max-width: 80%;
    width: 100%;
}

.product-detail__content {
    display: grid;
    gap: 2rem;
    align-content: flex-start;
}

.product-detail__price {
    font-size: 2.2rem;
    font-weight: 600;
    color: var(--color-theme);
}

.product-detail__price--old {
    font-size: 1.8rem;
    font-weight: 400;
    text-decoration: line-through;
    color: #606060;
}

.product-detail__infor-title {
    font-size: 1.8rem;
    font-weight: 600;
    padding-top: 2rem;
    border-top: 1px solid #CED0D4;
}

.product-detail__description {
    display: grid;
    gap: 1rem;
}

    .product-detail__description > div {
        position: relative;
        padding-left: 1.5rem;
        font-size: 1.8rem;
        line-height: 1.2;
    }

        .product-detail__description > div::before {
            --size: 0.6rem;
            content: "";
            display: block;
            width: var(--size);
            height: var(--size);
            border-radius: 50%;
            background-color: #7BC48A;
            position: absolute;
            top: 0.5em;
            left: 0;
        }

.product-detail__add-to-cart {
    --size: 3.6rem;
    width: var(--size);
    height: var(--size);
    border-radius: 0.4rem;
    border: 1px solid var(--color-theme);
    overflow: hidden;
    display: grid;
    place-content: center;
}

    .product-detail__add-to-cart::before {
        --size: 1.6rem;
        content: url(/assets/image/icon/add-to-cart.svg);
        display: block;
        width: var(--size);
        height: var(--size);
    }

.product-detail__actions {
    display: flex;
    gap: 1.2rem;
    align-items: flex-start;
}

@media screen and (min-width: 992px) {
    .product-detail__actions {
        margin-top: 1rem;
    }
}

.consultant-modal {
    display: grid;
    gap: 1.6rem;
    padding: 3rem;
    min-width: 80vw;
}

    .consultant-modal .form__group {
        display: grid;
        gap: 0.6rem;
    }

    .consultant-modal .form {
        width: 100%;
    }

        .consultant-modal .form .custom-select + .select2 .select2-selection,
        .consultant-modal .form__input {
            height: 4rem;
        }

            .consultant-modal .form__input:focus,
            .consultant-modal .form__input:not(:placeholder-shown) {
                padding-top: 0;
            }

.consultant-modal__products {
    display: grid;
    gap: 1rem;
}

.consultant-modal__product {
    display: flex;
    justify-content: space-between;
    height: 4rem;
    border-radius: 0.6rem;
    border: 1px solid #D4D4D4;
    gap: 1rem;
    padding-inline: 1.2rem;
}

.consultant-modal__product-infor {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.consultant-modal__product-image {
    --size: 3rem;
    width: var(--size);
    height: var(--size);
}

    .consultant-modal__product-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.consultant-modal__products {
    margin: 0;
}

.consultant-modal__product-remove {
    display: flex;
    align-items: center;
}

    .consultant-modal__product-remove::before {
        --size: 2.4rem;
        content: url(/assets/image/icon/crossmark.svg);
        display: block;
        width: var(--size);
        height: var(--size);
    }

.consultant-modal__submit-button {
    margin-top: 1rem;
    font-size: 1.6rem;
}

.consultant-modal__form-contact {
    text-align: center;
}

    .consultant-modal__form-contact a {
        color: #0769A4;
        font-weight: 600;
    }

@media screen and (min-width: 992px) {
    .consultant-modal {
        min-width: 50rem;
    }
}

.login-modal {
    display: grid;
    gap: 3rem;
    padding-block: 5rem;
    padding-inline: 3rem;
    width: 70rem;
    max-width: 90vw;
}

@media screen and (min-width: 992px) {
    .login-modal {
        padding-inline: 7rem;
        gap: 4rem;
    }
}

.login-modal__title {
    color: var(--color-theme);
    font-size: 3.2rem;
}

@media screen and (min-width: 992px) {
    .login-modal__title {
        font-size: 3.6rem;
    }
}

.login-modal__register {
    margin-top: 0.4rem;
}

.login-modal__register-link {
    font-weight: 600;
}

    .login-modal__register-link, .login-modal__register-link:-webkit-any-link {
        color: var(--color-theme);
    }

.login-modal__actions {
    gap: 1.5rem;
    margin-top: 1.8rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

    .login-modal__actions .button {
        --padding-block: 1.7rem;
    }

.register-modal {
    width: 100vw;
    border-radius: 0;
    padding-inline: 1.6rem;
    padding-block: 5rem;
}

@media screen and (min-width: 768px) {
    .register-modal {
        display: grid;
        place-content: center;
        justify-content: stretch;
        max-width: 70rem;
        height: auto;
        padding-inline: 7rem;
    }
}

.register-modal__title {
    color: var(--color-theme);
    font-size: 3.2rem;
}

@media screen and (min-width: 992px) {
    .register-modal__title {
        font-size: 3.6rem;
    }
}

.register-modal__form.form {
    margin-top: 4rem;
}

.register-modal__actions {
    display: grid;
    margin-top: 2.8rem;
}

    .register-modal__actions .button {
        --padding-block: 1.4rem;
    }

.register-modal__success-message {
    font-size: 1.8rem;
    font-weight: 600;
    text-align: center;
    width: 100%;
    max-width: 46rem;
    padding: 3rem;
}

.modal:has(.register-modal) .modal__content {
    border-radius: 0;
}

@media screen and (min-width: 992px) {
    .modal:has(.register-modal) .modal__content {
        border-radius: 1rem;
    }
}

.video-modal {
    padding-inline: 1.6rem;
    padding-block: 3rem;
    display: grid;
    place-content: center;
}

@media screen and (min-width: 992px) {
    .video-modal {
        height: auto;
        padding-inline: 3rem;
    }
}

.video-modal__frame {
    margin-top: 3rem;
    width: 100%;
    aspect-ratio: 16/9;
}

@media screen and (min-width: 992px) {
    .video-modal__frame {
        min-width: 76.8rem;
    }
}

.success-modal {
    padding-inline: 6.5rem;
    padding-top: 8.5rem;
    padding-bottom: 10.4rem;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 3rem;
}

.success-modal__icon {
    --size: 6rem;
    width: var(--size);
    height: var(--size);
}

.success-modal__message {
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.8;
    text-align: center;
}

.desc {
    /*text-align: center;
    margin-bottom: 40px;*/
    margin-top: 10px;
    font-size: 18px;
}

input.form__input.input-validation-error {
    border-color: #D20000;
}

span.text-danger.field-validation-error {
    color: #D20000;
}

/*# sourceMappingURL=style.css.map */