/** Shopify CDN: Minification failed

Line 218:0 All "@import" rules must come first

**/
/* --- Premium Landing Page Header --- */
.payment-header {
    background-color: #f5f4f0 !important; /* Soft sand/beige tone matching image_7f3b85.png */
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 60px !important; /* Balanced spacing on left and right */
    box-sizing: border-box;
    width: 100% !important;
}

/* Elegant brand typography styling */
.payment-header .logo {
    font-family: 'Playfair Display', 'Didot', 'Georgia', serif !important; /* Elegant serif font choice */
    font-size: 45px !important;
    font-weight: bold !important;
    letter-spacing: 2px !important; /* Clean layout spacing between letters */
    color: #000000 !important;
    text-transform: none;
}

/* Icon container positioning */
.payment-header .header-icons {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important; /* Gap separating the cart icon and hamburger menu */
}

/* Cart Icon layout reset */
.payment-header .header-icons a {
    text-decoration: none !important;
    font-size: 30px !important;
    color: #000000 !important;
    display: inline-flex;
    align-items: center;
}

/* Menu Toggle Button styling reset */
.payment-header .header-icons button {
    background: transparent !important;
    border: none !important;
    font-size: 30px !important;
    color: #000000 !important;
    cursor: pointer !important;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

/* Mobile responsive layout balance */
@media (max-width: 749px) {
    .payment-header {
        padding: 12px 20px !important;
    }
    .payment-header .logo {
        font-size: 22px !important;
        letter-spacing: 1px !important;
    }
    .payment-header .header-icons {
        gap: 15px !important;
    }
}

body:has(.payment-header) .shopify-section-group-header-group,
body:has(.payment-header) header {
    display: none !important;
}

/* Menu Button */

.menu-toggle{
    background:none;
    border:none;
    font-size:30px;
    cursor:pointer;
}

/* Mobile Menu */

.mobile-menu{

    display:none;

    position:absolute;

    top:80px;

    right:20px;

    width:220px;

    background:#fff;

    border-radius:10px;

    box-shadow:0 10px 30px rgba(0,0,0,.15);

    overflow:hidden;

    z-index:999;

}

.mobile-menu.active{
    display:block;
}

.mobile-menu a{

    display:block;

    padding:16px 20px;

    color:#222;

    text-decoration:none;

    border-bottom:1px solid #eee;

    transition:.3s;

}

.mobile-menu a:hover{

    background:#f5f5f5;

}

@media(min-width:750px){

   .mobile-menu{
    display:none;
    position:fixed;
    top:70px;
    right:20px;

    width:260px;

    background:#fff;

    border-radius:10px;

    box-shadow:0 10px 30px rgba(0,0,0,.15);

    z-index:999999;

    overflow:hidden;
}

.mobile-menu.active{
    display:block !important;
}

.mobile-menu a{
    display:block;
    padding:16px 20px;
    color:#000;
    text-decoration:none;
    border-bottom:1px solid #eee;
}

.mobile-menu a:hover{
    background:#f5f5f5;
}

}

/* HERO */

.hero-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 60px;      /* Slightly increased horizontal padding for a wider banner feel */
    background: #dbd7c6;     /* Light cream/off-white background matching the first image */
}

.hero-left {
    width: 50%;              /* Adjusted slightly to leave more breathing room in the center */
}

.hero-left img {
    width: 100%;
    display: block;
}

.hero-right {
    width: 50%;
    text-align: center;      /* Centers all text elements and the button perfectly */
}

.hero-right h1 {
    font-family: 'Playfair Display', 'Didot', 'Georgia', serif; /* Elegant serif font for "Muzi&Kai" */
    font-size: 64px;         /* Larger, prominent heading size */
    font-weight: 700;
    color: #000000;
    margin-bottom: 20px;
    letter-spacing: 1px;
}

.hero-right h3 {
    font-family: 'Montserrat', 'Helvetica Neue', sans-serif; /* Clean sans-serif for subheadings */
    font-size: 20px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 4px;     /* Distinct spaced-out styling for "TIMELESS ELEGANCE" */
    color: #1a1a1a;
    margin-bottom: 20px;
}

@import url('https://fonts.googleapis.com/css2?family=Satisfy&display=swap');

.hero-right p {
    font-family: "Satisfy", cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 42px;
    color: #6b7444;
}

.shop-btn {
    display: inline-block;
    background: #5b633a;     /* Deep moss/olive green color extracted directly from the button */
    color: #ffffff;
    padding: 16px 50px;      /* Wider, more substantial padding for a premium look */
    text-decoration: none;
    border-radius: 6px;      /* Slightly tighter corner radius matching the button shape */
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    transition: background 0.3s ease;
}

.shop-btn:hover {
    background: #474e2d;     /* Smooth hover state for better UX */
}

