body {
    /* line-height: 1.2; */
    font-weight: 400;
    color: #333;
    background: #f9f9f8;
    font-family: "Helvetica", sans-serif;
}
@font-face {
    font-family: "Helvetica";
    src: url("../fonts/Helvetica/helvetica_regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Helvetica";
    src: url("../fonts/Helvetica/helvetica_bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Helvetica";
    src: url("../fonts/Helvetica/helvetica_light.otf") format("opentype");
    font-weight: 300;
    font-style: normal;
}
button,
input,
select,
textarea {
    font-family: "Helvetica", sans-serif;
}
a {
    color: inherit;
}
.container {
    width: 85rem;
}
section {
    margin-bottom: 3.5rem;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2.65rem;
    padding: 0 1.5rem;
    font-weight: 700;
    border-radius: 0.65rem;
    letter-spacing: -0.05rem;
    transition: all 0.25s ease-in;
    cursor: pointer;
    border: none;
    white-space: nowrap;
    gap: 0.65rem;
    font-family: "Helvetica", sans-serif;
}
.btn.black1 {
    color: #fff;
    background: #333;
}
.btn.black1:hover {
    background: #515151;
}
.btn.black2 {
    color: #fff;
    background: #333;
}
.btn.black2:hover {
    color: #333;
    background: #fff;
}
.btn.outline {
    background: transparent;
    color: #333;
    border: 1px solid #333;
}
.btn.outline:hover {
    background: #333;
    color: white;
    border: 1px solid #fff;
}
.btn.white {
    background: white;
    color: #333;
}
.btn.white:hover {
    background: #333;
    color: #fff;
}
.btn.outline2 {
    background: transparent;
    color: #ffffff;
    border: 1px solid #ffffff;
}
.btn.outline2:hover {
    background: #ffffff;
    color: #333;
    border: 1px solid #333;
}

/* Section title */
.section-title {
    font-size: 3rem;
    font-weight: 700;
}

/* Header */
.site-header {
    background: #f9f9f8;
    /* border-bottom: 1px solid #D7D5CF; */
}
.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 1rem 0;
    position: relative;
}
.logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.logo img {
    width: 5.125rem;
    height: 1.875rem;
}
.logo--dark {
    position: static;
    transform: none;
}
.head-left {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
.catalog-btn {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 0.625rem;
    background: #edebe8;
    border: none;
    padding: 0.625rem 1.15rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.catalog-btn svg {
    width: 0.625rem;
    height: 0.625rem;
    flex-shrink: 0;
}
.catalog-btn:hover {
    background: #333;
    color: #fff;
}
.head-nav {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
.head-nav a:hover, .head-nav a.active{
    opacity: 0.6;
}
.head-nav-link {
    font-weight: 700;
    letter-spacing: -0.04rem;
    transition: color 0.2s ease;
}
.head-nav-link:hover {
}
.head-right {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.head-lang {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-weight: 700;
    user-select: none;
}
.head-lang-img {
    width: 1.35rem;
    height: 1.3rem;
}
.head-lang-arrow {
    transition: transform 0.25s ease;
}
.head-lang.open .head-lang-arrow {
    transform: rotate(180deg);
}
.head-lang-drop {
    position: absolute;
    top: calc(100% + 0.65rem);
    right: -1rem;
    border-radius: 0.75rem;
    padding: 0.4rem 0;
    display: none;
    flex-direction: column;
    min-width: 4rem;
    z-index: 50;
    background: #333;
}
.head-lang.open .head-lang-drop {
    display: flex;
}
.head-lang-opt {
    padding: 0.6rem;
    text-align: center;
    color: #fff;
    transition: opacity 0.2s ease;
}
.head-lang-opt:hover {
    opacity: 0.8;
}

/* Header actions (авторизованный) */
.head-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.head-action {
    position: relative;
    flex-shrink: 0;
    width: 2.875rem;
    height: 2.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: none;
    background: #edede8;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.head-action:hover {
    background: #ddd9d4;
}
.head-action img {
    width: 1.625rem;
    height: 1.625rem;
    object-fit: contain;
}
.head-action-badge {
    position: absolute;
    top: -0.2rem;
    right: -0.2rem;
    z-index: 2;
    padding: 0.125rem 0.375rem 0.125rem 0.3125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6.25rem;
    background: #db4a4a;
    color: #fff;
    font-size: 0.7rem;
    /* font-weight: 700; */
    line-height: 1;
    width: 1.1rem;
    height: 1.1rem;
    /* display: block; */
    font-weight: 400;
    text-align: center;
    padding-bottom: 0.2rem;
    /* font-weight: 700; */
}

/*.site-header {*/
/*    position: relative;*/
/*    z-index: 80;*/
/*}*/
.header-search {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 70;
    display: none;
    padding: 2.75rem 0 2.25rem;
    background: #f9f9f8;
    border-top: 1px solid #dedbd6;
    box-shadow: 0 1.5rem 2rem rgba(51, 51, 51, 0.06);
}
.header-search-inner {
    position: relative;
    width: 43rem;
    max-width: calc(100vw - 2rem);
    margin: 0 auto;
}
.header-search-form {
    position: relative;
    display: flex;
    align-items: center;
    height: 4.125rem;
    border-radius: 0.75rem;
    background: #edebe8;
}
.header-search-icon {
    position: absolute;
    left: 1.3rem;
    width: 1.5rem;
    opacity: 0.55;
}
.header-search-input {
    width: 100%;
    height: 100%;
    padding: 0 1.5rem 0 3.7rem;
    border: 0;
    background: transparent;
    color: #333;
    font-size: 1.1rem;
    outline: none;
}
.header-search-input::placeholder {
    color: #9b9b9b;
}
.header-search-close {
    position: absolute;
    top: 1.2rem;
    right: -3.1rem;
    width: 1.65rem;
    /* height: 2.25rem; */
    border: 0;
    background: transparent;
    cursor: pointer;
}
.header-search-close img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.header-search-content {
    margin-top: 1.15rem;
}
.header-search-history {
    padding-bottom: 1.05rem;
    border-bottom: 1px solid #dedbd6;
}
.header-search-results {
    padding-top: 1.05rem;
}
.header-search-results.empty {
    display: none;
}
.header-search-empty {
    display: none;
    padding-top: 1.05rem;
    color: #9b9b9b;
    font-size: 1.05rem;
    line-height: 1.35;
}
.header-search-empty.show {
    display: block;
}
.header-search-item {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-height: 1.7rem;
    color: #333;
    font-size: 1.05rem;
    line-height: 1.25;
    transition: opacity 0.2s ease;
}
.header-search-item + .header-search-item {
    margin-top: 0.45rem;
}
.header-search-item:hover {
    opacity: 0.65;
}
.header-search-item-icon {
    width: 1.15rem;
    flex-shrink: 0;
    object-fit: contain;
}
.header-search-item-icon.sm{
    width: 0.75rem;
}
.header-search-item.recent {
    color: #9b9b9b;
}
@media (max-width: 1024px) {
    .header-search {
        padding: 1.5rem 0;
    }
    .header-search-inner {
        width: 100%;
    }
    .header-search-close {
        right: 0.2rem;
        top: 5rem;
    }
}

/* Burger */
.burger {
    display: none;
    justify-content: center;
    align-items: center;
    background: none;
    flex-shrink: 0;
}
.burger img {
    width: 1.5rem;
    height: 1.5rem;
}

/* Mob menu */
.mob-menu {
    position: fixed;
    inset: 0;
    z-index: 200;
    visibility: hidden;
    pointer-events: none;
}
.mob-menu.open {
    visibility: visible;
    pointer-events: all;
}
.mob-menu-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.mob-menu.open .mob-menu-overlay {
    opacity: 1;
}
.mob-menu-inner {
    position: absolute;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: #f9f9f8;
    display: flex;
    flex-direction: column;
    padding: 1.25rem 15px;
    gap: 2rem;
    transform: translateX(100%);
    transition: transform 0.3s ease;
}
.mob-menu.open .mob-menu-inner {
    transform: translateX(0);
}
.mob-menu-head {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.mob-close {
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mob-close img {
    width: 1.5rem;
    height: 1.5rem;
}
.mob-nav {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    flex: 1;
}
.mob-nav a {
    font-size: 1.35rem;
}
.mob-nav a:hover {
    color: #555;
}
.mob-menu-btns {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.mob-menu-btns .btn {
    width: 100%;
}

/* Hero */
.hero-section {
    margin-top: 5rem;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hero-slider {
    width: 100%;
}
.hero-slide {
    position: relative;
    overflow: hidden;
    height: 36rem;
}
.hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.hero-slide .container {
    position: relative;
    z-index: 2;
    height: 100%;
}
.hero-white {
    color: white;
}
.hero-slide.hero-slide1 {
    position: relative;
    background: linear-gradient(
        0deg,
        #fafafa 23.79%,
        #f3f1ef 45.31%,
        #dbd7d1 59.72%,
        #d7d5cf 100%
    );
}
.hero-slide1 .hero-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}
.hero-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    width: 36rem;
}
.hero-slide1 .hero-img-wrap {
    flex-shrink: 0;
    width: 50%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    align-self: stretch;
}
.hero-slide1 .hero-product {
    height: 32rem;
    object-fit: contain;
    margin-bottom: 0;
}

.hero-left .hero-inner {
    display: flex;
    align-items: center;
    height: 100%;
}

.hero-center .hero-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-top: 1.25rem;
}
.hero-center .hero-content {
    align-items: center;
    width: 58rem;
}

/* Общие стили контента */
.hero-title {
    font-weight: 400;
}
.hero-desc {
    font-size: 1.5rem;
    /*letter-spacing: -0.075rem;*/
    margin-bottom: 1rem;
}

/* Dots */
.hero-slider .slick-dots {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex !important;
    gap: 0.65rem;
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 10;
}
.hero-slider .slick-dots li button {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    background: #ccc6c2;
    border: none;
    font-size: 0;
    cursor: pointer;
    padding: 0;
    transition: all 0.25s ease-in;
    display: block;
}
.hero-slider .slick-dots li.slick-active button {
    background: #614c40;
}

/* Promo */
.promo-section {
    margin-top: -0.4rem;
    background: #614c40;
    padding: 1.25rem 0;
    position: relative;
    z-index: 2;
}
.promo-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
.promo-card {
    position: relative;
    overflow: hidden;
    border-radius: 0.5rem;
    background: #fff;
    height: 14rem;
    padding: 1.5rem;
}
.promo-card-content {
    height: 100%;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
}
.promo-title {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02rem;
    width: 20rem;
    margin-bottom: 0.65rem;
}
.promo-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}
.promo-date {
    flex-shrink: 0;
    white-space: nowrap;
}
.promo-img {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    left: 0;
    top: 0;
}
.promo-img1 {
    width: 26.3125rem;
    height: 26.3125rem;
    top: 0rem;
    left: 4.5rem;
}
.promo-img2 {
    width: 41.3125rem;
    height: 27.875rem;
    left: 50%;
    transform: translateX(-50%);
    top: -3rem;
}
.promo-img3 {
    width: 46.75rem;
    height: 28rem;
    left: 50%;
    transform: translateX(-50%);
    top: -2rem;
}

/* Category */
.category-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
.category-card {
    position: relative;
    overflow: hidden;
    border-radius: 0.3125rem;
    background: #f3f3f3;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 26rem;
    transition: all 0.35s ease;
}
.category-title {
    position: absolute;
    top: 1.65rem;
    left: 1.65rem;
    z-index: 2;
    font-size: 1.5rem;
    font-weight: 700;
}
.category-img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    inset: 0;
    transition: all 0.35s ease;
}
.category-card:hover .category-img {
    transform: scale(1.06);
}
.category-icon {
    position: absolute;
    right: 0.35rem;
    bottom: 0.35rem;
    z-index: 2;
    width: 2.875rem;
    height: 2.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.1875rem;
    border: 1px solid #333;
    transition: all 0.25s ease-in;
}
.category-icon svg {
    width: 1rem;
    height: auto;
    transition: transform 0.35s ease;
}
.category-card:hover {
    box-shadow: 0 0 11.4px 0 rgba(0, 0, 0, 0.2);
}
.category-card:hover .category-icon svg {
    transform: rotate(45deg);
}

/* Products */
.products-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2.2rem;
}
.products-link {
    text-decoration: underline;
}
.products-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
    row-gap: 2.5rem;
    align-items: stretch !important;
}
.product-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    height: 100% !important;
}
.product-media {
    position: relative;
    overflow: hidden;
    min-width: 0;
    border-radius: 0.45rem;
    background: #f3f3f3;
    margin-bottom: 0.6rem;
    height: 24rem;
}
.product-badge {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    padding: 0.6rem 0.65rem;
    border-radius: 0 0 0.45rem 0;
    font-weight: 700;
    color: #fff;
    font-size: 0.8rem;
}
.product-badge.top {
    border-radius: 0;
}
.product-badge.bottom {
    top: 2.15rem;
}
.product-badge.dark {
    background: #333;
}
.product-badge.sale {
    background: #db4a4a;
}
.product-like {
    position: absolute;
    top: 0.75rem;
    right: 0.8rem;
    z-index: 4;
    background: none;
    border: none;
    padding: 0;
    display: flex;
    cursor: pointer;
}
.product-like svg {
    width: 1.1rem;
    height: auto;
}
.product-stock {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    background: #f9f8f8;
    text-align: center;
    padding: 0.6rem 0;
    font-size: 1.5rem;
    font-weight: 700;
}
.product-card.stock {
}
.product-card.stock .product-slider {
    pointer-events: none;
    opacity: 0.5;
}
.product-card.stock .btn {
    cursor: not-allowed;
}
.product-card.stock .product-info {
    opacity: 0.5;
}
.product-slider {
    position: absolute;
    inset: 0;
    width: 100%;
}
.product-slider .slick-list,
.product-slider .slick-track,
.product-slider .slick-slide,
.product-slider .slick-slide > div {
    height: 100%;
}
.product-slide {
    height: 100%;
    display: flex !important;
    align-items: flex-end;
    justify-content: center;

}
.product-slide img {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}
.product-slider .slick-dots {
    position: absolute;
    right: 0.75rem;
    bottom: 0.75rem;
    z-index: 4;
    display: flex !important;
    align-items: center;
    gap: 0.35rem;
    list-style: none;
    padding: 0;
    margin: 0;
}
.product-slider .slick-dots li {
    width: 1.5rem;
    height: 1.5rem;
}
.product-slider .slick-dots li button {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border-radius: 50%;
    border: 0.1rem solid transparent;
    background-color: #f3f3f3;
    background-size: 200%;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    cursor: pointer;
    box-sizing: border-box;
    transition: all 0.25s ease-in;
    overflow: hidden;
}
.product-slider .slick-dots li button img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.product-slider .slick-dots li.slick-active button {
    border-color: #333;
}
.product-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1 !important;
    min-height: 0;
}
.product-info .btn {
    width: 100%;
    padding-bottom: 0.1rem;
}
.addToCart.in-cart {
    color: #fff;
    background: #959595;
    pointer-events: none;
}
.product-info-bottom {
    margin-top: auto !important;
}
.product-title {
    margin-bottom: 0.65rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.product-price {
    margin-bottom: 0.75rem;
    font-size: 1.5rem;
}
.product-like {
    position: absolute;
    top: 0.75rem;
    right: 0.8rem;
    z-index: 4;
    background: none;
    border: none;
    padding: 0;
    display: flex;
    cursor: pointer;
    color: #614c40;
}
.product-like svg {
    width: 1.3rem;
    height: auto;
    transition: transform 0.25s ease-in;
}
.product-like svg path {
    fill: none;
    transition: fill 0.25s ease-in;
}
.product-like:hover svg {
    transform: scale(1.1);
}
.product-like.active svg path {
    fill: currentColor;
}

.modal {
    position: fixed;
    inset: 0;
    z-index: 430;
    display: none;
}
.modal__layer {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}
.auth-check-inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 28rem;
    max-width: 92%;
    padding: 2rem;
    border-radius: 0.75rem;
    background: #fff;
    text-align: center;
}
.auth-check-close {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 2.5rem;
    line-height: 0.5;
    color: #333;
}
.auth-check-title {
    margin-bottom: 0.75rem;
    font-size: 1.5rem;
}
.auth-check-desc {
    margin: 0 0 1.5rem;
    color: #777;
}
.auth-check-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.auth-check-actions .btn {
    height: 3.15rem;
}

