:root{
  --bg:#ffffff;
  --surface:#ffffff;
  --ink:#2B2B2B;
  --muted:#666666;
  --primary:#1B4332;
  --secondary:#D4AF37;
  --accent:#ffffff;
  --line:rgba(27,67,50,.14);
  --shadow:0 10px 30px rgba(27,67,50,.08);
  --radius:18px;
  --radius-sm:12px;
  --container:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:#000000;
  background: #ffffff;
  font-family: verdana, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  line-height:1.55;
}
h1,h2,h3,h4,h5,h6{font-family:verdana, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}

.container{max-width:98%; margin:0 auto; padding:0 18px}

.topbar{
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.65);
  backdrop-filter: blur(10px);
}
.topbar__inner{display:flex; align-items:center; justify-content:space-between; padding:10px 0; gap:12px}
.topbar__note{font-size:12px; color:#000000}
.topbar__links{display:flex; gap:14px; font-size:12px}

.ticker{
  background: #000000;
  color: #ffffff;
  padding: 8px 0;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
}
.ticker__content{
  display: inline-block;
  padding-left: 100%;
  animation: ticker-scroll 30s linear infinite;
}
.ticker__content:hover{
  animation-play-state: paused;
}
.ticker__content span{
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.5px;
}
@keyframes ticker-scroll{
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0);
  }
}

.header{
  position:sticky; 
  top:0; 
  z-index:50; 
  background: #ffffff;
  border-bottom:2px solid #d0d0d0;
  box-shadow:0 4px 20px rgba(27,67,50,.08)
}
.header__inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:14px}
.brand{display:flex; align-items:center; gap:10px}
.brand__name{font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif; letter-spacing:.5px; font-weight:700}
.brand__logo{display:block; height:80px; width:auto}
.brand__tag{font-size:12px; color:#000000}
.nav{display:none; align-items:center; gap:18px; font-size:14px; color:rgba(43,43,43,.88)}
.nav a{
  padding:10px 16px; 
  border-radius:12px;
  font-weight:600; /* Bolder text */
  font-size:14px;
  color:var(--primary); /* Use primary color */
  transition:all 0.3s ease;
  border:1px solid transparent;
  text-transform:uppercase;
  letter-spacing:0.3px;
}
.nav a:hover{
  background:linear-gradient(135deg, rgba(27,67,50,.08), rgba(212,175,55,.12));
  color:var(--primary);
  border-color:rgba(212,175,55,.3);
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(27,67,50,.15);
}
.header__actions{display:flex; align-items:center; gap:14px}
.icon-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 16px; border-radius:14px; border:1px solid var(--line); background:linear-gradient(180deg, rgba(248,245,233,.95), rgba(212,175,55,.1)); font-weight:600; font-size:13px; color:var(--primary); transition:all 0.3s ease; box-shadow:0 2px 8px rgba(27,67,50,.08)}
.icon-btn:hover{
  background:linear-gradient(180deg, rgba(248,245,233,1), rgba(212,175,55,.18));
  border-color:rgba(212,175,55,.4);
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(27,67,50,.15);
}
.icon-btn .icon{display:block}
.icon-btn svg{width:18px; height:18px; fill:var(--primary)}

.cart-btn{position:relative; padding:12px 16px; background:linear-gradient(180deg, rgba(248,245,233,.95), rgba(212,175,55,.15)); border:1px solid rgba(212,175,55,.3); border-radius:14px; transition:all 0.3s ease; box-shadow:0 2px 8px rgba(212,175,55,.1)}
.cart-btn:hover{
  background:linear-gradient(180deg, rgba(248,245,233,1), rgba(212,175,55,.25));
  border-color:rgba(212,175,55,.5);
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(212,175,55,.2);
}
.cart-badge{position:absolute; top:-6px; right:-6px; min-width:20px; height:20px; padding:0 6px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--secondary), #e6b800); color:#fff; border:1px solid rgba(212,175,55,.5); font-size:11px; font-weight:700; box-shadow:0 4px 12px rgba(212,175,55,.3)}
.cart-badge strong{font-weight:900; line-height:1}

