:root{
    --black:#0a0a0a;
    --black-2:#121110;
    --gold:#c9a24b;
    --gold-light:#e9d28a;
    --gold-deep:#8a6c2f;
    --cream:#f5f1e8;
    --line: rgba(201,162,75,0.25);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%;}
  body{
    background:var(--black);
    color:var(--cream);
    font-family:'Cairo', sans-serif;
    overflow-x:hidden;
    max-width:100%;
  }
  .en{font-family:'Playfair Display', serif;}
  .script{font-family:'Cormorant Garamond', serif;}
  select{ color-scheme:dark; }
  select option{ background:#1a1712; color:var(--cream); }

  /* texture */
  body::before{
    content:"";
    position:fixed; inset:0;
    background-image:
      radial-gradient(circle at 20% 20%, rgba(201,162,75,0.06), transparent 40%),
      radial-gradient(circle at 80% 70%, rgba(201,162,75,0.05), transparent 40%);
    pointer-events:none;
    z-index:0;
  }

  header{
    position:fixed; top:0; right:0; left:0;
    display:flex; justify-content:space-between; align-items:center;
    padding:22px 6%;
    z-index:100;
    background:linear-gradient(to bottom, rgba(10,10,10,0.9), transparent);
    transition:background .3s;
  }
  .logo-word{
    font-family:'Playfair Display', serif;
    font-style:italic;
    font-size:1.6rem;
    letter-spacing:2px;
    color:var(--gold-light);
  }
  nav ul{list-style:none; display:flex; gap:34px;}
  nav a{
    color:var(--cream); text-decoration:none; font-size:.92rem;
    letter-spacing:.5px; position:relative; padding-bottom:4px;
    transition:color .3s;
  }
  nav a::after{
    content:""; position:absolute; right:0; bottom:0; width:0; height:1px;
    background:var(--gold); transition:width .3s;
  }
  nav a:hover{color:var(--gold-light);}
  nav a:hover::after{width:100%;}
  .icons{display:flex; gap:20px; font-size:1.1rem; color:var(--gold-light);}

  /* HERO */
  .hero{
    min-height:100vh;
    display:flex; align-items:center; justify-content:center;
    position:relative;
    text-align:center;
    padding:0 5%;
    background:
      radial-gradient(ellipse at center, rgba(201,162,75,0.08), transparent 60%),
      var(--black);
  }
  .hero-content{position:relative; z-index:2; max-width:720px;}
  .hero-eyebrow{
    letter-spacing:5px; font-size:.78rem; color:var(--gold);
    text-transform:uppercase; margin-bottom:22px; display:block;
  }
  .hero h1{
    font-family:'Cairo', sans-serif;
    font-weight:800;
    font-size:clamp(2.6rem, 7vw, 5rem);
    font-style:normal;
    letter-spacing:0;
    background:linear-gradient(120deg, var(--gold-light), var(--gold) 40%, var(--gold-deep) 60%, var(--gold-light));
    -webkit-background-clip:text; background-clip:text; color:transparent;
    -webkit-text-fill-color:transparent;
    line-height:1.4; margin-bottom:18px;
    animation:shine 6s linear infinite;
    background-size:200% auto;
    padding-bottom:6px;
  }
  @keyframes shine{ to{ background-position:200% center; } }
  .hero p{
    font-size:1.15rem; color:#cfc7b4; margin:0 auto 40px; max-width:520px;
    line-height:1.9; font-weight:300;
  }
  .divider{
    width:120px; height:1px; margin:0 auto 30px;
    background:linear-gradient(90deg, transparent, var(--gold), transparent);
  }
  .cta-row{display:flex; gap:18px; justify-content:center; flex-wrap:wrap;}
  .btn{
    padding:16px 38px; font-size:.95rem; letter-spacing:1px;
    border-radius:2px; cursor:pointer; text-decoration:none;
    transition:all .35s; display:inline-block;
  }
  .btn-gold{
    background:linear-gradient(120deg, var(--gold-light), var(--gold));
    color:#160f04; font-weight:600; border:1px solid var(--gold);
  }
  .btn-gold:hover{ box-shadow:0 0 30px rgba(201,162,75,.4); transform:translateY(-2px); }
  .btn-outline{
    border:1px solid var(--line); color:var(--cream); background:transparent;
  }
  .btn-outline:hover{ border-color:var(--gold); color:var(--gold-light); }

  .watch-glow{
    position:absolute; width:min(480px, 90vw); height:min(480px, 90vw); border-radius:50%;
    background:radial-gradient(circle, rgba(201,162,75,0.18), transparent 65%);
    top:50%; left:50%; transform:translate(-50%,-50%);
    z-index:1; animation:pulse 5s ease-in-out infinite;
  }
  @keyframes pulse{ 0%,100%{opacity:.6;} 50%{opacity:1;} }

  .scroll-cue{
    position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
    font-size:.75rem; letter-spacing:3px; color:var(--gold);
    display:flex; flex-direction:column; align-items:center; gap:8px;
  }
  .scroll-cue span{
    width:1px; height:36px; background:linear-gradient(var(--gold), transparent);
    animation:down 2s ease-in-out infinite;
  }
  @keyframes down{ 0%{opacity:0; transform:scaleY(0);} 50%{opacity:1;} 100%{opacity:0; transform:scaleY(1);} }

  section{ position:relative; z-index:2; padding:120px 6%; }
  .section-head{ text-align:center; margin-bottom:70px; }
  .section-head .eyebrow{ letter-spacing:4px; font-size:.75rem; color:var(--gold); text-transform:uppercase;}
  .section-head h2{
    font-family:'Cairo', sans-serif; font-weight:700; font-style:normal;
    font-size:clamp(1.8rem,4vw,2.6rem); color:var(--gold-light); margin-top:12px; line-height:1.6;
  }

  /* COLLECTIONS */
  .collections{ background:var(--black-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .collection-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
    max-width:1200px; margin:0 auto;
  }
  .collection-card{
    position:relative; height:420px; overflow:hidden; cursor:pointer;
    display:flex; align-items:flex-end; justify-content:center; padding-bottom:40px;
  }
  .collection-card .bg{
    position:absolute; inset:0;
    background:linear-gradient(160deg, #1a1712, #0a0a0a 70%);
    transition:transform .6s ease;
  }
  .collection-card:nth-child(1) .bg{ background:linear-gradient(160deg, #241d10, #0a0a0a 70%); }
  .collection-card:nth-child(2) .bg{ background:linear-gradient(160deg, #14120f, #0a0a0a 70%); }
  .collection-card:nth-child(3) .bg{ background:linear-gradient(160deg, #1f1a10, #0a0a0a 70%); }
  .collection-card:hover .bg{ transform:scale(1.08); }
  .collection-card .watch-icon{
    position:absolute; top:50px; left:50%; transform:translateX(-50%);
    width:90px; height:90px; border-radius:50%;
    border:3px solid var(--gold); opacity:.85;
    display:flex; align-items:center; justify-content:center;
  }
  .collection-card .watch-icon::before{
    content:""; width:2px; height:24px; background:var(--gold); position:absolute; top:14px;
  }
  .collection-card .watch-icon::after{
    content:""; width:18px; height:2px; background:var(--gold); position:absolute; top:38px; left:52px;
  }
  .collection-card h3{
    position:relative; font-family:'Cairo', sans-serif; font-weight:700; font-style:normal;
    font-size:1.4rem; color:var(--gold-light); z-index:2; line-height:1.6;
  }
  .collection-card p{ position:relative; font-size:.85rem; color:#9c937f; margin-top:6px; z-index:2;}

  /* PRODUCTS */
  .product-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:34px;
    max-width:1300px; margin:0 auto;
  }
  .product-card{
    background:var(--black-2); border:1px solid var(--line); border-radius:4px;
    padding:26px 20px 24px; text-align:center; transition:all .4s;
  }
  .product-card:hover{ border-color:var(--gold); transform:translateY(-8px); box-shadow:0 20px 40px rgba(0,0,0,.5); }
  .product-thumb{
    height:180px; border-radius:50%; width:180px; margin:0 auto 22px;
    background:radial-gradient(circle at 35% 30%, var(--gold-light), var(--gold) 45%, #2a2210 100%);
    position:relative; box-shadow: inset 0 0 20px rgba(0,0,0,.5), 0 0 25px rgba(201,162,75,.15);
  }
  .product-thumb::before{
    content:""; position:absolute; inset:16px; border-radius:50%;
    background:var(--cream); box-shadow:inset 0 0 10px rgba(0,0,0,.3);
  }
  .product-thumb::after{
    content:""; position:absolute; top:50%; left:50%; width:2px; height:36px;
    background:#1a1a1a; transform:translate(-50%,-100%) rotate(20deg); transform-origin:bottom;
  }
  .product-thumb.has-photo::before, .product-thumb.has-photo::after{ display:none; }
  .product-card h4{ font-family:'Playfair Display', serif; font-size:1.05rem; color:var(--cream); margin-bottom:6px;}
  .product-card .cat{ font-size:.75rem; color:var(--gold); letter-spacing:1px; margin-bottom:10px; display:block;}
  .price{ font-size:1.1rem; color:var(--gold-light); font-weight:600; margin-bottom:16px;}
  .badge{
    position:relative; top:-4px; background:var(--gold); color:#160f04;
    font-size:.65rem; padding:3px 10px; border-radius:20px; margin-inline-start:8px;
    font-weight:700;
  }
  .btn-small{
    display:inline-block; width:100%; padding:11px; border:1px solid var(--gold);
    color:var(--gold-light); background:transparent; border-radius:2px; font-size:.85rem;
    cursor:pointer; transition:all .3s;
  }
  .btn-small:hover{ background:var(--gold); color:#160f04; }

  /* STORY */
  .story{
    display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;
    max-width:1200px; margin:0 auto; background:var(--black-2);
    border:1px solid var(--line); border-radius:6px; padding:70px;
  }
  .story-visual{
    height:340px; border-radius:6px; position:relative;
    background:transparent;
    display:flex; align-items:center; justify-content:center;
  }
  .story-visual .ring{
    width:220px; height:220px; border-radius:50%; border:2px solid var(--gold);
    display:flex; align-items:center; justify-content:center; opacity:.8;
  }
  .story-visual .ring::before{ content:"T"; font-family:'Playfair Display'; font-style:italic; font-size:4rem; color:var(--gold-light);}
  .story-logo{
    max-width:65%;
    max-height:75%;
    filter:drop-shadow(0 0 30px rgba(201,162,75,0.3));
  }
  .story h2{
    font-family:'Cairo', sans-serif; font-weight:700; font-style:normal; color:var(--gold-light);
    font-size:2.2rem; margin-bottom:24px; line-height:1.6;
  }
  .story p{ color:#c9c2b0; line-height:2; font-weight:300; margin-bottom:16px; }
  .stats{ display:flex; gap:40px; margin-top:34px; }
  .stat b{ display:block; font-family:'Playfair Display'; font-size:1.8rem; color:var(--gold);}
  .stat span{ font-size:.8rem; color:#9c937f; }

  /* NEWSLETTER */
  .newsletter{
    text-align:center; background:linear-gradient(180deg, var(--black), var(--black-2));
    border-top:1px solid var(--line);
  }
  .newsletter h2{ font-family:'Cairo', sans-serif; font-weight:700; font-style:normal; color:var(--gold-light); font-size:2rem; margin-bottom:14px; line-height:1.6;}
  .newsletter p{ color:#a89f8c; margin-bottom:30px; }
  .sub-form{ display:flex; justify-content:center; gap:0; max-width:460px; margin:0 auto; }
  .sub-form input{
    flex:1; padding:16px 20px; background:transparent; border:1px solid var(--line);
    border-left:none; color:var(--cream); font-family:'Cairo'; border-radius:2px 0 0 2px;
  }
  .sub-form button{
    padding:16px 30px; background:var(--gold); color:#160f04; border:none;
    font-weight:700; cursor:pointer; border-radius:0 2px 2px 0;
  }

  footer{
    padding:60px 6% 30px; border-top:1px solid var(--line);
    display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px;
    color:#8f8672; font-size:.88rem;
  }
  footer h5{ color:var(--gold-light); font-family:'Cairo', sans-serif; font-weight:700; margin-bottom:16px; font-size:1.05rem; line-height:1.6;}
  footer ul{ list-style:none; }
  footer li{ margin-bottom:10px; }
  footer a{ color:#8f8672; text-decoration:none; }
  footer a:hover{ color:var(--gold-light); }
  .footer-bottom{
    text-align:center; padding-top:30px; margin-top:30px; border-top:1px solid var(--line);
    grid-column:1/-1; font-size:.8rem; color:#6e674f;
  }

  @media(max-width:900px){
    nav{display:none;}
    .collection-grid{ grid-template-columns:1fr; }
    .product-grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
    .product-card{ padding:18px 12px 16px; }
    .product-thumb{ width:130px; height:130px; margin:0 auto 16px; }
    .story{ grid-template-columns:1fr; padding:40px 26px; }
    footer{ grid-template-columns:1fr 1fr; }
  }

  @media(max-width:420px){
    .product-grid{ grid-template-columns:1fr; max-width:340px; }
  }

  /* ============ MOBILE NAV MECHANISM ============ */
  .hamburger-btn{ display:none; font-size:1.35rem; line-height:1; }
  @media(max-width:900px){
    .hamburger-btn{ display:inline-flex; }
  }
  .mobile-nav-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:199;
    opacity:0; pointer-events:none; transition:opacity .3s ease;
  }
  .mobile-nav-overlay.show{ opacity:1; pointer-events:auto; }
  .mobile-nav{
    position:fixed; top:0; right:0; height:100vh; width:78%; max-width:320px;
    background:var(--black-2); border-left:1px solid var(--line); z-index:200;
    transform:translateX(100%); transition:transform .35s ease;
    padding:100px 30px 30px; overflow-y:auto;
  }
  .mobile-nav.open{ transform:translateX(0); box-shadow:-14px 0 40px rgba(0,0,0,.5); }
  .mobile-nav ul{ list-style:none; display:flex; flex-direction:column; gap:2px; }
  .mobile-nav li{ border-bottom:1px solid var(--line); }
  .mobile-nav a{
    display:block; padding:16px 4px; color:var(--cream); text-decoration:none;
    font-size:1.05rem; letter-spacing:.3px;
  }
  .mobile-nav a:active, .mobile-nav a:hover{ color:var(--gold-light); }

/* ============ SHARED PAGE HEADER (breadcrumb banner) ============ */
.page-banner{
  padding:160px 6% 70px;
  text-align:center;
  background:
    radial-gradient(ellipse at center, rgba(201,162,75,0.07), transparent 60%),
    var(--black);
  border-bottom:1px solid var(--line);
}
.page-banner .eyebrow{ letter-spacing:4px; font-size:.75rem; color:var(--gold); text-transform:uppercase; }
.page-banner h1{
  font-family:'Cairo', sans-serif; font-weight:800; font-style:normal;
  font-size:clamp(2rem,5vw,3.2rem); margin-top:14px;
  background:linear-gradient(120deg, var(--gold-light), var(--gold) 50%, var(--gold-deep));
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  line-height:1.5;
}
.breadcrumb{ margin-top:18px; font-size:.85rem; color:#8f8672; }
.breadcrumb a{ color:#8f8672; text-decoration:none; }
.breadcrumb a:hover{ color:var(--gold-light); }

/* ============ SHOP PAGE ============ */
.shop-layout{
  display:grid; grid-template-columns:260px 1fr; gap:50px;
  max-width:1300px; margin:0 auto; align-items:start;
}
.filters{
  background:var(--black-2); border:1px solid var(--line); border-radius:6px;
  padding:28px 24px; position:sticky; top:100px;
}
.filters h4{
  font-family:'Cairo'; font-weight:700; color:var(--gold-light);
  font-size:1rem; margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid var(--line);
}
.filter-group{ margin-bottom:26px; }
.filter-group h5{ font-size:.85rem; color:var(--gold); letter-spacing:.5px; margin-bottom:12px; }
.filter-option{
  display:flex; align-items:center; gap:10px; margin-bottom:10px;
  font-size:.88rem; color:#cfc7b4; cursor:pointer;
}
.filter-option input{ accent-color:var(--gold); width:15px; height:15px; }
.price-range{ display:flex; align-items:center; gap:10px; }
.price-range input[type=range]{ width:100%; accent-color:var(--gold); }
.color-swatches{ display:flex; gap:10px; flex-wrap:wrap; }
.swatch{
  width:26px; height:26px; border-radius:50%; cursor:pointer; border:2px solid transparent;
  transition:border .2s;
}
.swatch:hover, .swatch.active{ border-color:var(--gold-light); }
.btn-filter-clear{
  width:100%; padding:11px; background:transparent; border:1px solid var(--line);
  color:#9c937f; border-radius:2px; cursor:pointer; font-size:.85rem; margin-top:6px;
}
.btn-filter-clear:hover{ border-color:var(--gold); color:var(--gold-light); }

.shop-toolbar{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:34px; padding-bottom:20px; border-bottom:1px solid var(--line);
  flex-wrap:wrap; gap:14px;
}
.result-count{ color:#9c937f; font-size:.9rem; }
.sort-select{
  background:var(--black-2); color:var(--cream); border:1px solid var(--line);
  padding:10px 16px; border-radius:2px; font-family:'Cairo'; font-size:.88rem; cursor:pointer;
}
.shop-product-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px;
}
.shop-empty-state{
  grid-column:1/-1; display:none; text-align:center;
  padding:70px 20px; border:1px dashed var(--line); border-radius:2px;
}
.shop-empty-title{
  font-family:'Playfair Display'; font-size:1.3rem; color:var(--gold-light); margin-bottom:10px;
}
.shop-empty-sub{
  color:#8f8672; font-size:.9rem; margin-bottom:22px;
}
.shop-empty-state .btn-filter-clear{ width:auto; padding:11px 30px; display:inline-block; }
.pagination{
  display:flex; justify-content:center; gap:10px; margin-top:60px;
}
.pagination a{
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line); color:var(--cream); text-decoration:none; border-radius:2px;
  font-size:.9rem; transition:all .3s;
}
.pagination a.active, .pagination a:hover{ background:var(--gold); color:#160f04; border-color:var(--gold); }

/* ============ PRODUCT DETAIL PAGE ============ */
.product-detail{
  display:grid; grid-template-columns:1fr 1fr; gap:70px;
  max-width:1300px; margin:0 auto;
}
.gallery-main{
  height:480px; border-radius:6px; margin-bottom:16px;
  background:radial-gradient(circle at 35% 30%, var(--gold-light), var(--gold) 40%, #2a2210 100%);
  position:relative; display:flex; align-items:center; justify-content:center;
  box-shadow:inset 0 0 40px rgba(0,0,0,.4);
}
.gallery-main::before{
  content:""; width:230px; height:230px; border-radius:50%;
  background:var(--cream); box-shadow:inset 0 0 20px rgba(0,0,0,.3);
}
.gallery-main::after{
  content:""; position:absolute; width:3px; height:80px; background:#1a1a1a;
  transform:rotate(25deg) translateY(-45px); transform-origin:bottom;
}
.gallery-main.has-photo::before, .gallery-main.has-photo::after{ display:none; }
.gallery-thumbs{ display:flex; gap:14px; }
.gallery-thumbs .thumb{
  width:80px; height:80px; border-radius:6px; cursor:pointer;
  background:radial-gradient(circle at 35% 30%, var(--gold-light), var(--gold) 45%, #2a2210 100%);
  border:2px solid var(--line); transition:border .3s;
  position:relative; overflow:hidden;
}
.gallery-thumbs .thumb.has-photo{ background-size:cover; background-position:center; }
.gallery-thumbs .thumb:hover, .gallery-thumbs .thumb.active{ border-color:var(--gold); }

.product-info .cat-tag{ color:var(--gold); font-size:.85rem; letter-spacing:1px; }
.product-info h1{
  font-family:'Cairo'; font-weight:800; font-size:2.1rem; color:var(--cream); margin:12px 0 14px; line-height:1.5;
}
.rating-row{ display:flex; align-items:center; gap:10px; margin-bottom:20px; }
.stars{ color:var(--gold); letter-spacing:2px; }
.rating-row span{ color:#9c937f; font-size:.85rem; }
.product-info .price-block{
  display:flex; align-items:baseline; gap:14px; margin-bottom:26px;
}
.price-now{ font-size:2rem; color:var(--gold-light); font-weight:700; font-family:'Cairo'; }
.price-old{ font-size:1.1rem; color:#6e674f; text-decoration:line-through; }
.product-desc{ color:#c9c2b0; line-height:2; font-weight:300; margin-bottom:30px; }

.qty-row{ display:flex; align-items:center; gap:20px; margin-bottom:26px; }
.qty-control{
  display:flex; align-items:center; border:1px solid var(--line); border-radius:2px;
}
.qty-control button{
  width:42px; height:44px; background:transparent; border:none; color:var(--gold-light);
  font-size:1.1rem; cursor:pointer;
}
.qty-control input{
  width:46px; text-align:center; background:transparent; border:none; border-inline:1px solid var(--line);
  color:var(--cream); font-family:'Cairo'; font-size:1rem; height:44px;
}
.action-row{ display:flex; gap:14px; margin-bottom:34px; }
.action-row .btn-gold{ flex:1; text-align:center; }
.btn-icon{
  width:52px; height:52px; border:1px solid var(--line); border-radius:2px; background:transparent;
  color:var(--gold-light); font-size:1.2rem; cursor:pointer; transition:all .3s;
}
.btn-icon:hover{ border-color:var(--gold); background:rgba(201,162,75,.1); }

.spec-table{ width:100%; border-collapse:collapse; margin-top:10px; }
.spec-table tr{ border-bottom:1px solid var(--line); }
.spec-table td{ padding:14px 6px; font-size:.9rem; }
.spec-table td:first-child{ color:#9c937f; width:40%; }
.spec-table td:last-child{ color:var(--cream); }

.trust-badges{
  display:flex; gap:26px; margin-top:30px; padding-top:26px; border-top:1px solid var(--line);
  flex-wrap:wrap;
}
.trust-badges .badge-item{ text-align:center; font-size:.78rem; color:#9c937f; max-width:100px; }
.trust-badges .badge-item .ic{ font-size:1.6rem; display:block; margin-bottom:8px; }

.tabs-nav{ display:flex; gap:40px; border-bottom:1px solid var(--line); margin-bottom:34px; }
.tabs-nav button{
  background:none; border:none; color:#9c937f; font-family:'Cairo'; font-size:.95rem;
  padding-bottom:16px; cursor:pointer; position:relative;
}
.tabs-nav button.active{ color:var(--gold-light); }
.tabs-nav button.active::after{
  content:""; position:absolute; bottom:-1px; right:0; left:0; height:2px; background:var(--gold);
}
.review-card{
  background:var(--black-2); border:1px solid var(--line); border-radius:6px;
  padding:22px; margin-bottom:16px;
}
.review-card .rhead{ display:flex; justify-content:space-between; margin-bottom:10px; }
.review-card .rname{ color:var(--gold-light); font-weight:600; }
.review-card .rdate{ color:#6e674f; font-size:.8rem; }
.review-card p{ color:#c9c2b0; font-size:.92rem; line-height:1.8; }
.review-card .rstars{ color:var(--gold); font-size:.85rem; margin-bottom:8px; letter-spacing:2px; }

.review-form-box{
  background:var(--black-2); border:1px solid var(--line); border-radius:6px;
  padding:26px; margin-top:26px; max-width:520px;
}
.review-form-box h4{ font-family:'Playfair Display', serif; color:var(--gold-light); margin-bottom:16px; }
.review-form-box input, .review-form-box textarea{
  width:100%; background:transparent; border:1px solid var(--line); border-radius:2px;
  padding:11px 14px; color:var(--cream); font-family:'Cairo'; margin-bottom:14px; resize:vertical;
}
.review-stars{ display:flex; gap:6px; margin-bottom:16px; font-size:1.5rem; }
.review-stars .star{ color:#4a4636; cursor:pointer; transition:color .15s; }
.review-stars .star.active{ color:var(--gold); }
.review-form-msg{ font-size:.85rem; margin-top:10px; min-height:1.2em; }
.review-form-msg.ok{ color:#8fbf7a; }
.review-form-msg.err{ color:#e05a5a; }

/* ============ CART PAGE ============ */
.cart-layout{
  display:grid; grid-template-columns:1fr 380px; gap:50px;
  max-width:1300px; margin:0 auto; align-items:start;
}
.cart-table{ width:100%; border-collapse:collapse; }
.cart-table th{
  text-align:right; padding:14px 10px; color:var(--gold); font-size:.8rem;
  letter-spacing:.5px; border-bottom:1px solid var(--line); font-weight:600;
}
.cart-table td{ padding:22px 10px; border-bottom:1px solid var(--line); vertical-align:middle; }
.cart-item-info{ display:flex; align-items:center; gap:18px; }
.cart-thumb{
  width:70px; height:70px; border-radius:50%; flex-shrink:0;
  background:radial-gradient(circle at 35% 30%, var(--gold-light), var(--gold) 45%, #2a2210 100%);
}
.cart-item-info .name{ color:var(--cream); font-weight:600; margin-bottom:4px; }
.cart-item-info .variant{ color:#8f8672; font-size:.8rem; }
.cart-price{ color:var(--gold-light); font-weight:600; }
.remove-btn{
  background:none; border:none; color:#8f8672; cursor:pointer; font-size:1.1rem;
  transition:color .3s;
}
.remove-btn:hover{ color:#c95050; }

.summary-card{
  background:var(--black-2); border:1px solid var(--line); border-radius:6px;
  padding:32px 28px; position:sticky; top:100px;
}
.summary-card h3{
  font-family:'Cairo'; font-weight:700; color:var(--gold-light); margin-bottom:24px;
  padding-bottom:16px; border-bottom:1px solid var(--line);
}
.summary-row{ display:flex; justify-content:space-between; margin-bottom:14px; font-size:.92rem; color:#c9c2b0; }
.summary-row.total{
  font-size:1.15rem; color:var(--gold-light); font-weight:700; margin-top:20px;
  padding-top:20px; border-top:1px solid var(--line);
}
.coupon-row{ display:flex; gap:0; margin:22px 0; }
.coupon-row input{
  flex:1; padding:13px 16px; background:transparent; border:1px solid var(--line); border-left:none;
  color:var(--cream); font-family:'Cairo'; border-radius:2px 0 0 2px;
}
.coupon-row button{
  padding:13px 20px; background:transparent; border:1px solid var(--gold); color:var(--gold-light);
  border-radius:0 2px 2px 0; cursor:pointer; font-size:.85rem;
}
.empty-cart{ text-align:center; padding:80px 20px; color:#8f8672; }
.empty-cart .ic{ font-size:3rem; margin-bottom:20px; display:block; }

/* ============ CHECKOUT PAGE ============ */
.checkout-steps{
  display:flex; justify-content:center; gap:0; max-width:600px; margin:0 auto 60px;
}
.checkout-steps .step{
  flex:1; text-align:center; position:relative; padding-bottom:16px; color:#6e674f; font-size:.85rem;
}
.checkout-steps .step .num{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; margin:0 auto 10px;
  font-family:'Cairo'; font-weight:700; color:#9c937f;
}
.checkout-steps .step.active .num{ background:var(--gold); border-color:var(--gold); color:#160f04; }
.checkout-steps .step.active{ color:var(--gold-light); }
.checkout-steps .step::after{
  content:""; position:absolute; top:17px; right:-50%; width:100%; height:1px; background:var(--line); z-index:-1;
}
.checkout-steps .step:last-child::after{ display:none; }

.checkout-layout{
  display:grid; grid-template-columns:1fr 380px; gap:50px;
  max-width:1300px; margin:0 auto; align-items:start;
}
.form-card{
  background:var(--black-2); border:1px solid var(--line); border-radius:6px; padding:34px;
  margin-bottom:26px;
}
.form-card h3{
  font-family:'Cairo'; font-weight:700; color:var(--gold-light); margin-bottom:24px; font-size:1.1rem;
}
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-field{ margin-bottom:20px; }
.form-field.full{ grid-column:1/-1; }
.form-field label{ display:block; font-size:.85rem; color:#9c937f; margin-bottom:8px; }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding:13px 16px; background:transparent; border:1px solid var(--line);
  color:var(--cream); font-family:'Cairo'; border-radius:2px; font-size:.92rem;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{
  outline:none; border-color:var(--gold);
}

.pay-methods{ display:flex; flex-direction:column; gap:14px; }
.pay-method{
  display:flex; align-items:center; gap:16px; padding:18px 20px;
  border:1px solid var(--line); border-radius:4px; cursor:pointer; transition:all .3s;
}
.pay-method:hover, .pay-method.active{ border-color:var(--gold); background:rgba(201,162,75,.06); }
.pay-method input{ accent-color:var(--gold); width:18px; height:18px; }
.pay-method .pm-icon{ font-size:1.4rem; }
.pay-method .pm-info b{ display:block; color:var(--cream); font-size:.95rem; }
.pay-method .pm-info span{ font-size:.78rem; color:#8f8672; }
.pay-details{
  margin-top:10px; padding:18px 20px; background:rgba(201,162,75,.05);
  border-radius:4px; font-size:.85rem; color:#c9c2b0; line-height:1.9; display:none;
}
.pay-details.show{ display:block; }
.upload-box{
  border:1px dashed var(--line); border-radius:4px; padding:24px; text-align:center;
  color:#8f8672; font-size:.85rem; margin-top:14px; cursor:pointer;
}
.upload-box:hover{ border-color:var(--gold); color:var(--gold-light); }

.order-review-item{ display:flex; justify-content:space-between; font-size:.88rem; color:#c9c2b0; margin-bottom:12px; }

@media(max-width:900px){
  .shop-layout, .cart-layout, .checkout-layout{ grid-template-columns:1fr; }
  .product-detail{ grid-template-columns:1fr; }
  .shop-product-grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
  .form-grid{ grid-template-columns:1fr; }
  .cart-table thead{ display:none; }
  .cart-table, .cart-table tbody, .cart-table tr, .cart-table td{ display:block; width:100%; }
  .cart-table tr{ margin-bottom:20px; border-bottom:1px solid var(--line); padding-bottom:16px; }
  .gallery-main{ height:340px; }
}

@media(max-width:420px){
  .shop-product-grid{ grid-template-columns:1fr; }
}

/* ============ INTERACTIVE LAYER (site.js) ============ */
.icon-btn{
  background:none; border:none; color:var(--gold-light); font-size:1.1rem; cursor:pointer;
  padding:0; position:relative; display:inline-flex; align-items:center; font-family:inherit;
}
.icon-count{
  position:absolute; top:-9px; left:-13px; background:var(--gold); color:#160f04;
  font-size:.63rem; font-weight:800; min-width:16px; height:16px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; padding:0 3px; font-family:'Cairo';
}
.wish-icon.active{ color:#e05a5a; }

.search-bar{
  position:fixed; top:86px; right:0; left:0; z-index:99; background:var(--black-2);
  border-bottom:1px solid var(--line); padding:0; max-height:0; overflow:hidden;
  box-shadow:0 12px 24px rgba(0,0,0,.35);
  transition:max-height .35s ease, padding .35s ease;
}
.search-bar.open{ max-height:90px; padding:18px 6%; }
.search-bar-inner{ display:flex; gap:12px; max-width:700px; margin:0 auto; }
.search-bar-inner input{
  flex:1; background:transparent; border:1px solid var(--line); border-radius:2px;
  padding:12px 16px; color:var(--cream); font-family:'Cairo'; font-size:.92rem;
}
.search-bar-inner input:focus{ outline:none; border-color:var(--gold); }
.search-bar-inner button{
  background:var(--gold); color:#160f04; border:none; padding:0 24px; border-radius:2px;
  font-family:'Cairo'; font-weight:700; cursor:pointer; font-size:.88rem;
}

button, a, .icon-btn, .btn, .btn-gold, .btn-icon, .thumb, .product-thumb, .wish-btn, .notify-btn{ touch-action:manipulation; }
.product-card{ position:relative; }
.wish-btn{
  position:absolute; top:14px; left:14px; width:34px; height:34px; border-radius:50%;
  background:rgba(10,10,10,.55); border:1px solid var(--line); color:var(--cream);
  font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:all .25s; z-index:2;
}
.wish-btn:hover{ border-color:var(--gold); }
.wish-btn.active{ color:#e05a5a; border-color:#e05a5a; background:rgba(224,90,90,.12); }

.product-card.out-of-stock .product-thumb{ opacity:.4; filter:grayscale(.6); }
.stock-badge{
  position:absolute; top:14px; right:14px; background:#2a2a2a; color:#c9c2b0;
  font-size:.65rem; padding:4px 10px; border-radius:20px; border:1px solid var(--line); z-index:2;
}
.notify-btn{
  display:block; width:100%; padding:11px; background:transparent; border:1px solid var(--line);
  color:#9c937f; border-radius:2px; font-size:.85rem; cursor:pointer; font-family:'Cairo'; transition:.3s;
}
.notify-btn:hover{ border-color:var(--gold); color:var(--gold-light); }

#toastWrap{ position:fixed; bottom:26px; right:26px; z-index:999; display:flex; flex-direction:column; gap:10px; }
.toast{
  background:var(--black-2); border:1px solid var(--gold); color:var(--cream);
  padding:14px 20px; border-radius:4px; font-size:.85rem; box-shadow:0 10px 30px rgba(0,0,0,.5);
  animation:toastIn .3s ease; max-width:280px;
}
@keyframes toastIn{ from{ opacity:0; transform:translateY(12px);} to{ opacity:1; transform:translateY(0);} }

.gallery-zoom-frame{ overflow:hidden; border-radius:6px; margin-bottom:16px; cursor:zoom-in; position:relative; touch-action:pan-y; }
.gallery-zoom-frame .gallery-main{ margin-bottom:0; transition:transform .15s ease; }
.gallery-zoom-frame.zoomed .gallery-main{ transform:scale(1.9); cursor:zoom-out; }

.gallery-nav-btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:40px; height:40px; border-radius:50%; border:1px solid var(--line);
  background:rgba(10,10,10,.55); color:var(--cream); font-size:1.6rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:all .25s; backdrop-filter:blur(2px);
}
.gallery-nav-btn:hover{ border-color:var(--gold); color:var(--gold-light); background:rgba(10,10,10,.8); }
.gallery-nav-btn.prev{ right:14px; }
.gallery-nav-btn.next{ left:14px; }
.gallery-dots{
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; gap:8px;
}
.gallery-dots .dot{
  width:7px; height:7px; border-radius:50%; background:rgba(245,241,232,.35);
  border:1px solid rgba(245,241,232,.5); cursor:pointer; transition:.25s; padding:0;
}
.gallery-dots .dot.active{ background:var(--gold); border-color:var(--gold); width:20px; border-radius:4px; }

.coupon-msg{ font-size:.78rem; margin-top:6px; }
.coupon-msg.ok{ color:#7fbf7f; }
.coupon-msg.err{ color:#e05a5a; }

.empty-state{ text-align:center; padding:70px 20px; color:#8f8672; }
.empty-state a{ color:var(--gold-light); }

.modal-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.7); z-index:1000;
  display:flex; align-items:center; justify-content:center;
}
.modal-box{
  background:var(--black-2); border:1px solid var(--gold); border-radius:6px;
  padding:28px; max-width:360px; width:90%; text-align:center;
}
.modal-box h4{ font-family:'Playfair Display', serif; color:var(--gold-light); margin-bottom:14px; }
.modal-box input{
  width:100%; background:transparent; border:1px solid var(--line); border-radius:2px;
  padding:11px 14px; color:var(--cream); font-family:'Cairo'; margin-bottom:14px;
}
.modal-box .modal-actions{ display:flex; gap:10px; }
.modal-box .modal-actions button{ flex:1; padding:10px; border-radius:2px; cursor:pointer; font-family:'Cairo'; }
.modal-box .btn-cancel{ background:transparent; border:1px solid var(--line); color:#9c937f; }
.modal-box .btn-confirm{ background:var(--gold); border:none; color:#160f04; font-weight:700; }