html::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #fff;
    transform:translatey(0%);
    z-index: 99999999999;
    animation: fadeOut 1s forwards;
  }
  @keyframes fadeOut {
    0% { transform:translateY(0%) }
      50% { transform:translateY(0%) }
    100% { transform:translateY(100%)}
  }
  :root{
        --w-column: 200px;
        --card-tiktok:url(https://res.cloudinary.com/dnt8j2c21/image/upload/v1726820850/tiktok_lwpzcq.avif);
        
        --logo: url(https://res.cloudinary.com/dnt8j2c21/image/upload/v1726220030/logolight_v4xfkz.png);
    
        --marquee: url(https://res.cloudinary.com/dnt8j2c21/image/upload/v1726382323/Frame_11_1_ovvw06.avif);
        }
        
        
        
    
        
        
        
        
        .h-full.w-full.transition-opacity.lazy.object-contain.loaded{    object-fit: cover!important;}
        .product-block.is-out::after {pointer-events:none;
      content: '';
      display: block;
      position: absolute;
      top: -75px;
      left: 5%;
      width: 90%;
      height: 100%;
      background-image: url('https://res.cloudinary.com/dyl4kt2a5/image/upload/v1727276940/Frame_69_1_aoe5ov.avif');
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;opacity:0.7;
      z-index: 55; /* Ensure it's layered on top */
    }
    
    .product-block .h-full.w-full.transition-opacity.lazy.object-cover.loaded {
        border-radius: 7px 7px 0 0;
    }
    .product-block.is-out{overflow:visible;
      position: relative;
      z-index: 2; /* Make sure the button content is above the ::after image */
    }
    
        .custome-scroll {
            padding-bottom: 1.1rem !important;
        }
        html[color-theme="light"] .main-nav-container.menu-has-buttons.fixed-pinned.animated.fixed-header{
        background-color:#ffffff80 !important;
        }
        html[color-theme="light"] #main-nav.fixed-pinned {
            box-shadow: 0 0 15px rgb(0 0 0 / 17%);}
        .main-nav-container.menu-has-buttons.fixed-pinned.animated.fixed-header{
            background-color: rgb(14 15 15 / 82%) !important;
            backdrop-filter: blur(20px);
        }
    
        .hero-area.container.flex.flex-col.py-1 .flex.items-center .lg\:max-h-\[175px\]{display:none}
        .hero-area.container.flex.flex-col.py-1 .flex.items-center .flex-shrink-0{display:none}
        
        .product__description.transi-colors span, .product__description.transi-colors strong{
        background-color:transparent !important;
        }
        .home-tabs a:before {
          box-shadow:0 0 14px 0.5px #6F44C1;
            background: linear-gradient(90deg, 
                #6F44C1, 
                #6F44C1,
                #DD50CF,
                #6F44C1,
                #6F44C1); 
            background-size: 300%;
            background-position: 0 0;
            transition-property: all;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            transition-duration: 300ms;
            animation: rgbFlow 3s infinite ease-in-out;
        }
        
        .main-menu.custome-scroll.cats-list::-webkit-scrollbar-thumb {
          box-shadow:0 0 4px 1px #6F44C1;
            background: linear-gradient(90deg, #6F44C1, #DD50CF, #6F44C1,#DD50CF); 
            background-attachment: fixed;
        }
        @keyframes rgbFlow {
            0% {
                background-position: 0 0;
            }
            100% {
                background-position: 100% 0;
            }
        }
        .mburger.flex-center.cursor-pointer{
            padding-left: 90px;}
        .logoimg{
            position: absolute;
            margin-right: 36px;
        width: 90px;
            height: 32.25px;
          -webkit-mask-image: var(--logo);
          mask-image: var(--logo);
          mask-repeat: no-repeat;
          mask-size:contain;
            background: linear-gradient(90deg, 
                #6F44C1, 
                #6F44C1,
                #DD50CF,
                #6F44C1,
                #6F44C1); 
            background-size: 300%;
            background-position: 0 0;
            transition-property: all;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            transition-duration: 300ms;
            animation: rgbFlow 3s infinite ease-in-out;
        }
        .container.header-container.flex.items-center.gap-3 .navbar-brand{display:none}
        
        .s-advertisement{
        
        }
        .content.content--single-page.w-full.bg-white.rounded{
        width:100%;border:none;
        background-color:transparent;margin-top:0!important;
        padding-top:0!important;
        }
        .content.content--single-page.w-full.bg-white.rounded .content-entry{
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            gap: 1.6rem;
            flex-wrap: wrap;position:relative;overflow:hidden;
        }
        .content.content--single-page.w-full.bg-white.rounded h1{opacity:0;margin:0 !Important}
        .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) {
            width: 100%;
            text-align: center !important;
            color: white;
            font-size: 3.6rem;
            line-height:4rem;
            font-weight: 900;
        }
        .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) strong{margin-left:10px;margin-right:10px;
        background: linear-gradient(90deg,#6F44C1,#DD50CF); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) s{color:rgba(255, 255, 255, 0.53);font-size:15px;text-decoration:none;max-width:500px;line-height:25px !important;font-weight:500!important;margin-bottom: 80px;}
        .content.content--single-page.w-full.bg-white.rounded .content-entry img{margin:0}
        
        .marquee{margin-top:30px;
        position:relative;
        height:70px;
        width:100%;
        overflow:hidden;
        }
          html[color-theme="light"]  .marquee .marqueeimg{filter:invert(100%);}
        .marquee .marqueeimg{
        width:200%;
        height:100%;
        background-image:var(--marquee);
        background-size:contain;
        background-repeat:no-repeat;
            transition-property: all;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            transition-duration: 0ms;
            animation: marquee 20s infinite linear;
        }
        @keyframes marquee {
            0% {
                transform:translateX(0)
            }
            100% {
                transform:translateX(50%)
            }
        }
        html[color-theme="light"] .category-wrapper{
        color:#374151;
        }
        html[color-theme="light"] .category-subtitle{color:#374151}
        
        
        html[color-theme="light"] .category-title{
            color:#374151;
        }
        html[color-theme="light"] .wrapper1 .card .buttons .secondarybtn{
        color:#374151ed;border-color:#374151ed;}
        html[color-theme="light"]  .wrapper1 .card .info .card-title{
        color:#374151;
        }
        html[color-theme="light"]  .wrapper1 .card{
        background-color:white;
        }
        
        html[color-theme="light"]  .wrapper1 .card .info .card-subtitle{
        color:#374151;font-weight:700;
        }
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        .wrapper1{margin:40px 0;
            width:100%;
            display:flex;flex-direction:row;justify-content:center;align-items:center;gap:1.2rem;
            flex-wrap:wrap;
            }
        
        
        
        .category-wrapper1{
        margin:50px 0;
        display:flex;flex-direction:column;justify-content:center;align-items:center;
        text-align:center;
        width:100%;color:white;
        }
        .category-title{
          width: 100%;
            text-align: center !important;
            color: white;
            font-size: 3.4rem;
            line-height:5rem;
            font-weight: 900;
        }
        .category-title span{
        margin-left:5px;margin-right:5px;
        background: linear-gradient(90deg,#6F44C1,#DD50CF); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        .category-subtitle{margin:20px 0;
        color:rgba(255, 255, 255, 0.53);font-size:14px;text-decoration:none;max-width:500px;line-height:25px !important;font-weight:500!important;margin-bottom: 40px;
        }
        
        .category-wrapper1 .wrapper1::-webkit-scrollbar-thumb {
          box-shadow:0 0 4px 1px #6F44C1;
            background: linear-gradient(90deg, #6F44C1, #DD50CF, #6F44C1,#DD50CF); 
            background-attachment: fixed;
        }
        .mostly-customized-scrollbar::-webkit-scrollbar {
          width: 3px;
          height: 3px;}
        
        
        

        
        
        
        
        .category-wrapper1 .card .buttons .primarybtn {
          color: var(--btn-color, #000);
          border: var(--btn-border-color, #000);
        }
        
        html[color-theme="light"] .category-wrapper1 .card .buttons .primarybtn {
          color: white;
          background: var(--btn-bg-color, #000);
        }
        
        .category-wrapper1 .card .buttons .primarybtn:hover {
          color: white;
          background: var(--btn-bg-color, #000);
        }
        
        
        

        
        
        
        .wrapper1 .card::before{content:'';position:absolute;z-index:-1;width:calc(100% + 2px);height:calc(100% + 2px);left:-.5px;top:-1px;border-radius:inherit;opacity:.8;
            background-size: 200%;
            background: var(--card-gradient-before, transparent);
            background-position: 0 0;
            transition-property: all;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            transition-duration: 700ms;
            animation: rgbFlow2 7s infinite ease-in-out;
        }
        .wrapper1 .card::after{content:'';position:absolute;z-index:0;width:100%;height:100%;left:0;top:0;border-radius:inherit;opacity:.05;
            background-size: 200%;
            background-position: 0 0;
            transition-property: all;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
            pointer-events:none;
            transition-duration: 700ms;
            animation: rgbFlow2 7s infinite ease-in-out;
        }
        
        .wrapper1 .card{
            flex: auto;
        position:relative;
        background-color:#1d1f1f;
        padding:20px;
        border-radius:10px;
        width:470px;height:300px;
        display:flex;flex-direction:column;justify-content:space-between;align-items:start;
        }
        .wrapper1 .card .info{width:65%;
        text-align:start;z-index:1;position:relative;
        display:flex;flex-direction:column;justify-content:start;align-items:start;gap:1rem;
        }
        .wrapper1 .card .info .card-title{
        font-size:28px;
        color:white;
        }
        .wrapper1 .card .info .card-subtitle{
        font-weight:300;
        font-size:12px;
        line-height:17px;
        color:white;
        opacity:0.7;
        }
        
      /* Styling for the card image container */
  .wrapper1 .card .card-img {
    width: 40%;
    height: 90%;
    position: absolute;
    z-index: 0;
    overflow: hidden;
    border-radius: inherit;
    left: 0;
    bottom: 0;
    transition-property: all;
    transition: 0.7s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .wrapper1 .card:hover .card-img {
    width: 50%;
    height: 100%;
  }

  /* Styling for the image inside the card-img container */
  .wrapper1 .card .card-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
    transition: inherit; /* Transition for smooth resizing */
  }

  /* Specific image positioning for each card */
  .category-wrapper1 .card-1 .card-img img {
    left: -10%;
    bottom: -20%;
  }

  .category-wrapper1 .card-2 .card-img img {
    left: 0;
    bottom: 0;
  }

  .category-wrapper1 .card-3 .card-img img {
    left: -5%;
    bottom: -20%;
  }
  .category-wrapper1 .card-4 .card-img img {
    left: -10%;
    bottom: -35%;
  }
  .category-wrapper1 .card-5 .card-img img {
    left: -10%;
    bottom: -35%;
    transform: scale(1.4);
  }

  .category-wrapper1 .card-6 .card-img img {
    left: -10%;
    bottom: -50%;
    transform: scale(1.3);
  }

  .category-wrapper1 .card-7 .card-img img {
    left: -10%;
    bottom: -40%;
    transform: scale(1.2);
  }

        
        .wrapper1 .card .buttons{
        z-index:1;position:relative;
        text-align:start;
        display:flex;flex-direction:row;justify-content:start;align-items:start;gap:10px;
        }
        .wrapper1 .card .buttons a{box-shadow: 0 0 10px rgba(0, 0, 0, 0.103);
        transition:.1s ease-in-out;
        border-radius:1000px;
        padding:4px 22px;font-size:13px;
        border-width:1px;border-style:solid;
        }
        .wrapper1 .card .buttons a:hover{
          filter: brightness(90%) contrast(120%);
        }
        
        .wrapper1 .card .buttons .secondarybtn{
        backdrop-filter:blur(20px);
        color:#ffffff60;border-color:#ffffff60;}
        .wrapper1 .card{
        }
        
        .s-button-primary{
        background-image: linear-gradient(90deg,#6F44C1 0%,#DD50CF 100%) !important;
        background-repeat:no-repeat;
        border-color:transparent !important;
          --tw-border-opacity: 0 !important;
          border-width:0px !important;
        }
        .s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center:hover {
        background-image: linear-gradient(90deg,#6F44C1 0%,#DD50CF 100%) !important;
        background-repeat:no-repeat;
        opacity:1 !important;
        color:white !important;
        border-color:transparent !important;
          --tw-border-opacity: 0 !important;
          border-width:0px !important;
        }
        
        
        
        .category-wrapper1 .card-1::after{
            background:linear-gradient(40deg,#51FF6C,transparent 60%);
            }
            .category-wrapper1 .card-2::after{
            background-image:linear-gradient(40deg,#FF00B8,transparent  60%)}
            .category-wrapper1 .card-3::after{
            background-image:linear-gradient(40deg,#0047FF,transparent 60%)}
            .category-wrapper1 .card-4::after{
            background-image:linear-gradient(40deg,#FF5050,transparent 60%)}
            .category-wrapper1 .card-5::after{
            background-image:linear-gradient(40deg,#FFB800,transparent 60%)}
            .category-wrapper1 .card-6::after{
            background-image:linear-gradient(40deg,#FFB800,transparent 60%)}
            
                
        
        
        
        
        
        
        .category-wrapper2{margin-top:20px;margin-bottom:50px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;width:100%;color:white;}
            .category-wrapper2 .card-1::before{background:linear-gradient(40deg,#516bff,#ffffff10 70%);}
            .category-wrapper2 .card-2::before{background-image:linear-gradient(40deg,#33ffa7,#00c3ff00 70%)}
            .category-wrapper2 .card-3::before{background-image:linear-gradient(40deg,#ff0000,#ffffff10 70%)}
            .category-wrapper2 .card-4::before{background-image:linear-gradient(40deg,#50d0ff,#ff0090 70%)}
        
        
            .category-wrapper2 .card-1 .buttons .primarybtn{color:#516bff;border-color:#516bff;}
            html[color-theme="light"] .category-wrapper2 .card-1 .buttons .primarybtn{color:white;
            background-color:#516bff;}
            .category-wrapper2 .card-1 .buttons .primarybtn:hover{color:white;
            background-color:#516bff;}
            
            
            .category-wrapper2 .card-2 .buttons .primarybtn{color:#33ffa7;border-color:#33ffa7;}
            html[color-theme="light"] .category-wrapper2 .card-2 .buttons .primarybtn{color:white;
            background-color:#33ffa7;}
            .category-wrapper2 .card-2 .buttons .primarybtn:hover{color:white;
            background-color:#33ffa7;}
            
            
            .category-wrapper2 .category-wrapper2 .card-3 .buttons .primarybtn{color:#ff0000;border-color:#ff0000;}
            html[color-theme="light"] .category-wrapper2 .card-3 .buttons .primarybtn{color:white;
            background-color:#ff0000;}
            .category-wrapper2  .card-3 .buttons .primarybtn:hover{color:white;
            background-color:#ff0000;}
            
            
            .category-wrapper2 .card-4 .buttons .primarybtn{color:#ff0090;border-color:#ff0090;}
            html[color-theme="light"] .category-wrapper2 .card-4 .buttons .primarybtn{color:white;
            background-color:#ff0090;}
            .category-wrapper2 .card-4 .buttons .primarybtn:hover{color:white;
            background-color:#ff0090;}
            
            
            .category-wrapper2 .card-1::after{
                background:linear-gradient(40deg,#516bff,transparent 60%);}
                .category-wrapper2 .card-2::after{
                background-image:linear-gradient(40deg,#33ffa7,transparent  60%)}
                .category-wrapper2 .card-3::after{
                background-image:linear-gradient(40deg,#ff0000,transparent 60%)}
                .category-wrapper2 .card-4::after{
                background-image:linear-gradient(40deg,#ff0090,#50d0ff 60%)}
    
                
        
        
            .category-wrapper2 .card-1 .card-img::before{left:-10%;bottom:-34%;
            background-image:var(--card-hydra);
            }
            .category-wrapper2 .card-2 .card-img::before{left:-10%;bottom:-30%;
            background-image:var(--card-shahid);
            }
            .category-wrapper2 .card-3 .card-img::before{left:-7%;bottom:-30%;
            background-image:var(--card-netflix)
            }
            .category-wrapper2 .card-4 .card-img::before{left:-10%;bottom:-35%;
            scale:1.4;
            background-image:var(--card-tiktok)
            }
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        .dark .hero-area .cats-list a {
        background-repeat:no-repeat;border-width:0px !important;
        transition:.3s;
            --tw-border-opacity: 0 !important;
            border-color: transparent !important;
            --tw-bg-opacity: 1;
            background-color: rgba(14, 15, 15, var(--tw-bg-opacity));
        }
        .dark .hero-area .cats-list a:hover {
        opacity:1 !important;
        border-color:transparent !important;
        color:white !important;
        background-image: linear-gradient(90deg,#6F44C1 0%,#DD50CF 100%) !important;}
        
        
        
        .home-tabs.mt-8 li .offers-link:hover .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        .home-tabs.mt-8 li .store-link:hover .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        .home-tabs.mt-8 li .store-link .text{
        background: linear-gradient(90deg,white 0%,white 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight:900;
        color:none!important
        }
        .home-tabs.mt-8 li .offers-link .text{
        background: linear-gradient(90deg,white 0%,white 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight:900;
        color:none!important
        }
        
        .home-tabs.mt-8 li .offers-link.active .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight:900;
        }
        
        .home-tabs.mt-8 li .store-link.active .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight:900;
        }
        .home-tabs.mt-8 li .store-link:hover .sicon-store:before{
        color:#DD50CF;
        }
        .home-tabs.mt-8 li .offers-link:hover .sicon-store:before{
        color:#DD50CF;
        }
        .home-tabs.mt-8 li .offers-link.active .sicon-store:before{
        color:#DD50CF;
        }
        .home-tabs.mt-8 li .store-link.active .sicon-store:before{
        color:#DD50CF;
        }
        .promotion-badge-wrap .promotion-badge {font-size: 10px;
            backdrop-filter: blur(10px);
            color:white !important;
            background-color: #00000085;}
            .promotion-badge-wrap .promotion-badge.has-discount{
            color:white !important;
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        box-shadow:none !important;
        }
        
        
        
        
        
        
        
        
        
        
        
        
        html[color-theme="light"] .home-tabs.mt-8 li .offers-link .text:not(.active) {
            background: linear-gradient(90deg, #374151 0%, #374151 70%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        html[color-theme="light"] .home-tabs.mt-8 li .store-link .text:not(.active) {
            background: linear-gradient(90deg, #374151 0%, #374151 70%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        html[color-theme="light"] .home-tabs.mt-8 li .offers-link.active .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        html[color-theme="light"] .home-tabs.mt-8 li .store-link.active .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        html[color-theme="light"] .home-tabs.mt-8 li .offers-link:hover .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        html[color-theme="light"] .home-tabs.mt-8 li .store-link:hover .text{
        background: linear-gradient(90deg,#6F44C1 0%,#DD50CF 70%); 
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        }
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        .product-options {
            display: none;
        }
        
        /* Apply specific styles to .product-options.space-y-2.5.sm:space-y-5 */
        .product-options.space-y-2\.5.sm\:space-y-5 {
            display: block; /* To ensure it's visible */
            width: 100% !important;
            padding: 6% !important;
            padding-top: 2% !important;
            position: sticky !important;
            border-radius: 18px 18px 0 0 !important;
            left: 0 !important;
            backdrop-filter: blur(15px) !important;
            border: solid 1px #ff00ee7d !important;
            box-shadow: 0 0 15px 1px #0000002a !important;
        }
        
        
      
        
        
        
        
        
        
        
        
        
        
        
        @media only screen and (max-width: 980px) {
            .product-options.space-y-2\.5.sm\:space-y-5 {
                width: 100%;
                padding: 6%;
                padding-top: 2%;
                position: sticky;
                border-radius: 18px 18px 0 0;
                left: 0;
                backdrop-filter: blur(15px);
                border-top: solid 1px #ffffff33;
                box-shadow: 0 0 16px 1px #0000007a;
            }
        
            .promotion-badge-wrap .promotion-badge {font-size: 7px;padding: 3px 10px !important;}
            .wrapper1{margin:40px 0;gap:0rem;}
        .category-wrapper1 , .category-wrapper2{
        margin:10px 0 !important;width:100% !important;
        }
        .wrapper1 .card .card-img{
            width:40%;height:90%;
        position:absolute;z-index:0;overflow:hidden;border-radius:inherit;
        left:0;bottom:0;
        }
        .wrapper1 .card .card-img{
            width:40%;height:90%;
        position:absolute;z-index:0;overflow:hidden;border-radius:inherit;
        left:0;bottom:0;
        }
    .wrapper1 .card .card-img::before{
        transform:translateX(-10px) translateY(20px)
        }
        .category-title{
        text-align:start !important;
        font-size:2.4rem;
        line-height:3.5rem;
        }
        .category-subtitle{
        display:none}
      
        .wrapper1 .card {
            margin: 10px 3px;
            min-width: 320px;
            padding: 15px;
            border-radius: 10px;
            width: 420px;
            height: 210px;
        }
        .wrapper1 .card .info .card-title {
            font-size: 22px;
            line-height:29px !important
        }
        .wrapper1 .card .info .card-subtitle {
            font-weight: 200;
            font-size: 10px;
            line-height: 14px;
            }
        .wrapper1 .card .info {
            width: 70%;
            gap: .5rem;
        }
    
        .marquee{margin-bottom:-50px;
        height:120px;
        }
        .marquee .marqueeimg{width:400%}
        .mburger.flex-center.cursor-pointer{
            padding-left: 0px;}
        .logoimg {
        position: absolute !important;
        left: 50%;transform: translateX(-50%);}
        .content.content--single-page.w-full.bg-white.rounded{
        width:90%;}
          .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) {
            font-size: 2rem;margin-bottom:0;
                line-height:3rem;
        }
          .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) strong{
        left:3px;margin-right:3px;
        }
        .content.content--single-page.w-full.bg-white.rounded .content-entry p:not(:has(img)) s{margin-top:-20px;color:rgba(255, 255, 255, 0.53);font-size:15px;text-decoration:none;max-width:500px;line-height:25px !important;margin-bottom: 50px;}
        }
        
        
        
        
        
        
        
        
        
        
        
        .s-advertisement{
        display:none}
        body{
        font-display: swap!important;
        }
        
      
        
        .hero-area.container.flex.flex-col.py-1 .flex.items-center .text-xl.font-bold{
        display:none}
    
        
        
        
        
        
        
        .h-full.w-full.transition-opacity.lazy.object-cover.loaded{transition:0.3s ease-in-out}
        .product-block.cover.product-entry.product-entry--vertical.product-entry--fit-type:hover img{
        transform: scale(120%);}
        #whatsapp-button {
            position: fixed;
            bottom: 20px;
            left: 20px;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: rgba(37, 211, 102, 0.8); /* Semi-transparent green */
            border: 1px solid rgba(255, 255, 255, 0.1); /* Almost invisible white border */
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Small modern shadow */
            backdrop-filter: blur(15px);
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
            z-index: 1000;
        }
        
        
        
        
        
        
        
        
        
        
        
        
        /*  caroussel */
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
    
    .hero-area.container.flex.flex-col.py-1{width:100%;}
    .hero-area.container.flex.flex-col.py-1 .flex.items-center{width:100%}
    .hero-area.container.flex.flex-col.py-1 .flex.items-center .store-desc-wrap{display:none}
    
    
    .carousel {
    direction:ltr;
    background-color: #1B1B1B;background-image: url(https://res.cloudinary.com/dyl4kt2a5/image/upload/v1727641282/Frame_58_rvhvly_1_hyxhxs.avif);
        background-position: center;background-size: cover;background-repeat: no-repeat;
        border-radius: 20px;padding: 30px 0;
    color: rgb(255, 255, 255);    height: 80vh;
        overflow: hidden;
        position: relative;width:100%;
    }
    
    .carousel .list {
        width: min(1200px, 90vw);
        margin: auto;
        height: 100%;
        position: relative;
    }
    
    .carousel .list .item {
        position: absolute;
        inset: 0;
    }
    
    .carousel .list .item figure {
        position: absolute;
        width: 40%;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .carousel .list .item figure img {
        width: 100%;
        height:100%;
        transform: rotate(-30deg);
    }
    
    .carousel .list .item figure::before {
        content: '';
        position: absolute;
        background-color: #1f1f1f00;
        width: 100%;
        height: 100px;
        top: 150%;
        left: 50px;
        border-radius: 50%;
        filter: blur(50px);
    }
    
    .carousel .list .item .content {
        position: absolute;
        z-index: 20;
        width: 70%;
        height: 100%;
        right: 7vw;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: end;
        gap: 30px;
    }
    
    .carousel .list .item .content .category {
    margin-bottom:-20px;
    text-align: right;
        font-weight: 500;
    }
    
    .carousel .list .item .content h2 {
    text-shadow:0 0 15px #000000;
    text-align: right;
          font-size: 4rem;
        line-height: 1;
    }
    
    .carousel .list .item .content .description {text-align: right;line-height:21px;
        align-items: center;
        color: inherit;
        opacity: 0.7;
        max-width: 400px;
        font-size: small;
    }
    
    .carousel .list .item .content .description i {
        height: 50px;
        color: #f200ff;
        font-size: 2em;
        border: 1px solid #659cdf;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .carousel .list .item .more {
    position:absolute;bottom:90px;
        display: flex;
        gap: 20px;
    }
    
    .carousel .list .item .more a {padding:5px 20px;
    font-weight: 800;font-size: 12PX;
        display: flex;flex-direction: row-reverse;justify-content: center;align-items: center;gap: 10px;
        border-radius: 30px;
        text-transform: uppercase;
        color: #000000;
        background-color: white;
            border: none;
        position: relative;
    }
    .carousel .list .item .more a svg{
        width: 10px;;height: 10px;
    }
    
    
    
    
    .carousel .list::after {
        content: '';
        position: absolute;
        right: var(--w-column);
        width: var(--w-column);
        height: 100%;
        border-left: 1px solid #90909016;
        border-right: 1px solid #90909016;
        pointer-events: none;
    }
    
    .carousel .list::before {
        content: '';
        position: absolute;
        z-index: 10;
        height: var(--w-column);
        width: 100%;
        top: 52%;
        border-top: 1px solid #90909016;
        border-bottom: 1px solid #90909016;
        pointer-events: none;
    }
    
    .carousel .arrows {
        filter: grayscale(100%);
        width: min(1200px, 90vw);
        display: flex;
        justify-content: space-between;
        position: absolute;
        top: 52%;
        left: 50%;
        transform: translate(-50%, -25px);
        pointer-events: none;
        z-index: 100;
        overflow: hidden;
    }
    
    .carousel .arrows button {
        top: 60%;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 1px solid #a6a6a655;
        background-color: rgba(255, 255, 255, 0.192);
        backdrop-filter: blur(15px);
        color: #fff7;
        font-size: large;
        cursor: pointer;
        pointer-events: auto;
        transition: 0.5s;
    }
    
    .carousel .arrows button:hover {
        color: #fff;
    }
    
    .carousel .arrows svg {
        backdrop-filter: invert(1);
        filter: grayscale(100%);
    }
    
    .carousel .indicators {
        position: absolute;
        top: 52%;
        height: var(--w-column);
        width: min(1200px, 90vw);
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        flex-direction: column;
        pointer-events: none;
        justify-content: end;
        gap: 40px;
    }
    
    .carousel .indicators .number {
        font-size: 7vw;
    }
    
    .carousel .indicators ul {
        display: flex;
        gap: 10px;
    }
    
    .carousel .indicators ul li {
        width: 50px;
        height: 5px;
        background-color: #90909040;
        border-radius: 10px;
        pointer-events: auto;
        cursor: pointer;
        transition: 0.5s;
    }
    
    .carousel .indicators ul li.active {
        background-color: #7600FF;
    }
    
    /* Animation */
    .carousel .list .item {
        transform: translateX(calc(100vw * var(--calculation)));
        transition: 0.5s;
        opacity: 0;
    }
    
    .carousel .list .item figure img {
        transform: rotate(0deg);
        transition: transform 0.5s;
        transition-delay: 0.3s;
    }
    
    .carousel .list .item h2,
    .carousel .list .item .description,
    .carousel .list .item .more {
        transform: translateX(calc(200px * var(--calculation)));
        transition: 0.7s;
        transition-delay: 0.3s;
    }
    
    .carousel .list .item h2 {
        transition-delay: 0.5s;
    }
    
    .carousel .list .item .description {
        transition-delay: 0.7s;
    }
    
    .carousel .list .item .more {
        transition-delay: 0.9s;
    }
    
    .carousel .list .item.active {
        opacity: 1;
        transform: translateX(0);
    }
    
    .carousel .list .item.active figure img {
        transform: rotate(-20deg);
    }
    
    .carousel .list .item.active .content .category,
    .carousel .list .item.active h2,
    .carousel .list .item.active .description,
    .carousel .list .item.active .more {
        transform: translateX(0px);
        opacity: 1;
    }
    
    .carousel .list .item.activeOld {
        transform: translateX(calc(-100vw * var(--calculation)));
    }
    
    @media screen and (max-width: 1023px) and (min-width: 768px) {
        .carousel .list .item .more {
    position:absolute;bottom:120px;
    }
    }
    
    @media screen and (max-width: 767px) {
        .carousel {
            height: calc(40vh + 130px) !important;
        }
    .carousel .indicators {
        position: absolute;
        top: 85%;
        left: 55%;
        transform: translateX(-50%);
        display: flex;
        flex-direction: column;
        pointer-events: none;
        justify-content: end;
        gap: 10px;
    }
    .carousel .indicators ul li {
        width: 20px;
        height: 7px;}
        :root {
            --w-column: 40px;
        }
    
        .carousel {
            height: 80vh;
        }
        .carousel .list .item figure {
            position: absolute;
            width: 60%;
            top: -20px;    transform: translateY(0%);
    
        }
    
        .carousel .list .item .content {
            gap: 19px;
            width: 80%;
            justify-content: end;
            padding-bottom: 40px;
        }
        .carousel .list .item .more {
    position:absolute;bottom:30px;
    }
        .carousel .list .item .content .category{margin-bottom:-10px}
    .carousel .list .item .content .description{font-size:10px;line-height:16px;padding-bottom:35px}
        .carousel .list .item .content h2 {line-height:1.1;
                font-size: calc(18px + 2vw);
        }
        
        .carousel .list .item .more a {padding:3px 17px;
    font-weight: 800;font-size: 10px;
        display: flex;flex-direction: row-reverse;justify-content: center;align-items: center;gap: 10px;
        border-radius: 30px;
        text-transform: uppercase;
        color: #000000;
        background-color: white;
            border: none;
        position: relative;
    }
    .carousel .list .item .more a svg{
        width: 9px;;height: 9px;
    }
    
    }
    .navbar-brand img{height:30px!important;width:auto!important;object-fit:contain;}