/* GENERÁLT — ne szerkeszd. Forrás: gepet-redesign/elonezet/index.html
   Generátor: gepet-redesign/eszkozok/css-szukites.py
   Minden szabály a .gk-uj burkoló alá van szűkítve. */

/* ── Montserrat (self-hosted) ─────────────────────────────────────── */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;
  font-display:swap;src:url(../fonts/montserrat-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,
    U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,
    U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;
  font-display:swap;src:url(../fonts/montserrat-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,
    U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,
    U+2212,U+2215,U+FEFF,U+FFFD}

/* =====================================================================
   GÉPET.HU KEZDŐLAP v4 — színrendszer
   ---------------------------------------------------------------------
   EGY színcsalád, egyetlen kék. Minden felület és szöveg ugyanabból a
   hűvös (≈200°) árnyalatcsaládból jön, így a fekete/szürke és a világoskék
   nem "idegen" egymásnak.

   --ink      #0F1D26  szöveg + sötét felület (kékes-fekete)  17,2:1 fehéren
   --ink-2    #3B4A54  másodlagos szöveg                        9,2:1 fehéren
   --ink-3    #5F6F7A  halvány szöveg, feliratok                5,2:1 fehéren / 4,8:1 paper-2-n
   --paper    #FFFFFF  alap felület
   --paper-2  #F2F6F8  váltakozó szekcióháttér (hűvös törtfehér)
   --line     #D9E1E6  vonalak, kártyakeret (dekoratív)
   --kek      #ABDFF1  AZ EGYETLEN KÉK. Szerepe:
                        1) elsődleges gomb SÖTÉT felületen (ink szöveggel, 11,9:1)
                        2) kiemelt szó a címekben (<mark>: világoson vékony kék aláhúzó sáv az ink szöveg alatt, sötéten kék betűszín)
                        3) darabszám-jelvények, "01–04" indexek
                        4) fókuszgyűrű sötét felületen
                        SOHA nem szövegszín világos háttéren (1,4:1 lenne).
   --kek-tint #E3F3FA  a kék 30%-os tónusa: ikoncsempék háttere világos felületen
   --sotet-2  #1B2D38  kártyafelület a sötét szekcióban (fehér szöveg: 14,2:1)
   --sotet-szoveg-2 #B7C5CE másodlagos szöveg sötét felületen (9,7:1 ink-en)
   ===================================================================== */
.gk-uj{
  --ink:#0F1D26; --ink-2:#3B4A54; --ink-3:#5F6F7A;
  --paper:#FFFFFF; --paper-2:#F2F6F8; --line:#D9E1E6;
  --kek:#ABDFF1; --kek-tint:#E3F3FA;
  --sotet-2:#1B2D38; --sotet-vonal:rgba(255,255,255,.14); --sotet-szoveg-2:#B7C5CE;
  --r:18px; --r-s:12px; --r-pill:999px;
  --arnyek:0 1px 2px rgba(15,29,38,.05), 0 12px 32px -16px rgba(15,29,38,.22);
  --tartaly:1200px; --pad:clamp(16px,4vw,40px);
  --szekcio:clamp(56px,7vw,104px);
  --h1:clamp(2.05rem,1.15rem + 3.1vw,3.55rem);
  --h2:clamp(1.6rem,1.15rem + 1.7vw,2.45rem);
  --h3:clamp(1.15rem,1.05rem + .4vw,1.35rem);
}

.gk-uj, .gk-uj *, .gk-uj *::before, .gk-uj *::after{box-sizing:border-box}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto} 
.gk-uj, .gk-uj *{transition:none!important}}

.gk-uj{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 Montserrat,system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

.gk-uj img{display:block;max-width:100%;height:auto}

.gk-uj a{color:inherit}

.gk-uj h1, .gk-uj h2, .gk-uj h3, .gk-uj h4{margin:0;line-height:1.15;letter-spacing:-.02em;font-weight:800}

.gk-uj p{margin:0}

.gk-uj ul{margin:0;padding:0;list-style:none}

.gk-uj :focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:4px}

.gk-uj .sotet :focus-visible{outline-color:var(--kek)}

.gk-uj .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.gk-uj .tartaly{max-width:var(--tartaly);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}

.gk-uj .szekcio{padding-top:var(--szekcio);padding-bottom:var(--szekcio)}

.gk-uj .szekcio--halvany{background:var(--paper-2)}

.gk-uj .sotet{background:var(--ink);color:#fff}

.gk-uj mark{background:linear-gradient(transparent 72%,var(--kek) 72%);color:inherit;padding:0 .04em;-webkit-box-decoration-break:clone;box-decoration-break:clone}

.gk-uj .sotet mark{background:none;color:var(--kek);padding:0}

.gk-uj .ikon{width:1.25em;height:1.25em;flex:none}

/* --- fejléc-blokk (kicker + cím + lead) --- */
.gk-uj .fej{max-width:760px;margin-bottom:clamp(28px,4vw,48px)}

.gk-uj .fej--kozep{margin-left:auto;margin-right:auto;text-align:center}

.gk-uj .kicker{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-bottom:14px}

.gk-uj .kicker::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--kek)}

.gk-uj .fej--kozep .kicker::before{display:none}

.gk-uj .sotet .kicker{color:var(--sotet-szoveg-2)}

.gk-uj .fej h2{font-size:var(--h2)}

.gk-uj .fej .lead{margin-top:14px;font-size:1.05rem;color:var(--ink-2);max-width:62ch}

.gk-uj .fej--kozep .lead{margin-left:auto;margin-right:auto}

.gk-uj .sotet .lead{color:var(--sotet-szoveg-2)}

/* --- gombok --- */
.gk-uj .gomb{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:var(--r-pill);font-weight:700;font-size:.95rem;text-decoration:none;border:2px solid transparent;transition:transform .15s,background .15s,border-color .15s;cursor:pointer}

.gk-uj .gomb:hover{transform:translateY(-1px)}

.gk-uj .gomb--ink{background:var(--ink);color:#fff;border-color:var(--ink)}

.gk-uj .gomb--ink:hover{background:var(--sotet-2);border-color:var(--sotet-2)}

.gk-uj .gomb--korvonal{background:transparent;color:var(--ink);border-color:var(--ink)}

.gk-uj .gomb--korvonal:hover{background:var(--paper-2)}

.gk-uj .gomb--kek{background:var(--kek);color:var(--ink);border-color:var(--kek)}

.gk-uj .gomb--kek:hover{filter:brightness(1.05)}

.gk-uj .gomb--korvonal-vilagos{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}

.gk-uj .gomb--korvonal-vilagos:hover{border-color:#fff;background:rgba(255,255,255,.06)}

.gk-uj .gomb--kicsi{min-height:42px;padding:0 16px;font-size:.88rem}

.gk-uj .nyil{width:18px;height:18px;transition:transform .15s}

.gk-uj .gomb:hover .nyil, .gk-uj .link:hover .nyil{transform:translateX(3px)}

.gk-uj .link{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--ink);text-decoration:none;font-size:.95rem;border-bottom:2px solid var(--line);padding-bottom:2px}

.gk-uj .link:hover{border-color:var(--ink)}

.gk-uj .sotet .link{color:#fff;border-color:var(--sotet-vonal)}

.gk-uj .sotet .link:hover{border-color:var(--kek)}

/* --- jelvények, chipek --- */
.gk-uj .szam{display:inline-flex;align-items:center;gap:6px;background:var(--kek);color:var(--ink);font-weight:700;font-size:.78rem;padding:5px 11px;border-radius:var(--r-pill);white-space:nowrap}

.gk-uj .chipek{display:flex;flex-wrap:wrap;gap:8px}

.gk-uj .chip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:.8rem;font-weight:600;color:var(--ink-2);text-decoration:none;background:var(--paper);transition:border-color .15s,background .15s}

.gk-uj .chip b{color:var(--ink);font-weight:800}

.gk-uj a.chip:hover{border-color:var(--ink);background:var(--paper-2)}

.gk-uj .chip--ikon{padding-left:8px}

/* --- kártya --- */
.gk-uj .kartya{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}

.gk-uj .kartya:hover{transform:translateY(-3px);box-shadow:var(--arnyek)}

.gk-uj .kartya__kep{position:relative;aspect-ratio:1/1;background:var(--paper-2);border-bottom:1px solid var(--line)}

.gk-uj .kartya__kep img{width:100%;height:100%;object-fit:cover}

.gk-uj .kartya__kep--szeles{aspect-ratio:4/3}

.gk-uj .kartya__kep--szeles img{object-fit:contain}

.gk-uj .kartya__test{padding:22px 22px 24px;display:flex;flex-direction:column;gap:12px;flex:1}

.gk-uj .kartya__fej{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}

.gk-uj .kartya h3{font-size:var(--h3)}

.gk-uj .kartya p{color:var(--ink-2);font-size:.95rem}

.gk-uj .kartya__lab{padding-top:6px}

.gk-uj .kartya__index{position:absolute;top:14px;left:14px;z-index:1}

/* =============== ELŐNÉZET-SÁV =============== */
.gk-uj .pv{background:var(--kek);color:var(--ink);text-align:center;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:7px var(--pad)}

/* =============== FEJLÉC =============== */
.gk-uj .fejlec{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}

.gk-uj .fejlec__belso{display:flex;align-items:center;gap:28px;min-height:72px}

.gk-uj .logo{font-weight:800;font-size:1.4rem;letter-spacing:-.03em;text-decoration:none;display:inline-flex;align-items:baseline}

.gk-uj .logo--kep{display:block;line-height:0}
.gk-uj .logo--kep img{display:block;width:auto;height:62px}@media(max-width:640px){
.gk-uj .logo--kep img{height:46px}}
.gk-uj .logo i{font-style:normal;display:inline-block;width:.42em;height:.42em;border-radius:50%;background:var(--kek);margin-left:.08em;transform:translateY(-.02em)}

.gk-uj .nav{display:flex;gap:6px;margin-left:auto}

.gk-uj .nav a{text-decoration:none;font-weight:600;font-size:.9rem;color:var(--ink-2);padding:10px 12px;border-radius:var(--r-pill);transition:background .15s,color .15s}

.gk-uj .nav a:hover{background:var(--paper-2);color:var(--ink)}

.gk-uj .fejlec__cta{display:flex;align-items:center;gap:10px}

.gk-uj .tel{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.92rem;text-decoration:none;white-space:nowrap;padding:10px 12px;border-radius:var(--r-pill)}

.gk-uj .tel:hover{background:var(--paper-2)}

.gk-uj .menu{display:none;margin-left:auto}

.gk-uj .menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-pill)}

.gk-uj .menu summary::-webkit-details-marker{display:none}

.gk-uj .menu[open] summary{background:var(--ink);color:#fff;border-color:var(--ink)}

.gk-uj .menu__lista{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);padding:8px var(--pad) 16px;display:flex;flex-direction:column;box-shadow:var(--arnyek)}

.gk-uj .menu__lista a{text-decoration:none;font-weight:600;padding:12px 4px;border-bottom:1px solid var(--line)}

.gk-uj .menu__lista a:last-child{border:0}
@media (max-width:960px){
  
.gk-uj .nav, .gk-uj .fejlec__cta .gomb{display:none}
  
.gk-uj .menu{display:block}
  
.gk-uj .fejlec__belso{gap:12px}
  
.gk-uj .tel span{display:none}
  
.gk-uj .tel{padding:10px}
}

/* =============== HERO =============== */
.gk-uj .hero{position:relative;overflow:hidden;background:var(--ink);color:#fff;isolation:isolate}

.gk-uj .hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(60% 70% at 88% 20%, rgba(171,223,241,.16), transparent 70%),
  radial-gradient(40% 40% at 10% 100%, rgba(171,223,241,.08), transparent 70%)}

.gk-uj .hero__belso>*{min-width:0}

.gk-uj .szolg>*, .gk-uj .szolg__bal>*, .gk-uj .kapcs>*, .gk-uj .tech>*, .gk-uj .alap>*, .gk-uj .termekek>*, .gk-uj .mellek>*, .gk-uj .mozaik>*{min-width:0}

.gk-uj .hero__belso{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center;padding-top:clamp(48px,6vw,88px);padding-bottom:clamp(48px,6vw,88px)}

.gk-uj .hero__kicker{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sotet-szoveg-2);margin-bottom:22px}

.gk-uj .hero__kicker::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--kek)}

.gk-uj .hero h1{font-size:var(--h1);max-width:14ch}

.gk-uj .hero__lead{margin-top:22px;font-size:1.08rem;color:var(--sotet-szoveg-2);max-width:54ch}

.gk-uj .hero__lead strong{color:#fff;font-weight:700}

.gk-uj .hero__gombok{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}

.gk-uj .hero__pontok{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:14px 28px;margin-top:30px;padding-top:24px;border-top:1px solid var(--sotet-vonal)}

.gk-uj .hero__pontok li{display:flex;flex-direction:column;gap:2px}

.gk-uj .hero__pontok b{font-size:1.45rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--kek)}

.gk-uj .hero__pontok span{font-size:.8rem;font-weight:600;color:var(--sotet-szoveg-2);max-width:12ch}
@media (max-width:480px){
.gk-uj .hero__pontok{grid-template-columns:1fr 1fr;gap:14px 16px}}


.gk-uj .mozaik{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.4vw,16px)}

.gk-uj .csempe{background:var(--paper);color:var(--ink);border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;position:relative;transition:transform .2s}

.gk-uj .csempe:hover{transform:translateY(-3px)}

.gk-uj .csempe img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--paper-2)}

.gk-uj .csempe__lab{display:flex;align-items:center;gap:10px;padding:12px 14px 14px;border-top:1px solid var(--line)}

.gk-uj .csempe__lab .szam{font-size:.72rem;padding:3px 8px;min-width:30px;justify-content:center}

.gk-uj .csempe__lab strong{display:block;font-size:.95rem;font-weight:800;line-height:1.2}

.gk-uj .csempe__lab small{display:block;font-size:.76rem;color:var(--ink-3);margin-top:2px;font-weight:500}
@media (max-width:900px){
  
.gk-uj .hero__belso{grid-template-columns:1fr;gap:36px}
  
.gk-uj .hero h1{max-width:20ch}
}
@media (max-width:480px){
  
.gk-uj .csempe__lab{padding:10px 10px 12px;gap:8px}
  
.gk-uj .csempe__lab .szam{display:none}
  
.gk-uj .csempe__lab strong{font-size:.86rem}
  
.gk-uj .csempe__lab small{font-size:.7rem}
  
.gk-uj .hero__gombok .gomb{flex:1 1 100%}
}

/* =============== BIZALOM-SÁV =============== */
.gk-uj .bizalom{background:var(--paper-2);border-bottom:1px solid var(--line)}

.gk-uj .bizalom__lista{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding-top:28px;padding-bottom:28px}

.gk-uj .bizalom__lista li{display:flex;gap:14px;align-items:flex-start}

.gk-uj .ikoncsempe{width:46px;height:46px;flex:none;border-radius:14px;background:var(--kek-tint);display:grid;place-items:center;color:var(--ink)}

.gk-uj .ikoncsempe .ikon{width:22px;height:22px}

.gk-uj .bizalom__lista strong{display:block;font-size:.95rem;font-weight:800;line-height:1.25}

.gk-uj .bizalom__lista div>span{display:block;font-size:.84rem;color:var(--ink-2);margin-top:3px}
@media (max-width:960px){
.gk-uj .bizalom__lista{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){
.gk-uj .bizalom__lista{grid-template-columns:1fr}}

/* =============== TECHNOLÓGIÁK =============== */
.gk-uj .tech{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);align-items:start}

.gk-uj .tech .kartya__kep{padding:0}

.gk-uj .tech .kartya__kep img{object-fit:contain}

.gk-uj .tech .kartya__index{top:16px;left:16px}

.gk-uj .tovabbi{margin-top:clamp(24px,3vw,36px);padding:20px 22px;border:1px dashed var(--line);border-radius:var(--r)}

.gk-uj .tovabbi__fej{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px}

.gk-uj .tovabbi__cim{font-weight:800;font-size:.95rem}
@media (max-width:1100px){
.gk-uj .tech{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){
.gk-uj .tech{grid-template-columns:1fr}}

/* =============== ALAPANYAGOK =============== */
.gk-uj .alap{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);align-items:start}

.gk-uj .alap .kartya__kep{padding:0}

.gk-uj .alap .kartya__kep img{object-fit:contain}

.gk-uj .top+.top{margin-top:clamp(40px,5vw,64px)}

.gk-uj .top__fej{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}

.gk-uj .top__fej h3{font-size:clamp(1.3rem,1.1rem + .9vw,1.7rem)}

.gk-uj .top__fej p{color:var(--ink-2);margin-top:6px;max-width:60ch}

.gk-uj .termekek{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,20px)}

.gk-uj .termek{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;position:relative;transition:transform .2s,box-shadow .2s}

.gk-uj .termek:hover{transform:translateY(-3px);box-shadow:var(--arnyek)}

.gk-uj .termek img{aspect-ratio:1/1;width:100%;object-fit:cover;border-bottom:1px solid var(--line);background:var(--paper-2)}

.gk-uj .termek__test{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}

.gk-uj .termek__nev{font-weight:700;font-size:.9rem;line-height:1.3}

.gk-uj .termek__ar{margin-top:auto;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}

.gk-uj .termek__ar b{font-size:1.05rem;font-weight:800}

.gk-uj .termek__ar s{color:var(--ink-3);font-size:.85rem}

.gk-uj .termek__ar small{color:var(--ink-3);font-size:.76rem;font-weight:500}

.gk-uj .termek .szam{position:absolute;top:12px;left:12px}

.gk-uj .termekek--gep{grid-template-columns:repeat(3,1fr)}

.gk-uj .termekek--gep .termek__nev{font-size:.98rem}

.gk-uj .termekek--gep .termek__ar b{font-size:1.15rem}

.gk-uj .termekek--kicsi .termek__test{padding:12px 14px 14px}

.gk-uj .termekek--kicsi .termek__nev{font-size:.84rem}

.gk-uj .termekek--kicsi .termek__ar b{font-size:.98rem}

