/* ==========================================================================
   LÉGIÓ 2000 SECURITY — látványterv
   Vizuális rendszer: svájci rácsszerkezet + ipari/biztonsági karakter.
   Éles sarkok, hajszálvonalas struktúra, síkban használt jelzősárga.
   ========================================================================== */

/* ---------- 1. Tokenek ---------- */
:root{
  --bg:        #0B0B0B;
  --bg-2:      #111111;
  --bg-3:      #161616;
  --paper:     #EDEBE5;
  --paper-2:   #E2DFD7;

  --ink:       #F5F4F1;
  --ink-dark:  #14140F;
  --muted:     rgba(245,244,241,.60);
  --muted-2:   rgba(245,244,241,.38);
  --muted-dark:rgba(20,20,15,.66);

  --brand:     #FFD400;   /* a logó jelzősárgája */
  --steel:     #7C7F86;
  --ok:        #4ED07A;

  --line:      rgba(245,244,241,.16);
  --line-2:    rgba(245,244,241,.09);
  --line-dark: rgba(20,20,15,.16);
  --line-dark2:rgba(20,20,15,.09);

  --font-d: "Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-b: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;

  --wrap: 1280px;
  --gut: clamp(18px, 3.4vw, 50px);
  --sec: clamp(70px, 8.4vw, 138px);

  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

/* ---------- 2. Alap ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-b); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.is-loading{overflow:hidden; height:100vh}
img,svg,video{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
button{background:none;border:0;cursor:pointer}
h1,h2,h3,h4{font-family:var(--font-d); font-weight:700; line-height:1.02; letter-spacing:-.025em; margin:0}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--brand); color:#000}

::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:#0B0B0B; border-left:1px solid rgba(255,255,255,.08)}
::-webkit-scrollbar-thumb{background:#2A2A2A}
::-webkit-scrollbar-thumb:hover{background:var(--brand)}

/* ---------- 3. Elrendezés ---------- */
.wrap{width:min(var(--wrap), 100% - var(--gut)*2); margin-inline:auto}
.wrap-wide{width:min(1580px, 100% - var(--gut)*2); margin-inline:auto}
.section{padding-block:var(--sec); position:relative}

/* finom filmszemcse, nem ragyogás */
.grain::after{
  content:""; position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  transform:translateZ(0); backface-visibility:hidden;
}

/* ---------- 4. Tipográfia ---------- */
.display{font-size:clamp(2.5rem, 6.6vw, 5.4rem); font-weight:800; letter-spacing:-.038em; line-height:.96}
.h1{font-size:clamp(2.1rem, 4.9vw, 3.9rem); font-weight:800; letter-spacing:-.032em}
.h2{font-size:clamp(1.75rem, 3.5vw, 2.85rem); font-weight:700; letter-spacing:-.028em; line-height:1.06}
.h3{font-size:clamp(1.15rem, 1.75vw, 1.42rem); font-weight:700; letter-spacing:-.018em}
.h4{font-size:1.02rem; font-weight:600; letter-spacing:-.01em; font-family:var(--font-d)}
.lead{font-size:clamp(1rem, 1.2vw, 1.09rem); color:var(--muted); line-height:1.68; max-width:60ch}
.small{font-size:.86rem}

/* számozott, vonalas rovatjelölés — a rendszer egyik jellemző eleme */
.eyebrow{
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-b); font-size:.7rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brand);
}
.eyebrow::after{content:""; flex:1; height:1px; background:var(--line); max-width:120px}
.eyebrow em{font-style:normal; color:var(--muted-2); font-variant-numeric:tabular-nums}
.txt-y{color:var(--brand)}

/* sorfeltárás */
.rev-line{display:block; overflow:hidden}
.rev-line > span{display:block; transform:translateY(104%); transition:transform .95s var(--ease-out)}
.in .rev-line > span{transform:translateY(0)}
.rev-line:nth-child(2) > span{transition-delay:.07s}
.rev-line:nth-child(3) > span{transition-delay:.14s}

.rev{opacity:0; transform:translateY(18px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out)}
.rev.in{opacity:1; transform:none}
.rev-d1{transition-delay:.07s} .rev-d2{transition-delay:.14s} .rev-d3{transition-delay:.21s}
.rev-d4{transition-delay:.28s} .rev-d5{transition-delay:.35s}
/* kemény törlés (wipe) — mechanikus, nem lebegő */
.rev-clip{clip-path:inset(-45% 100% -45% -45%); transition:clip-path 1s var(--ease-out)}
.rev-clip.in{clip-path:inset(-45% -45% -45% -45%)}

/* ---------- 5. Gombok ---------- */
.btn{
  --bh:52px;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:var(--bh); padding:0 24px; border-radius:0;
  font-family:var(--font-d); font-weight:600; font-size:.9rem; letter-spacing:.01em;
  white-space:nowrap; overflow:hidden; isolation:isolate;
  transition:color .35s var(--ease), border-color .35s;
}
.btn svg{width:16px;height:16px;flex:none; transition:transform .4s var(--ease)}
.btn::before{content:""; position:absolute; inset:0; z-index:-1; transition:transform .45s var(--ease)}
.btn:hover svg{transform:translateX(4px)}

/* elsődleges: tömör sárga, hoverre feketére vált csúszó felülettel */
.btn-p{color:#141410; border:1px solid var(--brand)}
.btn-p::before{background:var(--brand)}
.btn-p::after{content:""; position:absolute; inset:0; z-index:-1; background:#141410;
  transform:translateY(101%); transition:transform .45s var(--ease)}
.btn-p:hover{color:var(--brand)}
.btn-p:hover::after{transform:translateY(0)}

/* másodlagos: keret, hoverre sárga kitöltés alulról */
.btn-g{color:var(--ink); border:1px solid var(--line)}
.btn-g::after{content:""; position:absolute; inset:0; z-index:-1; background:var(--brand);
  transform:translateY(101%); transition:transform .45s var(--ease)}
.btn-g:hover{color:#141410; border-color:var(--brand)}
.btn-g:hover::after{transform:translateY(0)}

.btn-dark{color:var(--paper); border:1px solid var(--ink-dark)}
.btn-dark::before{background:var(--ink-dark)}
.btn-dark::after{content:""; position:absolute; inset:0; z-index:-1; background:var(--brand); transform:translateY(101%); transition:transform .45s var(--ease)}
.btn-dark:hover{color:var(--ink-dark)}
.btn-dark:hover::after{transform:translateY(0)}

.btn-line{color:var(--ink-dark); border:1px solid var(--line-dark)}
.btn-line::after{content:""; position:absolute; inset:0; z-index:-1; background:var(--ink-dark); transform:translateY(101%); transition:transform .45s var(--ease)}
.btn-line:hover{color:var(--paper); border-color:var(--ink-dark)}
.btn-line:hover::after{transform:translateY(0)}

.btn-lg{--bh:60px; padding:0 30px; font-size:.95rem}
.btn-block{width:100%}

/* szövegLINK aláhúzás-animációval */
.tlink{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-d);
  font-weight:600; font-size:.9rem; color:var(--brand); position:relative; padding-bottom:3px;
}
.tlink::after{content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease-out)}
.tlink:hover::after{transform:scaleX(1); transform-origin:left}
.tlink svg{width:14px;height:14px; transition:transform .35s var(--ease)}
.tlink:hover svg{transform:translateX(5px)}

