/*!
Theme Name:   Storefront
Theme URI:    https://woocommerce.com/products/storefront/
Author:       Automattic
Author URI:   https://woocommerce.com/
Description:  Storefront is the perfect theme for your next WooCommerce project. Designed and developed by WooCommerce Core developers, it features a bespoke integration with WooCommerce itself plus many of the most popular customer facing WooCommerce extensions. There are several layout & color options to personalise your shop, multiple widget regions, a responsive design and much more. Developers will love its lean and extensible codebase making it a joy to customize and extend. Looking for a WooCommerce theme? Look no further!
Version:      4.6.2
Tested up to: 6.7
Requires PHP: 5.6.0
License:      GNU General Public License v3 or later
License URI:  https://www.gnu.org/licenses/gpl-3.0.html
Text Domain:  storefront
Tags:         e-commerce, two-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, featured-images, full-width-template, threaded-comments, accessibility-ready, rtl-language-support, footer-widgets, sticky-post, theme-options, editor-style

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Storefront is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer https://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/

All sizing (typography, layout, padding/margins, etc) are inspired by a modular scale that uses 1em as a base size with a 1.618 ratio.
You can read more about the calculator we use in our Sass here: https://github.com/modularscale/modularscale-sass

FontAwesome License: SIL Open Font License - http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Images License: GNU General Public License v2 or later
*//*!
 * normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css
 */
 
 @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Unbounded:wght@200..900&display=swap');

html,
body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    font-family: "Montserrat", sans-serif !important;
}

.main {
    flex: 1 0 auto;
}

.site-footer {
    flex-shrink: 0;
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1320px !important;
    }
}

.header {
    margin-top: 20px;
    margin-bottom: 20px;
}

.header-left__menu-block {
    border-radius: 100px;
    background: #1B263B;
    padding: 17px 20px;
    max-width: 205px;
    cursor: pointer;
}

.new-products-slider .product-item {
    padding: 10px;
    text-align: center;
}

.new-products-slider .product-title {
    font-size: 16px;
    margin: 10px 0 5px;
}

.new-products-slider .slick-slide, .sale-products-slider .slick-slide {
    padding: 0 10px; /* відступ МІЖ слайдами */
}

.new-products-slider, .sale-products-slider {
    margin: 0 -10px; /* компенсуємо, щоб крайні не мали відступів */
}

.product-item img {
    width: 100%;
}

.product-item .product-info {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-right: 1px solid rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    border-left: 1px solid rgba(0, 0, 0, 0.05);
    padding: 15px;

}

