html {
    --theme1: #f56350;
    --theme2: #65b8f2;
    --c0: #fff;
    --c1: #f5f5f5;
    --c2: #e9ecef;
    --c3: #dee2e6;
    --c4: #ced4da;
    --c5: #adb5bd;
    --c6: #6c757d;
    --c7: #495057;
    --c8: #343a40;
    --c9: #1e1e1e;
    --c10: #000;
}

html[data-mode="dark"] {
    --theme1: #a31616;
    --c0: #dee2e6;
}

.swiper-button-next,
.swiper-button-prev {
    color: var(--theme2);
}

* {
    text-decoration: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    position: relative;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0.5px;
    font-size: 14px;
    color: var(--c8);
}

body,
nav,
header,
section {
    width: 100%;
}

#logo-brand {
    display: none;
}

.trans,
.dev,
.dev a,
body,
img,
h1,
h2,
h3,
p,
.switch .slider,
.switch .slider .ball,
.main-navbar .top .cta,
.nav-sidebar,
.main-hero .filter .input,
.main-hero .filter .select .radio .bg,
.main-hero .filter .cta,
section .title,
section .title h1,
section .title h1::after,
section .item-list,
section .split-desc .product-hl .ver-thumb .swiper-slide,
section .split-desc .product-hl .ver-thumb .swiper-slide img,
section .split-desc .info .contact .cta,
.search-result .user .cta,
.ads-list .bond .menu,
.ads-list .bond .search .cta,
.ads-list .bond .table .state .ball,
.ads-list .bond .act,
.add-ads .list-photo .photo .info,
.add-ads .list-photo .photo .bg,
.add-ads .side .radio .select,
.add-ads .side .radio .select::after,
.add-ads .cta .btn,
.login .form .input,
.login .cta,
.faq .faq-list .list .title,
.faq .faq-list .list span.arrow,
.faq .faq-list .list .ph,
.faq .faq-list .list .content {
    -webkit-transition: ease 0.4s;
    transition: ease 0.4s;
}

.shadow,
.main-navbar .bot,
.main-hero .filter,
.main-hero .filter .input:focus,
.main-hero .filter .cta,
.main-hero .banner,
section .split-desc .info,
.partner .swiper-slide,
.search-result .list-filter,
.search-result .user,
.login .form .input:focus {
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
}

.grid {
    margin: 0 auto;
}

@media (max-width: 1280px) {
    .grid {
        width: 100%;
        max-width: 1200px;
        padding: 2vw;
        padding: 0 clamp(1em, 6vw, 3em);
    }
}

@media (min-width: 1281px) {
    .grid {
        width: 85%;
    }
}

.full,
.img,
.main-navbar .top .account .thumb img,
.main-hero .grid img,
section .item-list .thumb img,
section .split-desc .product-hl img,
.ads-list .bond .table .bar .product .thumb img,
.add-ads img,
.login img,
.dev a,
.dev img,
.modal,
.modal .close,
.swiper-container {
    width: 100%;
    height: 100%;
}

.full-h {
    width: 100%;
    height: 100vh;
    min-height: 540px;
}

.img,
.main-navbar .top .account .thumb img,
.main-hero .grid img,
section .item-list .thumb img,
section .split-desc .product-hl img,
.ads-list .bond .table .bar .product .thumb img,
.add-ads img,
.login img {
    -o-object-fit: cover;
    object-fit: cover;
}

.row,
.dev,
.dev a,
.modal,
.switch,
.main-navbar .grid,
.main-navbar .top .side,
.main-navbar .top .account,
.main-hero .filter .select .radio,
section .split-desc .product-hl,
section .split-desc .info .arr,
.search-result .list-filter .parent-filter span,
.search-result .user,
.ads-list .bond .search,
.ads-list .bond .search .cta,
.ads-list .bond .table .state,
.add-ads .list-photo .photo,
.add-ads .side.start,
.add-ads .side .radio,
.add-ads .cta,
.faq .faq-list .list .title,
.faq .faq-list .list span,
footer .footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.col,
.box,
.box .menu-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dev {
    width: 35px;
    height: 35px;
    margin: 0 0 0 10px;
    -webkit-filter: grayscale(1) brightness(1.2) contrast(0.8);
    filter: grayscale(1) brightness(1.2) contrast(0.8);
}

.dev img {
    -o-object-fit: contain;
    object-fit: contain;
}

.dev:hover {
    -webkit-filter: grayscale(0) brightness(1) contrast(1);
    filter: grayscale(0) brightness(1) contrast(1);
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    z-index: 21;
}

