/* CourseFound header marquee — the nine best-scoring Kajabi sites,
   flowing along the 21st.dev demo path. Light-theme build matching
   the site's paper/pine token system (global.css). */
.cf-band{position:relative;border-bottom:1px solid var(--line);
  padding:.4rem 0 1rem;overflow:hidden;background:
  radial-gradient(90% 120% at 50% 0%, var(--pine-wash) 0%, transparent 55%)}
.cf-band .band-label{position:relative;z-index:30;pointer-events:none;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:.4rem;
  max-width:var(--maxw);margin:0 auto;padding:.4rem 1.5rem 0;
  font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-faint)}
.cf-band .band-label span{background:var(--paper);padding:.28rem .55rem;
  border-radius:var(--radius-sm)}
.cf-band .band-label b{color:var(--pass);font-weight:600}

.mq-wrap{position:relative;width:100%;height:470px;overflow:visible;
  cursor:grab;touch-action:pan-y}
.mq-wrap.is-dragging{cursor:grabbing}
.mq-wrap.is-dragging .badge{pointer-events:none}
.mq{position:relative;width:1040px;height:570px;transform-origin:top left;
  contain:layout style}
.mq svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mq svg path{fill:none;stroke:none}
.mq-item{position:absolute;top:0;left:0;will-change:offset-distance;
  backface-visibility:hidden;
  opacity:0;filter:blur(6px);translate:0 14px;
  transition:opacity .8s var(--ease-out),filter .8s var(--ease-out),
    translate .8s var(--ease-out);
  transition-delay:var(--stagger,0s)}
.mq-item.is-in{opacity:1;filter:blur(0);translate:0 0}

.badge{display:flex;flex-direction:column;align-items:center;gap:.45rem;
  translate:-50% -50%;user-select:none;-webkit-user-drag:none}
.badge-shell,.badge__shell{border-radius:50%;padding:4px;background:var(--paper-raised);
  box-shadow:var(--shadow-card);border:1px solid var(--line);
  transition:transform .45s cubic-bezier(0.32,0.72,0,1)}
.mq-item:hover .badge__shell{transform:scale(1.14)}
.badge__ring{--p:90;width:54px;height:54px;border-radius:50%;padding:3px;
  background:conic-gradient(var(--pass) calc(var(--p)*1%), var(--line) 0)}
.badge__face{width:100%;height:100%;border-radius:50%;display:grid;
  place-items:center;background:var(--paper-raised);overflow:hidden;
  font-family:var(--font-display);font-weight:700;font-size:1.05rem;
  letter-spacing:-.02em;color:var(--pine-deep)}
.badge__face img{width:100%;height:100%;object-fit:cover}
.badge__score{font-family:var(--font-mono);font-size:.62rem;color:var(--pass);
  background:var(--paper-raised);border:1px solid var(--line);
  border-radius:999px;padding:.14rem .5rem;white-space:nowrap;
  opacity:0;translate:0 -4px;
  transition:opacity .3s var(--ease-out),translate .3s var(--ease-out)}
.mq-item:hover .badge__score{opacity:1;translate:0 0}

@media (max-width:760px){
  .mq-item[aria-hidden="true"]{display:none}
}
@media (prefers-reduced-motion:reduce){
  .mq-item{opacity:1;filter:none;translate:0 14px;transition:none}
  .mq-item .badge{translate:-50% -50%}
  .badge__shell,.badge__score{transition:none}
}