.site-toast-wrap {
    position: fixed;
    top: 6rem;
    right: 1.25rem;
    z-index: 700;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 22rem;
    max-width: calc(100vw - 2rem);
    pointer-events: none;
}
.site-toast {
    transform: translateX(calc(100% + 1.5rem));
    opacity: 0;
    padding: 1rem 1.15rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(51, 51, 51, 0.12);
    background: #fff;
    box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.16);
    color: #333;
    font-weight: 600;
    line-height: 1.35;
    transition: transform 0.3s ease, opacity 0.3s ease;
    pointer-events: auto;
}
.site-toast.show {
    transform: translateX(0);
    opacity: 1;
}
.site-toast.success {
    border-color: rgba(65, 210, 121, 0.35);
    background: #effaf3;
    color: #207844;
}
.site-toast.error {
    border-color: rgba(219, 74, 74, 0.25);
    background: #fff1f1;
    color: #db4a4a;
}

/* Brands */
.brands-inner:not(.slick-initialized) {
    display: flex;
    overflow: hidden;
}
.brands-inner .slick-list{
    overflow: unset;
}
.brands-inner:not(.slick-initialized) .brand-card {
    width: 56.25rem;
}
.brands-inner .slick-slide {
    padding: 0 0.6rem;
}
.brand-card {
    position: relative;
    overflow: hidden;
    height: 22.5rem;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.brand-box {
    position: static;
}
.brand-img {
    position: absolute;
    z-index: 1;
}
.brand-img1 {
    top: 0;
    left: -1rem;
    width: 27rem;
    height: 26rem;
}
.brand-img2 {
    width: 22.75rem;
    height: 100%;
    top: 50%;
    transform: translateY(-50%);
}
.brand-img3 {
    width: 59.625rem;
    height: 59.5625rem;
    left: 50%;
    transform: translateX(-50%);
    top: -14rem;
    z-index: 3;
}
.brand-date {
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    z-index: 3;
}
.brand-title {
    position: absolute;
    z-index: 2;
    top: 30%;
    left: 46%;
    transform: translateY(-50%);
    width: 50%;
    /* padding-right: 3rem; */
    font-weight: 400;
    letter-spacing: -0.15rem;
}
.brand-content {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 46%;
    transform: translateY(-50%);
    width: 54%;
    padding-right: 3rem;
    padding-top: 4.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.brand-desc {
    font-size: 1.5rem;
    margin-bottom: 2.25rem;
}

.brand-card.center .brand-title {
    top: 0;
    left: 0;
    width: 100%;
    padding-right: 0;
    transform: none;
    text-align: center;
    font-size: 7.125rem;
    letter-spacing: -0.35625rem;
}
.brand-card.center .brand-content {
    top: unset;
    bottom: 8rem;
    left: 0;
    width: 100%;
    padding-right: 0;
    padding-top: 0;
    transform: none;
    align-items: center;
    text-align: center;
    z-index: 4;
}
.brand-card.center .brand-desc {
    color: #fff;
    margin-bottom: 1.25rem;
}

/* Collections */
.collections-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}
.collections-sort {
    position: relative;
    border-radius: 0.625rem;
    background: #f3f3f3;
    display: inline-flex;
    padding: 0.625rem 1.25rem;
    justify-content: center;
    align-items: center;
}
.sort-btn {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-weight: 700;
    font-family: Helvetica;
}
.sort-btn svg {
    width: 0.625rem;
    height: 0.625rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}
.collections-sort.open .sort-btn svg {
    transform: rotate(180deg);
}
.sort-drop {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 50;
    min-width: 15rem;
    padding: 0.625rem 1.125rem;
    border-radius: 0.625rem;
    border: 1px solid rgba(0, 0, 0, 0.05);
    background: #f3f3f3;
    display: none;
    flex-direction: column;
    gap: 0.55rem;
}
.collections-sort.open .sort-drop {
    display: flex;
}
.sort-opt {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    cursor: pointer;
    user-select: none;
}
.sort-opt input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.sort-radio {
    position: relative;
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    border: 0.09rem solid #b5b5b5;
    transition: all 0.2s ease-in;
}
.sort-radio::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background: #333;
    transition: transform 0.2s ease-in;
}
.sort-opt input:checked ~ .sort-radio {
    border-color: #333;
}
.sort-opt input:checked ~ .sort-radio::after {
    transform: translate(-50%, -50%) scale(1);
}

