* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}
           :root {
 --red: #e63046;
  --dark: #1d1f20;
  --light: #f8f9fa;
   --grey: #6c757d;
    --orange: #292927;
}
body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      line-height: 1.6;
      background: var(--light);
      color: var(--dark);
    }
    .header{
  background: rgba(29,31,32,.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.footer button {
  background: #292927;
  border: none;
  padding: 0.5rem 1rem;
  border-radius: 5px;
  cursor: pointer;
  margin-top: 1rem;
}
/* Social icon buttons */
.social-buttons{
  display:flex;
  gap:.75rem;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  margin-top: .75rem;
}
.footer {
  background: #252729;
  color: white;
  text-align: center;
  padding: 2rem 0%;
  margin-top: 0%;
  margin-bottom: 0%;
}

#fullscreenMenud .button-group{
  display: inline-block;
  gap: 12px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  flex-direction: column;
  flex-wrap: wrap;
   width: 50%;
  margin-left: auto;
  margin-right: auto;
} 
/* Two shop cards above the map */
.shop-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
  gap:14px;
  margin:12px 0 18px;
}
.shop-card{
  background:#fff;
  border:1px solid #eee;
  border-radius:14px;
  padding:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.05);
}
.shop-card.active{ outline:2px solid var(--red); }
.shop-card h3{ margin:0 0 4px; }
.shop-card p{ margin:0 0 10px; color:#555; }
.shop-card .row{ display:flex; gap:10px; flex-wrap:wrap; }

.shop-card button{
  background: var(--red);
  color:#fff;
  border:none;
  border-radius:10px;
  padding:10px 14px;
  cursor:pointer;
}
.shop-card button.secondary{
  background: transparent;
  color: var(--red);
  border:1px solid var(--red);
}
.contact-info address {
  font-style: normal;
}
 .juice-builder {
    padding: 2rem 0;
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
    
  }
    .juice-options button {
      padding: 12px 20px;
      font-size: 1rem;
      border-radius: 8px;
      background: transparent;
      color: rgb(15, 14, 14);
      gap: 10px;
    flex-direction: column;
      cursor: pointer;
      text-align: center;
      align-items: center;
  justify-content: center;
      transition: background 0.3s ease;
    }

    .juice-options button:hover {
      background: darken(var(--orange), 10%);
    }