/* ============================================================
   Tudástár – /tudastar
   Minden szabály a .tud-page gyökér alá scope-olva, hogy a site
   header/footer/egyéb CSS-ével SEMMIKÉPP ne ütközzön. A CSS-változók
   is a .tud-page-en élnek (nem :root-on), így nem szivárognak ki.
   Osztály-arculat: KM sötét/arany, Cinzel + Inter (a head.php tölti).
   ============================================================ */

.tud-page{
  --ink:#0B0F14; --ink2:#0e141c;
  --panel:#141c26; --panel2:#1a2430; --panel3:#212d3b;
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.16);
  --txt:#eaeef3; --muted:#a4b0bd; --dim:#7f8b98;
  --gold:#d4a23a; --gold2:#b8892e; --gold-soft:rgba(212,162,58,.14);
  --l1:#63a8cf; --l1-bg:rgba(99,168,207,.12); --l1-line:rgba(99,168,207,.4);
  --l2:#e4695f; --l2-bg:rgba(228,105,95,.12); --l2-line:rgba(228,105,95,.42);
  --l3:#d4a23a; --l3-bg:rgba(212,162,58,.13); --l3-line:rgba(212,162,58,.44);
  --ok:#5cba86; --warn:#e6b93f; --bad:#e4695f;
  --r2:22px;
  --disp:'Cinzel',Georgia,serif;
  --body:'Inter',-apple-system,'Segoe UI',sans-serif;
  color:var(--txt); font-family:var(--body); line-height:1.6;
}
.tud-page *{box-sizing:border-box}
.tud-page{max-width:1080px; margin:0 auto; padding:0 20px 20px}
.tud-page h1,.tud-page h2,.tud-page h3{font-family:var(--disp); font-weight:600; line-height:1.15; margin:0}
.tud-page a{color:inherit}
.tud-page ::selection{background:rgba(212,162,58,.3)}

/* ---- HERO ---- */
.tud-page .hero{padding:44px 0 26px; text-align:center}
.tud-page .kicker{font-family:var(--body); font-weight:600; font-size:12.5px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold); display:inline-flex; align-items:center; gap:10px; margin-bottom:20px}
.tud-page .kicker::before,.tud-page .kicker::after{content:""; width:34px; height:1px; background:linear-gradient(90deg,transparent,var(--gold2))}
.tud-page .kicker::after{background:linear-gradient(90deg,var(--gold2),transparent)}
.tud-page .hero h1{font-size:clamp(2.1rem,5.6vw,3.4rem); letter-spacing:.01em; text-wrap:balance}
.tud-page .hero h1 .em{color:var(--gold); font-style:italic; font-weight:700}
.tud-page .hero .lead{max-width:640px; margin:20px auto 0; color:var(--muted); font-size:clamp(1rem,2.3vw,1.18rem); line-height:1.62}
.tud-page .hero .lead strong{color:var(--txt); font-weight:600}

/* ---- ROADMAP ---- */
.tud-page .roadmap{max-width:720px; margin:28px auto 0; border:1px solid var(--line); border-radius:16px;
  background:var(--panel); padding:16px 20px; text-align:left; display:flex; align-items:center; gap:16px; flex-wrap:wrap}
.tud-page .rm-ico{width:42px; height:42px; border-radius:11px; flex:0 0 auto; background:var(--gold-soft);
  border:1px solid var(--line2); display:grid; place-items:center}
.tud-page .rm-ico svg{width:22px; height:22px; stroke:var(--gold); fill:none; stroke-width:1.7}
.tud-page .rm-txt{flex:1; min-width:200px}
.tud-page .rm-txt b{color:var(--txt); font-weight:600}
.tud-page .rm-txt span{color:var(--muted); font-size:.9rem}
.tud-page .rm-stat{font-family:var(--disp); color:var(--gold); font-weight:700; font-size:1.5rem;
  font-variant-numeric:tabular-nums; white-space:nowrap; text-align:center}