.product-item a img {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.product-title {
    text-align: left;
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 171.429% */
    margin-bottom: 5px;
}

.product-item a {
    text-decoration: none;
}

.sale-products-slider .price del {
    text-decoration: none;
}

.sale-products-slider .price ins {
    text-decoration: none;
    text-decoration-line: none;
}

.sale-products-slider .price ins .amount bdi {
    text-decoration: none;
    text-decoration-line: none;
    color: #C80000;
font-family: Montserrat;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 14px; /* 100% */
}

.price {
    width: 100%;
    display: block;
    text-align: left;
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 100% */
}

.header-left__menu-block span {
    margin-left: 10px;
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 100% */
    text-transform: uppercase;
}

.banner-block {
    border-radius: 20px;
    background: url('./assets/images/banner-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
}

.banner-block__left {
    padding-left: 25px;
}

.preheader {
    background: #1B263B;
    padding-top: 13px;
    padding-bottom: 13px;
}

.preheader-menu__block {
    list-style: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    max-width: 452px;
}

.link-item {
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 116.667% */
    text-decoration: none;
}

.preheader-phone a {
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px;
    text-transform: uppercase;
    text-decoration: none;
    margin-right: 11px;
}

.time-block__mn {
    margin-bottom: 0 !important;
    color: #000;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 100% */
    margin-left: 5px;
}

.footer h4 {
    color: #F8EBD7;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px; /* 200% */
    margin-bottom: 5px;
}

.preheader-phone {
    margin-right: 11px;
}

.footer-copywrite {
    padding-top: 10px;
    margin-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-copywrite p {
    margin-bottom: 0 !important;
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
}

.preheader-phone:last-child {
    margin-right: 15px;
}

.preheader-lang {
    border-radius: 5px;
    background: #F8EBD7;
    padding: 5px 10px;
    cursor: pointer;
}

.preheader-lang span {
    color: #000;
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 100% */
    margin-right: 3px;
}

.footer {
    padding-bottom: 10px;
    padding-top: 30px;
    background: rgba(27, 38, 59, 0.98);
}

.footer-menu__block {
    list-style: none;
    padding: 0;
}

.footer-left p {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
    max-width: 285px;
}

.footer-social span {
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 20px; /* 166.667% */
    margin-bottom: 10px;
    
}

.footer-social__link a {
    width: 25px;
    display: block;
    height: 25px;
}

.footer-social__link {
    width: 25px;
}

.footer-social__link img {
    width: 100%;
    height: auto;
}

.footer-social__link {
    margin-right: 10px;
}

.footer-social__link:last-child {
    margin-right: 0;
}

.footer-contact__block {
    border-radius: 20px;
    background: #FFF;
    
}

.footer-contact__block .block {
    padding: 15px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.footer-contact__block span {
    color: #000;
    font-family: Unbounded !important;
    font-size: 10px;
    font-style: normal;
    font-weight: 300;
    line-height: 10px; /* 100% */
    margin-bottom: 10px;
    display: block;
}

.footer-phone a {
    color: #000;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 100% */
    margin-left: 5px;
    text-decoration: none;
}

.footer-top {
    background: url('./assets/images/isign-bg.svg');
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 30px;
    padding-top: 30px;
}

.footer-top p {
    margin-bottom: 0 !important;
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
    max-width: 488px;
}

.footer-top .title {
    color: #1B263B;
    font-family: Unbounded !important;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px; /* 133.333% */
    text-transform: uppercase;
    margin-bottom: 10px;
}

.footer-top input {
    border-radius: 100px;
    background: #FFF;
    padding: 10px 20px;
    border: none;
    margin-right: 15px;
    max-width: 285px;
}

.footer-top input:placeholder {
    color: #969696 !important;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px; /* 200% */
}

.footer-top .form-send {
    padding: 11px 30px;
    border-radius: 100px;
    background: #1B263B;
    color: #FFF;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    text-decoration: none;
    line-height: 22px; /* 183.333% */
    height: 45px;
    display: block;
    width: max-content;
}

.footer-top .form-send svg {
    margin-left: 15px;
}

.banner h1 {
    color: #121212;
    font-family: Unbounded !important;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 45px; /* 150% */
    text-transform: uppercase;
    margin-bottom: 15px;
}

.banner .content-text {
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
}

.banner .content-text li::before {
    content: '';
    width: 3px;
    height: 3px;
    background: #000;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0.6em;
}

.banner .content-text li {
    position: relative;
    padding-left: 14px;
}

.banner .content-text ul {
    list-style: none;
    padding-left: 10px;
}

.banner-block__left-button {
    padding: 12px 30px;
    border-radius: 100px;
    background: #1B263B;
    color: #FFF;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px; /* 183.333% */
    display: block;
    width: max-content;
    text-decoration: none;
}

.banner-block__left-button svg {
    margin-left: 15px;
}

.banner {
    margin-bottom: 50px;
}

/* Контейнер точек */
.slick-dots {
    display: flex !important;
    justify-content: center;
    gap: 10px; /* расстояние между точками */
}

/* li */
.slick-dots li {
    width: 10px;
    height: 10px;
    margin: 0;
}

/* кнопка */
.slick-dots li button {
    width: 10px;
    height: 10px;
    padding: 0;
}

/* убираем стандартную точку */
.slick-dots li button:before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid #e5e5e5; /* неактивная */
    opacity: 1;
}

/* активная точка */
.slick-dots li.slick-active button:before {
    background: #f3e3c7; /* цвет активной */
    border-color: #f3e3c7;
}

.custom-arrow {
    background: #F8EBD7;
    border: none !important;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.custom-arrow:hover {
    background: #F8EBD7 !important;
}

.custom-arrow::before {
    display: none; /* прибираємо дефолтні стрілки slick */
}

.custom-arrow {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slick-prev {
    left: -50px;
}

.slick-next {
    right: -50px;
}

.advantages {
    margin-bottom: 50px;
}

.advantages-title {
    color: #1B263B;
    text-align: center;
    font-family: Unbounded !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 100% */
    margin-bottom: 7px;
    margin-top: 10px;
}

.advantages-desc {
    color: #000;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
    max-width: 350px;
    margin: 0 auto;
}

.new {
    margin-bottom: 50px;
}

.h2-title {
    color: #1B263B;
    font-family: Unbounded !important;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px; /* 133.333% */
    text-transform: uppercase;
}

.more-link {
    width: 100%;
    color: #121212;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px; /* 183.333% */
    text-decoration: none;
}

.more-link svg {
    margin-left: 10px;
}

.add_to_cart_button {
    display: block;
    width: 100%;
    margin-top: 15px !important;
    border-radius: 100px;
    background: #F8EBD7 !important;
    padding: 10px;
    color: #121212;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 100% */
    margin: 0 auto;
    text-align: center;
    height: 33px;
}

.add_to_cart_button svg {
    margin-right: 10px;
}

.product-item {
    position: relative;
    overflow: visible;
}

.product-image {
    overflow: hidden;
    border-radius: 20px;
}

.product-badge.sale {
    background: #C80000 !important;
}

.product-badge.new, .product-badge.sale {
    position: absolute;
    top: 15px;
    left: 27px;
    z-index: 10;
    border-radius: 100px;
background: #1B263B;
padding: 4px 10px;
    color: #FFF;
    font-family: Unbounded !important;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 120% */
    
    pointer-events: none;
}

.category-big-inner {
    border-radius: 20px;
    background: linear-gradient(0deg, rgba(27, 38, 59, 0.98) 0%, rgba(27, 38, 59, 0.98) 100%), url(<path-to-image>) lightgray 50% / cover no-repeat;
    padding: 25px;
    height: 300px;
}

.category-small-content {
    border-radius: 20px;
    padding: 25px;
    height: 300px;
    display: flex;
    align-items: start;
    flex-direction: column;
    justify-content: space-between;
    background: url('./assets/images/cat-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
}

.category-big-content {
    height: 100%;
    display: flex;
    align-items: start;
    flex-direction: column;
    justify-content: space-between;
}

.category-big-content h2, .category-small-content h3 {
    color: #FFF;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: 40px; /* 133.333% */
    text-transform: uppercase;
    margin-bottom: 10px;
}

.category-small-content h3 {
    color: #000;
}

.category-small-content p {
    color: #000 !important;
}

.category-big-content p, .category-small-content p {
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px; /* 162.5% */
    max-width: 350px;
}

.category-big-content a {
    border-radius: 100px;
    background: #F8EBD7;
    max-width: 234px;
    width: 100%;
    border: none;
    color: #000;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px; /* 183.333% */
    text-decoration: none;
    text-align: center;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.category-big-content a:hover {
    background: #F8EBD7;
    color: #000;
}

.category-small-content a {
    border-radius: 100px;
    background: #1B263B;
    max-width: 234px;
    width: 100%;
    border: none;
    color: #fff;
    text-align: justify;
    font-family: Unbounded !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px; /* 183.333% */
    text-decoration: none;
    height: 45px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

.category-small-content a:hover {
    background: #1B263B;
    color: #fff;
}

.category-big-content svg, .category-small-content svg {
    margin-left: 15px;
}

.home-categories {
    margin-bottom: 50px;
}

.product-rating {
    display: flex;
    align-items: center;
    gap: 6px;
}

.product-rating .stars {
    display: flex;
    gap: 2px;
}

.product-rating .reviews-count {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #000;
    font-size: 11px;
    font-style: normal;
    font-weight: 300;
    line-height: 11px; /* 100% */
}

.product-rating .stars {
    display: flex;
    gap: 2px;
}

.amount bdi {
    color: #000;
font-family: Montserrat;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 14px; /* 100% */
}