@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
:root {
    --primary-color: #ED4C67;
    --grey-color: #b3b3b3;
    --light-color: #eaeaea;
    --white-color: #ffffff;
    --dark-color: #000000;
}
* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}
*,::before,::after {
    box-sizing: border-box;
}
body {
    font-family: 'Nunito', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.8;
    color: var(--dark-color);
    background-color: var(--white-color);
}
a {
    text-decoration: none;
    color: inherit;
    -webkit-tap-highlight-color: transparent;
}
img {
    max-width: 100%;
    width: 100%;
    vertical-align: middle;
}
ul {list-style: none;}
p {margin-bottom: 15px;}
input::placeholder{font-family: 'Nunito', sans-serif;}

h1,h2,h3,h4 {font-weight: 500;line-height: normal;}
h1 {font-size: 2.5em;}
h2 {font-size: 2em;}
h3 {font-size: 1.5em;}
h4 {font-size: 1em;}

.container {
    max-width: 1280px;
    padding: 0 15px;
    margin: 0 auto;
}

/* Scroll To Top Button */
#myBtn {
    display: none;
    position: fixed; 
    bottom: 20px;
    right: 30px; 
    z-index: 99; 
    border: 2px solid var(--dark-color);
    outline: none; 
    background-color: var(--white-color); 
    color: var(--dark-color); 
    cursor: pointer; 
    padding: 15px;
    border-radius: 10px; 
    font-size: 18px; 
    transition: background-color .3s, color .3s;
  }
  
  #myBtn:hover {
    background-color: var(--dark-color);
    color: var(--white-color); 
  }

button#myBtn {
    border-radius: 100%;
}

/* -------------------
   01. HEADER
   ------------------- */
.header-top, .header-main nav > ul {
    display: none;
}
/* ----------------
   01. a. Header Top */