.collections-filter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.filter-chip {
    padding: 0.625rem 1rem;
    border-radius: 0.625rem;
    border: 1.5px solid #333;
    background: transparent;
    color: #333;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.25s ease-in;
    font-weight: 700;
    line-height: 1;
    font-size: 0.9rem;
}
.filter-chip:hover,
.filter-chip.active {
    background: #333;
    color: #fff;
}

.collections-inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}
.collection-card {
    position: relative;
    overflow: hidden;
    display: block;
    height: 19.4rem;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.collection-img {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.collection-img1 {
    width: 33.375rem;
    height: 33.375rem;
    left: -3rem;
    top: 1rem;
}
.collection-img2 {
    width: 48.1875rem;
    height: 29.0625rem;
    left: 50%;
    transform: translateX(-50%);
    top: -4rem;
}
.collection-img3 {
    width: 30.6875rem;
    height: 31.875rem;
    top: 50%;
    transform: translateY(-50%);
    left: -3.5rem;
}
.collection-img4 {
    width: 41.9375rem;
    height: 28.75rem;
    left: 50%;
    transform: translateX(-50%);
}
.collection-img5 {
    left: 50%;
    transform: translateX(-50%);
    width: 41.875rem;
    height: 31.875rem;
    top: -2rem;
}
.collection-img6 {
    left: 0;
    top: 0;
    width: 33.0625rem;
    height: 28.75rem;
}
.collection-count {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    padding: 0.35rem 0.75rem;
    border-radius: 0 0 0 0.3125rem;
    background: rgba(194, 194, 194, 0.38);
    backdrop-filter: blur(2px);
    color: #898989;
    font-weight: 300;
}
.collection-content {
    position: relative;
    z-index: 2;
    width: 35%;
    height: 100%;
    margin-left: auto;
    padding-right: 2.5rem;
    padding-top: 2.5rem;
    display: flex;
    flex-direction: column;
}
.collection-title {
    font-weight: 400;
    letter-spacing: -0.15rem;
    margin-bottom: 1.25rem;
}
.collections-empty {
    display: none;
    height: 20rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.75rem;
}
.collections-empty.show {
    display: flex;
}
.collections-empty span {
    font-size: 1.5rem;
    font-weight: 700;
}

/* Our brands */
.ourbrands-title {
    margin-bottom: 2rem;
}
.ourbrands-marquee {
    overflow: hidden;
    width: 100%;
}
.ourbrands-track {
    display: flex;
    align-items: center;
    gap: 1.6rem;
    width: max-content;
    will-change: transform;
    animation: ourbrands-scroll 35s linear infinite;
}
.ourbrands-card {
    flex-shrink: 0;
    width: 15rem;
    height: 8.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.65rem;
    background: #f3f3f3;
}
.ourbrands-logo {
    max-width: 90%;
    max-height: 5rem;
    /* object-fit: cover; */
    object-fit: contain;
}
@keyframes ourbrands-scroll {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(calc(-50% - 0.8rem), 0, 0);
    }
}

/* Footer */
.site-footer {
    position: relative;
    overflow: hidden;
    background: #333;
    color: #fff;
    padding: 1.85rem 0;
    padding-bottom: 2rem;
    font-family: "Helvetica";
    font-weight: 400;
}
.footer-watermark {
    position: absolute;
    top: 50%;
    z-index: 1;
    width: 100%;
    height: 31.125rem;
    pointer-events: none;
}
.footer-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 23rem repeat(4, minmax(0, 1fr));
    margin-bottom: 3rem;
}
.footer-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2.5rem;
}
.footer-logo img {
    width: 5.875rem;
    height: 2.125rem;
}
.footer-contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1.85rem;
}
.footer-contact {
    transition: opacity 0.25s ease-in;
}
a.footer-contact:hover {
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}
.footer-socials {
    display: flex;
    align-items: center;
    gap: 1.35rem;
}
.footer-social {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.25s ease-in;
    font-size: 2rem;
}
.footer-social:hover {
    opacity: 0.7;
}
.footer-col-title {
    margin-bottom: 1.25rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.footer-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
}
.footer-link {
    transition: all 0.25s ease-in;
}
.footer-link:hover, .footer-link.active {
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}
.footer-contacts-mob {
    display: none;
}
.footer-bottom {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.footer-bottom a:hover {
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.br-section {
    padding-top: 7rem;
    /* margin-bottom: 2rem; */
}
.br-inner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.text-inner {
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 1.35rem;
}
.text-block {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
.text-block span {
    font-weight: 700;
}
.text-box {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.text-big {
    font-size: 1.5rem;
    font-weight: 700;
}
.text-ul {
    padding-left: 1.5rem;
}
.text-divider {
    height: 1px;
    background: #e5e5e4;
    width: 100%;
}

.img-section {
    height: 31.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.img-section .big-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.img-section2 {
    height: 28rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.img-section2 .big-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.center-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 5.9375rem;
    height: 2.1875rem;
}

/* Values */
.values-inner {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.values-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 11.6rem;
    padding: 0.75rem;
    border-right: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
}
.values-item:nth-child(3n) {
    border-right: none;
    padding-right: 0;
}
.values-item:nth-child(n + 4) {
    border-bottom: none;
}
.values-title {
    margin-bottom: 2rem;
    font-size: 1.5rem;
}
.values-desc {
    letter-spacing: -0.04rem;
}

/* About */
.about-inner {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 1.25rem;
}
.about-media {
    position: relative;
    overflow: hidden;
    height: 100%;
    border-radius: 0.3125rem;
}
.about-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.about-media-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 5.9375rem;
    height: 2.1875rem;
}
.about-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.about-title {
    margin-bottom: 1.35rem;
}
.about-text {
    margin: 0 0 2rem;
}
.about-text span {
    font-weight: 700;
}
.about-stats {
    display: grid;
    grid-template-columns: repeat(4, auto);
    width: 100%;
    margin-top: auto;
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
}
.about-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    min-height: 9.25rem;
    padding: 1rem;
    border-right: 1px solid #d8d8d8;
}
.about-stat:last-child {
    border-right: 0;
}
.about-stat-num {
    font-size: 2.65rem;
    white-space: nowrap;
    font-weight: 700;
    letter-spacing: -0.15rem;
}
.about-stat-label {
    margin-top: 1.5rem;
}

/* CTA */
.cta-section {
    margin-bottom: 0;
    height: 32rem;
    position: relative;
    overflow: hidden;
}
.cta-back {
    position: absolute;
    z-index: -1;
    inset: 0;
    width: 100%;
    height: 100%;
}
.cta-overlay {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.5) 0%,
        rgba(0, 0, 0, 0.5) 100%
    );
}
.cta-inner {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    align-items: flex-start;
}
.cta-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: #fff;
    padding-top: 8rem;
    padding-right: 2rem;
}
.cta-title {
    margin-bottom: 1.5rem;
}
.cta-desc {
    margin: 0 0 3.5rem;
}
.z5 {
    z-index: 5;
}
.cta-marquee {
    position: relative;
    overflow: hidden;
    display: flex;
    gap: 0.85rem;
    padding: 1.36288rem;
    background: #f9f9f8;
}
.cta-col {
    flex: 1;
    min-width: 0;
}
.cta-col-track {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    will-change: transform;
}
.cta-col-track .product-media {
    height: 13.5rem;
}
.cta-col-down .cta-col-track {
    animation: cta-scroll-down 28s linear infinite;
}
.cta-col-up .cta-col-track {
    animation: cta-scroll-up 28s linear infinite;
}
.cta-col .product-media {
    margin-bottom: 0.5rem;
}
.cta-col .product-title {
    min-height: 2.9rem;
    margin-bottom: 0.4rem;
    font-size: 1.15rem;
}
.cta-col .product-price {
    margin-bottom: 0.5rem;
    font-size: 1.15rem;
}
.cta-col .product-btn {
    height: 2.15rem;
    font-size: 1rem;
}
.cta-product-img {
    position: absolute;
    left: 50%;
    bottom: 5%;
    transform: translateX(-50%);
    z-index: 1;
    max-width: 78%;
    max-height: 90%;
    object-fit: contain;
}
@keyframes cta-scroll-down {
    from {
        transform: translate3d(0, calc(-50% - 0.425rem), 0);
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
@keyframes cta-scroll-up {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(0, calc(-50% - 0.425rem), 0);
    }
}

.products-total {
    opacity: 0.5;
}
.sort-filter {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Filter panel */
.filter-btn {
    width: 1.625rem;
    height: 1.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
}
.filter-btn img {
    width: 100%;
    height: 100%;
}
.filter-panel {
    position: fixed;
    inset: 0;
    z-index: 300;
    visibility: hidden;
    pointer-events: none;
}
.filter-panel.open {
    visibility: visible;
    pointer-events: all;
}
.filter-panel-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.filter-panel.open .filter-panel-overlay {
    opacity: 1;
}
.filter-panel-inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 31.25rem;
    height: 100%;
    overflow-y: auto;
    background: #fff;
    padding: 2.25rem;
    padding-right: 1.25rem;
    transform: translateX(-100%);
    transition: transform 0.35s ease;
}
.filter-panel.open .filter-panel-inner {
    transform: translateX(0);
}
.filter-panel-head {
    display: flex;
    align-items: center;
    gap: 1.15rem;
    margin-bottom: 2.25rem;
}
.filter-panel-head-in {
    display: flex;
    align-items: flex-end;
    gap: 1.15rem;
}
.filter-reset {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-decoration: underline;
    color: #333;
    text-decoration-line: underline;
    text-underline-offset: 0.2rem;
    opacity: 0.5;
    padding-bottom: 0.5rem;
}
.filter-close {
    margin-left: auto;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 2.5rem;
    line-height: 1;
    color: #333;
}

.filter-switch-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    cursor: pointer;
    user-select: none;
}
.filter-switch-text {
    font-size: 1.5rem;
}
.filter-switch-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.filter-switch {
    position: relative;
    flex-shrink: 0;
    width: 2.15rem;
    height: 0.75rem;
    border-radius: 1.15rem;
    border: 1px solid #333;
    transition: all 0.25s ease-in;
}
.filter-switch::after {
    content: "";
    position: absolute;
    left: -0.1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    border: 1px solid #333;
    background: #fff;
    transition: all 0.25s ease-in;
}
.filter-switch-input:checked ~ .filter-switch {
    background: #333;
}
.filter-switch-input:checked ~ .filter-switch::after {
    left: calc(100% - 1.25rem);
    background: #fff;
}

