/* GYÁLAUTÓ – gyalauto.hu (DAEKON, 2026)
   Paletta: grafit + acélkék alap, cián csak jelölésre, piros csak figyelmeztetésre. */
/* Betűk helyben (SIL Open Font License 1.1, fonts/OFL.txt) – nincs Google Fonts-kérés */
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/space-grotesk-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/space-grotesk-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/manrope-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --g0:#080D14; --g1:#0B1320; --steel:#111D2D; --steel2:#18273B;
  --blue:#16B8FF; --ice:#91E7FF; --paper:#F4F7FA; --red:#F05A4F;
  --ink:#E6EDF5; --soft:#93A3B8; --line:rgba(145,231,255,.13); --line2:rgba(145,231,255,.24);
  --pink:#0F1824; /* sötét szöveg világos alapon */
  --fh:"Space Grotesk","Inter Display","Inter",system-ui,sans-serif;
  --fb:"Manrope","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1200px; --gut:clamp(20px,4vw,48px);
  --e:cubic-bezier(.2,.7,.2,1);
  --navh:64px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:64px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--g0);color:var(--ink);font-family:var(--fb);font-size:16px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--fh);font-weight:600;letter-spacing:-.015em;margin:0;text-wrap:balance}
h2{font-size:clamp(24px,1.1vw + 16px,34px);line-height:1.14}
h3{font-size:18px;line-height:1.3}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--paper);color:var(--g0);padding:10px 14px;border-radius:6px;font-weight:700}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:4px}