.tud-page .rm-stat small{font-family:var(--body); color:var(--dim); font-size:.72rem; display:block; font-weight:500; letter-spacing:.04em}

/* ---- LEGENDA ---- */
.tud-page .legend{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:6px 0 10px}
.tud-page .leg{border:1px solid var(--line); border-radius:14px; padding:13px 15px; background:var(--panel); position:relative; overflow:hidden}
.tud-page .leg::before{content:""; position:absolute; inset:0 auto 0 0; width:3px}
.tud-page .leg.l1::before{background:var(--l1)} .tud-page .leg.l2::before{background:var(--l2)} .tud-page .leg.l3::before{background:var(--l3)}
.tud-page .leg .tag{display:flex; align-items:center; gap:9px; font-weight:700; font-size:.92rem; margin-bottom:3px; color:var(--txt)}
.tud-page .leg .dot{width:11px; height:11px; border-radius:50%}
.tud-page .leg.l1 .dot{background:var(--l1)} .tud-page .leg.l2 .dot{background:var(--l2)} .tud-page .leg.l3 .dot{background:var(--l3)}
.tud-page .leg p{margin:0; color:var(--muted); font-size:.83rem; line-height:1.4}
@media(max-width:640px){.tud-page .legend{grid-template-columns:1fr; gap:9px}}

/* ---- SZEKCIÓ FEJLÉC ---- */
.tud-page .section-h{display:flex; align-items:baseline; gap:14px; margin:20px 0 6px}
.tud-page .section-h h2{font-size:clamp(1.5rem,3.6vw,2.1rem)}
.tud-page .section-h .n{font-family:var(--disp); color:var(--gold); font-size:1rem; opacity:.7}
.tud-page .section-sub{color:var(--muted); margin:0 0 24px; font-size:.98rem}

/* ---- KATEGÓRIA RÁCS ---- */
.tud-page .cats{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
@media(max-width:820px){.tud-page .cats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.tud-page .cats{grid-template-columns:1fr}}
.tud-page .cat{text-align:left; border:1px solid var(--line); border-radius:var(--r2);
  background:linear-gradient(165deg,var(--panel2),var(--panel)); padding:22px; position:relative; overflow:hidden;
  font-family:inherit; color:inherit; width:100%; display:block; text-decoration:none;
  transition:transform .25s cubic-bezier(.34,1.4,.5,1), border-color .25s, box-shadow .25s}
.tud-page a.cat{cursor:pointer}
.tud-page .cat.terv{opacity:.72}
.tud-page a.cat:hover,.tud-page a.cat:focus-visible{transform:translateY(-5px); border-color:var(--line2);
  box-shadow:0 20px 44px -22px rgba(0,0,0,.8); outline:none}
.tud-page .cat-top{display:flex; align-items:flex-start; gap:14px; margin-bottom:14px}
.tud-page .cat-ico{width:50px; height:50px; border-radius:13px; flex:0 0 auto; display:grid; place-items:center;
  background:var(--gold-soft); border:1px solid var(--line2)}
.tud-page .cat-ico svg{width:27px; height:27px; stroke:var(--gold); fill:none; stroke-width:1.55}
.tud-page .cat.terv .cat-ico{background:var(--panel3)} .tud-page .cat.terv .cat-ico svg{stroke:var(--muted)}
.tud-page .st{margin-left:auto; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:4px 10px; border-radius:99px; white-space:nowrap; display:inline-flex; align-items:center; gap:6px}
.tud-page .st::before{content:""; width:7px; height:7px; border-radius:50%}
.tud-page .st.kesz{color:var(--ok); background:rgba(92,186,134,.13); border:1px solid rgba(92,186,134,.35)} .tud-page .st.kesz::before{background:var(--ok)}
.tud-page .st.epul{color:var(--warn); background:rgba(230,185,63,.12); border:1px solid rgba(230,185,63,.32)} .tud-page .st.epul::before{background:var(--warn)}
.tud-page .st.terv{color:var(--dim); background:var(--panel3); border:1px solid var(--line)} .tud-page .st.terv::before{background:var(--dim)}
.tud-page .cat h3{font-size:1.28rem; margin-bottom:6px}
.tud-page .cat p{margin:0; color:var(--muted); font-size:.92rem; line-height:1.48}
.tud-page .cat-foot{display:flex; align-items:center; gap:8px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line);
  font-size:.85rem; font-weight:600; color:var(--txt)}
