:root{
  --bg:#0b0c10;
  --card:#12131a;
  --text:#e9e9ef;
  --muted:#a7a7b3;
  --line:rgba(255,255,255,.12);
  --accent:#7c5cff;
  --accent2:#1dd3b0;
  --shadow: 0 18px 50px rgba(0,0,0,.35);
  --radius: 18px;
}

*{ box-sizing:border-box; }

html, body {
  min-height: 100%;
}

body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color:var(--text);
  min-height: 100vh;
  background:
    radial-gradient(1200px 700px at 15% 10%, rgba(124,92,255,.25), transparent 55%),
    radial-gradient(900px 600px at 85% 20%, rgba(29,211,176,.18), transparent 55%),
    radial-gradient(900px 700px at 40% 90%, rgba(124,92,255,.10), transparent 55%),
    #0b0c10;
}

a{ color:inherit; }

.wrap{
  max-width:1080px;
  margin:0 auto;
  padding:28px 18px 80px;
}

header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.logoLink{
  text-decoration: none;
  color: inherit;
  display: inline-flex;
}

.logoLink:hover{
  text-decoration: none;
}

.logo{
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.logoLink:hover .dot{
  box-shadow: 0 0 0 8px rgba(124,92,255,.18);
}



.dot{
  width:14px;
  height:14px;
  border-radius:50%;
  background: linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow: 0 0 0 6px rgba(124,92,255,.12);
}

nav{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

nav a{
  opacity:.82;
  text-decoration:none;
  border-bottom:1px dashed transparent;
}

nav a:hover{
  opacity:1;
  border-bottom-color:rgba(255,255,255,.35);
}

.hero{
  margin-top:46px;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}

@media (max-width:900px){
  .hero{ grid-template-columns:1fr; }
}

.hero--bg{
  position: relative;
  background:
    linear-gradient(
      rgba(11,12,16,.75),
      rgba(11,12,16,.95)
    ),
    url("./media/bg-nothing.png");

  background-size: cover;
  background-position: center;
  border-radius: 24px;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  background:rgba(255,255,255,.02);
}

h1{
  font-size:46px;
  line-height:1.05;
  margin:16px 0 10px;
}

@media (max-width:520px){
  h1{ font-size:36px; }
}

.lead{
  font-size:18px;
  line-height:1.55;
  color:var(--muted);
  max-width:60ch;
}

.ctaRow{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:18px;
}

.ctaTight{ margin-top:14px; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  text-decoration:none;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  font-weight:700;
}

.btn:hover{
  transform: translateY(-1px);
  background:rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.22);
}

.btn.primary{
  border-color: transparent;
  background: linear-gradient(135deg, rgba(124,92,255,.95), rgba(29,211,176,.85));
  color:#0b0c10;
}

.btn.primary:hover{ filter:brightness(1.03); }

.card{
  background: rgba(18,19,26,.72);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:18px;
  backdrop-filter: blur(10px);
}

.heroCard h3{
  margin:0 0 10px;
  font-size:16px;
  color:var(--muted);
  font-weight:700;
}

.checklist{ margin:0; padding-left:18px; }
.checklist li{ margin:8px 0; }

.muted{ color:var(--muted); }

section{ margin-top:44px; }

.grid3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

@media (max-width:900px){
  .grid3{ grid-template-columns:1fr; }
}

.price{
  font-size:28px;
  font-weight:900;
  margin:6px 0 4px;
}

.sub{
  font-size:14px;
  font-weight:700;
}

.tag{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  color:var(--muted);
  background:rgba(255,255,255,.02);
  font-size:12px;
  font-weight:700;
}

.tierTitle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.tierTitle h3{ margin:0; font-size:18px; }

.features{
  margin:12px 0 0;
  padding-left:18px;
  color:var(--muted);
}

.features li{ margin:8px 0; }

.fine{
  font-size:12px;
  color:rgba(233,233,239,.68);
  line-height:1.5;
}

details{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 14px;
  background:rgba(255,255,255,.02);
}

details + details{ margin-top:10px; }

summary{ cursor:pointer; font-weight:800; }

.answer{
  margin-top:8px;
  line-height:1.7;
}

.footer{
  margin-top:54px;
  padding-top:18px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.kpi{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:12px;
}

.kpi .pill{ font-size:11px; }

.tinyLink{
  color:var(--muted);
  text-decoration:none;
  border-bottom:1px dashed rgba(255,255,255,.25);
}

.tinyLink:hover{ color:var(--text); }

.noteBox{
  margin-top:14px;
  border:1px dashed rgba(255,255,255,.18);
  border-radius:14px;
  padding:12px;
  color:var(--muted);
}

/* Subtle accent border for the middle pricing card */
.cardAccent{
  border-color: rgba(124,92,255,.35);
}

.intro {
  animation: settle 0.8s ease-out forwards;
}

@keyframes settle {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.intro strong {
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.noteBox strong {
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.input{
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.03);
  color: var(--text);
  outline: none;
}
.input::placeholder{ color: rgba(233,233,239,.45); }
.input:focus{
  border-color: rgba(124,92,255,.45);
  box-shadow: 0 0 0 6px rgba(124,92,255,.10);
}

.founderRow{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}
.founderRow .input{
  flex: 1 1 240px;
  min-width: 220px;
}

.foundersHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.foundersList{
  margin: 12px 0 0;
  padding-left: 18px;
}

.founderItem{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.founderItem:last-child{ border-bottom: none; }

.founderMeta{
  font-size: 12px;
  white-space: nowrap;
}

.paypalBox{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
}

/* === PLAN PAGES (Basic / Premium) === */

.planTitle{
  font-size: 42px;
  line-height: 1.1;
  margin: 0 0 6px;
}

@media (max-width:520px){
  .planTitle{
    font-size: 34px;
  }
}

/* zamiast szarego “badziewia” */
.planSubtitle{
  font-size: 18px;
  line-height: 1.6;
  max-width: 42ch;

  color: rgba(233,233,239,.92);
  font-weight: 500;

  /* subtelny akcent */
  background: linear-gradient(
    135deg,
    rgba(124,92,255,.12),
    rgba(29,211,176,.10)
  );
  padding: 10px 14px;
  border-radius: 14px;

  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}

/* cichy link po checkout */
.afterCheckout{
  margin-top: 22px;
  text-align: center;
}

/* żeby PayPal nie wyglądał jak obcy byt */
#paypal-button-container-basic{
  margin-top: 6px;
}

/* === Fancy link (Founder Wall) === */
.fancyLink{
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 10px 14px;
  border-radius: 999px;
  text-decoration: none;

  color: rgba(233,233,239,.92);
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);

  box-shadow: 0 18px 50px rgba(0,0,0,.20);
  transition: transform .12s ease, border-color .12s ease, background .12s ease, opacity .12s ease;
}

.fancyLink:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.05);
}

.fancyLink__icon{
  opacity: .75;
  font-size: 12px;
}

/* === Premium subtitle (posh variant) === */
.planSubtitle--posh{
  color: rgba(233,233,239,.94);

  background: radial-gradient(120% 140% at 20% 10%, rgba(124,92,255,.16), transparent 60%),
              radial-gradient(120% 140% at 80% 40%, rgba(29,211,176,.10), transparent 60%),
              rgba(255,255,255,.02);

  border: 1px solid rgba(255,255,255,.10);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    0 18px 50px rgba(0,0,0,.22);

  letter-spacing: .2px;
}

/* Founder-specific fancy link */
.fancyLink--founder{
  background:
    radial-gradient(120% 140% at 20% 10%, rgba(124,92,255,.22), transparent 60%),
    radial-gradient(120% 140% at 80% 40%, rgba(29,211,176,.18), transparent 60%),
    rgba(255,255,255,.04);

  border-color: rgba(124,92,255,.35);
}

.fancyLink--founder:hover{
  border-color: rgba(124,92,255,.55);
}

/* === Founder Wall link animation (subtle) === */
.fancyLink--reveal{
  position: relative;
  overflow: hidden;

  opacity: 0;
  transform: translateY(6px);
  animation: fwReveal .45s ease forwards;
  animation-delay: .25s;
}

/* soft shimmer */
.fancyLink--reveal::after{
  content: "";
  position: absolute;
  top: -40%;
  left: -60%;
  width: 40%;
  height: 180%;
  transform: rotate(18deg);

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.18),
    transparent
  );

  opacity: .0;
  animation: fwShimmer 4.8s ease-in-out infinite;
  animation-delay: 1.2s;
}

