:root{
  --bg:#0B0B0D;
  --fg:#F2F2F3;
  --muted:#B7B7BB;
  --purple:#7B2CFF;
  --green:#44FF77;
  --card:#101014;
  --border:#1a1a21;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,Helvetica,sans-serif;line-height:1.6}
a{color:var(--purple);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.header{position:sticky;top:0;background:rgba(0,0,0,.6);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--border);z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.nav-left{display:flex;align-items:center;gap:10px}
.brand{display:flex;align-items:center;gap:10px}
.brand-name{font-family:'Creepster', system-ui, sans-serif;font-size:22px;letter-spacing:.5px;color:var(--green)}
.nav ul{list-style:none;display:flex;gap:18px;margin:0;padding:0}
.nav a{color:var(--fg);font-weight:600}
.nav a.menu-link{font-family:'Creepster', system-ui, sans-serif;letter-spacing:.5px;color:var(--green)}
.nav a.brand-name{color:var(--green)}

/* Tip Jar button placement */
.nav-right{ display:flex; align-items:center; gap:12px; }
.nav-right .btn{ margin-right:4px; }        /* keep it snug before the menu */
.mobile-nav .btn{ align-self:flex-start; }  /* full-width-ish on mobile if needed */


.btn{display:inline-block;background:var(--green);color:#000;padding:10px 14px;border-radius:10px;font-weight:800;border:0;box-shadow:0 0 0 0 rgba(68,255,119,.5);transition:transform .08s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-1px);text-decoration:none;box-shadow:0 8px 30px -10px rgba(68,255,119,.5)}
.btn-outline{background:transparent;color:var(--fg);border:1px solid var(--border)}
.hero{padding:32px 0 8px}
.hero-grid{display:grid;gap:24px;grid-template-columns:1fr}
.hero h1{font-family:'Creepster', system-ui, sans-serif;font-size:44px;line-height:1.1;margin:8px 0;color:var(--green)}
.tagline{font-family:'Creepster', system-ui, sans-serif;font-size:20px;color:var(--green)}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.grid{display:grid;gap:16px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.section{padding:24px 0}
.footer{border-top:1px solid var(--border);padding:16px 0 20px;color:var(--muted)}
.badge{display:inline-block;padding:4px 8px;border:1px solid var(--border);border-radius:999px;font-size:12px;color:var(--muted)}
h2,h3{font-family:'Creepster', system-ui, sans-serif;line-height:1.1;color:var(--green)}
h2{font-size:32px;margin:0 0 8px}
h3{font-size:24px;margin:0 0 8px}
.post-card{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.post-card .meta{padding:10px 12px}
.meta .title{font-weight:800}
.meta .date{color:var(--muted);font-size:12px}
.tag-chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}
.chip{padding:6px 10px;border:1px solid var(--border);border-radius:999px;font-size:13px;cursor:pointer}
.chip.active{border-color:var(--green);color:var(--green)}
/* Mobile nav */
.burger{display:none;background:transparent;border:1px solid var(--border);color:var(--fg);border-radius:8px;padding:8px 10px}
.mobile-nav{display:none;flex-direction:column;gap:10px;padding:12px 0}
@media(max-width:900px){
  .grid.cols-3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .grid.cols-3,.grid.cols-2{grid-template-columns:1fr}
  .burger{display:block}
  .nav ul{display:none}
  .mobile-nav{display:none}
  .hero h1{font-size:36px}
}

/* ===== C&C – Mailchimp Footer Form ===== */
.cc-signup{
  --bg:#0B0B0D; --ink:#E9E9EE; --accent:#44FF77; --accent2:#7B2CFF;
  max-width:720px; margin:1.25rem auto .75rem; padding:1.25rem 1rem;
  background:linear-gradient(0deg, rgba(68,255,119,.06), rgba(123,44,255,.06));
  border:1px solid rgba(123,44,255,.25); border-radius:16px; color:var(--ink);
}
.cc-signup h2{ margin:0 0 .75rem; font-size:1.25rem; line-height:1.2; letter-spacing:.3px; }
.cc-signup .indicates-required{ font-size:.85rem; color:#9AA0AC; margin-bottom:.5rem }
.cc-signup .mc-field-group{ margin:.6rem 0 }
.cc-signup label{ display:block; font-size:.9rem; color:#BFC3CF; margin-bottom:.25rem }
.cc-signup input[type="email"], .cc-signup input[type="text"]{
  width:100%; padding:.75rem .85rem; border-radius:10px; border:1px solid #2A2A31;
  background:#101014; color:var(--ink); outline:none;
}
.cc-signup input:focus{ border-color:var(--accent2); box-shadow:0 0 0 3px rgba(123,44,255,.25) }
.cc-signup .button, .cc-signup button[type="submit"], .cc-signup input[type="submit"]{
  display:inline-block; margin-top:.75rem; padding:.75rem 1rem; border:0; border-radius:12px;
  background:linear-gradient(90deg, var(--accent2), var(--accent)); color:#0B0B0D; font-weight:700; cursor:pointer;
}
.cc-signup .button:hover{ filter:brightness(1.05); transform:translateY(-1px) }
.cc-signup .foot{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap }
.cc-signup .refferal_badge{ display:none !important }
.cc-footer-note{ text-align:center; color:#9AA0AC; font-size:.85rem; margin-top:.5rem }

/* ===== Exit Intent Popup (consolidated; keep this and delete older duplicate) ===== */
#exit-popup{
display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:999999;
align-items:center; justify-content:center; padding:1rem;
}
#exit-popup .panel{
width:min(560px, 92vw); background:#101014; color:#E9E9EE;
border:1px solid rgba(123,44,255,.35); border-radius:16px; padding:1.25rem 1rem;
box-shadow:0 10px 40px rgba(0,0,0,.5); position:relative;
}
#exit-popup .close-x{ position:absolute; right:16px; top:8px; background:transparent; border:0; font-size:26px; color:#E9E9EE; cursor:pointer; }
#exit-popup h3{ margin:.25rem 0 .5rem; }
#exit-popup .form{ display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem; }
#exit-popup input[type="email"],
#exit-popup input[type="text"]{
flex:1 1 240px; min-width:240px; padding:.65rem .8rem; border-radius:10px; border:1px solid #2A2A31; background:#141419; color:#E9E9EE;
}
#exit-popup .btn{ padding:.7rem 1rem; border-radius:12px; border:0; background:linear-gradient(90deg,#7B2CFF,#44FF77); color:#0B0B0D; font-weight:700; }
#exit-popup .small{ color:#9AA0AC; font-size:.85rem; margin:.25rem 0 0; }

/* === Tip Jar button fixes === */
.nav-right .btn,
.mobile-nav .btn {
  color: #0B0B0D !important;   /* dark text for legibility */
}

.nav-right .btn:hover,
.mobile-nav .btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

.video-embed {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
  border-radius: 12px;
  margin: 1rem 0;
}

.video-embed iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}