.tud-page .cat-foot .cnt{color:var(--muted); font-weight:500}
.tud-page .cat-foot .go{margin-left:auto; display:flex; align-items:center; gap:6px; color:var(--gold)}
.tud-page .cat-foot .go svg{width:15px; height:15px; stroke:var(--gold); fill:none; stroke-width:2; transition:transform .25s}
.tud-page a.cat:hover .go svg{transform:translateX(4px)}

/* ---- BACK + KATEGÓRIA FEJLÉC ---- */
.tud-page .back{display:inline-flex; align-items:center; gap:8px; background:none; border:1px solid var(--line2);
  color:var(--muted); font-family:inherit; font-weight:600; font-size:.88rem; padding:9px 16px; border-radius:99px;
  cursor:pointer; transition:.2s; margin-bottom:22px; text-decoration:none}
.tud-page .back:hover{border-color:var(--line2); color:var(--txt); background:var(--panel)}
.tud-page .back svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2}
.tud-page .cat-head{display:flex; align-items:center; gap:16px; margin-bottom:8px}
.tud-page .cat-head .ch-ico{width:52px; height:52px; border-radius:13px; flex:0 0 auto; display:grid; place-items:center;
  background:var(--gold-soft); border:1px solid var(--line2)}
.tud-page .cat-head .ch-ico svg{width:28px; height:28px; stroke:var(--gold); fill:none; stroke-width:1.55}
.tud-page .cat-head h1{font-size:clamp(1.6rem,4vw,2.2rem)}

/* ---- TÉMA RÁCS ---- */
.tud-page .map{display:grid; grid-template-columns:repeat(2,1fr); gap:18px}
@media(max-width:720px){.tud-page .map{grid-template-columns:1fr}}
.tud-page .node{text-align:left; border:1px solid var(--line); border-radius:var(--r2);
  background:linear-gradient(165deg,var(--panel2),var(--panel)); padding:24px 24px 20px; cursor:pointer;
  position:relative; overflow:hidden; font-family:inherit; color:inherit; width:100%;
  transition:transform .25s cubic-bezier(.34,1.4,.5,1), border-color .25s, box-shadow .25s}
.tud-page .node:hover,.tud-page .node:focus-visible{transform:translateY(-5px); border-color:var(--line2);
  box-shadow:0 20px 44px -22px rgba(0,0,0,.8); outline:none}
.tud-page .node-top{display:flex; align-items:center; gap:16px; margin-bottom:14px}
.tud-page .node-ico{flex:0 0 auto; width:50px; height:50px; border-radius:14px; display:grid; place-items:center;
  background:var(--gold-soft); border:1px solid var(--line2)}
.tud-page .node-ico svg{width:27px; height:27px; stroke:var(--gold); fill:none; stroke-width:1.6}
.tud-page .node-num{font-family:var(--disp); font-size:2.2rem; color:var(--line2); font-weight:700; margin-left:auto; line-height:1}
.tud-page .node h3{font-size:1.26rem; margin-bottom:5px}
.tud-page .node .sub{color:var(--gold); font-size:.8rem; font-weight:600; letter-spacing:.02em; margin-bottom:10px}
.tud-page .node p{margin:0; color:var(--muted); font-size:.93rem; line-height:1.48}
.tud-page .node-foot{display:flex; align-items:center; gap:10px; margin-top:18px; padding-top:15px; border-top:1px solid var(--line)}
.tud-page .node-layers{display:flex; gap:6px}
.tud-page .node-layers span{width:26px; height:5px; border-radius:99px; background:var(--panel3)}
.tud-page .node-layers .a1{background:var(--l1)} .tud-page .node-layers .a2{background:var(--l2)} .tud-page .node-layers .a3{background:var(--l3)}
.tud-page .node-go{margin-left:auto; font-size:.85rem; font-weight:600; color:var(--txt); display:flex; align-items:center; gap:6px}
.tud-page .node-go svg{width:15px; height:15px; stroke:var(--gold); fill:none; stroke-width:2; transition:transform .25s}
.tud-page .node:hover .node-go svg{transform:translateX(4px)}
.tud-page .node.done{border-color:var(--l3-line)}
.tud-page .node .seen{position:absolute; top:16px; right:16px; width:24px; height:24px; border-radius:50%;
  background:var(--ok); display:none; place-items:center; box-shadow:0 0 0 4px rgba(92,186,134,.18)}