/* ---------- 6. Betöltés: redőnyszerű feltárás ---------- */
#loader{
  position:fixed; inset:0; z-index:10000; background:var(--bg);
  display:grid; place-items:center; transition:opacity .45s ease, visibility .45s;
}
#loader .l-inner{text-align:center; width:min(320px,80vw)}
#loader .l-logo{width:64px; height:auto; margin:0 auto 22px; opacity:0; animation:lin .6s var(--ease-out) .05s forwards}
@keyframes lin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#loader .l-name{
  font-family:var(--font-d); font-weight:700; letter-spacing:.3em; font-size:.68rem;
  text-transform:uppercase; color:var(--muted-2); margin-bottom:18px;
}
#loader .l-bar{height:1px; background:var(--line-2); position:relative}
#loader .l-bar i{display:block; height:1px; width:0%; background:var(--brand); transition:width .22s linear}
#loader .l-pct{margin-top:10px; font-size:.66rem; letter-spacing:.22em; color:var(--muted-2); font-variant-numeric:tabular-nums}
#loader.done{opacity:0; visibility:hidden}
/* három lamella húzódik felfelé, eltolt időzítéssel */
.l-curtain{position:fixed; inset:0; z-index:9999; pointer-events:none; display:flex}
.l-curtain i{flex:1; background:#000; transform:translateY(0); border-right:1px solid rgba(255,255,255,.05)}
.l-curtain.up i{transform:translateY(-101%); transition:transform .85s var(--ease-out)}
.l-curtain.up i:nth-child(2){transition-delay:.07s}
.l-curtain.up i:nth-child(3){transition-delay:.14s}

/* ---------- 7. Görgetésjelző ---------- */
.sprog{position:fixed; top:0; left:0; height:2px; width:100%; z-index:999; background:transparent}
.sprog i{display:block; height:100%; width:100%; background:var(--brand);
  transform:scaleX(0); transform-origin:left; will-change:transform}

/* ---------- 8. Fejléc ---------- */
.hdr{
  position:fixed; top:0; left:0; right:0; z-index:900;
  border-bottom:1px solid transparent;
  transition:background .4s var(--ease), border-color .4s, transform .5s var(--ease);
}
.hdr.solid{background:rgba(11,11,11,.94); border-bottom-color:var(--line-2)}
.hdr.hide{transform:translateY(-104%)}
.hdr-in{display:flex; align-items:stretch; gap:0; height:78px; transition:height .4s var(--ease)}
.hdr.solid .hdr-in{height:66px}

.brand{display:flex; align-items:center; gap:12px; flex:none; padding-right:26px}
.brand img{width:36px; height:auto}
.brand b{font-family:var(--font-d); font-weight:800; font-size:1rem; letter-spacing:-.01em; line-height:1; display:block}
.brand span span{display:block; font-size:.58rem; letter-spacing:.2em; color:var(--muted-2); text-transform:uppercase; margin-top:4px; font-weight:600}

.hdr-in > nav{margin-left:auto; display:flex}
.nav{display:flex; align-items:stretch}
.nav > li{display:flex}
.nav > li > a{
  position:relative; display:flex; align-items:center; padding:0 18px;
  font-size:.88rem; font-weight:500; color:rgba(245,244,241,.72); transition:color .3s;
}
.nav > li > a:hover,.nav > li > a.act{color:var(--ink)}
.nav > li > a::after{content:""; position:absolute; left:18px; right:18px; bottom:26px; height:2px;
  background:var(--brand); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease-out)}
.hdr.solid .nav > li > a::after{bottom:20px}
.nav > li > a:hover::after,.nav > li > a.act::after{transform:scaleX(1)}
.has-mega{position:static}
.chev{display:inline-block; width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px); margin-left:8px; transition:transform .3s var(--ease)}
.has-mega:hover .chev{transform:rotate(225deg) translateY(1px)}

/* almenü: hajszálvonalas oszlopokra bontva */
.mega{
  position:absolute; left:0; right:0; top:100%;
  background:var(--bg-2); border-top:1px solid var(--brand); border-bottom:1px solid var(--line-2);
  padding:34px var(--gut);
  display:grid; grid-template-columns:1fr 1fr .85fr; gap:0;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .28s var(--ease), visibility .28s;
}
.has-mega:hover .mega,.mega:hover{opacity:1; visibility:visible; pointer-events:auto}
.mega > div{padding-inline:clamp(16px,2vw,34px); border-left:1px solid var(--line-2)}
.mega > div:first-child{border-left:0; padding-left:0}
.mega h5{font-family:var(--font-b); font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin:0 0 16px; font-weight:600}
.mega-item{display:flex; gap:14px; padding:10px 0; position:relative; transition:padding-left .35s var(--ease)}
.mega-item::before{content:""; position:absolute; left:-14px; top:50%; width:6px; height:1px; background:var(--brand); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease)}
.mega-item:hover{padding-left:10px}
.mega-item:hover::before{transform:scaleX(1)}
.mega-item .ic{width:30px;height:30px;flex:none; display:grid;place-items:center; border:1px solid var(--line-2)}
.mega-item .ic svg{width:15px;height:15px;stroke:var(--brand)}
.mega-item strong{display:block; font-family:var(--font-d); font-size:.9rem; font-weight:600}
.mega-item small{display:block; font-size:.76rem; color:var(--muted-2); line-height:1.45; margin-top:2px}
.mega-cta{display:flex; flex-direction:column; justify-content:space-between; gap:20px}
.mega-cta p{font-size:.85rem; color:var(--muted); margin:12px 0 0}

.hdr-cta{display:flex; align-items:stretch; flex:none; margin-left:0}
.hdr-tel{display:flex; align-items:center; gap:10px; font-family:var(--font-d); font-weight:600; font-size:.86rem;
  padding-inline:20px; border-left:1px solid var(--line-2); transition:color .3s}
.hdr-tel:hover{color:var(--brand)}
.hdr-tel .dot{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.hdr-cta > .btn{border:0; border-left:1px solid var(--line-2); height:auto; --bh:auto; padding-inline:26px}
.hdr-cta > .btn.btn-p{border-left:0}

.burger{display:none; width:56px; border-left:1px solid var(--line-2); place-items:center}
.burger i{display:block; width:20px;height:1.5px;background:var(--ink); position:relative; transition:background .3s}
.burger i::before,.burger i::after{content:""; position:absolute; left:0; width:20px;height:1.5px;background:var(--ink); transition:transform .35s var(--ease)}
.burger i::before{top:-6px} .burger i::after{top:6px}
body.menu-open .burger i{background:transparent}
body.menu-open .burger i::before{transform:translateY(6px) rotate(45deg)}
body.menu-open .burger i::after{transform:translateY(-6px) rotate(-45deg)}

/* mobil menü — felülről leereszkedő panel */
.drawer{
  position:fixed; inset:0; z-index:890; background:var(--bg);
  padding:100px var(--gut) 40px; overflow-y:auto;
  transform:translateY(-101%); transition:transform .6s var(--ease-out);
}
body.menu-open .drawer{transform:translateY(0)}
.drawer a.dl{display:flex; align-items:center; gap:14px; font-family:var(--font-d); font-weight:700; font-size:1.6rem; letter-spacing:-.028em;
  padding:15px 0; border-bottom:1px solid var(--line-2); opacity:0; transform:translateY(14px)}
.drawer a.dl::before{content:counter(dnum,decimal-leading-zero); counter-increment:dnum;
  font-family:var(--font-b); font-size:.66rem; font-weight:600; color:var(--muted-2); letter-spacing:.1em}
.drawer{counter-reset:dnum}
body.menu-open .drawer a.dl{opacity:1; transform:none; transition:opacity .4s var(--ease) calc(.14s + var(--i)*.04s), transform .5s var(--ease-out) calc(.14s + var(--i)*.04s)}
.drawer .sub{padding:8px 0 14px 34px; margin:0 0 6px; border-bottom:1px solid var(--line-2)}
.drawer .sub a{display:block; padding:6px 0; color:var(--muted); font-size:.95rem}
.drawer-foot{margin-top:30px; display:grid; gap:1px; background:var(--line-2)}

/* ---------- 9. Hero ---------- */
.hero{position:relative; min-height:calc(100svh - 54px); display:flex; align-items:center;
  overflow:hidden; padding-top:100px; padding-bottom:0}
.hero-bg{position:absolute; inset:0; z-index:0}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:60% 40%;
  filter:grayscale(1) contrast(1.3) brightness(.46)}
.hero-bg::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,11,11,.90) 0%, rgba(11,11,11,.52) 42%, rgba(11,11,11,.96) 96%),
             linear-gradient(90deg, rgba(11,11,11,.95) 0%, rgba(11,11,11,.35) 70%, rgba(11,11,11,.7) 100%)}
/* szerkezeti oszlopvonalak, nem négyzetrács */
.hero-grid{position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:linear-gradient(90deg, var(--line-2) 1px, transparent 1px);
  background-size:calc(100% / 6) 100%; opacity:.9}
.scan{display:none}

.hero-in{position:relative; z-index:3}
.hero-grid2{display:grid; grid-template-columns:1.28fr .72fr; align-items:center;
  border-top:1px solid var(--line); padding-bottom:clamp(24px,2.6vw,36px)}
