/* ============================================================
   CGC premium finishes — scroll reveals, count-ups, nav depth,
   reading progress. Pure progressive enhancement: nothing here
   hides content unless finishes.js is running.
   ============================================================ */

/* scroll reveal (class added by JS only) */
.fx-reveal{opacity:0;transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.2,0,0,1),transform .7s cubic-bezier(.2,0,0,1);
  transition-delay:var(--fx-d,0ms);will-change:opacity,transform;}
.fx-reveal.fx-in{opacity:1;transform:none;}
.fx-instant{transition:none !important;}

/* sticky nav gains depth once the page scrolls */
.nav{transition:box-shadow .3s ease;}
.nav.fx-scrolled{box-shadow:0 8px 28px rgba(11,16,18,.35);}

/* reading progress bar (blog posts) */
.fx-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:90;
  background:linear-gradient(90deg,#FFDE59,#E5C033);pointer-events:none;
  box-shadow:0 0 8px rgba(255,222,89,.5);}

/* gentle lift for buttons — a touch more life on hover */
.btn-primary,.kit-btn,.ct-submit,.feat-cta{transition:transform .18s ease,background .2s,border-color .2s,box-shadow .18s ease;}
.btn-primary:hover,.kit-btn:hover,.ct-submit:hover,.feat-cta:hover{transform:translateY(-1px);}

@media (prefers-reduced-motion: reduce){
  .fx-reveal{opacity:1 !important;transform:none !important;transition:none !important;}
  .fx-progress{display:none;}
}

/* ============================================================
   Mobile navigation (burger + slide-down panel).
   Button and panel are injected by finishes.js from the
   existing .nav-links, so every page gets this for free.
   ============================================================ */
.fx-burger{display:none;}
.fx-mnav{display:none;}
@media(max-width:1023px){
  .fx-burger{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;margin-left:14px;background:none;border:0;cursor:pointer;padding:0;flex:none;}
  .fx-burger span{display:block;width:22px;height:2px;background:#fff;border-radius:1px;transition:transform .25s ease,opacity .2s ease;}
  .fx-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .fx-burger.open span:nth-child(2){opacity:0;}
  .fx-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .fx-mnav{position:fixed;top:72px;left:0;right:0;bottom:0;z-index:49;background:#131B1E;padding:18px 28px 40px;overflow:auto;flex-direction:column;}
  .fx-mnav.open{display:flex;}
  .fx-mnav a{color:#fff;text-decoration:none;font-family:'Inter',system-ui,-apple-system,sans-serif;font-weight:600;font-size:19px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08);}
  .fx-mnav a.active{color:#FFDE59;}
  .fx-mnav .fx-mnav-cta{margin-top:26px;border-bottom:0;display:inline-flex;justify-content:center;align-items:center;height:52px;background:#FFDE59;color:#131B1E;border-radius:2px;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
  body.fx-mnav-open{overflow:hidden;}
}