.tud-page .node.done .seen{display:grid} .tud-page .node.done .node-num{display:none}
.tud-page .node .seen svg{width:14px; height:14px; stroke:#0B0F14; fill:none; stroke-width:3}

/* ---- ÉPÜL blokk (tervezett témák) ---- */
.tud-page .building{border:1px solid var(--line2); border-radius:var(--r2); overflow:hidden; background:linear-gradient(165deg,var(--panel2),var(--ink2))}
.tud-page .building-body{padding:22px 28px 28px}
.tud-page .building-body .lbl{font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); font-weight:600; margin-bottom:14px}
.tud-page .plan{list-style:none; margin:0; padding:0}
.tud-page .plan li{display:flex; align-items:center; gap:13px; padding:13px 0; border-bottom:1px solid var(--line); color:var(--txt)}
.tud-page .plan li:last-child{border-bottom:none}
.tud-page .plan .pn{width:28px; height:28px; flex:0 0 auto; border-radius:8px; background:var(--panel3); border:1px solid var(--line2);
  display:grid; place-items:center; font-size:.8rem; font-weight:700; color:var(--muted); font-family:var(--disp)}
.tud-page .plan .pt{font-weight:600; font-size:.98rem; display:block}
.tud-page .plan .pd{font-size:.84rem; color:var(--muted); margin-top:1px; display:block}
.tud-page .plan .ptag{margin-left:auto; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:3px 9px; border-radius:99px; color:var(--dim); background:var(--panel3); border:1px solid var(--line)}
.tud-page .building-note{color:var(--muted); font-size:.92rem; margin:16px 0 0}

/* ---- PANEL (modal) ---- */
.tud-page .overlay{position:fixed; inset:0; z-index:4000; background:rgba(6,9,13,.74);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:none; opacity:0; transition:opacity .3s; padding:22px; overflow-y:auto}
.tud-page .overlay.open{display:flex; opacity:1}
.tud-page .panel{margin:auto; width:100%; max-width:760px; background:var(--ink2); border:1px solid var(--line2); border-radius:var(--r2);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.9); overflow:hidden; transform:translateY(24px) scale(.98); transition:transform .35s cubic-bezier(.34,1.3,.5,1)}
.tud-page .overlay.open .panel{transform:none}
.tud-page .panel-head{padding:26px 28px 0; position:relative}
.tud-page .panel-head .p-ico{width:46px; height:46px; border-radius:12px; background:var(--gold-soft); border:1px solid var(--line2); display:grid; place-items:center; margin-bottom:14px}
.tud-page .panel-head .p-ico svg{width:26px; height:26px; stroke:var(--gold); fill:none; stroke-width:1.6}
.tud-page .panel-head h2{font-size:1.7rem; margin-bottom:6px; padding-right:44px}
.tud-page .panel-head .p-sub{color:var(--gold); font-size:.85rem; font-weight:600}
.tud-page .p-close{position:absolute; top:22px; right:22px; width:38px; height:38px; border-radius:10px; border:1px solid var(--line2);
  background:var(--panel2); color:var(--txt); cursor:pointer; display:grid; place-items:center; transition:background .2s,transform .2s}