.hero-col{padding:clamp(22px,2.6vw,34px) clamp(26px,3vw,52px) clamp(10px,1.4vw,18px) 0}
.hero-tag{display:inline-flex; align-items:center; gap:12px; padding:0; margin-bottom:24px;
  font-family:var(--font-b); font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.hero-tag em{font-style:normal; display:inline-flex; align-items:center; padding:4px 8px;
  background:var(--brand); color:#141410; font-size:.66rem; font-weight:700; letter-spacing:.08em}
.hero h1{margin-bottom:24px; max-width:16ch}
.hero-sub{max-width:50ch; color:rgba(245,244,241,.74); font-size:clamp(.98rem,1.15vw,1.1rem)}
.hero-acts{display:flex; flex-wrap:wrap; gap:0; margin-top:32px}
.hero-acts .btn + .btn{margin-left:-1px}
.hero-note{display:flex;align-items:flex-start;gap:9px;margin-top:22px;font-size:.8rem;color:var(--muted-2); line-height:1.5}
.hero-note svg{width:14px;height:14px;stroke:var(--brand);flex:none;margin-top:3px}

/* jobb oldali státuszsáv: műszerfal-jelleg, üveg és ragyogás nélkül */
.panel{border-left:1px solid var(--line); background:rgba(11,11,11,.55)}
.panel-hd{display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:15px clamp(16px,1.6vw,22px); border-bottom:1px solid var(--line-2)}
.panel-hd > span:first-child{font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); font-weight:600}
.panel-hd-r{display:flex; align-items:center; gap:14px}

/* aktivitásjelző oszlopok */
.sig{display:flex; align-items:flex-end; gap:2px; height:14px}
.sig i{width:2px; background:var(--brand); opacity:.85; height:30%;
  animation:sig 1.5s ease-in-out infinite}
.sig i:nth-child(2){animation-delay:.18s} .sig i:nth-child(3){animation-delay:.36s}
.sig i:nth-child(4){animation-delay:.54s} .sig i:nth-child(5){animation-delay:.72s}
@keyframes sig{0%,100%{height:25%}35%{height:100%}65%{height:55%}}
.live{display:flex; align-items:center; gap:7px; font-size:.66rem; font-weight:700; color:var(--ok); letter-spacing:.12em}
.live i{width:6px;height:6px;border-radius:50%; background:var(--ok); animation:blink 2.6s steps(1,end) infinite}
@keyframes blink{0%,60%{opacity:1}61%,100%{opacity:.25}}
/* élő óra */
.panel-clock{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  padding:11px clamp(16px,1.6vw,22px); border-bottom:1px solid var(--line-2); background:rgba(255,212,0,.03)}
.pc-label{font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); font-weight:600}
.pc-date{font-size:.75rem; color:var(--muted-2); font-variant-numeric:tabular-nums}
.pc-time{margin-left:auto; font-family:var(--font-d); font-weight:800; font-size:1.24rem;
  letter-spacing:.01em; color:var(--brand); font-variant-numeric:tabular-nums}

.panel-rows{display:grid}
.prow{position:relative; display:flex; align-items:center; gap:13px;
  padding:12px clamp(16px,1.6vw,22px); border-bottom:1px solid var(--line-2); transition:background .35s}
.prow::before{content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--brand);
  transform:scaleY(0); transform-origin:center; transition:transform .4s var(--ease)}
.prow:hover{background:rgba(245,244,241,.03)}
.prow:hover::before{transform:scaleY(1)}
.ok-b{color:var(--ok) !important}
.prow .pi{width:26px;height:26px;display:grid;place-items:center;flex:none; border:1px solid var(--line-2)}
.prow .pi svg{width:14px;height:14px;stroke:var(--brand)}
.prow div{min-width:0}
.prow strong{display:block; font-family:var(--font-d); font-size:.84rem; font-weight:600}
.prow small{display:block; font-size:.72rem; color:var(--muted-2)}
.prow b{margin-left:auto; font-family:var(--font-d); font-size:.88rem; color:var(--brand); font-variant-numeric:tabular-nums; white-space:nowrap}
/* lefedettségi térkép */
.panel-cov{position:relative; overflow:hidden;
  padding:12px clamp(16px,1.6vw,22px) 12px; border-bottom:1px solid var(--line-2)}
/* lassú pásztázó fénycsík a térkép fölött */
.panel-cov::after{content:""; position:absolute; left:0; top:0; width:38%; height:100%; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,212,0,.09), transparent);
  animation:covscan 6.5s linear infinite}
@keyframes covscan{0%{transform:translateX(-110%)}100%{transform:translateX(370%)}}
.cov-hd{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px}
.cov-hd span{font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); font-weight:600}
.cov-hd b{font-family:var(--font-d); font-size:.74rem; color:var(--brand); letter-spacing:.02em}
.cov-map{display:block; width:100%; max-width:282px; height:auto; margin-inline:auto}
#covDots circle{fill:rgba(245,244,241,.40)}
.cov-line{fill:none; stroke:rgba(255,212,0,.55); stroke-width:1; stroke-linejoin:round}
.cov-hot .core{fill:var(--brand)}
.cov-hot .halo{fill:none; stroke:var(--brand); stroke-width:1; transform-box:fill-box; transform-origin:center;
  animation:covpulse 3s ease-out infinite; animation-delay:var(--d,0s)}
@keyframes covpulse{0%{opacity:.55; transform:scale(.35)}70%{opacity:0; transform:scale(1)}100%{opacity:0; transform:scale(1)}}

.panel-trust{border-top:1px solid var(--line-2)}
.panel-trust li{display:flex; gap:11px; align-items:flex-start; padding:10px clamp(16px,1.6vw,22px);
  font-size:.8rem; line-height:1.45; color:var(--muted-2); border-bottom:1px solid var(--line-2)}
.panel-trust li:last-child{border-bottom:0}
.panel-trust li{transition:background .35s}
.panel-trust li:hover{background:rgba(245,244,241,.03)}
.panel-trust strong{color:var(--ink); font-weight:600}
.panel-trust .tk{width:15px;height:15px;background:var(--brand);display:grid;place-items:center;flex:none;margin-top:2px}
.panel-trust .tk svg{width:9px;height:9px;stroke:#141410;stroke-width:3.2}

.panel-ft{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line)}
.panel-ft div{transition:background .35s}
.panel-ft div:hover{background:rgba(245,244,241,.03)}
.panel-ft div{padding:16px 10px; text-align:left; border-left:1px solid var(--line-2)}
.panel-ft div:first-child{border-left:0}
.panel-ft b{display:block; font-family:var(--font-d); font-weight:800; font-size:1.3rem; letter-spacing:-.03em}
.panel-ft span{font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2)}

.scroll-cue{position:absolute; left:var(--gut); bottom:0; z-index:4; display:none}

/* ---------- 10. Futósáv ---------- */
.mq{position:relative; overflow:hidden; border-block:1px solid var(--line-2); background:var(--bg)}
.mq-track{display:flex; width:max-content; animation:mq 44s linear infinite; will-change:transform}
.mq:hover .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-item{display:flex; align-items:center; padding:14px 0}
.mq-item b{font-family:var(--font-d); font-weight:600; font-size:.86rem; letter-spacing:.06em; text-transform:uppercase;
  white-space:nowrap; padding-inline:22px; color:rgba(245,244,241,.72)}
.mq-item i{width:4px;height:4px;background:var(--brand);flex:none}
.mq.slow .mq-track{animation-duration:64s}

/* ---------- 11. Bizalmi sáv ---------- */
.trust{border-bottom:1px solid var(--line-2)}
.trust-in{display:grid; grid-template-columns:repeat(4,1fr); gap:0}
.tcell{display:flex; gap:14px; align-items:flex-start; padding:28px clamp(16px,2vw,30px);
  border-left:1px solid var(--line-2); transition:background .4s}
.tcell:first-child{border-left:0; padding-left:0}
a.tcell:hover{background:var(--bg-2)}
.tcell .ic{width:34px;height:34px;display:grid;place-items:center;flex:none; border:1px solid var(--line)}
.tcell .ic svg{width:17px;height:17px;stroke:var(--brand)}
.tcell strong{display:block; font-family:var(--font-d); font-size:.92rem; font-weight:600}
.tcell small{display:block; font-size:.79rem; color:var(--muted-2); line-height:1.5; margin-top:3px}

/* ---------- 12. Rovatfej ---------- */
.shead{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(24px,4vw,56px);
  align-items:end; margin-bottom:clamp(34px,4.4vw,58px); padding-bottom:26px; border-bottom:1px solid var(--line)}
.shead .st{max-width:none}
.shead p{max-width:44ch}

/* ---------- 13. Szolgáltatások ---------- */
.srv-grid{display:grid; grid-template-columns:.86fr 1.14fr; gap:0}
.srv-sticky{position:sticky; top:104px; padding-right:clamp(24px,3vw,52px)}
.srv-visual{position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--bg-3); border:1px solid var(--line)}
.srv-visual img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .45s linear;
  filter:grayscale(1) contrast(1.25) brightness(.72)}