.badge{display:inline-flex; align-items:center; gap:8px; padding:8px 10px; font-size:12px; color:rgba(43,43,43,.82); border:1px solid rgba(212,175,55,.28); border-radius:999px; background:linear-gradient(180deg, rgba(248,245,233,.78), rgba(212,175,55,.14))}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:9px 12px; border-radius:14px; border:1px solid var(--line); background:#ffffff; font-weight:600; font-size:12px; transition:all 0.3s ease}
.btn:hover{box-shadow: var(--shadow)}
.btn--primary{background:linear-gradient(135deg, var(--primary), #2d5a47); color:#fff; border-color:rgba(27,67,50,.35)}
.btn--primary:hover{filter:saturate(1.05); transform:translateY(-1px)}
.btn--ghost{background:transparent}

.menu-btn{display:none}

.drawer-overlay{
  position:fixed;
  inset:0;
  background:rgba(27,67,50,.45);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
  z-index:60;
}

.drawer{
  position:fixed;
  top:0;
  right:0;
  height:100vh;
  width:min(360px, 90vw);
  background:#ffffff;
  backdrop-filter: blur(12px);
  border-left:1px solid var(--line);
  box-shadow: var(--shadow);
  transform:translateX(100%);
  transition:transform .25s ease;
  z-index:70;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.drawer__head{display:flex; align-items:center; justify-content:space-between; gap:12px}
.drawer__nav{display:grid; gap:10px}
.drawer__nav a{padding:10px 12px; border-radius:14px; border:1px solid var(--line); background:#ffffff; font-weight:700; transition:all 0.3s ease}
.drawer__nav a:hover{background:rgba(212,175,55,.16)}

body.is-drawer-open{overflow:hidden}
body.is-drawer-open .drawer-overlay{opacity:1; pointer-events:auto}
body.is-drawer-open .drawer{transform:translateX(0)}

.grid{display:grid; gap:16px}

.hero{padding:28px 0 18px}
.hero__card{
  border:1px solid var(--line);
  border-radius: calc(var(--radius) + 6px);
  background: #ffffff;
  overflow:hidden;
  box-shadow: var(--shadow);
}
.hero__inner{display:flex; flex-direction:column; gap:18px; padding:20px}
.hero__kicker{display:flex; flex-wrap:wrap; gap:10px}
.hero h1{margin:0; font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif; font-size:34px; line-height:1.1}
.hero__banner-img{
  display:block;
  width:100%;
  max-width:none;
  position:relative;
  left:50%;
  transform:translateX(-50%);
  height:auto;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(248,245,233,.65);
}
.hero__headline{position:relative; display:inline-block}
.hero__headline::after{
  content:"";
  position:absolute;
  left:-6px;
  right:-6px;
  bottom:-10px;
  height:46px;
  background-image:url("../images/products/kashmiri-saffron/1.png");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  border-radius:14px;
  opacity:.22;
  filter: blur(.2px) saturate(1.05);
  z-index:-1;
}
.hero p{margin:0; color:#000000; font-size:14px}
.hero__cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:14px}
.hero__media{
  aspect-ratio: 16/10;
  border-top:1px solid var(--line);
  background:
    radial-gradient(900px 520px at 20% 30%, rgba(212,175,55,.25), transparent 60%),
    radial-gradient(800px 520px at 80% 20%, rgba(27,67,50,.18), transparent 60%),
    linear-gradient(135deg, rgba(27,67,50,.35), rgba(27,67,50,.05));
}
.hero__banner{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.hero__media-inner{height:100%; display:grid; place-items:center; color:rgba(255,255,255,.9); padding:18px}
.hero__media-inner .caption{max-width:520px; text-align:center; font-size:13px; color:rgba(255,255,255,.85)}

/* Banner Slider Styles */
.banner-slider{
  position:relative;
  width:100%;
  height:350px;
  overflow:hidden;
  border-radius: calc(var(--radius) + 6px);
  margin-bottom:20px;
  border:1px solid var(--line);
  background:#ffffff;
  box-shadow: 0 8px 22px rgba(27,67,50,.06);
}
.banner-slide{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 1s ease-in-out;
}
.banner-slide.active{
  opacity:1;
}
.banner-slide__bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.banner-slide__overlay{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:linear-gradient(180deg, rgba(27,67,50,.4), rgba(27,67,50,.6));
}
.banner-slide__content{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  text-align:center;
  color:#fff;
  z-index:2;
  padding:20px;
}
.banner-slide__title{
  font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size:42px;
  font-weight:800;
  margin:0 0 12px 0;
  text-shadow:0 2px 8px rgba(0,0,0,.3);
  letter-spacing:0.5px;
}
.banner-slide__subtitle{
  font-size:18px;
  font-weight:300;
  margin:0;
  text-shadow:0 1px 4px rgba(0,0,0,.3);
  opacity:0.95;
}
.banner-slider__indicators{
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:12px;
  z-index:3;
}
.banner-slider__indicator{
  width:12px;
  height:12px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.6);
  background:transparent;
  cursor:pointer;
  transition:all 0.3s ease;
  padding:0;
}
.banner-slider__indicator:hover{
  border-color:rgba(255,255,255,.9);
  transform:scale(1.1);
}
.banner-slider__indicator.active{
  background:rgba(255,255,255,.9);
  border-color:rgba(255,255,255,.9);
}

@media (max-width: 759px){
  .banner-slider{
    height:280px;
    margin-bottom:16px;
  }
  .banner-slide__title{
    font-size:32px;
  }
  .banner-slide__subtitle{
    font-size:16px;
  }
  .banner-slider__indicators{
    bottom:16px;
    gap:10px;
  }
  .banner-slider__indicator{
    width:10px;
    height:10px;
  }
  .ticker__content span{
    font-size: 11px;
    font-weight: 500;
  }
}

.section{padding:22px 0}
.section__head{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px}
.section__title{margin:0; font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif; font-size:22px}
.section__sub{margin:0; color:#000000; font-size:13px}

.card{border:1px solid var(--line); border-radius:var(--radius); background:#ffffff; box-shadow: 0 8px 22px rgba(27,67,50,.06)}
.card__pad{padding:16px}

.product-card{overflow:hidden}
.product-card__img{aspect-ratio: 1/1; background:linear-gradient(135deg, rgba(212,175,55,.18), rgba(27,67,50,.08)); border-bottom:1px solid var(--line); overflow:hidden}
.product-card__img-el{width:100%; height:100%; object-fit:contain; display:block}
.product-card__body{padding:14px}
.product-card__name{margin:0; font-weight:700}
.product-card__desc{margin:6px 0 0; font-size:13px; color:#000000}
.product-card__meta{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px}
.product-card__price-info{display:flex; flex-direction:column; align-items:flex-start}
.price{font-weight:800; color:var(--primary)}
.small{font-size:12px; color:#000000}

.trust-row{display:grid; gap:10px}
.trust{display:flex; gap:10px; align-items:flex-start}
.trust__dot{width:10px; height:10px; border-radius:50%; background:var(--secondary); margin-top:6px; box-shadow:0 6px 14px rgba(212,175,55,.25)}
.trust__title{font-weight:700; margin:0}
.trust__text{margin:2px 0 0; color:#000000; font-size:13px}

.footer{
  border-top:1px solid rgba(255,255,255,.2); 
  padding:26px 0; 
  margin-top:20px; 
  position:relative;
  background-image: 
    linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
    url('../images/Untitled.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #ffffff;
}
.footer__grid{display:grid; gap:18px; align-items: flex-start;}
.footer__left{display:flex; flex-direction:column; gap:24px; min-height:100%;}
.footer__brand{display:flex; flex-direction:column; gap:8px; align-items: flex-start;}
.footer__cols{display:grid; gap:16px}
.footer__office{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:auto;
}
.footer__office-copy{
  display:grid;
  gap:4px;
  color:rgba(255,255,255,.95);
  font-size:14px;
  line-height:1.7;
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
.footer__contact-list{
  display:grid;
  gap:4px;
}
.footer__contact-link{
  display:inline-flex !important;
  align-items:center;
  gap:10px;
  width:fit-content;
  max-width:100%;
}
.footer__contact-icon{
  display:inline-flex;
  width:18px;
  justify-content:center;
  flex:0 0 18px;
}
.footer h4{
  margin:0 0 12px; 
  font-size:15px; 
  letter-spacing:.4px; 
  text-transform:uppercase; 
  color:rgba(255,255,255,1); /* Pure white for maximum contrast */
  font-weight:700;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3); /* Subtle shadow for depth */
}
.footer a{
  display:block; 
  padding:8px 0; 
  color:rgba(255,255,255,.95); /* Near-white for better readability */
  font-size:14px; 
  font-weight:500; /* Medium weight for prominence */
  transition:all 0.3s ease;
  text-shadow: 0 1px 1px rgba(0,0,0,0.2); /* Subtle shadow */
}
.footer a:hover{
  color:rgba(255,215,0,1); /* Pure gold for hover */
  transform: translateX(3px); /* Subtle movement for interaction */
}
.footer__bottom{
  margin-top:20px; 
  text-align:left; /* Left-align the logo and copyright text */
  background: #ffffff; /* Solid white background */
  color:#000000; /* Black text for white background */
  font-size:13px; /* Larger font */
  font-weight:500; /* Medium weight */
  border-top:1px solid rgba(0,0,0,.2); /* Dark border for contrast */
  padding-top:18px;
  text-shadow: none; /* Remove text shadow for white background */
  width: 100%; /* Full width */
}
.footer__bottom-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}
.footer__partner{
  display:inline-flex !important;
  align-items:center;
  padding:0 !important;
}
.footer__copyright{
  flex:1 1 240px;
  text-align:center;
}
.footer__social{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
}
.footer__social-title{
  font-size:13px;
  font-weight:700;
  color:#1B4332;
  letter-spacing:.2px;
}
.footer__social-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.footer__social-link{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:999px;
  padding:0 !important;
  color:#1B4332 !important;
  background:linear-gradient(180deg, rgba(212,175,55,.16), rgba(27,67,50,.1));
  border:1px solid rgba(27,67,50,.18);
  box-shadow:0 6px 16px rgba(27,67,50,.08);
  transition:transform .2s ease, box-shadow .2s ease, color .2s ease, background .2s ease, border-color .2s ease;
  text-shadow:none !important;
}
.footer__social-link:hover,
.footer__social-link:focus-visible{
  transform:translateY(-2px) scale(1.05);
  color:#ffffff !important;
  background:#1B4332;
  border-color:#1B4332;
  box-shadow:0 10px 22px rgba(27,67,50,.22);
}
.footer__social-link:focus-visible{
  outline:2px solid rgba(212,175,55,.85);
  outline-offset:3px;
}
.footer__social-link--facebook:hover,
.footer__social-link--facebook:focus-visible{
  background:#1877F2;
  border-color:#1877F2;
}
.footer__social-link--instagram:hover,
.footer__social-link--instagram:focus-visible{
  background:linear-gradient(135deg, #F58529, #DD2A7B, #8134AF);
  border-color:#DD2A7B;
}
.footer__social-link--linkedin:hover,
.footer__social-link--linkedin:focus-visible{
  background:#0A66C2;
  border-color:#0A66C2;
}
.footer__social-link--twitter:hover,
.footer__social-link--twitter:focus-visible{
  background:#111111;
  border-color:#111111;
}
.footer__social-link svg{
  width:22px;
  height:22px;
}

/* Footer-specific badge styles for dark background */
.footer .badge{
  background:linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,215,0,.15));
  border:1px solid rgba(255,215,0,.4);
  color:rgba(255,255,255,1); /* Pure white */
  font-weight:600; /* Bolder text */
  font-size:12px; /* Slightly larger */
  backdrop-filter: blur(4px);
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
  box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Subtle shadow */
}

/* Enhanced brand description */
.footer__brand .small {
  color: rgba(255,255,255,.9); /* Lighter for better readability */
  font-size:14px; /* Larger font */
  font-weight:400; /* Medium weight */
  line-height:1.6; /* Better spacing */
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}

.form{display:grid; gap:12px}
.input{width:100%; padding:12px 12px; border-radius:14px; border:1px solid var(--line); background:#ffffff; transition:all 0.3s ease}
.input:focus{outline:none; border-color:var(--secondary); box-shadow:0 0 0 3px rgba(212,175,55,.15)}
.label{font-size:12px; color:rgba(43,43,43,.78); font-weight:700}
.row{display:grid; gap:12px}

.pdp{display:grid; gap:16px}
.gallery{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#ffffff; box-shadow: var(--shadow)}
.gallery__main{background:#ffffff}
.gallery__stage{
  position:relative;
  width: 100%;
  aspect-ratio: 1/1;
  overflow:hidden;
  background:transparent;
  border-bottom:1px solid var(--line);
}
.gallery__img{width:100%; height:100%; object-fit:cover; display:block; transform-origin: var(--zoom-x, 50%) var(--zoom-y, 50%); transition: transform .18s ease}
.gallery__thumbs{
  display:flex;
  gap:10px;
  padding:12px;
  overflow-x:auto;
  overflow-y:hidden;
  border-bottom:1px solid var(--line);
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.gallery__thumb{flex:0 0 auto; width:64px; height:64px; border-radius:14px; border:1px solid var(--line); overflow:hidden; background:#ffffff}
.gallery__thumb{scroll-snap-align:start}
.gallery__thumb img{width:100%; height:100%; object-fit:cover; display:block}
.gallery__thumb.is-active{outline:2px solid rgba(212,175,55,.55); box-shadow:0 10px 22px rgba(212,175,55,.12)}
.gallery__thumbs::-webkit-scrollbar{height:8px}
.gallery__thumbs::-webkit-scrollbar-track{background:rgba(27,67,50,.08); border-radius:999px}
.gallery__thumbs::-webkit-scrollbar-thumb{background:rgba(212,175,55,.45); border-radius:999px}

.gallery__stage.is-zoom .gallery__img{transform: scale(2)}
.pdp__panel{border:1px solid var(--line); border-radius:var(--radius); background:#ffffff; box-shadow: var(--shadow); padding:16px}
.pdp h1{margin:0; font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif; font-size:26px; line-height:1.15}
.pdp .lede{color:#000000; font-size:13px; margin:10px 0 0}
.kv{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px}
.kv .badge{background:rgba(212,175,55,.08)}

.table{width:100%; border-collapse:collapse}
.table th, .table td{padding:12px 10px; border-bottom:1px solid var(--line); text-align:left; font-size:13px}
.table th{color:rgba(43,43,43,.82); font-weight:800}

.toast{position:fixed; bottom:16px; left:50%; transform:translateX(-50%); background:rgba(27,67,50,.92); color:#fff; padding:10px 12px; border-radius:999px; font-size:13px; opacity:0; pointer-events:none; transition:opacity .2s ease}
.toast.show{opacity:1}

@media (max-width: 759px){
  body{overflow-x:hidden}
  .topbar__inner{flex-wrap:wrap}
  .topbar__links{flex-wrap:wrap}
  .header__inner{flex-wrap:wrap}
  .brand__logo{height:44px}
  .menu-btn{display:inline-flex}
  .nav{display:none}
  .header__actions{flex-wrap:wrap}
  
  /* Mobile footer adjustments */
  .footer{
    background-attachment: scroll; /* Better performance on mobile */
    padding:20px 0;
  }
  .footer__grid{
    gap:15px;
    align-items: flex-start; /* Maintain top alignment on mobile */
  }
  .footer__left{
    gap:18px;
  }
  .footer__brand{
    gap:8px;
    align-items: flex-start; /* Maintain top alignment */
  }
  .footer__office-copy {
    font-size:13px;
    line-height:1.6;
  }
  .footer .badge{
    font-size:11px;
    padding:6px 8px;
  }
  .footer h4 {
    font-size:14px; /* Slightly smaller but still prominent */
  }
  .footer a {
    font-size:13px; /* Slightly smaller but still readable */
  }
  .footer__brand .small {
    font-size:13px; /* Adjusted for mobile */
  }
  .footer__bottom {
    font-size:12px; /* Adjusted for mobile */
  }
  .footer__bottom img {
    height: 40px; /* Smaller logo on mobile */
  }
  .footer__bottom-row {
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  .footer__copyright {
    flex:none;
  }
  .footer__social {
    justify-content:center;
    flex-direction:column;
    gap:10px;
  }
  .footer__social-links {
    gap:12px;
  }
  .footer__social-link {
    width:40px;
    height:40px;
    min-width:40px;
  }
  .footer .table{display:block; overflow-x:auto; -webkit-overflow-scrolling:touch}
}

@media (min-width: 520px) and (max-width: 759px){
  .grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}
}

@media (min-width: 760px){
  .nav{display:flex}
  .menu-btn{display:none}
  .drawer, .drawer-overlay{display:none}
  .hero__inner{display:block; padding:26px}
  .hero__media{border-top:none; border-left:1px solid var(--line); aspect-ratio:auto}
  .hero h1{font-size:44px}
  .grid.cols-2{grid-template-columns:repeat(2,1fr)}
  .grid.cols-3{grid-template-columns:repeat(3,1fr)}
  .grid.cols-4{grid-template-columns:repeat(4,1fr)}
  .row.cols-2{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns: 1.2fr .8fr}
  .footer__cols{grid-template-columns:repeat(3,1fr)}
  .pdp{grid-template-columns: 0.8fr 1.2fr; align-items:start}
}

/* Product Tabs Styles */
.product-tabs{
  margin-top:32px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#ffffff;
  box-shadow: var(--shadow);
  overflow:hidden;
}

.product-tabs__nav{
  display:flex;
  background:#ffffff;
  border-bottom:1px solid var(--line);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(212,175,55,.45) rgba(27,67,50,.08);
}

.product-tabs__nav::-webkit-scrollbar{
  height:6px;
}

.product-tabs__nav::-webkit-scrollbar-track{
  background:rgba(27,67,50,.08);
  border-radius:999px;
}

.product-tabs__nav::-webkit-scrollbar-thumb{
  background:rgba(212,175,55,.45);
  border-radius:999px;
}

.product-tabs__tab{
  flex:0 0 auto;
  padding:14px 20px;
  border:none;
  background:transparent;
  color:var(--muted);
  font-weight:600;
  font-size:14px;
  cursor:pointer;
  transition:all 0.3s ease;
  border-bottom:3px solid transparent;
  white-space:nowrap;
  position:relative;
}

.product-tabs__tab:hover{
  color:var(--ink);
  background:rgba(212,175,55,.12);
}

.product-tabs__tab--active{
  color:var(--ink);
  border-bottom-color:var(--secondary);
  background:rgba(212,175,55,.18);
}

.product-tabs__tab--active::after{
  content:'';
  position:absolute;
  bottom:-1px;
  left:0;
  right:0;
  height:2px;
  background:linear-gradient(90deg, var(--secondary), rgba(212,175,55,.6));
  border-radius:1px;
}

.product-tabs__content{
  padding:24px;
  min-height:300px;
}

.product-tabs__pane{
  display:none;
  animation:fadeInUp 0.4s ease;
}

.product-tabs__pane--active{
  display:block;
}

@keyframes fadeInUp{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* Tab Content Styles */
.tab-description h3{
  margin:24px 0 12px;
  font-family: verdana, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size:20px;
  color:var(--ink);
}

.tab-description p{
  margin:0 0 16px;
  line-height:1.65;
  color:var(--muted);
}

.benefits-list{
  display:grid;
  gap:12px;
  margin:20px 0;
}

.benefits-list__item{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px;
  background:rgba(212,175,55,.08);
  border-radius:var(--radius-sm);
  border-left:4px solid var(--secondary);
}

.benefits-list__icon{
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--secondary);
  flex-shrink:0;
  margin-top:2px;
  position:relative;
}

.benefits-list__icon::after{
  content:'✓';
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  color:#fff;
  font-size:12px;
  font-weight:700;
}

.benefits-list__text{
  font-weight:600;
  color:var(--ink);
}

.brand-statement{
  margin:24px 0;
  padding:20px;
  background:linear-gradient(135deg, rgba(212,175,55,.15), rgba(27,67,50,.08));
  border-radius:var(--radius);
  border:1px solid rgba(212,175,55,.25);
  font-style:italic;
  color:var(--primary);
  text-align:center;
  font-family: Georgia, Cambria, "Times New Roman", Times, serif;
  font-size:16px;
  line-height:1.6;
}

/* Ingredients Tab */
.ingredients-grid{
  display:grid;
  gap:16px;
  margin-top:20px;
}

.ingredient-card{
  display:flex;
  gap:16px;
  padding:16px;
  background:rgba(248,245,233,.8);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  transition:all 0.3s ease;
}

.ingredient-card:hover{
  box-shadow:0 8px 24px rgba(27,67,50,.12);
  transform:translateY(-2px);
}

.ingredient__icon{
  width:48px;
  height:48px;
  border-radius:12px;
  background:linear-gradient(135deg, var(--secondary), rgba(212,175,55,.7));
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  font-size:20px;
}

.ingredient__content h4{
  margin:0 0 6px;
  font-size:16px;
  font-weight:700;
  color:var(--ink);
}

.ingredient__content p{
  margin:0;
  font-size:13px;
  color:var(--muted);
  line-height:1.5;
}

/* Product Information Tab */
.info-grid{
  display:grid;
  gap:20px;
  margin-top:20px;
}

.info-group{
  padding:16px;
  background:rgba(248,245,233,.8);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
}

.info-group h4{
  margin:0 0 12px;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:0.5px;
  color:var(--muted);
  font-weight:800;
}

.info-list{
  display:grid;
  gap:8px;
}

.info-item{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:8px 0;
  border-bottom:1px solid rgba(27,67,50,.08);
}

.info-item:last-child{
  border-bottom:none;
}

.info-item__label{
  font-weight:600;
  color:var(--ink);
  font-size:14px;
}

.info-item__value{
  color:var(--muted);
  font-size:14px;
  text-align:right;
}

/* FAQs Tab */
.faq-list{
  display:grid;
  gap:12px;
  margin-top:20px;
}

.faq-item{
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:rgba(248,245,233,.8);
  overflow:hidden;
  transition:all 0.3s ease;
}

.faq-item--open{
  box-shadow:0 8px 24px rgba(27,67,50,.12);
}

.faq-question{
  width:100%;
  padding:16px 20px;
  border:none;
  background:transparent;
  text-align:left;
  font-weight:700;
  font-size:15px;
  color:var(--ink);
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  transition:all 0.3s ease;
}

.faq-question:hover{
  background:rgba(212,175,55,.08);
}

.faq-question::after{
  content:'+';
  font-size:20px;
  font-weight:400;
  color:var(--secondary);
  transition:transform 0.3s ease;
}

.faq-item--open .faq-question::after{
  transform:rotate(45deg);
}

.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.3s ease;
  border-top:1px solid transparent;
}

.faq-item--open .faq-answer{
  max-height:300px;
  border-top-color:var(--line);
}

.faq-answer__content{
  padding:0 20px 16px;
  color:var(--muted);
  line-height:1.6;
  font-size:14px;
}

/* Reviews Tab */
.reviews-summary{
  display:flex;
  gap:24px;
  align-items:center;
  padding:20px;
  background:linear-gradient(135deg, rgba(212,175,55,.12), rgba(27,67,50,.06));
  border-radius:var(--radius);
  margin-bottom:24px;
  border:1px solid rgba(212,175,55,.2);
}

.rating-overview{
  text-align:center;
}

.rating-overview__number{
  font-size:48px;
  font-weight:800;
  color:var(--secondary);
  line-height:1;
  margin-bottom:8px;
}

.rating-overview__stars{
  font-size:18px;
  color:var(--secondary);
  margin-bottom:4px;
}

.rating-overview__count{
  font-size:13px;
  color:var(--muted);
}

.reviews-list{
  display:grid;
  gap:16px;
}

.review-card{
  padding:20px;
  background:rgba(248,245,233,.8);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  transition:all 0.3s ease;
}

.review-card:hover{
  box-shadow:0 8px 24px rgba(27,67,50,.08);
}

.review-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:12px;
}

.review-author{
  font-weight:700;
  color:var(--ink);
  font-size:15px;
}

.review-date{
  font-size:12px;
  color:var(--muted);
}

.review-rating{
  color:var(--secondary);
  font-size:14px;
  margin-bottom:8px;
}

.review-text{
  color:var(--muted);
  line-height:1.6;
  font-size:14px;
}

/* Write Review Tab */
.review-form{
  display:grid;
  gap:16px;
  max-width:500px;
  margin:0 auto;
}

.form-group{
  display:grid;
  gap:8px;
}

.form-label{
  font-weight:700;
  font-size:13px;
  color:var(--ink);
  text-transform:uppercase;
  letter-spacing:0.3px;
}

.form-input,
.form-textarea{
  width:100%;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:rgba(248,245,233,.9);
  font-family:inherit;
  font-size:14px;
  transition:all 0.3s ease;
}

.form-input:focus,
.form-textarea:focus{
  outline:none;
  border-color:var(--secondary);
  box-shadow:0 0 0 3px rgba(212,175,55,.15);
}

.form-input--error,
.form-textarea--error{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(27,67,50,0.3);
}

.form-textarea{
  min-height:120px;
  resize:vertical;
}

.rating-options{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

.rating-option{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  padding:8px 16px;
  border:2px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--accent);
  transition:all 0.2s ease;
  font-weight:500;
}

.rating-option:hover{
  border-color:var(--secondary);
  background:rgba(212,175,55,.05);
}

.rating-option input[type="radio"]{
  display:none;
}

.rating-option input[type="radio"]:checked + .rating-label{
  color:var(--secondary);
  font-weight:600;
}

.rating-option input[type="radio"]:checked + .rating-label::before{
  content:"★ ";
  color:var(--secondary);
}

.rating-label{
  color:var(--ink);
  font-size:16px;
  transition:all 0.2s ease;
}

.rating-option:hover .rating-label{
  color:var(--secondary);
}

.star-rating{
  display:flex;
  gap:8px;
  font-size:24px;
  padding:8px;
  border-radius:var(--radius-sm);
  transition:background-color 0.2s ease;
}

.star-rating:hover{
  background:rgba(212,175,55,.05);
}

.star-rating__star{
  cursor:pointer;
  color:rgba(212,175,55,.3);
  transition:all 0.2s ease;
  display:inline-block;
  padding:4px;
  border-radius:4px;
  user-select:none;
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
}

.star-rating__star:hover,
.star-rating__star--active{
  color:var(--secondary);
  transform:scale(1.1);
}

.form-submit{
  padding:14px 24px;
  background:linear-gradient(135deg, var(--secondary), rgba(212,175,55,.8));
  color:#fff;
  border:none;
  border-radius:var(--radius-sm);
  font-weight:700;
  font-size:15px;
  cursor:pointer;
  transition:all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.form-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(212,175,55,.3);
}

.form-submit:disabled{
  opacity:0.6;
  cursor:not-allowed;
  transform:none;
}

.form-error{
  color:var(--primary);
  font-size:12px;
  margin-top:4px;
  display:none;
}

.form-error--show{
  display:block;
}

/* Mobile Responsive */
@media (max-width: 759px){
  .product-tabs__nav{
    gap:0;
  }
  
  .product-tabs__tab{
    padding:12px 16px;
    font-size:13px;
  }
  
  .product-tabs__content{
    padding:16px;
  }
  
  .reviews-summary{
    flex-direction:column;
    text-align:center;
    gap:16px;
  }
  
  .ingredient-card{
    flex-direction:column;
    text-align:center;
  }
  
  .info-item{
    flex-direction:column;
    gap:4px;
  }
  
  .info-item__value{
    text-align:left;
  }
  
  /* Mobile PDP layout */
  .pdp{
    grid-template-columns: 1fr;
  }
  
  .gallery__stage{
    width: 100%;
    aspect-ratio: 1/1;
  }
}