.filter-group {
    margin-bottom: 1.5rem;
}
.filter-group-title {
    margin-bottom: 1rem;
    font-size: 1.5rem;
}
.filter-price {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.filter-price-in {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.filter-price-input {
    padding: 0.625rem 1rem;
    border: 1px solid #333;
    border-radius: 0.625rem;
    width: 8rem;
    text-align: center;
    color: #333;
    background: transparent;
    font-size: 1rem;
}
.filter-price-field {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.filter-price-field::after {
    content: "\20B8";
    position: absolute;
    right: 1rem;
    color: #333;
    font-size: 1rem;
    pointer-events: none;
}
.filter-price-field .filter-price-input {
    padding-right: 2.2rem;
}
.filter-price-line {
    width: 2rem;
    height: 1px;
    flex-shrink: 0;
    background: #333;
}

.filter-acc {
    margin-bottom: 1.5rem;
}
.filter-acc-head {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #333;
}
.filter-acc-icon {
    position: relative;
    flex-shrink: 0;
    width: 1.2rem;
    height: 1.2rem;
}

.filter-acc-icon::before,
.filter-acc-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    background: #333;
    transition: transform 0.35s ease;
}

.filter-acc-icon::before {
    width: 1.1rem;
    height: 0.11rem;
    transform: translate(-50%, -50%) rotate(0deg);
}

.filter-acc-icon::after {
    width: 0.11rem;
    height: 1.1rem;
    transform: translate(-50%, -50%) rotate(0deg);
}
.filter-acc.open .filter-acc-icon::before,
.filter-acc.open .filter-acc-icon::after {
    transform: translate(-50%, -50%) rotate(45deg);
}
.filter-acc-title {
    font-size: 1.5rem;
}
.filter-acc-body {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.35s ease;
}
.filter-acc.open .filter-acc-body {
    max-height: 25rem;
}
.filter-acc-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 1rem;
}
.filter-check {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    cursor: pointer;
    user-select: none;
}
.filter-check input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.filter-check-box {
    position: relative;
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
    border: 1px solid #333;
    transition: all 0.2s ease-in;
    display: flex;
    align-items: center;
    justify-content: center;
}
.filter-check-box::after {
    content: "";
    position: absolute;
    left: 0.26rem;
    top: 0.06rem;
    width: 0.3rem;
    height: 0.5rem;
    border: solid #fff;
    border-width: 0 0.11rem 0.11rem 0;
    transform: rotate(45deg) scale(0);
    transition: transform 0.2s ease-in;
}
.filter-check input:checked ~ .filter-check-box {
    background: #333;
}
.filter-check input:checked ~ .filter-check-box::after {
    transform: rotate(45deg) scale(1);
}

.filter-panel-inner {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.filter-panel-inner::-webkit-scrollbar {
    display: none;
}

.catalog-content .category-card {
    height: 10rem;
}
.catalog-content .category-inner {
    grid-template-columns: repeat(4, 1fr);
}
.catalog-content .category-title {
    top: 1.15rem;
    left: unset;
    right: 1.15rem;
    font-weight: 400;
    text-align: right;
}

/* Brand list */
.brandlist-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
.brandlist-controls .collections-filter {
    margin-bottom: 0;
}
.brandlist-inner {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3.75rem 1.25rem;
}
.brandlist-card {
    display: block;
}
.brandlist-media {
    position: relative;
    overflow: hidden;
    height: 13.6rem;
    border-radius: 0.3125rem;
    margin-bottom: 1rem;
}
.brandlist-img {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.brandlist-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.5) 0%,
        rgba(0, 0, 0, 0.5) 100%
    );
}
.brandlist-card:hover .brandlist-img {
    transform: scale(1.05);
}
.brandlist-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 15.31944rem;
    height: 3.925rem;
    filter: brightness(0) invert(1);
    object-fit: scale-down;
}
.brandlist-count {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 3;
    border-radius: 0 0.3125rem;
    background: rgba(255, 255, 255, 0.38);
    backdrop-filter: blur(2px);
    padding: 0.385rem 0.85rem;
    color: #fff;
    font-weight: 300;
}
.brandlist-arrow {
    position: absolute;
    right: 1.35rem;
    bottom: 1.15rem;
    z-index: 3;
    display: flex;
    color: #fff;
    transition: transform 0.25s ease-in;
}
.brandlist-arrow svg {
    width: 1.9rem;
    height: auto;
}
.brandlist-card:hover .brandlist-arrow {
    transform: translateX(0.35rem);
}
.brandlist-desc {
    margin: 0;
}

