:root{
  --gold: #d4af37;
  --black: #111;
  --white: #ffffff;
  --muted: #fbfaf9;
  --card-dark: #0f0f10;
}

/* Global reset */
*{box-sizing:border-box;}
body{
  margin:0;
  font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: var(--muted);
  color: var(--black);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Sidebar */
.sidebar{
  width:220px;
  background:var(--black);
  height:100vh;
  position:fixed;
  left:0;
  top:0;
  padding:28px 18px;
  border-right:3px solid var(--gold);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}
.hamburger{
  display:none;
  cursor:pointer;
  color: var(--gold);
  font-size: 22px;
  margin-bottom: 12px;
}
.sidebar-nav{ width:100%; margin-top:6px; display:flex; flex-direction:column; gap:8px; }
.sidebar-nav a{
  color:var(--gold);
  text-decoration:none;
  padding:10px 12px;
  border-radius:8px;
  font-weight:600;
  display:block;
}
.sidebar-nav a:hover{
  background: rgba(212,175,55,0.08);
  transform: translateX(4px);
}

/* Main */
.main{
  margin-left:220px;
  padding:28px;
  width:calc(100% - 220px);
  max-width:1300px;
}

/* Header */
.header-black{
  background:var(--black);
  color:var(--gold);
  padding:34px 20px;
  border-radius:10px;
  border:2px solid var(--gold);
  text-align:center;
  margin-bottom:26px;
}
.header-logo{
  width:160px;
  height:auto;
  display:block;
  margin:0 auto 12px;
  border-radius:8px;
}
.site-title{ font-family:'Playfair Display', serif; margin:6px 0 8px; color:var(--gold); font-size:24px; }
.site-tagline{ color:#f2eede; max-width:820px; margin:0 auto; font-size:15px; }

/* Products */
.products-section{ margin:18px 0 28px; }
.section-title{ text-align:center; font-family:'Playfair Display', serif; color:var(--gold); font-size:22px; margin-bottom:14px; }
.products-wrapper{
  border:2px solid var(--gold);
  padding:18px;
  border-radius:10px;
  background:var(--white);
}
.product-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:20px;
}
.product-card{
  background: var(--card-dark);
  color: #fff;
  border: 2px solid rgba(212,175,55,0.9);
  padding:14px;
  border-radius:10px;
  text-align:center;
  transition: transform .18s ease, box-shadow .18s ease;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
}
.product-card:hover{ transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0,0,0,0.12); }
.product-card img{ width:100%; height:240px; object-fit:cover; border-radius:8px; margin-bottom:12px; }
.product-card h3{ margin:6px 0; font-size:18px; color:var(--white); }
.price{ color:var(--gold); font-weight:700; margin-bottom:10px; }
.btn-buy{
  display:inline-block;
  background:var(--gold);
  color:var(--black);
  padding:10px 14px;
  border-radius:8px;
  text-decoration:none;
  font-weight:700;
  transition: background .16s ease, transform .12s ease;
}
.btn-buy:hover{ background:#b8962e; transform: translateY(-2px); }

/* Contact */
.contact-section{
  margin-top:28px;
  border-radius:10px;
  padding:18px;
  border:2px solid var(--gold);
  background: linear-gradient(180deg, rgba(17,17,17,0.96), rgba(17,17,17,0.96));
  color:#fff;
}
.contact-section h2{ color:var(--gold); text-align:center; margin-bottom:12px; font-family:'Playfair Display', serif; }
.contact-row{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.contact-box{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-radius:8px;
  border:2px solid var(--gold);
  background: rgba(255,255,255,0.02);
  text-decoration:none;
  color:#fff;
  font-weight:700;
}
.contact-box i{ color:var(--gold); font-size:20px; }
.contact-box:hover{ background:var(--gold); color:var(--black); transform:translateY(-3px); }
.map-wrap{ border-radius:8px; overflow:hidden; margin-top:10px; }

/* Responsive */
@media (max-width:1024px){
  .product-card img{ height:220px; }
  .product-grid{ grid-template-columns: repeat(2, 1fr); }
  .header-logo{ width:140px; }
  .main{ padding:20px; }
}
@media (max-width:700px){
  .hamburger{ display:block; }
  .sidebar-nav{ display:none; width:100%; }
  .sidebar-nav.active{ display:flex; flex-direction:column; gap:8px; background:var(--black); padding:10px; border-radius:6px; position:absolute; top:52px; left:0; z-index:999; }
  .sidebar{
    width:100%;
    height:auto;
    position:relative;
    flex-direction:row;
    justify-content:flex-start;
    gap:12px;
    padding:12px;
    border-right:none;
    border-bottom:3px solid var(--gold);
  }
  .main{ margin-left:0; padding:16px; width:100%; }
  .product-grid{ grid-template-columns: 1fr; gap:14px; }
  .header-black{ padding:20px 12px; }
}