/* ===== PREMIUM HUB & PROJECT STYLES (V3) ===== */

:root {
  --gold: #c9a84c;
  --gold-hover: #dfbc5e;
  --navy-deep: #030812;
  --navy-card: rgba(8, 15, 30, 0.6);
  --glass: rgba(255, 255, 255, 0.03);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-blur: blur(25px);
  --transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ===== HUB PAGE (HOME) ===== */
.hub-main {
  min-height: 100vh; display: flex; flex-direction: column; justify-content: center;
  padding: 80px 5% 40px; gap: 40px;
}
.hub-header { text-align: center; margin-bottom: 20px; }
.hub-header h1 { font-family: 'Playfair Display', serif; font-size: clamp(2rem, 5vw, 3.5rem); margin-bottom: 10px; }

.hub-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px; max-width: 1200px; margin: 0 auto; width: 100%;
}
.project-card {
  position: relative; height: 500px; border-radius: 32px; overflow: hidden;
  border: 1px solid var(--glass-border); transition: var(--transition);
  cursor: pointer; display: flex; align-items: flex-end;
}
.project-card:hover { transform: translateY(-15px) scale(1.02); box-shadow: 0 40px 80px rgba(0,0,0,0.6); }
.card-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  transition: transform 0.8s var(--transition); z-index: -1;
}
.project-card:hover .card-bg { transform: scale(1.1); }
.card-overlay {
  position: absolute; inset: 0; background: linear-gradient(0deg, rgba(3,8,18,0.9) 0%, transparent 60%);
}
.card-content {
  padding: 40px; width: 100%; z-index: 2;
}
.card-content h2 { font-size: 2rem; margin-bottom: 15px; }
.card-content ul { list-style: none; padding: 0; margin-bottom: 25px; opacity: 0.8; font-size: 0.9rem; }
.card-content li { margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }
.card-content li::before { content: "✦"; color: var(--gold); }

/* ===== PROJECT DEEP-DIVE PAGES ===== */
.project-nav {
  position: sticky; top: 0; z-index: 1000;
  background: transparent; backdrop-filter: none;
  transition: var(--transition); border-bottom: 1px solid transparent;
}
.project-nav.scrolled {
  background: var(--navy-deep); backdrop-filter: blur(20px);
  border-bottom-color: var(--glass-border);
}
.project-nav .container {
  display: flex; align-items: center; justify-content: space-between; height: 70px;
}
.project-menu { display: flex; gap: 20px; list-style: none; }
.project-menu a { font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(255,255,255,0.7); transition: 0.3s; }
.project-menu a:hover { color: var(--gold); }

/* Gated Assets (The Bluff) */
.gated-asset {
  position: relative; border-radius: 20px; overflow: hidden;
  cursor: pointer; aspect-ratio: 16/9; margin-top: 20px;
}
.gated-asset img { width: 100%; height: 100%; object-fit: cover; filter: blur(20px); transition: 0.5s; }
.gated-overlay {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; background: rgba(0,0,0,0.4);
}
.gated-icon { font-size: 3rem; margin-bottom: 15px; }

/* Responsive Adjustments */
@media (max-width: 991px) {
  .project-menu { display: none; } /* Use a burger or scrollable list on mobile */
  .hub-main { padding-top: 100px; }
  .project-card { height: 400px; }
}

/* Success State Override for Gated Submission */
.success-message-premium {
  text-align: center; color: var(--accent-teal); font-weight: 700; font-size: 1.1rem;
}