.gk-uj .termek--cta{background:var(--ink);color:#fff;border-color:var(--ink);justify-content:center;align-items:flex-start;padding:24px;gap:14px}

.gk-uj .termek--cta:hover{background:var(--sotet-2)}

.gk-uj .termek--cta strong{font-size:1.25rem;font-weight:800;line-height:1.2;letter-spacing:-.02em}

.gk-uj .termek--cta span{color:var(--sotet-szoveg-2);font-size:.9rem}

.gk-uj .termek--cta .nyil{color:var(--kek);width:28px;height:28px}
@media (max-width:960px){
.gk-uj .alap{grid-template-columns:1fr 1fr}
.gk-uj .termekek{grid-template-columns:repeat(3,1fr)}
.gk-uj .termekek--gep{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
.gk-uj .alap{grid-template-columns:1fr}
.gk-uj .termekek, .gk-uj .termekek--gep{grid-template-columns:repeat(2,1fr)}
.gk-uj .termek__test{padding:12px}}

/* =============== SZOLGÁLTATÁS (SÖTÉT) =============== */
.gk-uj .lepesek{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:clamp(28px,4vw,48px)}

.gk-uj .lepes{display:flex;gap:16px;align-items:flex-start;padding:22px;border:1px solid var(--sotet-vonal);border-radius:var(--r);background:rgba(255,255,255,.03)}

.gk-uj .lepes__szam{flex:none;width:40px;height:40px;border-radius:50%;background:var(--kek);color:var(--ink);font-weight:800;display:grid;place-items:center;font-size:.95rem}

.gk-uj .lepes strong{display:block;font-weight:800;font-size:1rem;margin-bottom:4px}

.gk-uj .lepes span{font-size:.9rem;color:var(--sotet-szoveg-2)}

.gk-uj .szolg{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(16px,2vw,24px)}

.gk-uj .szolg__bal{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px)}

.gk-uj .skartya{background:var(--sotet-2);border:1px solid var(--sotet-vonal);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:12px}

.gk-uj .skartya .ikoncsempe{background:rgba(171,223,241,.14);color:var(--kek)}

.gk-uj .skartya h3{font-size:1.15rem;color:#fff}

.gk-uj .skartya p{color:var(--sotet-szoveg-2);font-size:.93rem}

.gk-uj .skartya__meta{margin-top:auto;padding-top:8px;font-size:.82rem;font-weight:600;color:#fff;display:flex;gap:8px;align-items:center}

.gk-uj .skartya__meta .ikon{color:var(--kek);width:1em;height:1em}

.gk-uj .skartya--kep{padding:0;grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}

.gk-uj .skartya--kep .skartya__szoveg{padding:26px;display:flex;flex-direction:column;gap:12px}

.gk-uj .skartya--kep img{width:100%;height:100%;object-fit:cover;min-height:240px}

.gk-uj .lizing{background:var(--kek);color:var(--ink);border-radius:var(--r);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:18px}

.gk-uj .lizing__kicker{font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}

.gk-uj .lizing h3{font-size:clamp(1.5rem,1.2rem + 1vw,2rem)}

.gk-uj .lizing__szamok{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.gk-uj .lizing__szamok div{background:rgba(255,255,255,.55);border-radius:var(--r-s);padding:20px 18px}

.gk-uj .lizing__szamok b{display:block;font-size:2rem;font-weight:800;letter-spacing:-.02em;line-height:1.1}

.gk-uj .lizing__leiras{font-size:.95rem;color:var(--ink-2);font-weight:500}

.gk-uj .lizing__szamok span{font-size:.8rem;font-weight:600;color:var(--ink-2)}

.gk-uj .lizing ul{display:flex;flex-direction:column;gap:12px;font-size:.95rem;font-weight:600}

.gk-uj .lizing li{display:flex;gap:10px;align-items:flex-start}

.gk-uj .lizing li .ikon{margin-top:.2em;width:1.05em;height:1.05em}

.gk-uj .lizing .gomb{align-self:flex-start;margin-top:auto}

.gk-uj .lizing__aprobetu{font-size:.78rem;color:var(--ink-2);font-weight:500}
@media (max-width:960px){
.gk-uj .szolg{grid-template-columns:1fr}
.gk-uj .lepesek{grid-template-columns:1fr}}
@media (max-width:640px){
.gk-uj .szolg__bal{grid-template-columns:1fr}
.gk-uj .skartya--kep{grid-template-columns:1fr}
.gk-uj .skartya--kep img{min-height:200px;max-height:240px}
.gk-uj .lizing__szamok{grid-template-columns:1fr 1fr}}

/* =============== MÁSODLAGOS TERÜLETEK =============== */
.gk-uj .mellek{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.gk-uj .mkartya{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:start;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;transition:transform .2s,box-shadow .2s}

.gk-uj .mkartya:hover{transform:translateY(-3px);box-shadow:var(--arnyek)}

.gk-uj .mkartya img{width:96px;height:96px;object-fit:cover;border-radius:var(--r-s);border:1px solid var(--line);background:var(--paper-2)}

.gk-uj .mkartya__fej{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}

.gk-uj .mkartya h3{font-size:1rem}

.gk-uj .mkartya p{font-size:.85rem;color:var(--ink-2);margin-bottom:8px}

.gk-uj .mkartya__al{font-size:.78rem;color:var(--ink-3);font-weight:500}
@media (max-width:960px){
.gk-uj .mellek{grid-template-columns:1fr}}

/* =============== MÁRKÁK =============== */
.gk-uj .markak{border-top:1px solid var(--line);background:var(--paper-2)}

.gk-uj .markak__belso{padding-top:clamp(32px,4vw,48px);padding-bottom:clamp(32px,4vw,48px)}

.gk-uj .markak__fej{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}

.gk-uj .markak__fej h2{font-size:1.15rem}

.gk-uj .markak__fej p{font-size:.88rem;color:var(--ink-2)}

.gk-uj .markak__racs{display:grid;grid-template-columns:repeat(8,1fr);gap:10px}

.gk-uj .markak__racs li{display:grid;place-items:center;min-height:64px;padding:10px 12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s);font-weight:800;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;text-align:center;color:var(--ink)}
@media (max-width:960px){
.gk-uj .markak__racs{grid-template-columns:repeat(4,1fr)}}
@media (max-width:520px){
.gk-uj .markak__racs{grid-template-columns:repeat(2,1fr)}}

/* =============== KAPCSOLAT =============== */
.gk-uj .kapcs{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,64px);align-items:center}

.gk-uj .kapcs h2{font-size:var(--h2)}

.gk-uj .kapcs .lead{margin-top:16px;color:var(--ink-2);font-size:1.05rem;max-width:56ch}

.gk-uj .kapcs__gombok{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

.gk-uj .kkartya{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:18px}

.gk-uj .kkartya__cim{font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}

.gk-uj .kkartya ul{display:flex;flex-direction:column;gap:18px}

.gk-uj .kkartya li{display:flex;gap:14px;align-items:flex-start}

.gk-uj .kkartya li .ikoncsempe{background:var(--paper)}

.gk-uj .kkartya strong{display:block;font-size:.8rem;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em}

.gk-uj .kkartya a{font-weight:700;font-size:1.05rem;text-decoration:none;word-break:break-word}

.gk-uj .kkartya a:hover{text-decoration:underline}

.gk-uj .kkartya div>span{font-weight:600;font-size:1.02rem}

.gk-uj .kkartya small{display:block;font-size:.82rem;color:var(--ink-2);margin-top:2px;font-weight:500}
@media (max-width:900px){
.gk-uj .kapcs{grid-template-columns:1fr}}

/* =============== LÁBLÉC =============== */
.gk-uj .lab{background:var(--ink);color:var(--sotet-szoveg-2);padding:40px 0 28px}

.gk-uj .lab__belso{display:flex;flex-wrap:wrap;gap:20px 40px;justify-content:space-between;align-items:flex-start}

.gk-uj .lab .logo{color:#fff}

.gk-uj .lab p{font-size:.88rem;max-width:40ch;margin-top:8px}

.gk-uj .lab nav{display:flex;flex-wrap:wrap;gap:6px 18px}

.gk-uj .lab nav a{font-size:.88rem;font-weight:600;color:#fff;text-decoration:none}

.gk-uj .lab nav a:hover{text-decoration:underline}

.gk-uj .lab__also{margin-top:28px;padding-top:18px;border-top:1px solid var(--sotet-vonal);font-size:.78rem;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}


/* --- aloldal-kiegészítések (a kezdőlap tokenjeivel, új szín nélkül) --- */
.gk-uj .alhero{background:var(--paper-2);border-bottom:1px solid var(--line)}

.gk-uj .alhero__belso{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,64px);align-items:center;padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(32px,4vw,56px)}

.gk-uj .alhero__belso>*{min-width:0}

.gk-uj .alhero--szoveg .alhero__belso{grid-template-columns:1fr}

.gk-uj .alhero h1{font-size:var(--h1);max-width:18ch}

.gk-uj .alhero .lead{margin-top:16px;font-size:1.05rem;color:var(--ink-2);max-width:60ch}

.gk-uj .alhero__gombok{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

.gk-uj .alhero__kep{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}

.gk-uj .alhero__kep img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:var(--paper-2)}

.gk-uj .alhero__stat{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}

.gk-uj .alhero__stat li b{display:block;font-size:1.4rem;font-weight:800;letter-spacing:-.02em;line-height:1.1}

.gk-uj .alhero__stat li span{font-size:.8rem;font-weight:600;color:var(--ink-3)}

.gk-uj .morzsa{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:6px;font-size:.8rem;font-weight:600;color:var(--ink-3)}

.gk-uj .morzsa a{color:var(--ink-2);text-decoration:none}

.gk-uj .morzsa a:hover{text-decoration:underline}

.gk-uj .morzsa li+li::before{content:"/";margin-right:6px;color:var(--line)}

.gk-uj .morzsa [aria-current]{color:var(--ink)}

.gk-uj .racs{display:grid;gap:clamp(14px,1.6vw,20px);align-items:start}

.gk-uj .racs>*{min-width:0}

.gk-uj .racs--2{grid-template-columns:repeat(2,1fr)}

.gk-uj .racs--3{grid-template-columns:repeat(3,1fr)}

.gk-uj .racs--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){
.gk-uj .racs--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){
.gk-uj .alhero__belso, .gk-uj .alhero--szoveg .alhero__belso{grid-template-columns:1fr}
.gk-uj .alhero__kep{max-width:420px}
.gk-uj .racs--3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){
.gk-uj .racs--2, .gk-uj .racs--3, .gk-uj .racs--4{grid-template-columns:1fr}}

.gk-uj .pipak{display:flex;flex-direction:column;gap:10px}

.gk-uj .pipak li{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;color:var(--ink-2)}

.gk-uj .pipak li .ikon{color:var(--ink);margin-top:.2em;width:1.05em;height:1.05em;flex:none}

.gk-uj .sotet .pipak li{color:var(--sotet-szoveg-2)}

.gk-uj .sotet .pipak li .ikon{color:var(--kek)}

.gk-uj .pipak strong{color:var(--ink)}

.gk-uj .sotet .pipak strong{color:#fff}

.gk-uj .doboz{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,2.5vw,28px)}

.gk-uj .doboz h3{font-size:1.1rem;margin-bottom:10px}

.gk-uj .doboz p{color:var(--ink-2);font-size:.95rem}

.gk-uj .sotet .doboz{background:var(--sotet-2);border-color:var(--sotet-vonal)}

.gk-uj .sotet .doboz p{color:var(--sotet-szoveg-2)}

.gk-uj .tabla{width:100%;border-collapse:collapse;font-size:.93rem}

.gk-uj .tabla th, .gk-uj .tabla td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}

.gk-uj .tabla th{font-weight:700;color:var(--ink);width:38%}

.gk-uj .tabla td{color:var(--ink-2)}

.gk-uj .tabla tr:last-child th, .gk-uj .tabla tr:last-child td{border-bottom:0}

.gk-uj .urlap{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.gk-uj .urlap label{display:flex;flex-direction:column;gap:6px;font-size:.82rem;font-weight:700}

.gk-uj .urlap label.teljes{grid-column:1/-1}

.gk-uj .urlap input, .gk-uj .urlap select, .gk-uj .urlap textarea{font:inherit;font-size:.95rem;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);color:var(--ink);width:100%}

.gk-uj .urlap textarea{min-height:120px;resize:vertical}

.gk-uj .urlap input:focus, .gk-uj .urlap select:focus, .gk-uj .urlap textarea:focus{outline:3px solid var(--ink);outline-offset:2px;border-color:var(--ink)}

.gk-uj .urlap .jelolo{flex-direction:row;align-items:flex-start;gap:10px;font-weight:500;color:var(--ink-2);font-size:.85rem}

.gk-uj .urlap .jelolo input{width:auto;margin-top:3px}

.gk-uj .urlap__lab{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:6px}

.gk-uj .urlap__lab small{color:var(--ink-3);font-size:.78rem}
@media (max-width:600px){
.gk-uj .urlap{grid-template-columns:1fr}}

.gk-uj .jegyzet{border:1px dashed var(--line);border-radius:var(--r-s);padding:12px 16px;font-size:.82rem;color:var(--ink-2);background:var(--kek-tint)}

.gk-uj .jegyzet b{color:var(--ink)}

.gk-uj .cta-sav{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,3vw,48px);align-items:center}

.gk-uj .cta-sav h2{font-size:var(--h2)}

.gk-uj .cta-sav .lead{margin-top:12px;color:var(--sotet-szoveg-2)}

.gk-uj .cta-sav__gombok{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

.gk-uj .cta-sav__kep{border-radius:var(--r);overflow:hidden;border:1px solid var(--sotet-vonal)}

.gk-uj .cta-sav__kep img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){
.gk-uj .cta-sav{grid-template-columns:1fr}}

.gk-uj .h3-cim{font-size:clamp(1.25rem,1.1rem + .7vw,1.6rem);margin-bottom:18px}

.gk-uj .kartya--link{text-decoration:none;color:inherit}

.gk-uj .kartya--link:hover h3{text-decoration:underline;text-decoration-thickness:2px}

.gk-uj .chipek--nagy .chip{font-size:.88rem;padding:9px 14px}

.gk-uj .keszlet{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;padding:4px 10px;border-radius:var(--r-pill);border:1px solid var(--line);color:var(--ink-2)}

.gk-uj .keszlet::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink)}

.gk-uj .keszlet--nincs{color:var(--ink-3)}

.gk-uj .keszlet--nincs::before{background:var(--line)}

.gk-uj .termek .keszlet{position:absolute;top:12px;right:12px;background:var(--paper)}

.gk-uj .termekek--egy{grid-template-columns:1fr}

.gk-uj .termekek--egy .termek{display:grid;grid-template-columns:minmax(220px,320px) 1fr;align-items:center}

.gk-uj .termekek--egy .termek img{border-bottom:0;border-right:1px solid var(--line)}

.gk-uj .termekek--egy .termek__test{padding:28px;gap:10px}

.gk-uj .termekek--egy .termek__nev{font-size:1.2rem}

.gk-uj .termekek--egy .termek__ar{margin-top:6px}
@media (max-width:600px){
.gk-uj .termekek--egy .termek{grid-template-columns:1fr}
.gk-uj .termekek--egy .termek img{border-right:0;border-bottom:1px solid var(--line)}}



.gk-uj .kat{display:grid;grid-template-columns:260px 1fr;gap:clamp(20px,3vw,40px);align-items:start}

.gk-uj .szuro{position:sticky;top:88px;display:flex;flex-direction:column;gap:18px}

.gk-uj .szuro details{border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper)}

.gk-uj .szuro summary{cursor:pointer;list-style:none;font-weight:800;font-size:.9rem;padding:12px 14px;display:flex;justify-content:space-between;align-items:center}

.gk-uj .szuro summary::-webkit-details-marker{display:none}

.gk-uj .szuro summary::after{content:"+";color:var(--ink-3)}

.gk-uj .szuro details[open] summary::after{content:"–"}

.gk-uj .szuro .szuro__test{padding:0 14px 14px;display:flex;flex-direction:column;gap:8px;font-size:.88rem;color:var(--ink-2)}

.gk-uj .szuro label{display:flex;align-items:center;gap:8px}

.gk-uj .szuro label b{margin-left:auto;color:var(--ink-3);font-weight:600;font-size:.8rem}

.gk-uj .szuro .ar{display:flex;gap:8px;align-items:center}

.gk-uj .szuro .ar input{width:100%;font:inherit;font-size:.88rem;padding:8px 10px;border:1px solid var(--line);border-radius:8px}

.gk-uj .eszkoztar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}

.gk-uj .eszkoztar p{font-size:.9rem;color:var(--ink-2)}

.gk-uj .eszkoztar label{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:700}

.gk-uj .eszkoztar select{font:inherit;font-size:.9rem;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--paper)}

.gk-uj .lapozo{display:flex;justify-content:center;gap:6px;margin-top:28px}

.gk-uj .lapozo a, .gk-uj .lapozo span{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-pill);font-weight:700;font-size:.9rem;text-decoration:none;color:var(--ink-2);padding:0 10px}

.gk-uj .lapozo [aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}

.gk-uj .lapozo a:hover{border-color:var(--ink);color:var(--ink)}

.gk-uj .alkat{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}

.gk-uj .alkat a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);text-decoration:none;font-weight:700;font-size:.9rem;transition:border-color .15s}

.gk-uj .alkat a:hover{border-color:var(--ink)}
@media (max-width:900px){
.gk-uj .kat{grid-template-columns:1fr}
.gk-uj .szuro{position:static}
.gk-uj .alkat{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){
.gk-uj .alkat{grid-template-columns:1fr}}



.gk-uj .tfej{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;padding-top:clamp(24px,3vw,40px);padding-bottom:clamp(40px,5vw,72px)}

.gk-uj .tfej>*{min-width:0}

.gk-uj .galeria{position:sticky;top:88px}

.gk-uj .galeria__fo{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper-2)}

.gk-uj .galeria__fo img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}

