/* Közös kiegészítések minden oldalon: portfólió-sáv, menü, galéria, nagyító, GYIK, űrlap */
html{scroll-behavior:smooth}
body{background:#2F241C}
[hidden]{display:none !important}
.gyakorlo{margin:0;padding:8px 24px;background:#2F241C;color:#F5F0EB;font-family:'Figtree',system-ui,sans-serif;font-size:14px;line-height:1.4;text-align:center}
.gyakorlo a{display:inline-block;margin:0 8px 0 0;padding:0 16px;border-radius:999px;background:#8FD3C9;color:#1E140C;font-weight:600;text-decoration:none}
.gyakorlo a:hover{background:#F5F0EB}
.gyakorlo a:focus-visible{outline:3px solid #F5F0EB;outline-offset:2px}
.site{overflow-x:clip}
#urlap{scroll-margin-top:24px}

/* rejtett csali mező az űrlapokban */
.csali{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nemkot{font-weight:400;color:#66564A}

/* galéria */
.gal-kep{display:block;width:100%;margin:0;padding:0;border:0;border-radius:12px;background:none;overflow:hidden;cursor:zoom-in}
.gal-kep img{display:block;width:100%;transition:transform .3s ease}
.gal-kep:hover img{transform:scale(1.03)}
.gal-kep:focus-visible{outline:3px solid #6B4A2F;outline-offset:3px}
@container (max-width:599px){
  .gal[data-galeria]{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:84%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px;overscroll-behavior-x:contain}
  .gal[data-galeria] .moment{scroll-snap-align:start;padding:24px}
}
.gal-sugo{margin:0;font-size:15px;color:#66564A}
@container (min-width:600px){.gal-sugo{display:none}}

/* nagyító */
.nagyito{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:64px 16px 16px;background:rgba(20,14,10,.92)}
.nagyito figure{margin:0;max-width:min(1100px,100%);display:flex;flex-direction:column;align-items:center;gap:16px}
.nagyito img{display:block;max-width:100%;max-height:calc(100vh - 160px);width:auto;height:auto;border-radius:12px}
.nagyito figcaption{color:#F5F0EB;font-family:'Figtree',system-ui,sans-serif;font-size:18px;text-align:center}
.nagyito button{position:absolute;display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border:2px solid #F5F0EB;border-radius:999px;background:rgba(47,36,28,.75);color:#F5F0EB;cursor:pointer}
.nagyito button:hover{background:#6B4A2F}
.nagyito button:focus-visible{outline:3px solid #8FD3C9;outline-offset:2px}
.nagyito .nz-zar{top:16px;right:16px}
.nagyito .nz-elozo{left:16px;top:50%;transform:translateY(-50%)}
.nagyito .nz-kov{right:16px;top:50%;transform:translateY(-50%)}
@media (max-width:599px){.nagyito .nz-elozo,.nagyito .nz-kov{top:auto;bottom:16px;transform:none}.nagyito{padding-bottom:96px}.nagyito img{max-height:calc(100vh - 200px)}}
body.nz-nyitva{overflow:hidden}

/* GYIK lenyíló */
details.gyik{gap:0}
details.gyik summary{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;list-style:none;cursor:pointer}
details.gyik summary::-webkit-details-marker{display:none}
details.gyik summary:focus-visible{outline:3px solid #6B4A2F;outline-offset:6px;border-radius:8px}
details.gyik .gyik-nyil{flex:none;transition:transform .2s ease;color:#2A1E15}
details.gyik[open] .gyik-nyil{transform:rotate(180deg)}
details.gyik > .txt{margin-top:16px}

/* űrlap */
.input.hibas{border-color:#B42318}
textarea.input{min-height:140px;resize:vertical}
.btn[disabled]{opacity:.7;cursor:wait}
.site .btn{text-align:center}

/* kezdőlap: videós hős */
.hero-video{position:relative;overflow:hidden;background:#2F241C;padding:64px 0}
@container (min-width:1024px){.hero-video{padding:64px 0;min-height:min(86vh,820px);display:flex;align-items:center}.hero-video > .wrap{width:100%}}
.hero-hatter{position:absolute;inset:0;z-index:0}
.hero-hatter picture,.hero-poszter,.hero-mozgo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.hero-hatter::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,20,12,.72) 0%,rgba(30,20,12,.62) 55%,rgba(30,20,12,.8) 100%)}
@container (min-width:1024px){.hero-hatter::after{background:linear-gradient(90deg,rgba(30,20,12,.86) 0%,rgba(30,20,12,.68) 48%,rgba(30,20,12,.12) 100%)}}
.hero-video > .wrap{position:relative;z-index:1}
.hero-video .h1,.hero-video .site strong,.hero-video strong,.hero-video .trust li{color:#FFFFFF}
.hero-video .txt,.hero-video .muted{color:#F1E9E1}
.hero-video .lbl{color:#E6D3BF}
.site .hero-video a:not(.btn){color:#B5E4DD}
.site .hero-video a:not(.btn):hover{color:#FFFFFF}


.hero-video .hero-vis{display:flex;justify-content:flex-start;align-items:flex-end;align-self:end}
@container (min-width:1024px){.hero-video .hero-vis{justify-content:flex-end}}
.hero-video .hero-badge{position:static}
.hero-video .hero-badge strong{color:#2A1E15}
.hero-video .hero-badge .lbl{color:#66564A}
@media (prefers-reduced-motion: reduce){.hero-mozgo{display:none}}

/* gombok: kékeszöld (petrol) kiemelő szín a barna mellé */
.site .btn-p{background:#1E7F7A;color:#FFFFFF;border-color:#1E7F7A}
.site .btn-p:hover{background:#15625E;border-color:#15625E;color:#FFFFFF}
.site .ftr .btn-f{background:#8FD3C9;color:#1E140C}
.site .ftr .btn-f:hover{background:#B5E4DD;color:#1E140C}
.site .hero-video .btn-p{border-color:#8FD3C9}

/* egy betűtípus (Figtree): a címek csak méretben és vastagságban térnek el */
.site .h1,.site .h2{font-weight:800}
.site .h3,.site .brand{font-weight:700}
.site .num,.site .stats dd{font-weight:800}

/* térközök és betűk (Magdolna szabályai): csak 8, 16, 24, 32, 48, 64 px */
.site{letter-spacing:-0.01em}
.site .lbl{letter-spacing:0.12em}
.site .h1{letter-spacing:-0.025em}
.site .btn{padding:8px 24px}
.site .btn-lg{padding:16px 32px}
.site .call-short{padding:8px 16px}
.site .input{padding:8px 16px}
.site button.opt{padding:8px 16px}
.site .menu-btn{padding:0 16px}
.site .nav-m a{padding:16px 0}
.site .nav-m{padding:8px 24px 24px}@media (min-width:1024px){.gyakorlo{font-size:15px}.nagyito figcaption{font-size:20px}}
.site .tile .h3{padding-right:48px}
.site input[type=checkbox]{margin:0;padding:0}
.csali input{margin:0;padding:0}
.site p,.site li,.site dd,.site dt,.site span,.site a,.site label,.site blockquote,.site strong,.site button,.site input,.site textarea,.site figcaption{letter-spacing:-0.01em}
.site .lbl,.site .lbl *{letter-spacing:0.12em}
/* alapszöveg: legfeljebb 700 px, kb. 50–75 karakter soronként */
.site .txt,.site .tips,.site .ulist{max-width:min(700px,34em)}/* tableten a hosszabb szövegű kártyák egy oszlopban, hogy a sorok ne legyenek túl rövidek */
@container (min-width:600px) and (max-width:1023px){.site .grid2,.site .bowls{grid-template-columns:minmax(0,1fr)}}
.site .bowl .txt{max-width:min(700px,32em)}

/* ===== 2026-11-04 este (Magdolna): betűskála, lenyíló menü, hős ===== */
/* 5 betűméret nézetenként: főcím / szakaszcím / kártyacím / alapszöveg és gombok / kis felirat */
.site .page{--fs-h1:56px;--fs-h2:36px;--fs-h3:29px;--fs-body:19px;--fs-lbl:14px}
.gyakorlo{font-size:14px}
.nagyito figcaption{font-size:19px}
@media (min-width:768px){.site .page{--fs-h1:67px;--fs-h2:48px;--fs-h3:30px;--fs-body:21px;--fs-lbl:17px}.gyakorlo{font-size:17px}.nagyito figcaption{font-size:21px}}
@media (min-width:1280px){.site .page{--fs-h1:78px;--fs-h2:60px;--fs-h3:30px;--fs-body:22px;--fs-lbl:20px}.gyakorlo,.gyakorlo a{font-size:20px}.nagyito figcaption{font-size:22px}}
.gal-sugo{font-size:var(--fs-lbl)}
.site .h1,.site .h2,.site .h3{line-height:1.1;overflow-wrap:break-word;hyphens:auto}
.site .txt,.site p,.site li{line-height:1.5}
/* szövegoszlop: 360–850 px, kb. 50–75 karakter soronként */
.site .txt,.site .tips,.site .ulist,.site .bowl .txt{max-width:min(850px,31em)}
.site .h2{max-width:min(1100px,100%)}
/* fő gombok: nagyok, mint a webvezer.hu gombja */
.site .btn-lg{min-height:64px;padding:24px 48px;font-size:var(--fs-body);line-height:1.2}
@media (max-width:599px){.site .btn-lg{padding:24px 32px}}

/* gépen szélesebb sáv, hogy a kártyák szövege se legyen keskeny (50–75 karakter soronként) */
@media (min-width:1280px){
  .site .wrap{max-width:1392px;padding:0 48px}
  .site .page{--box-pad:40px}
  .site .bowls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site .steps.grid3{grid-template-columns:minmax(0,1fr)}
  .site .olist > .card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* lenyíló menü minden nézetben */
.hdr .wrap{display:block!important}
.hdr-top{width:100%}
.site .menu-btn{min-height:48px;padding:8px 24px;gap:8px;font-size:var(--fs-body)}
.site .menu-btn:hover{background:#EAE1D8}
.site .menu-btn:focus-visible{outline:3px solid #6B4A2F;outline-offset:2px}
.site .nav-m ul{margin:0}
.site .nav-m a{font-size:var(--fs-body);font-weight:600}
.site .nav-m li:last-child a{border-bottom:0}
.site .nav-m a:hover,.site .nav-m a:focus-visible{color:#6B4A2F}
@media (min-width:1024px){.nav-m{left:auto;right:max(48px,calc((100% - 1296px) / 2));width:400px;border:1px solid #D3C4B5;border-radius:0 0 16px 16px}}

/* hős: halványított háttér, középre igazított szöveg, a gomb az utolsó elem */
.hero-hatter::after{background:rgba(30,20,12,.72)}
@container (min-width:1024px){.hero-hatter::after{background:rgba(30,20,12,.68)}}
.hero-video{padding:64px 0}
@container (min-width:1024px){.hero-video{min-height:0;padding:64px 0}}
.hero-video .hero-grid{grid-template-columns:minmax(0,1fr)!important;justify-items:center}
.hero-video .hero-grid > .st32,.hero-video .hero-grid .st16,.hero-video .hero-grid .st24,.hero-video .hero-grid .st8{align-items:center;text-align:center;width:100%}
.hero-video .h1{max-width:min(1000px,100%)}
.hero-video .txt{max-width:min(850px,32em);margin-left:auto;margin-right:auto}
.hero-video .btn-lg{width:auto;max-width:100%}

/* A képek width/height attribútumot kaptak (nem ugrál az oldal): a magasságot az arány adja */
.tile-img,.card-img,.gal-kep img{height:auto}
/* lábléc: felül 48, alul 32 px, az elemek között 16-24 px */
.site .ftr{padding:48px 0 32px}
.site .ftr-grid{gap:24px}
.site .ftr-bot{margin-top:24px;padding-top:16px}
/* tableten és gépen (768 px-től) a szakaszok fejléce (felirat, cím, bevezető) a sáv közepén, hogy ne álljon egy keskeny bal oszlopban */
@media (min-width:768px){
  .site .sec-head,.site main > .sec:first-child > .wrap > .st16{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
  .site .sec-head .txt,.site main > .sec:first-child > .wrap > .st16 .txt{margin-left:auto;margin-right:auto}
  .site .sec-head .h2,.site main > .sec:first-child .h1{margin-left:auto;margin-right:auto}
}
@media (min-width:768px){.site .sec-head .st8,.site .sec-head .st16,.site main > .sec:first-child > .wrap > .st16 .st8{align-items:center;text-align:center}}

/* ===== 2026-11-04 este (Magdolna): sorhossz és középre igazítás =====
   a teljes szélességű, egyoszlopos kártyák (lépések) egy középre tett oszlopban, hogy a szöveg kitöltse a kártyát (60-75 karakter);
   a kártyák alatti gomb és apró szöveg is középen */
@media (min-width:768px){
  .site .steps.grid3{max-width:calc(31em + 2 * var(--box-pad, 40px) + 2px);margin-left:auto;margin-right:auto}
  .site .after{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
  .site .after .txt{margin-left:auto;margin-right:auto}
  .site .after.panel{max-width:calc(31em + 2 * var(--box-pad, 40px) + 2px)}
  .site .h2{text-wrap:balance}
}
/* egyoszlopos szakaszok (oldalnyitó, történet, térkép, galéria feje, záró kérdés): a felirat és a cím középen;
   ha a stackben legfeljebb két bekezdés van, azok is középen, hosszabb szövegnél balra zártak, de középre tett oszlopban */
@media (min-width:768px){
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child,
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child > :is(.st8,.st16,.st24){align-items:center;width:100%}
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child > :is(.lbl,.h1,.h2,.h3),
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child > :is(.st8,.st16,.st24) > :is(.lbl,.h1,.h2,.h3){text-align:center;margin-left:auto;margin-right:auto}
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child .txt{width:100%;margin-left:auto;margin-right:auto}
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child:not(:has(> .txt ~ .txt ~ .txt)) > .txt,
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child > :is(.st8,.st16,.st24):not(:has(> .txt ~ .txt ~ .txt)) > .txt{text-align:center}
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child :is(.chips){justify-content:center}
  .site main .sec:not(.hero-video) > .wrap > :is(.st8,.st16,.st24,.st32):only-child > .st8 .btn{align-self:center}
}
/* hosszú jogi szöveg: balra zárva, de középre tett oszlopban */
@media (min-width:768px){.site .doc{max-width:calc(var(--fs-body,22px) * 31);margin-left:auto;margin-right:auto}}
/* blogcikkek: a cím középen, a cikk szövege balra zárva a középre tett oszlopban; kvíz és hírlevél-kártya középen */
@media (min-width:768px){
  .site article.sec .txt,.site article.sec .tips{text-align:left!important}
  .site article.sec .tips{width:100%;margin-left:auto;margin-right:auto}
  .site .quiz,.site .card.nl{max-width:calc(var(--fs-body,22px) * 31 + 2 * var(--box-pad,40px) + 2px);margin-left:auto;margin-right:auto}
}
/* lábléc „Kérdésed van?” része (Magdolna, 2026-11-04 este): gépen egy oszlopban, középen; a szöveg 31em-es sorban,
   alatta a gomb, legalul a telefon és a cím egy sorban, középen */
@media (min-width:768px){
  .site .ftr-grid{grid-template-columns:minmax(0,1fr)!important;justify-items:center;text-align:center;gap:32px}
  .site .ftr-grid > .st32{align-items:center;width:100%}
  .site .ftr-grid > .st32 > .st24{align-items:center;width:100%}
  .site .ftr-grid .txt{margin-left:auto;margin-right:auto;text-wrap:pretty}
  .site .ftr-grid .clist{flex-direction:row;justify-content:center;flex-wrap:wrap;gap:24px 64px}
  .site .ftr-grid .clist .st8{align-items:center}
}

/* ---------- 2026-11-05 (Magdolna): kivezető portfólió-sáv, sehol nincs szóelválasztás ---------- */
html{scroll-padding-top:24px}
html,body,body *{-webkit-hyphens:none!important;hyphens:none!important}
h1,h2,h3,h4,.h1,.h2,.h3{overflow-wrap:normal!important;word-break:normal!important}
.gyakorlo{display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 16px;white-space:nowrap}
.gyakorlo a.gy-link{display:inline-flex;align-items:center;gap:4px;margin:0;padding:0 12px;flex:none;line-height:1.7}
.gyakorlo .gy-szoveg{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.gyakorlo .gy-hosszu{display:none}.gyakorlo .gy-rovid{display:inline}
@media (min-width:768px){.gyakorlo .gy-hosszu{display:inline}.gyakorlo .gy-rovid{display:none}}

/* 2026-11-05: rövid kötőjeles szavak egyben, nincs árva szó a bekezdések végén */
.nowrap{white-space:nowrap}
p,li,blockquote,dd,figcaption,summary,label{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}@media (max-width:599px){.h1.h1-al{font-size:var(--fs-h2)!important}}