/* ═══════════════════════════════════════════════════════════════════
   Csatlakozási folyamat átdolgozása, B) szakasz (2026-08-27) — az ÚJ
   fejléc/hero/1. lépés/élő-kártya keret, a jóváhagyott
   csatlakozas-atdolgozas.html mockup alapján. Kizárólag a normál
   /csatlakozas útra tölti be a joinWizardTemplateV2.js — az ?entry=eloado
   út a régi wizard.css-t használja változatlanul, ez a fájl azt a
   sablont SOSEM tölti be.

   Minden osztály `.wiz2` alá szkópolt VAGY eleve egyedi nevű (nem
   ütközik a wizard.css `.wiz`-alá szkópolt szabályaival — a 2/4/5/6/7.
   panel ott marad, változatlanul). A `body.wiz.wiz2` a legmagasabb
   specificitású, ez dönti el a világos alap-hátteret a wizard.css sötét
   `.wiz` alapértéke felett.
   ═══════════════════════════════════════════════════════════════════ */
body.wiz.wiz2{
  --w2-page:#eef0f7; --w2-card:#fff; --w2-line:#e2e6ef; --w2-line2:#cdd4e2;
  --w2-ink:#111524; --w2-ink2:#454d63; --w2-muted:#7b8398;
  --w2-teal:#5eead4; --w2-indigo:#8b93f8; --w2-pink:#e879b9;
  --w2-teal-d:#0d9488; --w2-indigo-d:#5b5fd6; --w2-pink-d:#c2418c;
  background:var(--w2-page); color:var(--w2-ink);
}
.wiz2 .wrap{max-width:1080px;margin:0 auto;padding:14px 20px 60px}