.header-top {
    line-height: 40px;
    border-bottom: 1px solid var(--light-color);
}
header :where(.wrap, .socials ul, .options, li a) {
    display: flex;
    align-items: center;
    gap: 5px;
}
.header-top .wrap {
    justify-content: space-between;
}
.header-top ul li span {
    font-size: 14px;
}
.header-top ul li i 
.header-main :where(.menu-trigger, .icons a) {
    font-size: 20px;
}
.header-top .options li {
    position: relative;
}
.header-top .options ul ul {
    position: absolute;
    left: auto;
    right: 0;
    min-width: 68px;
    padding: 15px 20px;
    background-color: var(--white-color);
    box-shadow: 0 20px 30px rgb(0 0 0 / 13%);

    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: transform .3s;
    z-index: 100;
}
.header-top li:hover ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.header-top .flag {
    display: block;
    width: 26px;
    height: 26px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.header-top .flag.us {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAABJlJREFUaEPtmf1rW1UYx783b8vLmtsYbF26bmvarWu31I0xKxvLNlA2xuY/sCqCyIo6X1pbRWQ6lWk3ImNDHYgI3RgMRMaKL/iTK+wXK7glVE9orZSpMGvdTdLmpjdprpx7cm/T2MUfclK90AdK8tx7zvc5n/Ocm3OeWwEmN8Hk48cKwH+dwZUM/B8yYAWwCgD9NJPNA5ijS8h3+PB7f1V75J8Io9xD1A9dvI8CbDh06N1f9u5tR3//Yzh9+poRiKd/DBNcAeTrN7Dmy8+aKEDrwYOnSDjcBkma1YKo6kIsgbagfyq7bhG0r2WNttP6FYz6J9pt/w5Q2nGpHqoKweNG7sc4ak/2b9YADhx4h+zevQAQiTyOnp7BwiAEUL+396I+HEQiT6C3Z5DBCsD71Nfuqxqc7jOPGb3G2wRBYACPPvI26Xx4IxIJmU31IitMv3at+HuxX3q9WICl4ty5J3mPHwbA/v1vkZ07gxgYOIru7o+NQBcuPM3Nj4T93AAElxO5ydsQX+pmGdi3702ybdsGJBJpbkFKhQZwk5u2RfRCuRlF4NtvGMCePSfI1q2NSCbpEgIuXTqOrq7zRkDNP3qeraDi+3S1CfdoX9Sf9jkrEH4A3hooo3GsuX6VAeza9TrZtCmAVIoBVMOufMjxIbZYACULW8MDDKCz8zUSDNbh8uUXcOTIgDH+oaFXuPlUi7cZD/GOHa+SxkY/ZmYyvGMYel991MVPm2Ygm4V9cwvLwPbt/aSuTkQ6PacFGR4+iXD4DSNgpT4VuoIRbgCC24X8H3+i4YdhBhAKvUxqaz2QZYVbkFKhqxjmpk1/RtVEEmujIwygra2HeNyrMPL9KYQ6+lggFYjFzqAj1GfsX9HYGe2+vm3FogW/8GsUpX6oj+3gKmC0V4Ebx9q5AcBmBbI5eJ9/igG0tr5I1OIDEL9QhlI8fpa7qvEQNzcfJ9ksPV4zm5z8AOvXP8vN1zV5ExgATU3PkampJG/9RXrjD7GTLi+z1HpR9/mnbAk1Nj5DpqdTmJ0dhMezsOHw9EfxBa+xazpWvx/rbo8xgECgm9y9O8M1QKnY2Dq+BY0getHw3dcMYH5+nljo5mAiy+fzsFqtDCCXyxGr1Vw1/SKACX8rsSlZqErWFDkQHHbkHHYEp+MsAz+LLcSWz0PNKMaReVFhpu9c5V6DFRdyS7UrbHb6JvmPl5r6fV1nqeKvsMFqAHYrmqVxBjBeEyR2VYU6pyxdUep5KQ1SLl/3qjKLJ6MUqlivTCUrOB3ICgJaUhMMQJZl4nQ6TbF89EFmMhm4XC4GkE6nicvlMhWALMtwu90M4CfHWuJ2OKCmq1eR8ZwdepxOKwralF8ZwKi9gax2OqHOVq+o5wrgcWMmk8GW7G8FAFuArHa5zAUgy9iS+50BJBIJ4vV6eU5S1bWSySREUWQAkiQRURSrHpRnAEmS4PP5GMAtSz3x1ZgrA1IqiY78HQ2g5Zalfozn7CyX1oP5OxspQD2AEID7lyswpzhTAGIUgP57qabwyUl7WWToO6BUuePZsoyi0iArAJXOYKX9VzJQ6QxW2t/0GfgbsdLeSJdN7iEAAAAASUVORK5CYII=');
}
.header-top .flag.de {
    background-image: url('data:image/png;base64,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');
}
.header-top .flag.id {
    background-image: url('data:image/png;base64,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');
}
.header-top .flag.ph {
    background-image: url('data:image/png;base64,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');
}

header li a {
    transition: color .3s;
}
header li a:hover {
    color: var(--grey-color);
}
.header-top :where(.socials li:last-child, .options > div:last-child) {
    margin-left: 15px;
}

/* ----------------
   01. b. Header Main */

.header-main :where(nav, .icons) {
    flex: 1 1 0;
}
.header-main .icons {
    display: flex;
    justify-content: flex-end;
}
.header-main :where(nav, .icons) > ul {
    display: flex;
    gap: 24px;
}

.header-main .menu-trigger {
    display: block;
}
.header-main :where(nav > ul > li > a, .logo) {
    line-height: 90px;
}
.header-main .logo {
    font-size: 28px;
}
.header-main :where(nav li > a span, .logo) {
    font-weight: 700;
}
.header-main .icons li a {
    position: relative;
    gap: 0;
    justify-content: center;
}
.header-main .icons li .qty {
    position: absolute;
    top: -3px;
    left: -8px;
    background-color: var(--primary-color);
    color: var(--white-color);
    font-size: 10px;
    width: 14px;
    height: 15px;
    line-height: initial;
    text-align: center;
    border-radius: 3px;
}

/* ----------------
   01. c. Mobile Menu */

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgb(0 0 0 / 50%);
    pointer-events: none;
    z-index: 15px;
    transition: .5s ease;
    opacity: 0;
}
.overlay.active {
    opacity: 1;
    pointer-events: all;
}
nav.mobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 350px;
    height: 100%;
    max-width: calc(100vw - 60px);
    padding: 30px;
    background-color: var(--white-color);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    
    left: -100%;
    visibility: hidden;
    transition: .5s ease;
}
nav.mobile.active {
    left: 0;
    visibility: visible;
}
nav.mobile > ul > li {
    position: relative;
}
nav.mobile > ul > li > a {
    display: block;
    position: relative;
    padding: 13px 0;
}