.gk-uj .cimke{display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:#fff;font-weight:700;font-size:.76rem;padding:5px 11px;border-radius:var(--r-pill);letter-spacing:.04em;text-transform:uppercase}

.gk-uj .tinfo h1{font-size:clamp(1.5rem,1.2rem + 1.4vw,2.2rem);margin:12px 0 14px}

.gk-uj .tinfo__meta{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:.82rem;color:var(--ink-3);font-weight:600;margin-bottom:18px}

.gk-uj .ar{display:flex;flex-direction:column;gap:4px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

.gk-uj .ar__brutto{font-size:2rem;font-weight:800;letter-spacing:-.02em;line-height:1.1}

.gk-uj .ar__netto{font-size:.95rem;color:var(--ink-2);font-weight:600}

.gk-uj .ar__afa{font-size:.78rem;color:var(--ink-3)}

.gk-uj .lizinghivas{display:flex;gap:12px;align-items:center;background:var(--kek-tint);border-radius:var(--r-s);padding:12px 14px;margin-top:16px;font-size:.9rem;font-weight:600}

.gk-uj .lizinghivas .ikoncsempe{background:var(--paper);width:38px;height:38px;border-radius:10px}

.gk-uj .lizinghivas a{font-weight:800}

.gk-uj .blokk{margin-top:22px}

.gk-uj .blokk h2{font-size:.95rem;font-weight:800;margin-bottom:10px;letter-spacing:.02em}

.gk-uj .addon{display:flex;flex-direction:column;gap:8px}

.gk-uj .addon label{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);font-size:.9rem;font-weight:600;background:var(--paper)}

.gk-uj .addon label small{margin-left:auto;color:var(--ink-3);font-weight:600}

.gk-uj .felsz{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-size:.9rem;color:var(--ink-2)}

.gk-uj .felsz li{display:flex;gap:8px;align-items:flex-start}

.gk-uj .felsz li .ikon{color:var(--ink);width:1em;height:1em;margin-top:.2em;flex:none}

.gk-uj .keszletsor{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px}

.gk-uj .keszletsor .keszlet{font-size:.85rem;padding:6px 12px}

.gk-uj .kosar{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

.gk-uj .kosar .darab{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-pill);overflow:hidden}

.gk-uj .kosar .darab button{font:inherit;font-weight:800;background:var(--paper);border:0;width:44px;height:50px;cursor:pointer;color:var(--ink)}

.gk-uj .kosar .darab input{width:56px;text-align:center;border:0;font:inherit;font-weight:700;height:50px}

.gk-uj .gomb[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:none}

.gk-uj .ertesit{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

.gk-uj .ertesit input{flex:1 1 220px;font:inherit;font-size:.95rem;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-pill)}

.gk-uj .fulek{margin-top:8px}

.gk-uj .fulek input{position:absolute;opacity:0;pointer-events:none}

.gk-uj .fulek__cimek{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:22px}

.gk-uj .fulek__cimek label{cursor:pointer;padding:12px 18px;font-weight:700;font-size:.92rem;color:var(--ink-2);border-bottom:3px solid transparent;margin-bottom:-1px}

.gk-uj .fulek__lap{display:none;color:var(--ink-2);font-size:.97rem;max-width:72ch}

.gk-uj .fulek__lap p+p{margin-top:12px}

.gk-uj #f1:checked~.fulek__cimek label[for="f1"], .gk-uj #f2:checked~.fulek__cimek label[for="f2"]{color:var(--ink);border-color:var(--ink)}

.gk-uj #f1:checked~#lap1, .gk-uj #f2:checked~#lap2{display:block}

.gk-uj #f1:focus-visible~.fulek__cimek label[for="f1"], .gk-uj #f2:focus-visible~.fulek__cimek label[for="f2"]{outline:3px solid var(--ink);outline-offset:2px;border-radius:4px}
@media (max-width:900px){
.gk-uj .tfej{grid-template-columns:1fr}
.gk-uj .galeria{position:static}
.gk-uj .felsz{grid-template-columns:1fr}}

/* ── Éles igazítások (nem a látványtervből) ────────────────────────── */

/* 1. A GeneratePress tartalom-konténeréből kitörünk — a terv szekciói
      széltől szélig érnek. */
.gk-uj{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw;max-width:100vw;overflow-x:clip}

/* A 100vw a fuggoleges gorgetosav szelesseget IS tartalmazza, ezert
   klasszikus (nem lebego) gorgetosavnal ~15px-szel szelesebb a
   nezetnel: megjelenik egy keskeny vizszintes gorgetosav. A ket
   kozvetlen body-gyerek (fejlec, lablec) igy vw nelkul, pontosan a
   body szelessegeben all; a tartalomba agyazott szekciok tulnyulasat
   a body vagja le. A clip - a hiddennel ellentetben - nem csinal
   gorgeto-kontenert, ezert a ragados fejlec tovabbra is mukodik. */
.gk-uj.gk-fejlec-burok,.gk-uj.gk-lablec-burok{margin-left:0;margin-right:0;
  width:100%;max-width:100%}
body:has(.gk-uj){overflow-x:clip}
.gk-uj+.gk-uj{margin-top:0}

/* 2. Termékkép-keretezés. A tervben a termékfotók előre normalizálva
      voltak (900x900, #F2F6F8 háttér, a tárgy a keret ~80%-a), ezért volt
      elég az `object-fit:cover`. Élesben a kép a WooCommerce-ből jön,
      tetszőleges kivágással és háttérrel — a `cover` levágná a termék
      szélét. A `contain` + azonos háttér + belső margó ugyanazt az
      egységes csempét adja, de futásidőben, BÁRMELY termékre.
      (A terv képszabálya: „termékkártyák: valódi termékfotó — nem
      nyúlunk hozzá" — tehát a fotót nem szerkesztjük, csak keretezzük.)
      A csempe háttere itt FEHÉR (--paper), nem a terv --paper-2-je: a
      boltban a termékfotók túlnyomó része fehér hátterű, és a szürke
      csempén ez látható fehér téglalapként ülne. */
.gk-uj .termek img{object-fit:contain;padding:6%;background:var(--paper)}
.gk-uj .termekek--kicsi .termek img{padding:5%}

/* 3. Nyolc terület-kártya négyes rácsban (a terv négyre volt szabva).
      A kártyák így két sorban, azonos szélességgel állnak. */
.gk-uj .tech--nyolc{grid-template-columns:repeat(4,1fr);align-items:stretch}
.gk-uj .tech--nyolc .kartya__lab{margin-top:auto}
.gk-uj .tech--nyolc .kartya__test>p{margin-bottom:8px}
@media (max-width:1100px){.gk-uj .tech--nyolc{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.gk-uj .tech--nyolc{grid-template-columns:1fr}}

/* 4. Kiemelt másodlagos ajánlat a kártyán belül (Gyártórendszerek). */
.gk-uj .kiemelt{display:block;margin-top:4px;padding:10px 12px;border-radius:var(--r-s);
  background:var(--kek-tint);border:1px solid var(--line);text-decoration:none}
.gk-uj .kiemelt strong{display:block;font-size:.88rem;font-weight:800}
.gk-uj .kiemelt span{display:block;margin-top:2px;font-size:.76rem;color:var(--ink-2);line-height:1.35}
.gk-uj .kiemelt:hover{border-color:var(--ink-3)}

/* 5. „Külön oldalunk" jelölés — a saját domainnel rendelkező területeken. */
.gk-uj .kartya__lab{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.gk-uj .kulso{display:inline-flex;flex-direction:column;gap:1px;text-decoration:none;text-align:right}
.gk-uj .kulso__cimke{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.gk-uj .kulso__domain{display:inline-flex;align-items:center;gap:5px;font-size:.84rem;font-weight:700}
.gk-uj .kulso__domain .ikon{width:14px;height:14px}
.gk-uj .kulso:hover .kulso__domain{text-decoration:underline}

/* 6. Kategória-sáv az ARCHÍVUM oldalon (nem a kezdőlapon) — külön burkoló,
      mert ott nincs .gk-uj teljes szélességű blokk. */
.gk-sav{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:space-between;
  margin:0 0 24px;padding:14px 18px;border-radius:14px;background:#E3F3FA;border:1px solid #D9E1E6;
  font:400 .95rem/1.45 Montserrat,system-ui,sans-serif;color:#0F1D26}
.gk-sav__szoveg strong{font-weight:800}
.gk-sav__gomb{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;
  background:#0F1D26;color:#fff;text-decoration:none;font-size:.86rem;font-weight:700;white-space:nowrap}
.gk-sav__gomb:hover{opacity:.9}

/* 7. „További kategóriáink" — négy kis kártya. A terv .mellek eleme
      háromra volt szabva; itt négy van, és a domain-jelölés is belefér. */
.gk-uj .mellek--negy{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.gk-uj .mellek--negy{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.gk-uj .mellek--negy{grid-template-columns:1fr}}
.gk-uj .mellek--negy .mkartya{grid-template-columns:72px 1fr;gap:12px}
.gk-uj .mellek--negy .mkartya img{width:72px;height:72px}
.gk-uj .mellek--negy .mkartya h3{font-size:.95rem}
.gk-uj .mellek--negy .mkartya p{font-size:.8rem;margin-bottom:6px}
.gk-uj .mkartya__al{display:inline-flex;align-items:center;gap:5px;font-weight:700;color:var(--ink-2)}
.gk-uj .mkartya__al .ikon{width:12px;height:12px}

/* 8. A technológia-aloldal széles kiemelt ajánlata (Gyártórendszerek). */
.gk-uj .kiemelt--szeles{margin:24px 0 0;max-width:640px}

/* A hero-ba emelt kiemelt ajánlat (Gyártórendszerek a szublimáció-oldalon):
   ott a legnagyobb a figyelem, ezért kap nyilat és szélesebb belső teret. */
.gk-uj .kiemelt--hero{display:flex;align-items:center;gap:16px;max-width:560px;
  margin:22px 0 0;padding:16px 20px;background:var(--kek);border-color:transparent}
.gk-uj .kiemelt--hero>span{flex:1;min-width:0}
.gk-uj .kiemelt--hero .nyil{flex:none;width:22px;height:22px}
.gk-uj .kiemelt--hero strong{font-size:1.05rem}
.gk-uj .kiemelt--hero span span{color:var(--ink);font-size:.84rem;margin-top:3px}
.gk-uj .kiemelt--hero:hover{filter:brightness(1.04)}

/* A hero alatti pontsor: a terv `flex`-et hasznal, ezert a masodik oszlop
   elemei a tartalom szelessegehez igazodnak es ELCSUSZNAK egymashoz kepest.
   Racsban mind a negy pont egy vonalban kezdodik. */
.gk-uj .alhero__stat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 32px}

/* Bizalmi jelvények a láblécben (Fogyasztóbarát, Pepita, AA). Világos
   hátteret kapnak, mert a lábléc sötét és a jelvények átlátszó PNG-k. */
.gk-uj .lab__jelvenyek{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.gk-uj .lab__jelvenyek img{height:52px;width:auto;background:#fff;border-radius:10px;padding:6px;
  display:block;object-fit:contain}

/* ── Lábléc-szerkezet: márka + két navigációs oszlop ────────────────
   A terv kétoszlopos láblécébe most jogi linkek is kerültek, ezért három
   oszlop lett. A logó sötét háttéren alig látszott (átlátszó PNG, sötét
   fogaskerékkel), ezért világos lapon ül. */
.gk-uj .lab__belso{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);
  gap:clamp(24px,4vw,56px)}
@media (max-width:900px){.gk-uj .lab__belso{grid-template-columns:1fr 1fr}
  .gk-uj .lab__marka{grid-column:1/-1}}
@media (max-width:560px){.gk-uj .lab__belso{grid-template-columns:1fr}}
.gk-uj .lab__logo{display:inline-block;background:#fff;border-radius:14px;padding:10px 14px;margin-bottom:16px}
.gk-uj .lab__logo img{height:52px;width:auto;display:block}
.gk-uj .lab__marka p{font-size:.88rem;line-height:1.6;color:var(--sotet-szoveg-2);max-width:44ch}
.gk-uj .lab__ceg{margin-top:14px}
.gk-uj .lab__ceg a{color:#fff;text-decoration:none;border-bottom:1px solid var(--sotet-vonal)}
.gk-uj .lab__ceg a:hover{border-color:var(--kek)}
.gk-uj .lab__nav{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.gk-uj .lab__cim{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--kek);margin-bottom:4px}
.gk-uj .lab__nav a{font-size:.9rem;color:var(--sotet-szoveg-2);text-decoration:none}
.gk-uj .lab__nav a:hover{color:#fff;text-decoration:underline}

/* Nagyobb fejléc-logó. A tervben 62 px magas, a fejléc pedig 72 px —
   a logó tehát majdnem kitöltötte. Ha csak a logót növelnénk, kilógna,
   ezért a fejléc magassága is nő vele. */
.gk-uj .fejlec__belso{min-height:96px}
.gk-uj .fejlec .logo--kep img{height:78px}
@media (max-width:640px){.gk-uj .fejlec__belso{min-height:72px}
  .gk-uj .fejlec .logo--kep img{height:56px}}
.gk-uj .lab__jelvenyek a{display:inline-flex}
.gk-uj .lab__jelvenyek a:hover img{outline:2px solid var(--kek);outline-offset:2px}

/* Kalkulátor-eredmény: a stat-lista itt nem <ul>, ezért a rács külön. */
.gk-uj .gk-kalk__eredmeny .alhero__stat{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.gk-uj .gk-kalk__eredmeny .alhero__stat{grid-template-columns:1fr}}

/* ── Fluent Forms a terv arculatában ─────────────────────────────────
   A beágyazott űrlapok a plugin saját megjelenésével jönnek. NEM a Fluent
   Forms globális beállítását írjuk át (az az egész oldal minden űrlapját
   érintené), hanem itt, a .gk-uj burkoló alatt öltöztetjük át — így a
   gepet.hu többi űrlapja érintetlen marad. */
.gk-uj .fluentform .ff-el-group{margin-bottom:16px}
.gk-uj .fluentform .ff-el-input--label label{font-size:.82rem;font-weight:700;color:var(--ink);margin-bottom:6px}
.gk-uj .fluentform .ff-el-form-control{font:inherit;font-size:.95rem;padding:12px 14px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);
  color:var(--ink);width:100%;box-shadow:none;height:auto;line-height:1.4}
.gk-uj .fluentform textarea.ff-el-form-control{min-height:120px;resize:vertical}
.gk-uj .fluentform .ff-el-form-control:focus{outline:3px solid var(--ink);outline-offset:2px;
  border-color:var(--ink);box-shadow:none}
.gk-uj .fluentform .ff-el-form-control::placeholder{color:var(--ink-3)}

/* A Fluent Forms per-urlap egyedi CSS-t general (wpf_has_custom_css),
   ami magasabb specifikussagu, mint egy egyszeru osztaly-szabaly — ezert
   kell ide a plugin sajat osztalyait is belancolni. */
.gk-uj .fluentform .ff-btn.ff-btn-submit.wpf_has_custom_css,
.gk-uj .fluentform .ff-btn.ff-btn-submit,
.gk-uj .fluentform button[type="submit"]{display:inline-flex;align-items:center;
  justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:var(--r-pill);
  font-weight:700;font-size:.95rem;background:var(--ink);color:#fff;border:2px solid var(--ink);
  cursor:pointer;transition:transform .15s,background .15s;width:auto}
.gk-uj .fluentform .ff-btn.ff-btn-submit.wpf_has_custom_css:hover,
.gk-uj .fluentform .ff-btn.ff-btn-submit:hover,
.gk-uj .fluentform button[type="submit"]:hover{background:var(--sotet-2);
  border-color:var(--sotet-2);transform:translateY(-1px)}

/* Jelölőnégyzet és rádió: natív marad, csak igazítjuk. */
.gk-uj .fluentform .ff-el-form-check{display:flex;gap:10px;align-items:flex-start}
.gk-uj .fluentform .ff-el-form-check-label{font-size:.85rem;color:var(--ink-2);font-weight:500}
.gk-uj .fluentform input[type="checkbox"],
.gk-uj .fluentform input[type="radio"]{width:auto;min-height:0;margin-top:3px}

/* Hibaüzenet és feltöltő. */
.gk-uj .fluentform .error-text,
.gk-uj .fluentform .text-danger{font-size:.8rem;color:#B3261E}
.gk-uj .fluentform .ff_upload_btn{border:1px dashed var(--line);border-radius:var(--r-s);
  padding:12px 16px;background:var(--paper-2);color:var(--ink-2);font-size:.88rem;font-weight:600}
.gk-uj .fluentform .ff-el-group.ff_list_inline .ff-el-form-check{margin-right:14px}
@media (max-width:520px){.gk-uj .alhero__stat{grid-template-columns:1fr}}
.gk-uj .chipek--nagy .chip{font-size:.9rem;padding:9px 15px}

/* 9. A terv resetje csak a <ul>-t nullázza, az <ol>-t nem. A lépéslista
      (.lepesek) viszont <ol>, ezért a natív „1." sorszám ODAKERÜLT a saját
      körös sorszám mellé — „1. 1" lett belőle. Ugyanez a hiba a
      látványtervben is benne van. */
.gk-uj ol{margin:0;padding:0;list-style:none}

/* 10. Változat-szám az alapanyag-kártyán: a katalógus a variálható
       terméket egynek számolja, a vevő választása viszont szélesebb. */
.gk-uj .valtozat{font-size:.82rem;font-weight:700;color:var(--ink-2);
  display:inline-flex;align-items:center;gap:6px;margin:-4px 0 0}
.gk-uj .valtozat::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--kek)}

/* Négy alapanyag-kártya (a terv háromra volt szabva). */
.gk-uj .alap--negy{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.gk-uj .alap--negy{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.gk-uj .alap--negy{grid-template-columns:1fr}}
.gk-uj .alap--negy{align-items:stretch}
.gk-uj .alap--negy .kartya__lab{margin-top:auto}

/* 11. A lépés-sorszám olvashatósága. A terv `.lepes span` szabálya
       (halvány --sotet-szoveg-2 a leíráshoz) a SORSZÁM spanjére is ráhúz,
       és mivel későbbi, felülírja a `.lepes__szam{color:var(--ink)}`-et.
       Eredmény: #B7C5CE a #ABDFF1 körön — 1,15:1 kontraszt, olvashatatlan.
       Ez a hiba a látványtervben is benne van. */
.gk-uj .lepes span.lepes__szam{color:var(--ink);font-size:.95rem}

/* 12. Céges előnyök szétosztva — nem egy blokkban, hanem ott, ahol a
       vevő dönt. Vásárlási biztonság az árak alatt, kedvezmény az
       alapanyagok alatt. A szöveg a ceges-elonyok pluginból jön. */
/* A harmadolo racs elvette a helyet a ket hosszabb tetelotol, ezert 1100 px
   alatt ket sorba tortek. Tartalomhoz igazodo oszlopokkal a rovid tetel
   csak annyit foglal, amennyi kell — igy 1000 px-ig mind egy sor. */
.gk-uj .biztonsag{display:grid;grid-template-columns:repeat(3,auto);
  justify-content:space-between;gap:14px 28px;
  margin-top:clamp(28px,3vw,40px);padding-top:24px;border-top:1px solid var(--line)}
.gk-uj .biztonsag li{display:flex;align-items:center;gap:12px;font-size:.88rem;
  font-weight:600;color:var(--ink-2);line-height:1.35}
@media (max-width:1000px){.gk-uj .biztonsag{grid-template-columns:1fr;justify-content:start}}

.gk-uj .kedvezmeny{display:flex;align-items:center;gap:16px;margin-top:clamp(24px,3vw,36px);
  padding:18px 22px;border-radius:var(--r);background:var(--kek-tint);
  border:1px solid var(--line);text-decoration:none;transition:border-color .15s}
.gk-uj .kedvezmeny:hover{border-color:var(--ink-3)}
.gk-uj .kedvezmeny>span:nth-child(2){flex:1;min-width:0}
.gk-uj .kedvezmeny strong{display:block;font-size:.98rem;font-weight:800}
.gk-uj .kedvezmeny small{display:block;margin-top:3px;font-size:.84rem;color:var(--ink-2);line-height:1.4}
@media (max-width:560px){.gk-uj .kedvezmeny{align-items:flex-start}}

/* 13. Kategoriaoldal. A terv racsa 260 px-es szuro-oldalsavval szamol;
       a szuro-felulet meg nem keszult el, ezert amig nincs `.kat--szuros`
       osztaly, a terseklista a teljes szelesseget kapja — kulonben
       260 px ures hasab tatongana mellette. */
.gk-uj .kat{grid-template-columns:1fr}
@media (min-width:901px){.gk-uj .kat--szuros{grid-template-columns:260px 1fr}}

/* NEVUTKOZES: a terv `.ar` osztalyt hasznal a TERMEKOLDAL ar-blokkjara
   (fuggoleges) ES a szuro ar-savjara (vizszintes) is. A termekoldali
   szabaly kesobb all a lapban, ezert a szuro ket mezoje ket sorba tort.
   Itt allitjuk vissza, csak a szuron belul. */
.gk-uj .szuro .ar{flex-direction:row;align-items:center;padding:0;border:0;gap:8px}
.gk-uj .szuro .ar input{min-width:0}
.gk-uj .szuro .ar span{color:var(--ink-3);flex:none}
.gk-uj .szuro form{display:flex;flex-direction:column;gap:14px}
.gk-uj .szuro .gomb{align-self:flex-start}
.gk-uj .szuro .link{font-size:.85rem}

/* A kategoria-listan otos rasc fer el (a kezdolapon negyes), mert itt
   nincs mellette semmi. 1280 px alatt visszaall a tervbeli negyesre. */
.gk-uj .termekek--kat{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.gk-uj .termekek--kat{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.gk-uj .termekek--kat{grid-template-columns:repeat(2,1fr)}}
       /* Telefonon is ket oszlop, mint a kezdolapon (a 13.b blokk szukiti a kartyat). */

/* A rendezes-valaszto urlap, hogy a select ugyanugy alljon, mint a tervben. */
.gk-uj .eszkoztar form{display:inline-flex;align-items:center;gap:8px;margin:0}

/* A kategoria-leiras a WooCommerce-bol jon, sajat <p>-kkel. */
.gk-uj .kat-leiras p{margin:0 0 10px;color:var(--ink-2);font-size:1.05rem;max-width:70ch}
.gk-uj .kat-leiras p:last-child{margin-bottom:0}

/* Ures lista. */
.gk-uj .kat-ures{padding:40px 0;color:var(--ink-2)}

/* 14. Termekoldal. A terv kezzel irt kosar-blokkot rajzolt; elesben a
       WooCommerce sajat urlapja megy (valtozat-valaszto, Product Addons,
       min-max mennyiseg, bundle). Azt NEM epitjuk ujra — csak ratesszuk a
       terv formait, hogy a kosar/penztar mukodese bantatlan maradjon. */
.gk-uj .ar .price{margin:0;font-size:2rem;font-weight:800;letter-spacing:-.02em;
  line-height:1.15;color:var(--ink)}
.gk-uj .ar .price del{font-size:1.1rem;font-weight:600;color:var(--ink-3);margin-right:8px}
.gk-uj .ar .price ins{text-decoration:none}
.gk-uj .ar .price .woocommerce-Price-amount{white-space:nowrap}
/* A netto sor a bruttot koveto sortoresbol jon (a bolt sajat ar-szurojebol),
   ezert nem kulon elem — a meret-kulonbseget itt nem tudjuk szelektorral
   elerni, viszont a `small` es a zarojeles resz igy is halkabb marad. */
.gk-uj .ar .price small,.gk-uj .ar .price .netto{font-size:.95rem;color:var(--ink-2);font-weight:600}

/* WooCommerce galeria a terv keretezeseben. */
.gk-uj .woocommerce-product-gallery{position:relative}
.gk-uj .woocommerce-product-gallery__wrapper{margin:0}
.gk-uj .woocommerce-product-gallery__image>a{display:block;border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;background:var(--paper-2)}
.gk-uj .woocommerce-product-gallery__image img{display:block;width:100%;height:auto}
.gk-uj .flex-control-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  list-style:none;padding:0;margin:10px 0 0}
.gk-uj .flex-control-thumbs img{border:1px solid var(--line);border-radius:var(--r-s);
  cursor:pointer;background:var(--paper-2)}
.gk-uj .flex-control-thumbs .flex-active{outline:2px solid var(--ink);border-radius:var(--r-s)}

/* Kosar-urlap: mennyiseg + gomb a terv formaival. */
.gk-uj form.cart{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0 0}
.gk-uj form.cart .quantity input{width:84px;height:50px;text-align:center;font:inherit;
  font-weight:700;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--paper)}
.gk-uj form.cart .button,.gk-uj form.cart button[type=submit]{display:inline-flex;
  align-items:center;justify-content:center;gap:8px;height:50px;padding:0 24px;
  border:1px solid var(--ink);border-radius:var(--r-pill);background:var(--ink);color:#fff;
  font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.gk-uj form.cart .button:hover,.gk-uj form.cart button[type=submit]:hover{background:var(--sotet-2)}
/* A WooCommerce a variacio-valasztasra varo gombot OSZTALLYAL jeloli
   (`disabled`), nem attributummal — igy teljes erovel latszott egy olyan
   gomb, ami meg nem mukodik. */
.gk-uj form.cart .button:disabled,.gk-uj form.cart button[disabled],
.gk-uj form.cart .button.disabled,.gk-uj form.cart .single_add_to_cart_button.disabled{
  opacity:.45;cursor:not-allowed}
.gk-uj form.cart .variations{width:100%;border-collapse:collapse}
.gk-uj form.cart .variations th,.gk-uj form.cart .variations td{padding:6px 0;text-align:left;
  font-size:.9rem;vertical-align:middle}
.gk-uj form.cart .variations select{font:inherit;font-size:.92rem;padding:10px 12px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);width:100%}
.gk-uj .woocommerce-variation-price{margin:8px 0}
.gk-uj .reset_variations{font-size:.82rem;color:var(--ink-3)}

/* Product Addons: a terv `.addon` csempeire hangolva. */
.gk-uj .wc-pao-addon{margin-top:16px}
.gk-uj .wc-pao-addon-name{font-size:.95rem;font-weight:800;margin-bottom:8px}
.gk-uj .wc-pao-addon-description{font-size:.85rem;color:var(--ink-2)}
.gk-uj .wc-pao-addon-wrap label{display:flex;align-items:center;gap:10px;padding:10px 12px;
  border:1px solid var(--line);border-radius:var(--r-s);font-size:.9rem;font-weight:600;
  background:var(--paper);margin-bottom:8px}
.gk-uj .wc-pao-addon select{font:inherit;font-size:.92rem;padding:10px 12px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);width:100%}
.gk-uj .wc-pao-subtotal-line{font-size:.9rem;color:var(--ink-2);margin-top:10px}

/* Rovid leiras a terv „Felszereltseg" listajakent. */
.gk-uj .rovidleiras ul{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:1fr 1fr;gap:8px 16px;font-size:.9rem;color:var(--ink-2)}
.gk-uj .rovidleiras li{position:relative;padding-left:18px;line-height:1.45}
.gk-uj .rovidleiras li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;
  border-radius:50%;background:var(--kek)}
.gk-uj .rovidleiras p{font-size:.92rem;color:var(--ink-2);margin:0 0 8px}
@media (max-width:900px){.gk-uj .rovidleiras ul{grid-template-columns:1fr}}

/* A leiras-ful a bolti HTML-t kapja (tablazat, kep, lista). */
.gk-uj .fulek__lap ul,.gk-uj .fulek__lap ol{padding-left:20px;margin:0 0 12px}
.gk-uj .fulek__lap ul{list-style:disc}
.gk-uj .fulek__lap ol{list-style:decimal}
.gk-uj .fulek__lap li{margin-bottom:4px}
.gk-uj .fulek__lap img{max-width:100%;height:auto;border-radius:var(--r-s)}
.gk-uj .fulek__lap table{width:100%;border-collapse:collapse;font-size:.92rem}
       /* A hosszu leiras cimsorai: sajat terkoz nelkul raragadtak az elozo
          bekezdesre (GO-POD MUG, 2026-09-24). */
.gk-uj .fulek__lap h2{font-size:1.35rem;line-height:1.25;margin:32px 0 10px;color:var(--ink)}
.gk-uj .fulek__lap h3{font-size:1.05rem;line-height:1.3;margin:22px 0 8px;color:var(--ink)}
.gk-uj .fulek__lap > :first-child{margin-top:0}
.gk-uj .fulek__lap table{margin:12px 0}
.gk-uj .fulek__lap th,.gk-uj .fulek__lap td{padding:9px 12px;border-bottom:1px solid var(--line);
  text-align:left;vertical-align:top}
.gk-uj .fulek__lap{max-width:none}

/* 15. Ket resz, amit a tema/WooCommerce sajat CSS-e felulirt volna. */

/* Ar: a bolt ar-szuroje a brutto ala TORDELI a nettot, sima szovegkent
   (nincs korulotte elem). Ezert forditva kotjuk: a `.price` alap merete a
   KICSI netto sore, es a `.woocommerce-Price-amount` spanek — vagyis a
   brutto osszegek — kapjak a nagy meretet. */
.gk-uj .ar .price{font-size:.95rem;font-weight:600;color:var(--ink-2);line-height:1.5}
.gk-uj .ar .price .woocommerce-Price-amount{font-size:2rem;font-weight:800;color:var(--ink);
  letter-spacing:-.02em;line-height:1.15;white-space:nowrap}
.gk-uj .ar .price del .woocommerce-Price-amount{font-size:1.1rem;font-weight:600;color:var(--ink-3)}
.gk-uj .ar .price ins{text-decoration:none}

/* Mennyiseg-valaszto: a tema plusz/minusz gombjai fuggolegesen alltak,
   mert a sorba rendezo szabalya a `div.product.do-quantity-buttons`
   szuloosztalyra var, ami a mi burkolonkon nincs rajta. A tema
   szelektoranal eggyel erosebb lancot irunk, !important nelkul. */
.gk-uj .quantity,.gk-uj .quantity.buttons-added{display:inline-flex;
  align-items:center;border:1px solid var(--line);border-radius:var(--r-pill);overflow:hidden}
.gk-uj .quantity.buttons-added .minus,.gk-uj .quantity.buttons-added .plus{
  width:44px;height:50px;min-height:50px;border:0;background:var(--paper);font:inherit;
  font-weight:800;color:var(--ink);cursor:pointer;margin:0;border-radius:0}
.gk-uj .quantity.buttons-added .qty,.gk-uj .quantity .qty{width:56px;
  max-width:56px;height:50px;min-height:50px;border:0;border-left:1px solid var(--line);
  border-right:1px solid var(--line);text-align:center;font:inherit;font-weight:700;
  background:var(--paper);padding:0;border-radius:0}

/* Kosarba gomb: a tema akcentusszine (fekete) helyett a terv tintaja. */
.gk-uj form.cart button.button,.gk-uj form.cart button.button.alt,
.gk-uj form.cart .button.alt,.gk-uj form.cart .single_add_to_cart_button{
  background:var(--ink);border-color:var(--ink);color:#fff}
.gk-uj form.cart button.button:hover,.gk-uj form.cart .single_add_to_cart_button:hover{
  background:var(--sotet-2);border-color:var(--sotet-2)}

/* A galeria nagyito-ikonja a kep sarkaba, ne a kep fole. */
.gk-uj .woocommerce-product-gallery__trigger{position:absolute;top:12px;right:12px;z-index:2;
  width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--paper);border:1px solid var(--line);border-radius:50%;text-decoration:none}

/* A galeria a terv racsaban a TELJES oszlopot kapja. A WooCommerce es a
   tema `div.images{width:50%;float:left}`-et ir ra (a sajat ketoszlopos
   elrendezesukhoz) — nekunk mar a `.tfej` racs adja a ket oszlopot, igy ez
   felezne a kepet. Negy osztalybol allo lanccal irjuk felul, !important nelkul. */
/* A width/float `!important` — kivetelesen indokoltan. A temat szabalya
   ID-t is tartalmaz (`.woocommerce-page #content div.product div.images`),
   amit osztalyokkal nem lehet felulmulni; az `#content` beemelese a mi
   szelektorunkba viszont a tema konteneranek nevehez kotne minket. */
.gk-uj.gk-termek .galeria .woocommerce-product-gallery{width:100%!important;
  float:none!important;margin:0;opacity:1;overflow:hidden}

/* Amig a diavetito JS le nem fut, a kepek egymas MELLETT allnak (a
   Perfmatters `delay_js` varat a szkriptekre). A WooCommerce ezt ugy oldja
   meg, hogy addig LATHATATLANNA teszi az egesz galeriat — nalunk ez ures
   helyet jelentene. Helyette a kereten vagunk (overflow a galerian): az
   elso kep azonnal latszik, a tobbi a JS-sel jon elo. A diavetito sajat
   racsaba NEM nyulunk bele — sajat inline szelesseget szamol, es a mi
   flex-szabalyaink ellene dolgoztak volna. A `__image` overflow-ja a
   nagyito ratetet (zoomImg) tartja a kepen belul. */
.gk-uj .woocommerce-product-gallery__image{position:relative;overflow:hidden}

/* 16. Kosar es penztar. A latvanytervben nincs makett ezekre az
       oldalakra, ezert a terv sajat tokenjeibol epulnek. A WooCommerce
       urlapjaba nem nyulunk — ez tisztan megjelenes. */

/* Lepes-sav. */
.gk-uj .vlepesek{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;padding:0;margin:18px 0 0}
.gk-uj .vlepes{display:flex;align-items:center;gap:10px;font-size:.9rem;font-weight:700;color:var(--ink-3)}
.gk-uj .vlepes__szam{width:28px;height:28px;flex:none;border-radius:50%;display:inline-flex;
  align-items:center;justify-content:center;font-size:.85rem;font-weight:800;
  background:var(--paper);border:1px solid var(--line);color:var(--ink-3)}
.gk-uj .vlepes--aktiv{color:var(--ink)}
.gk-uj .vlepes--aktiv .vlepes__szam{background:var(--ink);border-color:var(--ink);color:#fff}
.gk-uj .vlepes--kesz{color:var(--ink-2)}
.gk-uj .vlepes--kesz .vlepes__szam{background:var(--kek-tint);border-color:var(--kek);color:var(--ink)}

/* Kosar-tablazat. */
.gk-uj .woocommerce table.shop_table{width:100%;border-collapse:collapse;border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;background:var(--paper);font-size:.94rem}
.gk-uj table.shop_table th{text-align:left;font-weight:800;font-size:.8rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink-3);padding:14px 16px;border-bottom:1px solid var(--line)}
.gk-uj table.shop_table td{padding:16px;border-bottom:1px solid var(--line);vertical-align:middle}
.gk-uj table.shop_table tr:last-child td{border-bottom:0}
.gk-uj table.shop_table img{width:64px;height:auto;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--paper-2)}
.gk-uj .product-name a{font-weight:700;text-decoration:none;color:var(--ink)}
.gk-uj .product-name a:hover{text-decoration:underline}
.gk-uj td.product-remove a.remove{display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;background:var(--paper-2);color:var(--ink-3);
  text-decoration:none;font-size:1.1rem;line-height:1}
.gk-uj td.product-remove a.remove:hover{background:var(--ink);color:#fff}

/* Kupon + gombok a kosar aljan. */
.gk-uj .coupon{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0}
.gk-uj .coupon label{font-size:.85rem;font-weight:700}
.gk-uj .woocommerce input[type=text],.gk-uj .woocommerce input[type=email],
.gk-uj .woocommerce input[type=tel],.gk-uj .woocommerce input[type=password],
.gk-uj .woocommerce textarea,.gk-uj .woocommerce select,
.gk-uj .woocommerce .select2-selection{font:inherit;font-size:.95rem;padding:12px 14px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);
  width:100%;height:auto;min-height:48px;color:var(--ink)}
.gk-uj .woocommerce textarea{min-height:110px}
.gk-uj .woocommerce input:focus,.gk-uj .woocommerce select:focus,
.gk-uj .woocommerce textarea:focus{outline:2px solid var(--kek);outline-offset:1px}
.gk-uj .woocommerce .button,.gk-uj .woocommerce button.button{display:inline-flex;
  align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;
  border-radius:var(--r-pill);border:1px solid var(--ink);background:var(--ink);color:#fff;
  font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.gk-uj .woocommerce .button:hover,.gk-uj .woocommerce button.button:hover{background:var(--sotet-2)}
/* A masodlagos muveletek (kosar frissitese, kupon) halkabbak. */
.gk-uj .woocommerce button[name=update_cart],.gk-uj .woocommerce button[name=apply_coupon]{
  background:var(--paper);color:var(--ink)}
.gk-uj .woocommerce button[name=update_cart]:hover,.gk-uj .woocommerce button[name=apply_coupon]:hover{
  background:var(--paper-2)}
.gk-uj .woocommerce button[disabled]{opacity:.45;cursor:not-allowed}

/* Osszesito doboz. */
.gk-uj .cart_totals,.gk-uj .cross-sells{margin-top:clamp(24px,3vw,36px)}
.gk-uj .cart_totals h2,.gk-uj #order_review_heading,.gk-uj .woocommerce-billing-fields h3,
.gk-uj .woocommerce-shipping-fields h3,.gk-uj .woocommerce-additional-fields h3{
  font-size:1.1rem;font-weight:800;margin:0 0 14px}
.gk-uj .cart_totals table.shop_table td,.gk-uj .cart_totals table.shop_table th{padding:13px 16px}
.gk-uj .order-total td,.gk-uj .order-total th{font-size:1.05rem;font-weight:800;color:var(--ink)}
.gk-uj .wc-proceed-to-checkout{margin-top:16px}
.gk-uj .wc-proceed-to-checkout .checkout-button{width:100%;font-size:1rem}

/* Penztar: ket hasab, jobb oldalon ragado osszesito. */
@media (min-width:1000px){
  .gk-uj form.checkout.woocommerce-checkout{display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
    /* Az elso sor CSAK a cim magassaga legyen — kulonben az atfogo adatlap
       magassagat osztja szet a ket sor kozott, es az osszesito 200 px-rel
       a cime ala kerul. */
    grid-template-rows:min-content auto;
    gap:clamp(24px,3vw,44px);align-items:start}
  /* EXPLICIT sorok. Automatikus elhelyezessel az osszesito a MASODIK
     racssorba kerult, az elso sor magassagat viszont az 1772 px magas
     adatlap adta — igy az osszesito 1800 px-rel a sajat cime ala csuszott
     (merve). Az adatlap most atfogja mindket sort. */
  /* Az adatlap NEM fogja at a ket sort: a racs igy is szetosztotta a
     magassagat, es az osszesito 226 px-rel a cime ala csuszott. Mindketto
     a 2. sorba kerul, egymas melle; az elso sorban csak a cim all. */
  .gk-uj form.checkout #customer_details{grid-column:1;grid-row:2}
  .gk-uj form.checkout #order_review_heading{grid-column:2;grid-row:1;align-self:start}
  .gk-uj form.checkout #order_review{grid-column:2;grid-row:2;align-self:start;
    position:sticky;top:88px}
  /* A WooCommerce sajat `#order_review{width:48%;float:right}` szabalya a
     racs-cellan BELUL is felezett: 1440 px-es kepernyon 358 px maradt az
     osszesitonek, a szallitasi modok 163 px-en tordeltek harom sorba.
     Az ID miatt `!important` kell. */
  .gk-uj form.checkout #order_review{width:auto!important;float:none!important}
}
/* A WooCommerce/tema `.col2-set .col-1{float:left;width:48%}`-et ir es a
   mezoket is lebegteti — nekunk mar a checkout-racs adja a ket hasabot,
   igy ez MEGFELEZNE az adatlapot (merve: 356 px a 740-bol). A width-et
   osztalyokkal nem lehet felulmulni (a tema szabalya ID-t is tartalmaz),
   ezert itt `!important`; a mezok elrendezeset viszont nem foltozzuk,
   hanem RACCSA tesszuk, es a lebegtetes ezzel targytalanna valik. */
/* A szukites MAGAT a `#customer_details` konteneet erte (a WooCommerce
   `.woocommerce-checkout .col2-set{width:52.94%;float:left}` szabalya) —
   merve: 356 px a 672-bol a racs-cellan BELUL. Ezert a kontenert es a
   ket hasabjat is nullazzuk. */
.gk-uj.gk-kosar #customer_details,.gk-uj.gk-kosar .col2-set{width:100%!important;
  float:none!important;margin-right:0!important}
.gk-uj.gk-kosar #customer_details .col-1,.gk-uj.gk-kosar #customer_details .col-2,
.gk-uj.gk-kosar .col2-set .col-1,.gk-uj.gk-kosar .col2-set .col-2{width:100%!important;
  float:none!important;padding:0}
/* Az OSSZESITO oszlopot ugyanaz a szabaly szukitette, csak azt elsore nem
   vettem eszre: a WooCommerce `#order_review{width:48%;float:right}`-ja a
   racs-cellan belul 166 px-re huzta ossze (merve), a fizetesi dobozok
   120 px-esek lettek, a Megrendeles gomb 120x80, es az egesz 1800 px-rel
   a cime ala csuszott. */
.gk-uj.gk-kosar #order_review,.gk-uj.gk-kosar #order_review_heading{width:100%!important;
  float:none!important}
.gk-uj .woocommerce-billing-fields__field-wrapper,
.gk-uj .woocommerce-shipping-fields__field-wrapper{display:grid;
  grid-template-columns:1fr 1fr;gap:0 14px}
.gk-uj .woocommerce-billing-fields__field-wrapper>.form-row,
.gk-uj .woocommerce-shipping-fields__field-wrapper>.form-row{grid-column:1/-1;
  float:none!important;width:auto!important}
.gk-uj .woocommerce-billing-fields__field-wrapper>.form-row-first,
.gk-uj .woocommerce-shipping-fields__field-wrapper>.form-row-first{grid-column:1}
.gk-uj .woocommerce-billing-fields__field-wrapper>.form-row-last,
.gk-uj .woocommerce-shipping-fields__field-wrapper>.form-row-last{grid-column:2}
@media (max-width:640px){
  .gk-uj .woocommerce-billing-fields__field-wrapper,
  .gk-uj .woocommerce-shipping-fields__field-wrapper{grid-template-columns:1fr}
  .gk-uj .woocommerce-billing-fields__field-wrapper>.form-row-first,
  .gk-uj .woocommerce-billing-fields__field-wrapper>.form-row-last,
  .gk-uj .woocommerce-shipping-fields__field-wrapper>.form-row-first,
  .gk-uj .woocommerce-shipping-fields__field-wrapper>.form-row-last{grid-column:1/-1}
}
.gk-uj .form-row{display:flex;flex-direction:column;gap:6px;margin:0 0 14px;padding:0;width:100%}
.gk-uj .form-row label{font-size:.85rem;font-weight:700;color:var(--ink-2)}
.gk-uj .form-row .required{color:#B3261E;text-decoration:none}
.gk-uj .form-row-first,.gk-uj .form-row-last{width:100%}
.gk-uj #order_review{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(16px,2vw,22px)}
.gk-uj #order_review table.shop_table{border:0;border-radius:0}
.gk-uj .woocommerce-checkout-payment{background:transparent}
.gk-uj ul.wc_payment_methods{list-style:none;padding:0;margin:0 0 16px;display:flex;
  flex-direction:column;gap:8px}
.gk-uj ul.wc_payment_methods li{border:1px solid var(--line);border-radius:var(--r-s);
  padding:12px 14px;background:var(--paper)}
.gk-uj ul.wc_payment_methods label{font-weight:700;font-size:.94rem}
.gk-uj .payment_box{font-size:.88rem;color:var(--ink-2);margin-top:8px}
.gk-uj #place_order{width:100%;font-size:1rem}

/* Uzenetek, ures kosar. */
.gk-uj .woocommerce-message,.gk-uj .woocommerce-info,.gk-uj .woocommerce-error{
  border:1px solid var(--line);border-left:4px solid var(--kek);border-radius:var(--r-s);
  background:var(--paper);padding:14px 16px;margin:0 0 20px;font-size:.94rem;list-style:none}
.gk-uj .woocommerce-error{border-left-color:#B3261E}

/* A WooCommerce alap-stilusa feher szoveget ad az uzenet-dobozoknak
   (szines hatteret feltetelezve). A mi hatterunk vilagos, ezert a
   szoveget is nekunk kell szinezni - kulonben ures doboz latszik. */
.gk-uj .woocommerce-message,.gk-uj .woocommerce-info,.gk-uj .woocommerce-error,
.gk-uj .woocommerce-message li,.gk-uj .woocommerce-info li,.gk-uj .woocommerce-error li{
  color:var(--ink)}
.gk-uj .woocommerce-error li + li{margin-top:6px}
.gk-uj .woocommerce-error li strong{color:#B3261E}
.gk-uj .cart-empty{font-size:1.05rem;color:var(--ink-2)}
.gk-uj .return-to-shop{margin-top:16px}

/* Koszono oldal. */
.gk-uj .woocommerce-order-overview{list-style:none;padding:0;margin:0 0 24px;display:flex;
  flex-wrap:wrap;gap:14px 32px;border:1px solid var(--line);border-radius:var(--r);
  background:var(--paper);padding:18px 22px}
.gk-uj .woocommerce-order-overview li{font-size:.8rem;font-weight:700;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.04em}
.gk-uj .woocommerce-order-overview li strong{display:block;margin-top:4px;font-size:1rem;
  color:var(--ink);text-transform:none;letter-spacing:0}

/* 17. Fiokom, jogi oldalak, kereses, 404. */

/* Jogi szoveg: hosszu, listas, tablazatos tartalom olvashato tipografiaval.
   A tartalom a szerkesztobol jon valtozatlanul — csak keretet kap. */
.gk-uj .szoveges{max-width:74ch;color:var(--ink-2);font-size:1rem;line-height:1.7}
.gk-uj .szoveges h2{font-size:1.35rem;font-weight:800;color:var(--ink);margin:32px 0 12px;
  letter-spacing:-.01em}
.gk-uj .szoveges h3{font-size:1.08rem;font-weight:800;color:var(--ink);margin:26px 0 10px}
.gk-uj .szoveges h4{font-size:.98rem;font-weight:800;color:var(--ink);margin:22px 0 8px}
.gk-uj .szoveges>*:first-child{margin-top:0}
.gk-uj .szoveges p{margin:0 0 14px}
.gk-uj .szoveges ul,.gk-uj .szoveges ol{margin:0 0 16px;padding-left:22px}
.gk-uj .szoveges ul{list-style:disc}
.gk-uj .szoveges ol{list-style:decimal}
.gk-uj .szoveges li{margin-bottom:6px}
.gk-uj .szoveges a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.gk-uj .szoveges strong{color:var(--ink)}
.gk-uj .szoveges table{width:100%;border-collapse:collapse;font-size:.94rem;margin:0 0 18px}
.gk-uj .szoveges th,.gk-uj .szoveges td{padding:10px 12px;border:1px solid var(--line);
  text-align:left;vertical-align:top}
.gk-uj .szoveges th{background:var(--paper-2);font-weight:800;color:var(--ink)}
.gk-uj .szoveges img{max-width:100%;height:auto;border-radius:var(--r-s)}
.gk-uj .szoveges hr{border:0;border-top:1px solid var(--line);margin:28px 0}
/* Szeles tablazat (pl. a szallitasi dijak) mobilon levagodott: 449 px egy
   358 px-es tartalyban, vizszintes gorgetes nelkul. Igy a tablazat MAGA
   gorgetheto, az oldal nem. */
.gk-uj .szoveges .tablazat-burok,.gk-uj .szoveges table{display:block;max-width:100%;
  overflow-x:auto;-webkit-overflow-scrolling:touch}
.gk-uj .szoveges table{white-space:nowrap}
@media (min-width:700px){.gk-uj .szoveges table{white-space:normal}}

/* Fiokom: bal oldalt a menu, jobbra a tartalom. */
@media (min-width:900px){
  .gk-uj .woocommerce-account .woocommerce{display:grid;
    grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,3vw,40px);align-items:start}
}
.gk-uj .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;margin:0;display:flex;
  flex-direction:column;gap:4px}
.gk-uj .woocommerce-MyAccount-navigation li a{display:block;padding:11px 14px;border-radius:var(--r-s);
  text-decoration:none;font-weight:700;font-size:.92rem;color:var(--ink-2)}
.gk-uj .woocommerce-MyAccount-navigation li a:hover{background:var(--paper-2);color:var(--ink)}
.gk-uj .woocommerce-MyAccount-navigation li.is-active a{background:var(--ink);color:#fff}
.gk-uj .woocommerce-MyAccount-content{min-width:0}
.gk-uj .woocommerce-MyAccount-content p{color:var(--ink-2)}
/* Belepes/regisztracio: a ket doboz egymas mellett, keretben. */
/* A tema `form.login,form.register`-re 0 keretet es 0 belso margot ir
   (merve: border 0, padding 0), ezert az elemnevet is bevesszuk a
   lancba — igy lesz erosebb, !important nelkul. */
.gk-uj.gk-fiok form.login,.gk-uj.gk-fiok form.register,
.gk-uj.gk-fiok form.woocommerce-EditAccountForm,
.gk-uj.gk-fiok form.woocommerce-address-fields,
.gk-uj .woocommerce-form-login,.gk-uj .woocommerce-form-register{
  border:1px solid var(--line);border-radius:var(--r);background:var(--paper);
  padding:clamp(18px,2.4vw,26px);max-width:640px}
.gk-uj .woocommerce-form-login-toggle,.gk-uj .woocommerce-form-coupon-toggle{max-width:640px}
.gk-uj .woocommerce-form__label-for-checkbox{display:flex;align-items:center;gap:8px;
  font-size:.9rem;font-weight:600}
.gk-uj .woocommerce-privacy-policy-text{font-size:.86rem;color:var(--ink-3)}

/* Kereso-urlap. */
.gk-uj .gk-kereso{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;max-width:620px}
.gk-uj .gk-kereso input[type=search]{flex:1 1 260px;font:inherit;font-size:1rem;
  padding:13px 16px;border:1px solid var(--line);border-radius:var(--r-pill);
  background:var(--paper);color:var(--ink)}
.gk-uj .gk-kereso input[type=search]:focus{outline:2px solid var(--kek);outline-offset:1px}

/* Nem termek talalatok. */
.gk-uj .talalatok{display:grid;gap:10px}
.gk-uj .talalat{display:block;padding:16px 18px;border:1px solid var(--line);
  border-radius:var(--r-s);background:var(--paper);text-decoration:none;
  transition:border-color .15s}
.gk-uj .talalat:hover{border-color:var(--ink)}
.gk-uj .talalat strong{display:block;font-size:1rem;font-weight:800;color:var(--ink)}
.gk-uj .talalat span{display:block;margin-top:5px;font-size:.9rem;color:var(--ink-2);
  line-height:1.5}

/* 18. Fejlec-eszkozok: kereso, fiok, kosar. Az elso valtozatbol kimaradtak;
       az auditbol derult ki, hogy kosarba tetel utan a vevo nem talalt
       vissza a kosarahoz. */
.gk-uj .fejlec__kereso{display:flex;align-items:center;gap:0;border:1px solid var(--line);
  border-radius:var(--r-pill);background:var(--paper);overflow:hidden;height:40px}
.gk-uj .fejlec__kereso input{border:0;background:none;font:inherit;font-size:.88rem;
  padding:0 12px;width:150px;color:var(--ink);height:100%}
.gk-uj .fejlec__kereso input:focus{outline:none}
.gk-uj .fejlec__kereso:focus-within{border-color:var(--ink)}
.gk-uj .fejlec__kereso button{border:0;background:none;cursor:pointer;color:var(--ink-2);
  width:38px;height:100%;display:inline-flex;align-items:center;justify-content:center}
.gk-uj .fejlec__kereso button:hover{color:var(--ink)}
.gk-uj .fejlec__ikon{position:relative;display:inline-flex;align-items:center;
  justify-content:center;width:44px;height:44px;border-radius:50%;color:var(--ink);
  text-decoration:none;flex:none}
.gk-uj .fejlec__ikon:hover{background:var(--paper-2)}
.gk-uj .fejlec__ikon .ikon{width:21px;height:21px}
.gk-uj .fejlec__darab{position:absolute;top:4px;right:2px;min-width:18px;height:18px;
  padding:0 4px;border-radius:9px;background:var(--ink);color:#fff;font-size:.68rem;
  font-weight:800;line-height:18px;text-align:center}

/* ⚠ A LOGO nem zsugorodhat. A fejlec-eszkozok bevezetese utan a nav (582 px)
   es az eszkozok (604 px) kitoltottek az 1200 px-es savot, es a logo
   flex-elemkent NULLA px-re huzodott ossze 1100 px-tol felfele (merve).
   A logo fix, a nav zsugorodik helyette. */
.gk-uj .fejlec__belso .logo{flex:0 0 auto}
.gk-uj .fejlec .nav{min-width:0;flex:1 1 auto}
/* A menupontok NE vagodjanak le. Az `overflow:hidden` elrejtette a
   „Lizing"-et 1440 px-en, 1100-on pedig harom pontot (merve). Helyette a
   telefonSZAM tunik el szuk helyen — az ikon es a kattinthato link marad,
   a szam pedig ott van a mobil menuben es a lablecben is. */
/* A telefonSZAM a fejlecben mindig ikon: a tartaly 1200 px-nel szelesebb
   kepernyon sem lesz, tehat a szam sehol nem fer el a teljes menu mellett.
   A szam ott van a mobil menuben, a lablecben es a kapcsolat-oldalon; itt
   a kattinthato ikon marad, olvashato aria-cimkevel. */
.gk-uj .fejlec__cta .tel span:not(.sr){display:none}
.gk-uj .fejlec__cta .tel{width:44px;height:44px;justify-content:center;border-radius:50%;
  flex:none;padding:0}
.gk-uj .fejlec__cta .tel:hover{background:var(--paper-2)}
/* A hamburger mar 1150 px-nel atveszi: 1000-1150 kozott a teljes menu nem
   fert ki (a „Szerviz" es a „Lizing" levagodott). */
@media (max-width:1150px){
  .gk-uj .fejlec .nav,.gk-uj .fejlec__cta .gomb{display:none}
  .gk-uj .menu{display:block}
}
.gk-uj .fejlec__cta{flex:0 0 auto}

/* Lenyilo kereso: ikon a fejlecben, panel alatta. */
.gk-uj .fejlec__kereso-nyit{position:relative;flex:none}
.gk-uj .fejlec__kereso-nyit>summary{list-style:none;cursor:pointer;width:44px;height:44px;
  display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:var(--ink)}
.gk-uj .fejlec__kereso-nyit>summary::-webkit-details-marker{display:none}
.gk-uj .fejlec__kereso-nyit>summary:hover{background:var(--paper-2)}
.gk-uj .fejlec__kereso-nyit>summary .ikon{width:21px;height:21px}
.gk-uj .fejlec__kereso-nyit[open]>summary{background:var(--paper-2)}
.gk-uj .fejlec__kereso-nyit .fejlec__kereso{position:absolute;top:calc(100% + 10px);right:0;
  z-index:120;width:min(340px,86vw);height:46px;box-shadow:0 14px 36px rgba(15,29,38,.14)}
.gk-uj .fejlec__kereso input{width:100%}
@media (max-width:1000px){.gk-uj .fejlec__kereso-nyit{display:none}}
@media (max-width:1000px){.gk-uj .fejlec__ikon{width:40px;height:40px}}

.gk-uj .menu__kereso{display:flex;align-items:center;gap:0;border:1px solid var(--line);
  border-radius:var(--r-pill);background:var(--paper);overflow:hidden;height:44px;margin-top:6px}
.gk-uj .menu__kereso input{border:0;background:none;font:inherit;font-size:.95rem;
  padding:0 14px;flex:1;min-width:0;color:var(--ink);height:100%}
.gk-uj .menu__kereso input:focus{outline:none}
.gk-uj .menu__kereso button{border:0;background:none;cursor:pointer;color:var(--ink-2);
  width:44px;height:100%;display:inline-flex;align-items:center;justify-content:center}

/* 19. A kepernyoolvasonak szant szoveg ne foglaljon helyet. Enelkul a
       WooCommerce `reset_variations_alert` 100vw-vel kilogott, es a
       variacios termekoldal asztalon 2187 px szeles lett (merve). */
/* A width `!important`: a tema `.woocommerce div.product form.cart >
   :not(.quantity):not(.single_add_to_cart_button){width:100%}` szabalya
   erosebb (0,4,2), es a `reset_variations_alert` epp a form kozvetlen
   gyereke — emiatt maradt 1440 px szeles a lathatatlannak szant elem. */
.gk-uj .screen-reader-text,.gk-uj .sr{position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);
  white-space:nowrap;border:0}

/* 20. A termekoldalon a sajat keszlet-jelvenyunk mellett ott maradt a
       WooCommerce natív `p.stock` sora is — ugyanaz az informacio ketszer,
       ráadásul 2,89:1 kontraszttal (#77A464 feheren). */
.gk-uj.gk-termek .tinfo p.stock{display:none}

/* 21. Termekkartya + muvelet-sor egy racscellaban. A natív
       `woocommerce_after_shop_loop_item` horgot visszahoztuk (Kosarba
       gomb, GTM listakovetes, „Ertesits, ha lesz raktaron"), de az a
       kartya UTAN ir, es burkolo nelkul kulon cellaba csuszna. */
.gk-uj .termek-doboz{display:flex;flex-direction:column;min-width:0}
.gk-uj .termek-doboz .termek{flex:1}
.gk-uj .termek__muvelet{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
/* A muvelet-sor akkor is uresnek szamit, ha csak a GTM rejtett span-ja van
   benne. A „Kosarba" gomb a listakon a bolt beallitasa szerint KI van
   kapcsolva (GeneratePress `product_archive_add_to_cart = false`) — az
   eles oldalon sincs ott, tehat ez nem regresszio. A horgot viszont
   meghagyjuk: a GTM listakovetes es az „Ertesits" gomb ezen ul. */
.gk-uj .termek__muvelet:empty{display:none}
.gk-uj .termek__muvelet:not(:has(a,button,input)){display:none}

/* 32. Horgony-gorgetes a ragados fejlec ala. A `#gk-ajanlat` es tarsai a
       97 px magas fejlec MOGE gorogtek. */
.gk-uj [id]{scroll-margin-top:110px}
.gk-uj .termek__muvelet .button,.gk-uj .termek__muvelet a.button{display:inline-flex;
  align-items:center;justify-content:center;min-height:40px;padding:0 16px;
  border-radius:var(--r-pill);border:1px solid var(--line);background:var(--paper);
  color:var(--ink);font:inherit;font-size:.85rem;font-weight:700;text-decoration:none;
  cursor:pointer}
.gk-uj .termek__muvelet .button:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.gk-uj .termek__muvelet .added_to_cart{font-size:.82rem;font-weight:700;color:var(--ink-2);
  align-self:center}

/* 22. Menu-lenyilok. A tulajdonos kerese: a fejlecben es a lablecben
       egyelore a MAI szerkezet legyen — ezert a valodi WP-menut
       rendereljuk (80 pont, 7 felso szinten, a Kategoriak 14 aggal).
       Tisztan CSS-bol nyilik: hover ES billentyuzetes fokusz is. */
/* A panel a NAV-hoz igazodik, nem a menuponthoz: kozepre huzva 1473 px
   magasan es 139 px-rel balra kilogva jelent meg (merve). Negy oszlop +
   magassag-korlat tartja kezelheto meretben. */
.gk-uj .nav{position:relative}
.gk-uj .nav__csoport{position:static;display:inline-flex;align-items:center}
.gk-uj .nav__lenyilo{position:absolute;top:calc(100% + 10px);left:0;
  z-index:120;width:min(1040px,92vw);max-height:min(72vh,620px);overflow:auto;
  padding:22px 24px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);box-shadow:0 18px 48px rgba(15,29,38,.14);
  opacity:0;visibility:hidden;transition:opacity .14s}
.gk-uj .nav__csoport:hover .nav__lenyilo,
.gk-uj .nav__csoport:focus-within .nav__lenyilo{opacity:1;visibility:visible}
.gk-uj .nav__oszlopok{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 26px;
  align-items:start}
.gk-uj .nav__oszlop{display:flex;flex-direction:column;gap:3px;min-width:0}
.gk-uj .nav__ag{font-weight:800;font-size:.9rem;color:var(--ink);text-decoration:none}
.gk-uj .nav__ag:hover{text-decoration:underline}
.gk-uj .nav__level{font-size:.84rem;color:var(--ink-2);text-decoration:none;padding-left:2px}
.gk-uj .nav__level:hover{color:var(--ink);text-decoration:underline}
@media (max-width:1100px){.gk-uj .nav__lenyilo{min-width:min(560px,92vw)}
  .gk-uj .nav__oszlopok{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Mobil menu: agankent lenyilo. */
.gk-uj .menu__ag{border-top:1px solid var(--line);padding-top:6px}
.gk-uj .menu__ag>summary{cursor:pointer;list-style:none;font-weight:700;padding:8px 0;
  display:flex;justify-content:space-between;align-items:center}
.gk-uj .menu__ag>summary::-webkit-details-marker{display:none}
.gk-uj .menu__ag>summary::after{content:"+";color:var(--ink-3);font-weight:800}
.gk-uj .menu__ag[open]>summary::after{content:"–"}
.gk-uj .menu__ag a{display:block;padding:7px 0 7px 12px;font-size:.94rem;color:var(--ink-2)}
.gk-uj .menu__mind{font-weight:700;color:var(--ink)}

/* 23. „Tovabbi kategoriaink" kartya: a kartya a NALUNK levo kategoriara
       visz, a domain-felirat a testveroldalra. Ket kulon cel egy kartyan,
       ezert a kartya mar nem egyetlen <a>. A cim linkje teriti ki a teljes
       kartyat, a domain-link pedig folotte marad kattinthato. */
.gk-uj .mkartya{position:relative}
.gk-uj .mkartya__fo{color:inherit;text-decoration:none}
.gk-uj .mkartya__fo::after{content:"";position:absolute;inset:0;z-index:0}
.gk-uj .mkartya__fo:hover{text-decoration:underline}
.gk-uj a.mkartya__al{position:relative;z-index:1;display:inline-flex;align-items:center;
  gap:5px;text-decoration:none;font-weight:700}
.gk-uj a.mkartya__al:hover{text-decoration:underline}

/* 24. Termekcsomag (WooCommerce Product Bundles) tetelei a termekoldalon.
       A bovitmeny sajat markupot ad, amihez eddig nem irtunk stilust: a
       tetel-kepek fel oszlopot foglaltak, a valtozat-valaszto formazatlan
       tablazat volt, a mennyiseg-mezo melle pedig egy hosszu ures doboz
       nyult el. Sorba rendezzuk: kis kep balra, adatok jobbra. */
.gk-uj .bundled_product{display:grid;grid-template-columns:88px minmax(0,1fr);
  gap:16px;align-items:start;padding:14px 0;border-top:1px solid var(--line);
  margin:0;width:auto!important;float:none!important}
.gk-uj .bundled_product_images{width:88px!important;float:none!important;margin:0}
.gk-uj .bundled_product_images img{width:100%;height:auto;aspect-ratio:1;
  object-fit:contain;padding:4px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-s)}
@media (max-width:520px){
  .gk-uj .bundled_product{grid-template-columns:64px minmax(0,1fr);gap:12px}
  .gk-uj .bundled_product_images{width:64px!important}}
.gk-uj .bundled_product_summary{min-width:0}
.gk-uj .bundled_product .product_title,.gk-uj .bundled_product h3{font-size:.95rem!important;
  font-weight:800;margin:0 0 4px;text-transform:none;letter-spacing:0;line-height:1.35}
.gk-uj .bundled_product .price{font-size:.9rem!important;font-weight:700;color:var(--ink-2);margin:0}
.gk-uj .bundled_product .price .woocommerce-Price-amount{font-size:.9rem!important;
  font-weight:700;color:var(--ink-2)}
.gk-uj .bundled_product p.stock{font-size:.82rem;margin:4px 0 0}
.gk-uj .bundled_item_cart_details{margin-top:8px}
.gk-uj .bundled_product .variations{width:auto}
.gk-uj .bundled_product .variations th{width:auto;padding-right:10px;font-size:.85rem}
.gk-uj .bundled_product .variations select{max-width:280px}
.gk-uj .bundled_product .quantity{margin-top:6px}
.gk-uj .bundled_product .quantity .qty{height:40px;min-height:40px}
.gk-uj .bundled_product .quantity.buttons-added .minus,
.gk-uj .bundled_product .quantity.buttons-added .plus{height:40px;min-height:40px;width:36px}
.gk-uj .bundled_item_wrap>.woocommerce-variation{margin-top:6px}
.gk-uj .bundle_form .bundle_data{margin-top:10px}
.gk-uj .bundle_price .price{font-size:1.35rem;font-weight:800;color:var(--ink)}
/* A mennyiseg-mezo melle egy hosszu ures doboz nyult el: a bovitmeny ures
   valtozat-konteneret rajzolta ki. Osszehuzzuk, es a mezot szukre fogjuk. */
.gk-uj .bundled_product .quantity{display:inline-flex!important;width:auto!important}
.gk-uj .bundled_product .quantity input.qty{width:52px!important;max-width:52px!important}
.gk-uj .bundled_product .woocommerce-variation:empty,
.gk-uj .bundled_product .woocommerce-variation-description:empty,
.gk-uj .bundled_product .woocommerce-variation-price:empty,
.gk-uj .bundled_product .woocommerce-variation-availability:empty{display:none}
/* Kep nelkuli tetel: halvany helyorzo a fehér ures doboz helyett. */
.gk-uj .bundled_product_images:empty{background:var(--paper-2);border:1px solid var(--line);
  border-radius:var(--r-s);height:64px}

/* 25. Dupla keszlet-jelzes: a sajat jelvenyunk mellett a WooCommerce
       `p.stock` sora ES a woo-custom-stock-status bovitmeny sora is ott
       volt — harom helyen ugyanaz. A kosarban ez a termeknev aria-cimkejebe
       is beleragadt („… LEZERVAGO Keszleten eltavolitasa a kosarbol"). */
.gk-uj.gk-termek .tinfo .woo-custom-stock-status,
.gk-uj.gk-kosar .product-name .woo-custom-stock-status,
.gk-uj.gk-kosar td.product-name p.stock{display:none}

/* 26. Szallitasi koltseg jelzese a termekoldalon (kotelezo tajekoztatas). */
.gk-uj .szallitas-jelzes{margin:10px 0 0;font-size:.84rem;color:var(--ink-3);line-height:1.45}
.gk-uj .szallitas-jelzes a{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px}

/* 27. Tap-target meret mobilon. Merve: lablec-linkek 23 px, morzsa 15-16 px
       — a 24 px-es minimum alatt. Fuggoleges belso margoval 28+ px lesz,
       a sorkoz miatt latvanyban alig valtozik. */
@media (max-width:900px){
  .gk-uj .lab__nav a,.gk-uj .morzsa a,.gk-uj .lab__marka a{display:inline-block;
    padding-top:6px;padding-bottom:6px}
  .gk-uj .morzsa{gap:2px 8px}
}

/* 28. Ures, keretes dobozok a termekoldalon (Product Add-Ons es a
       valtozat-konténerek uresen is kirajzolodtak). */
.gk-uj .wc-pao-addon-container:empty,.gk-uj .wc-pao-addon-wrap:empty,
.gk-uj .woocommerce-variation:empty,.gk-uj .woocommerce-variation-add-to-cart:empty{display:none}

/* 29. Valtozat-valaszto: cimke felul, lekerekitett select — ugyanaz a
       forma, mint a tobbi mezone. A natív tablazat cellai elteroen alltak. */
.gk-uj form.cart table.variations{display:block;border:0}
.gk-uj form.cart table.variations tbody,.gk-uj form.cart table.variations tr{display:block}
.gk-uj form.cart table.variations th,.gk-uj form.cart table.variations td{display:block;
  width:100%;padding:0;border:0}
.gk-uj form.cart table.variations th{font-size:.85rem;font-weight:700;color:var(--ink-2);
  margin-bottom:5px}
.gk-uj form.cart table.variations tr+tr{margin-top:12px}

/* 30. Az elso ket sor termekkartya ne varjon a lazy-loadra: a lap tetejen
       ures helyek villantak be gorgetes kozben. */
.gk-uj .termekek--kat .termek-doboz:nth-child(-n+8) img,
.gk-uj .termekek--gep .termek-doboz:nth-child(-n+6) img{content-visibility:auto}

/* 31. Haromallapotu keszlet-jelveny. A „Hamarosan erkezik" 169 termeken
       allt, kozottuk 109 olyanon, ami SOHA nem kelt el — azok rendelesre
       kaphatok, nem „erkeznek". A ket allapot mas szint kap: a rendelheto
       (kosarba teheto) kek, a rendelesre (egyeztetes kell) halvany. */
.gk-uj .keszlet--rendelheto{color:var(--ink-2)}
.gk-uj .keszlet--rendelheto::before{background:var(--kek)}
.gk-uj .keszlet--rendelesre{color:var(--ink-3)}
.gk-uj .keszlet--rendelesre::before{background:var(--line)}

/* 32. Athuzott (akcio elotti) ar a kartyan. A `del` a vastag ar-sorban
       ugyanakkora es ugyanolyan sulyu volt, mint az ervenyes ar — csak a
       vekony vonal kulonboztette meg. Kisebb, halvany, nem felkover. */
.gk-uj .termek__ar del{font-size:.82rem;font-weight:500;color:var(--ink-3);
  text-decoration-thickness:1px}
.gk-uj .termek__ar del .woocommerce-Price-amount{font-size:inherit;font-weight:inherit;
  color:inherit}

/* 33. Mega-menu: a mai menu 3. szintje is kint van (10 tetel), es az agak
       OSZLOPFOLYAMBAN allnak. A grid soraiban a legmagasabb ag hatarozta meg
       a sormagassagot, ezert a panel 1306 px lett: 1280x720-on 6 ag esett a
       lathato resz ala ugy, hogy semmi nem jelezte. */
.gk-uj .nav__oszlopok{display:block;columns:4;column-gap:26px}
.gk-uj .nav__oszlop{display:block;break-inside:avoid;margin:0 0 8px}
.gk-uj .nav__ag,.gk-uj .nav__level{display:block}
       /* A `.nav a` 10/12-es belso margoja a felso menusorra valo: a
          panelben 43 px lett minden sor, ezert lett 1306 px a tartalom. */
       /* A szulo-kategoria kiemelt, az alkategoriak behuzva allnak alatta,
          vekony vezetovonallal — eddig csak a 3. szint volt behuzva, a 2.
          (pl. a Hopresek alkategoriai) a szuloval egy vonalban allt. */
       /* A `.gk-uj .nav a{font-weight:600}` erosebb volt a terv
          `.nav__ag{font-weight:800}` szabalyanal, ezert a szulo es a gyerek
          EGYFORMA vastag volt — a hierarchiat csak a meret jelezte. */
.gk-uj .nav a.nav__ag{padding:2px 6px 5px;font-size:.92rem;font-weight:800;
  color:var(--ink)}
.gk-uj .nav a.nav__level{font-weight:500;color:var(--ink-2)}
       /* A vezetovonal + a pirula-lekerekites egyutt „pille" alaku ivet
          rajzolt minden alkategoria melle: a bal oldali keret a 999px-es
          sarokkal holdsarlova hajlott. Vonal nincs, a behuzast a belso
          margo adja; a lekerekitest is levesszuk ezekrol a sorokrol. */
.gk-uj .nav a.nav__level{padding:3px 6px 3px 20px;border-radius:0}
       /* A harmadik szint ugyanugy nez ki, mint a masodik — csak beljebb
          all. Eddig kisebb es halvanyabb volt, ami a lezertisztitoknal ugy
          hatott, mintha mas tipusu tetel lenne. */
.gk-uj .nav a.nav__level--3{padding-left:36px;font-size:.84rem;color:var(--ink-2)}
       /* Escape-re zart allapot: a panel `:focus-within`-bol nyilik, ezert
          amig a fokusz a csoporton van, magatol nem csukodna be. */
.gk-uj .nav__csoport.nav__csoport--zart .nav__lenyilo{opacity:0;visibility:hidden}
@media (max-width:1100px){.gk-uj .nav__oszlopok{columns:2}}
       /* Alacsony ablaknal (1280x720) igy is maradhat egy ag a panel alja
          alatt. A klasszikus arnyek-jelzes: a felso/also arnyek CSAK akkor
          latszik, ha tenyleg van meg tartalom abban az iranyban. */
.gk-uj .nav__lenyilo{scrollbar-width:thin;
  background-image:linear-gradient(var(--paper) 30%,rgba(255,255,255,0)),
    linear-gradient(rgba(255,255,255,0),var(--paper) 70%),
    radial-gradient(farthest-side at 50% 0,rgba(15,29,38,.14),rgba(15,29,38,0)),
    radial-gradient(farthest-side at 50% 100%,rgba(15,29,38,.14),rgba(15,29,38,0));
  background-position:0 0,0 100%,0 0,0 100%;background-repeat:no-repeat;
  background-size:100% 30px,100% 30px,100% 12px,100% 12px;
  background-attachment:local,local,scroll,scroll}

/* 34. Mobil menu: teljes kepernyos retegben. Eddig a lap tetejere ult ki,
       a kinyitott agakkal a kepernyo ala logott, es nem volt bezaro gombja. */
@media (max-width:900px){
  .gk-uj .menu__lista{position:fixed;inset:0;top:0;height:100dvh;overflow-y:auto;
    padding:0 var(--pad) 28px;z-index:200;box-shadow:none;border-bottom:0}
}
.gk-uj .menu__fej{position:sticky;top:0;z-index:2;background:var(--paper);
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 0;border-bottom:1px solid var(--line);font-weight:800}
.gk-uj .menu__bezar{width:44px;height:44px;border:0;background:transparent;
  font-size:1.9rem;line-height:1;color:var(--ink);cursor:pointer}
.gk-uj .menu__lista a{min-height:44px;display:flex;align-items:center}
.gk-uj .menu__alag{padding-left:12px}
.gk-uj .menu__alag>summary{cursor:pointer;list-style:none;font-weight:700;
  font-size:.94rem;color:var(--ink-2);min-height:44px;display:flex;
  align-items:center;justify-content:space-between}
.gk-uj .menu__alag>summary::-webkit-details-marker{display:none}
.gk-uj .menu__alag>summary::after{content:"+";color:var(--ink-3);font-weight:800}
.gk-uj .menu__alag[open]>summary::after{content:"–"}
       /* A hamburger nyitott allapotanak sotet stilusa (`.menu[open] summary`)
          a panelen BELULI osszecsukhato agakra is ratelepedett: minden ag
          sotet pirula lett feher szoveggel. */
.gk-uj details.menu[open] .menu__ag>summary,
.gk-uj details.menu[open] .menu__alag>summary{background:none;color:var(--ink);
  border:0;border-radius:0;padding:8px 0;display:flex;justify-content:space-between;
  align-items:center}
.gk-uj details.menu[open] .menu__alag>summary{color:var(--ink-2);font-size:.94rem;
  min-height:44px}

/* 35. Ugras a tartalomra. A tema sajat linkje a menu MOGOTT allt, asztalon
       ~70 Tab utan jott elo — gyakorlatilag hasznalhatatlanul. */
.gk-uj .gk-ugras{position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap}
.gk-uj .gk-ugras:focus{position:fixed;top:10px;left:10px;width:auto;height:auto;
  clip:auto;z-index:300;background:var(--ink);color:#fff;padding:10px 18px;
  border-radius:10px;font-weight:700;text-decoration:none}

/* 36. Termekcsomag-oldal. A fix darabszamu teteleknel a tema mennyiseg-
       leptetoje szam nelkuli „− +" part rakott a rejtett mezo melle; most
       a darabszam all ott szovegkent. A keszlet-sort pedig a sajat
       `.tinfo p.stock{display:none}` szabalyunk nyomta el a csomag-
       teteleknel is — ott viszont ez az EGYETLEN keszlet-jelzes. */
.gk-uj .quantity_hidden .minus,.gk-uj .quantity_hidden .plus{display:none}
.gk-uj .gk-db{font-size:.86rem;font-weight:600;color:var(--ink-2);white-space:nowrap}
.gk-uj.gk-termek .tinfo .bundled_item_cart_details p.stock{display:block}
       /* Az osszeallito lepeseiben ugyanez: az „Elfogyott" ott az EGYETLEN jelzes
          (2026-10-12: az ORCA bogre lepesen csak egy pont latszott a helyen). */
.gk-uj.gk-termek .tinfo .composite_form .component p.stock.out-of-stock{display:block;margin:10px 0 0;
  padding:9px 12px;border-radius:var(--r-s);background:#FDECEC;color:#9B1C1C;font-size:.86rem;font-weight:600;line-height:1.4}

/* 37. Ures kategoria: a menu szerint ide tartozo agak csempekent. A
       „Gasztronomia" a taxonomiaban ures, a menuben ot ag log alatta. */
.gk-uj .kat-atjaro{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.gk-uj .kat-atjaro__elem{display:inline-flex;align-items:center;min-height:44px;
  padding:10px 16px;border:1px solid var(--line);border-radius:var(--r-pill);
  background:var(--paper);font-weight:700;font-size:.92rem;color:var(--ink);
  text-decoration:none}
.gk-uj .kat-atjaro__elem:hover{border-color:var(--ink);background:var(--paper-2)}

/* 38. Erintheto meret. A jelolonegyzetek es radiogombok 13x13-asok voltak
       (kategoria-szuro, penztar ASZF/ceges/szallitas/fizetes, addon-ok):
       telefonon ez a 44 px-es ajanlas harmada. A vezerlo maga 18 px, a
       kattinthato sor pedig 44 px magas. */
.gk-uj input[type="radio"],.gk-uj input[type="checkbox"]{width:18px;height:18px;
  min-width:18px;accent-color:var(--ink)}
.gk-uj .szuro label,.gk-uj .addon label,.gk-uj .wc-pao-addon-wrap label,
.gk-uj .woocommerce-shipping-methods label,.gk-uj .wc_payment_methods label,
.gk-uj .woocommerce-form__label-for-checkbox{min-height:44px;display:flex;
  align-items:center;gap:10px}

/* 39. Horgonyra ugras a ragados fejlec alol. A `#gk-ajanlat` cime a 97 px-es
       fejlec ala kerult, amikor a termekoldalrol odakattintottak. */
.gk-uj [id]{scroll-margin-top:110px}

/* 40. A kategoria darabszama kikerult a H1-bol — igy kulon sorkent all. */
.gk-uj .szam--h1{margin-top:6px;font-size:.9rem;font-weight:600;color:var(--ink-3)}

/* 41. Jogi oldalak: a beagyazott ASZF tablazatai telefonon 1579 px szelesek
       egy 338 px-es hasabban — a jobb oszlop (a szallitasi dijak!) levagva.
       Sajat vizszintes gorgetest kapnak, a szoveg valtozatlan. */
.gk-uj .szoveges table{display:block;max-width:100%;overflow-x:auto;
  -webkit-overflow-scrolling:touch}
@media (max-width:700px){.gk-uj .szoveges table{font-size:.86rem}}

/* 42. Teny-sav: a 12ch-os korlat a „bemutatoterem" szot (13 betu) kettevagta
       — „bemutatotere / m es szerviz" allt a kezdolapon. */
.gk-uj .hero__pontok span{max-width:16ch;overflow-wrap:normal;word-break:normal}

/* A jelveny ERTEKE egy sorban marad: a harom hasab a cimkek hosszahoz
   igazodik, es a leghosszabb ket cimke mellett a 100% magyar kettetort. */
.gk-uj .hero__pontok b{white-space:nowrap}

/* 43. Tehetetlen „Kosarba teszem". A WooCommerce csak OSZTALYT tesz a
       gombra (`disabled`), attributumot nem — a terv gomb-stilusa alatt ez
       ugy nezett ki, mint egy mukodo gomb: a „Csak rendelesre" gepnel a
       kattintas nem csinal semmit. */
.gk-uj .single_add_to_cart_button.disabled,
.gk-uj .single_add_to_cart_button.wc-variation-is-unavailable,
.gk-uj .single_add_to_cart_button[disabled]{opacity:.45;cursor:not-allowed;
  box-shadow:none}

/* 44. „Miert valassz minket?" — a ceges-elonyok plugin adata a terv
       arculataban. A bovitmeny sajat blokkja a lap aljara, a szekcio-
       kereten KIVULRE kerult, teljes szelessegben, nagy zold karikakkal;
       a sajat CSS-e nem ert el idaig. Itt ket hasab: balra az altalanos
       pontok, jobbra a geptipus-fuggo kedvezmenyek kartyaja. */
.gk-uj .elonyok{display:grid;grid-template-columns:1.35fr .85fr;gap:26px;align-items:start}
.gk-uj .elonyok__lista{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;
  list-style:none;margin:0;padding:0}
.gk-uj .elonyok__lista li,.gk-uj .elonyok__kedv li{display:flex;gap:10px;
  align-items:flex-start;font-size:.95rem;color:var(--ink-2);line-height:1.45}
.gk-uj .elonyok__lista .ikon,.gk-uj .elonyok__kedv .ikon{width:18px;height:18px;
  flex:0 0 18px;margin-top:2px;color:var(--kek)}
.gk-uj .elonyok__kedv{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:22px 22px 24px}
.gk-uj .elonyok__kedv h3{font-size:1.02rem;font-weight:800;color:var(--ink);
  margin:4px 0 14px;line-height:1.3}
.gk-uj .elonyok__kedv ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gk-uj .elonyok__kedv li{font-weight:600;color:var(--ink)}
.gk-uj .elonyok--csak-lista{grid-template-columns:1fr}
.gk-uj .elonyok--csak-lista .elonyok__lista{grid-template-columns:repeat(3,1fr)}
@media (max-width:1100px){.gk-uj .elonyok--csak-lista .elonyok__lista{
  grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.gk-uj .elonyok{grid-template-columns:1fr;gap:20px}
  .gk-uj .elonyok--csak-lista .elonyok__lista{grid-template-columns:1fr}
  .gk-uj .elonyok__lista{grid-template-columns:1fr;gap:11px}}
       /* Ha a bovitmeny horgat megis lefutna (pl. mas prioritason), a sajat
          oldalunkon akkor se lassuk ketszer. */
.gk-uj .ceges-elonyok-box{display:none}

/* 45. A termekoldal `main` burka. A tema `.site-content`-je FLEX, es egy
       sima `main` nulla szeles flex-elem lett — a teljes szelessegu
       szekciok `calc(50% - 50vw)` margoja igy -720 px-et adott, vagyis a
       lap fele kicsuszott balra. (A tobbi sablonnal ez nem tortent meg: ott
       a `main` MAGA a `.gk-uj` burok.) */
.gk-fo{flex:1 1 100%;width:100%;min-width:0}

/* 46. Nem megveheto valtozat: a „Kosarba teszem" es a mennyiseg-lepteto
       eltunik, marad az „Ertesitest kerek". Eddig egy kikapcsolt gomb allt
       az ertesites mellett, telefonon a lepteto ala csuszva. A `:has()` a
       JS nelkuli tartalek; a jelzo-osztalyt a termekoldal scriptje teszi ki. */
       /* Vissza-valtaskor a WooCommerce BESOROLT `display:block`-kal hozza
          vissza a mennyiseg-valasztot — a sajat `inline-flex`-unket felulirja,
          ezert a „−", a mezo es a „+" egymas ala csuszott egy keskeny
          dobozban. A `hidden` osztalyt (pl. egyesevel arusitott termek)
          nem bantjuk. */

/* 55. A CSOMAG-URLAP NEM vasarlas-sor. A `.gk-uj form.cart{display:flex}`
       a sima es a valtozatos terméknel a mennyiseg+gomb sorat rendezi —
       csomagnal viszont az EGESZ csomag (tetelek, osszesito, gomb) lett
       flex-sor, es a tetelek keskeny oszlopokba csusztak, betunkent tort
       szoveggel. Csomagnal/osszeallitasnal/csoportos terméknel blokk. */
       /* A tema BESOROLT stiluslapja is flexre allitja a kosar-urlapot
          (`.woocommerce div.product.do-quantity-buttons form.cart`), es az
          erosebb szelektor — ezert kell az `!important`. */
.gk-uj form.cart.bundle_form,
.gk-uj form.cart.composite_form,
.gk-uj form.cart.grouped_form{display:block!important}
.gk-uj form.cart.bundle_form .bundled_product,
.gk-uj form.cart.composite_form .component{width:100%;max-width:100%}
       /* A csomag sajat vasarlas-sora (mennyiseg + gomb) marad flex. */
       /* 58. Csomag meretracs szamlaloja (GK_Csomag_Darab): „Pamut polo 23 / 35”. */
       /* Kep nelkuli csomagtetel (meretsor): egy sor, balra a nev, jobbra a darabszam;
          a „Meret: S” sor rejtve, mert a meret a cimben all (egyetlen engedelyezett valtozat). */
.gk-uj .csomag__lista .bundled_product:not(:has(.bundled_product_images)){display:block!important;padding:8px 0!important}
.gk-uj .csomag__lista .bundled_product:not(:has(.bundled_product_images)) .details{display:flex!important;
  align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap}
.gk-uj .csomag__lista .bundled_product:not(:has(.bundled_product_images)) .bundled_product_title{margin:0!important;
  font-size:.9rem!important;flex:1 1 auto;min-width:0}
.gk-uj .csomag__lista .bundled_product:not(:has(.bundled_product_images)) .variations{display:none!important}
.gk-uj .csomag__lista .bundled_product:not(:has(.bundled_product_images)) .details > .cart{flex:0 0 auto;margin:0!important}
.gk-uj .gk-darab{margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--paper-2);display:grid;gap:6px;transition:box-shadow .2s}
.gk-uj .gk-darab__sor{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin:0;font-size:.9rem;color:var(--ink-2)}
.gk-uj .gk-darab__cim{font-weight:700;color:var(--ink)}
.gk-uj .gk-darab__szam{font-weight:800;color:var(--ink)}
.gk-uj .gk-darab__uzenet{font-size:.84rem}
.gk-uj .gk-darab__sor--jo .gk-darab__uzenet{color:#1a7f37;font-weight:700}
.gk-uj .gk-darab--jelez{box-shadow:0 0 0 3px #f2b8b5}
.gk-uj form.cart.bundle_form .bundle_button,
.gk-uj form.cart.composite_form .composite_button{display:flex;flex-wrap:wrap;
  gap:10px;align-items:center;margin-top:14px}
/* 57. OSSZEALLITOTT TERMEK, LAPOZOS ELRENDEZES (variálható GO-POD csomagok).
       A Composite Products nativ lepesei es osszegzoje, a terv nyelven:
       fent lepessav, alul EGY navigacio (a felso es a valasztas melletti
       „movable" duplikatum rejtve), az opciok kartyak, egy arral. Az arak
       tisztitasa PHP-ben: GK_Osszeallitott::ar(). */
       /* A bovitmeny keskeny urlapon (small_width) elrejti a lepessavot —
          nalunk a termekoldal jobb hasabja asztalon is ilyen keskeny. */
.gk-uj .composite_pagination{display:block!important;margin:20px 0 8px}
.gk-uj .composite_pagination .pagination_elements{display:flex;gap:6px;padding:0;margin:0}
       /* A bovitmeny nyil alaku, szurke hatteru lepeseit (li:before/:after) kikapcsoljuk. */
.gk-uj .composite_form .composite_pagination ul li{background:none!important;border:0!important;position:static!important}
.gk-uj .composite_form .composite_pagination ul li::before,
.gk-uj .composite_form .composite_pagination ul li::after{content:none!important;display:none!important}
.gk-uj .composite_form .composite_pagination ul li .element_inner{display:flex!important;max-width:none}
.gk-uj .composite_pagination .pagination_element{flex:1 1 0;min-width:0;margin:0;padding:0}
.gk-uj .composite_pagination .element_inner{display:flex;flex-direction:column;gap:6px;
  font-size:.76rem;line-height:1.25;color:var(--ink-3)}
.gk-uj .composite_pagination .element_inner::before{content:"";display:block;height:5px;
  border-radius:5px;background:var(--line)}
.gk-uj .composite_pagination .pagination_element_current .element_inner{color:var(--ink);font-weight:700}
.gk-uj .composite_pagination .pagination_element_current .element_inner::before{background:var(--ink)}
.gk-uj .composite_pagination .element_index{display:none}
.gk-uj .composite_pagination .element_title{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gk-uj .composite_pagination .element_link{color:inherit;text-decoration:none;font-weight:inherit}
@media (max-width:640px){
  .gk-uj .composite_pagination .element_title{display:none}
  .gk-uj .composite_pagination .pagination_element_current .element_title{display:block;overflow:visible}
  .gk-uj .composite_pagination .pagination_element_current{flex:3 1 0}
}
.gk-uj .composite_navigation.top,
.gk-uj .composite_navigation.movable{display:none!important}
.gk-uj .composite_navigation .composite_navigation_inner{display:flex;gap:10px;align-items:stretch;margin:22px 0 0}
       /* !important: a bovitmeny sajat CSS-e float:right-ot es fix szelesseget
          ad (merve 142 px), erosebb szelektorral — a szoveg kilogott. */
.gk-uj .composite_navigation .page_button{display:inline-flex!important;align-items:center;justify-content:center;
  min-height:52px;padding:0 20px!important;border-radius:var(--r-pill);font-weight:700;font-size:.92rem;
  line-height:1.2;text-align:center;text-decoration:none;float:none!important;width:auto!important;
  max-width:none!important;margin:0!important;white-space:normal;position:static!important}
.gk-uj .composite_navigation .page_button::after{content:none!important;display:none!important}
.gk-uj .composite_navigation .page_button.invisible{display:none!important}
.gk-uj .composite_navigation .page_button.next{flex:0 0 auto!important;margin-left:auto!important;min-width:168px;
  background:var(--ink)!important;color:#fff!important;border:2px solid var(--ink)}
       /* A gombon csak az irany: a kovetkezo lepes cime a lepessavban all, es
          mobilon nem fert ki a gombba. A ::before minden orokolt pozicionalast
          elveszit (egy ikon-szabaly abszolutra tette, a szoveg mashova csuszott). */
.gk-uj .composite_navigation .page_button.next{font-size:0!important}
.gk-uj .composite_navigation .page_button,
.gk-uj .composite_navigation .page_button::before{font-family:inherit!important}
.gk-uj .composite_navigation .page_button::before{position:static!important;display:inline!important;
  width:auto!important;height:auto!important;background:none!important;transform:none!important;
  font-size:.95rem!important;line-height:1.2;margin:0!important}
.gk-uj .composite_navigation .page_button.next::before{content:"Tovább ›"!important}
.gk-uj .composite_navigation .page_button.prev{flex:0 0 auto!important;border:2px solid var(--ink);color:var(--ink)!important;
  background:transparent!important;font-size:0!important;min-width:112px}
.gk-uj .composite_navigation .page_button.prev::before{content:"‹ Vissza"!important}
.gk-uj .composite_component .component_title_wrapper .component_title{font-size:1.3rem;margin:6px 0 6px;
  line-height:1.25;color:var(--ink)}
.gk-uj .composite_component .component_description{font-size:.92rem;color:var(--ink-2);margin:0 0 12px}
.gk-uj .composite_component .component_section_title{font-size:.82rem;font-weight:700;color:var(--ink-3);
  margin:14px 0 8px;text-transform:uppercase;letter-spacing:.06em}
.gk-uj .component_option_thumbnails_container{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;margin:0!important;padding:0!important;list-style:none}
@media (max-width:640px){
  .gk-uj .component_option_thumbnails_container{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.gk-uj .component_option_thumbnail_container{width:auto!important;margin:0!important;float:none!important;
  clear:none!important;padding:0!important}
.gk-uj .component_option_thumbnail{height:100%;display:flex;flex-direction:column;gap:8px;padding:10px;
  border:1px solid var(--line);border-radius:var(--r-s);background:var(--paper);text-align:left;cursor:pointer;
  transition:border-color .15s,box-shadow .15s}
.gk-uj .component_option_thumbnail:hover{border-color:var(--ink-3)}
       /* Az egesz kartya valasszon: a Composite csak a kep linkjere es a
          gombra figyel, ezert a linket kifeszitjuk a kartyara (a gomb folotte). */
.gk-uj .component_option_thumbnail{position:relative}
.gk-uj .component_option_thumbnail .component_option_thumbnail_link::after{content:"";position:absolute;inset:0;z-index:1}
.gk-uj .component_option_thumbnail .thumbnail_buttons{position:relative;z-index:2}
.gk-uj .component_option_thumbnail.selected{border:2px solid var(--ink);padding:9px;box-shadow:0 0 0 3px var(--kek-tint)}
.gk-uj .component_option_thumbnail .thumbnail_image{margin:0}
.gk-uj .component_option_thumbnail .thumbnail_image img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;
  border-radius:8px;margin:0}
.gk-uj .component_option_thumbnail .thumbnail_description{display:flex;flex-direction:column;gap:6px;flex:1}
.gk-uj .component_option_thumbnail .thumbnail_title{font-size:.8rem!important;font-weight:700;line-height:1.3!important;
  text-transform:none;letter-spacing:0;color:var(--ink);margin:0!important;padding:0!important}
.gk-uj .component_option_thumbnail .thumbnail_price{font-size:.86rem;margin:0;text-align:left}
.gk-uj .component_option_thumbnail .thumbnail_buttons{margin-top:auto}
.gk-uj .component_option_thumbnail .component_option_thumbnail_select{width:100%;min-height:40px;padding:0 10px;
  font-size:.82rem;border-radius:var(--r-pill);margin:0}
.gk-uj .component_option_thumbnail.selected .thumbnail_buttons{visibility:hidden}
.gk-uj .composite_form .gk-ar{display:block;font-weight:800;color:var(--ink)}
.gk-uj .composite_form .gk-netto{display:block;font-size:.78rem;font-weight:500;color:var(--ink-3)}
       /* A fejlec-arban a `.ar .price .woocommerce-Price-amount` szabaly minden
          osszeget nagyra allit — a nettot is (2026-10-12, felhasznaloi jelzes). */
.gk-uj .ar .price .gk-netto{font-size:.95rem;font-weight:600;color:var(--ink-2)}
.gk-uj .ar .price .gk-artol--rag{margin-left:1px}
.gk-uj .ar .price .gk-ar-megj{display:block;margin-top:4px;font-size:.82rem;font-weight:500;color:var(--ink-3);line-height:1.4}
.gk-uj .ar .price .gk-netto .woocommerce-Price-amount{font-size:inherit;font-weight:inherit;color:inherit;letter-spacing:0}
       /* Futo ar a lepesgombok folott (GK_Osszeallitott::lepesvaltas_szkript). */
.gk-uj .gk-futo{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;
  margin:22px 0 0;padding:12px 16px;border-radius:var(--r-s);background:var(--paper-2);border:1px solid var(--line)}
.gk-uj .gk-futo__cim{font-size:.86rem;font-weight:600;color:var(--ink-2)}
.gk-uj .gk-futo__ar{font-size:1.15rem;font-weight:800;color:var(--ink);white-space:nowrap}
.gk-uj .gk-futo__netto{font-size:.8rem;font-weight:500;color:var(--ink-3);margin-left:6px}
.gk-uj .gk-futo__benne{flex:1 0 100%;font-size:.8rem;font-weight:500;color:var(--ink-2);line-height:1.45}
.gk-uj .gk-futo__benne:empty{display:none}
.gk-uj .gk-futo + .composite_navigation{margin-top:0!important;padding-top:0!important}
       /* A Composite tarolója `overflow:hidden` — a kivalasztott kartya
          kerete 5 px-szel kilogott, levagta (2026-10-12, felhasznaloi jelzes). */
.gk-uj .composite_form .component_options{overflow:visible!important;padding-bottom:6px}
       /* Lepeshiba: miert nem lehet tovabblepni (GK_Osszeallitott). */
.gk-uj .gk-lepeshiba{margin:14px 0 0;padding:10px 14px;border-radius:var(--r-s);background:#FDECEC;color:#9B1C1C;
  font-size:.88rem;font-weight:600;line-height:1.45}
.gk-uj .gk-lepeshiba ul{margin:4px 0 0;padding-left:18px}
.gk-uj .gk-lepeshiba[hidden]{display:none}
       /* Kotelezo dontes es elfogyott lepes (GK_Osszeallitott_Dontes). */
.gk-uj .gk-dontes-nem{display:inline-flex;align-items:center;margin:12px 0 0;padding:10px 16px;border:1.5px dashed var(--ink-3);
  border-radius:var(--r-pill);background:#fff;color:var(--ink);font-family:inherit;font-size:.9rem;font-weight:600;line-height:1.2;cursor:pointer}
.gk-uj .gk-dontes-nem.is-akt{border-style:solid;border-color:var(--ink);background:var(--kek-tint)}
.gk-uj .gk-dontes-nem.is-akt::before{content:"✓ ";font-weight:800}
.gk-uj .gk-ures-lepes{margin:6px 0 10px;padding:10px 14px;border-radius:var(--r-s);background:var(--paper-2);color:var(--ink-2);font-size:.9rem;font-weight:500}
.gk-uj .gk-futo + .composite_navigation .composite_navigation_inner{margin-top:12px}
.gk-uj .composite_form .component_option_each{font-weight:500;font-size:.85em;color:var(--ink-2)}
.gk-uj .composite_form del,
.gk-uj .composite_form del + .screen-reader-text{display:none!important}
.gk-uj .composite_form ins{text-decoration:none;background:none}
.gk-uj .composite_form .component_summary{margin:14px 0 0}
       /* A „Nem kerem” (clear) link a szakaszcim osztalyat is viseli — ne legyen nagybetus. */
.gk-uj .composite_form .clear_component_options_wrapper{text-transform:none;letter-spacing:0;margin:8px 0 0}
.gk-uj .composite_form .clear_component_options{font-weight:700;color:var(--ink);text-decoration:underline;
  text-underline-offset:3px;font-size:.88rem}
.gk-uj .composite_form .component_summary .summary_content:not(.populated){display:none!important}
.gk-uj .composite_form .component_summary .summary_content{border:1px solid var(--line);border-radius:var(--r-s);
  padding:12px 14px;background:var(--paper-2)}
       /* Valasztogombos osszetevo: a „Te valasztasod” doboz ugyanazt ismetelne, amit a
          gomb mutat — rejtve, KIVEVE ha mennyiseget vagy valtozatot kell benne megadni. */
.gk-uj .composite_component.options-style-radios .component_summary:not(:has(.variations)):not(:has(.quantity input:not([type=hidden]))){display:none!important}
.gk-uj .composite_summary .summary_title{font-size:1.3rem;margin:6px 0 12px}
       /* Egy oszlop: a termekoldal jobb hasabja asztalon is keskeny (~350 px). */
.gk-uj .composite_summary .summary_elements{display:grid!important;grid-template-columns:1fr;
  gap:10px;padding:0!important;margin:0 0 14px!important}
@media (max-width:640px){
  .gk-uj .composite_summary .summary_elements{grid-template-columns:1fr}
}
.gk-uj .composite_summary .summary_element{width:auto!important;float:none!important;margin:0!important;padding:0!important}
.gk-uj .composite_summary .summary_element_wrapper{border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px;
  height:auto!important}
       /* Tomor sor: kep balra, alatta-mellette a lepes, a valasztas es az ar. */
.gk-uj .composite_summary .summary_element_wrapper_inner{display:grid!important;grid-template-columns:56px minmax(0,1fr);
  column-gap:12px;row-gap:2px;align-items:center;text-align:left!important}
.gk-uj .composite_summary .summary_element_wrapper_inner > *{float:none!important;width:auto!important;
  margin:0!important;padding:0!important;text-align:left!important}
.gk-uj .composite_summary .summary_element_selection .content_product_title{text-transform:none;font-size:.86rem;
  line-height:1.3;display:block}
.gk-uj .composite_summary .summary_element_image.summary_element_data{grid-row:1 / span 4;grid-column:1}
.gk-uj .composite_summary .summary_element_image img{width:56px;height:56px;object-fit:contain;border-radius:8px;margin:0}
.gk-uj .composite_summary .summary_element_data{grid-column:2;margin:0;text-align:left;padding:0}
.gk-uj .composite_summary .summary_element_title .title{font-size:.76rem;font-weight:700;color:var(--ink-3);margin:0;
  text-transform:uppercase;letter-spacing:.05em}
.gk-uj .composite_summary .summary_element_selection{font-size:.88rem;font-weight:700;color:var(--ink)}
.gk-uj .composite_summary .summary_element_price{font-size:.86rem}
       /* Az osszegzo „Szerkesztes / Megtekintes” gombja szerenyebb link — a
          fo cselekves a Kosarba gomb. */
.gk-uj .composite_summary .summary_element_wrapper .button{background:none!important;color:var(--ink)!important;
  border:0!important;padding:0!important;min-height:0!important;font-size:.84rem;font-weight:700;
  text-decoration:underline;text-underline-offset:3px;box-shadow:none!important}

/* 56. CSOMAG-TERMEK: „mi van a dobozban" lista. A bovitmeny a teteleket
       burok es cim nelkul, egymas utan irja ki — a tervben ez egy kartya:
       fejlec a tetelszammal, alatta a tetelek sorai, legalul az osszesito
       es a gomb. A burkot es a fejlecet a `woocommerce_before_bundled_items`
       horogra tesszuk (GK_Termek::csomag_fej). */
.gk-uj .csomag{margin:16px 0 0;border:1px solid var(--line);border-radius:var(--r);
  background:var(--paper);overflow:hidden}
.gk-uj .csomag__fej{display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:14px 18px;background:var(--paper-2);
  border-bottom:1px solid var(--line)}
.gk-uj .csomag__fej .kicker{margin:0}
.gk-uj .csomag__db{font-size:.78rem;font-weight:700;color:var(--ink-3);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:2px 10px;white-space:nowrap}
.gk-uj .csomag__lista{padding:0 18px}
       /* A tetel-sor SURU: kep balra, adatok jobbra, a darabszam a sor
          jobb szelen. Eddig minden tetel kulon mini-termekkartya volt
          (181 px magas sorok, het darab „1 db" pirula es hetszer a
          „Keszleten"), amitol a het tetel 1282 px-re nyult. */
.gk-uj .csomag__lista .bundled_product{padding:16px 0;align-items:start;
  grid-template-columns:112px minmax(0,1fr);column-gap:14px}
       /* 2026-09-23: a kep MERT merete 22 px volt a vasarlonal, nem 46. Egy
          cookie-elfogadas utan betoltodo lap `max-width:50%`-ot ad erre a
          dobozra, ami a racs-oszlop FELERE vagja — es a `width:!important`
          nem hat ra, meg `html body` specifikussaggal sem. Ezert kell a
          max-width kioltasa; enelkul barmilyen szelesseg-allitas hatastalan. */
.gk-uj .csomag__lista .bundled_product_images{width:112px!important;max-width:none!important}
       /* NINCS racs. Ket menetben is kiderult, hogy a ket oszlopos racs
          bizonyos szelessegeknel 0 px-re nyomja a cim oszlopat (betunkent
          tordelt, 780 px magas cim). A cim MINDIG teljes szelessegu, alatta
          a valtozat/ar/darabszam jobbra zarva — ez nem tud osszeesni. */
.gk-uj .csomag__lista .details{display:block;min-width:0}
.gk-uj .csomag__lista .details > .cart{margin-top:4px;text-align:right}
.gk-uj .csomag__lista .details > .cart.variations_form{display:flex;
  align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}
.gk-uj .csomag__lista .details > .cart.variations_form > *{margin:0}
.gk-uj .csomag__lista .details > .bundled_product_title{margin:0 0 2px}
       /* A valtozat-tablazat alapbol 100%-os (a termekoldali valaszto
          miatt) — a csomag-tetelben ettol tortek uj sorba a darabszam. */
.gk-uj .csomag__lista .details > .cart.variations_form .variations{width:auto;
  flex:0 1 auto;min-width:0;margin:0}
.gk-uj .csomag__lista .details > .cart.variations_form .quantity,
.gk-uj .csomag__lista .details > .cart.variations_form .quantity_hidden{margin-left:auto}
       /* Telefonon a cim kapja a teljes szelesseget, a darabszam alatta,
          jobbra zarva. A blokk SZANDEKOSAN a tobbi csomag-szabaly UTAN all:
          a `.cart{grid-column:2}` kulonben felulirna, es a cim oszlopa
          megint 0 px-re esne (betunkent tordelt, 780 px magas cim). */
       /* A keszlet-ertesito gomb a csomag-tetelben halkabb: a lista kozepen
          egy nagy sotet pirula elvitte a figyelmet a csomagrol. */
.gk-uj .csomag__lista .woocommerce-variation-availability .cwg_popup_submit,
.gk-uj .csomag__lista .cwg_popup_submit{background:none;color:var(--ink-2);
  border:1px solid var(--line);font-size:.8rem;font-weight:700;padding:6px 12px;
  min-height:0}
.gk-uj .csomag__lista .woocommerce-variation-availability .cwg_popup_submit:hover,
.gk-uj .csomag__lista .cwg_popup_submit:hover{background:var(--paper-2);
  color:var(--ink);border-color:var(--ink-3)}
       /* Fix darabszamnal ne pirula-vezerlo legyen, csak egy halvany szam.
          A tema a „−" es a „+" jelet PSZEUDO-ELEMKENT rajzolja a
          `.quantity`-re (nem `<a>`-kent), ezert latszott fix tetelnel is egy
          fel pirula szam-vezerlo. */
.gk-uj .csomag__lista .quantity_hidden{border:0;background:none;padding:0;
  min-height:0;display:inline}
.gk-uj .quantity_hidden::before,.gk-uj .quantity_hidden::after{content:none!important;
  display:none!important}
.gk-uj .csomag__lista .quantity_hidden .gk-db{font-size:.85rem;font-weight:700;
  color:var(--ink-3)}
       /* „Keszleten" nem informacio — minden masodik sorban ugyanaz. Csak a
          KIVETEL latszik (elorendelheto, csak rendelesre). */
.gk-uj .csomag__lista p.stock.in-stock{display:none!important}
.gk-uj .csomag__lista .bundled_product:first-child{border-top:0}
       /* EZ TORTE SZET A SORT BEJELENTKEZVE. A bovitmeny sajat CSS-e a
          `div.bundled_product_summary:before/:after{display:table;clear:both}`
          clearfixet teszi a sorra. Racsban a pszeudo-elem IS racs-elem: elvitte
          az elso cellat, igy a kep a 2. oszlopba, az adatok a 2. SORBA, a 64 px-es
          oszlopba csusztak — a cim 27 px szeles lett (betunkent tordelt).
          Kijelentkezve nem latszott: a Perfmatters „nem hasznalt CSS” szures
          kidobta ezeket a szabalyokat, bejelentkezve viszont nem fut az optimalizalas.
          Ezert a pszeudo-elemeket kiiktatjuk ES a ket gyereket fix cellaba tesszuk,
          hogy egy jovobeli idegen racs-elem se tudja elcsusztatni. */
.gk-uj .csomag__lista .bundled_product::before,
.gk-uj .csomag__lista .bundled_product::after{content:none!important;display:none!important}
.gk-uj .csomag__lista .bundled_product_images{grid-column:1;grid-row:1;float:none!important}
.gk-uj .csomag__lista .details{grid-column:2;grid-row:1;float:none!important;
  width:auto!important;padding:0!important}
       /* Tovabbi harom elteres a bejelentkezett (nem optimalizalt) nezetben,
          ugyanebbol a forrasbol: a bovitmeny lebegteti a darabszamot (igy a
          jobbra zaras nem fogta meg), `!important`-tal lathatova teszi a
          „Torles” hivatkozast akkor is, ha nincs mit torolni, es egy ikont
          rajzol a cim utani hivatkozasra. Kijelentkezve mindharom szabalyt
          kiszuri a Perfmatters — itt kezzel egysegesitjuk a ket nezetet. */
.gk-uj .csomag__lista .quantity,
.gk-uj .csomag__lista .quantity_hidden{float:none!important}
.gk-uj .csomag__lista .variations a.reset_variations{display:none!important}
.gk-uj .csomag__lista .bundled_product_title a.bundled_product_permalink{display:none!important}
       /* 320-400 px: a 64 px-es kiskep es a 18 px-es oldalpad egyutt tobb
          mint 100 px-t vesz el a cim elol, ezert egy 69 karakteres nev hat
          sorra tort. Keskeny kepernyon kisebb kep, szukebb pad, kisebb betu. */
       /* 2026-09-23: a 48 px-es szukites TOROLVE. A fenti felelem (69 karakteres
          nev hat sorra tort) 112 px-nel NEM jon elo: 390 px-es nezetben merve a
          cimsorok szama valtozatlan (2/1/2/2/2). A szukites 88 px-nel volt jogos. */
@media (max-width:400px){
  .gk-uj .csomag__lista{padding:0 12px}
  .gk-uj .csomag__lista .bundled_product_title{font-size:.88rem!important;
    line-height:1.3}
}
       /* A Bundles a kepet egy <a>-ba csomagolja, aminek SAJAT hattere, also
          kerete es alahuzasa van. Amikor a keret lekerult a KEPROL, a kep
          16 px-es also margoja alol kilatszott a link 18 px-es savja — ez volt
          a "kek csik" a kepek alatt. */
.gk-uj .csomag__lista .bundled_product_images a{display:block;line-height:0;
  background:transparent!important;border:0!important;text-decoration:none!important}
.gk-uj .csomag__lista .bundled_product_images figure{margin:0}
.gk-uj .csomag__lista .bundled_product_images img{margin:0!important;display:block;
  padding:0;border:0;background:transparent;border-radius:12px}
       /* A valtozat es a darabszam eddig a sor JOBB szelere volt kilokve, tavol
          a képtől es a címtől — kozeputt nagy ures folt maradt. Most a cim ala
          kerul, balra zarva, egy sorban. */
.gk-uj .csomag__lista .details > .cart.variations_form{justify-content:flex-start;
  gap:10px;margin:0}
.gk-uj .csomag__lista .details > .cart{text-align:left;margin:0}
.gk-uj .csomag__lista .details > .cart .quantity,
.gk-uj .csomag__lista .details > .cart .quantity_hidden{margin:0}
.gk-uj .csomag__lista .bundled_product_title{margin:0 0 8px}
.gk-uj .bundled_product_title{font-size:.95rem!important;font-weight:800;
  color:var(--ink);margin:0 0 6px}
.gk-uj .bundled_product .details > .cart{margin:0;display:block}
.gk-uj .bundled_product .variations{margin:6px 0 0}
       /* A tetel keszlet-sora a bovitmeny zold szinet hasznalta; itt a terv
          halvany szovege all, elotte pottyel — mint a termek jelvenyenel. */
.gk-uj .bundled_product p.stock,
       /* A woo-custom-stock-status sajat, `!important`-os zold szine erosebb
          szelektorrol jon (`.woocommerce div.product .woo-custom-stock-status
          .in_stock_color`) — ezert kell ez a hosszabb valtozat is. */
.gk-uj .csomag .bundled_product p.stock.woo-custom-stock-status{margin:6px 0 0;
  font-size:.82rem;font-weight:600;color:var(--ink-3)!important;
  display:inline-flex;align-items:center;gap:7px}
.gk-uj .bundled_product p.stock::before{content:"";width:7px;height:7px;
  border-radius:50%;background:var(--kek);flex:0 0 7px}
.gk-uj .bundled_product p.stock.out-of-stock::before,
.gk-uj .bundled_product p.stock.available-on-backorder::before{background:var(--line)}
       /* A valtozat-attributum egy sorban: „Szin: Sarga". */
       /* A valtozat-valaszto sablonja `display:block`-ra allitja a sorokat
          (hogy a cimke a mezo folott alljon) — a csomag-tetelnel viszont
          egy sorban akarjuk, ezert kell a hosszabb szelektor. */
.gk-uj form.cart .bundled_product table.variations tr{display:flex;gap:6px;
  align-items:baseline;flex-wrap:wrap}
.gk-uj form.cart .bundled_product table.variations td.label,
.gk-uj form.cart .bundled_product table.variations td.value{width:auto;padding:0}
.gk-uj .bundled_product .variations label{font-size:.85rem;font-weight:600;
  color:var(--ink-3);margin:0}
       /* Kettospontot NEM teszunk ki: a valtozat-valaszto cimkeje mar
          tartalmazza (es a kotelezo csillag utan „*:"-ot adott volna). */
.gk-uj .bundled_product .bundled_variation_attribute_value{font-size:.85rem;
  font-weight:700;color:var(--ink-2)}
       /* Osszesito + gomb: a lista alatt, kiemelt savban. */
.gk-uj .bundle_data .bundle_wrap{margin:0;padding:16px 18px;background:var(--paper-2);
  border-top:1px solid var(--line)}
.gk-uj .csomag + .bundle_data{margin-top:-1px;border:1px solid var(--line);
  border-top:0;border-radius:0 0 var(--r) var(--r);overflow:hidden;background:var(--paper)}
       /* A csomag vegosszege kapjon feliratot — enelkul csak egy nagy szam
          allt a gomb mellett. */
.gk-uj .bundle_price{margin:0 0 12px}
.gk-uj .bundle_price::before{content:"Csomagár";display:block;font-size:.7rem;
  font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);
  margin-bottom:2px}
.gk-uj .bundle_price .price{margin:0;font-size:1.6rem;font-weight:800;color:var(--ink)}
.gk-uj .bundle_price .price .woocommerce-Price-amount{font-size:1.6rem;font-weight:800}
.gk-uj .bundle_error{margin:0 0 12px;font-size:.9rem}
.gk-uj .bundle_availability p{margin:0 0 10px;font-size:.88rem}
.gk-uj form.cart .quantity:not(.hidden){display:inline-flex!important}
.gk-uj form.cart.gk-nem-veheto .quantity,
.gk-uj form.cart.gk-nem-veheto .single_add_to_cart_button,
.gk-uj form.cart:has(.single_add_to_cart_button.wc-variation-is-unavailable) .quantity,
.gk-uj form.cart:has(.single_add_to_cart_button.wc-variation-is-unavailable) .single_add_to_cart_button{
       /* `!important`, mert a WooCommerce valtozat-JS-e BESOROLT stilussal
          (`style="display:block"`) mutatja meg a mennyiseget. */
  display:none!important}
       /* Az ertesites-gomb a terv gomb-stilusat kapja. */
.gk-uj .woocommerce-variation-availability .cwg_popup_submit,
.gk-uj .cwg_popup_submit{font:inherit;font-weight:700;font-size:.95rem;
  padding:13px 22px;border:0;border-radius:var(--r-pill);background:var(--ink);
  color:#fff;cursor:pointer}
.gk-uj .cwg_popup_submit:hover{background:var(--ink-2)}

/* 47. Galeria-kiskepek telefonon. Negy hasabban 82 px-es csempe jutott
       egy-egy kepre, es a forras egy 100x100-as vagat volt: a gep akkora
       lett rajta, mint egy ikon. Harom hasab (kb. 112 px) + elesebb forras
       (`woocommerce_gallery_thumbnail_size` szuro a termekoldalon). */
       /* A WooCommerce a `li`-re es a kepre fix szelesseget ir ki inline
          stilussal (flexslider) — a racs-cella igy nem telt ki. */
       /* A WooCommerce alap-CSS-e 100 px-ben maximalja a csempet:
          `.woocommerce div.product div.images .flex-control-thumbs li`. */
.gk-uj .flex-control-thumbs li{width:100%!important;max-width:none!important}
.gk-uj .flex-control-thumbs img{width:100%!important;height:auto;aspect-ratio:1;
  object-fit:cover;display:block}
@media (max-width:600px){
  .gk-uj .flex-control-thumbs{grid-template-columns:repeat(3,1fr);gap:8px}
}

/* 48. „Ertesitest kerek" felugro ablak. A keszlet-ertesito bovitmeny
       urlapja egy SweetAlert2 ablakban, a <body> vegen ul: kek fejlec,
       narancs X, szogletes mezok, vilagoskek gomb — semmi koze a tervhez.
       A termekoldal scriptje ratesz egy `gk-uj` osztalyt az ablakra, innen
       a valtozok es a formak a tervbol jonnek. */
.gk-uj.swal2-container .swal2-popup{border-radius:var(--r);padding:22px 20px 24px;
  font-family:inherit;box-shadow:var(--arnyek);max-width:min(420px,92vw)}
       /* A bovitmeny sajat Bootstrapot tolt be: a
          `.cwginstock-subscribe-form .panel-primary > .panel-heading` (0,3,1)
          erosebb egy sima osztaly-parosnal, ezert kell a hosszabb szelektor. */
.gk-uj.swal2-container .cwginstock-subscribe-form .panel-primary{border:0;
  box-shadow:none;margin:0;background:none}
.gk-uj.swal2-container .cwginstock-subscribe-form .panel-primary > .panel-heading{
  background:none;border:0;padding:0 0 6px;color:var(--ink)}
.gk-uj.swal2-container .cwginstock-subscribe-form .panel-primary > .panel-heading h4{
  color:var(--ink);font-size:1.12rem;font-weight:800;line-height:1.3;margin:0;
  text-align:left!important}
.gk-uj.swal2-container .cwginstock-subscribe-form .panel-body{padding:14px 0 0}
.gk-uj.swal2-container .cwginstock-subscribe-form__form{width:100%;max-width:none}
.gk-uj.swal2-container .form-group{margin:0 0 12px;text-align:left}
.gk-uj.swal2-container input[type="text"],
.gk-uj.swal2-container input[type="email"]{width:100%;font:inherit;font-size:.95rem;
  padding:12px 14px;min-height:46px;border:1px solid var(--line);border-radius:var(--r-s);
       /* A bovitmeny a mezokre BESOROLT stilust ir ki
          (`style="width:100%; text-align:center"`). */
  background:var(--paper);color:var(--ink);box-shadow:none;text-align:left!important}
.gk-uj.swal2-container input[type="text"]:focus,
.gk-uj.swal2-container input[type="email"]:focus{outline:2px solid var(--ink);
  outline-offset:1px;border-color:var(--ink)}
.gk-uj.swal2-container .cwgstock_button{width:100%;font:inherit;font-weight:700;
  font-size:.98rem;min-height:50px;padding:13px 20px;border:0;border-radius:var(--r-pill);
  background:var(--ink);color:#fff;cursor:pointer;text-transform:none}
.gk-uj.swal2-container .cwgstock_button:hover{background:var(--sotet-2)}
.gk-uj.swal2-container .swal2-close{color:var(--ink-3);background:none;font-size:2rem;
  width:44px;height:44px;box-shadow:none;transition:color .15s}
.gk-uj.swal2-container .swal2-close:hover{color:var(--ink);background:none}
.gk-uj.swal2-container .cwgstock_output{margin-top:10px;font-size:.9rem;color:var(--ink-2)}

/* 49. Aloldal-hero: a gombok torjenek sort telefonon (a lizingen a
       telefonszamos gomb 203 px, mellette az e-mail 140 — 358 px-es
       hasabban osszecsusztak), es a diszkret telefon-sor formaja. */
.gk-uj .alhero__gombok{flex-wrap:wrap}
@media (max-width:520px){.gk-uj .alhero__gombok{flex-direction:column;align-items:stretch}
  .gk-uj .alhero__gombok .gomb{width:100%;justify-content:center}}
.gk-uj .alhero__tel{margin-top:12px;font-size:.92rem;color:var(--ink-3)}
.gk-uj .alhero__tel a{color:var(--ink-2);font-weight:700;text-decoration:underline;
  text-underline-offset:3px}
.gk-uj .alhero__tel a:hover{color:var(--ink)}

/* 50. A lenyilo es a menupont kozott 10 px res van (a panel `top:
       calc(100% + 10px)`-en ul). Ha az eger ebben a resben halad lefele,
       a `:hover` megszunik es a panel becsukodik, mielott elerned az
       almenupontot. Egy lathatatlan sav athidalja — a panel SAJAT
       pszeudo-eleme, tehat a csoporton belul marad a fokusz/hover. */
       /* A savnak a CSOPORT pszeudo-eleme kell legyen (a panele nem eleg: az
       eger a resbe erve mar elhagyta a csoportot, a panel eltunik). A
       csoport `position:static`, ezert a sav a `.nav`-hoz igazodik: a
       menusor alja + 12 px, a panel szelessegeben. Csak a NYITOTT csoport
       savja fog egeret, kulonben a masik csoporte is elkapna. */
.gk-uj .nav__csoport::after{content:"";position:absolute;left:0;top:100%;
  height:12px;width:min(1040px,92vw);pointer-events:none}
.gk-uj .nav__csoport:hover::after,
.gk-uj .nav__csoport:focus-within::after{pointer-events:auto}

/* 51. „Tovabbi kategoriaink" kartyak: a negyes racsban 72x72-es belyegkep
       maradt a kep — a tobbi kartyahoz kepest apro, es kilog a terv
       kepnyelvebol. A kep a kartya tetejen, teljes szelessegben all. */
.gk-uj .mellek--negy .mkartya{grid-template-columns:1fr;gap:14px;padding:14px}

/* 52. A kivalasztott kiskep kerete alul levagodott: a `outline` a kep
       DOBOZAN KIVUL rajzolodik, es a racs-cella pont akkora. Befele
       rajzoltatjuk (`outline-offset:-2px`), igy sehol nem log ki. */
.gk-uj .flex-control-thumbs .flex-active{outline:2px solid var(--ink);
  outline-offset:-2px;border-radius:var(--r-s)}
       /* A kepek kivagott, feher hattere termekfotok: `contain`-nel nem
       vagjuk le a szelet (az e-szorfdeszka igy fel deszka lett volna). */
       /* A kep korul NINCS keret: a termekfotok sajat feher hatterrel
          jonnek, igy a kerettel egy nagy, majdnem ures doboz latszott a
          kis kep korul. Keret es hatter nelkul a foto maga a tartalom. */
.gk-uj .mellek--negy .mkartya img{width:100%;height:168px;object-fit:contain;
  border:0;background:transparent;border-radius:0;padding:0}
@media (max-width:900px){.gk-uj .mellek--negy .mkartya img{height:190px}}

/* 53. „Kategoriak" panel: ket blokk (gyartastechnologia elore, utana a
       tobbi terulet), es a kategoriak melle a termekszam. A menu MAGA
       valtozatlan — ez csak megjelenites. */
.gk-uj .nav__blokk + .nav__blokk{margin-top:12px;padding-top:12px;
  border-top:1px solid var(--line)}
.gk-uj .nav__blokk-cim{font-size:.68rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);margin:0 0 12px;padding-left:6px}
.gk-uj .nav__db{display:inline-block;margin-left:7px;font-size:.7rem;font-weight:700;
  color:var(--ink-3);background:var(--paper-2);border-radius:var(--r-pill);
  padding:1px 7px;vertical-align:middle}
.gk-uj .nav a.nav__ag:hover .nav__db,.gk-uj .nav a.nav__level:hover .nav__db{
  color:var(--ink)}
       /* Telefonon is: a szulo kiemelt, az alkategoriak behuzva. */
.gk-uj .menu__alag > summary{font-weight:800;color:var(--ink)}
.gk-uj .menu__alag a{padding-left:24px}
.gk-uj .menu__alag a.menu__mind{font-weight:700}
       /* A `hidden` attributumot a sajat `display:inline-flex` felulirja —
          ezert maradt ott a jelveny ures pottye a valasztas elott. */
.gk-uj .keszlet[hidden]{display:none!important}
       /* Ar-tartomany elvalasztoja. A `.ar .price` alapmerete kicsi (a
          nettó sor miatt), a nagy meretet az OSSZEG-spanok kapjak — a ket
          ar kozotti csupasz gondolatjel igy 15 px-es „minusz jel" maradt a
          32 px-es szamok kozott. */

/* 54. Valtozat kivalasztasa utani blokk: ar, kiegeszito, osszesito. A
       WooCommerce ezt sajat markupban adja, es eddig nyers 16 px-es
       szovegkent allt a gomb folott: a valtozat ara nem kulonbozott a
       leiras-szovegtol, a jelolonegyzet a sajat dobozan KIVUL ult, az
       osszesito pedig egy ures keretes dobozt hagyott maga utan. */
.gk-uj .woocommerce-variation-price{margin:14px 0 0}
.gk-uj .woocommerce-variation-price .price{font-size:.95rem;font-weight:600;
  color:var(--ink-2);line-height:1.5;margin:0}
.gk-uj .woocommerce-variation-price .price .woocommerce-Price-amount{font-size:1.7rem;
  font-weight:800;color:var(--ink);letter-spacing:-.02em}
.gk-uj .woocommerce-variation-price .price del{margin-right:8px}
.gk-uj .woocommerce-variation-price .price del .woocommerce-Price-amount{font-size:1rem;
  font-weight:600;color:var(--ink-3)}
.gk-uj .woocommerce-variation-price .price ins{text-decoration:none}
       /* A jelolonegyzet es a felirata EGY dobozban. */
.gk-uj .wc-pao-addon-name{display:block;font-size:.85rem;font-weight:800;
  color:var(--ink-2);margin:16px 0 8px}
.gk-uj .wc-pao-addon-wrap{display:block}
.gk-uj .wc-pao-addon-wrap > div{display:flex;align-items:flex-start;gap:10px;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--paper)}
.gk-uj .wc-pao-addon-wrap > div:hover{border-color:var(--ink-3)}
.gk-uj .wc-pao-addon-wrap input[type="checkbox"]{margin-top:2px;flex:0 0 18px}
.gk-uj .wc-pao-addon-wrap label{flex:1;min-width:0;display:flex;gap:10px;
  justify-content:space-between;align-items:flex-start;padding:0;border:0;
  background:none;font-size:.92rem;font-weight:600;cursor:pointer}
.gk-uj .wc-pao-addon-price{white-space:nowrap;color:var(--ink-2);font-weight:700}
       /* Osszesito: halkabb, mint a fo ar — nem versenyez vele. */
.gk-uj .product-addon-totals{margin:14px 0 0;font-size:.92rem;color:var(--ink-2)}
.gk-uj .product-addon-totals ul{list-style:none;margin:0;padding:0}
.gk-uj .product-addon-totals li{display:flex;justify-content:space-between;gap:12px;
  padding:6px 0}
.gk-uj .product-addon-totals .wc-pao-subtotal-line{border-top:1px solid var(--line);
  margin-top:4px;padding-top:10px;font-weight:800;color:var(--ink)}
.gk-uj .product-addon-totals .price{font-size:1rem;font-weight:800;color:var(--ink);
  margin:0}
       /* Ures validacios doboz (a bovitmeny mindig kiirja a keretet). */
.gk-uj .validation_message:empty{display:none}
.gk-uj .ar .price > span[aria-hidden="true"]:not(.woocommerce-Price-amount){
  font-size:2rem;font-weight:800;color:var(--ink);margin:0 2px}
.gk-uj .menu__blokk-cim{font-size:.68rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);margin:14px 0 4px;padding-left:12px}
       /* A „Gyartasi alapanyagok" hosszabb, mint a regi „Alapanyagok”: a
          felso menusorban ne torjon ket sorba. */
.gk-uj .nav > a,.gk-uj .nav__csoport > a{white-space:nowrap}
       /* Ket blokk tobb helyet kivan: a panel magasabb lehet. */
.gk-uj .nav__lenyilo{max-height:min(80vh,780px)}
       /* A technologia-oldal bevezetoje rogton a fejlec alatt all. A
          teljes szekcio-parnazassal ket nagy ures sav kerult volna egymas
          ala, ezert felul szukebb. */
.gk-uj .szekcio--szukebb{padding-top:clamp(18px,2vw,28px)}
       /* Ket egymast koveto, AZONOS hatteru szekcio kozott ketszeres a
          parnazas: az elonyok-blokk es a termekleiras kozott igy egy nagy
          ures sav maradt. A masodik felso parnazasa elmarad. */
.gk-uj .szekcio--halvany + .szekcio--halvany{padding-top:0}
       /* Az ELSO szekcio also parnazasa is kisebb, kulonben a valasztovonal
          folott maradt egy nagy ures sav. */
.gk-uj .szekcio--halvany:has(+ .szekcio--halvany){padding-bottom:clamp(18px,2.2vw,28px)}
       /* ...de valami valassza el oket, kulonben egybefolyik a ket blokk.
          Hajszalvonal a tartalom szelesseben, nem a teljes savban. */
.gk-uj .szekcio--halvany + .szekcio--halvany .tartaly{border-top:1px solid var(--line);
  padding-top:clamp(24px,3vw,36px)}
       /* Harom kartya egy racsban: egyforma magassag. A racs `align-items:start`
          erteke miatt mindegyik a sajat tartalmahoz igazodott, es kulonbozo
          magassaguak lettek egymas mellett. */
.gk-uj .racs--3 .doboz{height:100%}

       /* PENZTAR-OSSZESITO. A jobb hasab 404 px volt, azon belul a tabla
          358 px, a szallitasi modok pedig 163 px-en tordeltek harom sorba.
          Ket valtozas: a hasab szelesebb, es az osszesito soraiban a felirat
          a VALASZTOK FOLE kerul, igy azok teljes szelesseget kapnak. */
@media (min-width:1000px){
  .gk-uj form.checkout.woocommerce-checkout{grid-template-columns:minmax(0,1fr) minmax(0,.82fr)}
}
       /* Az osszesito tablazat SOR-alapu: minden sor teljes szelessegu, a
          felirat balra, az ertek jobbra, fuggolegesen kozepre igazitva, es
          minden sorban ugyanaz a parnazas. A tablazat-cellak eredetileg
          303/136 px-re osztottak a helyet, a labresz pedig parnazas nelkul
          maradt — igy a design soronkent maskepp nezett ki. */
.gk-uj #order_review table.shop_table,
.gk-uj #order_review table.shop_table thead,
.gk-uj #order_review table.shop_table tbody,
.gk-uj #order_review table.shop_table tfoot{display:block;width:100%}
.gk-uj #order_review table.shop_table tr{display:flex;align-items:center;
  justify-content:space-between;gap:18px;width:100%;padding:14px 0;margin:0;
  border-bottom:1px solid var(--line)}
.gk-uj #order_review table.shop_table tr:last-child{border-bottom:0}
.gk-uj #order_review table.shop_table th,
.gk-uj #order_review table.shop_table td{display:block;width:auto;padding:0;
  border:0;text-align:left}
.gk-uj #order_review table.shop_table td{text-align:right;white-space:nowrap}

/* A tema halvany szurke hatteret ad a fejlec-celláknak. Amig a cella
   az egesz oszlopot kitoltotte, ez savnak latszott; a sor-alapu
   elrendezesben viszont csak a felirat moge kerul, mint egy
   szovegkiemelo. Ezert mindenhol attetszo. */
.gk-uj #order_review table.shop_table th,
.gk-uj #order_review table.shop_table td{background:transparent}
       /* A szallitasi sor egesz szelessegben, a valasztokkal egymas alatt. */
.gk-uj #order_review table.shop_table tr.woocommerce-shipping-totals{
  flex-direction:column;align-items:stretch;gap:6px}
.gk-uj #order_review table.shop_table tr.woocommerce-shipping-totals td{
  text-align:left;white-space:normal;width:100%}
.gk-uj #order_review #shipping_method{width:100%;margin:0;padding:0;list-style:none}
.gk-uj #order_review #shipping_method li{display:flex;align-items:flex-start;gap:8px;padding:5px 0}
.gk-uj #order_review #shipping_method label{display:inline;font-weight:600}
       /* Lablec-tanusitvanyok: sajat (negyedik) hasab, egymas alatt,
          nagyobban. Kulon sorban, apro ikonokkent alig latszottak. */
.gk-uj .lab__jelvenyek{display:flex;flex-direction:column;align-items:flex-start;
  gap:14px;margin:0}
       /* A lablec NEGY hasab: marka, kinalat, informaciok, tanusitvanyok.
          Rugalmas sorban a negyedik elem uj sorba tort es a marka ala esett. */
@media (min-width:1000px){
  .gk-uj .lab__belso{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.05fr;
    gap:28px 40px;align-items:start}
}
.gk-uj .lab__jelvenyek img{height:auto;width:auto;max-width:190px;max-height:76px;
  background:#fff;border-radius:12px;padding:8px;display:block}

/* A fogyasztobarat tanusitvany es a lablec-logo ugyanolyan szeles,
   mint a Super Seller badge - igy a hasab bal szele egyenes. */
.gk-uj .lab__jelvenyek img.jelveny--szeles{width:190px;max-width:190px;max-height:none}
.gk-uj .lab__logo{display:block;width:190px;padding:12px;box-sizing:border-box}
.gk-uj .lab__logo img{height:auto;width:100%}
@media (max-width:900px){.gk-uj .lab__jelvenyek{flex-direction:row;flex-wrap:wrap}}
       /* Egyszeru lenyilo (nincs alpont): keskeny panel, egymas alatti
          lista. A negy technologia harom oszlopban szetszorva nezett ki. */
.gk-uj .nav__lenyilo--egyszeru{min-width:0;width:max-content;max-width:320px}

/* A keskeny panel a SAJAT menupontja ala nyiljon. A csoport alapbol
   position:static, mert a szeles, tobb oszlopos panelnek a menusor
   elejehez kell igazodnia - a keskeny lista viszont igy a Kategoriak
   ala esett. Csak azt a csoportot tesszuk relativva, amelyikben
   keskeny panel van; a hover-athidalo savot is hozza szukitjuk. */
.gk-uj .nav__csoport:has(.nav__lenyilo--egyszeru){position:relative}
.gk-uj .nav__csoport:has(.nav__lenyilo--egyszeru)::after{width:100%;min-width:200px}
.gk-uj .nav__lenyilo--egyszeru .nav__oszlopok{display:block;column-count:1}
.gk-uj .nav__lenyilo--egyszeru .nav__oszlop{display:flex;flex-direction:column;gap:2px}
       /* KATTINTHATO KARTYA. Eddig csak a kartya alji hivatkozas vitt
          tovabb, holott az egesz kartya ugy nez ki, mint egy gomb. A
          hivatkozas egy lathatatlan `::after`-rel kiterul a kartyara, igy
          barhol kattintva mukodik — DE a link marad a fokuszalhato elem,
          tehat billentyuzettel es kepernyoolvasoval is ugyanaz. */
.gk-uj .kartya,.gk-uj .mkartya{position:relative}
.gk-uj .kartya .kartya__lab > a.link::after,
.gk-uj .kartya > .kartya__test > a.link::after,
.gk-uj .kartya a.link.kartya__tovabb::after{content:"";position:absolute;inset:0;
  border-radius:inherit;z-index:1}
.gk-uj .kartya:hover{cursor:pointer}
       /* A kartyan beluli TOBBI hivatkozas (pl. a testveroldal linkje) a
          kiterult reteg FOLE kerul, kulonben nem lehetne rakattintani. */
.gk-uj .kartya a:not(.kartya__tovabb),.gk-uj .mkartya a{position:relative;z-index:2}
       /* A keszlet-ertesito gomb a termekoldalon a bovitmeny sajat narancs
          szinet hozta, ami a terv paletajaban idegen. A csomag TETELEIBEN
          mar halkitottuk; itt, ahol a kosarba gomb HELYETT all, a terv
          elsodleges gombja a helyes forma. */
.gk-uj .cwg_popup_submit:not(.csomag__lista .cwg_popup_submit){display:inline-flex;
  align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;
  border-radius:var(--r-pill);font-weight:700;font-size:.95rem;line-height:1;
  background:var(--ink);color:#fff;border:2px solid var(--ink);cursor:pointer;
  text-transform:none;letter-spacing:0;box-shadow:none;width:auto}
.gk-uj .cwg_popup_submit:not(.csomag__lista .cwg_popup_submit):hover{
  background:var(--ink-2);border-color:var(--ink-2);color:#fff}
       /* Ami minden gepvasarlashoz jar: ot rovid tetel. Pirulakent ket
          sorba tort es tortnek hatott; pipas felsoroláskent a tordeles
          termeszetes. */
.gk-uj .jar-hozza{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px 24px;list-style:none;margin:0;padding:0}
@media (max-width:900px){.gk-uj .jar-hozza{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.gk-uj .jar-hozza{grid-template-columns:1fr}}
       /* Technologia-leiras: balra az alcim, jobbra a szoveg. Egy hasabban
          a szoveg mellett ureseg maradt, es omlesztettnek hatott. Az alcim
          tapad gorgetes kozben, igy vegig latszik, melyik reszt olvasod. */
.gk-uj .leiras-blokk{display:grid;grid-template-columns:minmax(170px,240px) minmax(0,1fr);
  gap:clamp(18px,3vw,48px);align-items:start;padding:clamp(20px,2.6vw,30px) 0;
  border-top:1px solid var(--line)}
.gk-uj .leiras-blokk:first-child{border-top:0;padding-top:0}
.gk-uj .leiras-blokk__cim{position:sticky;top:104px;margin:0;font-size:.76rem;
  font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);
  line-height:1.45}
.gk-uj .leiras-blokk .szoveges{max-width:68ch}
@media (max-width:860px){
  .gk-uj .leiras-blokk{grid-template-columns:1fr;gap:10px}
  .gk-uj .leiras-blokk__cim{position:static;font-size:1.02rem;letter-spacing:0;
    text-transform:none;color:var(--ink)}
}
.gk-uj .jar-hozza li{display:inline-flex;align-items:center;gap:8px;
  font-size:.94rem;font-weight:600;color:var(--ink-2)}
.gk-uj .jar-hozza .ikon{width:17px;height:17px;flex:0 0 17px;color:var(--kek)}

/* 57. BEJELENTKEZETT NEZET: amit a Perfmatters kiszurne. Adminkent nem fut
       az optimalizalas, ezert olyan bovitmeny-szabalyok is elnek, amiket a
       latogato sosem lat. A WooCommerce blokk-racs negativ oldalmargoja
       (margin:0 -8px) 16 px-rel szelesebbre nyitja a listat, mint a szuloje —
       ettol a kezdolapon vizszintesen gorgetheto lett az oldal. */
.gk-uj ul.wc-block-grid__products{margin-left:0;margin-right:0}

/* 61. Szelesebb tartaly nagy kepernyon (1536-tol felfele). */
.gk-uj{--tartaly:clamp(1200px, calc(1200px + (100vw - 1536px) * 0.52), 1400px)}
.gk-uj .fulek__lap > p,
.gk-uj .fulek__lap > ul,
.gk-uj .fulek__lap > ol{max-width:1120px}

/* 62. A KEZDOLAPI gep-termeksor negy hasabos, mint a tobbi racs ott. */
@media (min-width:961px){
  .gk-uj .termekek--negyes{grid-template-columns:repeat(4,1fr)}
}

/* 63. „Tovabbi kategoriaink": negyzetes, teljes szelessegu kartyakep. */
.gk-uj .mellek--negy{gap:clamp(16px,2vw,24px)}
.gk-uj .mellek--negy .mkartya img{aspect-ratio:1;height:auto;
  width:calc(100% + 28px);max-width:none;margin:-14px -14px 0;
  border-radius:var(--r) var(--r) 0 0}

/* 58. A 2026-09-16-i termekkartya- es lapozo-igazitasok. Ezek eddig CSAK a
       GENERALT fajlban eltek — kezzel bele volt irva —, tehat az elso
       regeneralas nemán kitorolte volna oket. Innentol a forrasban allnak. */

/* A keszlet-jelveny a szovegtorzsben el, nem a kepen: ket fedveny versengett
   ugyanazert a savert, a jobbrol benyulo keszlet-jelveny kitakarta a bal felso
   „Akcio" szalagot. A position/top/right/background visszaallitasa KELL, mert a
   latvanyterv szabalya abszolut fedvenykent helyezi el. */
.gk-uj .termek .keszlet{position:static;top:auto;right:auto;background:none;
  align-self:flex-start;margin:2px 0}

/* Az „Akcio" szalag a KEP FOLE. A Perfmatters lusta-betoltese `pmFadeIn`
   animaciot tesz a kepre, az animalt elem pedig sajat retegkontextust nyit es
   z-index:0-kent rajzolodik — a DOM-ban a szalag UTAN jon, ezert eltakarta. */
.gk-uj .termek .szam{z-index:2}

/* Lapozo-nyil: CSS-chevron. Sajat osztalynev, mert a `.nyil` a designban MAS
   komponens SVG-nyilat jelenti. A `min-width:0` + `border-radius:0` +
   `padding:0` KELL: a `.lapozo a, .lapozo span` szabaly a belso nyil-spanre is
   rahuzna a 40 px-es gomb-meretet es a pill-keretet. */
.gk-uj .lapozo .lapozo-nyil{display:block;box-sizing:content-box;min-width:0;
  width:7px;height:7px;padding:0;border:solid currentColor;border-width:0 2px 2px 0;
  border-radius:0}
.gk-uj .lapozo .lapozo-nyil--balra{transform:rotate(135deg);margin-left:3px}
.gk-uj .lapozo .lapozo-nyil--jobbra{transform:rotate(-45deg);margin-right:3px}

/* 59. Kapcsolat-oldal. Az oldal gerince az ELERHETOSEGEK racsa: hat egyforma
       kartya 3x2-ben (ot szerepkor + panaszkezeles). A panaszkezeles korabban
       szaggatott keretes szeljegyzet volt a racs ALATT, es mellekesnek latszott;
       hattal a masodik sor foghijassaga is megszunik. */
.gk-uj .gk-elerhetok{align-items:stretch}
.gk-uj .gk-elerhetok .gk-szemely{display:flex;flex-direction:column}
.gk-uj .gk-szemely h3{font-size:1rem}
.gk-uj .gk-szemely__nev{margin-top:2px;font-weight:700;color:var(--ink)}
.gk-uj .gk-szemely__lead{margin-top:8px;font-size:.9rem;color:var(--ink-2)}
.gk-uj .gk-szemely__elerhet{display:flex;flex-direction:column;align-items:flex-start;
  gap:8px;margin-top:14px}
.gk-uj .gk-szemely .link{display:inline-flex;align-items:center;gap:7px;word-break:break-word}
.gk-uj .gk-szemely .link .ikon{width:16px;height:16px;flex:0 0 16px}

/* Tovabbi csatornak: chat, altalanos e-mail, Facebook. Sajat savban, nem
   egy halvany mondatkent a racs alatt. */
.gk-uj .gk-tovabbi{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:14px 32px;margin-top:clamp(14px,1.6vw,20px);padding-top:clamp(16px,2vw,22px);
  border-top:1px solid var(--line)}
.gk-uj .gk-tovabbi p{margin:0;display:flex;flex-direction:column;gap:4px}
.gk-uj .gk-tovabbi b{font-size:.76rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3)}
.gk-uj .gk-tovabbi .link{display:inline-flex;align-items:center;gap:6px}

/* Cim-sav a bemutatoterem szekcio elen: cim, ugyfelfogadas, szerviz. */
.gk-uj .gk-cimsav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,2vw,28px)}
.gk-uj .gk-cimsav p{margin:0;display:flex;gap:14px;align-items:flex-start}
.gk-uj .gk-cimsav p > span:last-child{display:flex;flex-direction:column;gap:3px}
.gk-uj .gk-cimsav b{font-size:.76rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3)}
.gk-uj .gk-cimsav small{color:var(--ink-2);font-size:.85rem}
.gk-uj .gk-cimsav .link{display:inline-flex;align-items:center;gap:6px;margin-top:4px}

/* A hero gombjai horgonyra visznek, ezert a ragadós fejlec ala ne csusszon
   a celszekcio cime. */
.gk-uj [id="elerhetosegek"],
.gk-uj [id="gk-urlap"]{scroll-margin-top:110px}
@media (max-width:860px){
  .gk-uj .gk-tovabbi{grid-template-columns:1fr;gap:14px}
  .gk-uj .gk-cimsav{grid-template-columns:1fr}
}

/* 60. Ceginformaciok — cimke/ertek lista. */
.gk-uj .gk-cegadat{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);
  gap:8px 24px;margin:0}
.gk-uj .gk-cegadat dt{font-size:.78rem;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.gk-uj .gk-cegadat dd{margin:0;color:var(--ink)}
@media (max-width:640px){
  .gk-uj .gk-cegadat{grid-template-columns:1fr;gap:2px}
  .gk-uj .gk-cegadat dd{margin-bottom:10px}
}
       /* Zsakbamacska (GK_Zsakbamacska): bejelolheto sor a gep Kosarba gombja
          FOLOTT, az urlapon belul. Alapbol NINCS bejelolve (fizetos kiegeszitot
          elore bejelolni tilos). Az ertek-valaszto pirula-radio. */
.gk-uj .zsak{flex:1 1 100%;width:100%;margin:0 0 16px;border:1px solid var(--line);
  border-radius:var(--r-s);padding:12px 14px;background:var(--paper)}
.gk-uj .zsak:has(.zsak__ker input:checked){border-color:var(--ink);background:var(--kek-tint)}
       /* Csomagnal a sor a tetel-lista kerete es az ar-panel koze kerul —
          terkoz nelkul mindkettore ratapad. */
.gk-uj .bundle_form .zsak{margin:16px 0}
.gk-uj .zsak__ker{display:flex;gap:12px;align-items:center;cursor:pointer;margin:0}
.gk-uj .zsak__ker input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--ink);cursor:pointer}
.gk-uj .zsak__kep{flex:none;width:88px;height:88px;border-radius:12px;overflow:hidden;
  background:var(--paper-2);display:block}
.gk-uj .zsak__kep img{width:100%;height:100%;object-fit:cover;display:block;margin:0}
.gk-uj .zsak__szoveg{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:.86rem;
  line-height:1.4;color:var(--ink-2)}
.gk-uj .zsak__szoveg strong{font-size:.95rem;font-weight:800;color:var(--ink)}
.gk-uj .zsak__ertekek{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:10px 0 0 134px;min-width:0}
.gk-uj .zsak__ertek{position:relative;cursor:pointer;margin:0}
.gk-uj .zsak__ertek input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.gk-uj .zsak__pirula{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;
  border:1px solid var(--line);border-radius:var(--r-pill);font-weight:700;font-size:.88rem;
  color:var(--ink);background:var(--paper);white-space:nowrap}
.gk-uj .zsak__pirula .woocommerce-Price-amount{color:inherit}
.gk-uj .zsak__ertek input:checked + .zsak__pirula{border-color:var(--ink)}
       /* Sotet csak akkor, ha a negyzet is be van jelolve — kulonben ugy
          nezne ki, mintha a vevo mar valasztott volna. */
.gk-uj .zsak:has(.zsak__ker input:checked) .zsak__ertek input:checked + .zsak__pirula{background:var(--ink);color:#fff}
.gk-uj .zsak__ertek input:focus-visible + .zsak__pirula{outline:2px solid var(--ink);outline-offset:2px}
@media (max-width:480px){
  .gk-uj .zsak__ertekek{margin-left:0}
  .gk-uj .zsak__kep{width:72px;height:72px}
}

/* 13.b Kategoriaoldal telefonon (2026-09-25). Merve iPhone 13-on: az elso
       termek 1 400-6 700 px-nel kezdodott — elotte teljes szelessegu
       alkategoria-csempek, ket nyitott szurodoboz, es egy kartya egy sor. */
       /* A „Termekeink" menun kivuli kategoriai lenyito mogott (minden meretben). */
.gk-uj .alkat-tobb{margin-top:14px}
.gk-uj .alkat-tobb>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;
  font-weight:700;font-size:.9rem;color:var(--ink-2)}
.gk-uj .alkat-tobb>summary::-webkit-details-marker{display:none}
.gk-uj .alkat-tobb>summary::after{content:"+";color:var(--ink-3)}
.gk-uj .alkat-tobb[open]>summary::after{content:"–"}
.gk-uj .alkat-tobb .alkat{margin-top:12px}
       /* A szuro „fiokja": asztalon lathatatlan keret, mindig nyitva. */
.gk-uj .szuro .szuro__fiok{border:0;background:none;border-radius:0}
.gk-uj .szuro .szuro__fiok>form{margin:0}
.gk-uj .szuro details:not([open])>summary::after{content:"+"}
@media (min-width:901px){.gk-uj .szuro .szuro__nyito{display:none}}
       /* Artartomanynal a kotojelnel torjon, ne a „189 / 000 Ft" kozott. */
.gk-uj .termek__ar .woocommerce-Price-amount{white-space:nowrap}
@media (max-width:900px){
  .gk-uj .szuro{gap:0}
  .gk-uj .szuro .szuro__nyito{min-height:48px;padding:0 18px;border:1px solid var(--line);
    border-radius:var(--r-pill);background:var(--paper)}
  .gk-uj .szuro .szuro__fiok[open]>.szuro__nyito{margin-bottom:14px;border-color:var(--ink)}
}
@media (max-width:640px){
       /* Alkategoriak: egyetlen, oldalra gorgetheto chip-sor. A sor a
          kepernyo szeleig er, igy a levagott utolso chip jelzi, hogy van tovabb. */
  .gk-uj .alkat{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
    margin-left:calc(-1 * var(--pad));margin-right:calc(-1 * var(--pad));
    padding:2px var(--pad);scroll-padding-left:var(--pad);scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch}
  .gk-uj .alkat::-webkit-scrollbar{display:none}
  .gk-uj .alkat a{flex:none;scroll-snap-align:start;white-space:nowrap;min-height:44px;
    padding:0 16px;border-radius:var(--r-pill);font-size:.86rem}
       /* A lenyitoban (60+ kategoria) nem gorgetunk, hanem tordelunk. */
  .gk-uj .alkat.alkat--tobb{flex-wrap:wrap;overflow:visible;margin-left:0;margin-right:0;padding:0}
  .gk-uj .alkat--tobb a{min-height:38px;padding:0 12px;font-size:.8rem}
       /* Ket oszlopos kartyak: kisebb betu es belso margo. */
  .gk-uj .termekek--kat{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .gk-uj .termekek--kat .termek__test{padding:10px;gap:4px}
  .gk-uj .termekek--kat .termek__nev{font-size:.8rem;line-height:1.28;overflow-wrap:anywhere;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .gk-uj .termekek--kat .termek__ar b{font-size:.95rem}
  .gk-uj .termekek--kat .termek__ar small{font-size:.7rem}
  .gk-uj .termekek--kat .keszlet{font-size:.7rem}
  .gk-uj .termekek--kat .termek__muvelet .button{width:100%;min-height:40px;padding:0 8px;font-size:.8rem;
    text-align:center;justify-content:center}
}

/* 13.c Termekoldal telefonon (2026-09-25). Merve iPhone 13-on: a „Kosarba
       teszem" 1 955-2 412 px-nel allt (harom kepernyo). */
       /* Ragados kosarsav (GK_Kosarsav): csak telefonon, akkor latszik, ha
          a valodi gomb nincs a kepen. */
.gk-uj .kosarsav{display:none}
@media (max-width:900px){
  .gk-uj .kosarsav{display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:fixed;left:0;right:0;bottom:0;z-index:100;padding:10px var(--pad);
    padding-bottom:calc(10px + env(safe-area-inset-bottom));background:var(--paper);
    border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(14,22,32,.08);
    transform:translateY(110%);transition:transform .2s ease;visibility:hidden}
  .gk-uj .kosarsav--lathato{transform:none;visibility:visible}
  .gk-uj .kosarsav__ar{font-weight:800;font-size:1.1rem;line-height:1.2;min-width:0;white-space:nowrap}
  .gk-uj .kosarsav__ar .woocommerce-Price-amount{white-space:nowrap}
  .gk-uj .kosarsav__gomb{flex:none;min-height:48px;padding:0 20px}
  body.gk-kosarsav-van{padding-bottom:76px}
}
@media (prefers-reduced-motion:reduce){.gk-uj .kosarsav{transition:none}}
@media (max-width:900px){
       /* A „Felszereltseg" a kosar ALA: az ar utan rogton a valaszto es a gomb. */
  .gk-uj .tinfo{display:flex;flex-direction:column}
  .gk-uj .tinfo>.blokk{order:1;margin-top:28px}
  .gk-uj .tinfo>.cimke{align-self:flex-start}
       /* A morzsa es a „Kategoria:" ugyanazt mondta; a termeknev a H1-ben all. */
  .gk-uj .morzsa li[aria-current]{display:none}
  .gk-uj .tinfo__kat{display:none}
  .gk-uj .tinfo__meta:not(:has(span:not(.tinfo__kat))){display:none}
       /* Belyegkepek egy sorban, oldalra gorgethetoen (8 kepnel 3 sor volt). */
  .gk-uj .flex-control-thumbs{display:flex!important;gap:8px;overflow-x:auto;scrollbar-width:none;
    scroll-snap-type:x proximity;padding-bottom:2px}
  .gk-uj .flex-control-thumbs::-webkit-scrollbar{display:none}
  .gk-uj .flex-control-thumbs li{flex:0 0 calc((100% - 32px) / 4.4);width:auto!important;
    float:none!important;margin:0!important;scroll-snap-align:start}
       /* Csomagtetelek surubben: kisebb kep, kisebb sorkoz. */
  .gk-uj .csomag__lista .bundled_product{padding:10px 0;grid-template-columns:72px minmax(0,1fr);column-gap:12px}
  .gk-uj .csomag__lista .bundled_product_images{width:72px!important}
}

/* 13.d Kosar telefonon (2026-09-25). Merve iPhone 13-on: a „Tovabb a
       penztarhoz" 2 723 px-nel allt; egy tetel 240-390 px „cimke: ertek" sor
       volt, kep nelkul, a csomag minden tetele kulon teljes sorban. Csak CSS
       a nativ kosar-urlapon (GK_Kosar: abbol egy sort sem irunk ujra). Csak a
       `.gk-kosar--mobil` kapcsolo mogott (GK_Kosar::mobil_be). */
.gk-uj .kupon-nyito{display:none}
@media (max-width:768px){
  .gk-kosar--mobil table.cart thead{display:none}
  .gk-kosar--mobil table.cart,.gk-kosar--mobil table.cart tbody{display:block;border:0!important;border-radius:0!important}
  .gk-kosar--mobil table.cart tr.cart_item{display:grid;grid-template-columns:64px minmax(0,1fr) auto;
    grid-template-areas:"kep nev torol" "kep menny ossz";column-gap:12px;row-gap:8px;
    align-items:center;padding:14px 0;border-top:1px solid var(--line);background:none!important}
  .gk-kosar--mobil table.cart tr.cart_item:first-child{border-top:0}
  .gk-kosar--mobil table.cart tr.cart_item td{display:block!important;padding:0!important;border:0!important;
    text-align:left!important;background:none!important;min-width:0}
  .gk-kosar--mobil table.cart tr.cart_item td::before{display:none!important;content:none!important}
  .gk-kosar--mobil table.cart td.product-thumbnail{grid-area:kep;align-self:start}
  .gk-kosar--mobil table.cart td.product-thumbnail img{width:64px!important;height:64px;object-fit:contain;
    border:1px solid var(--line);border-radius:10px;background:var(--paper);display:block;margin:0}
  .gk-kosar--mobil table.cart td.product-name{grid-area:nev;font-weight:700;font-size:.9rem;line-height:1.3}
  .gk-kosar--mobil table.cart td.product-name a{color:var(--ink);text-decoration:none}
  .gk-kosar--mobil table.cart td.product-name .stock.in-stock{display:none}
  .gk-kosar--mobil table.cart td.product-remove{grid-area:torol;align-self:start}
       /* A sor-szabaly (tr.cart_item td) display:block!important-ja erosebb,
          ezert itt is a teljes lanc kell. */
  .gk-kosar--mobil table.cart tr.cart_item td.product-price{display:none!important}
  .gk-kosar--mobil table.cart td.product-quantity{grid-area:menny}
  .gk-kosar--mobil table.cart td.product-subtotal{grid-area:ossz;text-align:right!important;font-weight:800;white-space:nowrap}
       /* Csomag tetelei: behuzott, apro sorok a csomag alatt — ar, reszosszeg,
          kep es torles nelkul (ezek a csomag sorahoz tartoznak). */
  .gk-kosar--mobil table.cart tr.cart_item.bundled_table_item{grid-template-columns:64px minmax(0,1fr) auto;
    grid-template-areas:". nev menny";padding:0 0 6px;border-top:0;row-gap:0}
  .gk-kosar--mobil table.cart tr.bundle_table_item{padding-bottom:10px}
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-thumbnail,
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-remove,
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-subtotal{display:none!important}
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-name{font-weight:500;font-size:.8rem;color:var(--ink-2)}
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-name a{color:var(--ink-2)}
  .gk-kosar--mobil table.cart tr.bundled_table_item .bundled_table_item_indent{padding:0;margin:0}
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-quantity{font-size:.8rem;color:var(--ink-3);
    text-align:right!important;white-space:nowrap}
  .gk-kosar--mobil table.cart tr.bundled_table_item td.product-quantity::after{content:" db"}
       /* Muvelet-sor: a kupon link mogott, a „Kosar frissitese" rejtve (a
          mennyiseg-valtozas utan magatol lefut, GK_Kosar::mobil_kiegeszitok). */
  .gk-kosar--mobil table.cart tr:not(.cart_item){display:block;border-top:1px solid var(--line);padding-top:12px}
  .gk-kosar--mobil table.cart td.actions{display:flex!important;flex-direction:column;align-items:flex-start;gap:10px;padding:0!important;border:0!important}
  .gk-kosar--mobil table.cart td.actions .kupon-nyito{display:inline-block;order:-1;background:none;border:0;padding:4px 0;
    font:inherit;font-weight:700;font-size:.9rem;color:var(--ink);text-decoration:underline;cursor:pointer}
  .gk-kosar--mobil table.cart td.actions:not(.kupon--nyitva) .coupon{display:none!important}
  .gk-kosar--mobil table.cart td.actions .coupon{display:flex!important;gap:8px;width:100%}
  .gk-kosar--mobil table.cart td.actions .coupon .input-text{flex:1;min-width:0;width:auto!important}
  .gk-kosar--mobil table.cart td.actions button[name="update_cart"]{display:none!important}
       /* Kosarsav a kosaron: kis „Osszesen" felirat az osszeg folott. */
  .gk-kosar--mobil .kosarsav--kosar .kosarsav__ar small{display:block;font-size:.72rem;font-weight:600;color:var(--ink-3)}
}

/* 13.e Penztar telefonon (2026-09-25). Merve: a „Megrendeles" 3 816 px-nel,
       egy mezo 100-135 px, az osszesitoben levagott ar. Csak a
       `.gk-penztar--mobil` kapcsolo mogott (GK_Kosar::penztar_mobil_be). */
@media (max-width:640px){
       /* Nev es iranyitoszam/varos parban, a tobbi mezo teljes szelessegu. */
  .gk-penztar--mobil .woocommerce-billing-fields__field-wrapper,
  .gk-penztar--mobil .woocommerce-shipping-fields__field-wrapper{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px}
  .gk-penztar--mobil .woocommerce-billing-fields__field-wrapper>.form-row-first,
  .gk-penztar--mobil .woocommerce-shipping-fields__field-wrapper>.form-row-first{grid-column:1}
  .gk-penztar--mobil .woocommerce-billing-fields__field-wrapper>.form-row-last,
  .gk-penztar--mobil .woocommerce-shipping-fields__field-wrapper>.form-row-last{grid-column:2}
  .gk-penztar--mobil .form-row{gap:4px;margin:0 0 10px}
  .gk-penztar--mobil form.checkout .form-row label{line-height:1.25!important;margin:0}
  .gk-penztar--mobil form.checkout .form-row .input-text,
  .gk-penztar--mobil form.checkout .form-row select{min-height:46px;height:46px}
  .gk-penztar--mobil form.checkout .form-row textarea{min-height:88px}
       /* Osszesito: a termeknev tordeljon, az ar maradjon egyben (eddig
          a nowrap nev kitolta az arat: „46 9" latszott). */
  .gk-penztar--mobil .woocommerce-checkout-review-order-table td.product-name{white-space:normal!important;overflow-wrap:anywhere}
  .gk-penztar--mobil .woocommerce-checkout-review-order-table td.product-total{white-space:nowrap!important}
       /* A vegosszeg mellett az „(Adotartalom: … AFA)” is nowrap volt — 17 px-rel kilogott. */
  .gk-penztar--mobil .woocommerce-checkout-review-order-table .order-total td{white-space:normal!important;text-align:right}
  .gk-penztar--mobil .woocommerce-checkout-review-order-table .includes_tax{display:block;white-space:normal!important}
}

/* 13.f Koszonooldal (2026-09-25). A WooCommerce `ul.order_details li`
       szabalya szaggatott jobb keretet, lebegtetest es 2em margot ad — a mi
       dobozunkban ettol logtak fuggoleges vonalak, szetszorva. */
.gk-uj ul.woocommerce-order-overview li{border:0!important;float:none!important;margin:0!important;padding:0!important}
.gk-uj ul.woocommerce-order-overview::before,.gk-uj ul.woocommerce-order-overview::after{content:none!important;display:none!important}
@media (max-width:640px){
  .gk-uj ul.woocommerce-order-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 16px;padding:16px}
}
       /* A rendeles-reszletek es a cim-blokkok cime a tobbi szakaszcimmel egy meretben. */
.gk-uj .woocommerce-order-details__title,.gk-uj .woocommerce-column__title,.gk-uj .mi-tortenik h2{
  font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem)!important;line-height:1.25;margin:0 0 12px!important}
       /* „Mi tortenik most?" (GK_Koszono) */
.gk-uj .mi-tortenik{border:1px solid var(--line);border-left:4px solid var(--kek);border-radius:var(--r-s);
  background:var(--paper);padding:16px 18px;margin:0 0 28px}
.gk-uj .mi-tortenik ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;
  font-size:.94rem;color:var(--ink-2);line-height:1.5}
.gk-uj .mi-tortenik strong{color:var(--ink)}
.gk-uj .mi-tortenik a{color:var(--ink);font-weight:700;white-space:nowrap}
       /* A ket cim-doboz telefonon egymas alatt, terkozzel. */
.gk-uj .woocommerce-columns--addresses .woocommerce-column + .woocommerce-column{margin-top:20px}