/* ==========================
   Mobile Responsive
========================== */
@media (max-width: 749px) {

    /* 1. Main Hero Banner Container Stack */
    .hero-banner {
        display: flex !important;
        flex-direction: row !important; /* Forces the left column image on top, right column text below */
        align-items: center !important;
        justify-content: center !important;
        padding: 45px 24px !important;    /* Clean luxury spacing padding */
        gap: 28px !important;              /* Elegant breathing room between product and text stack */
        text-align: center !important;     /* Centers all typography elements beautifully */
        background-color: #f5f2e9 !important; /* Perfect match for the sand/canvas backdrop */
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. Left Column (Image Container) Mobile Set */
    .hero-left {
        width: 100% !important;            /* Expands to full width instead of breaking at 50% */
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 0 5px 0 !important;
    }

    .hero-left img {
        width: 100% !important;
        max-width: 290px !important;       /* Matches the sleek presentation size of image_8e9c86.png */
        height: auto !important;
        object-fit: contain !important;
    }

    /* 3. Right Column (Text Content Block) Mobile Set */
    .hero-right {
        width: 100% !important;            /* Expands to full horizontal space */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;    /* Locks text alignment perfectly to the center axis */
        justify-content: center !important;
    }

    /* Muzi&Kai Luxury Brand Title */
    .hero-right h1 {
        font-family: 'Playfair Display', 'Didot', 'Georgia', serif !important;
        font-size: 34px !important;        /* Crisp, readable presentation sizing */
        font-weight: 700 !important;
        line-height: 1.15 !important;
        margin: 0 0 10px 0 !important;
        color: #000000 !important;
        letter-spacing: 0.5px !important;
    }

    /* TIMELESS ELEGANCE Sub-Heading */
    .hero-right h3 {
        font-family: 'Helvetica Neue', Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 2px !important;   /* Spaced luxury tracking layout */
        text-transform: uppercase !important;
        margin: 0 0 16px 0 !important;
        color: #2b2b2b !important;
    }

    /* "Designed for Every Moment" Elegant Cursive Line */
    .hero-right p {
        font-family: 'Playfair Display', 'Georgia', serif !important;
        font-style: italic !important;     /* Creates the signature elegant cursive feel */
        font-size: 24px !important;        /* Matches the prominent display aspect ratio */
        line-height: 1.3 !important;
        margin: 0 0 28px 0 !important;
        color: #555555 !important;
    }

    /* 4. Mini Pill-Shaped "SHOP NOW" Action Button */
    .shop-btn {
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 210px !important;        /* Strict custom desktop capsule scale down */
        background-color: #6a7444 !important; /* Lighter olive green brand accent tone */
        color: #ffffff !important;
        padding: 13px 24px !important;     /* Premium vertical padding proportions */
        font-family: 'Helvetica Neue', Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: 1.5px !important;
        border-radius: 8px !important;     /* Clean capsule card corner smoothing */
        text-decoration: none !important;
        box-sizing: border-box !important;
        transition: background-color 0.2s ease;
    }
    
    .shop-btn:hover {
        background-color: #596239 !important;
    }
}

/* Main Product Grid */
#products .product-grid {
    display: flex !important;
    flex-direction: column !important;
    max-width: 100% !important;
    margin: 0 auto;
    padding: 10px 0px !important;
    background: #faf9f6;
}

/* Product Row */
#products .product-card {
    display: flex !important;
    align-items: center !important;
        justify-content: space-evenly !important;
    width: 100% !important;
    padding: 20px 0 !important;
    border-bottom: 1px solid #f0eee8 !important;
    background: transparent !important;
    box-sizing: border-box;
}

/* Left Content */
#products .product-card > a {
    display: flex !important;
    align-items: center !important;
    
    gap: 20px;
    text-decoration: none !important;
}

/* Image */
#products .product-img-wrapper {
    width: 300px !important;
    height: 300px !important;
    background: #f7f6f2;
    border-radius: 12px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-shrink: 0;
}

#products .product-img-wrapper img {
    width: auto !important;
    height: 90% !important;
    object-fit: contain;
}

/* Product Info */
#products .product-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#products .product-card h3 {
    margin: 0 0 8px;
    font-size: 25px;
    font-weight: 600;
    color: #2b2b2b;
    font-family: Helvetica, Arial, sans-serif;
}

#products .product-card p {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #444;
    font-family: Helvetica, Arial, sans-serif;
}

/* Right Button (Smaller Column) */
#products .pay-now-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;

    width: 170px !important;
    min-width: 170px !important;

    padding: 14px 18px !important;


    background: #6a7444;
    color: #fff !important;

    border-radius: 10px;
    text-decoration: none;
    text-transform: uppercase;

    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;

    flex-shrink: 0;

    transition: .3s;
}