/* ---------- gombok ---------- */
.btn{--bg:var(--steel2);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 22px;border-radius:4px;border:1px solid transparent;background:var(--bg);color:var(--ink);font-family:var(--fh);font-weight:600;font-size:15px;letter-spacing:.01em;text-decoration:none;cursor:pointer;isolation:isolate;overflow:hidden;transition:transform .18s var(--e),background-color .2s,border-color .2s,color .2s}
.btn:active{transform:scale(.97)}
.btn-sm{min-height:40px;padding:0 18px;font-size:14px}
.nav-cta{--bg:rgba(22,184,255,.10);border-color:rgba(22,184,255,.5)}
.nav-cta:hover{--bg:var(--blue);color:#041420}
.btn-glow{--bg:var(--blue);color:#041420;border-radius:0;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);background-image:linear-gradient(180deg,rgba(255,255,255,.18),transparent 55%)}
.btn-glow::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 48%,transparent 66%);transform:translateX(-120%);transition:transform .7s var(--e)}
.btn-glow:focus-visible{outline:none;box-shadow:inset 0 0 0 2px #041420,inset 0 0 0 4px var(--paper)}
@media (hover:hover){
  .btn-glow:hover::before{transform:translateX(120%)}
  .btn-ghost:hover{border-color:var(--ice);color:#fff;background:rgba(145,231,255,.06)}
}
.btn-ghost{--bg:transparent;border-color:var(--line2)}
.btn-call{--bg:var(--paper);color:var(--g0);width:100%}
.linkbtn{background:none;border:0;color:var(--soft);font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:12px 4px}

/* ---------- navigáció ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;transition:background-color .35s,backdrop-filter .35s,border-color .35s;border-bottom:1px solid transparent}
.nav-in{display:flex;align-items:center;gap:28px;height:var(--navh);transition:height .3s var(--e)}
.nav.solid{background:rgba(8,13,20,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:var(--line)}
.nav.solid .nav-in{height:56px}
.brand{display:flex;align-items:center;gap:11px;min-height:44px;text-decoration:none;margin-right:auto}
.brand{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px}
.logo{display:block;height:36px;width:auto;overflow:visible}
.logo .lg-plate{transition:fill .3s}
.brand:hover .logo .lg-nut{fill:var(--ice)}
.brand-sub{font-family:var(--fh);font-size:8px;font-weight:600;letter-spacing:.075em;color:var(--soft);padding-left:3px;white-space:nowrap}
.brand-sub span{color:var(--blue);margin:0 2px}
.nav-links{display:flex;gap:26px}
.nav-links a{position:relative;text-decoration:none;font-size:14.5px;color:var(--soft);padding:6px 0;transition:color .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--ice);transform:scaleX(0);transform-origin:right;transition:transform .25s var(--e)}
.nav-links a:hover,.nav-links a.on{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.on::after{transform:scaleX(1);transform-origin:left}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line2);border-radius:4px;background:transparent;position:relative;cursor:pointer}
.burger span{position:absolute;left:13px;right:13px;height:1.6px;background:var(--ink);transition:transform .25s var(--e),top .25s}
.burger span:first-child{top:17px}.burger span:last-child{top:25px}
.burger[aria-expanded=true] span:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:last-child{top:21px;transform:rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:45;background:var(--g0);padding:96px var(--gut) calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:28px;overflow-y:auto}
.menu[hidden]{display:none}
.menu nav{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.menu nav a{font-family:var(--fh);font-size:22px;font-weight:500;text-decoration:none;padding:15px 2px;border-bottom:1px solid var(--line);min-height:56px}
.menu-hours{color:var(--soft);font-size:14.5px;text-align:center}

/* ---------- hero ---------- */
.hero{position:relative;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;padding-top:calc(var(--navh) + 8px);overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 90% at 0% 0%,#14243A 0%,transparent 55%),radial-gradient(70% 60% at 85% 70%,rgba(22,184,255,.10),transparent 70%),var(--g0)}
.hero-grid{position:absolute;inset:-4%;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;opacity:.42;-webkit-mask-image:radial-gradient(80% 70% at 60% 55%,#000 30%,transparent 80%);mask-image:radial-gradient(80% 70% at 60% 55%,#000 30%,transparent 80%);animation:gridIn 14s var(--e) both}
@keyframes gridIn{from{transform:scale(1.07)}to{transform:scale(1)}}
.hero-light{position:absolute;left:-10%;top:10%;width:70%;height:60%;background:linear-gradient(100deg,rgba(145,231,255,.10),transparent 60%);transform:skewY(-8deg);filter:blur(30px)}
.hero-cursor{position:absolute;width:520px;height:520px;left:0;top:0;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(circle,rgba(22,184,255,.12),transparent 65%);opacity:0;transition:opacity .4s;pointer-events:none}
.hero>.wrap{width:100%}
.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,4.4fr) minmax(0,7.6fr);align-items:center;gap:24px;flex:1;padding-top:36px;padding-bottom:4px}
.hero-copy{position:relative;z-index:2;padding:12px 0}
.hero-mark{display:flex;align-items:center;gap:12px;font-family:var(--fh);font-size:12.5px;font-weight:600;letter-spacing:.16em;color:var(--ice);margin-bottom:16px}
.hero-mark::before{content:"";width:28px;height:1.5px;background:var(--ice)}
.hero h1{font-size:clamp(32px,2vw + 18px,50px);line-height:1.04;font-weight:600;letter-spacing:-.025em}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .ln>span{display:block}
.hero-sub{margin-top:16px;max-width:30em;color:#B9C6D6;font-size:16.5px}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.hero-phone{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;min-height:44px;margin-top:8px;font-family:var(--fh);font-weight:600;text-decoration:none;color:var(--ink);font-size:15px}
.hero-phone span{color:var(--soft);font-family:var(--fb);font-weight:400}
.hero-art{margin:0 -7vw 0 -2vw;position:relative}
#heroCar .body{fill:url(#bodyG)}
.diag-svg .lamps,.diag-svg .glow{display:none}
.car-svg{width:100%;height:auto;overflow:visible}
.car-svg .dr{fill:none;stroke:#C9D6E4;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.car-svg .dr.t{stroke-width:1.3;stroke:#7E91A8}
.car-svg .dr.d{stroke:var(--blue);stroke-width:1.3;stroke-dasharray:4 6;opacity:.8}
.car-svg .body{stroke:#EAF2FA;stroke-width:2.6;fill:rgba(17,29,45,.55)}
.car-svg .glass{fill:rgba(145,231,255,.06);stroke:#9FB4CB}
.car-svg .lift .dr{stroke:#5B6E86}
.car-svg text{font-family:var(--fb);font-size:13px;fill:var(--ice);letter-spacing:.04em}
.car-svg .floor{stroke-width:2}
.hero-facts{list-style:none;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px 36px;padding-top:18px;padding-bottom:22px;position:relative;z-index:2;border-top:0}
.hero-facts::before{content:"";position:absolute;left:var(--gut);right:var(--gut);top:0;height:1px;background:var(--line2)}
.hero-facts li{display:flex;align-items:center;gap:9px;color:#C2CEDC;font-size:14.5px}
.hero-facts svg{width:18px;height:18px;fill:none;stroke:var(--ice);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}

.m-only{display:none!important}
.open-st{display:flex;align-items:center;gap:9px;margin-top:6px;font-size:13.5px;color:var(--soft);min-height:1.55em} /* a JS később írja ki: hely előre lefoglalva (CLS) */
span.open-st{display:inline-flex;margin-top:4px}
.open-st::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#6F84A0}
.open-st.is-open{color:var(--ice)}
.open-st.is-open::before{background:var(--ice);box-shadow:0 0 0 0 rgba(145,231,255,.55);animation:pulse 2.4s var(--e) infinite}
.open-st.is-closed::before{background:var(--red)}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(145,231,255,0)}100%{box-shadow:0 0 0 0 rgba(145,231,255,0)}}
.menu-hours .open-st{justify-content:center}

/* ---------- általános szekció ---------- */
.sec{position:relative;padding:clamp(56px,6vw,88px) 0}
.sec-head{max-width:640px;margin-bottom:clamp(24px,2.6vw,36px)}
.sec-head p{margin-top:8px;color:var(--soft);font-size:16px}

/* szekcióhatár: finom fény-vonal (vizuális összekötés) */
.svc::before,.book::before{content:"";position:absolute;top:0;left:50%;width:min(1100px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--line2),transparent)}

/* ---------- szolgáltatások ---------- */
.svc{background:linear-gradient(180deg,var(--g0),var(--g1))}
.svc-body{display:grid;grid-template-columns:minmax(240px,3.6fr) minmax(0,8.4fr);gap:clamp(24px,3vw,44px);align-items:start}
.svc-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);position:sticky;top:80px}
.svc-index button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:42px 1fr auto;align-items:baseline;width:100%;padding:12px 4px;border-bottom:1px solid var(--line);cursor:pointer;color:var(--soft);transition:color .2s,padding .25s var(--e)}
.svc-index button:focus-visible{outline:2px solid var(--ice);outline-offset:-2px}
.svc-index .n{font-family:var(--fh);font-size:13px;color:#5F7690;transition:color .2s}
.svc-index .t{font-family:var(--fh);font-size:16.5px;font-weight:500}
.svc-index .c{font-size:13px;color:#5F7690}
.svc-index button:hover{color:var(--ink)}
.svc-index button[aria-selected=true]{color:var(--ink);padding-left:12px}
.svc-index button[aria-selected=true] .n{color:var(--ice)}
.svc-index li{position:relative}
.svc-index li::before{content:"";position:absolute;left:0;top:0;bottom:-1px;width:2px;background:var(--blue);transform:scaleY(0);transform-origin:top;transition:transform .35s var(--e)}
.svc-index li:has([aria-selected=true])::before{transform:scaleY(1)}

.svc-panel{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);border:1px solid var(--line);border-radius:6px;background:linear-gradient(160deg,var(--steel) 0%,#0D1726 70%);overflow:hidden;min-height:0}
.svc-fig{position:relative;height:auto;min-height:220px;border-right:1px solid var(--line);background:radial-gradient(70% 60% at 50% 58%,rgba(22,184,255,.13),transparent 70%),linear-gradient(180deg,#0C1624,#0A121E);display:grid;place-items:center;overflow:hidden}
.svc-fig::after{content:"";position:absolute;left:12%;right:12%;bottom:22px;height:1px;background:linear-gradient(90deg,transparent,var(--line2),transparent)}
.svc-fig svg{position:relative;z-index:1;width:min(340px,96%);height:auto}
.draw{fill:none;stroke:#D7E3EF;stroke-width:1.7;filter:drop-shadow(0 0 10px rgba(22,184,255,.18));stroke-linecap:round;stroke-linejoin:round}
.draw .t{stroke:#7E91A8;stroke-width:1}
.draw .a{stroke:var(--ice)}
.draw .d{stroke:var(--blue);stroke-width:1;stroke-dasharray:3 4}
.svc-fig .num{position:absolute;z-index:1;left:18px;top:14px;font-family:var(--fh);font-size:12.5px;color:var(--ice);letter-spacing:.08em}
.svc-txt{padding:24px clamp(20px,2.4vw,32px) 26px}
.svc-txt h3{font-size:clamp(20px,.6vw + 14px,24px)}
.svc-txt .intro{margin-top:8px;color:#B5C3D3;max-width:46em;font-size:15px}
.svc-items{list-style:none;padding:0;margin:14px 0 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.svc-items li{display:flex;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px dashed var(--line);font-size:14.5px}
.svc-items li::before{content:"";flex:none;width:7px;height:7px;background:var(--ice);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);opacity:.85;transform:translateY(-1px)}
.svc-acc{display:none}

/* ---------- diagnosztika ---------- */
.diag{background:radial-gradient(70% 60% at 70% 55%,rgba(22,184,255,.08),transparent 70%),var(--steel)}
.diag-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:28px;align-items:end;margin-bottom:22px}
.diag-head p{color:var(--soft)}
.diag-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.diag-tabs button{all:unset;box-sizing:border-box;min-height:40px;padding:0 15px;border-radius:4px;border:1px solid var(--line2);display:inline-flex;align-items:center;gap:8px;font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--soft);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.diag-tabs button i{width:7px;height:7px;border-radius:50%;background:#4B5F77;transition:background-color .2s,box-shadow .2s}
.diag-tabs button:hover{color:var(--ink);border-color:var(--ice)}
.diag-tabs button[aria-selected=true]{background:rgba(22,184,255,.12);color:#fff;border-color:var(--blue)}
.diag-tabs button[aria-selected=true] i{background:var(--ice);box-shadow:0 0 0 4px rgba(145,231,255,.18)}
.diag-tabs button:focus-visible{outline:2px solid var(--ice);outline-offset:2px}
.diag-stage{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(24px,3vw,48px);align-items:center}
.diag-fig{position:relative}
.diag-note{margin-top:10px;font-size:13px;color:#6F84A0}
.diag-svg .car .dr{stroke:#4F6380}
.diag-svg .car .body{stroke:#7F95B0;fill:rgba(8,13,20,.35)}
.diag-svg .lift,.diag-svg .dims,.diag-svg .floor,.diag-svg .scan{display:none}
.sys .dr{stroke:#3A4C63;transition:stroke .45s var(--e),opacity .45s}
.sys.on .dr{stroke:var(--ice)}
.sys.on .dr.glowline{filter:drop-shadow(0 0 5px rgba(22,184,255,.85))}
.sys .fillz{fill:rgba(22,184,255,0);transition:fill .45s}
.sys.on .fillz{fill:rgba(22,184,255,.14)}
.hot{cursor:pointer}
.hot circle{fill:var(--steel);stroke:rgba(145,231,255,.65);stroke-width:1.5;transition:stroke .3s,fill .3s}
.hot:hover circle.core{stroke:#fff}
.hot circle.hit{fill:transparent;stroke:none}
.hot .ring{fill:none;stroke:var(--ice);opacity:0}
.hot.on circle.core{stroke:var(--ice);fill:var(--blue)}
.hot.on .ring{animation:ping 1.8s var(--e) infinite}
.hot:focus-visible circle.core{stroke:#fff;stroke-width:3}
.hot:focus{outline:none}
@keyframes ping{0%{opacity:.8;r:9}100%{opacity:0;r:26}}
.diag-info{border-left:1px solid var(--line2);padding-left:clamp(20px,2.4vw,32px)}
.diag-info h3{font-size:21px}
.diag-info .lede{margin-top:8px;color:#B9C6D6;font-size:15px}
.diag-info .warn{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:13.5px;color:#FFB4AE}
.diag-info .warn::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(240,90,79,.18)}
.diag-info ul{list-style:none;padding:0;margin:12px 0 18px}
.diag-info li{padding:6px 0;border-bottom:1px solid var(--line);font-size:14.5px}

/* ---------- miért (világos) ---------- */
.why{background:var(--paper);color:var(--pink)}
.why-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,96px);align-items:start}
.why h2{color:#0A1220}
.why .lead{margin-top:14px;color:#3D4A5C;font-size:16px;max-width:34em}
.why-year{display:flex;gap:18px;align-items:center;margin-top:24px;padding-top:18px;border-top:1px solid #D3DCE6}
.why-year .yr{font-family:var(--fh);font-size:28px;font-weight:600;color:#0A1220;letter-spacing:-.02em}
.why-year p{color:#4A586B;font-size:15px;max-width:22em}
.why-list{margin:0;border-top:1px solid #C9D3DF}
.why-list>div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:20px;padding:14px 0;border-bottom:1px solid #C9D3DF}
.why-list dt{font-family:var(--fh);font-weight:600;font-size:16px;color:#0A1220}
.why-list dd{margin:0;color:#4A586B;font-size:14.5px}
.why-list a{color:#0A6FA0;font-weight:600;text-decoration:none;white-space:nowrap}
.reviews{margin-top:64px}

/* ---------- folyamat ---------- */
.flow{background:linear-gradient(180deg,var(--g0),var(--steel) 120%);overflow:hidden}
.flow-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;position:relative;z-index:1}
.flow-steps li{position:relative;padding-top:48px}
.flow-steps .n{position:absolute;top:0;left:0;width:36px;height:36px;display:grid;place-items:center;font-family:var(--fh);font-size:13px;font-weight:600;color:var(--soft);background:rgba(145,231,255,.35);clip-path:polygon(50% 0,93.3% 25%,93.3% 75%,50% 100%,6.7% 75%,6.7% 25%);isolation:isolate;transition:color .4s,background-color .4s}
.flow-steps .n::before{content:"";position:absolute;inset:1.5px;z-index:-1;background:var(--g1);clip-path:inherit;transition:background-color .4s}
.flow-steps li.on .n{color:#041420;background:var(--ice)}
.flow-steps li.on .n::before{background:var(--blue)}
.flow-steps h3{font-size:16.5px}
.flow-steps p{margin-top:5px;color:var(--soft);font-size:14px}
.flow-steps::before{content:"";position:absolute;left:18px;right:18px;top:18px;height:1px;background:var(--line2);z-index:-1}
.flow-steps::after{content:"";position:absolute;left:18px;right:18px;top:18px;height:1.5px;background:linear-gradient(90deg,var(--blue),var(--ice));z-index:-1;transform-origin:left;transform:scaleX(var(--prog,0))}
.flow-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:30px}
.flow-cta span{font-family:var(--fh);font-weight:600;font-size:16.5px}

/* ---------- időpontkérés ---------- */
.book{background:var(--steel)}
.book-in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,5vw,80px);align-items:start}
.book-side{position:sticky;top:96px}
.book-side>p{margin-top:10px;color:#B5C3D3;font-size:15px}
.book-call{margin-top:26px;display:none}
.book-meta{margin:20px 0 0;border-top:1px solid var(--line)}
.book-meta>div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.book-meta dt{color:var(--soft)}
.book-meta dd{margin:0;text-align:right}
.book-meta a{text-decoration:none;font-weight:600}
.book-form,.book-done{background:var(--g1);border:1px solid var(--line);border-radius:6px;padding:clamp(18px,2.4vw,30px)}
.book-done{grid-column:2}
fieldset{border:0;margin:0 0 16px;padding:0;min-width:0}
legend{font-family:var(--fh);font-weight:600;font-size:15.5px;margin-bottom:10px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:4px;border:1px solid var(--line2);font-size:14px;color:#C2CEDC;transition:background-color .18s,border-color .18s,color .18s;cursor:pointer}
.chip input:checked+span{background:var(--blue);border-color:var(--blue);color:#041420;font-weight:600}
.chip input:focus-visible+span{outline:2px solid var(--ice);outline-offset:2px}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.f{display:flex;flex-direction:column;gap:5px;margin-bottom:10px;font-size:13.5px;color:var(--soft)}
.f i{font-style:normal;color:#6F84A0}
.f input,.f textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--g0);border:1px solid var(--line2);border-radius:4px;padding:11px 13px;min-height:46px;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.f textarea{resize:vertical;min-height:76px}
.f input::placeholder,.f textarea::placeholder{color:#55687F}
.f input:focus,.f textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(22,184,255,.2)}
.f.bad input{border-color:var(--red)}
.err{font-style:normal;font-size:13px;color:#FF9A92;min-height:0}
.err:empty{display:none}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px}
.form-foot p{flex:1 1 260px;font-size:13.5px;color:#6F84A0}
.book-done h3{font-size:22px}
.book-done>p{margin-top:8px;color:#B5C3D3}
.summary{margin:20px 0 24px;padding:18px;border-radius:4px;background:var(--g0);border:1px dashed var(--line2);white-space:pre-wrap;font-family:var(--fb);font-size:14.5px;line-height:1.65;color:#C9D5E2}
.done-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* ---------- kapcsolat ---------- */
.contact{background:var(--g0)}
.contact-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:stretch}
address{font-style:normal}
.contact dl{margin:20px 0 0;border-top:1px solid var(--line)}
.contact dl>div{display:grid;grid-template-columns:130px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--line)}
.contact dt{color:var(--soft);font-size:14.5px}
.contact dd{margin:0;font-size:15px}
.contact dd a{text-decoration:none;font-weight:600}
.soft{color:var(--soft)}
.contact-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.map{position:relative;min-height:340px;border-radius:6px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(90deg,transparent 49.6%,var(--line2) 50%,transparent 50.4%),linear-gradient(0deg,transparent 49.6%,var(--line2) 50%,transparent 50.4%),repeating-linear-gradient(90deg,transparent 0 63px,var(--line) 63px 64px),repeating-linear-gradient(0deg,transparent 0 63px,var(--line) 63px 64px),var(--steel)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:invert(.92) hue-rotate(180deg) saturate(.55) brightness(.92) contrast(.95)}
.map-gate{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:48px 24px 24px;text-align:center}
.map-gate p{margin:0;max-width:30em;font-size:13.5px;line-height:1.5;color:var(--soft);background:rgba(8,13,20,.82);padding:10px 14px;border-radius:4px}
.map-gate a{color:var(--ice)}
.map-pin{position:absolute;left:14px;top:14px;padding:7px 12px;border-radius:4px;background:rgba(8,13,20,.86);border:1px solid var(--line2);font-family:var(--fh);font-size:13px;font-weight:600;pointer-events:none}

/* ---------- záró ---------- */
.final{position:relative;overflow:hidden;background:var(--steel);border-top:1px solid var(--line)}
.final-lines{position:absolute;inset:0;background:repeating-linear-gradient(100deg,transparent 0 46px,rgba(145,231,255,.05) 46px 47px);animation:drift 30s linear infinite}
@keyframes drift{to{background-position:400px 0}}
.final-in{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:28px;padding-bottom:28px}
.final p{font-family:var(--fh);font-size:clamp(17px,.5vw + 14px,20px);font-weight:500;max-width:30em}

/* ---------- lábléc ---------- */
.foot{background:var(--g0);border-top:1px solid var(--line);padding:28px 0 30px;font-size:14px;color:var(--soft)}
.foot-in{display:grid;grid-template-columns:1fr auto;gap:24px 40px}
.foot-brand{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;color:var(--soft);font-size:11px;letter-spacing:.1em;margin-bottom:12px}
.logo.sm{height:28px}
.nw{white-space:nowrap}
.foot-in>*{min-width:0}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:flex-start}
.foot nav a{display:inline-flex;align-items:center;min-height:32px;text-decoration:none}
.foot nav a:hover{color:var(--ink)}
.foot-small{grid-column:1/-1;font-size:13px;color:#7F93AB}
.foot-legal{display:flex;flex-wrap:wrap;gap:4px 20px;margin-bottom:6px}
.foot-legal a{display:inline-flex;align-items:center;min-height:32px;color:var(--soft)}
.foot-legal a:hover{color:var(--ink)}

/* ---------- jogi aloldalak, 404 ---------- */
.lnav{position:sticky;top:0;z-index:50;background:rgba(8,13,20,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.lnav .nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:var(--navh)}
.lnav .brand{display:inline-flex;align-items:center;min-height:44px}
.lnav .logo{height:26px;width:auto}
.lnav .back{font-family:var(--fh);font-weight:600;font-size:14px;text-decoration:none;color:var(--ice);min-height:44px;display:inline-flex;align-items:center}
.legal{padding:clamp(32px,6vw,72px) 0 clamp(48px,7vw,88px)}
.legal .wrap{max-width:820px}
.legal .kicker{font-family:var(--fh);font-size:12.5px;font-weight:600;letter-spacing:.16em;color:var(--ice);margin:0 0 12px}
.legal h1{font-size:clamp(28px,3vw + 14px,44px);line-height:1.1;margin-bottom:14px}
.legal .lead{color:var(--soft);margin:0 0 28px;max-width:44em}
.legal h2{font-size:clamp(19px,1vw + 14px,23px);margin:36px 0 12px;padding-top:20px;border-top:1px solid var(--line)}
.legal h3{font-size:16.5px;margin:22px 0 8px}
.legal p,.legal li{color:#C9D5E2;overflow-wrap:anywhere}
.legal ul{padding-left:20px}
.legal li{margin:4px 0}
.legal a{color:var(--ice)}
.legal dl{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:8px 24px;margin:0}
.legal dt{color:var(--soft);font-size:14.5px}
.legal dd{margin:0;color:var(--ink);overflow-wrap:anywhere}
.legal .tbl{width:100%;overflow-x:auto}
.legal .tbl:focus-visible{outline:2px solid var(--ice);outline-offset:3px}
.legal table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
.legal th,.legal td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line);color:#C9D5E2}
.legal th{font-family:var(--fh);font-weight:600;color:var(--ink);background:var(--steel)}
.legal .note{font-size:14px;color:var(--soft)}
.legal .cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
@media (max-width:640px){
  .legal dl{grid-template-columns:1fr;gap:2px 0}
  .legal dd{margin-bottom:10px}
  .legal table{min-width:0}
  .legal thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .legal table,.legal tbody,.legal tr,.legal td{display:block}
  .legal tr{border:1px solid var(--line);border-radius:6px;margin-bottom:12px;background:var(--g1)}
  .legal td{border-bottom:1px solid var(--line);padding:10px 14px}
  .legal td:last-child{border-bottom:0}
  .legal td::before{content:attr(data-label);display:block;font-family:var(--fh);font-weight:600;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ice);margin-bottom:4px}
}

/* ---------- mobil alsó sáv ---------- */
.mbar{display:none}

/* ---------- regisztrációs sarokjelek (műszaki rajz motívum) ---------- */
.svc-panel::after,.book-form::after,.book-done::after,.map::after{content:"";position:absolute;inset:6px;z-index:2;pointer-events:none;
  background:linear-gradient(var(--ice),var(--ice)) 0 0/10px 1px,linear-gradient(var(--ice),var(--ice)) 0 0/1px 10px,
  linear-gradient(var(--ice),var(--ice)) 100% 0/10px 1px,linear-gradient(var(--ice),var(--ice)) 100% 0/1px 10px,
  linear-gradient(var(--ice),var(--ice)) 0 100%/10px 1px,linear-gradient(var(--ice),var(--ice)) 0 100%/1px 10px,
  linear-gradient(var(--ice),var(--ice)) 100% 100%/10px 1px,linear-gradient(var(--ice),var(--ice)) 100% 100%/1px 10px;
  background-repeat:no-repeat;opacity:.55}
.book-form,.book-done{position:relative}

/* ---------- reszponzív ---------- */
@media (max-width:1080px){
  .nav-links{gap:18px}
  .nav-links a{font-size:14px}
}
@media (max-width:960px){
  :root{--navh:64px}
  .nav-links,.nav-cta{display:none}
  .burger{display:block}
  .hero{min-height:auto;padding-top:calc(var(--navh) + 4px)}
  .hero-in{grid-template-columns:1fr;gap:0;padding-top:10px}
  .hero-art{order:-1;margin:0 -1% 4px -3%}
  .hero-copy{padding-top:8px}
  .hero-facts{gap:6px 18px;padding-top:12px;padding-bottom:18px}
  .hero-facts li{font-size:13.5px}
  .svc-body{display:none}
  .svc-acc{display:block;border-top:1px solid var(--line)}
  .acc{border-bottom:1px solid var(--line)}
  .acc-h{all:unset;box-sizing:border-box;display:grid;grid-template-columns:38px 1fr 24px;align-items:center;width:100%;min-height:54px;padding:8px 2px;cursor:pointer}
  .acc-h:focus-visible{outline:2px solid var(--ice);outline-offset:-2px}
  .acc-h .n{font-family:var(--fh);font-size:13px;color:var(--ice)}
  .acc-h .t{font-family:var(--fh);font-size:16.5px;font-weight:500}
  .acc-h .pm{width:14px;height:14px;position:relative;justify-self:end}
  .acc-h .pm::before,.acc-h .pm::after{content:"";position:absolute;left:0;right:0;top:6px;height:1.6px;background:var(--ink);transition:transform .25s var(--e)}
  .acc-h .pm::after{transform:rotate(90deg)}
  .acc-h[aria-expanded=true] .pm::after{transform:rotate(0)}
  .acc-b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--e)}
  .acc-b>div{overflow:hidden}
  .acc.open .acc-b{grid-template-rows:1fr}
  .acc-b .svc-fig{height:130px;min-height:0;border:1px solid var(--line);border-radius:6px;margin:2px 0 0}
  .acc-b .svc-fig svg{width:auto;height:112px}
  .acc-b .intro{margin-top:10px;color:#B5C3D3;font-size:14.5px}
  .acc-b .svc-items{grid-template-columns:1fr 1fr;gap:0 14px;margin:8px 0 14px}
  .acc-b .btn{width:100%;margin-bottom:16px}
  .diag-head{grid-template-columns:1fr;gap:12px}
  .diag-stage{grid-template-columns:1fr}
  .diag-info{border-left:0;padding-left:0;border-top:1px solid var(--line2);padding-top:16px}
  .why-in{grid-template-columns:1fr}
  .flow-steps{grid-template-columns:1fr;gap:16px;padding-left:0}
  .flow-steps li{padding:0 0 0 52px}
  .flow-steps::before,.flow-steps::after{left:18px;right:auto;top:18px;bottom:18px;width:1px;height:auto}
  .flow-steps::after{width:1.5px;transform-origin:top;transform:scaleY(var(--prog,0))}
  .book-in{grid-template-columns:1fr}
  .book-side{position:static}
  .book-call{display:flex}
  .book-done{grid-column:auto}
  .contact-in{grid-template-columns:1fr}
  .map{min-height:260px}
  .foot-in{grid-template-columns:1fr}
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(8,13,20,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line2);padding:8px 10px calc(8px + env(safe-area-inset-bottom));gap:8px;transform:translateY(110%);transition:transform .35s var(--e)}
  .mbar.show{transform:none}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;border-radius:4px;text-decoration:none;font-family:var(--fh);font-weight:600;font-size:15px;border:1px solid var(--line2)}
  .mbar a:first-child{background:var(--blue);border-color:var(--blue);color:#041420;border-radius:0;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
  .mbar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
}
@media (max-width:640px){
  body{font-size:16px}
  .logo{height:31px}
  .brand-sub{font-size:7.2px;letter-spacing:.06em;padding-left:2px}
  .hero h1{font-size:clamp(32px,9vw,40px)}
  .hero-cta .btn{flex:1 1 0;padding:0 12px}
  .hero-sub{font-size:15.5px}
  .row3{grid-template-columns:1fr;gap:0}
  .row3 .f:nth-child(3){max-width:none}
  .why-list>div{grid-template-columns:1fr;gap:6px}
  .why-year .yr{font-size:28px}
  .contact dl>div{grid-template-columns:100px 1fr;gap:10px}
  .contact dt{font-size:13.5px}
  .contact-cta .btn{flex:1 1 0}
  .done-actions .btn,.form-foot .btn{flex:1 1 100%}
  .final-in .btn{width:100%}
  .sec{padding:48px 0}
  .sec-head{margin-bottom:20px}
  .menu nav a{font-size:19px;padding:12px 2px;min-height:50px}
  .diag-tabs{display:grid;grid-template-columns:1fr 1fr}
  .diag-tabs button{justify-content:flex-start;font-size:13px;letter-spacing:.05em;padding:0 14px}
  .diag-tabs button:last-child{grid-column:1/-1}
}
@media (max-width:360px){
  .hero-mark{letter-spacing:.07em;gap:8px}
  .hero-mark::before{width:14px}
  .hero-cta .btn{flex:1 1 100%}
  .brand-sub{display:none}
  .hero h1{font-size:30px}
  .contact-cta .btn{flex:1 1 auto;padding:0 16px}
}


/* ---------- telefon: tömör nézet ---------- */
.m-show{display:none}
@media (max-width:640px){
  .m-hide{display:none}
  .m-show{display:inline}
  body{line-height:1.5}
  h2{font-size:23px}
  .sec{padding:36px 0}
  .sec-head{margin-bottom:14px}
  .sec-head p{font-size:14.5px;margin-top:4px}
  /* hero */
  .hero-mark{margin-bottom:10px;font-size:11px}
  .hero h1{font-size:clamp(29px,8.4vw,34px)}
  .hero-sub{margin-top:10px;font-size:15px}
  .hero-cta{margin-top:16px}
  .hero-phone{margin-top:2px;font-size:14px}
  .hero-facts{padding-top:10px;padding-bottom:14px}
  .hero-facts li{font-size:13px}
  /* szolgáltatások */
  .acc-h{min-height:48px;padding:6px 2px}
  .acc-h .t{font-size:15.5px}
  .acc-b .svc-fig{height:104px}
  .acc-b .svc-fig svg{height:92px}
  .acc-b .svc-items li{font-size:13.5px;padding:5px 0}
  /* diagnosztika */
  .diag-head{margin-bottom:12px;gap:6px}
  .diag-head p{font-size:14.5px}
  .diag-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px;padding:0;overflow:visible}
  .d-only{display:none!important}
  .m-only{display:inline-flex!important}
  .hero .open-st{margin-top:12px}
  .diag-tabs button{flex:1 1 auto;justify-content:center;min-height:40px;padding:0 10px;font-size:12px;letter-spacing:.04em;gap:7px}
  .diag-tabs button:last-child{grid-column:auto}
  .diag-note{margin-top:2px;font-size:11.5px}
  .diag-info{padding-top:12px}
  .diag-info h3{font-size:18px}
  .diag-info .lede{font-size:14px}
  .diag-info .warn{margin-top:10px;font-size:12.5px}
  .diag-info ul{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 14px}
  .diag-info li{padding:5px 10px;border:1px solid var(--line);border-radius:4px;font-size:13px}
  .diag-info .btn{width:100%}
  /* miért */
  .why .lead{font-size:14.5px;margin-top:10px}
  .why-year{margin-top:14px;padding-top:12px;gap:12px}
  .why-year .yr{font-size:22px}
  .why-year p{font-size:13.5px}
  .why-in{gap:20px}
  .why-list{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
  .why-list>div{display:flex;align-items:flex-start;gap:8px;padding:9px 0;border-bottom:1px solid #C9D3DF}
  .why-list>div::before{content:"";flex:none;width:9px;height:9px;margin-top:5px;background:#0A6FA0;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
  .why-list dt{font-size:13.5px;line-height:1.3}
  .why-list dd{display:none}
  .why-list>div:last-child{grid-column:1/-1}
  .why-list>div:last-child dd{display:block;font-size:13px;margin-left:6px}
  .why-list>div:last-child dd{display:none}
  /* folyamat */
  .flow-steps{gap:12px}
  .flow-steps li{padding-left:48px}
  .flow-steps h3{font-size:15px}
  .flow-steps p{font-size:13px;margin-top:2px}
  .flow-cta{margin-top:18px}
  /* időpontkérés */
  .book-in{gap:16px}
  .book-side>p{font-size:14px}
  .book-call{margin-top:14px}
  .book-meta{display:none}
  .book-form,.book-done{padding:16px 14px}
  fieldset{margin-bottom:10px}
  legend{font-size:14.5px;margin-bottom:8px}
  .chips{gap:5px}
  .chip span{min-height:40px;padding:0 10px;font-size:13px}
  .row3{grid-template-columns:1fr 1fr 78px;gap:8px}
  .row3.who{grid-template-columns:1fr 1fr}
  .row3.who .f:first-child{grid-column:1/-1}
  .f{margin-bottom:8px;font-size:12.5px;gap:4px}
  .f input,.f textarea{min-height:44px;padding:9px 11px}
  .f textarea{min-height:60px}
  .form-foot p{display:none}
  /* kapcsolat */
  .contact dl{margin-top:12px}
  .contact dl>div{padding:8px 0}
  .contact dd{font-size:14.5px}
  .contact-cta{margin-top:14px}
  .map{min-height:200px}
  .contact-in{gap:16px}
  /* záró sáv: telefonon az alsó Hívás sáv kiváltja */
  .final{display:none}
  .foot{padding:20px 0 22px;font-size:13px}
  .foot-in{gap:12px}
  .foot nav{display:none}
}

/* ---------- mozgás kikapcsolva ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