/* Product */
.prod-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    /*align-items: center;*/
}
.prod-gallery {
    position: relative;
    overflow: hidden;
    height: 41rem;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.prod-slider,
.prod-slider .slick-list,
.prod-slider .slick-track,
.prod-slider .slick-slide,
.prod-slider .slick-slide > div {
    height: 100%;
}
/* .prod-slider {
    height: 33rem;
} */
.prod-slide {
    height: 100%;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.prod-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.prod-arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    width: 2.875rem;
    height: 2.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dcdcdc;
    border-radius: 0.5rem;
    background: transparent;
    color: #cbcbcb;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.prod-arrow:hover {
    border-color: #333;
    color: #333;
}
.prod-arrow svg {
    width: 1.35rem;
    height: auto;
}
.prod-prev {
    left: 1.25rem;
}
.prod-prev svg {
    transform: rotate(180deg);
}
.prod-next {
    right: 1.25rem;
}
.prod-thumbs {
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 1.25rem;
    z-index: 2;
}
.no_img{
    width: 100%;
    height: 100%;
    position: relative;
    background: #e8e8e8;
    display: flex!important;
    align-items: center;
    justify-content: center;
}
.no_img:after{
    content: "Нет фото";
    opacity: 0.3;
    color: black;
}
.prod-thumb {
    height: 5rem;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 0.3125rem;
    border: 1px solid #aaaaaa;
    background: #f9f8f8;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.25s ease-in;
    opacity: 0.5;
}
.prod-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.prod-thumbs .slick-current .prod-thumb {
    opacity: 1;
    border: 1px solid #614c40;
}
.prod-thumbs .slick-slide {
    margin: 0 0.325rem;
}
.prod-thumbs .slick-list {
    margin: 0 -0.325rem;
}

.prod-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 0.5rem;
}
.prod-title {
    letter-spacing: -0.15rem;
    font-weight: 400;
}
.prod-stock {
    position: relative;
    flex-shrink: 0;
    padding-left: 1.15rem;
    margin-top: 0.5rem;
}
.prod-stock.red::before{
    background: red;
}
.disabled{
    pointer-events: none;
    opacity: 0.4;
}
.prod-stock::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    background: #41d279;
}
.prod-rating {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 2.5rem;
}
.prod-rating-num {
    font-size: 1.5rem;
}
.prod-stars {
    display: flex;
    gap: 0.1rem;
    font-size: 1.35rem;
    color: #c9c9c9;
}
.prod-star.active {
    color: #333;
}
.prod-price {
    margin-bottom: 1.5rem;
    font-size: 3rem;
    font-weight: 700;
    letter-spacing: -0.1rem;
}
.prod-colors {
    margin-bottom: 1.5rem;
}
.prod-colors-title {
    margin-bottom: 0.65rem;
}
.prod-colors-list {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.prod-color {
    position: relative;
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.prod-color::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 2.235rem;
    height: 2.235rem;
    border-radius: 50%;
    border: 1px solid transparent;
    transition: border-color 0.25s ease-in;
    margin-right: 0.9rem;
}
.prod-color.active::after {
    border-color: #333;
}
.prod-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 2.5rem;
}
.prod-cart {
    flex: 1;
    height: 3.375rem;
    border-radius: 0.625rem;
}
.prod-like {
    flex-shrink: 0;
    width: 3.375rem;
    height: 3.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 0.625rem;
    background: #333;
    color: #fff;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.prod-like:hover {
    background: #515151;
}
.prod-like svg {
    width: 1.45rem;
    height: auto;
}
.prod-like svg path {
    fill: none;
    transition: fill 0.25s ease-in;
}
.prod-like.active svg path {
    fill: currentColor;
}

.prod-tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid #dcdcdc;
}
.prod-tab {
    position: relative;
    background: none;
    border: none;
    padding: 0 0 0.75rem;
    cursor: pointer;
    font-size: 1.5rem;
    font-weight: 400;
    color: #b1b1b1;
    white-space: nowrap;
    transition: all 0.25s ease-in;
}
.prod-tab::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 0.15rem;
    background: #333;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}
.prod-tab.active {
    color: #000000;
    /*font-weight: 700;*/
}
.prod-tab.active::after {
    transform: scaleX(1);
}
.prod-tab-body {
    display: none;
}
.prod-tab-body.active {
    display: block;
}
.prod-text {
    margin: 0 0 1rem;
}
.prod-text:last-child {
    margin-bottom: 0;
}
.prod-text span {
    font-weight: 700;
}

/* Reviews */
.reviews-title {
    margin-bottom: 1.5rem;
}
.reviews-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
}
.reviews-list-col,
.reviews-stat-col {
    display: flex;
    flex-direction: column;
}
.reviews-sort {
    position: relative;
    align-self: flex-start;
    margin-bottom: 1.5rem;
}
.reviews-sort-btn {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.625rem 1.25rem;
    border: none;
    border-radius: 0.625rem;
    background: #f3f3f3;
    color: #333;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.25s ease-in;
}
.reviews-sort-btn svg {
    width: 0.65rem;
    height: 0.65rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}
.reviews-sort.open .reviews-sort-btn svg {
    transform: rotate(180deg);
}
.reviews-sort-drop {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    z-index: 50;
    min-width: 13rem;
    padding: 0.75rem 1.125rem;
    border-radius: 0.625rem;
    border: 1px solid rgba(0, 0, 0, 0.05);
    background: #f3f3f3;
    display: none;
}
.reviews-sort.open .reviews-sort-drop {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.reviews-list {
    /* margin-bottom: 1.5rem; */
}
.review-item {
    margin-bottom: 1.5rem;
}
.review-item.hidden {
    display: none;
}
.review-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.65rem;
}
.review-name {
    font-size: 1.25rem;
}
.review-date {
    flex-shrink: 0;
    color: #9a9a9a;
    font-weight: 300;
}
.review-stars {
    display: flex;
    gap: 0.15rem;
    margin-bottom: 0.65rem;
    font-size: 1.35rem;
    color: #c9c9c9;
}
.review-star.active {
    color: #333;
}
.review-text {
    margin: 0;
}
.reviews-more {
    width: 100%;
    height: 3.35rem;
    margin-top: auto;
}

