:root{
  --bg:#0f1724;--card:#0b1220;--accent:#caa45a;--muted:#9aa3b2;--cream:#f6f2ec;--max:1100px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial;color:var(--cream);
  background:linear-gradient(180deg,#07101a 0%,#0f1724 100%);-webkit-font-smoothing:antialiased;
}
.container{max-width:var(--max);margin:0 auto;padding:18px}
.site-header{position:sticky;top:0;background:rgba(3,6,10,0.45);backdrop-filter:blur(4px);z-index:40}
.header-inner{display:flex;align-items:center;gap:18px}
.brand img{height:42px}
.nav{margin-left:12px;display:flex;gap:12px}
.nav a{color:var(--muted);text-decoration:none;font-weight:600}
.header-right{margin-left:auto;display:flex;gap:10px;align-items:center}
.badge{background:rgba(202,164,90,0.12);color:var(--accent);padding:6px 8px;border-radius:8px;border:none;cursor:pointer}
.cta{background:var(--accent);color:#07101a;padding:8px 12px;border-radius:10px;text-decoration:none;font-weight:700}

/* Hero */
.hero{display:grid;grid-template-columns:1fr 420px;gap:36px;padding:48px 0;align-items:center}
.hero h1{font-family:'Playfair Display',serif;font-size:40px;margin:0;color:var(--cream)}
.hero p{color:var(--muted);margin:12px 0}
.btn-primary{background:var(--accent);color:#07101a;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:700}

/* Grid / Cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:14px;border-radius:14px;color:var(--cream);box-shadow:0 6px 24px rgba(2,6,23,0.6)}
.card img{
  width:100%;
  aspect-ratio: 3/4;   /* keeps all perfume images uniform */
  object-fit: cover;   /* fills space but keeps proportions */
  border-radius:10px;
}
.card h3{margin:10px 0 6px;font-size:18px}
.price{color:var(--accent);font-weight:800}
.btn-buy{margin-top:10px;background:#caa45a;border:0;padding:10px 12px;border-radius:8px;color:#07101a;font-weight:800;cursor:pointer}

/* 🎨 Perfume Links */
.products .card a {
  color: var(--cream);
  text-decoration: none;
  transition: color 0.3s ease;
}
.products .card a:hover {
  color: var(--accent); /* gold accent on hover */
  text-decoration: underline;
}

/* Product */
.product-hero{display:grid;grid-template-columns:420px 1fr;gap:24px}
.media img{width:100%;height:420px;object-fit:cover;border-radius:12px}
.info h1{font-family:'Playfair Display',serif;font-size:28px;margin-bottom:8px}
.notes{display:flex;gap:8px;flex-wrap:wrap}
.note{background:rgba(255,255,255,0.03);padding:6px 8px;border-radius:6px;color:var(--muted);font-size:13px}

/* Utility */
.section{padding:36px 0}
.site-footer{padding:24px 0;background:transparent;color:var(--muted);border-top:1px solid rgba(255,255,255,0.03)}
.whatsapp-fab{position:fixed;left:18px;bottom:18px;background:#25D366;padding:12px;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,0.4);color:#07101a;text-decoration:none}
.breadcrumb{color:var(--muted);font-size:14px;margin-bottom:12px}

/* Responsive */
@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding:28px 0}
  .product-hero{grid-template-columns:1fr}
  .media img{height:auto;max-height:320px;object-fit:contain}
}