/* fejléc-sáv */
.wiz2 .brandbar{max-width:1080px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:14px;height:56px}
.wiz2 .brandbar .logo{display:flex;align-items:center;gap:9px;text-decoration:none}
.wiz2 .brandbar .logo .mark{width:30px;height:30px;border-radius:9px;flex:none;background:linear-gradient(140deg,var(--w2-teal-d),var(--w2-indigo-d) 55%,var(--w2-pink-d));display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:300;line-height:1}
.wiz2 .brandbar .logo .wm{font-size:14.5px;font-weight:730;letter-spacing:-.01em;background:linear-gradient(92deg,var(--w2-teal-d),var(--w2-indigo-d) 50%,var(--w2-pink-d));-webkit-background-clip:text;background-clip:text;color:transparent}
.wiz2 .brandbar .sp{flex:1}
.wiz2 .brandbar .save{font-size:12.4px;color:var(--w2-muted);display:flex;align-items:center;gap:6px}
.wiz2 .brandbar .save i{width:6px;height:6px;border-radius:50%;background:var(--w2-teal-d);display:block}
.wiz2 .brandbar .spons{display:flex;align-items:center;gap:9px;padding-right:14px;margin-right:14px;border-right:1px solid var(--w2-line)}
.wiz2 .brandbar .spons .lb{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#a2aab9;font-weight:700}
.wiz2 .brandbar .spons .lg{height:34px;width:auto;min-width:34px;max-width:108px;flex:none;border-radius:8px;background:#fff;border:1px solid var(--w2-line);display:flex;align-items:center;justify-content:center;padding:3px 8px;overflow:hidden}
.wiz2 .brandbar .spons .lg img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.wiz2 .brandbar .exit{font-size:13px;color:var(--w2-ink2);text-decoration:none;border:1px solid var(--w2-line);background:#fff;border-radius:8px;padding:7px 13px}
.wiz2 .brandbar .exit:hover{border-color:var(--w2-line2);color:var(--w2-ink)}
/* ÉLESBEN TALÁLT HIBA (2026-08-31) — a brandbar (logo + támogató-blokk +
   "automatikusan mentve" + kilépés) egyik eleme sem zsugorodott/tűnt el
   szűk nézetben, a sor együtt szélesebb volt, mint a mobil viewport —
   ez adta a vízszintes túlcsordulást, ami az "ÍGY FOG KINÉZNI" kártyát
   is levágva/kicsúszva jelenítette meg. A támogató-jelzés és az
   automatikus-mentés szöveg vizuálisan másodlagos, mobilon elhagyható. */
@media(max-width:640px){.wiz2 .brandbar .save,.wiz2 .brandbar .spons{display:none}}

/* kilépés-megerősítő */
.wiz2 .exitbox{max-width:1080px;margin:0 auto 12px;padding:0 20px}
.wiz2 .exitin{background:#fff;border:1px solid var(--w2-line);border-radius:12px;padding:15px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 6px 18px rgba(17,21,36,.07)}
.wiz2 .exitin .t{font-size:13.6px;font-weight:620}
.wiz2 .exitin .d{font-size:12.4px;color:var(--w2-muted);margin-top:2px}
/* "Már van fiókod" panel — másodlagos, visszafogott visszaút-link
   (F) utáni javítás, 2026-08-27). */
.wiz2 .w2-link-muted{font-size:12.8px;color:var(--w2-muted);text-decoration:none;border-bottom:1px dotted var(--w2-line2)}
.wiz2 .w2-link-muted:hover{color:var(--w2-ink2)}
.wiz2 .exitin .btns{margin-left:auto;display:flex;gap:8px;flex:none}
.wiz2 .exitin button{font:inherit;font-size:12.8px;font-weight:600;border-radius:8px;padding:8px 14px;cursor:pointer;border:1px solid var(--w2-line2);background:#fff}
.wiz2 .exitin button.pri{background:var(--w2-ink);border-color:var(--w2-ink);color:#fff}

/* hero */
.wiz2 .top{background:linear-gradient(160deg,#141a33,#171130);border-radius:16px 16px 0 0;padding:22px 26px 24px;position:relative;overflow:hidden}
.wiz2 .top:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(500px 210px at 14% -18%,rgba(139,147,248,.28),transparent 62%),radial-gradient(400px 180px at 90% 6%,rgba(94,234,212,.15),transparent 60%)}
.wiz2 .top h1{position:relative;font-size:21px;font-weight:730;color:#f2f4fb;margin:0;letter-spacing:-.02em}
.wiz2 .top .sub{position:relative;font-size:13.4px;color:#a8b1cc;margin:6px 0 0}
.wiz2 .proof{position:relative;display:flex;gap:0;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);flex-wrap:wrap}
.wiz2 .proof .p{padding-right:26px;margin-right:26px;border-right:1px solid rgba(255,255,255,.1)}
.wiz2 .proof .p:last-child{border-right:none;margin-right:0;padding-right:0}
.wiz2 .proof .p b{display:block;font-size:19px;font-weight:730;color:#f0f2fa;line-height:1}
.wiz2 .proof .p span{font-size:11px;color:#7c86a6;margin-top:4px;display:block}
.wiz2 .proof .ev .kick{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:#8ff0d8;background:rgba(94,234,212,.1);border:1px solid rgba(94,234,212,.24);border-radius:999px;padding:3px 9px;margin-bottom:8px}
.wiz2 .proof .ev .cd{display:flex;align-items:baseline;gap:5px}
.wiz2 .proof .ev .cd b{font-size:19px;font-weight:730;background:linear-gradient(92deg,var(--w2-teal),var(--w2-indigo));-webkit-background-clip:text;background-clip:text;color:transparent}
.wiz2 .proof .ev .cd em{font-size:11.5px;color:#8a93af;font-style:normal;font-weight:600}
.wiz2 .proof .ev .nm{font-size:11px;color:#7c86a6;margin-top:4px;display:block}
.wiz2 .proof .ev .nm strong{color:#c2c9df;font-weight:620}

/* progress-sáv — a MEGLÉVŐ #stepdots/#fill/#pct/#proglabel DOM-ot
   (joinWizard.js tölti fel/frissíti, VÁLTOZATLANUL) most sötét hero-
   háttéren, a mockup türkiz-indigó gradiensével jelenítjük meg — a
   régi wizard.css `.wiz .prog/.bar/.sdot` szabályai FUTNAK TOVÁBB
   (ugyanazok az osztályok), csak itt, `.wiz2` alatt felülírva a színek. */
.wiz2 .top .prog{margin-top:16px;position:relative}
.wiz2 .top .prog .row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.wiz2 .top .prog .label{font-size:11px;color:#8b93b0;font-weight:600}
.wiz2 .top .prog .pct{font-size:12px;font-weight:800;background:linear-gradient(92deg,var(--w2-teal),var(--w2-indigo));-webkit-background-clip:text;background-clip:text;color:transparent}
.wiz2 .top .bar{height:6px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.wiz2 .top .bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(92deg,var(--w2-teal),var(--w2-indigo))}
/* 2. kör lokális teszt, 2026-08-28 — a lépés-körök oválissá torzultak:
   a `.steps` flex-sorban a `.sdot`-nak nem volt flex-shrink:0-ja, tehát
   szűk helyen a SZÉLESSÉGE zsugorodott (flex-shrink csak a fő tengelyt,
   itt a width-et érinti), a MAGASSÁGA nem — ebből lett az ovális alak.
   Ugyanez okozta a hero alján a kilógást is: a torzult/hullámzó méretű
   sor magassága nem volt kiszámítható, a `.top` fix padding-bottom-ja
   (18px) nem volt elég a legszélső (aktív, box-shadow-gyűrűs) körnek. */
.wiz2 .top .steps{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px;padding-bottom:3px}
.wiz2 .top .sdot{width:22px;height:22px;flex:none;border-radius:50%;background:rgba(255,255,255,.09);color:#7c86a6;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(255,255,255,.16)}
/* ELVÉGZETT DE HIÁNYOS JAVÍTÁS FOLYTATÁSA (2026-08-28, élesben talált) —
   a flex-shrink:0 nem oldotta meg a "done" (már teljesített) kör
   ovális alakját, mert a valódi ok MÁSHOL volt: a záró képernyő
   ÜNNEPLŐ blokkja UGYANAZT a .done osztálynevet használta
   (.wiz2 .done{padding:8px 0 4px;...}), és mivel a class-szelektor
   CSAK a tokenre illeszkedik, nem a teljes class-attribútumra, ez a
   szabály a <span class="sdot done"> lépéskörre IS lefutott —
   8+4=12px extra függőleges padding lett az oválisság valódi forrása,
   nem a flex-shrink (az is valós hiba volt, de önmagában nem
   magyarázta a teljes tünetet). Javítva: a záró képernyő blokkja
   átnevezve .donehero-ra, a névütközés megszűnt. */
.wiz2 .top .sdot.done{color:var(--w2-teal);border-color:var(--w2-teal)}
.wiz2 .top .sdot.cur{border-color:var(--w2-indigo);color:#fff;background:linear-gradient(92deg,var(--w2-teal-d),var(--w2-indigo-d));box-shadow:0 0 0 3px rgba(139,147,248,.25)}

/* fő test — világos kártya, a régi .wiz .panel-ok is ide, ALÁ kerülnek,
   amíg a C)/D)/E) be nem illeszti őket a keretbe */
.wiz2 .body{background:var(--w2-card);border:1px solid var(--w2-line);border-top:none;border-radius:0 0 16px 16px;padding:24px 26px 22px}
.wiz2 .split{display:grid;grid-template-columns:1fr 300px;gap:26px;align-items:start}
@media(max-width:900px){.wiz2 .split{grid-template-columns:1fr}.wiz2 .split>*{min-width:0}}
/* ÉLESBEN TALÁLT HIBA (2026-08-31) — a fenti mobil-override itt állt
   régebben a .pane/.fields szabályaival együtt, de mivel az AZONOS
   specificitású .wiz2 .pane / .wiz2 .fields alapszabályok (lásd lejjebb)
   FORRÁSSORBAN KÉSŐBB következtek, a cascade szerint AZOK nyertek —
   a mobil nézetben a kártya csendben visszaállt sticky/kétoszlopos
   állapotba, ráúszva az űrlapra. A javítás a mobil-felülírásokat a
   konfliktáló alapszabályok UTÁNRA helyezte át (lásd ott).

/* bevezető doboz */
.wiz2 .why{background:linear-gradient(150deg,#f5f7ff,#fdf4fa);border:1px solid #e2e6f8;border-radius:12px;padding:16px 18px;margin-bottom:20px}
/* RSVP-úton (?event_slug=) az őszinteség-sáv (2026-08-31) — a "bulira
   jelentkeztem, nem szakemberkeresőre" visszajelzés nyomán: explicit
   kimondja, hogy a keresőben megjelenés a tag saját döntése, nem
   automatikus következménye a jelentkezésnek. */
.wiz2 .rsvp-honesty{font-size:12.8px;line-height:1.5;color:var(--w2-ink2);background:#f2f6ff;border:1px solid #dde5fb;border-radius:10px;padding:11px 14px;margin-bottom:16px}

/* Választó-lépés (2026-09-25, mockup jóváhagyva: mockups/csatlakozas-
   valaszto-lepes-mockup.html) — #p-gate, a wizard LEGELSŐ panelje. A két
   opció TUDATOSAN egyenrangú méretű/súlyú (a felhasználó explicit kérése:
   ne az egyik domináljon) — csak a szín/kontraszt különbözteti meg őket,
   a "Már tag vagyok" a sötét, gradiens CTA-stílust kapja (ugyanaz, mint a
   .btn-primary/.gate-event-linkek másutt), a "Még nem vagyok tag" egy
   semleges, kontúros kártya. Ikon TUDATOSAN nincs (felhasználó kérése,
   2026-09-25: nincs bevált ikon-készlet a platformon erre a két
   fogalomra, inkább semmi, mint ad-hoc emoji/SVG). */
.wiz2 .gate-event{font-size:12.5px;color:var(--w2-ink2);background:#f4f5fb;border:1px solid var(--w2-line);border-radius:999px;display:inline-flex;padding:7px 16px;margin:2px 0 22px}
.wiz2 .gate-options{display:flex;gap:14px;margin-top:4px}
@media(max-width:560px){.wiz2 .gate-options{flex-direction:column}}
.wiz2 .gate-opt{flex:1;border-radius:14px;padding:22px 20px;cursor:pointer;text-decoration:none;display:block;text-align:left;border:none;font:inherit;transition:transform .15s}
.wiz2 .gate-opt:hover{transform:translateY(-2px)}
.wiz2 .gate-opt-title{font-size:15px;font-weight:730;margin-bottom:4px}
.wiz2 .gate-opt-desc{font-size:12.5px;line-height:1.45}
.wiz2 .gate-opt.member{background:linear-gradient(150deg,#141a33,#171130)}
.wiz2 .gate-opt.member .gate-opt-title{background:linear-gradient(92deg,var(--w2-teal-d) 10%,var(--w2-indigo-d) 60%,var(--w2-pink-d));-webkit-background-clip:text;background-clip:text;color:transparent}
.wiz2 .gate-opt.member .gate-opt-desc{color:#a8b1cc}
.wiz2 .gate-opt.new{background:#fff;border:1.5px solid var(--w2-line2)}
.wiz2 .gate-opt.new:hover{border-color:var(--w2-indigo-d)}
.wiz2 .gate-opt.new .gate-opt-title{color:var(--w2-ink)}
.wiz2 .gate-opt.new .gate-opt-desc{color:var(--w2-ink2)}
.wiz2 .gate-foot{font-size:12px;color:var(--w2-muted);margin:20px 0 0}
.wiz2 .why h3{font-size:15px;font-weight:690;margin:0 0 13px;color:var(--w2-ink)}
.wiz2 .why-intro{font-size:13px;line-height:1.5;color:var(--w2-ink2);margin:0 0 14px}
.wiz2 .why ol{list-style:none;padding:0;margin:0;counter-reset:w;display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.wiz2 .why ol{grid-template-columns:1fr}}
.wiz2 .why li{counter-increment:w;display:flex;gap:10px;align-items:flex-start}
.wiz2 .why li:before{content:counter(w);width:22px;height:22px;border-radius:7px;flex:none;background:linear-gradient(140deg,var(--w2-teal-d),var(--w2-indigo-d));color:#fff;font-size:11.5px;font-weight:750;display:flex;align-items:center;justify-content:center;margin-top:1px}
.wiz2 .why li .t{font-size:13.2px;font-weight:650;line-height:1.35;color:var(--w2-ink)}
.wiz2 .why li .d{font-size:12.1px;color:var(--w2-muted);margin-top:2px;line-height:1.45}

/* mezők */
.wiz2 .fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}
@media(max-width:900px){.wiz2 .fields{grid-template-columns:1fr}}
.wiz2 .f{display:flex;flex-direction:column;min-width:0}
.wiz2 .f.full{grid-column:1/-1}
.wiz2 .f label{font-size:12.6px;font-weight:620;margin-bottom:6px;color:var(--w2-ink)}
.wiz2 .f label .req{color:var(--w2-pink-d);margin-left:3px}
.wiz2 .f label .opt{color:var(--w2-muted);font-weight:400;margin-left:5px;font-size:11.8px}
.wiz2 .f input{font:inherit;font-size:13.8px;padding:10px 12px;border:1px solid var(--w2-line);border-radius:9px;background:#fbfcfe;color:var(--w2-ink)}
.wiz2 .f input:focus{outline:none;border-color:var(--w2-indigo-d);background:#fff;box-shadow:0 0 0 3px rgba(91,95,214,.1)}
.wiz2 .f .hint{font-size:11.6px;color:var(--w2-muted);margin-top:5px}
/* fotó-feltöltés kiemelt doboza a bal hasábban (2026-08-31) */
.wiz2 .photobox{background:#f7f8fc;border:1px solid var(--w2-line);border-radius:12px;padding:14px 16px}
.wiz2 .photobox .hint{margin-bottom:11px}
.wiz2 .photobox .upbtn{margin-top:0}
/* Mobilon a .pane (élő kártya) a fotó-feltöltéssel EGY blokkban a
   gombsor elé kerül (lásd a .split-nél lévő fő kommentet) — ott már
   redundáns ez a második, mezők közti belépési pont (2026-08-31). */
@media(max-width:900px){.wiz2 .photobox{display:none}}

/* autocomplete-lenyíló (cég + pozíció közös) */
.wiz2 .ac{position:relative}
.wiz2 .ac .list{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:20;background:#fff;border:1px solid var(--w2-line2);border-radius:10px;box-shadow:0 10px 26px rgba(17,21,36,.13);overflow:hidden;max-height:220px;overflow-y:auto}
.wiz2 .ac .list .it{padding:9px 13px;font-size:13.6px;cursor:pointer;display:flex;align-items:center;gap:9px;border-top:1px solid #f2f4f8}
.wiz2 .ac .list .it:first-child{border-top:none}
.wiz2 .ac .list .it:hover,.wiz2 .ac .list .it.on{background:#f4f6fd}
.wiz2 .ac .list .it b{font-weight:700;color:var(--w2-indigo-d)}
.wiz2 .ac .list .it .n{font-size:11.4px;color:var(--w2-muted);margin-left:auto;flex:none}
.wiz2 .ac .list .new{padding:9px 13px;font-size:12.8px;color:var(--w2-muted);border-top:1px solid #eef0f6;background:#fbfcfe;cursor:pointer}
.wiz2 .ac .list .new b{color:var(--w2-ink2)}

/* telefon-mező */
.wiz2 .phone{display:flex;gap:8px}
.wiz2 .phone select{font:inherit;font-size:13.8px;padding:10px 9px;border:1px solid var(--w2-line);border-radius:9px;background:#fbfcfe;flex:none;width:112px;color:var(--w2-ink)}
.wiz2 .phone input{flex:1;min-width:0}

/* jogi elfogadás / hírlevél */
.wiz2 .checkrow{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:13px;color:var(--w2-ink2);cursor:pointer}
.wiz2 .checkrow input{width:16px;height:16px;margin-top:2px;flex:none}
.wiz2 .checkrow a{color:var(--w2-indigo-d);font-weight:700;text-decoration:none}

/* alsó navigáció */
.wiz2 .foot{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:17px;border-top:1px solid #eef0f6}
.wiz2 .foot .back{font-size:13.2px;color:var(--w2-muted);text-decoration:none}
.wiz2 .foot .next{margin-left:auto;font:inherit;font-size:14.2px;font-weight:660;color:#0c1022;border:none;border-radius:999px;padding:11px 28px;cursor:pointer;background:linear-gradient(92deg,var(--w2-teal),var(--w2-indigo) 50%,var(--w2-pink))}
.wiz2 .foot .next:hover{opacity:.92}

/* fotó-feltöltés a kártyán */
.wiz2 .phwrap{position:relative;cursor:default}
.wiz2 .phwrap.draggable{cursor:grab}
.wiz2 .phwrap.draggable:active{cursor:grabbing}
/* F) utáni javítás (2026-08-27) — a natív <img> drag-and-drop (böngésző
   "szellemkép"-húzása) elnyelte a húzás-eseményeket; -webkit-user-drag
   kikapcsolja. touch-action:none KIZÁRÓLAG ezen a kis, fix méretű
   elemen — a lapgörgetést nem érinti, csak azt, hogy a képen INDÍTOTT
   érintés-húzás a sajátunk legyen, ne a böngésző görgetés-felismerője. */
.wiz2 .phwrap img{-webkit-user-drag:none;user-select:none;touch-action:none}
.wiz2 .phwrap .drag{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:3}
.wiz2 .phwrap .drag span{background:rgba(10,14,28,.72);color:#fff;font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:999px}
.wiz2 .phctl{position:absolute;right:7px;top:7px;z-index:4;display:flex;flex-direction:column;gap:4px}
.wiz2 .phctl button{width:26px;height:26px;border-radius:8px;border:none;cursor:pointer;background:rgba(10,14,28,.66);color:#fff;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center}
.wiz2 .phctl button:hover{background:rgba(10,14,28,.85)}
/* Fotó törlése (2. kör lokális teszt, 2026-08-28) — bal felső sarok, a
   jobb felső nagyítás-vezérlőtől (.phctl) külön, hogy ne torlódjanak. */
.wiz2 .phrm{position:absolute;left:7px;top:7px;z-index:4;width:24px;height:24px;flex:none;border-radius:50%;border:none;cursor:pointer;background:rgba(10,14,28,.66);color:#fff;font-size:12px;line-height:1;display:flex;align-items:center;justify-content:center}
.wiz2 .phrm:hover{background:rgba(220,38,38,.85)}
.wiz2 .upbtn{width:100%;font:inherit;font-size:13px;font-weight:620;border:1px solid var(--w2-line2);background:#fff;border-radius:9px;padding:9px;cursor:pointer;margin-top:9px;color:var(--w2-ink)}
.wiz2 .upbtn:hover{border-color:var(--w2-indigo-d);color:var(--w2-indigo-d)}

/* profil-készültség */
.wiz2 .cmpl{margin-top:11px;background:#fbfcfe;border:1px solid var(--w2-line);border-radius:11px;padding:12px 13px}
/* Cég-dedup figyelmeztetés (2026-08-31) */
.wiz2 .adj{background:#fdf8ef;border:1px solid #f3e3c8;border-radius:11px;padding:11px 13px;margin-top:11px;font-size:12.4px;color:var(--w2-ink2);line-height:1.5}
.wiz2 .adj b{color:var(--w2-ink);font-weight:640}
.wiz2 .cmpl .hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}
.wiz2 .cmpl .t{font-size:12.4px;font-weight:640;color:var(--w2-ink)}
.wiz2 .cmpl .pc{font-size:13px;font-weight:730;color:var(--w2-indigo-d)}
.wiz2 .cmpl .bar{height:6px;background:#e8ebf3;border-radius:3px;overflow:hidden}
.wiz2 .cmpl .bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(92deg,var(--w2-teal-d),var(--w2-indigo-d));transition:width .4s}
.wiz2 .cmpl .nx{font-size:11.5px;color:var(--w2-muted);margin-top:8px;line-height:1.45}

/* élő kártya */
.wiz2 .pane{position:sticky;top:18px}
@media(max-width:900px){.wiz2 .pane{position:static;min-width:0}}
.wiz2 .pane .lb{font-size:10.8px;letter-spacing:.1em;text-transform:uppercase;color:var(--w2-muted);font-weight:750;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.wiz2 .pane .lb .live{width:6px;height:6px;border-radius:50%;background:var(--w2-teal-d);animation:w2pulse 2s infinite}
@keyframes w2pulse{0%,100%{opacity:1}50%{opacity:.35}}
.wiz2 .pcard{background:#fff;border:1px solid var(--w2-line);border-radius:14px;overflow:hidden;box-shadow:0 8px 22px rgba(17,21,36,.09)}
.wiz2 .pcard .strip{height:3px;background:#9aa3b5}
.wiz2 .pcard .photo{position:relative;margin:9px 9px 0;border-radius:11px;overflow:hidden;aspect-ratio:4/3;background:#e6e9f1;display:flex;align-items:center;justify-content:center}
.wiz2 .pcard .photo img{width:100%;height:100%;object-fit:cover;object-position:center 15%;display:block}
.wiz2 .pcard .photo .ph{font-size:32px;color:#b6bdcd}
.wiz2 .pcard .bd{padding:11px 12px 12px}
.wiz2 .pcard .nm{font-size:14.5px;font-weight:670;line-height:1.25;color:var(--w2-ink)}
.wiz2 .pcard .rl{font-size:11.8px;color:var(--w2-ink2);margin-top:3px;line-height:1.4;min-height:33px}
.wiz2 .pcard .rl.empty{color:#c2c8d6;font-style:italic}
.wiz2 .pcard .co{display:flex;align-items:center;gap:7px;margin-top:9px;padding-top:9px;border-top:1px solid #eef0f6}
.wiz2 .pcard .co .lg{width:17px;height:17px;border-radius:4px;flex:none;background:#f3f5f9;border:1px solid var(--w2-line)}
.wiz2 .pcard .co .cn{font-size:11.6px;color:var(--w2-ink2);font-weight:560}
.wiz2 .pcard .co .cn.empty{color:#c2c8d6;font-weight:400;font-style:italic}
.wiz2 .pcard .tg{display:flex;gap:4px;flex-wrap:wrap;margin-top:9px}
.wiz2 .pcard .tg span{font-size:10.3px;color:var(--w2-ink2);background:#f4f6fa;border:1px solid var(--w2-line);border-radius:5px;padding:2.5px 6px}
.wiz2 .pcard .tg span.empty{background:none;border-style:dashed;color:#c2c8d6}
.wiz2 .pcard .ft{margin-top:9px;padding-top:9px;font-size:10.3px;color:var(--w2-muted);display:flex;align-items:center;gap:6px;border-top:1px solid #eef0f6}
.wiz2 .pcard .ft .bdg{font-size:8.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2.5px 7px;border-radius:999px;color:#fff;background:#9aa3b5}

/* ══ Csatlakozási folyamat átdolgozása, C) szakasz (2026-08-27) —
   2. lépés, "Miben vagy jó?" — a beírómező FELÜL, a kiválasztottak alatta,
   csak azután a TOP 10 leggyakoribb cimke. A `.wiz2 .skin`/`.chosen`/
   `.sklb`/`.sktags` a jóváhagyott mockup elnevezéseit követi. ══ */
.wiz2 .sk{margin-top:6px}
.wiz2 .skin{position:relative;margin-bottom:12px}
.wiz2 .skin input{box-sizing:border-box;width:100%;font:inherit;font-size:14px;padding:11px 40px 11px 38px;border:1.5px solid var(--w2-indigo-d);border-radius:10px;background:#fff;box-shadow:0 0 0 3px rgba(91,95,214,.09);color:var(--w2-ink)}
.wiz2 .skin .ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);opacity:.45}
.wiz2 .skin .cnt{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:11.5px;color:var(--w2-muted)}
.wiz2 .chosen{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:13px;min-height:30px}
.wiz2 .chosen .c{font-size:12.5px;font-weight:600;background:var(--w2-ink);color:#fff;border-radius:999px;padding:5px 9px 5px 12px;display:inline-flex;align-items:center;gap:7px}
.wiz2 .chosen .c i{cursor:pointer;font-style:normal;opacity:.6;font-size:13px}
.wiz2 .chosen .c i:hover{opacity:1}
.wiz2 .chosen .empty{font-size:12.5px;color:#a7aebd;font-style:italic;align-self:center}
.wiz2 .sklb{font-size:11.5px;color:var(--w2-muted);margin-bottom:8px}
.wiz2 .sktags{display:flex;gap:6px;flex-wrap:wrap}
.wiz2 .sktags button{font:inherit;font-size:12.8px;border:1px solid var(--w2-line);background:#fbfcfe;color:var(--w2-ink2);border-radius:999px;padding:6px 12px;cursor:pointer}
.wiz2 .sktags button:hover{border-color:var(--w2-line2);color:var(--w2-ink);background:#fff}
.wiz2 .sktags button.on{background:var(--w2-ink);color:#fff;border-color:var(--w2-ink)}
.wiz2 .sktags button.more{border-style:dashed;color:var(--w2-muted)}
.wiz2 .sktags button.more:hover{border-color:var(--w2-indigo-d);color:var(--w2-indigo-d)}

/* Bemutatkozás mező — a `.wiz .field` mintáját követi, `.wiz2` alatt */
.wiz2 .field{margin-top:16px}
.wiz2 .field label{font-size:12.6px;font-weight:620;margin-bottom:6px;display:block;color:var(--w2-ink)}
.wiz2 .field textarea{width:100%;font:inherit;font-size:13.8px;padding:10px 12px;border:1px solid var(--w2-line);border-radius:9px;background:#fbfcfe;color:var(--w2-ink);resize:vertical}
.wiz2 .field textarea:focus{outline:none;border-color:var(--w2-indigo-d);background:#fff;box-shadow:0 0 0 3px rgba(91,95,214,.1)}
.wiz2 .field .hint{font-size:11.6px;color:var(--w2-muted);margin-top:5px}

/* ══ Csatlakozási folyamat átdolgozása, D) szakasz (2026-08-27) —
   3. lépés, "Tagsági szint". A csík/jelvény-színek PONTOSAN a
   szakemberkereső-kártyák (`szakemberek.css` `.pcard.pro/.basic/.beg`)
   színei — ugyanaz a vizuális nyelv, nem újratalált paletta. ══ */
.wiz2 .comingsoon-banner{background:linear-gradient(150deg,#fff8ec,#fef4e6);border:1px solid #f3dfb8;border-radius:12px;padding:14px 16px;margin-bottom:16px;font-size:13px;color:#7a5a1e;line-height:1.55}
.wiz2 .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:6px}
@media(max-width:900px){.wiz2 .tiers{grid-template-columns:1fr}}
.wiz2 .tier{position:relative;background:#fff;border:1.5px solid var(--w2-line);border-radius:15px;padding:0;overflow:hidden;display:flex;flex-direction:column}
.wiz2 .tier.coming-soon{opacity:.72}
.wiz2 .tier .cap{height:4px}
.wiz2 .tier.t-beg .cap{background:#9aa3b5;opacity:.4}
.wiz2 .tier.t-bas .cap{background:#2563eb}
.wiz2 .tier.t-pro .cap{background:linear-gradient(90deg,#22d3ee 0%,#a78bfa 55%,#ec4899 100%)}
.wiz2 .tier .in{padding:18px 18px 16px;display:flex;flex-direction:column;flex:1}
.wiz2 .tier .nm{font-size:17px;font-weight:720;letter-spacing:-.01em;color:var(--w2-ink)}
.wiz2 .tier .pr{font-size:24px;font-weight:740;margin-top:9px;letter-spacing:-.02em;color:var(--w2-ink)}
.wiz2 .tier .pr small{font-size:13px;color:var(--w2-muted);font-weight:600}
.wiz2 .tier .pr.free{color:var(--w2-ink2)}
.wiz2 .tier .dsc{font-size:12.8px;color:var(--w2-ink2);margin-top:9px;line-height:1.5;padding-bottom:13px;border-bottom:1px solid #eef0f6}
.wiz2 .tier ul{list-style:none;padding:0;margin:13px 0 0;display:flex;flex-direction:column;gap:8px;flex:1}
.wiz2 .tier li{font-size:12.6px;color:var(--w2-ink2);display:flex;gap:8px;line-height:1.45}
.wiz2 .tier li i{color:#0d9488;font-style:normal;flex:none;font-weight:700}
.wiz2 .tier li.no{color:#b0b7c6}
.wiz2 .tier li.no i{color:#d4d9e3}
.wiz2 .tier .cnt{font-size:11.8px;color:var(--w2-muted);margin-top:12px;padding-top:11px;border-top:1px solid #eef0f6;display:flex;align-items:center;gap:7px}
.wiz2 .tier .cnt b{color:var(--w2-ink2);font-weight:680}
.wiz2 .tier .cnt .av{display:flex;flex:none}
.wiz2 .tier .cnt .av img{width:18px;height:18px;border-radius:50%;border:2px solid #fff;object-fit:cover;margin-left:-6px;display:block}
.wiz2 .tier .cnt .av img:first-child{margin-left:0}
.wiz2 .tier .sel{margin-top:13px;font:inherit;font-size:13.4px;font-weight:640;border-radius:9px;padding:10px;border:1px solid var(--w2-line2);background:#fff;cursor:pointer;color:var(--w2-ink)}
.wiz2 .tier.t-beg .sel{background:var(--w2-ink);border-color:var(--w2-ink);color:#fff}
.wiz2 .tier.t-pro .sel:not(:disabled){background:linear-gradient(90deg,#22d3ee 0%,#a78bfa 55%,#ec4899 100%);border:none;color:#0c1022}
.wiz2 .tier .sel:disabled{cursor:not-allowed;color:var(--w2-muted);background:#f4f6fa}
.wiz2 .tier .pop{position:absolute;right:12px;top:12px;font-size:9px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;background:var(--w2-ink);color:#fff;padding:3px 9px;border-radius:999px}
.wiz2 .tier .pop.soon{background:#c2860f}
.wiz2 .tier .notify{display:flex;gap:8px;align-items:flex-start;margin-top:11px;font-size:11.8px;color:var(--w2-ink2);cursor:pointer}
.wiz2 .tier .notify input{width:14px;height:14px;margin-top:2px;flex:none}
.wiz2 .tier .notify .ok{color:#0d9488;font-weight:650}
.wiz2 .tierfoot{font-size:12.6px;color:var(--w2-muted);text-align:center;margin:16px 0 0}

/* ══ Csatlakozási folyamat átdolgozása, E) szakasz (2026-08-27) — záró
   képernyő: konfetti + "Ez mostantól a tiéd" + "Amivel még teljesebb
   lesz" + "Amit elfogadtál". ══ */
.wiz2 .donehero{text-align:center;padding:8px 0 4px;position:relative;overflow:hidden}
.wiz2 .confetti-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.wiz2 .confetti-layer i{position:absolute;top:-20px;width:8px;height:12px;border-radius:2px;opacity:0}
.wiz2 .confetti-layer i.show{animation:w2fall 3.2s linear forwards}
@keyframes w2fall{0%{transform:translateY(-30px) rotate(0);opacity:0}10%{opacity:.9}100%{transform:translateY(420px) rotate(420deg);opacity:0}}
.wiz2 .donehero .ic{width:60px;height:60px;border-radius:18px;margin:0 auto 14px;background:linear-gradient(140deg,#0d9488,#5b4fc4 55%,#c2418c);display:flex;align-items:center;justify-content:center;font-size:28px;position:relative;z-index:2}
.wiz2 .donehero h1{font-size:23px;font-weight:730;margin:0;letter-spacing:-.02em;position:relative;z-index:2;color:var(--w2-ink)}
.wiz2 .donehero .lead{font-size:13.8px;color:var(--w2-ink2);margin:8px 0 0;position:relative;z-index:2}
.wiz2 .got,.wiz2 .todo,.wiz2 .legalcard{background:#fbfcfe;border:1px solid var(--w2-line);border-radius:13px;padding:16px 18px;margin-top:16px;text-align:left}
.wiz2 .got h3,.wiz2 .todo h3,.wiz2 .legalcard h3{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--w2-muted);font-weight:750;margin:0 0 12px}
.wiz2 .got .row,.wiz2 .legal-row{display:flex;gap:11px;padding:10px 0;border-top:1px solid #eef0f6;align-items:flex-start}
.wiz2 .got .row:first-child,.wiz2 .legal-row:first-child{border-top:none;padding-top:0}
.wiz2 .got .row .i{width:24px;height:24px;border-radius:8px;flex:none;background:#e7f7f0;color:#046c4e;display:flex;align-items:center;justify-content:center;font-size:12px}
.wiz2 .got .row .t{font-size:13.5px;font-weight:620;color:var(--w2-ink)}
.wiz2 .got .row .d{font-size:12px;color:var(--w2-muted);margin-top:2px;line-height:1.45}
.wiz2 .got .row a{font-size:12.2px;color:var(--w2-indigo-d);text-decoration:none;margin-top:4px;display:inline-block;font-weight:650}
.wiz2 .todo .row{display:flex;gap:10px;padding:8px 0;border-top:1px solid #eef0f6;align-items:center}
.wiz2 .todo .row:first-child{border-top:none;padding-top:0}
.wiz2 .todo .row .i{width:22px;height:22px;border-radius:7px;flex:none;background:#fef4e6;color:#92400e;display:flex;align-items:center;justify-content:center;font-size:11px}
.wiz2 .todo .row .t{font-size:13px;flex:1;color:var(--w2-ink2)}
.wiz2 .todo .row a{font-size:12.2px;color:var(--w2-indigo-d);text-decoration:none;white-space:nowrap;font-weight:650}
.wiz2 .legal-row .t{font-size:13px;color:var(--w2-ink);font-weight:600}
.wiz2 .legal-row .d{font-size:11.8px;color:var(--w2-muted);margin-top:2px}
.wiz2 .legal-row .fix{font-size:11.8px;color:var(--w2-indigo-d);cursor:pointer;text-decoration:underline;margin-left:6px}
.wiz2 .legal-fix-box{display:flex;gap:8px;margin-top:8px}
.wiz2 .legal-fix-box input{flex:1;font:inherit;font-size:13px;padding:7px 10px;border:1px solid var(--w2-line);border-radius:8px}
.wiz2 .legal-fix-box button{font:inherit;font-size:12.5px;font-weight:650;border-radius:8px;padding:7px 12px;border:none;background:var(--w2-ink);color:#fff;cursor:pointer}
.wiz2 .donecta{margin-top:22px}
.wiz2 .donecta a{font-size:14.2px;font-weight:640;text-decoration:none;border-radius:999px;padding:12px 30px;color:#0c1022;background:linear-gradient(92deg,var(--w2-teal),var(--w2-indigo) 50%,var(--w2-pink));display:inline-block}