:root{
  --black:#0a0a0a;
  --green:#2e7d32;
  --deep-green:#094d1f;
  --gold:#d4af37;
  --red:#d43535;
  --cream:#f7f4ec;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:#eee; background:#111;
}
a{color:var(--gold); text-decoration:none}
a:hover{text-decoration:underline}
.topbar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 20px; background:rgba(0,0,0,.9); border-bottom:2px solid var(--red);
}
.brand{display:flex; align-items:center; gap:14px}
.logo{height:52px; width:auto; border:2px solid var(--red); border-radius:6px}
.brand-text .site-title{font-weight:800; letter-spacing:.4px}
.brand-text .site-tag{font-size:.9rem; color:#bbb}
.nav{display:flex; gap:16px; align-items:center; flex-wrap:wrap}
.nav a{padding:8px 10px; border-radius:8px}
.btn{display:inline-block; padding:10px 14px; border-radius:10px; font-weight:700; text-decoration:none}
.btn-gold{background:var(--gold); color:#111}
.btn-red{background:var(--red); color:white}
.btn-green{background:var(--green); color:white}

.hero{
  background:
    linear-gradient(180deg, rgba(0,0,0,.6), rgba(0,0,0,.3)),
    url('assets/banner photo2.jpg') center/cover no-repeat;
  padding:90px 20px; text-align:center; border-bottom:3px solid var(--red);
}
.hero-title{font-family:'Playfair Display', serif; font-size:42px; margin:0 0 8px}
.hero-title span{color:var(--gold)}
.hero-sub{color:#b5ffb5; letter-spacing:2px; text-transform:uppercase; margin:0 0 10px}
.hero-blurb{max-width:780px; margin:0 auto; color:#ddd}

.section{padding:54px 20px; border-top:1px solid rgba(255,255,255,.06)}
.section h2{font-family:'Playfair Display', serif; font-size:32px; color:var(--gold); text-align:center; margin:0 0 24px}
.narrow{max-width:980px; margin:0 auto}
.center{text-align:center}
.intro{color:#ddd;}

.pricing-note{
  margin-top:16px; padding:12px 14px; border:1px dashed var(--gold); background:rgba(212,175,55,.08);
  border-radius:10px; color:#e9e0c9;
}

.cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:18px; max-width:1100px; margin:0 auto}
.card{border-radius:16px; overflow:hidden; border:1px solid rgba(255,255,255,.12)}
.card.gold{background:#1a1407}
.card.onyx{background:#000}
.card.emerald{background:var(--deep-green)}
.card .card-media{height:180px; background-size:cover; background-position:center}
.card .card-body{padding:16px}
.card h3{margin:0 0 10px; color:var(--gold)}

.shakes{display:grid; grid-template-columns: 320px 1fr; gap:20px; align-items:start}
.shakes-photo{width:100%; border-radius:14px; border:2px solid var(--gold)}
.shakes-text p{margin:0 0 12px}

.grid{display:grid; gap:12px}
.grid-3{grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); max-width:1100px; margin:0 auto}
.grid-item img{width:100%; height:220px; object-fit:cover; border-radius:12px}

.ig-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:8px; max-width:1200px; margin:0 auto}
.ig img{width:100%; height:180px; object-fit:cover; border-radius:10px; display:block}

.reviews{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); max-width:1100px; margin:0 auto}
.reviews blockquote{margin:0; background:linear-gradient(135deg, rgba(212,175,55,.18), rgba(0,0,0,.4)); border:1px solid var(--gold); border-radius:14px; padding:18px; color:#f2f2f2}
.reviews footer{margin-top:10px; color:#b0ffb0}

.cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}

.map-frame{max-width:700px; margin:10px auto}
.map-embed iframe{width:100%; height:280px; display:block}
.gold-border{border:3px solid var(--gold); border-radius:14px; box-shadow:0 8px 24px rgba(46,125,50,.45)}

.footer{padding:20px; text-align:center; color:#aaa; border-top:2px solid var(--red); background:#0b0b0b}
.footer a{color:#e9d27a}

@media (max-width:780px){
  .shakes{grid-template-columns:1fr}
}