.reviews-rating {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 1.5rem;
}
.reviews-rating-num {
    font-size: 3rem;
    font-weight: 700;
    letter-spacing: -0.1rem;
}
.reviews-rating-stars {
    display: flex;
    gap: 0.15rem;
    font-size: 2rem;
    color: #a5a5a5;
}
.reviews-rating-count {
    align-self: center;
}
.reviews-bars {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1.15rem;
}
.reviews-bar {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}
.reviews-bar-label {
    flex-shrink: 0;
    width: 2rem;
}
.reviews-bar-track {
    position: relative;
    flex: 1;
    height: 0.75rem;
    border-radius: 0.2rem;
    background: #d6d6d6;
    overflow: hidden;
}
.reviews-bar-fill {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-radius: 0.2rem;
    background: #333;
}
.reviews-bar-count {
    flex-shrink: 0;
    width: 1.5rem;
    text-align: right;
}
.reviews-add {
    width: 100%;
    height: 3.35rem;
    margin-top: auto;
}
.reviews-empty {
    padding: 2rem;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.reviews-empty-title {
    margin-bottom: 0.5rem;
    font-size: 1.25rem;
    font-weight: 700;
}
.reviews-empty-text {
    margin: 0;
    color: #777;
}
.reviews-form {
    display: block;
}
.reviews-form .checkout-field{
    margin-bottom: 0.5rem;
}
.reviews-form-title {
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 700;
}
.reviews-form-rating {
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 0.2rem;
    margin-bottom: 1rem;
}
.reviews-form-rating input {
    display: none;
}
.reviews-form-rating label {
    font-size: 2rem;
    line-height: 1;
    color: #b8b8b8;
    cursor: pointer;
    transition: color 0.2s ease-in;
}
.reviews-form-rating label:hover,
.reviews-form-rating label:hover ~ label,
.reviews-form-rating input:checked ~ label {
    color: #333;
}
.reviews-textarea {
    min-height: 8rem;
    padding-top: 1rem;
    resize: vertical;
}
.reviews-submit {
    width: 100%;
    height: 3.35rem;
    margin-top: 0.75rem;
}
.reviews-submit:disabled {
    cursor: default;
    opacity: 0.65;
}
.reviews-form-msg {
    display: none;
    margin-top: 0.75rem;
    padding: 0.95rem 1rem;
    border-radius: 0.3125rem;
    border: 1px solid rgba(51, 51, 51, 0.12);
    background: #fff;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
}
.reviews-form-msg.show {
    display: block;
}
.reviews-form-msg.success {
    border-color: rgba(65, 210, 121, 0.35);
    background: #effaf3;
    color: #207844;
}
.reviews-form-msg.error {
    border-color: rgba(176, 0, 32, 0.2);
    background: #fff1f3;
    color: #b00020;
}
.reviews-form.success .checkout-field,
.reviews-form.success .reviews-form-rating,
.reviews-form.success .reviews-submit {
    opacity: 0.55;
}

.review-modal {
    position: fixed;
    inset: 0;
    z-index: 420;
    visibility: hidden;
    pointer-events: none;
}
.review-modal.open {
    visibility: visible;
    pointer-events: all;
}
.review-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.review-modal.open .review-modal-overlay {
    opacity: 1;
}
.review-modal-inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    width: 32rem;
    max-width: 92%;
    padding: 2rem;
    border-radius: 0.75rem;
    background: #fff;
    opacity: 0;
    transition: all 0.3s ease;
}
.review-modal.open .review-modal-inner {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}
.review-modal-close {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    z-index: 3;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 2.5rem;
    line-height: 0.5;
    color: #333;
}
.review-modal-title {
    margin-bottom: 0.75rem;
    font-size: 1.5rem;
}
.review-modal-desc {
    margin: 0 0 1rem;
    color: #777;
}
.in-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
.in-grid img {
    height: 27.5rem;
    width: 100%;
    border-radius: 0.3125rem;
    object-fit: cover;
}

