/* Miltima – Súgó */
.page.help{overflow:auto;margin:10px -6px 0;padding:0 6px 24px;scroll-behavior:smooth}
.hp{display:flex;flex-direction:column;gap:16px;width:100%}

/* fejléc: cím és nagy kereső */
.hp-hero{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:30px 24px 22px;border-radius:var(--radius);color:#fff;
  background:radial-gradient(420px 220px at 90% 0%,rgba(var(--t-a3-rgb),.35),transparent 70%),radial-gradient(420px 240px at 0% 100%,rgba(var(--t-a1-rgb),.25),transparent 70%),linear-gradient(115deg,#0b1130 0%,var(--t-d2) 55%,var(--t-a2) 100%)}
.hp-hero>:not(.season-bg){position:relative;z-index:2}
.hp-hero .hp-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)}
.hp-hero .hp-badge svg.i{width:14px;height:14px}
.hp-hero h2{margin:10px 0 4px;font-size:26px;font-weight:800;letter-spacing:-.5px}
.hp-hero p{margin:0;font-size:13.5px;color:rgba(255,255,255,.85)}
.hp-hero h2,.hp-hero p,.hp-hero .hp-pop span{text-shadow:0 2px 12px rgba(0,0,0,.45)}
.hp-hero .hp-search{position:relative;display:flex;align-items:center;gap:10px;width:min(620px,100%);height:50px;padding:0 14px 0 16px;border-radius:14px;background:#fff;color:#6b7187;
  box-shadow:0 14px 34px rgba(0,0,0,.25),0 0 0 4px rgba(255,255,255,.08);transition:box-shadow .2s}