.srv-visual img.on{opacity:1}
.srv-visual::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,rgba(11,11,11,.1) 40%,rgba(11,11,11,.88))}
.srv-visual .vnum{position:absolute; left:0; bottom:0; z-index:2; font-family:var(--font-d); font-weight:800;
  font-size:3.4rem; letter-spacing:-.05em; line-height:1; color:#141410; background:var(--brand); padding:6px 16px 8px}
.srv-visual .vtag{position:absolute; left:0; top:0; z-index:2; padding:8px 14px;
  background:#0B0B0B; border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  font-family:var(--font-b); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--muted)}
.srv-list{display:grid; border-left:1px solid var(--line)}
.srv-item{padding:clamp(20px,2.4vw,30px) 0 clamp(20px,2.4vw,30px) clamp(24px,3vw,44px);
  border-bottom:1px solid var(--line-2); position:relative; cursor:pointer; transition:background .4s}
.srv-item:first-child{border-top:1px solid var(--line-2)}
.srv-item::before{content:""; position:absolute; left:-1px; top:0; bottom:0; width:2px; background:var(--brand);
  transform:scaleY(0); transform-origin:top; transition:transform .5s var(--ease-out)}
.srv-item.on::before{transform:scaleY(1)}
.srv-top{display:flex; align-items:center; gap:18px}
.srv-num{font-family:var(--font-b); font-size:.68rem; font-weight:600; letter-spacing:.12em; color:var(--muted-2);
  flex:none; width:22px; font-variant-numeric:tabular-nums; transition:color .4s}
.srv-item.on .srv-num{color:var(--brand)}
.srv-ic{width:40px;height:40px;display:grid;place-items:center;flex:none; border:1px solid var(--line);
  transition:background .4s, border-color .4s}
.srv-ic svg{width:20px;height:20px;stroke:rgba(245,244,241,.7); transition:stroke .4s}
.srv-item.on .srv-ic{background:var(--brand); border-color:var(--brand)}
.srv-item.on .srv-ic svg{stroke:#141410}
.srv-item h3{transition:color .35s}
.srv-item.on h3{color:var(--brand)}
.srv-arrow{margin-left:auto; width:34px;height:34px; display:grid;place-items:center; border:1px solid var(--line);
  transition:transform .45s var(--ease), border-color .35s, background .35s}
.srv-arrow svg{width:14px;height:14px;stroke:var(--muted); transition:stroke .35s}
.srv-item:hover .srv-arrow{border-color:var(--brand); background:var(--brand)}
.srv-item:hover .srv-arrow svg{stroke:#141410}
.srv-item.on .srv-arrow{transform:rotate(180deg); border-color:var(--brand); background:var(--brand)}
.srv-item.on .srv-arrow svg{stroke:#141410}
.srv-body{max-height:0; overflow:hidden; transition:max-height .65s var(--ease-out), opacity .5s ease, margin .5s; opacity:0}
.srv-item.on .srv-body{max-height:360px; opacity:1; margin-top:16px}
.srv-body p{color:var(--muted); font-size:.95rem; max-width:56ch; padding-left:40px}
.srv-tags{display:flex; flex-wrap:wrap; gap:0; margin-top:16px; padding-left:40px}
.chip{padding:5px 12px; border:1px solid var(--line-2); margin:-1px 0 0 -1px;
  font-family:var(--font-b); font-size:.75rem; letter-spacing:.02em; color:var(--muted)}
.srv-body .tlink{margin-top:18px; margin-left:40px}

/* ---------- 14. Számok ---------- */
.nums{border-bottom:1px solid var(--line-2)}
.nums-in{display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--line)}
.ncell{padding:clamp(24px,3vw,40px) clamp(16px,2vw,32px); position:relative; border-left:1px solid var(--line-2)}
.ncell:first-child{border-left:0; padding-left:0}
.ncell::after{content:""; position:absolute; inset:-1px 0 auto 0; height:2px; background:var(--brand);
  transform:scaleX(0); transform-origin:left; transition:transform .9s var(--ease-out)}
.ncell.in::after{transform:scaleX(1)}
.ncell b{display:block; font-family:var(--font-d); font-weight:800; font-size:clamp(2.4rem,4.4vw,3.5rem);
  letter-spacing:-.045em; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums}
.ncell span{display:block; margin-top:12px; font-size:.87rem; color:var(--muted); max-width:23ch}

/* ---------- 15. Világos szekciók ---------- */
.paper{background:var(--paper); color:var(--ink-dark)}
.paper h2,.paper h3,.paper h4{color:var(--ink-dark)}
.paper .lead,.paper p,.paper .small{color:var(--muted-dark)}
.paper .eyebrow{color:#7A5F00}
.paper .eyebrow::after{background:var(--line-dark)}
.paper .eyebrow em{color:rgba(20,20,15,.4)}
.paper .shead{border-bottom-color:var(--line-dark)}
.paper .chip{border-color:var(--line-dark2); color:var(--muted-dark)}
.paper .ulist strong{color:var(--ink-dark)}

.about{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4.5vw,72px); align-items:center}
.about-media{position:relative}
.about-media .m1{overflow:hidden; aspect-ratio:4/5}
.about-media .m1 img{width:100%;height:100%;object-fit:cover; filter:grayscale(1) contrast(1.15)}
.about-media .m2{position:absolute; right:-8%; bottom:-8%; width:50%; overflow:hidden;
  border:8px solid var(--paper); aspect-ratio:4/3}
.about-media .m2 img{width:100%;height:100%;object-fit:cover; filter:grayscale(1) contrast(1.1)}
.about-badge{position:absolute; left:0; top:0; padding:16px 20px; background:var(--brand); color:#141410;
  display:flex; align-items:center; gap:14px}
.about-badge b{font-family:var(--font-d); font-weight:800; font-size:2rem; letter-spacing:-.045em; line-height:1; flex:none}
.about-badge span{font-size:.74rem; line-height:1.32; width:11ch; font-weight:500}
.ulist{display:grid; gap:0; margin-top:26px; border-top:1px solid var(--line-dark2)}
.ulist li{display:flex; gap:14px; align-items:flex-start; font-size:.95rem; padding:14px 0; border-bottom:1px solid var(--line-dark2)}
.ulist .ck{width:18px;height:18px; background:var(--brand); display:grid;place-items:center;flex:none;margin-top:3px}
.ulist .ck svg{width:10px;height:10px;stroke:#141410;stroke-width:3}
/* sötét háttéren */
.section:not(.paper) .ulist{border-top-color:var(--line-2)}
.section:not(.paper) .ulist li{border-bottom-color:var(--line-2)}

/* ---------- 16. Modulrács ("miért mi") ---------- */
.bento{display:grid; grid-template-columns:repeat(6,1fr); gap:0;
  border-top:1px solid var(--line); border-left:1px solid var(--line-2)}
.bx{border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2);
  padding:clamp(24px,2.6vw,34px); position:relative; overflow:hidden; transition:background .4s}
.bx:hover{background:var(--bg-2)}
.bx-4{grid-column:span 4} .bx-3{grid-column:span 3} .bx-2{grid-column:span 2}
.bx .bi{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);margin-bottom:20px}
.bx .bi svg{width:19px;height:19px;stroke:var(--brand)}
.bx h3{margin-bottom:10px}
.bx p{color:var(--muted); font-size:.92rem}
.bx-hi{background:var(--brand); color:#141410}
.bx-hi h3{color:#141410}
.bx-hi p{color:rgba(20,20,15,.8)}
.bx-hi:hover{background:var(--brand)}
.bx-hi .bi{border-color:rgba(20,20,15,.28)}
.bx-hi .bi svg{stroke:#141410}
.bx-figure{display:flex; align-items:baseline; gap:10px; margin-bottom:8px}
.bx-figure b{font-family:var(--font-d); font-weight:800; font-size:clamp(2.4rem,3.8vw,3.4rem); letter-spacing:-.05em; line-height:1}
.bx-figure span{color:var(--muted); font-size:.95rem}
.bx-hi .bx-figure span{color:rgba(20,20,15,.7)}
.radar{position:absolute; right:-30px; bottom:-30px; width:190px; height:190px; opacity:.22}
.radar circle{fill:none; stroke:#141410}
.radar .sweep{transform-origin:50% 50%; animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.bx-hi .radar path{fill:rgba(20,20,15,.14)}

/* ---------- 17. Folyamat ---------- */
.steps{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--line-dark)}
.steps::after{content:""; position:absolute; left:0; top:-1px; height:2px; background:var(--brand); width:var(--pw,0%); transition:width 1.2s var(--ease-out)}
.step{position:relative; padding:26px clamp(16px,2vw,32px) 8px; border-left:1px solid var(--line-dark2)}
.step:first-child{border-left:0; padding-left:0}
.step .sn{font-family:var(--font-d); font-weight:800; font-size:.8rem; letter-spacing:.1em; color:rgba(20,20,15,.35);
  margin-bottom:16px; font-variant-numeric:tabular-nums; transition:color .4s}
.step.in .sn{color:#7A5F00}
.step h4{margin-bottom:8px}
.step p{color:var(--muted-dark); font-size:.9rem}
.section:not(.paper) .steps{border-top-color:var(--line)}
.section:not(.paper) .step{border-left-color:var(--line-2)}
.section:not(.paper) .step .sn{color:var(--muted-2)}
.section:not(.paper) .step.in .sn{color:var(--brand)}
.section:not(.paper) .step p{color:var(--muted)}

/* ---------- 18. Referenciák ---------- */
.refs-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:1px solid var(--line-2); border-left:1px solid var(--line-2)}
.ref{padding:24px 18px; display:flex; align-items:center; min-height:92px;
  border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2);
  font-family:var(--font-d); font-weight:600; font-size:.82rem; letter-spacing:.02em; color:rgba(245,244,241,.6);
  transition:background .35s, color .35s}
.ref:hover{background:var(--brand); color:#141410}
.paper .refs-grid{border-color:var(--line-dark2)}
.paper .ref{border-color:var(--line-dark2); color:rgba(20,20,15,.6)}
.paper .ref:hover{background:var(--ink-dark); color:var(--paper)}

.case{overflow:hidden; position:relative; aspect-ratio:4/3; border:1px solid var(--line); display:block}
.case img{width:100%;height:100%;object-fit:cover; filter:grayscale(1) contrast(1.25) brightness(.5);
  transition:transform 1s var(--ease-out), filter .6s}
.case:hover img{transform:scale(1.04); filter:grayscale(1) contrast(1.25) brightness(.68)}
.case-in{position:absolute; inset:auto 0 0 0; padding:26px; background:linear-gradient(0deg,rgba(11,11,11,.94) 20%,transparent)}
.case-tag{display:inline-block; margin-bottom:12px; padding:5px 10px; background:var(--brand); color:#141410;
  font-family:var(--font-b); font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase}

/* ---------- 19. Vélemények ---------- */
.tst{position:relative; overflow:hidden}
.tst-track{display:flex; transition:transform .7s var(--ease-out)}
.tst-slide{min-width:100%}
.tst-card{padding:clamp(26px,3.4vw,44px) 0; display:grid; grid-template-columns:1.55fr .75fr; gap:clamp(28px,5vw,72px); align-items:start}
.tst-card q{display:block; font-family:var(--font-d); font-weight:600; font-size:clamp(1.15rem,2.1vw,1.68rem);
  line-height:1.36; letter-spacing:-.022em; quotes:none}
.tst-card q::before{content:"„"; color:var(--brand)}
.tst-who{display:grid; gap:14px; justify-items:start; padding-left:clamp(20px,2.4vw,34px); border-left:1px solid var(--line-2)}
.tst-av{width:38px;height:38px; background:var(--brand); display:grid;place-items:center;
  font-family:var(--font-d); font-weight:800; color:#141410; flex:none}
.tst-who > div{order:2}
.tst-who strong{display:block; font-family:var(--font-d); font-size:.92rem}
.tst-who small{display:block; font-size:.78rem; color:var(--muted-2)}
.stars{display:flex; gap:3px}
.stars svg{width:14px;height:14px;fill:var(--brand)}
.tst-nav{display:flex; align-items:center; gap:8px; padding:20px 0; border-top:1px solid var(--line-2)}
.tdot{width:28px;height:2px;background:rgba(245,244,241,.18); transition:background .35s,width .35s}
.tdot.on{background:var(--brand); width:48px}
.tst-btns{margin-left:auto; display:flex; gap:0}
.tbtn{width:42px;height:42px; border:1px solid var(--line); margin-left:-1px; display:grid;place-items:center;
  transition:background .3s, border-color .3s}
.tbtn svg{width:14px;height:14px;stroke:var(--ink); transition:stroke .3s}
.tbtn:hover{background:var(--brand); border-color:var(--brand)}
.tbtn:hover svg{stroke:#141410}

/* ---------- 20. GYIK ---------- */
.faq{display:grid; border-top:1px solid var(--line-dark)}
.fq{border-bottom:1px solid var(--line-dark2)}
.fq-q{width:100%; display:flex; align-items:center; gap:20px; padding:22px 0; text-align:left;
  font-family:var(--font-d); font-weight:600; font-size:clamp(.98rem,1.4vw,1.1rem); letter-spacing:-.018em; transition:color .3s}
.fq-q:hover{color:#7A5F00}
.fq-ic{margin-left:auto; width:26px;height:26px; display:grid;place-items:center; flex:none; position:relative;
  border:1px solid var(--line-dark); transition:background .35s,border-color .35s,transform .4s var(--ease)}
.fq-ic::before,.fq-ic::after{content:""; position:absolute; background:currentColor}
.fq-ic::before{width:10px;height:1.5px}
.fq-ic::after{width:1.5px;height:10px; transition:transform .4s var(--ease)}
.fq.on .fq-ic{background:var(--brand); border-color:var(--brand)}
.fq.on .fq-ic::after{transform:scaleY(0)}
.fq-a{max-height:0; overflow:hidden; transition:max-height .6s var(--ease-out)}
.fq-a p{padding:0 0 24px; max-width:74ch; color:var(--muted-dark); font-size:.95rem}

/* ---------- 21. Ajánlatkérő ---------- */
.cta-wrap{position:relative; border:1px solid var(--line); background:var(--bg-2)}
.cta-grid{position:relative; display:grid; grid-template-columns:1fr 1.02fr; gap:0}
.cta-grid > div:first-child{padding:clamp(30px,4vw,58px)}

.form{border-left:1px solid var(--line); background:var(--bg); position:relative}
.form::before{content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--brand)}

/* fejléc: rovatjelölés + lépésszámláló */
.form-hd{display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:clamp(20px,2.2vw,26px) clamp(24px,3vw,38px); border-bottom:1px solid var(--line-2)}
.form-kicker{font-family:var(--font-b); font-size:.68rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--brand)}
.form-step{font-family:var(--font-d); font-weight:800; font-size:.86rem; letter-spacing:.04em;
  color:var(--muted-2); font-variant-numeric:tabular-nums}
.form-step b{color:var(--ink); font-size:1.5rem; letter-spacing:-.02em; line-height:1}
.form-step i{font-style:normal; margin:0 4px; opacity:.5}

.form-body{padding:clamp(24px,3vw,38px)}
.fsteps{display:flex; align-items:center; gap:0}
.fst{flex:1; height:3px; background:var(--line-2); overflow:hidden; position:relative}
.fst + .fst{border-left:1px solid var(--bg)}
.fst i{display:block;height:100%;width:0;background:var(--brand);
  transition:width .55s var(--ease-out)}
.fst.done i{width:100%}
.fst.act i{width:100%; animation:fpulse 2.2s ease-in-out infinite}
@keyframes fpulse{0%,100%{opacity:1}50%{opacity:.55}}

.fstep{display:none; padding:clamp(24px,3vw,38px)}
.fstep.on{display:block; animation:fin .45s var(--ease-out)}
@keyframes fin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.fstep h4{margin-bottom:6px; font-size:1.24rem}
.fstep > p{font-size:.85rem; color:var(--muted-2); margin-bottom:22px}

/* választótáblák */
.opts{display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--line-2); border-left:1px solid var(--line-2)}
.opt{position:relative; border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2);
  padding:18px 16px; cursor:pointer; overflow:hidden; transition:color .3s}
.opt::before{content:""; position:absolute; inset:0; background:var(--brand);
  transform:translateY(101%); transition:transform .38s var(--ease)}
.opt:hover::before{transform:translateY(0)}
.opt:hover{color:#141410}
.opt > *{position:relative; z-index:1}
.opt input{position:absolute; opacity:0; pointer-events:none}
.opt .oi{width:30px;height:30px;display:grid;place-items:center;margin-bottom:12px;
  border:1px solid var(--line-2); transition:background .3s,border-color .3s}
.opt .oi svg{width:16px;height:16px;stroke:var(--muted); transition:stroke .3s}
.opt strong{font-family:var(--font-d); font-size:.9rem; font-weight:600; display:block}
.opt small{font-size:.75rem; color:var(--muted-2); transition:color .3s}
.opt:hover .oi{border-color:rgba(20,20,15,.3)}
.opt:hover .oi svg{stroke:#141410}
.opt:hover small{color:rgba(20,20,15,.72)}
.opt:has(input:checked){color:#141410}
.opt:has(input:checked)::before{transform:translateY(0)}
.opt:has(input:checked) small{color:rgba(20,20,15,.72)}
.opt:has(input:checked) .oi{background:#141410; border-color:#141410}
.opt:has(input:checked) .oi svg{stroke:var(--brand)}

/* mezők */
.field{margin-bottom:16px}
.field label{display:flex; align-items:baseline; gap:7px; font-size:.66rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); margin-bottom:8px;
  line-height:1.2; min-height:1.2em}
.field label em{font-style:normal; color:var(--brand)}
.field label span{letter-spacing:.02em; text-transform:none; font-weight:400; opacity:.7; font-size:.72rem}
.field input,.field textarea,.field select{
  width:100%; height:50px; padding:0 14px; border-radius:0; background:transparent;
  border:1px solid var(--line-2); border-left:2px solid var(--line-2);
  transition:border-color .3s, background .3s; font-size:.94rem}
.field textarea{height:auto; padding:13px 14px; resize:vertical; min-height:92px; line-height:1.55}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none; border-color:var(--line); border-left-color:var(--brand); background:var(--bg-2)}
.field input::placeholder,.field textarea::placeholder{color:rgba(245,244,241,.26)}
.field input.err,.field textarea.err{border-color:#FF4D3D; border-left-color:#FF4D3D}
.fgrid{display:grid; grid-template-columns:1fr 1fr; gap:0 14px}
.fnav{display:flex; gap:0; margin-top:24px}
.fnav .btn + .btn{margin-left:-1px}
.consent{display:flex; gap:12px; align-items:flex-start; margin-top:16px; padding:14px;
  border:1px solid var(--line-2); font-size:.77rem; color:var(--muted-2); line-height:1.5}
.consent input{width:16px;height:16px;margin-top:2px;accent-color:var(--brand);flex:none}
.consent a{color:var(--brand)}
.fdone{text-align:center; padding:clamp(34px,4vw,52px) clamp(24px,3vw,38px)}
.fdone .dk{width:56px;height:56px; background:var(--brand); display:grid;place-items:center;margin:0 auto 20px;
  animation:dk .5s var(--ease-out)}
@keyframes dk{from{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}
.fdone .dk svg{width:26px;height:26px;stroke:#141410;stroke-width:3}

.cta-list{display:grid; gap:0; margin-top:28px; border-top:1px solid var(--line-2)}
.cta-list li{display:flex; gap:14px; align-items:flex-start; padding:15px 0; border-bottom:1px solid var(--line-2)}
.cta-list .ci{width:30px;height:30px;border:1px solid var(--line);display:grid;place-items:center;flex:none}
.cta-list .ci svg{width:15px;height:15px;stroke:var(--brand)}
.cta-list strong{display:block;font-family:var(--font-d);font-size:.92rem}
.cta-list small{display:block;font-size:.81rem;color:var(--muted-2)}
.cta-dir{display:flex; flex-wrap:wrap; gap:0; margin-top:26px}
.cta-dir .btn + .btn{margin-left:-1px}

/* ---------- 22. Lábléc ---------- */
.ftr{border-top:1px solid var(--line); padding-top:clamp(50px,5.4vw,80px)}
.ftr-top{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.25fr; gap:0; padding-bottom:48px}
.ftr-top > div{padding-inline:clamp(16px,2.2vw,38px); border-left:1px solid var(--line-2)}
.ftr-top > div:first-child{border-left:0; padding-left:0}
.ftr h5{font-family:var(--font-b); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin:0 0 18px; font-weight:600}
.ftr-links a{display:block; padding:7px 0; color:var(--muted); font-size:.9rem; transition:color .3s, padding-left .3s}
.ftr-links a:hover{color:var(--brand); padding-left:6px}
.ftr-brand p{color:var(--muted); font-size:.89rem; max-width:38ch; margin-top:18px}
.ftr-cert{display:flex; gap:0; margin-top:22px}
.ftr-cert div{padding:8px 13px; border:1px solid var(--line-2); margin-left:-1px;
  font-family:var(--font-d); font-size:.72rem; font-weight:600; letter-spacing:.05em; color:var(--muted)}
.ftr-cert div:first-child{margin-left:0}
.ftr-contact li{display:flex; gap:11px; align-items:flex-start; padding:7px 0; font-size:.89rem; color:var(--muted)}
.ftr-contact svg{width:15px;height:15px;stroke:var(--brand);flex:none;margin-top:4px}
.ftr-contact a:hover{color:var(--brand)}
.ftr-big{padding:30px 0 0; border-top:1px solid var(--line-2); overflow:hidden}
.ftr-big b{display:block; font-family:var(--font-d); font-weight:800; letter-spacing:-.045em; line-height:1.05;
  font-size:clamp(2.6rem,12vw,11rem); color:transparent; -webkit-text-stroke:1px rgba(245,244,241,.13); white-space:nowrap; text-align:center}
.ftr-bot{display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between;
  padding:22px 0; border-top:1px solid var(--line-2); margin-top:26px}
.ftr-bot p{font-size:.8rem; color:var(--muted-2)}
.ftr-bot nav{display:flex; gap:22px; font-size:.8rem; color:var(--muted-2)}
.ftr-bot nav a:hover{color:var(--brand)}

/* ---------- 23. Mobil hívósáv / vissza a tetejére ---------- */
.callbar{position:fixed; left:0; right:0; bottom:0; z-index:880; display:none; gap:0; border-top:1px solid var(--line)}
.callbar a{flex:1; display:flex; align-items:center; justify-content:center; gap:9px; padding:15px 8px;
  font-family:var(--font-d); font-size:.88rem; font-weight:600; background:#0B0B0B; border-left:1px solid var(--line)}
.callbar a:first-child{border-left:0}
.callbar a.p{background:var(--brand); color:#141410}
.callbar svg{width:16px;height:16px}
.totop{position:fixed; right:0; bottom:0; z-index:870; width:46px;height:46px;
  background:var(--bg-2); border:1px solid var(--line); display:grid;place-items:center;
  opacity:0; transform:translateY(10px); pointer-events:none; transition:all .4s var(--ease)}
.totop.on{opacity:1; transform:none; pointer-events:auto}
.totop:hover{background:var(--brand)}
.totop svg{width:16px;height:16px;stroke:var(--ink); transition:stroke .3s}
.totop:hover svg{stroke:#141410}

/* ---------- 24. Szolgáltatás-összesítő (kártyás lista) ---------- */
.sc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:0;
  border-top:1px solid var(--line); border-left:1px solid var(--line-2)}
.sc{border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2); display:flex}
.sc-link{display:flex; flex-direction:column; width:100%; transition:background .4s}
.sc-link:hover{background:var(--bg-2)}
.sc-media{position:relative; overflow:hidden; aspect-ratio:16/8; border-bottom:1px solid var(--line-2)}
.sc-media img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.25) brightness(.58); transition:transform .9s var(--ease-out), filter .5s}
.sc-link:hover .sc-media img{transform:scale(1.04); filter:grayscale(1) contrast(1.25) brightness(.76)}
/* fotó helyett grafikus panel */
.sc-mark{display:flex; align-items:center; justify-content:center; gap:clamp(16px,2vw,28px);
  background:var(--bg-2);
  background-image:linear-gradient(90deg, var(--line-2) 1px, transparent 1px); background-size:44px 100%}
.sc-ghost{font-family:var(--font-d); font-weight:800; font-size:clamp(4rem,7vw,6.6rem);
  letter-spacing:-.06em; line-height:1; color:transparent; -webkit-text-stroke:1px rgba(245,244,241,.11)}
.sc-glyph{width:clamp(40px,4vw,54px); height:clamp(40px,4vw,54px); stroke:var(--brand); opacity:.9;
  transition:transform .6s var(--ease)}
.sc-link:hover .sc-glyph{transform:scale(1.08)}
.sc-ic{position:absolute; left:0; bottom:0; width:44px;height:44px; display:grid;place-items:center;
  background:var(--bg); border-top:1px solid var(--line-2); border-right:1px solid var(--line-2);
  transition:background .35s}
.sc-ic svg{width:20px;height:20px;stroke:var(--brand); transition:stroke .35s}
.sc-link:hover .sc-ic{background:var(--brand)}
.sc-link:hover .sc-ic svg{stroke:#141410}
.sc-body{padding:clamp(24px,2.8vw,34px); display:flex; flex-direction:column; flex:1}
.sc-meta{display:flex; align-items:center; gap:12px; margin-bottom:14px}
.sc-num{font-family:var(--font-b); font-size:.68rem; font-weight:600; letter-spacing:.14em;
  color:var(--brand); font-variant-numeric:tabular-nums}
.sc-cat{font-family:var(--font-b); font-size:.66rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted-2); padding-left:12px; border-left:1px solid var(--line-2)}
.sc h3{margin-bottom:12px; transition:color .3s}
.sc-link:hover h3{color:var(--brand)}
.sc p{color:var(--muted); font-size:.92rem}
.sc .srv-tags{padding-left:0; margin-top:18px}
.sc .tlink{margin-top:auto; padding-top:22px; align-self:flex-start}

/* ---------- 25. Aloldal fejrész ---------- */
.phero{position:relative; padding:146px 0 clamp(48px,5vw,78px); overflow:hidden; border-bottom:1px solid var(--line)}
.phero-bg{position:absolute; inset:0; z-index:0}
.phero-bg img{width:100%;height:100%;object-fit:cover; object-position:62% 42%;
  filter:grayscale(1) contrast(1.22) brightness(.62)}
/* a fotó jobbra kifut, balra a szöveg alá sötétedik — így nem lesz egyszínű fekete */
.phero-bg::after{content:""; position:absolute; inset:0;
  background:linear-gradient(96deg, rgba(11,11,11,.97) 0%, rgba(11,11,11,.90) 34%, rgba(11,11,11,.52) 68%, rgba(11,11,11,.34) 100%),
             linear-gradient(180deg, rgba(11,11,11,.72) 0%, rgba(11,11,11,0) 26%, rgba(11,11,11,.55) 100%)}
/* a főoldali heróval egyező szerkezeti oszlopvonalak */
.phero-grid{position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:linear-gradient(90deg, var(--line-2) 1px, transparent 1px);
  background-size:calc(100% / 6) 100%}
.phero .wrap{position:relative; z-index:2}
.crumb{display:flex; gap:10px; align-items:center; font-size:.78rem; color:var(--muted-2); margin-bottom:22px;
  letter-spacing:.02em}
.crumb a:hover{color:var(--brand)}
.crumb span{opacity:.5}

.prose > h3{margin:36px 0 12px; padding-top:20px; border-top:1px solid var(--line-2)}
.prose p{color:var(--muted); margin-bottom:16px}
.aside-card{position:sticky; top:100px; border:1px solid var(--line); padding:26px; background:var(--bg-2)}
.aside-nav a{display:flex; align-items:center; gap:11px; padding:9px 0; font-size:.9rem; color:var(--muted);
  border-bottom:1px solid var(--line-2); transition:color .3s, padding-left .3s}
.aside-nav a:hover,.aside-nav a.act{color:var(--brand); padding-left:6px}
.aside-nav a i{width:4px;height:4px;background:currentColor;opacity:.6}

/* --- kép a szövegoszlopban --- */
.prose-fig{margin:30px 0 34px; border:1px solid var(--line-2)}
.prose-fig img{width:100%; aspect-ratio:16/7; object-fit:cover; object-position:50% 42%;
  filter:grayscale(1) contrast(1.2) brightness(.74)}
.prose-fig figcaption{display:flex; align-items:center; gap:11px; padding:12px 16px;
  border-top:1px solid var(--line-2); font-size:.8rem; color:var(--muted-2); background:var(--bg-2)}
.pf-mark{width:14px; height:2px; background:var(--brand); flex:none}

/* --- teljes szélességű állításblokk --- */
.band{display:grid; grid-template-columns:1fr 1fr; align-items:stretch;
  border-block:1px solid var(--line); background:var(--bg-2)}
.band-media{position:relative; overflow:hidden; min-height:340px}
.band-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 45%;
  filter:grayscale(1) contrast(1.24) brightness(.66)}
.band-media::after{content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(11,11,11,.25), rgba(17,17,17,.85))}
.band-tag{position:absolute; left:0; bottom:0; z-index:2; padding:9px 16px; background:var(--brand); color:#141410;
  font-family:var(--font-b); font-size:.68rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase}
.band-body{padding:clamp(34px,4.6vw,68px) clamp(24px,4vw,68px);
  display:flex; flex-direction:column; justify-content:center; max-width:640px}
.band-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:30px;
  border-top:1px solid var(--line-2)}
.band-stats div{padding:18px 14px 0; border-left:1px solid var(--line-2)}
.band-stats div:first-child{border-left:0; padding-left:0}
.band-stats b{display:block; font-family:var(--font-d); font-weight:800; font-size:clamp(1.5rem,2.4vw,2rem);
  letter-spacing:-.04em; line-height:1; color:var(--brand)}
.band-stats span{display:block; margin-top:7px; font-size:.78rem; color:var(--muted-2); line-height:1.4}

/* --- kapcsolódó szolgáltatások ikonos kártyákként --- */
.rel-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  border-top:1px solid var(--line-dark2); border-left:1px solid var(--line-dark2)}
.rel{position:relative; display:flex; align-items:flex-start; gap:14px; padding:24px 22px;
  border-right:1px solid var(--line-dark2); border-bottom:1px solid var(--line-dark2);
  overflow:hidden; transition:color .35s}
.rel::before{content:""; position:absolute; inset:0; background:var(--ink-dark);
  transform:translateY(101%); transition:transform .42s var(--ease)}
.rel:hover::before{transform:translateY(0)}
.rel > *{position:relative; z-index:1}
.rel-num{font-family:var(--font-b); font-size:.66rem; font-weight:600; letter-spacing:.14em;
  color:rgba(20,20,15,.38); font-variant-numeric:tabular-nums; transition:color .35s; padding-top:3px}
.rel-ic{width:38px;height:38px; flex:none; display:grid; place-items:center;
  border:1px solid var(--line-dark2); transition:background .35s, border-color .35s}
.rel-ic svg{width:19px;height:19px; stroke:#7A5F00; transition:stroke .35s}
.rel-txt{min-width:0}
.rel-txt strong{display:block; font-family:var(--font-d); font-size:.98rem; font-weight:600;
  letter-spacing:-.015em; color:var(--ink-dark); transition:color .35s}
.rel-txt small{display:block; margin-top:4px; font-size:.8rem; line-height:1.45; color:var(--muted-dark); transition:color .35s}
.rel-go{margin-left:auto; padding-left:14px; align-self:center; width:40px;height:26px; flex:none; display:grid; place-items:center;
  transition:transform .4s var(--ease)}
.rel-go svg{width:15px;height:15px; stroke:rgba(20,20,15,.35); transition:stroke .35s}
.rel:hover .rel-num{color:rgba(245,244,241,.45)}
.rel:hover .rel-ic{background:var(--brand); border-color:var(--brand)}
.rel:hover .rel-ic svg{stroke:#141410}
.rel:hover .rel-txt strong{color:var(--paper)}
.rel:hover .rel-txt small{color:rgba(245,244,241,.6)}
.rel:hover .rel-go{transform:translateX(4px)}
.rel:hover .rel-go svg{stroke:var(--brand)}

/* --- kétoszlopos elrendezések (korábban beégetett inline stílusok) --- */
.svc-layout{display:grid; grid-template-columns:1.25fr .75fr; gap:clamp(32px,5vw,72px)}
.faq-layout{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,70px); align-items:start}
.duo{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.steps-2{grid-template-columns:1fr 1fr}

/* ---------- 26. Látványterv-jelölés ---------- */
.dnote{position:fixed; left:0; bottom:0; z-index:885; display:flex; align-items:center; gap:9px;
  padding:9px 14px; background:var(--bg-2); border-top:1px solid var(--line); border-right:1px solid var(--line);
  font-size:.72rem; color:var(--muted-2); letter-spacing:.04em}
.dnote i{width:6px;height:6px;background:var(--brand)}
.dnote{transition:opacity .3s, transform .3s}
.dnote.hide{opacity:0; transform:translateY(100%); pointer-events:none}

/* ---------- 27. Reszponzív ---------- */
@media (max-width:1180px){
  .hero-grid2{grid-template-columns:1fr}
  .hero-grid2 > div:first-child{padding-right:0}
  .panel{border-left:0; border-top:1px solid var(--line)}
  .trust-in{grid-template-columns:repeat(2,1fr)}
  .tcell:nth-child(3){border-left:0; padding-left:0}
  .tcell:nth-child(n+3){border-top:1px solid var(--line-2)}
  .nums-in{grid-template-columns:repeat(2,1fr)}
  .ncell:nth-child(3){border-left:0; padding-left:0}
  .ncell:nth-child(n+3){border-top:1px solid var(--line-2)}
  .bx-4,.bx-3{grid-column:span 6} .bx-2{grid-column:span 3}
  .refs-grid{grid-template-columns:repeat(3,1fr)}
  .sc-grid{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:repeat(2,1fr)}
  .ftr-top{grid-template-columns:1fr 1fr}
  .ftr-top > div:nth-child(3){border-left:0; padding-left:0}
  .ftr-top > div:nth-child(n+3){padding-top:34px}
}
@media (max-width:1024px){
  .nav,.hdr-tel{display:none}
  .burger{display:grid}
  .hdr-cta{margin-left:auto}
  .srv-grid{grid-template-columns:1fr}
  .srv-sticky{display:none}
  .srv-list{border-left:1px solid var(--line-2)}
  .srv-item{padding-left:18px}
  .srv-item::before{left:-1px}
  .about{grid-template-columns:1fr}
  .about-media{max-width:520px}
  .cta-grid{grid-template-columns:1fr}
  .svc-layout,.faq-layout{grid-template-columns:1fr}
  .aside-card{position:static}
  .form{border-left:0; border-top:1px solid var(--line)}
  .band{grid-template-columns:1fr}
  .band-media{min-height:240px}
  .band-body{max-width:none}
  .steps{grid-template-columns:1fr 1fr}
  .step:nth-child(3){border-left:0; padding-left:0}
  .step:nth-child(n+3){border-top:1px solid var(--line-dark2); margin-top:10px; padding-top:26px}
  .callbar{display:flex}
  body{padding-bottom:54px}
  .totop{bottom:54px}
  .dnote{display:none}
}
@media (max-width:900px){
  .tst-card{grid-template-columns:1fr; gap:24px}
  .tst-who{padding-left:0; border-left:0; border-top:1px solid var(--line-2); padding-top:20px}
}
@media (max-width:720px){
  .shead{grid-template-columns:1fr; gap:16px}
  .trust-in{grid-template-columns:1fr}
  .tcell{border-left:0; padding-left:0; border-top:1px solid var(--line-2)}
  .tcell:first-child{border-top:0}
  .nums-in{grid-template-columns:1fr}
  .ncell{border-left:0; padding-left:0; border-top:1px solid var(--line-2)}
  .bx-4,.bx-3,.bx-2{grid-column:span 6}
  .refs-grid{grid-template-columns:repeat(2,1fr)}
  .rel-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .step{border-left:0; padding-left:0}
  .opts{grid-template-columns:1fr}
  .duo{grid-template-columns:1fr}
  .steps-2{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .ftr-top{grid-template-columns:1fr}
  .ftr-top > div{border-left:0; padding-left:0; padding-top:30px}
  .about-media .m2{display:none}
  .about-badge{position:static; margin-bottom:0}
  .hero{min-height:auto; padding-top:118px}
  .hdr-cta > .btn{display:none}
  .srv-body p,.srv-tags,.srv-body .tlink{padding-left:0; margin-left:0}
  .prow strong{font-size:.82rem}
  .prow small{font-size:.7rem}
  .cta-dir{flex-direction:column; align-items:stretch}
  .cta-dir .btn + .btn{margin-left:0; margin-top:-1px}
  .hero-acts{flex-direction:column; align-items:flex-start}
  .hero-acts .btn{width:100%}
  .hero-acts .btn + .btn{margin-left:0; margin-top:-1px}
}
/* --- alacsony ablakmagasság: a hero összehúzódik, hogy a szalag még látsszon --- */
@media (min-width:1025px) and (max-height:820px){
  .hero{padding-top:90px}
  .cov-map{max-width:196px}
  .panel-clock{padding-top:8px; padding-bottom:8px}
  .prow{padding-top:10px; padding-bottom:10px}
  .panel-trust li{padding-top:8px; padding-bottom:8px}
  .panel-cov{padding-top:10px; padding-bottom:10px}
  .hero-col{padding-top:clamp(14px,2vw,22px)}
}
@media (min-width:1025px) and (max-height:700px){
  .hero{padding-top:84px}
  .hero .panel-cov{display:none}
  .hero-col{padding-top:14px; padding-bottom:8px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}

/* ==========================================================================
   28. WordPress / Elementor illesztőréteg
   A látványterv fenti szabályai érintetlenek; itt csak a WP-téma és az
   Elementor alapértelmezéseit hangoljuk hozzá.
   ========================================================================== */

/* Hello Elementor alap felülírása */
body.legio{background:var(--bg); color:var(--ink); font-family:var(--font-b)}
.legio h1,.legio h2,.legio h3,.legio h4,.legio h5,.legio h6{font-family:var(--font-d)}
.legio a{color:inherit}
.legio img{height:auto}
.site-main{padding:0}
.page-content > *,.entry-content > *{margin-block:0}

/* Elementor konténerek: a látványterv CSS-e a mérvadó, az Elementor ne szóljon bele */
.legio .e-con,.legio .e-con-inner{--container-default-padding-top:0;--container-default-padding-right:0;
  --container-default-padding-bottom:0;--container-default-padding-left:0}
.legio .e-con > .e-con-inner{max-width:none}
.legio .elementor-widget:not(:last-child){margin-block-end:0}
.legio .elementor-element{--widgets-spacing:0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px}

/* 1. csapda: az .elementor-widget{position:relative} elnyelné az abszolút rétegeket */
.legio .hero .elementor-widget,
.legio .phero .elementor-widget,
.legio .band .elementor-widget,
.legio .srv-visual .elementor-widget,
.legio .case .elementor-widget{position:static}

/* 2. csapda: felső szintű widgetek alapértelmezett alsó térköze fehér csíkot hagy */
.legio [class*="elementor-widget-legio-"]{margin:0!important; width:100%}

/* A widgetek gyökere ne törje meg a rácsokat */
.legio .elementor-widget-container{display:contents}
.legio .elementor-widget-legio-hero-panel > .elementor-widget-container,
.legio .elementor-widget-legio-services > .elementor-widget-container,
.legio .elementor-widget-legio-quote > .elementor-widget-container{display:block}

/* Fejléc: fixen, teljes szélességben (az e-con szélesség nélkül összeesik) */
.legio .hdr.e-con,.legio .hdr{width:100%}
body.admin-bar .hdr{top:32px}
@media (max-width:782px){body.admin-bar .hdr{top:46px}}
body.admin-bar .drawer{padding-top:132px}

/* Elementor-menü a saját fejlécünkben */
.legio .hdr .elementor-nav-menu--main .elementor-nav-menu{display:flex; align-items:stretch}
.legio .hdr .elementor-nav-menu--main .elementor-item{padding:0 18px; font-size:.88rem; font-weight:500}

/* Szerkesztő: a tartalom mindig látszódjon, ne várjon görgetésre */
.elementor-editor-active .rev,
.elementor-editor-active .rev-clip,
.elementor-editor-preview .rev,
.elementor-editor-preview .rev-clip{opacity:1!important; transform:none!important; clip-path:none!important}
.elementor-editor-active #loader,.elementor-editor-active .l-curtain,
.elementor-editor-preview #loader,.elementor-editor-preview .l-curtain{display:none!important}
.elementor-editor-active .hdr,.elementor-editor-preview .hdr{position:relative}

/* Üres widget helyőrzője a szerkesztőben */
.legio-empty{padding:26px; border:1px dashed var(--line); color:var(--muted-2); font-size:.85rem; text-align:center}

/* Kihagyás-link és fókuszgyűrű (akadálymentesítés) */
.legio-skip{position:absolute; left:-9999px; top:0; z-index:10001; padding:12px 18px;
  background:var(--brand); color:#141410; font-weight:600}
.legio-skip:focus{left:0}
.legio a:focus-visible,.legio button:focus-visible,.legio input:focus-visible,
.legio select:focus-visible,.legio textarea:focus-visible{outline:2px solid var(--brand); outline-offset:2px}

/* Nyomtatás */
@media print{
  .hdr,.drawer,.callbar,.totop,.dnote,.mq,#loader,.l-curtain,.sprog{display:none!important}
  body.legio{background:#fff; color:#000}
}

/* Űrlap-visszajelzés */
.legio-form-msg{margin:12px 0 0; font-size:.84rem; color:var(--muted-2); min-height:1.2em}
.legio-form-msg.bad{color:#FF6B5C}
.legio-quote-form button[disabled]{opacity:.65; cursor:progress}