@keyframes fwReveal{
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fwShimmer{
  0%, 70% { opacity: 0; transform: translateX(0) rotate(18deg); }
  78%     { opacity: .35; }
  92%     { opacity: 0; transform: translateX(320%) rotate(18deg); }
  100%    { opacity: 0; transform: translateX(320%) rotate(18deg); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .fancyLink--reveal{
    animation: none;
    opacity: 1;
    transform: none;
  }
  .fancyLink--reveal::after{
    animation: none;
    display: none;
  }
}

/* === Founder Wall (fancy) === */

.fwHero{ margin-top: 10px; }
.fwHeroTop{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap: 12px; flex-wrap: wrap;
}

.fwTitle{
  margin:0;
  font-size: 44px;
  line-height: 1.05;
  letter-spacing: .2px;
}
@media (max-width:520px){ .fwTitle{ font-size: 36px; } }

.fwMeta{ display:flex; gap:10px; flex-wrap:wrap; }
.fwPill{
  display:inline-flex; align-items:center;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  color: rgba(233,233,239,.75);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .25px;
}

.fwLead{
  margin: 10px 0 0;
  color: rgba(233,233,239,.88);
  max-width: 62ch;
  line-height: 1.6;
  font-size: 18px;
}
.fwLeadSmall{
  display:inline-block;
  margin-left: 6px;
  color: rgba(233,233,239,.66);
  font-size: 14px;
}

.fwBanner{
  position: relative;
  margin-top: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}
.fwBanner svg{ display:block; width:100%; height: 180px; }
.fwBannerText{
  position:absolute; inset: 0;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding: 16px;
}
.fwBannerKicker{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.6px;
  color: rgba(233,233,239,.72);
}
.fwBannerBig{
  margin-top: 4px;
  font-size: 18px;
  font-weight: 800;
  color: rgba(233,233,239,.92);
}

.fwActions{
  margin-top: 14px;
  display:flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

/* Founder count card – make it pop */
.fwCountCard{
  position: relative;
  padding: 14px 18px;
  border-radius: 16px;
  background:
    linear-gradient(135deg,
      rgba(124,92,255,.25),
      rgba(29,211,176,.22)
    );
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    0 12px 40px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.15);
  min-width: 120px;
  text-align: center;
}

.fwCountLabel{
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(233,233,239,.7);
}

.fwCountNum{
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
  margin-top: 6px;
  background: linear-gradient(135deg,#fff,#c9c3ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.fwPanelTop{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap: 12px; flex-wrap: wrap;
}
.fwPanelTitle{ margin:0; font-size: 18px; }

.fwPanelControls{
  display:flex; gap: 10px; align-items:center; flex-wrap: wrap;
}
.fwSearch{
  min-width: min(320px, 78vw);
}

.fwList{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
@media (max-width:900px){ .fwList{ grid-template-columns: 1fr; } }

.fwItem{
  position: relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;

  padding: 14px 64px 14px 14px; /* miejsce na badge */
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
}

.fwLeft{ display:flex; gap: 12px; align-items:center; min-width:0; }

.fwName{
  font-weight: 900;
  color: rgba(233,233,239,.92);
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}
.fwSub{
  font-size: 12px;
  color: rgba(233,233,239,.60);
  margin-top: 2px;
}
.fwRank{
  font-size: 12px;
  color: rgba(233,233,239,.65);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 800;
}

.fwEmpty{
  margin-top: 16px;
  text-align:center;
  padding: 18px 10px;
}
.fwEmptyTitle{ font-weight: 950; font-size: 18px; }
.fwEmptyText{ margin-top: 6px; color: rgba(233,233,239,.65); }

/* nicer "fancyLink" works here too (if you use it elsewhere) */

.ring{
  width:36px;
  height:36px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.12);
  border-top-color: rgba(124,92,255,.9);
  animation: spin 1.2s linear infinite;
}

@keyframes spin{
  to{ transform: rotate(360deg); }
}

.nothingLoader--posh{
  gap:16px;
}

.orbit{
  width:40px;
  height:40px;
  border-radius:50%;
  position:relative;
}

.orbit span{
  position:absolute;
  top:50%;
  left:50%;
  width:6px;
  height:6px;
  border-radius:50%;
  background: linear-gradient(135deg,#7c5cff,#1dd3b0);
  transform-origin:-14px 0;
  animation: orbit 1.6s linear infinite;
}

@keyframes orbit{
  to{ transform: rotate(360deg); }
}

/* === FULL CENTER === */
.nothingCenter{
  min-height: 60vh; /* albo 100vh jeśli chcesz full */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* === LOADER === */
.nothingLoader{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  opacity: .9;
}

/* spinner */
.orbit{
  width: 42px;
  height: 42px;
  position: relative;
}

.orbit span{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7c5cff, #1dd3b0);
  transform-origin: -14px 0;
  animation: orbitSpin 1.6s linear infinite;
}

@keyframes orbitSpin{
  to{ transform: rotate(360deg); }
}

/* === ROTATING TEXT === */
.nothingText{
  position: relative;
  height: 18px;
  font-size: 13px;
  letter-spacing: .6px;
  color: rgba(233,233,239,.65);
  text-transform: lowercase;
  overflow: hidden;
}

.nothingText span{
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  animation: textRotate 8s infinite;
}

.nothingText span:nth-child(1){ animation-delay: 0s }
.nothingText span:nth-child(2){ animation-delay: 2s }
.nothingText span:nth-child(3){ animation-delay: 4s }
.nothingText span:nth-child(4){ animation-delay: 6s }

@keyframes textRotate{
  0%   { opacity: 0; transform: translateY(6px); }
  10%  { opacity: 1; transform: translateY(0); }
  40%  { opacity: 1; transform: translateY(0); }
  50%  { opacity: 0; transform: translateY(-6px); }
  100% { opacity: 0; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .orbit span{ animation: none; }
  .nothingText span{
    animation: none;
    opacity: 1;
    position: static;
  }
}

/* === Nothing Loader (namespaced) === */

.nnLoader{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 14px;
  opacity: .92;
}

/* inline = bez wielkiej pustki */
.nnLoader--inline{
  padding: 14px 0;
}

/* center = jak chcesz na środku ekranu */
.nnLoader--center{
  min-height: 60vh;
}

/* spinner */
.nnOrbit{
  width: 42px;
  height: 42px;
  position: relative;
}

.nnOrbit > span{
  position:absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(29,211,176,1));
  transform-origin: -14px 0;
  animation: nnSpin 1.6s linear infinite;
}

@keyframes nnSpin{
  to{ transform: rotate(360deg); }
}

/* rotating text */
.nnText{
  position: relative;
  width: 100%;
  max-width: 320px;
  height: 18px;
  overflow: hidden;

  font-size: 13px;
  line-height: 18px;
  letter-spacing: .6px;
  color: rgba(233,233,239,.70);
  text-transform: lowercase;
  text-align: center;
}

/* IMPORTANT: first line is visible by default */
.nnText > span{
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(6px);
  animation: nnRotate 24s infinite;
}

.nnText > span:nth-child(1){
  opacity: 1;                 /* fallback if animation is blocked */
  transform: translateY(0);
  animation-delay: 0s;
}
.nnText > span:nth-child(2){ animation-delay: 6s; }
.nnText > span:nth-child(3){ animation-delay: 12s; }
.nnText > span:nth-child(4){ animation-delay: 18s; }

@keyframes nnRotate {
  0% {
    opacity: 0;
    transform: translateY(6px);
  }

  10% {
    opacity: 1;
    transform: translateY(0);
  }

  30% {
    opacity: 1;
    transform: translateY(0);
  }

  35% {
    opacity: 0;
    transform: translateY(-6px);
  }

  100% {
    opacity: 0;
    transform: translateY(-6px);
  }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .nnOrbit > span{ animation: none; }
  .nnText{ height: auto; }
  .nnText > span{
    position: static;
    opacity: 1;
    transform: none;
    animation: none;
    display: block;
  }
}

/* ============ Minimal Banner (no SVG) ============ */
.fwBanner{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  padding: 18px 18px;
  min-height: 92px;
}

.fwBanner::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(600px 200px at 15% 40%, rgba(124,92,255,.18), transparent 60%),
    radial-gradient(520px 220px at 85% 35%, rgba(29,211,176,.14), transparent 60%);
  filter: blur(6px);
  opacity: .9;
  pointer-events:none;
}

.fwBanner::after{
  content:"";
  position:absolute;
  left: 18px; right: 18px; bottom: 14px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  opacity: .55;
  pointer-events:none;
}

.fwBannerText{
  position: relative;
  z-index: 1;
}

.fwBannerKicker{
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(233,233,239,.62);
  font-weight: 800;
}

.fwBannerBig{
  margin-top: 6px;
  font-size: 18px;
  font-weight: 900;
  color: rgba(233,233,239,.92);
}

.fwBannerMarks{
  position:absolute;
  right: 16px;
  top: 16px;
  display:flex;
  gap: 8px;
  z-index: 1;
}

.fwMark{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}

.fwMark:first-child{
  background: rgba(124,92,255,.20);
  border-color: rgba(124,92,255,.30);
}
.fwMark:last-child{
  background: rgba(29,211,176,.18);
  border-color: rgba(29,211,176,.28);
}

/* ============ Founder list glow / badge ============ */
.fwItem{
  position: relative; /* needed for badge positioning */
}

.fwItemTop10{
  border-color: rgba(255,255,255,.16);
  background:
    linear-gradient(135deg, rgba(124,92,255,.08), rgba(29,211,176,.06)),
    rgba(255,255,255,.02);
  box-shadow:
    0 10px 30px rgba(0,0,0,.25),
    0 0 0 1px rgba(255,255,255,.04) inset;
}

.fwItemTop10::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(124,92,255,.20), rgba(29,211,176,.16));
  opacity: .18; /* subtle */
  filter: blur(10px);
  pointer-events:none;
  z-index: 0;
}

/* name + badge in one line */
.fwItemName{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

/* inline 1st Founder badge */
.fwBadgeInline{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: 22px;
  padding: 0 10px;
  border-radius: 999px;

  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;

  background: linear-gradient(
    135deg,
    rgba(124,92,255,.35),
    rgba(29,211,176,.30)
  );
  color: #0b0c10;

  white-space: nowrap;
  flex: 0 0 auto;
}

/* ===== Founder Wall list (force visible) ===== */
.fwList{
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 14px;
}

.fwItem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;

  padding: 14px 16px;
  border-radius: 16px;

  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);

  /* jeśli coś Ci wcześniej "ucinało" */
  overflow: visible;
}

.fwLeft{
  display:flex;
  align-items:center;
  min-width:0;
}

.fwRight{
  flex: 0 0 auto;
  display:flex;
  align-items:center;
  gap: 10px;
}

.fwItemNameWrap{
  display:flex;
  align-items:center;
  gap: 10px;
  min-width:0;
}

.fwItemName{
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fwItemMeta{
  color: rgba(233,233,239,.70);
  font-size: 13px;
  white-space: nowrap;
}

/* ===== 1st EVER badge (inline, right after name) ===== */
.fwBadgeInline{
  display:inline-flex;
  align-items:center;
  gap: 6px;

  font-size: 11px;
  font-weight: 900;
  letter-spacing: .02em;

  padding: 5px 10px;
  border-radius: 999px;

  color: rgba(233,233,239,.92);
  border: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(135deg, rgba(124,92,255,.22), rgba(29,211,176,.18));

  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}

/* ===== subtle glow for TOP 10 ===== */
.fwItemTop10{
  border-color: rgba(124,92,255,.22);
  background:
    radial-gradient(900px 300px at 20% 0%, rgba(124,92,255,.10), transparent 60%),
    radial-gradient(900px 300px at 80% 0%, rgba(29,211,176,.08), transparent 60%),
    rgba(255,255,255,.03);
  box-shadow: 0 16px 40px rgba(0,0,0,.25);
}

/* ===== Background cut-off fix (global) ===== */
html, body{
  min-height: 100%;
}

body{
  min-height: 100vh;
  background-attachment: fixed; /* żeby gradient nie "urwał się" na scrollu */
}

.mascot-ambient{
  position: absolute;
  bottom: -80px;
  right: -5px;

  width: 420px;
  max-width: 70vw;

  opacity: 0.08;               /* KLUCZ */
  filter: 
    blur(0.5px)
    saturate(0.6)
    contrast(0.9);

  pointer-events: none;
  user-select: none;

  mix-blend-mode: lighten;     /* albo: screen / soft-light */
}

.tyMascotWrap{
  margin-top: 32px;
  display: flex;
  justify-content: center;
}

.tyMascot{
  width: 160px;
  max-width: 60vw;

  opacity: 0.18;
  filter:
    saturate(0.7)
    contrast(0.95);

  pointer-events: none;
  user-select: none;
}

/* Founder Wall mascot: ambient stamp */
.fwHero{
  position: relative;
  overflow: visible;
}

.fwMascotAmbient{
  position: absolute;
  top: -20px;
  right: -5px;

  width: 360px;
  max-width: 60vw;

  opacity: 0.06;
  filter: saturate(0.5) contrast(0.9) blur(0.6px);
  mix-blend-mode: lighten;

  pointer-events: none;
  user-select: none;
  z-index: 0;
}

/* Keep hero content above */
.fwHero > *{
  position: relative;
  z-index: 1;
}

@media (max-width: 640px){
  .fwMascotAmbient{
    width: 260px;
    right: -10px;
    top: -10px;
    opacity: 0.05;
  }
}