.hp-hero .hp-search:focus-within{box-shadow:0 14px 34px rgba(0,0,0,.25),0 0 0 4px rgba(var(--t-l-rgb),.45)}
.hp-hero .hp-search svg.i{width:20px;height:20px}
.hp-hero .hp-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font-size:15px;color:#1c2238}
.hp-hero .hp-search input::-webkit-search-cancel-button{cursor:pointer}
.hp-hero .hp-search .kbd{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;background:#f1f3f7;color:#6b7187;border:1px solid #e3e6ee}
.hp-hero .hp-pop{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:12.5px}
.hp-hero .hp-pop span{color:var(--on2);margin-right:2px}
.hp-hero .hp-pop a{padding:4px 11px;border-radius:20px;color:#fff;text-decoration:none;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);transition:background .15s}
.hp-hero .hp-pop a:hover{background:rgba(255,255,255,.2)}

/* törzs: menü + cikkek */
.hp-msel{display:none}
.hp-body{display:grid;grid-template-columns:270px minmax(0,1fr);gap:16px;align-items:start}
.hp-toc{position:sticky;top:0;max-height:calc(100vh - 100px);overflow:auto;padding:10px;display:flex;flex-direction:column;gap:2px}
.hp-res{display:flex;align-items:center;gap:8px;margin:0 0 6px;padding:8px 10px;border-radius:10px;background:var(--accent-soft);color:var(--accent);font-size:12.5px}
.hp-res svg.i{width:15px;height:15px}
.hp-res span{flex:1;color:var(--text)}
.hp-res button{font-size:12px;font-weight:600;color:var(--accent)}
.hp-res[hidden],.hp-tc[hidden],.hp-tcl a[hidden],.hp-cat[hidden],.hp-art[hidden],.hp-empty[hidden],.hp-art-f[hidden]{display:none}
.hp-tch{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;color:var(--text);text-decoration:none;font-size:13.5px;font-weight:600;transition:background .15s}
.hp-tch:hover{background:#f2f4f8}
.hp-tch svg.i{width:17px;height:17px;color:var(--muted)}
.hp-tch span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hp-tch em{font-style:normal;font-size:11px;font-weight:600;color:var(--muted);background:#f1f3f7;border-radius:10px;padding:1px 7px}
.hp-tc.open .hp-tch{color:var(--accent)}
.hp-tc.open .hp-tch svg.i{color:var(--accent)}
.hp-tcl{display:none;flex-direction:column;margin:2px 0 6px 18px;padding-left:10px;border-left:2px solid var(--line)}
.hp-tc.open .hp-tcl,.hp-toc.searching .hp-tcl{display:flex}
.hp-tcl a{position:relative;padding:5px 8px;border-radius:7px;font-size:12.5px;line-height:1.35;color:var(--muted);text-decoration:none;transition:background .15s,color .15s}
.hp-tcl a:hover{background:#f2f4f8;color:var(--text)}
.hp-tcl a.on{color:var(--accent);font-weight:600;background:var(--accent-soft)}
.hp-tcl a.on::before{content:"";position:absolute;left:-12px;top:6px;bottom:6px;width:2px;border-radius:2px;background:var(--accent)}

.hp-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.hp-cat{display:flex;flex-direction:column;gap:12px;scroll-margin-top:12px}
.hp-cat+.hp-cat{margin-top:14px}
.hp-cat-h{display:flex;align-items:center;gap:12px;padding:2px 4px}
.hp-cat-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(var(--t-a2-rgb),.3)}
.hp-cat-ic svg.i{width:20px;height:20px}
.hp-cat-h h2{margin:0;font-size:19px;font-weight:800;letter-spacing:-.3px}
.hp-cat-h p{margin:2px 0 0;font-size:13px;color:var(--muted)}

.hp-art{padding:18px 22px;scroll-margin-top:12px;transition:box-shadow .3s,border-color .3s}
.hp-art.flash{animation:hpFlash 1.6s ease}
@keyframes hpFlash{0%,30%{border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--t-a2-rgb),.18)}}
.hp-art-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.hp-art-h h3{margin:0;flex:1;font-size:16px;font-weight:700;letter-spacing:-.2px}
.hp-role{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap;background:#f0e9fd;color:#7a45e0}
.hp-role svg.i{width:13px;height:13px}
.hp-link{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--muted);opacity:.55;transition:opacity .15s,background .15s}
.hp-art:hover .hp-link{opacity:1}
.hp-link:hover{background:#f2f4f8;color:var(--text)}
.hp-link svg.i{width:15px;height:15px}
.hp-art-b{font-size:14px;line-height:1.65;color:#3a4057}
.hp-art-b p{margin:0 0 10px}
.hp-art-b>:last-child{margin-bottom:0}
.hp-art-b ul{margin:0 0 10px;padding-left:20px}
.hp-art-b li{margin:3px 0}
.hp-art-b b{color:var(--text)}
.hp-art-b a{color:var(--accent);font-weight:600;text-decoration:none}
.hp-art-b a:hover{text-decoration:underline}
.hp-art-b kbd{display:inline-block;min-width:22px;padding:1px 6px;border-radius:6px;font:600 12px/1.6 inherit;text-align:center;color:var(--text);background:#f6f7fa;border:1px solid #d8dce6;box-shadow:inset 0 -2px 0 #e3e6ee}
.hp-art-b code{padding:1px 6px;border-radius:5px;font-size:12.5px;background:#f1f3f7;color:#3a4057}
.hp-art-b mark,.hp-art-h mark{background:#fff1b8;color:inherit;border-radius:3px;padding:0 1px;box-shadow:0 0 0 1px #f6dc7a}
.hp-art-b .chip{display:inline-flex;align-items:center;gap:5px;padding:1px 8px;border-radius:7px;font-size:12.5px;font-weight:600;vertical-align:1px;background:var(--bg);color:var(--fg);border:1px solid var(--bd)}
.hp-art-b .chip svg.i{width:13px;height:13px}
.hp-muted{color:var(--muted);font-size:13px}
.hp-steps{counter-reset:hs;list-style:none;margin:4px 0 12px;padding:0;display:flex;flex-direction:column;gap:8px}
.hp-steps li{counter-increment:hs;position:relative;margin:0;padding-left:36px;min-height:26px}
.hp-steps li::before{content:counter(hs);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;background:var(--grad)}
.hp-note{display:flex;gap:10px;margin:10px 0;padding:11px 14px;border-radius:12px;font-size:13.5px;line-height:1.55;background:#eef3ff;border:1px solid #d6e2fd;color:#2b3a66}
.hp-note>svg.i{width:18px;height:18px;flex:none;margin-top:2px;color:var(--accent)}
.hp-note.warn{background:#fef6e7;border-color:#f7dfaf;color:#5e4413}
.hp-note.warn>svg.i{color:#c87410}
.hp-tbl{width:100%;border-collapse:collapse;margin:4px 0 12px;font-size:13.5px}
.hp-tbl th{text-align:left;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line)}
.hp-tbl td{padding:9px 10px;border-bottom:1px solid var(--line-2);vertical-align:top}
.hp-tbl tr:last-child td{border-bottom:0}
.hp-tbl td:first-child{white-space:nowrap}
.hp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;margin:6px 0 12px}
.hp-mini{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:12px;background:#f7f8fb;border:1px solid var(--line-2);line-height:1.35}
.hp-mini>svg.i{width:17px;height:17px;color:var(--accent);margin-bottom:2px}
.hp-mini b{font-size:13px}
.hp-mini small{font-size:12px;color:var(--muted)}
.hp-dots{display:flex;gap:3px;margin:3px 0}
.hp-dots i{flex:1;height:8px;border-radius:3px;background:var(--fg);opacity:.75}
.hp-cols{display:flex;flex-wrap:wrap;gap:5px}
.hp-art-f{margin-top:14px;padding-top:12px;border-top:1px solid var(--line-2)}
.hp-go{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:10px;font-size:13px;font-weight:600;color:var(--accent);background:var(--accent-soft);transition:background .15s,transform .15s}
.hp-go:hover{background:#dce6ff}
.hp-go svg.i{width:16px;height:16px}
.hp-go svg.i:last-child{transition:transform .2s}
.hp-go:hover svg.i:last-child{transform:translateX(3px)}
.hp-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:40px 20px;text-align:center}
.hp-empty>svg.i{width:40px;height:40px;padding:9px;border-radius:14px;background:#f1f3f7;color:var(--muted)}
.hp-empty b{font-size:16px}
.hp-empty p{margin:0 0 8px;font-size:13.5px;color:var(--muted)}
/* kapcsolat: magas, évszak-hátteres záró blokk logóval és az ügyfélszolgálat e-mail címével */
.hp-contact{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:340px;margin-top:10px;padding:40px 24px;
  border-radius:var(--radius);text-align:center;color:#fff;background:linear-gradient(115deg,#0b1130 0%,var(--t-d2) 55%,var(--t-a2) 100%)}
.hp-contact>:not(.season-bg){position:relative;z-index:3}
.hp-contact-logo{height:44px;margin-bottom:8px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
.hp-contact h3{margin:0;font-size:24px;font-weight:800;letter-spacing:-.4px;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.hp-contact p{margin:0 0 10px;max-width:460px;font-size:14px;line-height:1.55;color:rgba(255,255,255,.88);text-shadow:0 2px 10px rgba(0,0,0,.45)}
.hp-contact-acts{display:flex;align-items:stretch;gap:8px}
.hp-mail{display:flex;align-items:center;gap:12px;padding:10px 16px 10px 12px;border-radius:14px;color:var(--navy);text-decoration:none;background:#fff;box-shadow:0 14px 34px rgba(0,0,0,.3);transition:transform .2s,box-shadow .2s}
.hp-mail:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(0,0,0,.35)}
.hp-mail>svg.i:first-child{width:36px;height:36px;padding:8px;border-radius:10px;color:#fff;background:var(--grad)}
.hp-mail span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25}
.hp-mail small{font-size:11px;font-weight:600;color:#6b7187}
.hp-mail b{font-size:15px}
.hp-mail>svg.i:last-child{width:18px;height:18px;color:var(--accent);transition:transform .2s}
.hp-mail:hover>svg.i:last-child{transform:translateX(3px)}
.hp-mcopy{width:52px;border-radius:14px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(8px);transition:background .15s}
.hp-mcopy:hover{background:rgba(255,255,255,.24)}
.hp-mcopy svg.i{width:18px;height:18px}
.hp-legal{display:flex;gap:8px;margin-top:10px;font-size:12.5px;color:rgba(255,255,255,.7)}
.hp-legal a{color:#fff;font-weight:600;text-decoration:none;opacity:.85;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.hp-legal a:hover{opacity:1;text-decoration:underline}

/* első megnyitás: beúszás */
.page.help.intro .hp-hero{animation:pIn .55s cubic-bezier(.2,.8,.2,1) backwards}
.page.help.intro .hp-toc{animation:pSide .65s cubic-bezier(.2,.8,.2,1) .12s backwards}
.page.help.intro .hp-main{animation:pIn .65s cubic-bezier(.2,.8,.2,1) .08s backwards}

@media (max-width:900px){
  .hp-hero{padding:22px 16px 18px}
  .hp-hero h2{font-size:22px}
  .hp-hero .hp-search .kbd{display:none}
  .hp-body{grid-template-columns:1fr}
  /* mobilon a menü helyett ragadós, csoportosított választólista */
  .hp-toc{display:none}
  .hp-msel{display:block;position:sticky;top:0;z-index:5;margin:-4px -6px 0;padding:6px 6px 8px;background:linear-gradient(var(--bg) 75%,transparent)}
  .hp-msel .sel{position:relative}
  .hp-msel .dd-btn{height:46px;padding-left:42px;border-radius:12px;font-size:14px;font-weight:600;box-shadow:0 6px 18px rgba(16,24,64,.08)}
  .hp-msel .sel::before{content:"";position:absolute;left:14px;top:50%;z-index:1;width:18px;height:18px;margin-top:-9px;border-radius:5px;background:var(--grad);pointer-events:none;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h10'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h10'/%3E%3C/svg%3E") center/contain no-repeat}
  .hp-art{padding:16px}
  .hp-cat,.hp-art{scroll-margin-top:64px}
  .hp-contact{min-height:300px;padding:32px 16px}
  .hp-contact h3{font-size:20px}
  .hp-mail b{font-size:13.5px}
}