nav.mobile .enter {
    padding-top: 20px;
    margin-top: auto;
}
nav.mobile .enter div {
    max-width: 170px;
    margin: 0 auto;
    text-align: center;
    font-size: 12px;
    padding-bottom: 10px;
    position: relative;
    text-transform: uppercase;
}
nav.mobile .enter div::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    height: 1px;
    width: 100%;
    background-color: var(--light-color);
}
nav.mobile .enter div span {
    position: relative;
    padding: 5px 20px;
    color: var(--grey-color);
    background-color: var(--white-color);
}

.btn-primary, .btn-light {
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    border-radius: 60px;
    padding: 0 32px;
    line-height: 42px;
    transition: background-color .3s, color .3s;
}
.btn-primary {
    background-color: var(--dark-color);
    color: var(--white-color);
    border: 1px solid transparent;
}
.btn-primary:hover {
    background-color: transparent;
    color: var(--dark-color);
    border-color: var(--dark-color);
}
.btn-light {
    background-color: var(--white-color);
}
.btn-light:hover,
.hero a:hover .btn-light {
    background-color: var(--dark-color);
    color: var(--white-color);
}
nav.mobile .enter a {
    display: block;
    text-align: center;
}
nav.mobile .btn-light {
    border: 1px solid var(--dark-color);
    margin-top: 8px;
}
.close-trigger {
    font-size: 30px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    transition: color .3s;
}
.close-trigger:hover {
    color: var(--primary-color);
}
nav.mobile .close-trigger {
    position: absolute;
    right: -40px;
    top: 0;
    color: var(--white-color);
}
nav.mobile > ul {
    overflow-y: auto;
    margin-bottom: 30px;
}
nav.mobile > ul > li > span {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 55px;
    font-size: 20px;
    cursor: pointer;
    transition: color .3s;
}
nav.mobile > ul > li > span:hover {
    color: var(--grey-color);
}
nav.mobile .submenu {
    height: 0;
    overflow: hidden;
}
nav.mobile .submenu a {
    color: #7f7f7f;
    padding-left: 15px;
    transition: color .3s;
}
nav.mobile .submenu a:hover {
    color: var(--dark-color);
}

nav.mobile .submenu {
    transform: translateY(15px);
    transition: height .3s, transform .3s;
}
nav.mobile .expand ~ .submenu {
    height: auto;
    transform: translateY(0);
}

/* ----------------
   01. d. Search */
