/* =========================================================
   iparilegszures.hu — stíluslap

   Felépítés:
     1. Tokenek (NUXON-színek, betűk, térközök) — globális állítás itt
     2. Alapok
     3. Közös elemek (keret, gombok, szakaszok)
     4. Fejléc és menü
     5. Blokkok az oldal sorrendjében (02–18)
     6. Kalkulátor és eredmény
     7. Süti-banner
     8. Csökkentett mozgás

   SZABÁLY: módosításkor az eredeti szabályt írd át, ne fűzz a fájl
   végére felülírást. Új márkaszínt ne vezess be; a NUXON-tokenekből
   dolgozz.
   ========================================================= */

/* =========================================================
   1. TOKENEK
   ========================================================= */
:root{
  /* NUXON márkaszínek — nem változtathatók */
  --nuxon-primary:  #183090;
  --nuxon-primary-dark: #101F5E;
  --nuxon-accent:   #18A8D8;
  --nuxon-antracit: #18212B;
  --nuxon-deep:     #101C4A;

  --felulet:        #FFFFFF;
  --felulet-alt:    #F3F6F7;
  --felulet-lablec: #0F1D24;

  --szoveg:         #15232A;
  --szoveg-halk:    #54666E;
  --szoveg-inverz:  #F3F6F7;
  --szoveg-inverz-halk: #AEBBD6;
  --vonal:          #D5DEE1;
  --vonal-eros:     #B7C4C9;
  --vonal-sotet:    rgba(174,187,214,.28);

  /* mérési jel: a türkiz csak légáramra, mért adatra és fókuszra */
  --jel:            var(--nuxon-accent);
  --jel-halvany:    rgba(24,168,216,.14);

  --siker:          #1B7A4B;
  --figyel:         #9A6410;
  --hiba:           #A3231F;

  /* eredmény összetevői: a NUXON-palettából képzett árnyalatok */
  --c-energia:      #183090;
  --c-anyag:        #18A8D8;
  --c-munka:        #5A74C4;
  --c-egyeb:        #8FA1AE;

  --font-sans:  "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-serif: "IBM Plex Serif", Georgia, "Times New Roman", serif;

  --fs-xs:   0.8125rem;
  --fs-sm:   0.9rem;
  --fs-base: 1.0625rem;
  --fs-lg:   1.2rem;
  --fs-xl:   clamp(1.3rem, 1.9vw, 1.55rem);
  --fs-2xl:  clamp(1.6rem, 3vw, 2.3rem);
  --fs-hero: clamp(2.1rem, 4.2vw, 3.5rem);
  --fs-szam: clamp(2.4rem, 5.6vw, 4.2rem);

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;

  --r-kicsi: 3px;
  --r-kozep: 6px;
  --r-nagy:  12px;

  --arnyek: 0 4px 16px rgba(21,35,42,.09), 0 1px 3px rgba(21,35,42,.06);

  --keret:   1240px;
  --olvaso:  66ch;
  --fejlec-m: 76px;

  --mozgas: 260ms cubic-bezier(.2,.6,.3,1);
}

@font-face{font-family:"IBM Plex Sans";src:url("../fonts/plex-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/plex-sans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/plex-sans-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Serif";src:url("../fonts/plex-serif-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Serif";src:url("../fonts/plex-serif-400i.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:"IBM Plex Serif";src:url("../fonts/plex-serif-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}

/* =========================================================
   2. ALAPOK
   ========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }   /* a display:flex/grid ne írja felül */

html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--fejlec-m) + 12px); -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--felulet); color:var(--szoveg);
  font-family:var(--font-serif); font-size:var(--fs-base); line-height:1.7;
  overflow-x:hidden;
}
img,svg{ max-width:100%; }
img{ height:auto; display:block; }
h1,h2,h3{
  font-family:var(--font-sans); font-weight:600; line-height:1.18;
  letter-spacing:-.012em; margin:0 0 var(--sp-4); color:inherit;
}
h1{ font-size:var(--fs-hero); letter-spacing:-.022em; }
h2{ font-size:var(--fs-2xl); }
h3{ font-size:var(--fs-xl); }
p{ margin:0 0 var(--sp-4); }
a{ color:var(--nuxon-primary); text-underline-offset:.18em; }
a:hover{ text-decoration-thickness:2px; }
:focus-visible{ outline:3px solid var(--jel); outline-offset:3px; border-radius:2px; }
var{ font-style:italic; font-family:var(--font-serif); }

