/* =====================================================================
   Kódszabó – a bemutatóterem kipróbálható bemutatói
   Ablak (teljes képernyő), tetőtervező (.bt), ügyfélszerző (.bu), Tudáshősök (.bk), 3D galéria (.bg).
   A színpad és az alapelemek a minta.css-ből jönnek.
   ===================================================================== */

/* ---------- Az ablak ---------- */
html.bemutato-nyitva { overflow: hidden; }
.bemutato {
  position: fixed; inset: 0; z-index: 200; overflow: auto; overscroll-behavior: contain;
  background:
    radial-gradient(1000px 600px at 50% -10%, rgba(139, 92, 246, .22), transparent 62%),
    radial-gradient(800px 600px at 100% 70%, rgba(109, 40, 217, .12), transparent 60%),
    #0a0a12;
}
.bemutato-fej {
  position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 16px;
  padding: 10px clamp(12px, 3vw, 40px); background: rgba(13, 11, 27, .92);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--varrat);
}
.bemutato-vissza {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 18px 0 12px; flex: none;
  border-radius: 999px; border: 1px solid var(--varrat); background: var(--szovet); color: var(--kreta); font-weight: 600;
}
.bemutato-vissza:hover { border-color: var(--levendula); background: var(--szovet-2); }
.bemutato-cimek { min-width: 0; margin-right: auto; }
.bemutato-kie { margin: 0; color: var(--levendula); font-size: .85rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bemutato-nev { font-size: clamp(1.1rem, .95rem + .8vw, 1.55rem); }
.bemutato-cimke { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 14px; border-radius: 999px; background: rgba(139, 92, 246, .14); color: var(--levendula-vil); font-size: .9rem; white-space: nowrap; }
.bemutato-cimke .ikon { width: 1.2em; height: 1.2em; }
.bemutato-test { display: flex; flex-direction: column; gap: 16px; width: min(100%, 1500px); margin: 0 auto; padding: 18px clamp(12px, 3vw, 40px) 48px; }
.bemutato-leiras { margin: 0; max-width: 75ch; color: var(--kod); font-size: 1.05rem; }
.bemutato-lab {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding: 20px 24px;
  border-radius: var(--kerek); border: 1px solid var(--varrat); background: linear-gradient(135deg, rgba(124, 58, 237, .2), rgba(21, 17, 42, .92));
}
.bemutato-lab-cim { margin: 0 0 4px; font-family: var(--betu-cim); font-size: 1.15rem; }
.bemutato-lab-szoveg p:last-child { margin: 0; color: var(--kod); }
.bemutato-lab-gombok { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 760px) {
  .bemutato-cimke { display: none; }
  .bemutato-vissza span { display: none; }
  .bemutato-vissza { padding: 0 12px; }
  .bemutato-lab-gombok, .bemutato-lab-gombok .gomb { width: 100%; }
}
.jelzes { z-index: 400; }