/* ============================================================
   VIP Captain — inner content pages (blog, events, gallery,
   my-events). Loaded AFTER vip.css; reuses its variables, fonts,
   page-transition + blob keyframes. Replaces the legacy public.css.
   ============================================================ */

body{
  background:var(--ink); color:var(--cream);
  font-family:var(--sans); -webkit-font-smoothing:antialiased;
}
/* ambient luxury blobs on the plain dark body (pages have no .stage) */
body::before, body::after{
  content:""; position:fixed; border-radius:50%; pointer-events:none; z-index:0;
  filter:blur(90px); opacity:.6; will-change:transform;
}
body::before{ width:60vmax;height:60vmax;left:-16vmax;top:-20vmax;
  background:radial-gradient(circle, rgba(143,180,255,.16), transparent 60%);
  animation:blobDriftA 36s ease-in-out infinite alternate; }
body::after{ width:54vmax;height:54vmax;right:-18vmax;bottom:-14vmax;
  background:radial-gradient(circle, rgba(176,150,255,.13), transparent 60%);
  animation:blobDriftB 48s ease-in-out infinite alternate; }
main, .blog-page, .ev-page, .gal-page, .me-page, nav, footer{ position:relative; z-index:1; }

/* ---------- top nav (reskin of legacy .nav) ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(18px,4vw,52px);
  background:linear-gradient(180deg, rgba(8,9,12,.7), transparent);
}
.nav .brand, .brand{ display:flex; align-items:center; gap:12px; color:var(--cream);
  font-family:var(--display); font-weight:300; letter-spacing:.28em; font-size:16px; text-transform:uppercase; }
.nav .brand .logo, .brand .logo, .logo{ width:34px; height:auto; color:var(--cream); }
.nav a{ color:var(--muted); font-size:13px; letter-spacing:.04em; }
.nav a:hover{ color:var(--cream); }

/* ---------- buttons ---------- */
.btn, .btn-mini{
  display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line);
  background:rgba(255,255,255,.04); color:var(--cream); border-radius:100px;
  padding:11px 22px; font-size:13.5px; font-weight:500; text-decoration:none; cursor:pointer;
  transition:transform .3s var(--ease), background .3s, border-color .3s;
}
.btn-mini{ padding:8px 15px; font-size:12.5px; }
.btn:hover, .btn-mini:hover{ transform:translateY(-1px); background:rgba(255,255,255,.09); }
.btn.primary, .btn.coral{ background:var(--cream); color:#0a0b0d; border-color:transparent; font-weight:600; }
.btn.primary:hover, .btn.coral:hover{ background:#fff; }

/* ---------- shared text ---------- */
.muted{ color:var(--muted); }
.price, .price-tag{ color:var(--cream); font-weight:600; }
.price-tag.free, .free{ color:#4fd693; }
.when, .ev-meta, .article-meta, .gal-deck, .me-deck, .reg-when{ color:var(--muted); font-size:14px; }

/* ---------- page wrappers / hero ---------- */
.blog-page, .ev-page, .gal-page, .me-page{ min-height:100vh; }
.blog-wrap, .ev-wrap, .gal-wrap, .me-wrap{ max-width:1080px; margin:0 auto; padding:120px clamp(18px,5vw,40px) 80px; }
.article-title, .ev-title, .gal-title, .me-title{
  font-family:var(--display); font-weight:200; letter-spacing:-.02em; line-height:1.05;
  font-size:clamp(32px,6vw,60px); margin:0 0 12px;
}
.ev-hero, .gal-deck, .me-deck, .article-excerpt{ color:var(--muted); font-size:clamp(15px,2vw,18px); line-height:1.6; max-width:62ch; }
.blog-back, .gal-back, .cta-back, a.bar{ color:var(--muted); font-size:13px; text-decoration:none; }
.blog-back:hover, .gal-back:hover{ color:var(--cream); }

/* ---------- cards (blog posts, events, registrations) ---------- */
.blog-card, .ev-card, .reg-card, .reg-card-pub, .gal-album{
  display:block; background:var(--glass); border:1px solid var(--line-soft); border-radius:18px;
  overflow:hidden; text-decoration:none; color:inherit; transition:transform .4s var(--ease), border-color .3s;
}
.blog-card:hover, .ev-card:hover, .gal-album:hover{ transform:translateY(-5px); border-color:var(--line); }
.article-cover, .ev-card .cover, .gal-album .cover, .reg-cover{
  aspect-ratio:16/10; background-size:cover; background-position:center; background-color:#0d0f13;
}
.blog-card .body, .ev-card .body, .reg-body, .ev-detail, .ev-desc{ padding:18px 20px; }
.ev-desc{ color:var(--muted); line-height:1.65; }
.ev-tips{ background:rgba(143,180,255,.08); border:1px solid rgba(143,180,255,.25); border-radius:14px; padding:14px 16px; color:var(--cream); }

/* card grids */
.media-grid, .gal-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; margin-top:24px; }
.media-tile{ border-radius:14px; overflow:hidden; border:1px solid var(--line-soft); background:#0d0f13; aspect-ratio:1; cursor:pointer; }
.media-tile img, .media-tile video{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s var(--ease); }
.media-tile:hover img{ transform:scale(1.04); }

/* article body (blog single) */
.article-cover{ border-radius:18px; margin:0 0 26px; }
.article-body{ max-width:72ch; margin:0 auto; line-height:1.8; font-size:16px; color:rgba(243,245,248,.82); }
.article-body h2, .article-body h3{ font-family:var(--display); font-weight:400; color:var(--cream); margin:28px 0 10px; }
.article-body a{ color:var(--gold); }
.article-body img{ border-radius:14px; margin:18px 0; }
.cta, .cta-back{ margin-top:34px; padding:22px; border-radius:18px; background:var(--glass); border:1px solid var(--line); text-align:center; }
.cta-text{ color:var(--muted); }

/* lightbox (gallery) */
.lightbox{ position:fixed; inset:0; z-index:90; background:rgba(6,7,10,.92); display:none; place-items:center; padding:24px; }
.lightbox.open{ display:grid; }
.lightbox img{ max-width:92vw; max-height:88vh; border-radius:12px; }

/* forms (my-events lookup, registration) */
.lookup, .reg-card form{ display:flex; gap:10px; flex-wrap:wrap; }
.reg-card input, .lookup input{ flex:1; min-width:200px; padding:13px 16px; border-radius:12px;
  border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--cream); font-family:inherit; font-size:15px; }
.reg-card input:focus, .lookup input:focus{ outline:none; border-color:rgba(255,255,255,.4); }
.reg-success{ background:rgba(79,214,147,.1); border:1px solid rgba(79,214,147,.35); border-radius:14px; padding:16px 18px; color:#bff3d8; }
.reg-err{ background:rgba(255,111,111,.1); border:1px solid rgba(255,111,111,.35); border-radius:14px; padding:14px 16px; color:#ffd6d2; }

/* footer */
footer{ background:var(--ink); border-top:1px solid var(--line-soft); padding:40px 24px; text-align:center; color:var(--muted); font-size:13px; }
footer a{ color:var(--gold); }

@media (prefers-reduced-motion:reduce){ body::before, body::after{ animation:none !important; } }
@media (max-width:640px){ body::before, body::after{ filter:blur(60px); } }