.modal .close {
    content: "";
    cursor: pointer;
    position: absolute;
    z-index: 1;
    background: rgba(var(--c0), 0.6);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.modal.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

body {
    background: var(--c1);
    padding-top: 125px;
}

.shadow,
.main-navbar .bot,
.main-hero .filter,
.main-hero .filter .input:focus,
.main-hero .filter .cta,
.main-hero .banner,
section .split-desc .info,
.partner .swiper-slide,
.search-result .list-filter,
.search-result .user,
.login .form .input:focus {
    -webkit-box-shadow: 0 10px 30px 0 rgba(101, 184, 242, 0.3);
    box-shadow: 0 10px 30px 0 rgba(101, 184, 242, 0.3);
}

.switch {
    position: fixed;
    width: 60px;
    height: 31px;
    bottom: 0;
    left: 0;
    margin: 1em;
    z-index: 5;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch input:checked + .slider {
    background: #6c99ef;
    background: linear-gradient(45deg, #68bdf6 0%, #c0e6ff 100%);
}

@-webkit-keyframes shine {
    0% {
        -webkit-box-shadow: 0 0 17px 0 #ff6a00;
        box-shadow: 0 0 17px 0 #ff6a00;
    }
    50% {
        -webkit-box-shadow: 0 0 7px 0 #ff6a00;
        box-shadow: 0 0 7px 0 #ff6a00;
    }
    100% {
        -webkit-box-shadow: 0 0 17px 0 #ff6a00;
        box-shadow: 0 0 17px 0 #ff6a00;
    }
}

@keyframes shine {
    0% {
        -webkit-box-shadow: 0 0 17px 0 #ff6a00;
        box-shadow: 0 0 17px 0 #ff6a00;
    }
    50% {
        -webkit-box-shadow: 0 0 7px 0 #ff6a00;
        box-shadow: 0 0 7px 0 #ff6a00;
    }
    100% {
        -webkit-box-shadow: 0 0 17px 0 #ff6a00;
        box-shadow: 0 0 17px 0 #ff6a00;
    }
}

.switch input:checked + .slider .ball {
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
    background: #ead837;
    -webkit-animation: shine 2s ease infinite;
    animation: shine 2s ease infinite;
}

.switch .slider.round {
    border-radius: 34px;
}

.switch .slider.round .ball {
    border-radius: 50%;
}

.switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #20272c;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#1c1f23),
        to(#3b444b)
    );
    background: linear-gradient(90deg, #1c1f23 0%, #3b444b 100%);
}

.switch .slider .ball {
    position: absolute;
    content: "";
    height: 23px;
    width: 23px;
    left: 4px;
    bottom: 4px;
    background: #ccd6d8;
    -webkit-box-shadow: 0 0 15px 0 #72aaff;
    box-shadow: 0 0 15px 0 #72aaff;
}

.main-navbar {
    position: fixed;
    top: 0;
    z-index: 20;
}

.main-navbar .grid {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.main-navbar .top {
    background: var(--theme2);
}

.main-navbar .top .list {
    color: var(--c1);
    font-weight: 600;
    margin: 0 2em 0 0;
}

.main-navbar .top .list span {
    color: var(--theme2);
}

.main-navbar .top .account {
    color: var(--c0);
    font-weight: 600;
    margin: 0 2rem 0 0;
}

.main-navbar .top .account .thumb {
    width: 25px;
    height: 25px;
    margin: 0 10px 0 0;
    background: var(--c0);
    border-radius: 50%;
    overflow: hidden;
}

.main-navbar .top .cta {
    padding: 5px 3em;
    border: 1px solid var(--theme2);
    background: var(--theme2);
    color: var(--c0);
    border-radius: 5px;
    outline: none;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
}

.main-navbar .top .cta:hover {
    background: var(--c0);
    color: var(--theme2);
}

.main-navbar .bot {
    background: rgba(255, 255, 255, 0.8);
    -webkit-backdrop-filter: blur(8px) brightness(2);
    backdrop-filter: blur(8px) brightness(2);
}

.main-navbar .bot .logo h1 {
    font-size: 48px;
    font-style: italic;
    font-weight: 800;
    margin: 0;
    color: var(--c0);
}

.main-navbar .bot .logo h1 span {
    color: var(--theme2);
    font-weight: 400;
}

.main-navbar .bot .logo img {
    width: auto;
    height: 75px;
    -o-object-fit: contain;
    object-fit: contain;
}

.main-navbar .bot .list {
    color: var(--c9);
    font-weight: 600;
    margin: 0 2em 0 0;
}

@media (max-width: 960px) {
    .main-navbar .menu {
        display: none;
    }
}

.box {
    width: 35px;
    height: 35px;
    background: var(--c10);
    content: "";
    position: fixed;
    top: 58px;
    right: 5vw;
    cursor: pointer;
    border-radius: 5%;
    z-index: 24;
}

@media (min-width: 961px) {
    .box {
        display: none;
    }
}

.box .menu-btn {
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0.65);
    transform: scale(0.65);
}

.box .menu-btn > div {
    background: var(--c0);
    width: 80%;
    height: 2px;
    border-radius: 5px;
    margin: 3px 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.box .menu-btn .bar1 {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.box .menu-btn .bar2 {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.box .menu-btn.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-5px, 5px);
    transform: rotate(-45deg) translate(-5px, 5px);
}

.box .menu-btn.change .bar2 {
    opacity: 0;
}

.box .menu-btn.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-6px, -6px);
    transform: rotate(45deg) translate(-6px, -6px);
}

.nav-sidebar {
    background: var(--c9);
    width: 100%;
    max-width: 320px;
    height: 100%;
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 21;
    padding-top: 120px;
}

@media (min-width: 961px) {
    .nav-sidebar {
        display: none;
    }
}

.nav-sidebar .list {
    color: var(--c0);
    background: rgba(var(--c10), 0.25);
    display: block;
    padding: 10px 2em;
    margin: 0 0 10px;
}

.nav-sidebar.active {
    right: 0;
}

.main-hero {
    margin: 3rem 0;
}

.main-hero .grid {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
}

.main-hero .grid .filter {
    -ms-grid-row: 2;
    grid-area: 2;
}

@media (min-width: 961px) {
    .main-hero .grid {
        -ms-grid-columns: 1fr 3fr;
        grid-template-columns: 1fr 3fr;
    }
    .main-hero .grid .filter {
        -ms-grid-row: 1;
        grid-area: 1;
    }
}

.main-hero .filter {
    background: var(--c0);
    padding: 2em;
}

.main-hero .filter h1 {
    font-size: 28px;
    font-weight: 600;
    font-family: "Teko", sans-serif;
    color: var(--c9);
    text-align: center;
    margin: 0 0 1em;
}

.main-hero .filter .input {
    width: 100%;
    padding: 10px;
    border: 1px solid transparent;
    outline: none;
    background: var(--c1);
    border-radius: 5px;
    margin: 0 0 2em;
}

.main-hero .filter .input:focus {
    background: var(--c0);
    border: 1px solid var(--theme2);
}

.main-hero .filter .split {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: (1fr) [2];
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
}

.main-hero .filter .select {
    display: -ms-grid;
    display: grid;
    grid-gap: 0;
    -ms-grid-columns: (1fr) [2];
    grid-template-columns: repeat(2, 1fr);
    border-radius: 5px;
    margin: 0 0 2em;
    overflow: hidden;
}

.main-hero .filter .select .radio {
    background: var(--c0);
    padding: 10px 2em;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.main-hero .filter .select .radio p {
    margin: 0;
    z-index: 1;
    font-weight: 600;
}

.main-hero .filter .select .radio .bg {
    width: 100%;
    height: 100%;
    content: "";
    background: var(--c2);
    position: absolute;
}

.main-hero .filter .select .radio input {
    display: none;
}

.main-hero .filter .select .radio input:checked ~ .bg {
    background: var(--theme1);
}

.main-hero .filter .select .radio input:checked + p {
    color: var(--c0);
}

.main-hero .filter .cta {
    padding: 10px 2em;
    border: 1px solid var(--theme2);
    background: var(--theme2);
    color: var(--c0);
    border-radius: 5px;
    outline: none;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
    display: block;
    margin: 0 0 1em;
}

.main-hero .filter .cta:hover {
    background: var(--c0);
    color: var(--theme2);
}

.main-hero .filter .reset {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: var(--c3);
}

.main-hero .banner {
    width: 100%;
    aspect-ratio: 16/9;
    overflow: hidden;
    position: relative;
    height: 100%;
}

.main-hero .banner .swiper-wrapper {
    height: 100% !important;
}

section .title {
    margin: 0 0 2em;
    border-bottom: 5px solid var(--theme2);
}

section .title h1 {
    position: relative;
    display: table;
    padding: 10px 2em 5px;
    margin: 0;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 600;
    color: var(--c0);
    background: var(--theme2);
    z-index: 1;
}

section .title h1::after {
    width: 50px;
    height: 110%;
    content: "";
    position: absolute;
    background: var(--theme2);
    -webkit-clip-path: polygon(0 0, 60% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 60% 0%, 100% 100%, 0% 100%);
    z-index: -1;
    top: 0;
    right: -20px;
}

section .grid > h1 {
    color: var(--c9);
    font-size: 36px;
    letter-spacing: 1px;
    text-align: center;
    font-family: "Teko", sans-serif;
    text-shadow: 0 10px 30px rgba(101, 184, 242, 0.5);
}

section .item-list {
    background: var(--c1);
    color: var(--c9);
    padding: 1rem;
}

section .item-list .thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 4/5;
}

section .item-list .detail {
    padding: 1em 0 2em;
}

section .item-list p {
    margin: 0;
}

section .item-list .heading {
    font-weight: 600;
    font-size: 18px;
}

section .item-list .desc {
    color: var(--c6);
    font-size: 12px;
    margin: 5px 0;
}

section .item-list .more {
    font-size: 18px;
    font-weight: 600;
    color: var(--theme1);
    display: table;
    margin: 1.25em 0 0;
}

section .item-list .inline {
    width: 100%;
    margin: 2em 0 0;
    display: -ms-grid;
    display: grid;
    grid-gap: 1em;
    -ms-grid-columns: (1fr) [2];
    grid-template-columns: repeat(2, 1fr);
}

section .item-list .inline .btn {
    padding: 7.5px 10px;
    border: 1px solid var(--theme2);
    text-align: center;
    color: var(--c1);
    background: var(--theme2);
}

section .item-list .inline .btn.share {
    background: transparent;
    border: 1px solid var(--theme1);
    color: var(--theme1);
}

section .item-list:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    z-index: 1;
    background: var(--c1);
    -webkit-box-shadow: 0 10px 30px 0 rgba(101, 184, 242, 0.4);
    box-shadow: 0 10px 30px 0 rgba(101, 184, 242, 0.4);
}

section .split-desc {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    width: 100%;
    margin: 2rem 0 0;
}

@media (min-width: 961px) {
    section .split-desc {
        -ms-grid-columns: 3fr 340px;
        grid-template-columns: 3fr 340px;
    }
}

section .split-desc .title::before {
    width: 65%;
}

section .split-desc .product-hl {
    overflow: hidden;
    aspect-ratio: 16/9;
}

section .split-desc .product-hl .main-thumb {
    width: 100%;
    height: 100%;
    margin: 0 20px 0 0;
    position: relative;
    overflow: hidden;
}

section .split-desc .product-hl .main-thumb .preview {
    height: 100%;
}

section .split-desc .product-hl .ver-thumb {
    overflow: hidden;
    height: 100%;
}

section .split-desc .product-hl .ver-thumb .swiper-slide {
    overflow: hidden;
    cursor: pointer;
}

section .split-desc .product-hl .ver-thumb .swiper-slide:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

section .split-desc .product-hl .ver-thumb .swiper-slide-thumb-active {
    -webkit-filter: brightness(0.75) grayscale(1);
    filter: brightness(0.75) grayscale(1);
}

section .split-desc .info {
    background: var(--c0);
    padding: 2em;
}

section .split-desc .info .owner {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

section .split-desc .info .address {
    font-size: 14px;
    line-height: 22.652px;
}

section .split-desc .info .contact {
    margin: 2em 0;
}

section .split-desc .info .contact .cta {
    padding: 10px 2em;
    border: 1px solid var(--theme2);
    background: var(--theme2);
    color: var(--c0);
    border-radius: 5px;
    outline: none;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
    margin: 0 0 1em;
}

section .split-desc .info .contact .cta:hover {
    background: var(--c0);
    color: var(--theme2);
}

section .split-desc .info .arr {
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 0 10px;
}

section .split-desc .info .arr p {
    margin: 0;
    text-transform: capitalize;
}

section .split-desc .info .arr p:first-child {
    font-weight: 600;
}

section .split-desc .desc > * {
    margin: 0 0 10px;
}

section .split-desc .desc .heading {
    font-size: 36px;
    font-weight: 600;
}

section .split-desc .desc .category {
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}

section .split-desc .desc .pricing {
    font-weight: 400;
    color: var(--theme1);
}

section .split-desc .desc p {
    font-size: 14px;
    line-height: 22.652px;
    color: var(--c7);
    max-width: 840px;
}

section .split-desc .desc img {
    width: 100%;
    height: auto;
    margin: 2rem 0;
}

section .split-desc .relate .item-list {
    margin: 0 0 2em;
}

.partner {
    margin: 2rem 0;
}

.partner .swiper-slide {
    background: white;
    padding: 1em;
    border-radius: 5px;
}

.partner img {
    width: 100%;
    height: 35px;
    -o-object-fit: contain;
    object-fit: contain;
}

.partner.emblem .swiper-slide {
    aspect-ratio: 1;
}

.partner.emblem .swiper-slide img {
    height: 100%;
}

.small-banner {
    margin: 2rem 0;
}

.small-banner img {
    width: 100%;
    height: auto;
}

.display {
    margin: 1rem 0 4rem;
}

.display .split {
    display: -ms-grid;
    display: grid;
    grid-gap: 0;
    -ms-grid-columns: (1fr) [5];
    grid-template-columns: repeat(5, 1fr);
}

.news .split {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
}

@media (min-width: 961px) {
    .news .split {
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
    }
}

.news .split .thumb {
    aspect-ratio: 2/1;
}

.search-result .grid {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
}

@media (min-width: 961px) {
    .search-result .grid {
        -ms-grid-columns: 320px 4fr;
        grid-template-columns: 320px 4fr;
    }
}

.search-result .list-filter {
    background: var(--c0);
    padding: 1em;
}

.search-result .list-filter .parent-filter {
    cursor: pointer;
}

.search-result .list-filter .parent-filter span {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

.search-result .list-filter .parent-filter span,
.search-result .list-filter .parent-filter i {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
}

.search-result .list-filter .parent-filter .input {
    width: 100%;
    padding: 10px;
    border: 1px solid var(--c4);
    margin: 10px 0;
    border-radius: 5px;
    background: var(--c1);
}

.search-result .list-filter .parent-filter .item {
    margin: 5px 0 10px;
    border-radius: 5px;
    overflow: hidden;
    height: 0;
}

.search-result .list-filter .parent-filter .item .select {
    display: block;
    padding: 5px 0;
    cursor: pointer;
}

.search-result .list-filter .parent-filter.drop.active .item {
    height: auto;
}

.search-result .list-filter .parent-filter.drop.active span {
    color: var(--theme1);
}

.search-result .list-filter .parent-filter.drop.active i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.search-result .user {
    background: var(--c0);
    padding: 2em;
    margin: 0 0 2rem;
}

.search-result .user h3,
.search-result .user p {
    margin: 0 0 5px;
}

.search-result .user h3 {
    font-size: 18px;
}

.search-result .user p {
    font-size: 12px;
}

.search-result .user .cta {
    padding: 5px 2em;
    border: 1px solid var(--theme2);
    background: var(--theme2);
    color: var(--c0);
    border-radius: 5px;
    outline: none;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    margin: 0 0 2rem;
}

.search-result .user .cta:hover {
    background: var(--c0);
    color: var(--theme2);
}

@media (max-width: 640px) {
    .search-result .user {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        text-align: center;
    }
    .search-result .user .cta {
        margin: 2rem 0 1rem;
    }
}

.search-result .all-item {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: (minmax(240px, 1fr)) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

@media (max-width: 240px) {
    .search-result .all-item {
        -ms-grid-columns: none;
        grid-template-columns: none;
        width: 100%;
    }
}

.ads-list .bond {
    margin: 1em 0;
    background: var(--c0);
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.ads-list .bond .tabs {
    border-bottom: 1px solid var(--c2);
}

.ads-list .bond .menu {
    display: inline-block;
    padding: 14px 28px;
    font-weight: 600;
    font-size: 14px;
    border-bottom: 2px solid transparent;
    cursor: pointer;
}

.ads-list .bond .menu.active,
.ads-list .bond .menu:hover {
    color: var(--theme2);
    border-bottom-color: var(--theme2);
}

.ads-list .bond .bar {
    padding: 14px 28px;
    border-bottom: 1px solid var(--c2);
}

.ads-list .bond .limit {
    display: table;
}

.ads-list .bond .search {
    border: 1px solid var(--c2);
    border-radius: 10px;
    overflow: hidden;
}

.ads-list .bond .search .text {
    padding: 10px 20px;
    border: none;
    outline: none;
    color: var(--c9);
    font-weight: 600;
}

.ads-list .bond .search .text::-webkit-input-placeholder,
.ads-list .bond .search .text {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
}

.ads-list .bond .search .text:-ms-input-placeholder,
.ads-list .bond .search .text {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
}

.ads-list .bond .search .text::-ms-input-placeholder,
.ads-list .bond .search .text {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
}

.ads-list .bond .search .text::placeholder,
.ads-list .bond .search .text {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
}

.ads-list .bond .search .text::-webkit-input-placeholder {
    color: var(--c5);
    font-weight: 400;
}

.ads-list .bond .search .text:-ms-input-placeholder {
    color: var(--c5);
    font-weight: 400;
}

.ads-list .bond .search .text::-ms-input-placeholder {
    color: var(--c5);
    font-weight: 400;
}

.ads-list .bond .search .text::placeholder {
    color: var(--c5);
    font-weight: 400;
}

.ads-list .bond .search .cta {
    background: var(--c2);
    padding: 10px 15px;
    font-weight: 800;
    cursor: pointer;
}

.ads-list .bond .search .cta:hover {
    background: var(--c4);
}

.ads-list .bond .table {
    overflow-x: auto;
}

.ads-list .bond .table .bar {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 4fr 2fr 1fr 1fr;
    grid-template-columns: 4fr 2fr 1fr 1fr;
    min-width: 840px;
}

.ads-list .bond .table .bar:last-child {
    border-bottom: none;
}

.ads-list .bond .table .bar.head {
    font-weight: 800;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--c6);
}

.ads-list .bond .table .bar .product {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    color: var(--c8);
}

.ads-list .bond .table .bar .product .thumb {
    width: 75px;
    aspect-ratio: 1;
    border-radius: 10px;
    overflow: hidden;
}

.ads-list .bond .table .bar .product .info {
    padding: 1em;
}

.ads-list .bond .table .bar .product h2,
.ads-list .bond .table .bar .product p {
    margin: 0;
}

.ads-list .bond .table .bar .product h2 {
    font-weight: 600;
    font-size: 18px;
    color: var(--c9);
}

.ads-list .bond .table .state {
    width: 40px;
    height: 7.5px;
    margin: 15px 0 0;
    border-radius: 50px;
    position: relative;
    background: var(--c3);
    cursor: pointer;
}

.ads-list .bond .table .state input {
    display: none;
}

.ads-list .bond .table .state:hover .ball {
    background: var(--c7);
}

.ads-list .bond .table .state .ball {
    display: table;
    width: 15px;
    height: 15px;
    content: "";
    background: var(--c5);
    border-radius: 50%;
    margin: 0 auto 0 0;
}

.ads-list .bond .table .state input:checked + .ball {
    background: var(--theme1);
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
}

.ads-list .bond .act {
    display: inline-block;
    border: 1px solid var(--c5);
    border-radius: 5px;
    padding: 5px 7.5px;
    cursor: pointer;
    background: var(--c2);
    margin: 0 5px;
}

.ads-list .bond .act i {
    font-size: 14px;
    color: var(--c8);
}

.ads-list .bond .act:hover {
    background: var(--c4);
}

.add-ads {
    padding: 4em 0;
}

.add-ads .bond {
    padding: 3em 2em;
    margin: 0 0 1em;
    background: var(--c0);
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

@media (min-width: 841px) {
    .add-ads .divider {
        display: -ms-grid;
        display: grid;
        grid-gap: 2em 4em;
        -ms-grid-columns: 1fr 3fr;
        grid-template-columns: 1fr 3fr;
    }
}

.add-ads .sect-info {
    margin-bottom: 2em;
}

.add-ads .sect-info h1 {
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 10px;
}

.add-ads .sect-info p {
    font-size: 14px;
    line-height: 22.652px;
}

.add-ads .sect-info .notif {
    width: 100%;
    padding: 10px 2em;
    border-radius: 5px;
    font-weight: 600;
    background: var(--theme1);
    color: var(--c0);
}

.add-ads .notes h2 {
    font-size: 14px;
    font-weight: 600;
}

.add-ads .notes span {
    font-size: 12px;
    font-weight: 600;
    color: var(--c6);
    background: var(--c2);
    padding: 5px;
    letter-spacing: 0.5;
}

.add-ads .notes p {
    font-size: 12px;
    line-height: 19.416px;
}

.add-ads .list-photo {
    display: -ms-grid;
    display: grid;
    grid-gap: 1em;
    -ms-grid-columns: (minmax(168px, 1fr)) [auto-fill];
    grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
}

@media (max-width: 168px) {
    .add-ads .list-photo {
        -ms-grid-columns: none;
        grid-template-columns: none;
        width: 100%;
    }
}

.add-ads .list-photo .photo {
    width: 100%;
    aspect-ratio: 1;
    position: relative;
    cursor: pointer;
    overflow: hidden;
    border-radius: 10px;
}

.add-ads .list-photo .photo .info {
    text-align: center;
    color: var(--c5);
}

.add-ads .list-photo .photo .info * {
    margin: 0;
}

.add-ads .list-photo .photo .info i {
    font-size: 35px;
    margin: 0 0 5px;
}

.add-ads .list-photo .photo .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    border: 2px dashed var(--c4);
    border-radius: 10px;
}

.add-ads .list-photo .photo .hide {
    display: none;
}

.add-ads .list-photo .photo .uploaded {
    display: none;
}

.add-ads .list-photo .photo:has(.fill) .uploaded {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block !important;
}

.add-ads .list-photo .photo:has(.fill) .info {
    display: none !important;
}

.add-ads .list-photo .photo:has(.fill) .bg {
    display: none !important;
}

.add-ads .list-photo .photo:hover .bg {
    border-color: var(--theme1);
}

.add-ads .list-photo .photo:hover .info {
    color: var(--theme1);
}

.add-ads .side {
    width: 100%;
    overflow: hidden;
}

.add-ads .side .input {
    display: block;
    width: 100%;
    padding: 10px 1em;
    border: 1px solid var(--c4);
    border-radius: 5px;
    color: var(--c6);
}

.add-ads .side .input::-webkit-input-placeholder {
    color: var(--c5);
}

.add-ads .side .input:-ms-input-placeholder {
    color: var(--c5);
}

.add-ads .side .input::-ms-input-placeholder {
    color: var(--c5);
}

.add-ads .side .input::placeholder {
    color: var(--c5);
}

.add-ads .side .input.ta {
    height: 200px;
}

.add-ads .side .ck.ck-editor__editable_inline {
    min-height: 200px;
    max-height: 600px;
}

.add-ads .side.start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.add-ads .side .radio {
    margin: 0 2em 0 0;
    cursor: pointer;
}

.add-ads .side .radio input {
    display: none;
}

.add-ads .side .radio .select {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin: 0 10px;
    border: 2px solid var(--c5);
    position: relative;
}

.add-ads .side .radio .select::after {
    width: 100%;
    height: 100%;
    content: "";
    background: var(--theme1);
    position: absolute;
    border-radius: 50%;
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0;
}

.add-ads .side .radio input:checked ~ .select {
    border-color: var(--theme1);
}

.add-ads .side .radio input:checked ~ .select::after {
    opacity: 1;
}

.add-ads .cta {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.add-ads .cta .btn {
    display: table;
    cursor: pointer;
    background: var(--c2);
    border: 1px solid var(--c4);
    color: var(--c7);
    font-weight: 600;
    font-size: 12px;
    padding: 10px 2em;
    border-radius: 5px;
    margin: 10px 0 10px 10px;
    min-width: 150px;
    text-align: center;
}

.add-ads .cta .btn.send {
    background: var(--theme2);
    border-color: var(--theme2);
    color: var(--c0);
}

.add-ads .cta .btn:hover {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0.7;
}

.login {
    padding: 3rem 2vw 0;
}

.login .grid-s {
    max-width: 960px;
    margin: 0 auto;
    background: var(--c0);
    color: var(--c9);
    overflow: hidden;
    border-radius: 5px;
}

@media (min-width: 641px) {
    .login .grid-s {
        display: -ms-grid;
        display: grid;
        grid-gap: 0;
        -ms-grid-columns: (1fr) [2];
        grid-template-columns: repeat(2, 1fr);
    }
}

.login .form {
    padding: 4rem 2rem;
    text-align: center;
}

.login .form h2 {
    font-size: 28px;
    font-weight: 600;
    margin: 0 0 1em;
}

.login .form .split {
    display: -ms-grid;
    display: grid;
    grid-gap: 1em;
    -ms-grid-columns: (1fr) [2];
    grid-template-columns: repeat(2, 1fr);
    margin: 0 0 1em;
}

.login .form .split .input {
    margin: 0;
}

.login .form .input {
    padding: 10px;
    border-radius: 5px;
    outline: none;
    border: 1px solid var(--theme2);
    display: block;
    width: 100%;
    margin: 0 0 10px;
}

.login .form label {
    display: block;
    margin: 4rem 0 1em;
}

.login .form span {
    margin: 10px 0;
    display: block;
}

.login .cta {
    padding: 10px 2em;
    border: 1px solid var(--theme2);
    background: var(--theme2);
    color: var(--c0);
    border-radius: 5px;
    outline: none;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
    display: block;
}

.login .cta:hover {
    background: var(--c0);
    color: var(--theme2);
}

.faq {
    padding: 4em 0;
}

.faq .faq-list {
    -webkit-box-shadow: 0 1em 2em 0 rgba(var(--c8), 0.1);
    box-shadow: 0 1em 2em 0 rgba(var(--c8), 0.1);
    border-radius: 5px;
    overflow: hidden;
    background: var(--c0);
}

.faq .faq-list .list {
    width: 100%;
}

.faq .faq-list .list .title {
    text-transform: capitalize;
    padding: 1em 2em;
    margin: 0;
    border-bottom: 1px solid var(--c2);
    cursor: pointer;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 16px;
    color: var(--c6);
}

.faq .faq-list .list:last-child .title {
    border-bottom: none;
}

.faq .faq-list .list span {
    width: 35px;
    aspect-ratio: 1;
    border-radius: 50%;
    margin: 0 1em 0 0;
}

.faq .faq-list .list span.num {
    background: var(--c2);
}

.faq .faq-list .list span.arrow {
    margin: 0 0 0 auto;
}

.faq .faq-list .list .ph {
    display: none;
}

.faq .faq-list .list .content {
    background: var(--c1);
    padding: 2em;
    font-size: 16px;
    line-height: 25.888px;
    color: var(--c7);
    white-space: pre-line;
}

.faq .faq-list .list.active .title {
    background: linear-gradient(45deg, var(--theme1) 0%, var(--theme2) 100%);
    border-bottom-color: transparent;
    font-weight: 400;
    color: var(--c0);
}

.faq .faq-list .list.active .ph {
    display: block;
}

.faq .faq-list .list.active .arrow {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.faq .faq-list .list.active span.num {
    background: rgba(var(--c8), 0.1);
}

footer {
    background: var(--theme2);
    padding: 2em 0 0;
    margin: 4em 0 0;
}

footer,
footer a {
    color: var(--c0);
}

footer .grid {
    display: -ms-grid;
    display: grid;
    grid-gap: 2em;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
}

@media (min-width: 841px) {
    footer .grid {
        -ms-grid-columns: 1fr 2fr 2fr;
        grid-template-columns: 1fr 2fr 2fr;
    }
}

footer .logo h1 {
    font-size: 36px;
    font-style: italic;
    font-weight: 800;
    margin: 0;
    color: var(--c0);
}

footer .logo h1 span {
    color: var(--theme1);
    font-weight: 400;
}

footer .logo img {
    width: 100%;
    max-width: 320px;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
}

footer iframe {
    width: 100%;
    height: 250px;
}

footer .menu {
    display: -ms-grid;
    display: grid;
    grid-gap: 1em;
    -ms-grid-columns: (minmax(200px, 1fr)) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    width: 100%;
}

@media (max-width: 200px) {
    footer .menu {
        -ms-grid-columns: none;
        grid-template-columns: none;
        width: 100%;
    }
}

footer .footer {
    width: 100%;
    margin: 1rem 0 0;
    padding: 10px;
    background: var(--c1);
    color: var(--c9);
}

html[data-mode="dark"] body,
html[data-mode="dark"] .top {
    background: var(--c10);
}

html[data-mode="dark"] .bot {
    background: var(--c9);
}

html[data-mode="dark"] .main-hero .input,
html[data-mode="dark"] .search-result .input {
    background: var(--c0);
}

html[data-mode="dark"] .partner .swiper-slide {
    -webkit-filter: brightness(0.75);
    filter: brightness(0.75);
}

html[data-mode="dark"] .product-hl img {
    -webkit-filter: brightness(0.75);
    filter: brightness(0.75);
}

html[data-mode="dark"] .desc h1,
html[data-mode="dark"] .desc h3 {
    color: var(--c2);
}

html[data-mode="dark"] .desc,
html[data-mode="dark"] .desc p {
    color: var(--c5);
}

html[data-mode="dark"] section .title {
    border-bottom-color: var(--theme1);
}

html[data-mode="dark"] section .title h1 {
    background: var(--theme1);
}

html[data-mode="dark"] section .title h1::after {
    background: var(--theme1);
}

html[data-mode="dark"] section .item-list,
html[data-mode="dark"] section .split-desc .info,
html[data-mode="dark"] .search-result .list-filter {
    background: var(--c9);
    color: var(--c0);
}

html[data-mode="dark"] section .item-list .more,
html[data-mode="dark"] section .split-desc .info .more,
html[data-mode="dark"] .search-result .list-filter .more {
    color: var(--theme2);
}

html[data-mode="dark"] section .item-list img,
html[data-mode="dark"] section .split-desc .info img,
html[data-mode="dark"] .search-result .list-filter img {
    -webkit-filter: grayscale(1) brightness(0.75);
    filter: grayscale(1) brightness(0.75);
}

html[data-mode="dark"] .ads-list .bond,
html[data-mode="dark"] .add-ads .bond {
    background: var(--c1);
}

html[data-mode="dark"] .faq-list {
    background: var(--c9);
}

html[data-mode="dark"] .faq-list .list .title {
    color: var(--c2);
    border-bottom-color: var(--c10);
}

html[data-mode="dark"] .faq-list .list .content {
    background: var(--c8);
    color: var(--c4);
}