.sr{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.ugro{
  position:absolute; left:var(--sp-4); top:-60px; z-index:100;
  background:var(--nuxon-primary); color:#fff; padding:var(--sp-2) var(--sp-4);
  font-family:var(--font-sans); border-radius:var(--r-kicsi);
}
.ugro:focus{ top:var(--sp-3); }
.nowrap{ white-space:nowrap; }

/* =========================================================
   3. KÖZÖS ELEMEK
   ========================================================= */
.keret{ max-width:var(--keret); margin:0 auto; padding:0 clamp(18px,4vw,40px); }

.szakasz{ padding:clamp(56px,8vw,104px) 0; }
.szakasz--alt{ background:var(--felulet-alt); }
.szakasz--sotet{ background:var(--nuxon-deep); color:var(--szoveg-inverz); }
.szakasz--sotet a:not(.btn){ color:#fff; }
.szakasz__fej{ margin-bottom:clamp(32px,4vw,56px); }
.szakasz__fej h2,.olvaso,.bevezeto{ max-width:var(--olvaso); }
.bevezeto{ font-family:var(--font-sans); font-size:var(--fs-lg); line-height:1.5; color:var(--szoveg-halk); }
.cim-szeles{ max-width:30ch; }

.ket-oszlop{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(32px,5vw,72px); align-items:center;
}
.ket-oszlop--szoveg{ align-items:start; margin-top:var(--sp-5); }

.gombsor{ display:flex; flex-wrap:wrap; gap:var(--sp-3); margin-top:var(--sp-6); margin-bottom:0; }

/* gombok */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2);
  min-height:48px; padding:12px 22px; border-radius:var(--r-kozep);
  font-family:var(--font-sans); font-size:1rem; font-weight:600; line-height:1.25;
  text-decoration:none; text-align:center; cursor:pointer;
  border:2px solid transparent; transition:background-color var(--mozgas), border-color var(--mozgas), color var(--mozgas);
}
.btn--elsodleges{ background:linear-gradient(100deg, var(--nuxon-primary) 0%, #1A62B4 60%, var(--nuxon-accent) 140%); color:#fff; }
.btn--elsodleges:hover{ background:var(--nuxon-primary-dark); color:#fff; }
.btn--masodlagos{ background:var(--felulet); color:var(--nuxon-primary); border-color:var(--nuxon-primary); }
.btn--masodlagos:hover{ background:var(--jel-halvany); }
.btn--sotet-masodlagos{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.btn--sotet-masodlagos:hover{ border-color:#fff; background:rgba(255,255,255,.06); color:#fff; }
.btn--halk{ background:var(--felulet); color:var(--nuxon-primary); border-color:var(--vonal-eros); min-height:44px; padding:8px 16px; }
.btn--nagy{ min-height:56px; padding:14px 28px; font-size:1.0625rem; }
.btn:disabled{ opacity:.5; cursor:not-allowed; }

/* kiemelt mondat */
.kiemeles{
  font-family:var(--font-sans); font-weight:500; font-size:var(--fs-xl); line-height:1.4;
  max-width:44ch; margin:clamp(40px,5vw,64px) 0 0; padding-left:var(--sp-5);
  border-left:4px solid var(--jel);
}
.kiemeles--kicsi{ font-size:var(--fs-lg); max-width:56ch; }

/* =========================================================
   4. FEJLÉC ÉS MENÜ
   ========================================================= */
.fejlec{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.97);
  border-bottom:1px solid transparent; transition:border-color var(--mozgas), box-shadow var(--mozgas);
}
.fejlec.is-kompakt{ border-bottom-color:var(--vonal); box-shadow:0 2px 10px rgba(21,35,42,.06); }
.fejlec__sor{ display:flex; align-items:center; gap:var(--sp-5); min-height:var(--fejlec-m); transition:min-height var(--mozgas); }
.fejlec.is-kompakt .fejlec__sor{ min-height:62px; }
.marka{ flex:none; display:block; line-height:0; }
.marka picture{ display:block; }
.marka img{ width:90px; }

.fonav{ margin-left:auto; display:flex; align-items:center; gap:var(--sp-5); }
.fonav ul{ list-style:none; margin:0; padding:0; display:flex; gap:clamp(12px,1.6vw,26px); }
.fonav ul a{
  font-family:var(--font-sans); font-size:.95rem; font-weight:500; color:var(--szoveg);
  text-decoration:none; padding:var(--sp-2) 0; border-bottom:2px solid transparent;
}
.fonav ul a:hover{ border-bottom-color:var(--jel); }
.fonav__cta{ min-height:44px; padding:10px 18px; font-size:.95rem; }

.menu-gomb{
  display:none; margin-left:auto; width:48px; height:48px; border:0; background:transparent;
  cursor:pointer; position:relative; border-radius:var(--r-kozep);
}
.menu-gomb__vonal,.menu-gomb__vonal::before,.menu-gomb__vonal::after{
  position:absolute; left:12px; width:24px; height:2px; background:var(--szoveg); content:"";
  transition:transform var(--mozgas), opacity var(--mozgas);
}
.menu-gomb__vonal{ top:23px; }
.menu-gomb__vonal::before{ top:-8px; left:0; }
.menu-gomb__vonal::after{ top:8px; left:0; }
.menu-gomb[aria-expanded="true"] .menu-gomb__vonal{ background:transparent; }
.menu-gomb[aria-expanded="true"] .menu-gomb__vonal::before{ transform:translateY(8px) rotate(45deg); }
.menu-gomb[aria-expanded="true"] .menu-gomb__vonal::after{ transform:translateY(-8px) rotate(-45deg); }

/* =========================================================
   5. BLOKKOK
   ========================================================= */

/* ---------- 02. hero ---------- */
.hero{
  background:var(--nuxon-deep); color:var(--szoveg-inverz);
  padding:clamp(40px,6vw,88px) 0 clamp(40px,5vw,64px);
  overflow:hidden;
}
.hero__racs{
  display:grid; grid-template-columns:minmax(0,55fr) minmax(0,45fr);
  gap:clamp(28px,4vw,64px); align-items:center;
}
.hero h1{ color:#fff; max-width:17ch; }
.hero__szoveg p{ color:var(--szoveg-inverz-halk); max-width:58ch; }
.hero__szoveg p:first-of-type{ color:var(--szoveg-inverz); }

/* rendszerábra */
.rendszerabra{ margin:0; }
.rendszerabra__vaszon{ position:relative; aspect-ratio:600/400; color:var(--szoveg-inverz-halk); }
.rendszerabra__svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.ra-haz,.ra-venti-haz,.ra-motor,.ra-szamlalo,.ra-mero{ fill:rgba(255,255,255,.03); stroke:#6F84BD; stroke-width:2; }
.ra-valaszto{ stroke:#6F84BD; stroke-width:1; stroke-dasharray:4 5; fill:none; opacity:.8; }
.ra-zsalu{ stroke:#6F84BD; stroke-width:2; fill:none; }
.ra-szuro{ fill:none; stroke:var(--jel); stroke-width:3; stroke-linejoin:round; }
.ra-vezetek{ fill:none; stroke:#8FA1D0; stroke-width:1.5; }
.ra-mutato{ stroke:var(--jel); stroke-width:3; stroke-linecap:round; }
.ra-lapat{ fill:none; stroke:#C9D3EE; stroke-width:2.5; stroke-linecap:round; transform-origin:390px 215px; animation:forog 6s linear infinite; }
.ra-lapat circle{ fill:#C9D3EE; stroke:none; }
.ra-szamjegy{ stroke:var(--jel); stroke-width:3; opacity:.75; }
.ra-cimkevonal path{ stroke:var(--jel); stroke-width:1.5; stroke-dasharray:3 4; fill:none; }
.legaram path{ stroke:var(--jel); stroke-width:1.5; stroke-dasharray:6 14; opacity:.55; fill:none; animation:aramlik 2.4s linear infinite; }

.meresi-cimkek{ list-style:none; margin:0; padding:0; }
.meresi-cimke{
  position:absolute; display:flex; flex-direction:column; gap:1px;
  padding:6px 10px; border:1px solid var(--jel); border-radius:var(--r-kicsi);
  background:rgba(16,28,74,.92); font-family:var(--font-sans); line-height:1.2;
}
.meresi-cimke__nev{ font-size:.875rem; font-weight:500; color:#fff; }
.meresi-cimke__egyseg{ font-size:.8125rem; color:var(--jel); font-variant-numeric:tabular-nums; }
.meresi-cimke--q{ left:4%; top:81%; }
.meresi-cimke--csere{ left:26%; top:81%; }
.meresi-cimke--dp{ left:42%; top:9%; }
.meresi-cimke--h{ left:53%; top:81%; }

@keyframes aramlik{ to{ stroke-dashoffset:-40; } }
@keyframes forog{ to{ transform:rotate(360deg); } }

/* mérnöki folyamat */
.folyamat{
  list-style:none; margin:clamp(40px,5vw,64px) 0 0; padding:var(--sp-5) 0 0;
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:0;
  border-top:1px solid var(--vonal-sotet); counter-reset:lepes;
}
.folyamat li{
  position:relative; padding:0 var(--sp-3) 0 0; display:flex; flex-direction:column; gap:2px;
  font-family:var(--font-sans);
}
.folyamat li::before{
  content:""; display:block; width:12px; height:12px; border-radius:50%;
  border:2px solid var(--jel); background:var(--nuxon-deep); margin:-31px 0 var(--sp-3);
  position:relative; z-index:1;
}
.folyamat li:last-child::before{ background:var(--jel); }
.folyamat__nev{ font-size:var(--fs-lg); font-weight:600; color:#fff; }
.folyamat__egyseg{ font-size:var(--fs-xs); color:var(--szoveg-inverz-halk); }
/* a sáv a TCO felé töltődik fel, egyszer, amikor a látogató eléri */
.folyamat::before{
  content:""; position:absolute; height:2px; background:var(--jel);
  transform-origin:left; transform:scaleX(0); transition:transform 1.4s cubic-bezier(.3,.6,.2,1);
}
.folyamat{ position:relative; }
.folyamat::before{ left:0; right:0; top:-1px; }
.folyamat.is-lathato::before{ transform:scaleX(1); }

/* ---------- 03. költségegyenlet ---------- */
.egyenlet{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto;
  gap:0; align-items:start;
}
.egyenlet__tag,.egyenlet__osszeg{
  position:relative; padding:0 clamp(20px,2.4vw,36px) 0 0;
  opacity:0; transform:translateY(10px);
  transition:opacity 500ms ease, transform 500ms ease;
}
.egyenlet.is-lathato .egyenlet__tag,.egyenlet.is-lathato .egyenlet__osszeg{ opacity:1; transform:none; }
.egyenlet.is-lathato li:nth-child(2){ transition-delay:150ms; }
.egyenlet.is-lathato li:nth-child(3){ transition-delay:300ms; }
.egyenlet.is-lathato li:nth-child(4){ transition-delay:450ms; }
.egyenlet.is-lathato li:nth-child(5){ transition-delay:650ms; }
.egyenlet__szo{
  font-family:var(--font-sans); font-weight:600;
  font-size:clamp(1.35rem,2.3vw,1.9rem); line-height:1.15; letter-spacing:-.015em;
  color:var(--nuxon-primary); padding-bottom:var(--sp-3); margin-bottom:var(--sp-3);
  border-bottom:2px solid var(--nuxon-primary); min-height:3.6em;
  display:flex; align-items:flex-end;
}
.egyenlet__tag p{ font-size:var(--fs-sm); line-height:1.6; color:var(--szoveg-halk); margin:0; }
/* műveleti jelek: + a tagok után, = az összeg előtt */
.egyenlet__tag::after{
  content:"+"; position:absolute; right:clamp(4px,.6vw,10px); top:calc(3.6em * .6);
  font-family:var(--font-sans); font-weight:400; font-size:clamp(1.35rem,2.3vw,1.9rem); color:var(--jel);
}
.egyenlet__tag:nth-child(4)::after{ content:"="; }
.egyenlet__osszeg{ padding-right:0; }
.egyenlet__osszeg .egyenlet__szo{
  color:#fff; background:var(--nuxon-primary); border:0; padding:var(--sp-3) var(--sp-5);
  border-radius:var(--r-kicsi); min-height:0; margin-top:calc(3.6em * .38);
  font-size:clamp(1.5rem,2.8vw,2.3rem);
}

/* ---------- 04. légcsatorna ---------- */
.csatorna{ margin:0; }
.csatorna svg{ display:block; width:100%; max-width:560px; height:auto; overflow:visible; }
.cs-fal{ stroke:var(--nuxon-antracit); stroke-width:3; fill:none; }
.cs-aram path{ stroke:var(--jel); stroke-width:2; stroke-dasharray:8 14; fill:none; opacity:.7; }
.csatorna.is-lathato .cs-aram path{ animation:aramlik 2.4s linear infinite; }
.cs-szuro{ fill:none; stroke:var(--nuxon-primary); stroke-width:3.5; stroke-linejoin:round; }
.cs-vezetek{ fill:none; stroke:var(--szoveg-halk); stroke-width:2; }
.cs-mano{ fill:none; stroke:var(--nuxon-antracit); stroke-width:2.5; }
.cs-folyadek{ fill:none; stroke:var(--jel); stroke-width:6; stroke-linecap:round; opacity:.85; }
.cs-venti,.cs-szamlalo{ fill:var(--felulet); stroke:var(--nuxon-antracit); stroke-width:2.5; }
.cs-lapat{ fill:none; stroke:var(--nuxon-primary); stroke-width:3; stroke-linecap:round; transform-origin:440px 150px; }
.csatorna.is-lathato .cs-lapat{ animation:forog 5s linear infinite; }
.cs-cimke{ font-family:var(--font-sans); font-size:26px; font-weight:500; fill:var(--szoveg); }
.cs-cimke--hangsuly{ font-weight:600; fill:var(--nuxon-primary); }
.keplet{
  margin-top:var(--sp-5); padding:var(--sp-4) var(--sp-5); max-width:560px;
  background:var(--felulet); border-left:4px solid var(--nuxon-primary); border-radius:0 var(--r-kicsi) var(--r-kicsi) 0;
  font-family:var(--font-sans);
}
.keplet__sor{ display:block; font-size:var(--fs-xl); font-weight:500; }
.keplet__jelmagyarazat{ display:block; font-size:var(--fs-sm); color:var(--szoveg-halk); margin-top:var(--sp-1); }

/* ---------- 05. éves idővonal ---------- */
.idovonal{
  margin:0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--sp-5) clamp(24px,4vw,56px);
  align-items:end;
}
.idovonal__honapok{
  display:grid; grid-template-columns:repeat(12,1fr);
  font-family:var(--font-sans); font-size:var(--fs-xs); color:var(--szoveg-halk); text-align:center;
}
.idovonal__sav{
  position:relative; height:44px; margin:var(--sp-2) 0 var(--sp-4);
  background:repeating-linear-gradient(90deg, var(--vonal) 0 1px, transparent 1px calc(100% / 12));
  border-top:2px solid var(--nuxon-antracit);
}
.idovonal__csere{
  position:absolute; top:-9px; left:calc((var(--ho) - .5) / 12 * 100%);
  width:16px; height:16px; margin-left:-8px; border-radius:50%;
  background:var(--nuxon-primary); box-shadow:0 0 0 4px var(--felulet);
  transform:scale(0); transition:transform 380ms cubic-bezier(.3,1.4,.5,1);
}
.idovonal__csere::after{
  content:"csere"; position:absolute; top:22px; left:50%; transform:translateX(-50%);
  font-family:var(--font-sans); font-size:var(--fs-xs); color:var(--nuxon-primary); font-weight:500;
}
.idovonal.is-lathato .idovonal__csere{ transform:scale(1); }
.idovonal.is-lathato .idovonal__csere:nth-child(2){ transition-delay:200ms; }
.idovonal.is-lathato .idovonal__csere:nth-child(3){ transition-delay:400ms; }
.idovonal.is-lathato .idovonal__csere:nth-child(4){ transition-delay:600ms; }
.idovonal__retegek{ display:grid; gap:4px; }
.reteg{
  font-family:var(--font-sans); font-size:var(--fs-sm); font-weight:500; padding:8px 12px;
  border-radius:var(--r-kicsi); color:#fff;
}
.reteg--anyag{ background:var(--c-anyag); color:var(--nuxon-deep); }
.reteg--munka{ background:var(--c-munka); }
.reteg--hulladek{ background:var(--c-egyeb); color:var(--nuxon-deep); }
.idovonal__halom{ display:flex; flex-direction:column-reverse; gap:4px; padding-bottom:4px; }
.idovonal__halom span{
  width:88px; height:22px; border:2px solid var(--szoveg-halk); border-radius:2px;
  background:repeating-linear-gradient(90deg, transparent 0 7px, var(--vonal-eros) 7px 9px);
  opacity:0; transition:opacity 300ms ease;
}
.idovonal.is-lathato .idovonal__halom span{ opacity:1; }
.idovonal.is-lathato .idovonal__halom span:nth-child(2){ transition-delay:250ms; }
.idovonal.is-lathato .idovonal__halom span:nth-child(3){ transition-delay:450ms; }
.idovonal.is-lathato .idovonal__halom span:nth-child(4){ transition-delay:650ms; }
.idovonal figcaption{ grid-column:1 / -1; font-family:var(--font-sans); font-size:var(--fs-sm); color:var(--szoveg-halk); }

/* ---------- 08. lead helyőrző (2. körben űrlap) ---------- */
.lead-helyorzo{
  margin-top:var(--sp-7); padding:var(--sp-6); max-width:760px;
  border:2px dashed var(--vonal-eros); border-radius:var(--r-nagy); background:var(--felulet);
  font-family:var(--font-sans); font-size:var(--fs-sm); color:var(--szoveg-halk);
}
.lead-helyorzo__cim{ font-size:var(--fs-lg); font-weight:600; color:var(--szoveg); }
.lead-helyorzo p:last-child{ margin:0; }

/* ---------- 09. kettéosztott ábra ---------- */
.osztott{ display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--vonal-eros); border-radius:var(--r-kozep); overflow:hidden; }
.osztott__fel{ display:flex; flex-direction:column; gap:var(--sp-3); padding:var(--sp-5); font-family:var(--font-sans); }
.osztott__fel + .osztott__fel{ border-left:1px solid var(--vonal-eros); background:var(--felulet-alt); }
.osztott__cim{ font-weight:600; font-size:var(--fs-base); padding-bottom:var(--sp-3); border-bottom:1px solid var(--vonal); }
.osztott__sor{ font-size:1rem; color:var(--szoveg-halk); padding-left:var(--sp-4); position:relative; }
.osztott__sor::before{ content:""; position:absolute; left:0; top:.6em; width:8px; height:2px; background:var(--nuxon-primary); }

/* ---------- 10. MESP ---------- */
.szakasz--sotet h2{ color:#fff; }
.szakasz--sotet .olvaso p{ color:var(--szoveg-inverz-halk); }
.szakasz--sotet .olvaso .figyelmeztetes{
  border-left:3px solid var(--jel); padding-left:var(--sp-4); color:var(--szoveg-inverz);
}
.mesp{ margin:0; }
.mesp svg{ display:block; width:100%; max-width:580px; height:auto; }
.mesp-keret{ stroke:#6F84BD; stroke-width:2.5; fill:none; }
.mesp-szal path{ stroke:#C9D3EE; stroke-width:2; stroke-dasharray:2 6; fill:none; }
.mesp-toltes text{ font-family:var(--font-sans); font-size:24px; font-weight:600; fill:var(--jel); text-anchor:middle; }
.mesp-lemez path{ stroke:#C9D3EE; stroke-width:4; stroke-linecap:round; }
.mesp-reszecske circle{ fill:#AEBBD6; }
.mesp-reszecske--kotott circle{ fill:var(--jel); }
.mesp-aram path{ stroke:var(--jel); stroke-width:2; stroke-dasharray:8 12; fill:none; opacity:.6; }
.mesp.is-lathato .mesp-aram path{ animation:aramlik 2.4s linear infinite; }
.mesp-reszecske--be{ transition:transform 1.2s ease; }
.mesp.is-lathato .mesp-reszecske--be{ transform:translateX(18px); }
.mesp-cimke{ font-family:var(--font-sans); font-size:24px; font-weight:500; fill:var(--szoveg-inverz); }

/* ---------- 11. összehasonlító munkalap ---------- */
.munkalap{ border-top:2px solid var(--nuxon-antracit); font-family:var(--font-sans); margin-bottom:var(--sp-2); }
.munkalap__sor{
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
  gap:var(--sp-5); padding:var(--sp-3) 0; border-bottom:1px solid var(--vonal);
  font-size:var(--fs-sm); align-items:center;
}
.munkalap__sor--fej{ font-weight:600; font-size:var(--fs-xs); color:var(--szoveg-halk); padding:var(--sp-3) 0; }
.munkalap__sor--tco{ font-weight:600; border-bottom:2px solid var(--nuxon-antracit); }
.munkalap .ures{ height:2px; background-image:linear-gradient(90deg, var(--vonal-eros) 50%, transparent 0); background-size:8px 2px; }
.munkalap [role="rowheader"]{ font-weight:500; }

/* ---------- 12. esettanulmány (rejtett, amíg nincs adat) ---------- */
.esettanulmany{ background:var(--felulet); border-radius:var(--r-nagy); padding:var(--sp-6); margin-bottom:var(--sp-5); }
.esettanulmany__ut{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-5); }
.esettanulmany__lepes{ display:block; font-family:var(--font-sans); font-size:var(--fs-xs); font-weight:600; color:var(--nuxon-primary); margin-bottom:var(--sp-1); }

/* ---------- 14. adatlap ---------- */
.adatlap{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(20px,4vw,48px); align-items:start; }
.adatlap__ikon{ width:clamp(56px,7vw,88px); height:auto; fill:none; stroke:var(--nuxon-primary); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.adatlap__ikon path:last-child{ stroke:var(--jel); stroke-width:3.5; }

/* ---------- 15. szabványsín ---------- */
.szabvanysin{
  list-style:none; margin:var(--sp-6) 0 0; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px);
}
.szabvanysin li{ border-top:2px solid var(--nuxon-antracit); padding-top:var(--sp-4); }
.szabvanysin__jel{ display:block; font-family:var(--font-sans); font-weight:600; font-size:var(--fs-xl); color:var(--nuxon-primary); margin-bottom:var(--sp-3); }
.szabvanysin p{ font-size:var(--fs-base); margin:0; max-width:60ch; }

/* ---------- 16. GYIK ---------- */
.gyik{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:clamp(24px,4vw,64px); align-items:start; }
.gyik__lista{ border-top:1px solid var(--vonal); }
.gyik details{ border-bottom:1px solid var(--vonal); }
.gyik summary{
  list-style:none; cursor:pointer; padding:var(--sp-4) 40px var(--sp-4) 0; position:relative;
  font-family:var(--font-sans); font-weight:500; font-size:var(--fs-lg); line-height:1.4;
}
.gyik summary::-webkit-details-marker{ display:none; }
.gyik summary::after{
  content:""; position:absolute; right:8px; top:50%; width:12px; height:12px; margin-top:-8px;
  border-right:2px solid var(--nuxon-primary); border-bottom:2px solid var(--nuxon-primary);
  transform:rotate(45deg); transition:transform var(--mozgas);
}
.gyik details[open] summary::after{ transform:rotate(225deg); margin-top:-2px; }
.gyik details p{ padding:0 40px var(--sp-5) 0; margin:0; color:var(--szoveg-halk); max-width:var(--olvaso); }

/* ---------- 17. záró ---------- */
.zaro h2{ max-width:24ch; }

/* ---------- 404-es oldal ---------- */
.hiba404{
  font-family:var(--font-sans); font-weight:600; line-height:1; margin:0 0 var(--sp-4);
  font-size:clamp(4rem,12vw,7rem); letter-spacing:-.04em; color:var(--jel); opacity:.35;
}

/* ---------- 18. lábléc ---------- */
.lablec{ background:var(--felulet-lablec); color:var(--szoveg-inverz-halk); font-family:var(--font-sans); font-size:var(--fs-sm); line-height:1.6; padding:clamp(48px,6vw,72px) 0 var(--sp-5); }
.lablec a{ color:var(--szoveg-inverz); }
.lablec h2{ font-size:var(--fs-sm); font-weight:600; color:#fff; margin-bottom:var(--sp-3); letter-spacing:0; }
.lablec p{ margin:0 0 var(--sp-1); }
.lablec__racs{ display:grid; grid-template-columns:minmax(0,.7fr) repeat(3,minmax(0,1fr)); gap:var(--sp-6); }
.lablec__logo{ width:111px; }
.lablec__kapcsolodo{ list-style:none; margin:0; padding:0; display:grid; gap:var(--sp-2); }
.lablec__kapcsolodo a{ color:var(--szoveg-inverz-halk); }
.lablec__zaro{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--sp-3);
  margin-top:var(--sp-7); padding-top:var(--sp-5); border-top:1px solid var(--vonal-sotet);
}
.lablec__jogi{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:var(--sp-5); }

/* =========================================================
   6. KALKULÁTOR ÉS EREDMÉNY
   ========================================================= */
.kalk{
  background:var(--felulet); border:1px solid var(--vonal); border-radius:var(--r-nagy);
  box-shadow:var(--arnyek); display:grid; grid-template-columns:230px minmax(0,1fr);
  min-height:420px; overflow:hidden; font-family:var(--font-sans);
}
.kalk__noscript{ padding:var(--sp-6); }

/* lépésjelző */
.lepeso{ list-style:none; margin:0; padding:var(--sp-6) 0; background:var(--nuxon-deep); }
.lepeso__gomb{
  display:flex; align-items:center; gap:var(--sp-3); width:100%; min-height:52px;
  padding:var(--sp-2) var(--sp-5); border:0; background:transparent; cursor:pointer; text-align:left;
  font:inherit; font-size:var(--fs-base); color:var(--szoveg-inverz-halk); position:relative;
}
.lepeso__gomb:disabled{ cursor:default; opacity:.55; }
.lepeso__szam{
  flex:none; width:28px; height:28px; border-radius:50%; display:grid; place-items:center;
  border:2px solid currentColor; font-size:var(--fs-xs); font-weight:600; font-variant-numeric:tabular-nums;
}
.lepeso__elem.is-aktiv .lepeso__gomb{ color:#fff; background:rgba(255,255,255,.06); }
.lepeso__elem.is-aktiv .lepeso__gomb::before{ content:""; position:absolute; left:0; top:8px; bottom:8px; width:3px; background:var(--jel); }
.lepeso__elem.is-aktiv .lepeso__szam{ border-color:var(--jel); color:var(--jel); }
.lepeso__elem.is-kesz .lepeso__szam{ background:var(--jel); border-color:var(--jel); color:var(--nuxon-deep); }
.lepeso-mobil{ display:none; }

.kalk-lapok{ padding:clamp(24px,3.5vw,44px); }
.kalk-lap__szamlalo{ font-size:var(--fs-xs); color:var(--szoveg-halk); margin:0 0 var(--sp-1); font-variant-numeric:tabular-nums; }
.kalk-lap__cim{ font-size:var(--fs-xl); margin-bottom:var(--sp-2); }
.kalk-lap__cim:focus{ outline:none; }
.kalk-lap__bev{ color:var(--szoveg-halk); font-size:var(--fs-sm); max-width:60ch; }
.kalk-lap__mezok{ display:grid; gap:var(--sp-5); margin-top:var(--sp-5); max-width:640px; }
.kalk-lap__osszegzo{ color:var(--hiba); font-weight:500; font-size:var(--fs-sm); margin:var(--sp-5) 0 0; }
.kalk-lap__osszegzo::before{ content:"! "; font-weight:600; }
.kalk-lap__gombok{
  display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3);
  margin-top:var(--sp-6); padding-top:var(--sp-5); border-top:1px solid var(--vonal); max-width:640px;
}

/* mező */
.mezo__cimke{ display:block; font-weight:600; font-size:var(--fs-base); margin-bottom:2px; }
.mezo__opc{ font-weight:400; color:var(--szoveg-halk); font-size:var(--fs-sm); }
.mezo__sugo{ font-size:var(--fs-sm); color:var(--szoveg-halk); line-height:1.5; margin:0 0 var(--sp-2); max-width:62ch; }
.mezo__sor{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-3) var(--sp-5); }
.mezo__input{
  display:inline-flex; align-items:stretch; border:2px solid var(--vonal-eros); border-radius:var(--r-kozep);
  background:var(--felulet); overflow:hidden; transition:border-color var(--mozgas);
}
.mezo__input:focus-within{ border-color:var(--nuxon-primary); box-shadow:0 0 0 3px var(--jel-halvany); }
.mezo__input input{
  border:0; outline:0; width:11ch; min-height:52px; padding:0 var(--sp-3);
  font-family:var(--font-sans); font-size:1.25rem; font-weight:500; color:var(--szoveg);
  font-variant-numeric:tabular-nums; text-align:right; background:transparent;
}
.mezo__input input:disabled{ background:var(--felulet-alt); color:var(--szoveg-halk); }
.mezo__egyseg{
  display:flex; align-items:center; padding:0 var(--sp-3); min-width:4.5em;
  background:var(--felulet-alt); border-left:1px solid var(--vonal); color:var(--szoveg-halk); font-size:var(--fs-sm);
}
.mezo__input--kis input{ width:8ch; min-height:46px; font-size:1.0625rem; }
.mezo select,.mezo textarea{
  font-family:var(--font-sans); font-size:1rem; color:var(--szoveg); background:var(--felulet);
  border:2px solid var(--vonal-eros); border-radius:var(--r-kozep); min-height:52px; padding:0 var(--sp-3);
  width:100%; max-width:420px;
}
.mezo textarea{ padding:var(--sp-3); max-width:640px; min-height:96px; resize:vertical; line-height:1.5; }
.mezo select:focus,.mezo textarea:focus{ outline:0; border-color:var(--nuxon-primary); box-shadow:0 0 0 3px var(--jel-halvany); }

/* „Nem tudom": látható másodlagos választás */
.nemtudom{
  display:inline-flex; align-items:center; gap:var(--sp-2); min-height:48px; padding:0 var(--sp-4);
  border:2px solid var(--vonal); border-radius:100px; cursor:pointer; font-size:var(--fs-sm); font-weight:500;
  color:var(--szoveg-halk); background:var(--felulet); transition:border-color var(--mozgas), background-color var(--mozgas);
}
.nemtudom input{ width:18px; height:18px; accent-color:var(--nuxon-primary); margin:0; }
.nemtudom:hover{ border-color:var(--vonal-eros); }
.mezo.is-nemtudom .nemtudom{ border-color:var(--nuxon-primary); color:var(--nuxon-primary); background:var(--jel-halvany); }

.mezo__hiba{ margin:var(--sp-2) 0 0; font-size:var(--fs-sm); font-weight:500; color:var(--hiba); min-height:0; }
.mezo__hiba:empty{ display:none; }
.mezo__hiba::before{ content:"Hiba: "; font-weight:600; }
.mezo.is-hibas .mezo__input,.mezo.is-hibas select{ border-color:var(--hiba); }

/* segédszámoló */
.seged{ margin-top:var(--sp-3); font-size:var(--fs-sm); }
.seged summary{ cursor:pointer; color:var(--nuxon-primary); font-weight:500; min-height:32px; display:inline-flex; align-items:center; }
.seged__sor{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--sp-3); margin-top:var(--sp-3); padding:var(--sp-4); background:var(--felulet-alt); border-radius:var(--r-kozep); }
.seged__mezo{ margin:0; display:grid; gap:4px; }
.seged__mezo label{ font-size:var(--fs-xs); color:var(--szoveg-halk); }
.seged__jel{ font-size:1.4rem; color:var(--szoveg-halk); padding-bottom:8px; }

/* ---------- eredmény-dashboard ---------- */
#eredmeny-app{ font-family:var(--font-sans); }
.dash{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--sp-6) clamp(28px,4vw,56px);
  border-top:4px solid var(--nuxon-primary); padding-top:var(--sp-6);
}
.dash--ures{ display:block; border-top:2px dashed var(--vonal-eros); }
.dash__ures-cim{ font-size:var(--fs-lg); font-weight:600; margin-bottom:var(--sp-2); }
.dash__fej{ grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-3) var(--sp-5); }
.dash__fej p{ margin:0; }
.dash__allapot{ flex:1 1 360px; color:var(--szoveg-halk); font-size:var(--fs-sm); }
.dash__teljesseg{ font-size:var(--fs-sm); font-weight:500; font-variant-numeric:tabular-nums; }
.jelveny{ display:inline-flex; align-items:center; gap:var(--sp-2); padding:6px 14px; border-radius:100px; font-size:var(--fs-sm); font-weight:600; }
.jelveny::before{ content:""; width:10px; height:10px; border-radius:50%; background:currentColor; }
.jelveny--teljes{ background:rgba(27,122,75,.1); color:var(--siker); }
.jelveny--reszleges{ background:rgba(154,100,16,.1); color:var(--figyel); }
.jelveny--reszleges::before{ background:transparent; border:2px solid currentColor; }

.idotav{ display:inline-flex; border:2px solid var(--nuxon-primary); border-radius:var(--r-kozep); overflow:hidden; margin-bottom:var(--sp-5); }
.idotav__gomb{
  min-height:44px; min-width:72px; padding:0 var(--sp-4); border:0; background:var(--felulet); cursor:pointer;
  font:inherit; font-weight:600; color:var(--nuxon-primary);
}
.idotav__gomb + .idotav__gomb{ border-left:2px solid var(--nuxon-primary); }
.idotav__gomb[aria-pressed="true"]{ background:var(--nuxon-primary); color:#fff; }
.dash__tco-cimke{ font-size:var(--fs-sm); color:var(--szoveg-halk); margin:0 0 var(--sp-1); }
.dash__tco{
  font-size:var(--fs-szam); font-weight:600; line-height:1.05; letter-spacing:-.025em; margin:0 0 var(--sp-3);
  color:var(--nuxon-deep); font-variant-numeric:tabular-nums;
}
.dash__tco-nincs{ font-size:var(--fs-xl); color:var(--szoveg-halk); letter-spacing:0; }
.dash__megj{ font-size:var(--fs-xs); color:var(--szoveg-halk); max-width:52ch; }
.osszetetel{ display:flex; height:14px; border-radius:2px; overflow:hidden; background:var(--felulet-alt); margin-top:var(--sp-4); gap:2px; }
.osszetetel__resz{ flex-grow:0; flex-shrink:0; min-width:3px; }
.osszetetel__resz--energia{ background:var(--c-energia); }
.osszetetel__resz--anyag{ background:var(--c-anyag); }
.osszetetel__resz--munka{ background:var(--c-munka); }
.osszetetel__resz--egyeb{ background:var(--c-egyeb); }

.dash__elemek{ list-style:none; margin:0; padding:0; border-top:1px solid var(--vonal); }
.dash__elem{
  display:grid; grid-template-columns:14px minmax(0,1fr) auto; column-gap:var(--sp-3); row-gap:2px;
  padding:var(--sp-3) 0; border-bottom:1px solid var(--vonal); align-items:baseline;
}
.dash__jel{ width:12px; height:12px; border-radius:2px; align-self:center; }
.dash__jel--kwh{ background:transparent; border:2px solid var(--c-energia); }
.dash__jel--energia{ background:var(--c-energia); }
.dash__jel--anyag{ background:var(--c-anyag); }
.dash__jel--munka{ background:var(--c-munka); }
.dash__jel--egyeb{ background:var(--c-egyeb); }
.dash__nev{ font-size:var(--fs-sm); line-height:1.4; }
.dash__ertek{ font-weight:600; font-size:var(--fs-base); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.dash__statusz{ font-weight:500; font-size:var(--fs-xs); color:var(--figyel); white-space:normal; display:inline-block; max-width:22ch; text-align:right; }
.dash__elem.is-hianyzo .dash__jel{ opacity:.35; }
.dash__arany{ grid-column:2 / -1; font-size:var(--fs-xs); color:var(--szoveg-halk); }

.dash__hiany{ grid-column:1 / -1; padding:var(--sp-4) var(--sp-5); background:rgba(154,100,16,.07); border-left:3px solid var(--figyel); border-radius:0 var(--r-kicsi) var(--r-kicsi) 0; font-size:var(--fs-sm); }
.dash__hiany p{ margin:0; }
.dash__hiany-cim{ font-weight:600; }
.dash__bemenet{ grid-column:1 / -1; font-size:var(--fs-sm); }
.dash__bemenet summary{ cursor:pointer; font-weight:500; color:var(--nuxon-primary); min-height:40px; display:inline-flex; align-items:center; }
.dash__bemenet dl{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--sp-2) var(--sp-6); margin:var(--sp-3) 0; }
.dash__bemenet dl div{ display:flex; justify-content:space-between; gap:var(--sp-3); border-bottom:1px dotted var(--vonal-eros); padding:4px 0; }
.dash__bemenet dt{ color:var(--szoveg-halk); }
.dash__bemenet dd{ margin:0; font-weight:500; text-align:right; font-variant-numeric:tabular-nums; }
.dash__keplet{ font-style:italic; color:var(--szoveg-halk); }
.dash__jogi{ grid-column:1 / -1; font-size:var(--fs-xs); color:var(--szoveg-halk); line-height:1.6; max-width:90ch; margin:0; }
.dash__cta{ grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-4) var(--sp-6); padding-top:var(--sp-5); border-top:1px solid var(--vonal); }
.dash__link{ font:inherit; font-size:var(--fs-sm); color:var(--nuxon-primary); background:none; border:0; padding:0; text-decoration:underline; text-underline-offset:.18em; cursor:pointer; min-height:44px; }
.labjegyzet{ font-family:var(--font-sans); font-size:var(--fs-xs); color:var(--szoveg-halk); margin:var(--sp-5) 0 0; }

/* =========================================================
   7. SÜTI-BANNER (az elektrosztatikusszuro.hu-ról átvéve)
   ========================================================= */
.cc{ position:fixed; left:0; right:0; bottom:0; z-index:90; padding:clamp(12px,2vw,20px); font-family:var(--font-sans); }
.cc__doboz{
  max-width:var(--keret); margin:0 auto; background:var(--felulet); color:var(--szoveg);
  border:1px solid var(--vonal); border-top:3px solid var(--jel); border-radius:var(--r-nagy); box-shadow:var(--arnyek);
  padding:clamp(18px,2.4vw,28px); display:grid; grid-template-columns:minmax(0,1fr) auto;
  gap:var(--sp-5) clamp(24px,3vw,40px); align-items:start;
}
.cc__cim{ font-size:var(--fs-lg); margin:0 0 var(--sp-2); }
.cc__leiras{ font-size:var(--fs-sm); line-height:1.55; color:var(--szoveg-halk); margin:0; max-width:74ch; }
.cc__link{ color:var(--nuxon-primary); }
.cc__gombok{ display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:flex-start; }
.cc__gomb{ white-space:nowrap; }
.cc__reszletek{ margin-top:var(--sp-5); padding-top:var(--sp-5); border-top:1px solid var(--vonal); display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5); }
.cc__kat-fej{ display:flex; align-items:center; gap:var(--sp-3); margin-bottom:var(--sp-2); min-height:32px; }
.cc__kat-cim{ font-size:var(--fs-sm); font-weight:600; }
.cc__kat-leiras{ font-size:var(--fs-xs); line-height:1.5; color:var(--szoveg-halk); margin:0; }
.cc__mindig{ font-size:var(--fs-xs); font-weight:600; color:var(--siker); background:rgba(27,122,75,.10); border-radius:100px; padding:3px 10px; }
.cc__kapcsolo{ display:flex; align-items:center; gap:var(--sp-3); cursor:pointer; }
.cc__kapcsolo input{ width:20px; height:20px; accent-color:var(--nuxon-primary); flex:none; }

/* =========================================================
   RESZPONZÍV
   ========================================================= */
@media (max-width:1100px){
  .fonav ul{ gap:14px; }
  .fonav ul a{ font-size:.9rem; }
  .lablec__racs{ grid-template-columns:1fr 1fr; }
}

@media (max-width:1023px){
  /* mobilmenü */
  .menu-gomb{ display:block; }
  .fonav{
    position:fixed; left:0; right:0; top:var(--fejlec-m); bottom:0; background:var(--felulet);
    flex-direction:column; align-items:stretch; gap:var(--sp-5); padding:var(--sp-5) clamp(18px,4vw,40px);
    overflow-y:auto; transform:translateX(100%); visibility:hidden; transition:transform var(--mozgas), visibility var(--mozgas);
  }
  .fejlec.is-kompakt .fonav{ top:62px; }
  .fonav.is-nyitva{ transform:none; visibility:visible; }
  .fonav ul{ flex-direction:column; gap:0; }
  .fonav ul a{ display:block; padding:var(--sp-4) 0; font-size:var(--fs-lg); border-bottom:1px solid var(--vonal); }
  .menu-nyitva body{ overflow:hidden; }

  .hero__racs{ grid-template-columns:1fr; }
  .hero h1{ max-width:20ch; }
  .rendszerabra{ max-width:640px; }
  .ket-oszlop{ grid-template-columns:1fr; }
  .egyenlet{ grid-template-columns:1fr 1fr; row-gap:var(--sp-6); }
  .egyenlet__tag:nth-child(2)::after,.egyenlet__tag:nth-child(4)::after{ display:none; }
  .egyenlet__osszeg{ grid-column:1 / -1; }
  .egyenlet__osszeg .egyenlet__szo{ margin-top:0; display:inline-flex; }
  .egyenlet__osszeg::before{ content:"="; font-family:var(--font-sans); font-size:1.9rem; color:var(--jel); margin-right:var(--sp-4); vertical-align:middle; }
  .egyenlet__szo{ min-height:0; }
  .gyik{ grid-template-columns:1fr; }
  .esettanulmany__ut{ grid-template-columns:1fr 1fr; }
  .cc__doboz{ grid-template-columns:1fr; }
  .cc__reszletek{ grid-template-columns:1fr 1fr; }
}

/* kalkulátor: mobilon a lépésjelző tömörített sávvá válik */
@media (max-width:860px){
  .kalk{ grid-template-columns:1fr; }
  .lepeso{ display:none; }
  .lepeso-mobil{
    display:block; padding:var(--sp-4) var(--sp-5); background:var(--nuxon-deep); color:#fff;
    font-size:var(--fs-sm); font-weight:500;
  }
  .lepeso-mobil__sav{ display:block; height:4px; margin-top:var(--sp-2); background:rgba(255,255,255,.16); border-radius:2px; }
  .lepeso-mobil__sav span{ display:block; height:100%; background:var(--jel); border-radius:2px; transition:width var(--mozgas); }
  .kalk-lap__szamlalo{ display:none; }
  .dash{ grid-template-columns:1fr; }
}

@media (max-width:767px){
  .marka img{ width:77px; }
  :root{ --fejlec-m:64px; }
  .fejlec.is-kompakt .fejlec__sor{ min-height:64px; }
  .fejlec.is-kompakt .fonav{ top:64px; }

  /* rendszerábra: a címkék az ábra alá kerülnek, olvasható méretben */
  .rendszerabra__vaszon{ aspect-ratio:auto; }
  .rendszerabra__svg{ position:static; height:auto; aspect-ratio:600/400; }
  .ra-cimkevonal{ display:none; }
  .meresi-cimkek{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2); margin-top:var(--sp-3); }
  .meresi-cimke{ position:static; }

  /* folyamat: függőleges haladásjelző */
  .folyamat{ grid-template-columns:1fr 1fr; gap:var(--sp-4) var(--sp-4); border-top:0; padding-top:0; }
  .folyamat::before{ display:none; }
  .folyamat li{ flex-direction:row; align-items:baseline; gap:var(--sp-2); padding:var(--sp-3) 0 0; border-top:2px solid var(--vonal-sotet); }
  .folyamat li::before{ margin:0; flex:none; width:10px; height:10px; align-self:center; }
  .folyamat li:last-child{ grid-column:1 / -1; border-top-color:var(--jel); }

  .egyenlet{ grid-template-columns:1fr; }
  .egyenlet__tag{ padding:0; }
  .egyenlet__tag::after{ display:none; }
  .egyenlet__tag + .egyenlet__tag .egyenlet__szo::before{ content:"+ "; color:var(--jel); font-weight:400; margin-right:.2em; }

  .idovonal{ grid-template-columns:1fr; }
  .idovonal__ev{ padding:0 14px; }        /* a szélső „csere" felirat ne lógjon ki */
  .idovonal__halom{ display:none; }

  .osztott{ grid-template-columns:1fr; }
  .osztott__fel + .osztott__fel{ border-left:0; border-top:1px solid var(--vonal-eros); }

  .munkalap__sor--fej{ display:none; }
  .munkalap__sor{ grid-template-columns:1fr 1fr; gap:var(--sp-2) var(--sp-4); }
  .munkalap__sor [role="rowheader"]{ grid-column:1 / -1; }
  .munkalap .ures{ position:relative; height:auto; background:none; font-size:var(--fs-xs); color:var(--szoveg-halk); }
  .munkalap .ures::before{ display:block; content:""; height:2px; margin-top:22px; background-image:linear-gradient(90deg, var(--vonal-eros) 50%, transparent 0); background-size:8px 2px; }
  .munkalap .ures:nth-child(2)::after{ content:"Jelenlegi rendszer"; position:absolute; top:0; left:0; }
  .munkalap .ures:nth-child(3)::after{ content:"Vizsgált alternatíva"; position:absolute; top:0; left:0; }

  .adatlap{ grid-template-columns:1fr; }
  .szabvanysin{ grid-template-columns:1fr; }
  .esettanulmany__ut{ grid-template-columns:1fr; }
  .lablec__racs{ grid-template-columns:1fr; }

  .gombsor .btn{ width:100%; }
  .kalk-lap__gombok .btn{ flex:1 1 0; }
  .mezo__input input{ width:9ch; }
  .dash__cta .btn{ width:100%; }

  .cc{ padding:0; }
  .cc__doboz{ border-radius:var(--r-nagy) var(--r-nagy) 0 0; border-bottom:0; max-height:86vh; overflow-y:auto; }
  .cc__reszletek{ grid-template-columns:1fr; gap:var(--sp-4); }
  .cc__gombok{ flex-direction:column; }
  .cc__gomb{ width:100%; }
}

@media (max-width:400px){
  .dash__elem{ grid-template-columns:14px minmax(0,1fr); }
  .dash__ertek{ grid-column:2; text-align:left; }
  .dash__statusz{ text-align:left; }
  .idotav__gomb{ min-width:0; flex:1; }
  .idotav{ display:flex; }
}

/* nagy kijelző: a vizuál kap több levegőt, a betű nem nő automatikusan */
@media (min-width:1600px){
  .hero__racs{ gap:96px; }
}

/* =========================================================
   8. CSÖKKENTETT MOZGÁS — minden információ statikusan is teljes
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .egyenlet__tag,.egyenlet__osszeg{ opacity:1; transform:none; }
  .folyamat::before{ transform:scaleX(1); }
  .idovonal__csere{ transform:scale(1); }
  .idovonal__halom span{ opacity:1; }
}