@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap");
/*     font-family: "Cormorant Garamond", serif; */
/*       font-family: "Great Vibes", cursive; */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body,
html,
form,
ul,
li,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  border: 0;
}
body {
  font-family: "Inter", sans-serif !important;
}
ul,
li {
  list-style: none;
}
a,
a:hover,
a:focus {
  border: 0;
  outline: none;
  text-decoration: none;
}
a:focus,
input:focus {
  outline: none;
}
.flex_center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.others_page_menu_section {
  background-color: #fff5e4;
}
.header {
  /* background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  position: sticky;
  top: 0;
  z-index: 1000; */
}
.header-main {
  padding: 10px 0;
  display: flex;
  align-items: center;
  gap: 25px;
}
.logo {
  font-size: 26px;
  font-weight: bold;
  color: #2c5f8d;
  text-decoration: none;
  white-space: nowrap;
}
.nav-link:focus,
.nav-link:hover {
  color: #2e7d32;
}
.nav {
  flex: 1;
  justify-content: flex-end;
}
.nav-list {
  list-style: none;
  display: flex;
  justify-content: center;
}
.nav-item {
  position: relative;
}
.nav-link {
  padding: 10px 16px;
  text-decoration: none;
  color: #4f4f4f;
  font-size: 14px;
}
.has-submenu > .nav-link:after {
  content: " ▼";
  font-size: 10px;
}

