:root { --bg:#0e0e10; --card:#17171a; --ink:#eae7dc; --muted:#b8b6ad; --accent:#e0b062; }
* { box-sizing:border-box; }
html,body { margin:0; padding:0; font-family:system-ui, Segoe UI, Arial, sans-serif; color:var(--ink); background:linear-gradient(180deg,#0c0c0f,#141418); }
.wrap { max-width:1100px; margin:0 auto; padding:0 20px; }
.site-header { position:sticky; top:0; background:#0f0f12cc; backdrop-filter:saturate(140%) blur(6px); border-bottom:1px solid #232329; z-index:10; }
.nav-wrap { display:flex; align-items:center; justify-content:space-between; min-height:64px; }
.brand img { height:80px; display:block; }
.nav a { color:var(--ink); text-decoration:none; margin-left:18px; opacity:.9; }
.nav a.active { opacity:1; border-bottom:2px solid var(--accent); padding-bottom:6px; }
.nav .btn.shop { background:var(--accent); color:#1a1105; padding:8px 14px; border-radius:12px; font-weight:600; margin-left:22px; }
main.wrap { padding:24px 20px 60px; }
.hero { display:grid; gap:18px; grid-template-columns:1fr; text-align:center; padding:28px; background:var(--card); border:1px solid #232329; border-radius:18px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.hero h1 { font-size:clamp(28px,5vw,46px); margin:6px 0; letter-spacing:.5px; }
.kicker { color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:1px; }
.lede { color:var(--muted); font-size:1.05rem; }
.grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); margin-top:22px; }
.card { background:var(--card); border:1px solid #232329; border-radius:16px; padding:18px; }
.card h3 { margin:0 0 6px; }
.badge { display:inline-block; padding:4px 10px; border:1px solid #2e2e36; border-radius:999px; color:var(--muted); font-size:.85rem; }
.cta-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:8px; }
.btn { background:#2a2a31; border:1px solid #2f2f37; padding:10px 14px; border-radius:12px; color:var(--ink); text-decoration:none; }
.btn.primary { background:var(--accent); color:#1a1105; border:none; font-weight:700; }
.site-footer { border-top:1px solid #232329; background:#101013; padding:18px 0; color:var(--muted); }
form label { display:block; margin:10px 0 6px; color:var(--muted); }
input[type=text], input[type=email], textarea { width:100%; padding:10px; border-radius:10px; border:1px solid #30303a; background:#121217; color:var(--ink); }
textarea { min-height:150px; }
.alert { padding:10px 12px; border-radius:12px; background:#13281e; border:1px solid #234; color:#b5f1c9; }
.alert.error { background:#2b1515; border-color:#442222; color:#ffbdbd; }
@media (max-width:640px){ .nav a { margin-left:14px; } }
.btn.facebook {
  background:#1877f2;
  color:#fff;
  font-weight:600;
}
.btn.facebook:hover {
  background:#0f5dc0;
}
.btn.facebook i {
  margin-right:8px;
}
.site-footer {
  border-top:1px solid #232329;
  background:#101013;
  padding:20px 0;
  color:var(--muted);
  text-align:center;
}

.site-footer .social-links {
  margin-top:10px;
}

.site-footer .social-links a {
  display:inline-block;
  margin:0 10px;
  font-size:2rem;   /* larger size */
  color:var(--ink);
  opacity:0.85;
  transition:opacity 0.2s ease, transform 0.2s ease;
}


.site-footer .social-links a:hover {
  opacity:1;
  transform:translateY(-2px);
}

.site-footer .social-links a.facebook { color:#1877f2; }
.site-footer .social-links a.instagram { color:#e1306c; }
.site-footer .social-links a.twitter { color:#1da1f2; }