/* Contacts */
.contacts-title {
    margin-bottom: 2.5rem;
}
.contacts-inner {
    display: grid;
    grid-template-columns: 20.75rem 22.75rem minmax(0, 1fr);
    gap: 2rem;
}
.contacts-block {
    margin-bottom: 2rem;
}
.contacts-block:last-child {
    margin-bottom: 0;
}
.contacts-block-title {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.contacts-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.85rem;
}
.contacts-link {
    transition: all 0.25s ease-in;
}
.contacts-link:hover {
    color: #895739;
}
.contacts-addr {
    background: none;
    border: none;
    padding: 0;
    text-align: left;
    color: #333;
    cursor: pointer;
    transition: color 0.25s ease-in;
}
.contacts-addr:hover,
.contacts-addr.active {
    color: #895739;
}
.contacts-map {
    overflow: hidden;
    height: 21.25rem;
    border-radius: 0.625rem;
    background: #f3f3f3;
}
.contacts-map iframe {
    width: 100%!important;
    height: 100%!important;
    border: none;
}
/* Checkout */
.checkout-title {
    margin-bottom: 2.5rem;
}
.checkout-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.85rem;
}
.checkout-form {
    padding-right: 1.85rem;
    border-right: 1px solid #e5e5e5;
}
.checkout-block {
    margin-bottom: 1.5rem;
}
.checkout-block-title {
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.checkout-fields {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.checkout-field {
    position: relative;
    display: block;
}
.checkout-req {
    position: absolute;
    left: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    color: #895739;
    pointer-events: none;
    line-height: 1;
    font-size: 1.5rem;
}
.checkout-input {
    width: 100%;
    height: 3.625rem;
    padding: 1.25rem;
    padding-left: 2.25rem;
    border: none;
    border-radius: 0.65rem;
    background: #f3f3f3;
    color: #333;
    font-size: 1rem;
}
.checkout-input::placeholder {
    color: #9a9a9a;
}

.checkout-select {
    position: relative;
}
.checkout-select-btn {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    width: 100%;
    height: 3.625rem;
    padding: 0 1.25rem 0 2.25rem;
    border: none;
    border-radius: 0.65rem;
    background: #f3f3f3;
    color: #333;
    cursor: pointer;
    text-align: left;
}
.checkout-select-text {
    flex: 1;
}
.checkout-select-btn svg {
    width: 0.85rem;
    height: 0.85rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}
.checkout-select.open .checkout-select-btn svg {
    transform: rotate(180deg);
}
.checkout-card-icon {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
}
.checkout-select-drop {
    position: absolute;
    top: calc(100% + 0.4rem);
    left: 0;
    right: 0;
    z-index: 50;
    padding: 0.5rem 0;
    border-radius: 0.65rem;
    background: #fff;
    box-shadow: 0 0.25rem 1.5rem rgba(0, 0, 0, 0.12);
    display: none;
}
.checkout-select.open .checkout-select-drop {
    display: block;
}
.checkout-select-opt {
    display: block;
    width: 100%;
    padding: 0.6rem 2.15rem;
    background: none;
    border: none;
    text-align: left;
    color: #333;
    cursor: pointer;
    transition: background 0.2s ease-in;
}
.checkout-select-opt:hover {
    background: #f3f3f3;
}

.checkout-radios {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.checkout-radio {
    padding: 0;
}

.checkout-comment {
    padding-top: 1.35rem;
    border-top: 1px solid #e5e5e5;
}
.checkout-textarea {
    width: 100%;
    height: 12.5rem;
    padding: 1.25rem 2.25rem;
    border: none;
    border-radius: 0.625rem;
    background: #f3f3f3;
    color: #333;
    resize: none;
    font-size: 1rem;
}
.checkout-textarea::placeholder {
    color: #9a9a9a;
}

.checkout-order-title {
    margin-bottom: 1.5rem;
}
.checkout-items {
    margin-bottom: 1.5rem;
}
.checkout-item {
    display: flex;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e5e5e5;
}
.checkout-item-media {
    flex-shrink: 0;
    overflow: hidden;
    width: 7.75rem;
    height: 7.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.checkout-item-media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}
.checkout-item-content {
    flex: 1;
    min-width: 0;
}
.checkout-item-name {
    margin-bottom: 0.65rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.checkout-item-params {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 1.15rem;
    opacity: 0.5;
}
.checkout-item-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.checkout-item-prices {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.checkout-item-price {
    font-size: 1.5rem;
}
.checkout-item-old {
    font-size: 1.25rem;
    opacity: 0.5;
    text-decoration: line-through;
}
.checkout-qty {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}
.checkout-qty-btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 1.5rem;
    line-height: 1;
    color: #333;
    transition: all 0.25s ease-in;
}
.checkout-qty-btn:hover {
    opacity: 0.6;
}
.checkout-qty-val {
    min-width: 1rem;
    text-align: center;
    font-size: 1.5rem;
}

.checkout-promo {
    margin-bottom: 1.5rem;
}
.checkout-promo .checkout-input {
    border: 2px dashed #e5e5e4;
}
.checkout-sums {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin-bottom: 1.5rem;
}
.checkout-sum {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}
.checkout-sum-val {
    font-weight: 700;
}
.checkout-sum.discount {
    color: #db4a4a;
}
.checkout-total {
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.checkout-submit {
    width: 100%;
    height: 3.45rem;
    border-radius: 0.65rem;
}
.checkout-policy {
    margin: 1.15rem 0 0;
    opacity: 0.5;
    font-size: 0.875rem;
}
.checkout-policy a {
    text-decoration: underline;
}
.checkout-policy a:hover {
    text-decoration: none;
}
.checkout-address-block.hidden {
    display: none;
}
.checkout-add-address {
    width: 100%;
    height: 3.15rem;
    margin-top: 0.85rem;
    border-radius: 0.65rem;
}
.checkout-address-empty {
    margin-bottom: 0;
}
.checkout-empty,
.checkout-success {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
}
.checkout-item-name {
    display: block;
    color: inherit;
}
.checkout-item-name:hover {
    opacity: 0.7;
}

/* Account */
.account-title {
    margin-bottom: 1.5rem;
}
.account-tabs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.35rem;
}
.account-body {
    display: none;
}
.account-body.active {
    display: block;
}
.account-form {
    width: 42rem;
    margin: 0 auto;
}
.account-block-title {
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 700;
}
.account-block-title-gap {
    margin-top: 2.15rem;
}
.account-eye {
    position: absolute;
    right: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    display: flex;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.25s ease-in;
}
.account-eye:hover {
    opacity: 0.65;
}
.account-eye img {
    width: 1.15rem;
    height: 1.15rem;
    object-fit: contain;
}
.account-hint {
    margin: 0.7rem 0 1.75rem;
    color: #9a9a9a;
    font-size: 0.85rem;
}
.account-btn {
    width: 100%;
    height: 3.25rem;
    border-radius: 0.65rem;
}
.account-danger {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 4.5rem;
}
.account-logout {
    background: #db4a4a;
    color: #fff;
}
.account-logout:hover {
    background: #b33636;
}
.account-delete {
    background: transparent;
    color: #db4a4a;
    border: 1px solid #db4a4a;
}
.account-delete:hover {
    background: #db4a4a;
    color: #fff;
}
.addr-empty {
    padding: 1rem;
    border-radius: 0.5rem;
    background: #f3f3f3;
    color: #777;
    text-align: center;
}
.addr-delete-form {
    flex: 1;
}
.addr-delete-form .confirm-yes {
    width: 100%;
}

.account-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
.orders-total {
    flex-shrink: 0;
    color: #9a9a9a;
}

/* Orders */
.orders-wrap {
    width: 42rem;
    margin: 0 auto;
}
.orders-list {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.orders-history-title {
    margin: 2.35rem 0 0.65rem;
    padding-left: 0.15rem;
}
.order-card {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    height: 7.5rem;
    padding: 1.25rem;
    border-radius: 0.65rem;
    background: #f3f3f3;
}
.order-info {
    flex-shrink: 0;
    width: 13.85rem;
    border-right: 1px solid #dfdfdf;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.order-status {
    margin-bottom: 0.5rem;
    font-size: 1rem;
    font-weight: 700;
}
.order-addr {
    display: flex;
    gap: 0.5rem;
}
.order-addr-key {
    flex-shrink: 0;
}
.order-addr-val {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.order-thumbs {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.order-thumb {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    width: 5rem;
    height: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e2e2;
    border-radius: 0.5rem;
    background: #f9f8f8;
}
.order-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.order-thumb.more {
    /* width: auto; */
}
.order-thumb.more img {
    opacity: 0.25;
}
.order-thumb-more {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    font-weight: 700;
}
.order-sum {
    flex-shrink: 0;
    text-align: right;
    font-weight: 700;
}
.order-sum-key {
    display: block;
}
.order-card.canceled {
    color: #a6a6a6;
    user-select: none;
}
.order-card.canceled .order-thumb img {
    opacity: 0.45;
}

/* Order detail */
.orderdet-back {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.35rem;
    transition: opacity 0.25s ease-in;
}
.orderdet-back:hover {
    opacity: 0.65;
}
.orderdet-back svg {
    width: 1.6rem;
    height: auto;
    transform: rotate(180deg);
}
.orderdet-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}
.orderdet-title {
    font-size: 1.25rem;
}
.orderdet-title-gap {
    margin-bottom: 1.25rem;
}
.orderdet-num {
    flex-shrink: 0;
    color: #9a9a9a;
}
.orderdet-rows {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 3.75rem;
}
.orderdet-row {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}
.orderdet-row-key {
    flex-shrink: 0;
    font-weight: 700;
}
.orderdet-row-line {
    flex: 1;
    height: 1px;
    background: #e5e5e5;
}
.orderdet-row-val {
    flex-shrink: 0;
    max-width: 14rem;
    text-align: right;
}
.orderdet-sums {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-bottom: 3.75rem;
}
.orderdet-sums .checkout-sum {
}
.orderdet-total {
    font-size: 1.25rem;
    font-weight: 700;
}
.divider {
    height: 1px;
    background: #e5e5e4;
}
.orderdet-items {
    margin-bottom: 3.75rem;
}
.orderdet-item {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid #e5e5e5;
}
.orderdet-item:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
}
.orderdet-item-media {
    flex-shrink: 0;
    overflow: hidden;
    width: 7.75rem;
    height: 7.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.orderdet-item-media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}
.orderdet-item-content {
    flex: 1;
    min-width: 0;
}
.orderdet-item-content .checkout-item-name {
    margin-bottom: 0.5rem;
    font-size: 1.5rem;
}
.orderdet-item-content .checkout-item-params {
    margin-bottom: 0;
}
.orderdet-item-prices {
    flex-shrink: 0;
    display: flex;
    align-items: baseline;
    gap: 0.7rem;
}
.orderdet-actions {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.orderdet-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
}
.orderdet-old {
    text-decoration-line: line-through;
}

/* Address page */
.addr-list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin-bottom: 1.5rem;
}
.addr-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    width: 100%;
    height: 3.625rem;
    padding: 0 1.25rem 0 2.25rem;
    border: none;
    border-radius: 0.65rem;
    background: #f3f3f3;
    color: #333;
    cursor: pointer;
    text-align: left;
}
.addr-del {
    flex-shrink: 0;
    display: flex;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.25s ease-in;
}
.addr-del:hover {
    opacity: 0.6;
}
.addr-del img {
    width: 1.375rem;
    height: 1.375rem;
    object-fit: contain;
}
.addr-add {
    gap: 0.6rem;
}
.addr-add-plus {
    font-size: 1.25rem;
}

/* Address modal */
.addr-modal {
    position: fixed;
    inset: 0;
    z-index: 400;
    visibility: hidden;
    pointer-events: none;
}
.addr-modal.open {
    visibility: visible;
    pointer-events: all;
}
.addr-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.addr-modal.open .addr-modal-overlay {
    opacity: 1;
}
.addr-modal-inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    display: grid;
    width: 30rem;
    max-width: 95%;
    padding: 3rem 1.25rem;
    overflow: hidden;
    border-radius: 0.75rem;
    background: #fff;
    opacity: 0;
    transition: all 0.3s ease;
    align-items: center;
}
.addr-modal.open .addr-modal-inner {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}
.addr-modal-close {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    z-index: 3;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 2.5rem;
    line-height: 0.5;
    color: #333;
}
.addr-modal-map {
    overflow: hidden;
    background: #f3f3f3;
    height: 100%;
    border-radius: 0.3125rem;
}
.addr-modal-frame {
    width: 100%;
    height: 100%;
    border: none;
}
.addr-modal-content {
    display: flex;
    flex-direction: column;
}
.addr-modal-title {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.addr-modal-desc {
    margin: 0 0 1.5rem;
}
.addr-modal-fields {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.65rem;
}
.addr-modal-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}
.addr-modal-input,
.addr-modal-select .checkout-select-btn {
    height: 3.5rem;
    padding: 0 1rem;
    font-size: 1rem;
}
.addr-modal-save {
    width: 100%;
    height: 3.4375rem;
    border-radius: 0.65rem;
}

/* Confirm modal */
.confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 500;
    visibility: hidden;
    pointer-events: none;
}
.confirm-modal.open {
    visibility: visible;
    pointer-events: all;
}
.confirm-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.cart-clear-confirm-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.confirm-modal.open .confirm-modal-overlay {
    opacity: 1;
}
.cart-clear-confirm.open .cart-clear-confirm-overlay {
    opacity: 1;
}
.confirm-modal-inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    padding: 1.5rem 1.875rem;
    border-radius: 0.65rem;
    background: #fff;
    text-align: center;
    opacity: 0;
    transition: all 0.3s ease;
}
.confirm-modal.open .confirm-modal-inner {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}
.confirm-modal-title {
    margin-bottom: 1.15rem;
    font-size: 1.5rem;
}
.cart-clear-confirm-desc {
    max-width: 20rem;
    margin: -0.45rem auto 1.25rem;
    color: rgba(30, 30, 30, 0.68);
    font-size: 0.95rem;
    line-height: 1.45;
}
.confirm-modal-btns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
}