.tud-page .p-close:hover{background:var(--panel3); transform:rotate(90deg)}
.tud-page .p-close svg{width:18px; height:18px; stroke:currentColor; stroke-width:2; fill:none}
.tud-page .p-article{display:inline-flex; align-items:center; gap:10px; margin-top:15px; padding:11px 15px; border:1px solid var(--line2);
  border-radius:12px; background:var(--panel2); text-decoration:none; color:var(--txt); font-size:.9rem; font-weight:500; transition:.2s}
.tud-page .p-article:hover{border-color:var(--gold); background:var(--gold-soft); transform:translateY(-1px)}
.tud-page .p-article svg{width:18px; height:18px; stroke:var(--gold); fill:none; stroke-width:1.7; flex:0 0 auto}
.tud-page .p-article .pa-arrow{margin-left:auto; width:15px; height:15px; stroke-width:2; transition:transform .2s}
.tud-page .p-article:hover .pa-arrow{transform:translateX(4px)}
.tud-page .p-article b{color:var(--gold); font-weight:600}
.tud-page .p-article .pa-t{line-height:1.35}

.tud-page .tabs{display:flex; gap:8px; padding:20px 28px 0; flex-wrap:wrap}
.tud-page .tab{flex:1; min-width:120px; border:1px solid var(--line); background:var(--panel); border-radius:12px 12px 0 0;
  padding:12px 14px 14px; cursor:pointer; font-family:inherit; color:var(--muted); text-align:left; transition:.22s; border-bottom:none; position:relative; top:1px}
.tud-page .tab .t-lab{display:flex; align-items:center; gap:8px; font-weight:700; font-size:.92rem; color:var(--txt)}
.tud-page .tab .t-dot{width:10px; height:10px; border-radius:50%; flex:0 0 auto}
.tud-page .tab.t1 .t-dot{background:var(--l1)} .tud-page .tab.t2 .t-dot{background:var(--l2)} .tud-page .tab.t3 .t-dot{background:var(--l3)}
.tud-page .tab .t-hint{font-size:.75rem; margin-top:3px; display:block; color:var(--dim)}
.tud-page .tab[aria-selected="true"]{background:var(--ink2); color:var(--txt)}
.tud-page .tab.t1[aria-selected="true"]{border-color:var(--l1-line); box-shadow:inset 0 3px 0 var(--l1)}
.tud-page .tab.t2[aria-selected="true"]{border-color:var(--l2-line); box-shadow:inset 0 3px 0 var(--l2)}
.tud-page .tab.t3[aria-selected="true"]{border-color:var(--l3-line); box-shadow:inset 0 3px 0 var(--l3)}