.search-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 30px 0;
    background-color: var(--white-color);
    z-index: 999;

    opacity: 0;
    visibility: hidden;
}
.search-modal.active {
    opacity: 1;
    visibility: visible;
}
.search-modal .wrap {
    max-width: 640px;
    margin: 0 auto;
}
.search-modal .search-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}
form.search {
    position: relative;
    height: 46px;
    color: var(--dark-color);
    background-color: var(--white-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
form.search input {
    position: absolute;
}
form.search :where(input[type=search],input[type=text]) {
    width: 100%;
    height: 46px;
    left: 0;
    top: 0;
    padding: 10px 15px 10px 40px;
    border: 1px solid var(--grey-color);
    border-radius: 6px;
}
form.search input[type=submit] {
    right: 0;
    top: 0;
    border: 0;
    background-color: transparent;
    color: transparent;
    height: 100%;
    cursor: pointer;
    z-index: 10;
}
form.search i {
    position: relative;
    z-index: 1;
    padding: 0 15px;
}
.search-modal .search-footer {
    margin-top: 8px;
    color: var(--grey-color);
}
.search-modal .search-footer a {
    margin-right: 8px;
    color: var(--dark-color);
    text-decoration: underline;
    transition: color .3s;
}
.search-modal .search-footer a:hover {
    color: var(--grey-color);
}

/* -------------------
   02. MAIN
   ------------------- */ 
main > div {
    margin-bottom: 90px;
}

/* ----------------
   02. a. Hero */

.hero .wrap {
    display: grid;
}
.hero .big {
    height: 335px;
}
.hero .list:not(.big) {
    height: 230px;
}
.hero .wrap .list {
    position: relative;
    overflow: hidden;
}

.hero a:hover img {
    transform: scale(1.1);
}
.hero .info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 10px 40px;
    text-align: center;
}

/* ----------------
   02. b. Tabbed */

.tabbed nav {
    margin: 0 0 50px;
}
.tabbed nav ul {
    display: flex;
    justify-content: space-between;
    max-width: 436px;
    width: auto;
    padding-bottom: 10px;
    margin: 0 auto;
    align-items: center;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scroll-snap-align: start;
}
.tabbed nav ul li a {
    font-size: clamp(20px, -0.875em + 8.333vw, 26px);
    font-weight: 500;
    transition: color .3s;
}
.tabbed nav ul li:not(.swiper-slide-thumb-active) a {
    color: var(--grey-color);
}
.tabbed nav ul li a:hover {
    color: var(--dark-color);
}
.tabbed nav ul li.swiper-slide-thumb-active a {
    border-bottom: 2px solid var(--dark-color);
}
.tabbed nav li {
    width: fit-content!important;
}
.tabbed .button {
    text-align: center;
    margin: 30px 0 0;
    margin-bottom: 15px;
}
   
/* ----------------
   02. c. Product */

.product {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 30px;
}   
.product .list {
    margin-bottom: 30px;
}
.product-thumb {
    position: relative;
    height: 300px;
    margin-bottom: 20px;
    overflow: hidden;
}
.object-cover img {
    object-fit: cover;
    height: 100%;
    position: absolute;
    transition: all .75s cubic-bezier(0,0,.2,1);
}
.hover-image {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity .8s ease, transform 1.1s cubic-bezier(.15,.75,.5,1) 0s;
    backface-visibility: hidden;
    transform: translateZ(0);
}
.product-thumb:hover .hover-image {
    opacity: 1;
    transform: scale(1.1,1.1,1.1) translateZ(0);
}
.product :where(.label, .icons-act) {
    position: absolute;
    top: 15px;
    left: 15px;
}
.product .label {
    z-index: 2;
    font-size: 12px;
    font-weight: 700;
    background-color: var(--primary-color);
    color: var(--white-color);
    padding: 2px 5px;
    border-radius: 5px;
    line-height: 20px;
}
.product .icons-act {
    right: 15px;
    left: auto;
    transform: translateX(70px);
    transition: all .3s cubic-bezier(0,0,.2,1);
}
.product-thumb:hover .icons-act{
    transform: translateX(0);
}
.product .icons-act li a {
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--white-color);
    border-radius: 50%;
    margin-bottom: 8px;
    transition: background-color .3s, color .3s;
}
.product .icons-act li a:hover {
    background-color: var(--dark-color);
    color: var(--white-color);
}
.product-info h2 {
    font-size: 16px;
    font-weight: 700;
}
.product .price .before {
    color: var(--grey-color);
    text-decoration: line-through;
    margin-right: 10px;
}