/* Payment page */
.pay-row {
    height: 3.65rem;
}
.pay-row .addr-row-text {
    display: flex;
    align-items: center;
    gap: 1.75rem;
}

.pay-modal {
    position: fixed;
    inset: 0;
    z-index: 400;
    visibility: hidden;
    pointer-events: none;
}
.pay-modal.open {
    visibility: visible;
    pointer-events: all;
}
.pay-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.pay-modal.open .pay-modal-overlay {
    opacity: 1;
}
.pay-modal-inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    width: 35.4375rem;
    max-width: 92%;
    padding: 2.5rem;
    border-radius: 0.75rem;
    background: #fff;
    opacity: 0;
    transition: all 0.3s ease;
}
.pay-modal.open .pay-modal-inner {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}
.pay-card {
    position: relative;
    height: 16.5rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
}
.pay-card img {
    width: 100%;
    height: 100%;
}
.pay-modal-fields {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1.5rem;
}
.pay-modal-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
}
.pay-input {
    height: 3.15rem;
    padding-left: 1.25rem;
}
.pay-modal-save {
    width: 100%;
    height: 2.95rem;
    border-radius: 0.5rem;
}

/* Cart panel */
.cart-panel {
    position: fixed;
    inset: 0;
    z-index: 400;
    visibility: hidden;
    pointer-events: none;
}
.cart-panel.open {
    visibility: visible;
    pointer-events: all;
}
.cart-panel-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.cart-panel.open .cart-panel-overlay {
    opacity: 1;
}
.cart-panel-inner {
    position: absolute;
    right: 0;
    top: 0;
    width: 37.4rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #f9f8f8;
    transform: translateX(100%);
    transition: transform 0.35s ease;
    padding: 2.5rem;
}
.cart-panel.open .cart-panel-inner {
    transform: translateX(0);
}
.cart-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
}
.cart-title {
    font-size: 1.8rem;
}
.cart-head-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.cart-clear {
    display: flex;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: opacity 0.25s ease-in;
}
.cart-close {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: color 0.25s ease-in;
}
.icon-img {
    width: 1.375rem;
    height: 1.375rem;
    flex-shrink: 0;
}
.icon-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-body {
    flex: 1;
    overflow-y: auto;
    scrollbar-width: none;
}
.cart-body::-webkit-scrollbar {
    display: none;
}
.cart-item {
    display: flex;
    align-items: center;
    gap: 1.15rem;
    margin-bottom: 1.15rem;
}
.cart-item-media {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    width: 10rem;
    height: 10rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.3125rem;
    background: #f3f3f3;
}
.cart-item-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cart-like {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    z-index: 2;
    display: flex;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #333;
}
.cart-like svg {
    width: 1.25rem;
    height: auto;
}
.cart-like svg path {
    fill: none;
    transition: fill 0.25s ease-in;
}
.cart-like.active svg path {
    fill: currentColor;
}
.cart-item-content {
    flex: 1;
    min-width: 0;
}
.cart-item-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.65rem;
}
.cart-item-head .checkout-item-name {
    margin-bottom: 0;
    font-size: 1.25rem;
}
.cart-item-del {
    flex-shrink: 0;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: color 0.25s ease-in;
    height: 1.15rem;
    width: 1.15rem;
}
.cart-item-del img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cart-item .checkout-item-params {
    margin-bottom: 1.5rem;
    font-size: 0.85rem;
}
.cart-item-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.cart-empty {
    display: none;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    height: 100%;
}
.cart-panel.empty .cart-empty {
    display: flex;
}
.cart-panel.empty .cart-items,
.cart-panel.empty .cart-foot .cart-total,
.cart-panel.empty .cart-foot {
    display: none;
}
.cart-empty-title {
    margin-bottom: 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.cart-empty-desc {
    margin: 0 0 3.75rem;
    color: #a3a3a3;
}
.cart-foot {
    padding-top: 1rem;
    border-top: 1px solid #e5e5e5;
}
.cart-total {
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.cart-btn {
    width: 100%;
    height: 3.25rem;
    border-radius: 0.5rem;
}
.cart-empty .cart-btn {
    width: 100%;
}

/* Auth */
.auth-section {
    padding-top: 6rem;
}
.auth-back {
    display: inline-flex;
    align-items: center;
    gap: 1.35rem;
    transition: opacity 0.25s ease-in;
}
.auth-back:hover {
    opacity: 0.65;
}
.auth-back svg {
    width: 1.85rem;
    height: auto;
    transform: rotate(180deg);
}
.auth-inner {
    width: 27.5rem;
    margin: 2.2rem auto 0;
    text-align: center;
}
.auth-title {
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
    font-weight: 700;
}
.auth-desc {
    margin: 0 0 2rem;
}
.auth-fields {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    text-align: left;
}
.auth-input {
    height: 3.25rem;
    padding-left: 1.25rem;
    border-radius: 0.75rem;
    border: 1px solid transparent;
    transition: border-color 0.25s ease-in;
}
.auth-pass .auth-input {
    padding-right: 3rem;
}
.checkout-field.error .auth-input {
    border-color: #db4a4a;
}
.auth-hint {
    margin: 0.9rem 0 0;
    text-align: left;
    color: #a3a3a3;
    font-size: 0.85rem;
}
.auth-hint.error {
    color: #db4a4a;
}
.auth-btns {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 2rem;
}
.result {
    width: 100%;
}
.result p {
    margin: 0;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(219, 74, 74, 0.22);
    border-radius: 0.5rem;
    background: #fff1f1;
    color: #db4a4a !important;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
    margin-bottom: 0.5rem;
    text-align: center;
}
.result p.form-success,
.result p.success {
    border-color: rgba(65, 210, 121, 0.35);
    background: #effaf3;
    color: #207844 !important;
}
.result p.form-info,
.result p.info {
    border-color: rgba(51, 51, 51, 0.12);
    background: #f3f3f3;
    color: #333 !important;
}
.auth-btn {
    width: 100%;
    height: 3.15rem;
    border-radius: 0.75rem;
}
.auth-policy {
    margin: 2rem 0 0;
    color: #a3a3a3;
    font-size: 0.85rem;
}
.auth-policy a {
    text-decoration: underline;
}

.auth-code {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}
.auth-code-cell {
    width: 5.9375rem;
    height: 7.5rem;
    border-radius: 0.625rem;
    border: 1px solid #d8d8d8;
    background: #f3f3f3;
    text-align: center;
    font-size: 1.85rem;
    color: #333;
    transition: border-color 0.25s ease-in;
}
.auth-code.error .auth-code-cell {
    border-color: #db4a4a;
}
.auth-code-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
}
.auth-code-error {
    display: none;
    color: #db4a4a;
    font-size: 0.85rem;
}
.auth-code.error ~ .auth-code-foot .auth-code-error {
    display: block;
}
.auth-code-resend {
    margin-left: auto;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #333;
    font-size: 0.85rem;
    text-decoration: underline;
    transition: opacity 0.25s ease-in;
}
.auth-code-resend:hover {
    opacity: 0.65;
}
.auth-code-resend:disabled {
    color: #a3a3a3;
    cursor: default;
}
#post_product_gallery{
    position: relative;
}


.content h1{
    font-size: 1.8rem;
    margin-bottom: 1rem;
}
.content h2{
    font-size: 1.6rem;
    margin-bottom: 1rem;
}
.content h3{
    font-size: 1.5rem;
    margin-bottom: 1rem;
}
.content h4{
    font-size: 1.25rem;
    margin-bottom: 1rem;
}
.content h5{
    font-size: 1.1rem;
    margin-bottom: 1rem;
}
.content h6{
    font-size: 1.1rem;
    margin-bottom: 1rem;
}
.cart-items .no_img {
    font-size: 0.8rem;
}