.tud-page .panel-body{padding:24px 28px 8px; border-top:1px solid var(--line2); margin-top:-1px}
.tud-page .layer{display:none} .tud-page .layer.show{display:block; animation:tud-fade .35s ease}
@keyframes tud-fade{from{opacity:0; transform:translateY(8px)}to{opacity:1; transform:none}}
.tud-page .layer p{margin:0 0 13px; color:#d3dae2; font-size:1rem}
.tud-page .layer p strong{color:#fff}
.tud-page .layer .lead-line{font-size:1.08rem; color:#fff; font-weight:500; line-height:1.5}
.tud-page .layer ul{margin:0 0 14px; padding-left:0; list-style:none}
.tud-page .layer li{position:relative; padding:8px 0 8px 30px; color:#d3dae2; border-bottom:1px solid var(--line)}
.tud-page .layer li:last-child{border-bottom:none}
.tud-page .layer li::before{content:""; position:absolute; left:4px; top:15px; width:8px; height:8px; border-radius:50%}
.tud-page .layer.c1 li::before{background:var(--l1)} .tud-page .layer.c2 li::before{background:var(--l2)} .tud-page .layer.c3 li::before{background:var(--l3)}
.tud-page .layer li b{color:#fff}
.tud-page .callout{border-radius:12px; padding:14px 16px; margin:4px 0 16px; font-size:.97rem}
.tud-page .callout.c1{background:var(--l1-bg); border:1px solid var(--l1-line)}
.tud-page .callout.c2{background:var(--l2-bg); border:1px solid var(--l2-line)}
.tud-page .callout.c3{background:var(--l3-bg); border:1px solid var(--l3-line)}
.tud-page .callout.danger{background:rgba(228,105,95,.16); border:1px solid var(--l2-line)}
.tud-page .callout .ch{font-weight:700; display:flex; align-items:center; gap:8px; margin-bottom:5px}
.tud-page .callout.c1 .ch{color:var(--l1)} .tud-page .callout.c2 .ch{color:var(--l2)} .tud-page .callout.c3 .ch{color:var(--l3)} .tud-page .callout.danger .ch{color:var(--bad)}
.tud-page .callout p{margin:0; color:#e7ecf1}
.tud-page .callout .t-dot{width:11px; height:11px; border-radius:50%; display:inline-block; flex:0 0 auto}

.tud-page .mtab{width:100%; border-collapse:collapse; margin:2px 0 16px; font-size:.9rem}
.tud-page .mtab th,.tud-page .mtab td{text-align:left; padding:9px 11px; border-bottom:1px solid var(--line)}
.tud-page .mtab th{color:var(--gold); font-weight:600; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em}
.tud-page .mtab td:first-child{font-weight:600; color:#fff; white-space:nowrap}
.tud-page .mtab tr:last-child td{border-bottom:none}
.tud-page .mtab .hl td{background:var(--gold-soft)}
.tud-page .tabscroll{overflow-x:auto; margin-bottom:4px}

/* ---- ESZKÖZÖK ---- */
.tud-page .tool{margin-top:8px; border:1px solid var(--line2); border-radius:16px; overflow:hidden; background:var(--panel)}
.tud-page .tool-h{padding:14px 18px; background:var(--panel2); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px; font-weight:700; font-size:.95rem; color:var(--txt)}
.tud-page .tool-h .badge{margin-left:auto; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); background:var(--gold); padding:3px 9px; border-radius:99px; font-weight:700}
.tud-page .tool-h svg{width:19px; height:19px; stroke:var(--gold); fill:none; stroke-width:1.7}
.tud-page .tool-b{padding:18px}
.tud-page .tud-field{margin-bottom:16px}
.tud-page .tud-field:last-child{margin-bottom:0}
.tud-page .tud-field label{display:flex; justify-content:space-between; align-items:baseline; font-size:.88rem; font-weight:600; color:var(--muted); margin-bottom:8px}
.tud-page .tud-field label .val{color:var(--gold); font-variant-numeric:tabular-nums; font-size:1rem; white-space:nowrap; padding-left:10px}
.tud-page input[type=range]{width:100%; -webkit-appearance:none; appearance:none; height:6px; border-radius:99px; background:var(--panel3); outline:none; margin:6px 0}
.tud-page input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:22px; height:22px; border-radius:50%; background:var(--gold); cursor:pointer; border:3px solid var(--ink2); box-shadow:0 2px 8px rgba(0,0,0,.5)}
.tud-page input[type=range]::-moz-range-thumb{width:22px; height:22px; border-radius:50%; background:var(--gold); cursor:pointer; border:3px solid var(--ink2)}
.tud-page .seg{display:flex; gap:6px; flex-wrap:wrap}
.tud-page .seg button{flex:1; min-width:70px; padding:9px 8px; border-radius:10px; border:1px solid var(--line2); background:var(--panel2); color:var(--muted); font-family:inherit; font-weight:600; font-size:.84rem; cursor:pointer; transition:.18s}
.tud-page .seg button:hover{border-color:var(--line2); color:var(--txt)}
.tud-page .seg button[aria-pressed="true"]{background:var(--gold-soft); border-color:var(--gold); color:var(--gold)}
.tud-page .selectrow{display:flex; flex-direction:column; gap:8px}
.tud-page .selectrow button{text-align:left; padding:13px 15px; border-radius:12px; border:1px solid var(--line2); background:var(--panel2); color:var(--txt); font-family:inherit; cursor:pointer; transition:.18s; display:flex; align-items:center; gap:12px}
.tud-page .selectrow button:hover{border-color:var(--line2); background:var(--panel3)}
.tud-page .selectrow button[aria-pressed="true"]{border-color:var(--gold); background:var(--gold-soft)}
.tud-page .selectrow .sr-t{font-weight:600; display:block}
.tud-page .selectrow .sr-d{font-size:.82rem; color:var(--muted); display:block}
.tud-page .selectrow svg{width:22px; height:22px; stroke:var(--gold); fill:none; stroke-width:1.6; flex:0 0 auto}

.tud-page .verdict{margin-top:16px; border-radius:14px; padding:18px; border:1px solid var(--line2); background:var(--panel2)}
.tud-page .verdict.ok{border-color:rgba(92,186,134,.5); background:rgba(92,186,134,.1)}
.tud-page .verdict.warn{border-color:rgba(230,185,63,.5); background:rgba(230,185,63,.1)}
.tud-page .verdict.bad{border-color:rgba(228,105,95,.5); background:rgba(228,105,95,.1)}
.tud-page .verdict .v-top{display:flex; align-items:center; gap:12px; margin-bottom:10px}
.tud-page .verdict .v-light{width:16px; height:16px; border-radius:50%; flex:0 0 auto; box-shadow:0 0 12px currentColor}
.tud-page .verdict.ok .v-light{background:var(--ok); color:var(--ok)}
.tud-page .verdict.warn .v-light{background:var(--warn); color:var(--warn)}
.tud-page .verdict.bad .v-light{background:var(--bad); color:var(--bad)}
.tud-page .verdict .v-title{font-family:var(--disp); font-weight:600; font-size:1.25rem}
.tud-page .verdict.ok .v-title{color:var(--ok)} .tud-page .verdict.warn .v-title{color:var(--warn)} .tud-page .verdict.bad .v-title{color:var(--bad)}
.tud-page .verdict .v-body{color:#e7ecf1; font-size:.96rem}
.tud-page .verdict .v-body strong{color:#fff}
.tud-page .verdict .v-list{margin:10px 0 0; padding-left:0; list-style:none}
.tud-page .verdict .v-list li{padding:5px 0 5px 22px; position:relative; font-size:.92rem; color:#dbe1e8; border:none}
.tud-page .verdict .v-list li::before{content:"→"; position:absolute; left:0; color:var(--gold); font-weight:700}

.tud-page .calc-out{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px}
.tud-page .calc-cell{background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:14px; text-align:center}
.tud-page .calc-cell .cv{font-family:var(--disp); font-size:1.7rem; color:var(--gold); font-weight:700; font-variant-numeric:tabular-nums; line-height:1}
.tud-page .calc-cell .cl{font-size:.76rem; color:var(--muted); margin-top:6px; letter-spacing:.02em}
@media(max-width:520px){.tud-page .calc-out{grid-template-columns:1fr 1fr}}

.tud-page .xsec{width:100%; border-radius:12px; overflow:hidden; border:1px solid var(--line); background:#0a0e13; margin-top:4px}
.tud-page .xsec svg{width:100%; display:block; height:auto}

.tud-page .checks{list-style:none; margin:0; padding:0}
.tud-page .checks li{display:flex; gap:13px; align-items:flex-start; padding:13px; border:1px solid var(--line2); border-radius:12px; margin-bottom:9px; cursor:pointer; transition:.18s; background:var(--panel2)}
.tud-page .checks li:hover{border-color:var(--line2); background:var(--panel3)}
.tud-page .checks li.on{border-color:var(--ok); background:rgba(92,186,134,.08)}
.tud-page .checks .box{flex:0 0 auto; width:24px; height:24px; border-radius:7px; border:2px solid var(--line2); display:grid; place-items:center; margin-top:1px; transition:.18s}
.tud-page .checks li.on .box{background:var(--ok); border-color:var(--ok)}
.tud-page .checks .box svg{width:14px; height:14px; stroke:#0B0F14; stroke-width:3; fill:none; opacity:0; transition:.18s}
.tud-page .checks li.on .box svg{opacity:1}
.tud-page .checks .ct{font-weight:600; color:#fff; font-size:.96rem; display:block}
.tud-page .checks .cd{font-size:.85rem; color:var(--muted); margin-top:2px; display:block}
.tud-page .check-done{margin-top:14px; text-align:center; padding:16px; border-radius:12px; font-weight:600; border:1px dashed var(--line2); color:var(--muted); transition:.3s}
.tud-page .check-done.all{border-style:solid; border-color:var(--ok); background:rgba(92,186,134,.1); color:var(--ok)}

.tud-page .panel-cta{padding:8px 28px 26px}
.tud-page .mark-btn{width:100%; padding:15px; border-radius:12px; border:1px solid var(--gold); background:linear-gradient(180deg,var(--gold),var(--gold2));
  color:#1a1206; font-family:inherit; font-weight:700; font-size:1rem; cursor:pointer; transition:.2s; display:flex; align-items:center; justify-content:center; gap:9px}
.tud-page .mark-btn:hover{filter:brightness(1.08); transform:translateY(-2px)}
.tud-page .mark-btn svg{width:18px; height:18px; stroke:#1a1206; stroke-width:2.4; fill:none}
.tud-page .mark-btn.done{background:transparent; color:var(--ok); border-color:var(--ok)}
.tud-page .mark-btn.done svg{stroke:var(--ok)}

/* ---- ZÁRÓ + CTA ---- */
.tud-page .takeaway{margin:56px 0 0; border:1px solid var(--line2); border-radius:var(--r2); overflow:hidden; background:linear-gradient(165deg,var(--panel2),var(--ink2))}
.tud-page .takeaway-h{padding:30px 30px 4px}
.tud-page .takeaway-h .kicker{margin-bottom:14px}
.tud-page .takeaway-h h2{font-size:clamp(1.5rem,4vw,2.1rem)}
.tud-page .takeaway-h p{color:var(--muted); margin:10px 0 0}
.tud-page .qgrid{display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:22px 30px 30px}
@media(max-width:640px){.tud-page .qgrid{grid-template-columns:1fr}}
.tud-page .q{border:1px solid var(--line); border-radius:14px; padding:16px 18px; background:var(--panel); display:flex; gap:13px; align-items:flex-start}
.tud-page .q .qn{font-family:var(--disp); color:var(--gold); font-weight:700; font-size:1.1rem; flex:0 0 auto; line-height:1.3}
.tud-page .q p{margin:0; font-size:.95rem; color:#dbe1e8}
.tud-page .q p b{color:#fff}
.tud-page .finalcta{text-align:center; padding:52px 20px 10px}
.tud-page .finalcta h2{font-size:clamp(1.5rem,4vw,2rem)}
.tud-page .finalcta p{color:var(--muted); max-width:520px; margin:12px auto 24px}
.tud-page .tud-btn{display:inline-flex; align-items:center; gap:10px; padding:15px 30px; border-radius:99px; font-weight:700; font-size:1rem;
  text-decoration:none; transition:.22s; cursor:pointer; border:1px solid transparent; background:linear-gradient(180deg,var(--gold),var(--gold2)); color:#1a1206}
.tud-page .tud-btn:hover{filter:brightness(1.08); transform:translateY(-2px); box-shadow:0 14px 30px -12px rgba(212,162,58,.6)}
.tud-page .tud-btn svg{width:18px; height:18px; stroke:currentColor; stroke-width:2; fill:none}

@media(prefers-reduced-motion:reduce){
  .tud-page *{animation-duration:.001ms !important; transition-duration:.001ms !important}
  .tud-page .node:hover,.tud-page a.cat:hover{transform:none}
}