.submenu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 240px;
  background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: 0.25s;
}
.nav-item:hover > .submenu {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.submenu-item {
  position: relative;
  border-bottom: 1px solid #eee;
}
.submenu-link {
  padding: 12px 16px;
  display: flex;
  justify-content: space-between;
  text-decoration: none;
  color: #333;
}
.submenu-item.has-nested > .submenu-link:after {
  content: " ▶";
}

.nested-submenu {
  position: absolute;
  top: 0;
  left: 100%;
  min-width: 220px;
  background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateX(-10px);
  transition: 0.25s;
}
.submenu-item.has-nested:hover > .nested-submenu {
  opacity: 1;
  visibility: visible;
  transform: none;
}
.nested-submenu a {
  display: block;
  padding: 12px 16px;
  text-decoration: none;
  color: #333;
}

.header-right {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-left: auto;
}
.header-icon {
  position: relative;
  font-size: 18px;
  cursor: pointer;
}
.header-icon span {
  position: absolute;
  top: -6px;
  right: -8px;
  background: #ff5050;
  color: #fff;
  font-size: 10px;
  padding: 2px 5px;
  border-radius: 50%;
}

.search-box {
  position: relative;
}
.search-box input {
  padding: 7px 35px 7px 12px;
  background-color: transparent;
  border: 1px solid #0f4d4a;
}
.search-box i {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.mobile-toggle,
.mobile-search,
.mobile-menu-close {
  display: none;
}
.header-icon i {
  color: #0f4d4a;
}
.fa-coins {
  color: #fb8500 !important;
}

@media (min-width: 991px) {
  #menuBack {
    display: none;
  }
}
@media (max-width: 991px) {
  .mobile-toggle,
  .mobile-search {
    display: block;
  }

  .nav {
    position: fixed;
    top: 0;
    left: -100%;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    background: #fff;
    transition: left 0.3s ease;
    z-index: 1200;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.2);
    justify-content: unset;
  }
  .mobile-search {
    top: 3px;
  }
  .nav.active {
    left: 0;
  }

  .nav-list {
    flex-direction: column;
    padding-top: 70px;
    justify-content: unset;
    width: 100%;
  }
  .nav-item {
    border-bottom: 1px solid #eee;
  }
  .nav-link {
    padding: 16px;
    display: flex;
    justify-content: space-between;
  }

  .submenu,
  .nested-submenu {
    position: static;
    display: none;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .nav-item.active > .submenu,
  .submenu-item.active > .nested-submenu {
    display: block;
  }

  .search-box input,
  .search-box i {
    display: none;
  }

  .search-box.active {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #f9d6a3;
    padding: 12px;
    /* z-index: 1300; */
  }
  .search-box.active input {
    display: block;
    width: 100%;
    padding: 12px 55px 12px 12px;
    border: none;
    outline: none;
  }
  .search-box.active i {
    display: block;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    background: #0f4d4a;
    color: #fff;
    padding: 10px;
    border-radius: 4px;
  }
  .pro-page .buy_btn{
  min-width: 220px;
  height: 54px;
  border: 1px solid #c9a45d;
  background: transparent;
  color: #a57b36;
  display: flex;
  align-items: center;      /* centers vertically */
  justify-content: center;  /* centers horizontally */
  text-align: center;       /* can leave this, but flex ignores it for centering */

  }

.pro-page .product_btns{
    margin-top: 28px;
}

  .mobile-menu-close {
    display: none;
    position: fixed;
    top: 17px;
    left: 260px;
    font-size: 20px;
    cursor: pointer;
    z-index: 1400;
    background: #fff;
    padding: 3px 6px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  }
  .logo {
    font-size: 10px;
  }

  .nav[data-level="root"] .submenu,
  .nav[data-level="root"] .nested-submenu {
    display: none !important;
  }

  .nav[data-level="submenu"] .nav-item {
    display: none;
  }
  .nav[data-level="submenu"] .nav-item.active {
    display: block;
  }
  .nav[data-level="submenu"] .submenu {
    display: block;
  }

  .mobile-menu-close.back {
    font-size: 16px;
  }

  .nav[data-level="root"] .submenu,
  .nav[data-level="root"] .nested-submenu {
    display: none !important;
  }

  .nav[data-level="submenu"] .nav-item {
    display: none;
  }
  .nav[data-level="submenu"] .nav-item.active {
    display: block;
  }
  .nav[data-level="submenu"] .submenu {
    display: block;
  }

  .nav[data-level="nested"] .submenu,
  .nav[data-level="nested"] .nested-submenu {
    display: block;
  }

  .mobile-menu-close.back {
    font-size: 16px;
  }
  .mobile-menu-close.back::before {
    content: "← Back";
  }

  .mobile-menu-close.back {
    left: 15px;
    right: auto;
    font-size: 16px;
  }

  .mobile-menu-back {
    display: none;
    position: fixed;
    top: 15px;
    left: 15px;
    font-size: 16px;
    cursor: pointer;
    z-index: 1400;
    background: #fff;
    padding: 6px 10px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  }
}
@media (max-width: 450px) {
  .header-right {
    gap: 15px;
  }
}
@media (max-width: 420px) {
  .header-main {
    gap: unset;
  }
}
@media (max-width: 380px) {
  .header-right {
    gap: 8px;
  }
  .logo img {
    width: 100px;
  }
}
@media (max-width: 374px) {
  .mobile-menu-close {
    left: 240px;
  }
}
@media (max-width: 348px) {
  .mobile-menu-close {
    left: 220px;
  }
}
/* 404 page */
  .clx-404{
    --cream: #faf1e2;
    --green-deep: #163a30;
    --gold: #c1903f;
    --gold-soft: #cda45c;
    --script-teal: #2f6f5e;
    --ink: #2b2a26;
    --ink-soft: #6b6459;

    font-family:'Poppins', sans-serif;
    background:var(--cream);
    color:var(--ink);
    position:relative;
    padding:90px 24px 110px;
    text-align:center;
    overflow:hidden;
    background:
      radial-gradient(ellipse at 12% 15%, rgba(193,144,63,0.10), transparent 45%),
      radial-gradient(ellipse at 88% 85%, rgba(47,111,94,0.10), transparent 45%),
      var(--cream);
  }
  .clx-404 *{box-sizing:border-box;}
  .clx-404 a{text-decoration:none;}

  .clx-404 .vine{
    position:absolute;
    opacity:.5;
    pointer-events:none;
  }
  .clx-404 .vine.tl{top:-40px;left:-60px;width:260px;transform:rotate(20deg);}
  .clx-404 .vine.br{bottom:-50px;right:-70px;width:300px;transform:rotate(200deg);}

  .clx-404 .flourish{
    width:150px;
    margin:0 auto 26px;
    opacity:.85;
  }

  .clx-404 .num404{
    font-family:'Playfair Display', serif;
    font-weight:600;
    font-size:clamp(90px, 16vw, 190px);
    line-height:1;
    color:var(--green-deep);
    letter-spacing:4px;
    margin:0;
  }

  .clx-404 .lede{
    font-family:'Playfair Display', serif;
    font-size:clamp(24px, 3vw, 34px);
    color:var(--ink);
    margin:8px 0 2px;
    font-weight:500;
  }
  .clx-404 .lede-script{
    font-family:'Dancing Script', cursive;
    font-size:clamp(38px, 5.5vw, 60px);
    color:var(--script-teal);
    font-weight:700;
    display:block;
    margin:2px 0 26px;
  }

  .clx-404 .rule{
    width:260px;
    margin:0 auto 30px;
    opacity:.8;
  }

  .clx-404 .desc{
    max-width:520px;
    margin:0 auto 40px;
    color:var(--ink-soft);
    font-size:15.5px;
    line-height:1.8;
    font-weight:300;
  }

  .clx-404 .cta-row{
    display:flex;
    gap:18px;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:64px;
  }
  .clx-404 .btn{
    padding:15px 34px;
    font-size:13.5px;
    letter-spacing:.5px;
    font-weight:500;
    border-radius:2px;
    transition:all .25s ease;
    cursor:pointer;
    display:inline-block;
  }
  .clx-404 .btn-solid{
    background:var(--gold);
    color:#fff;
    border:1px solid var(--gold);
  }
  .clx-404 .btn-solid:hover{
    background:#a97a34;
    border-color:#a97a34;
  }
  .clx-404 .btn-outline{
    background:transparent;
    color:var(--gold);
    border:1px solid var(--gold);
  }
  .clx-404 .btn-outline:hover{
    background:var(--gold);
    color:#fff;
  }

  .clx-404 .lost-strip{
    max-width:900px;
    margin:0 auto;
    display:flex;
    justify-content:center;
    gap:26px;
    flex-wrap:wrap;
  }
  .clx-404 .lost-card{
    width:150px;
    text-align:left;
  }
  .clx-404 .lost-thumb{
    width:150px;height:150px;
    border-radius:3px;
    background:linear-gradient(135deg, #e7d9bc, #d9c39a);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:10px;
    position:relative;
    overflow:hidden;
  }
  .clx-404 .lost-thumb svg{width:56px;height:56px;opacity:.55;}
  .clx-404 .lost-label{
    font-size:12.5px;
    color:var(--ink-soft);
    font-weight:400;
  }
  .clx-404 .lost-label b{
    display:block;
    color:var(--ink);
    font-family:'Playfair Display', serif;
    font-size:14px;
    font-weight:500;
    margin-bottom:2px;
  }

  .clx-404 .hint{
    margin-top:56px;
    font-size:13px;
    color:var(--ink-soft);
    font-weight:300;
    letter-spacing:.3px;
  }
  .clx-404 .hint a{
    color:var(--script-teal);
    border-bottom:1px solid var(--script-teal);
    font-weight:500;
  }

  @media(max-width:820px){
    .clx-404{padding:60px 20px 70px;}
  }