#products .pay-now-btn:hover {
    background: #596239;
}

#products .lock-icon {
    font-size: 16px;
    line-height: 1;
}

/* Mobile */
@media (max-width:749px){

    #products .product-grid{
        padding:10px !important;
        gap:10px !important;
    }

    #products .product-card{
        align-items:center;
        padding:10px 0px !important;
    }

    #products .product-card > a{
        gap:25px;
        margin-right:10px !important;
    }

    #products .product-img-wrapper{
        width:100px !important;
        height:110px !important;
    }

    #products .product-card h3{
        font-size:16px;
    }

    #products .product-card p{
        font-size:14px;
    }

    #products .pay-now-btn{
        width:120px !important;
        min-width:120px !important;
        padding:10px 12px !important;
        font-size:12px;
        border-radius:8px;
    }

    #products .lock-icon{
        font-size:13px;
    }
}

/* --- Landing Page Footer Styles --- */
.landing-footer {
    background-color: #f5f2e9 !important; /* Perfect match for the light sand canvas color */
    color: #1a1a1a !important;
    padding: 50px 60px !important;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    border-top: 1px solid #e7e2d5;
}

/* Master container setting up the horizontal column spread */
.landing-footer .footer-container {
    max-width: 1300px;
    margin: 0 auto;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    flex-wrap: wrap;
    gap: 40px;
}

/* Base setup for columns */
.landing-footer .footer-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1;
    min-width: 200px;
}

/* Column 1: Elegant Serif Branding Typography matching the top banner header */
.landing-footer .brand-column .footer-logo {
    font-family: 'Playfair Display', 'Didot', 'Georgia', serif !important;
    font-size: 40px !important; /* Larger display footprint */
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    margin-bottom: 12px !important;
    color: #000000 !important;
}

.landing-footer .brand-column .tagline {
        font-family: "Satisfy", cursive;
    font-style: italic !important;
    font-size: 17px !important;
    color: #555555 !important;
    margin: 0 !important;
    letter-spacing: 0.5px;
}

.landing-footer .brand-column .sub-tagline {
        font-family: "Satisfy", cursive;
    font-style: italic !important;
    font-size: 17px !important;
    color: #666666 !important;
    margin: 6px 0 0 0 !important;
    letter-spacing: 0.5px;
}

/* Typography styles for Column Headers */
.landing-footer .footer-column h3 {
    font-family: 'Helvetica Neue', Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    text-transform: capitalize !important;
    margin: 0 0 18px 0 !important;
    color: #000000 !important;
    letter-spacing: 0.2px;
}

/* Vertical text alignment inside links column */
.landing-footer .footer-links {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
}

.landing-footer .footer-links a,
.landing-footer .footer-email {
    font-size: 14px !important;
    color: #333333 !important;
    text-decoration: none !important;
    font-weight: 400;
    transition: color 0.2s ease;
}

.landing-footer .footer-links a:hover,
.landing-footer .footer-email:hover {
    color: #6a7444 !important; /* Brand olive green contrast hover state */
}

/* Matte Black Social Icons Layout */
.landing-footer .footer-social {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    margin-top: 16px;
    align-items: center;
}

.landing-footer .footer-social .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #1a1a1a !important; /* Flat solid vector style */
    text-decoration: none !important;
    width: 20px;
    height: 20px;
    transition: opacity 0.2s;
}

.landing-footer .footer-social .social-icon svg {
    width: 100%;
    height: 100%;
}

.landing-footer .footer-social .social-icon:hover {
    opacity: 0.6;
}

/* Premium Payment badge strip matching image 2 layout styles */
.landing-footer .payment-icons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.landing-footer .pay-badge {
    background: #ffffff !important;
    color: #000000 !important;
    padding: 8px 16px !important; /* Wider luxury proportion badges */
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    box-sizing: border-box;
}

/* Bottom copyright stamp alignment layout */
.landing-footer .copyright {
    text-align: center !important;
    font-size: 15px !important;
    font-weight:600 !important;
    color: #000000ff !important;
    margin: 60px 0 0 0 !important;
    border-top: 1px solid #e7e2d5 !important;
    padding-top: 25px !important;
    width: 100%;
    letter-spacing: 0.4px;
}

/* Seamless Conversion Optimization Layout for Mobile Devices */
@media (max-width: 991px) {
    .landing-footer {
        padding: 50px 30px 25px 30px !important;
    }
    .landing-footer .footer-container {
        flex-direction: column !important;
        gap: 35px !important;
    }
    .landing-footer .footer-column {
        width: 100%;
        min-width: 100%;
    }
    .landing-footer .brand-column .footer-logo {
        font-size: 32px !important;
    }
}