/* ------------------------------------------------------------ *\
 * MEDIA QUERY
\* ------------------------------------------------------------ */

/**
 * FIT SIZE: 768PX
 */
@media screen and (min-width: 768px) {
    /**
     * RESET
     */
    body { padding-block-end: 0; }

    /**
     * REUSED STYLE
     */
    .main { padding-block: 130px 0; }

    /**
     * COMPONENTS
     */

    /* Tooltips */
    .tooltip { display: flex; }

    /* Modal */
    .modal.searchbar .modal-content { padding: 30px !important; }

    /**
     * MAIN – INSIDE
     */

    /* Hero Section */
    .hero,
    .hero .carousel-item { height: calc(100dvh - 130px); }

    .hero .title {
        font-size: var(--fs-h1) !important;
        font-weight: var(--fw-bold) !important;
        line-height: var(--lh-h1) !important;
    }
}

/**
 * FIT SIZE: 992px
 */
@media screen and (min-width: 992px) {
    /**
     * REUSED STYLE
     */
    .title-section .title {
        font-size: var(--fs-h1) !important;
        font-weight: var(--fw-bold) !important;
        line-height: var(--lh-h1) !important;
    }

    /**
     * COMPONENTS
     */

    /* Cards */
    .card-main .btn-card { bottom: -50px; }

    .card-main .card-overflow .icon-btn { right: -50px; }

    .card-main .card-overflow:hover .btn-card { bottom: 14px; }

    .card-main .card-overflow:hover .icon-btn { right: 14px; }

    .card-cutomer {
        grid-template-columns: 234px 1fr;
        grid-template-rows: 1fr;
    }

    /**
     * MAIN – OUTSIDE
     */

    /* Footer */
    .footer .footer-bottom {
        flex-direction: row;
        align-items: center;
    }

    /**
     * MAIN – INSIDE
     */

    /* Hero Section */
    .hero .title {
        font-size: 80px !important;
        font-weight: 500 !important;
        line-height: 90px !important;
    }

    /* Offer Section */
    .offer-section .container {
        grid-template-columns: 450px 600px;
        grid-template-rows: max-content;
        justify-content: space-between;
        gap: 30px;
    }

    .offer-section .container img { height: 450px; }

    .offer-section .body {
        padding: 40px 60px 36px;
        position: absolute;
        bottom: 80px;
        left: 45%;
        z-index: 10;
        transform: translateX(-50%);
        max-width: 420px;
    }

    .offer-section .body .title {
        font-size: var(--fs-h1) !important;
        font-weight: var(--fw-bold) !important;
        line-height: var(--lh-h1) !important;
    }

    .offer-section .img-two { margin-block-start: 80px; }

    /* Shop Wrapper */
    .shop-wrapper { grid-template-columns: 317px 1fr; }

    /* Offcanvas */
    .filter {
        position: static;
        width: 100%;
        height: max-content;
        transform: translateX(0%) !important;
        padding: 0;
        z-index: 0;
    }

    /* Details Section */
    .details-section .details-card {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 1fr;
    }

    .details-section .details-card .img-grid {
        position: sticky;
        top: 16px;
        height: max-content;
        transition: top 0.4s;
    }

    .details-section .details-card .img-grid.active { top: 96px; }

    .details-section .nav { justify-content: center; }

    .details-section .tab-content .tab-pane { padding: 30px; }

    /* FAQs Section */
    .faqs .contact-us {
        position: sticky;
        top: 16px;
        height: max-content;
        transition: top 0.4s;
    }

    .faqs .contact-us.active { top: 96px; }

    /* Checkout */
    .checkout .container { grid-template-columns: 1fr 600px; }

    .checkout .container .column.column-1 {
        border-inline-end: 1.8px solid var(--border-color);
        border-bottom-color: transparent;
        padding-inline-end: 54px;
    }

    .checkout .container .column:last-child { padding-inline-start: 54px; }

    /* Shopping Cart */
    .shopping-cart .grid { grid-template-columns: minmax(0, 1fr) 380px; }
}

/**
 * FIT SIZE: 1440px
 */
@media screen and (min-width: 1440px) {}