/* Basic font-family using Noto Sans from Google */
:root {
  --accent-gold: #D4AF37;
  --accent-green: #7CFC6B; /* subtle option if needed */
  --card-bg: rgba(255,255,255,0.02);
  --card-border: rgba(255,255,255,0.06);
}

/* ...existing code... */
body { font-family: "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }

/* Navigation link style */
.nav-link {
  color: #e6e6e6;
  opacity: 0.95;
  text-decoration: none;
  transition: color .18s ease, transform .18s ease;
}
.nav-link:hover { color: var(--accent-gold); transform: translateY(-1px); }

/* Card layout */
.card {
  background: linear-gradient(180deg, rgba(255,255,255,0.012), rgba(255,255,255,0.008));
  border: 1px solid var(--card-border);
  padding: 18px;
  border-radius: 12px;
  display: flex;
  align-items: stretch;
  transition: transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s;
  will-change: transform;
  min-height: 160px;
}
.card:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 10px 30px rgba(0,0,0,0.6), 0 0 24px rgba(212,175,55,0.06);
}
.card-content { display:flex; flex-direction:column; justify-content:center; }

/* Buttons */
.action-btn {
  display:inline-block;
  background: linear-gradient(90deg, rgba(212,175,55,0.14), rgba(124,252,107,0.04));
  color: white;
  padding: 10px 14px;
  border-radius: 9px;
  text-decoration: none;
  font-weight:700;
  font-size: 0.92rem;
  border: 1px solid rgba(255,255,255,0.06);
  transition: transform .15s ease, box-shadow .18s ease, background .18s;
}
.action-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.6), 0 0 18px rgba(212,175,55,0.12);
  background: linear-gradient(90deg, rgba(212,175,55,0.22), rgba(124,252,107,0.06));
}

/* subtle glow behind hero logo */
.logo-glow {
  width: 260px;
  height: 260px;
  background: radial-gradient(circle at center, rgba(212,175,55,0.06), rgba(0,0,0,0));
  filter: blur(28px);
  opacity: 0.9;
  transition: transform .6s ease, opacity .6s ease;
}
@media (min-width: 768px) {
  .logo-glow { width: 360px; height: 360px; filter: blur(46px); }
}

/* Responsive tweaks - mobile-first */
@media (max-width: 639px) {
  header { padding-left: 16px; padding-right: 16px; }
  .card { padding: 16px; border-radius: 10px; }
  main h1 { font-size: 1.25rem; }
}

/* Accessibility: focus outlines */
a:focus {
  outline: 3px solid rgba(212,175,55,0.18);
  outline-offset: 3px;
  border-radius: 8px;
}
/* ...existing code... */