/* import Rokkitt and Figtree from Google */
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Rokkitt:ital,wght@0,100..900;1,100..900&display=swap');

/* style font weight, color and uppercase */
.categories-navbar .category-title,
.navigation-menu .show-all-panel .content .category-l1-menu .category-name,
.navigation-menu .category-panel .category-l1 a,
.navigation-menu .category-panel .view-columns .column .category-l2,
.category-item .category-name,
.product-item .product-name,
.button-primary,
.button-secondary,
.category .title,
.product-details .product-name,
.product-order-summary .summary-header,
.list-container .cart-header .list-title,
.cart-summary-content-container .cart-summary-title,
.no-results .top-section .no-results-title,
.subtitleProductName,
.subtitle,
.AboutUs .title,
.AboutUs .AboutUsHeading {
    font-weight: 700;
}

.footer .footHeading {
    font-weight: 500;
    text-transform: uppercase;
}

.navigation-menu .category-panel .view-columns .column .category-l3 {
    color: var(--text-color-ultra-dark);
    text-decoration: none;
}

/* footer style */
.footer a {
    text-decoration: none;
    font-weight: 700;
}

.footer a:hover {
    text-decoration: underline;
    color: inherit;
}

/* hide element on home */
.home .promotion-wrapper {
    display: none;
}

/* home widget */
.home-details .home-title {
    margin-bottom: 30px;
}

.home-details .home-section {
    margin-bottom: 30px;
}

.home-details h1 {
    color: var(--text-color-heading);
    font-weight: 700;
}

.home-details h3 {
    color: var(--text-color-ultra-dark);
    font-weight: 200;
}

.home-details .category-title {
    margin-bottom: 15px;
    font-family: var(--font-family1);
    font-size: var(--text-size-h3);
    font-weight: 500;
    color: var(--text-color-heading);
}

.home-details p {
    margin-bottom: 15px;
    font-size: var(--text-size-label);
    color: var(--text-color-ultra-dark);
    font-weight: var(--default-font-weight);
}

.home-details a {
    color: var(--color-highlight);
    font-weight: 700;
}

.home-details a:hover {
    text-decoration: none;
}

.home-details .fw-700 {
    font-weight: 700;
}

.home-details .fw-500 {
    font-weight: 500;
}

.home-details .text-blue {
    color: var(--text-color-heading);
}

@media (max-width: 1199px) {
    .home-details h3 {
        font-size: calc(0.7 * var(--text-size-h3));
    }
}