/* KSK – Kezdőoldal. Szerkezet és méret; szín csak tokenből. */
#pg-intro{
  align-items:center;justify-content:center;padding:40px 20px;
  background:var(--gradient-intro);
}
.intro-card{
  max-width:660px;width:100%;background:var(--surface-1);
  border:1px solid var(--border-subtle);border-radius:var(--radius-lg);
  padding:48px 52px;box-shadow:var(--shadow-hero);
}
.intro-top-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.intro-top-bar .badge{margin-bottom:0}

.badge{
  display:inline-block;background:var(--accent-soft);color:var(--accent);
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.06em;
  text-transform:uppercase;padding:4px 12px;border-radius:20px;
  border:1px solid var(--accent-border);margin-bottom:22px;
}
.intro-h{font-family:var(--font-display);font-size:1.93rem;font-weight:800;line-height:1.15;margin-bottom:10px}
.intro-h span{color:var(--accent)}
.intro-sub{font-size:1rem;color:var(--text-secondary);line-height:1.7;margin-bottom:28px}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}
.stat{background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:14px;text-align:center}
.stat .n{font-family:var(--font-display);font-size:1.71rem;font-weight:700;color:var(--accent);display:block}
.stat .l{font-size:.79rem;color:var(--text-muted)}

.intro-info{
  background:var(--surface-2);border:1px solid var(--border-subtle);
  border-radius:var(--radius);padding:14px 18px;font-size:.89rem;
  color:var(--text-secondary);line-height:1.7;margin-bottom:28px;
}
.intro-info ul{padding-left:16px;margin-top:6px}
.intro-info li{margin-bottom:3px}

#intro-btn-area{display:flex;flex-direction:column;gap:10px}

/* A kitöltés kapuja: ami az indítógomb HELYÉN áll, amíg nincs bejelentkezve. */
.intro-gate{
  background:var(--surface-2);border:1px solid var(--accent-border);
  border-radius:var(--radius);padding:16px 18px;
}
.intro-gate-t{font-family:var(--font-display);font-weight:700;margin-bottom:6px}
.intro-gate-p{font-size:.89rem;color:var(--text-secondary);line-height:1.65;margin-bottom:14px}
.intro-gate-btns{display:flex;flex-wrap:wrap;gap:10px}

.btn-start{
  width:100%;background:var(--accent);color:var(--text-on-accent);
  font-family:var(--font-display);font-size:1.07rem;font-weight:700;
  padding:15px;border:none;border-radius:var(--radius);
  letter-spacing:.04em;transition:var(--transition);
}
.btn-start:hover{background:var(--accent-hover);transform:translateY(-1px)}

.btn-continue{
  width:100%;background:var(--surface-2);color:var(--accent);
  font-family:var(--font-display);font-size:1rem;font-weight:600;padding:13px;
  border:1px solid var(--accent-border);border-radius:var(--radius);
  letter-spacing:.03em;transition:var(--transition);cursor:pointer;
}
.btn-continue:hover{background:var(--accent-soft);border-color:var(--accent)}
.btn-continue .cont-meta{
  display:block;font-size:.79rem;font-weight:400;color:var(--text-muted);
  font-family:var(--font-body);margin-top:2px;letter-spacing:0;
}

@media (max-width:640px){
  #pg-intro{padding:20px 12px}
  .intro-card{padding:28px 20px}
  .intro-h{font-size:1.6rem}
  .stats{grid-template-columns:1fr;gap:8px}
  .intro-top-bar{flex-direction:column;align-items:flex-start}
}