.product .colors {
    display: flex;
    gap: 10px;
    margin: 8px 0 15px;
}
.product .colors a {
    position: relative;
    width: 24px;
    height: 24px;
    border-radius: 50%;
}
.product .colors a::before {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    left: 5px;
    top: 5px;
    transition: transform .3s;
    transform: scale(0);
}
.product .colors a.active::before,
.product .colors a:hover::before {
    background-color: var(--light-color);
    transform: scale(1);
    border: 1px solid var(--white-color);
}

/* products color */
.product .colors .brown {background-color: #5C4033;}
.product .colors .tan {background-color: #988558;}

.product .colors .fawn {background-color: #E5AA70;}
.product .colors .camel {background-color: #C19A6B;}
.product .colors .brass {background-color: #E1C16E;}
.product .colors .midnight {background-color: #191970;}

.product .colors .tosca {background-color: #67b2a7;}
.product .colors .almond {background-color: #EADDCA;}
.product .colors .gamboge {background-color: #E49B0F;}
.product .colors .orange {background-color: #FF5F15;}
.product .colors .copper {background-color: #B87333;}
.product .colors .light {background-color: var(--light-color);}
.product .colors .pink {background-color: #DE3163;}
.product .colors .cherry {background-color: #D2042D;}
.product .colors .coralpink {background-color: #F88379;}
.product .colors .pink {background-color: #FFB6C1;}

.product .colors .fern {background-color: #4F7942;}
.product .colors .lime {background-color: #32CD32;}
.product .colors .bronze {background-color: #CD7F32;}

.product .colors .grass {background-color: #7CFC00;}
.product .colors .emerald {background-color: #50C878;}
.product .colors .iris {background-color: #5D3FD3;}
.product .colors .baby {background-color: #89CFF0;}

.product .colors .white {background-color: #FFFDD0;}
.product .colors .black {background-color: #000000;}
.product .colors .plush1 {background-color: #e3cdb9;}
.product .colors .gray {background-color: #B2BEB5;}


/* ----------------
   02. d. Video */
.video-box {
    position: relative;
    height: 500px;
    max-width: 900px;
    margin: 0 auto;
    overflow: hidden;
}
.video-box .attributes {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--white-color);
    cursor: pointer;
}
.video-box .attributes i {
    font-size: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    line-height: 80px;
    border: 2px solid var(--white-color);
    border-radius: 50%;
    margin-bottom: 30px;
}
.video-box .attributes h3 {
    font-size: clamp(26px, -0.875em + 8.333vw, 42px);
    text-transform: uppercase;
    font-weight: 700;
}
.video-box:hover img {
    transform: scale(1.1);
}

/* ----------------
   02. d. Youtube Embed */
.youtube {
    position: fixed;
    top: 0;
    left: 0;
    background-color: var(--dark-color);
    z-index: 1050;

    visibility: hidden;
    opacity: 0;
}
.youtube, .youtube :where(.wrap, .inner, iframe) {
    width: 100%;
    height: 100%;
}
.youtube.active {
    visibility: visible;
    opacity: 1;
}
.youtube .wrap {
    position: relative;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 100%;
}
.youtube .inner,
.youtube iframe {
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
}
.youtube .item {
    display: inline-block;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
}
.youtube .item::before {
    content: '';
    display: inline-block;
    height: 50%;
    width: 1px;
    margin-right: -1px;
}
.youtube .outer {
    display: inline-block;
    vertical-align: middle;
    max-width: 850px;
    max-height: 100%;
    width: 100%;
    padding: 0 5px;
}
.youtube .control {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
    position: relative;
}
.youtube iframe {
    display: inline-block;
    transform: scale3d(.5,.5,.5);
    transition: transform .3s;
    transform-origin: 50% 50%;
}
.youtube.active iframe {
    transform: scale3d(1,1,1);
}
.youtube .item > a {
    color: var(--white-color);
    float: right;
}

/* ----------------
   02. f. Banner */
.banner {
    position: relative;
    background-color: var(--light-color);
}
.banner .wrap {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.banner .bg-image {
    height: 400px;
    position: relative;
}
.banner .info {
    padding: 85px 0;
}
.banner .info span {
    color: var(--primary-color);
    font-weight: 700;
}
.banner .info h3 {
    font-size: clamp(36px, -0.875em + 8.333vw, 50px);
    margin-bottom: 30px;
}

/* -------------------
   03. FOOTER
   ------------------- */

.inner-footer {
    font-size: 14px;
    padding: 0 0 60px;
    color: #7f7f7f;
}
.inner-footer .wrap {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(225px, 1fr));
}
.inner-footer .wrap h3 {
    font-weight: 700;
    color: var(--dark-color);
    margin-bottom: 15px;
}
.inner-footer .wrap > div:not(.subscribe) h3 {
    font-size: 18px;
}
.inner-footer .socials ul {
    display: flex;
    gap: 15px;
    font-size: 20px;
    color: var(--dark-color);
}
footer a {
    transition: color .3s;
}
footer a:hover {
    color: var(--dark-color);
}
footer .socials a:hover {
    color: var(--grey-color);
}

.copyright {
    text-align: center;
}


@media only screen and (max-width: 576px) {
    .header-main .icons :where(li:nth-child(2), li:nth-child(3)) {
        display: none;
    }
    .hero .wrap {
        gap: 15px;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    .hero .wrap {
        grid-template-columns: 1fr 1fr;
    }
    .hero .big {
        grid-column-start: 1;
        grid-column-end: 3;
    }
}

@media (min-width: 768px) {
    .hero .wrap {
        grid-template-columns: 2fr 1fr 1fr;
    }
    .hero .big {
        grid-row-start: 1;
        grid-row-end: 3;
        height: 640px;
    }
    .hero .list:not(.big) {
        height: 320px;
    }
}
   
@media only screen and (min-width: 992px) {
    .header-main .menu-trigger {
        display: none;
    }
    .header-main nav > ul {
        display: flex;
    }
    .header-top {
        display: block;
    }
    /* SUBMENU */
    .header-main nav .submenu {
        position: absolute;
        top: auto;
        left: auto;
        padding: 15px 20px;
        margin-left: -20px;
        line-height: 40px;
        min-width: 150px;
        z-index: 999;
    }
    .header-main nav :where(.submenu, .megamenu) {       
        background-color: var(--white-color);
        box-shadow: 0 20px 30px rgb(0 0 0 / 13%);

        opacity: 0;
        visibility: hidden;
        transform: translateY(20px);
        transform: transform .3s;
    }
    .header-main nav li:hover :where(.submenu, .megamenu) {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        z-index: 2;
    }

    /* MEGA MENU */

    .megamenu {
        position: absolute;
        left: 0;
        right: 0;
        padding: 30px 0;
    }
    .megamenu .wrap {
        display: grid;
        grid-template-columns: 1fr 2fr;
        align-items: flex-start;
        gap: 60px;
    }
    .megamenu .menus {
        display: flex;
        justify-content: space-between;
    }
    .megamenu .links h3 {
        font-size: 16px;
        font-weight: 700;
        margin-bottom: 10px;
        text-transform: uppercase;
    }
    .megamenu .links a {
        color: #7f7f7f;
        transition: color .3s;
    }
    .megamenu .links a:hover {
        color: var(--dark-color);
    }
    .megamenu .featured h3 {
        text-align: center;
        margin-bottom: 30px;
    }
    .megamenu .product {
        grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
    }
    .inner-footer .wrap {
        grid-template-columns: 1fr 1fr 1fr 2fr;
    }
}