/* base.css — reset, tipó, elrendezés, felületek, műszer-réteg, fejléc, lábléc, betöltő, oldalváltás */

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h-small) + 24px);interpolate-size:allow-keywords}
body{margin:0;min-height:100vh;background:var(--c-ink);color:var(--c-fog);font-family:var(--f-sans);font-size:var(--fs-body);line-height:1.55;font-weight:450;font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,canvas,video{display:block;max-width:100%}
h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul[role=list],ol[role=list]{list-style:none;padding:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
::selection{background:var(--c-lime);color:var(--c-ink)}
[data-surface=fog] ::selection,[data-surface=fog-2] ::selection{background:var(--c-cobalt);color:var(--c-fog)}
:focus-visible{outline:2px solid var(--focus,var(--c-lime));outline-offset:3px;border-radius:2px}
main:focus{outline:none}

main [hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:12px;z-index:200;padding:12px 18px;background:var(--c-lime);color:var(--c-ink);font-weight:700;border-radius:var(--radius);transform:translateY(-160%);transition:transform var(--t-micro) var(--ease-jel)}
.skip-link:focus{transform:none}

/* ---------- felületek (színblokkos ritmus) ---------- */
[data-surface]{background:var(--bg);color:var(--fg)}
[data-surface=ink]{--bg:var(--c-ink);--fg:var(--c-fog);--fg-2:var(--c-text-2-dark);--line:var(--c-line-dark);--accent:var(--c-lime);--accent-ink:var(--c-ink);--signal:var(--c-lime);--focus:var(--c-lime);--card:#111743;--card-line:rgba(169,176,214,.18)}
[data-surface=deep]{--bg:var(--c-ink-0);--fg:var(--c-fog);--fg-2:var(--c-text-2-dark);--line:var(--c-line-dark);--accent:var(--c-lime);--accent-ink:var(--c-ink);--signal:var(--c-lime);--focus:var(--c-lime);--card:#0E1440;--card-line:rgba(169,176,214,.16)}
[data-surface=cobalt]{--bg:var(--c-cobalt);--fg:var(--c-fog);--fg-2:#DDE2FF;--line:var(--c-line-cobalt);--accent:var(--c-lime);--accent-ink:var(--c-ink);--signal:var(--c-lime);--focus:var(--c-lime);--card:var(--c-cobalt-3);--card-line:rgba(244,245,250,.24)}
[data-surface=fog]{--bg:var(--c-fog);--fg:var(--c-ink);--fg-2:var(--c-text-2-light);--line:rgba(11,16,51,.09);--accent:var(--c-cobalt);--accent-ink:var(--c-fog);--signal:var(--c-cobalt);--focus:var(--c-cobalt);--card:#FFFFFF;--card-line:var(--c-line)}
[data-surface=fog-2]{--bg:var(--c-fog-2);--fg:var(--c-ink);--fg-2:var(--c-text-2-light);--line:rgba(11,16,51,.1);--accent:var(--c-cobalt);--accent-ink:var(--c-fog);--signal:var(--c-cobalt);--focus:var(--c-cobalt);--card:#FFFFFF;--card-line:var(--c-line)}

/* ---------- elrendezés ---------- */
.wrap{position:relative;width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.sec{position:relative;padding-block:var(--sec-pad);isolation:isolate}
.sec--tight{padding-block:clamp(64px,8vw,128px)}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap)}
@media (max-width:899px){.g12{grid-template-columns:repeat(4,minmax(0,1fr))}.g12>*{grid-column:1/-1!important}}

/* Dither-él a szekció tetején: az új szín pixelesen "beleesik" az előzőbe (MOTION 4.8) */
.sec[data-dither]::before{content:"";position:absolute;left:0;right:0;top:-31px;height:32px;background:var(--bg);-webkit-mask:var(--dither-band) 0 0/32px 32px repeat-x;mask:var(--dither-band) 0 0/32px 32px repeat-x;pointer-events:none;z-index:1}
@media (max-width:899px){.sec[data-dither]::before{-webkit-mask-size:24px 24px;mask-size:24px 24px;top:-23px;height:24px}}

/* ---------- tipó ---------- */
.h1,h1{font-size:var(--fs-h1);line-height:.9;letter-spacing:-.052em;font-weight:780;text-wrap:balance;font-variation-settings:"wght" 780}
.sec-title{font-size:var(--fs-h2);line-height:.96;letter-spacing:-.045em;font-weight:760;text-wrap:balance;max-width:16ch}
.sec-q{display:flex;gap:.75em;align-items:baseline;font-size:var(--fs-small);font-weight:600;letter-spacing:.005em;color:var(--fg-2);margin-bottom:clamp(18px,2vw,28px);max-width:52ch}
.sec-q::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--signal);transform:translateY(-.1em)}
h3,.h3{font-size:var(--fs-h3);line-height:1.15;letter-spacing:-.02em;font-weight:720}
.lead{font-size:var(--fs-lead);line-height:1.45;font-weight:480;letter-spacing:-.01em;color:var(--fg);max-width:44ch}
.big{font-size:var(--fs-big);line-height:1.28;letter-spacing:-.022em;font-weight:560;max-width:34ch;text-wrap:pretty}
.body{max-width:62ch;color:var(--fg-2);text-wrap:pretty}
.body p+p{margin-top:1em}
.body strong,.body b{color:var(--fg);font-weight:700}
.small{font-size:var(--fs-small);color:var(--fg-2);line-height:1.5}
.mono{font-family:var(--f-mono);font-size:var(--fs-mono);font-weight:500;letter-spacing:.06em;text-transform:uppercase;font-feature-settings:"zero" 0}
.tnum{font-variant-numeric:tabular-nums}
html.no-varfont{--f-sans:"Manrope Static","Manrope",system-ui,sans-serif}
/* kulcsszó-sáv: háttérként, így sortörésnél is helyes (box-decoration-break), iOS/Firefox is */
@property --hl{syntax:"<number>";inherits:false;initial-value:1}
.hl{--hl-h:.13em;background:linear-gradient(var(--signal),var(--signal)) 0 calc(100% - .02em)/calc(var(--hl,1) * 100%) var(--hl-h) no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:--hl var(--t-3) var(--ease-jel)}
[data-surface=fog] .hl,[data-surface=fog-2] .hl{--hl-h:.08em}
.js .hl[data-sweep]{--hl:0}
.js .hl[data-sweep].is-on{--hl:1}

/* ---------- műszer-réteg: rács, + markerek, margó-címkék ---------- */
.sec__grid{position:absolute;inset:0 0 0 0;pointer-events:none;z-index:-1;display:flex;justify-content:center}
.sec__grid::before{content:"";width:100%;max-width:var(--maxw);margin-inline:auto;height:100%;
  --cols:12;
  background:
    linear-gradient(to right,var(--line) 1px,transparent 1px) var(--gutter) 0/calc((100% - 2*var(--gutter) + var(--col-gap))/var(--cols)) 100% repeat-x;
  transform-origin:50% 0;transition:transform var(--t-4) var(--ease-jel),opacity var(--t-4) var(--ease-jel);--grid-o:.6}
@media (max-width:899px){.sec__grid::before{--cols:4}}
.js .sec__grid::before{transform:scaleY(0);opacity:0}
.js .sec.is-in .sec__grid::before{transform:none;opacity:var(--grid-o)}
.sec__grid::before{opacity:var(--grid-o)}
.sec__mark{position:absolute;width:11px;height:11px;pointer-events:none;color:var(--fg-2);opacity:.55;z-index:2}
.sec__mark::before,.sec__mark::after{content:"";position:absolute;background:currentColor}
.sec__mark::before{left:5px;top:0;width:1px;height:11px}
.sec__mark::after{top:5px;left:0;height:1px;width:11px}
.sec__meta{position:absolute;top:clamp(20px,2.4vw,36px);left:0;right:0;z-index:2;pointer-events:none}
.sec__meta .wrap{display:flex;justify-content:space-between;align-items:center;color:var(--fg-2);gap:16px}
[data-surface^=fog] .sec__meta .mono{opacity:1}
.sec__meta .mono{opacity:.8;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sec .sec__meta>.wrap{display:flex}
.sec__meta .sec__mark{position:static}
/* az oldal első szekciójában a műszer-sor a fejléc ALATT kezdődik (ne takarja a logót) */
main>:first-child>.sec__meta{top:calc(var(--header-h) + 8px)}
/* …és a morzsamenü ne tapadjon rá a műszer-sorra (keskeny kijelzőn a szekció-tető alacsony) */
main>:first-child .crumbs{position:relative;z-index:2}
@media (max-width:899px){main>:first-child .crumbs{margin-top:12px}}
.mlabel{font-family:var(--f-mono);font-size:var(--fs-mono);font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);white-space:nowrap}
.mlabel--signal{color:var(--signal)}

/* Szekció-számláló (bal alsó sarok, csak asztalon) */
.counter{position:fixed;left:calc(var(--gutter) / 2 - 7px);bottom:24px;writing-mode:vertical-rl;transform:rotate(180deg);z-index:60;display:flex;align-items:center;gap:10px;color:var(--cnt-fg,var(--c-fog));pointer-events:none;opacity:0;transition:opacity var(--t-3) var(--ease-jel),color var(--t-3) var(--ease-jel)}
.counter[data-on]{opacity:1}
.counter__dot{width:7px;height:7px;border-radius:50%;background:var(--cnt-dot,var(--c-lime))}
.counter__num{display:inline-block;vertical-align:top}
/* QA: a számláló EGY függőleges sorban, a margó-sáv közepén (korábban 2 oszlopra tört és rálógott a címekre) */
.counter{white-space:nowrap;line-height:1.1;left:max(4px,calc(var(--gutter) / 2 - 8px))}
.counter__num span{display:block;transition:transform var(--t-hover) steps(3,end)}
html[data-under-counter=fog] .counter,html[data-under-counter=fog-2] .counter{--cnt-fg:var(--c-ink);--cnt-dot:var(--c-cobalt)}
@media (max-width:1099px){.counter{display:none}}

/* ---------- fejléc ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:100;height:var(--header-h);color:var(--hdr-fg,var(--c-fog));transition:height var(--t-state) var(--ease-huzat),color var(--t-state) var(--ease-jel)}
.hdr::before{content:"";position:absolute;inset:0;background:var(--hdr-bg,transparent);opacity:0;backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);transition:opacity var(--t-state) var(--ease-jel),background-color var(--t-state);border-bottom:1px solid var(--hdr-line,transparent)}
html.is-scrolled .hdr{height:var(--header-h-small)}
html.is-scrolled .hdr::before{opacity:1}
html[data-under-header=ink] .hdr,html[data-under-header=deep] .hdr{--hdr-bg:rgba(11,16,51,.78);--hdr-line:rgba(169,176,214,.12)}
html[data-under-header=cobalt] .hdr{--hdr-bg:rgba(47,75,255,.86);--hdr-line:rgba(244,245,250,.18)}
html[data-under-header=fog] .hdr,html[data-under-header=fog-2] .hdr{--hdr-fg:var(--c-ink);--hdr-bg:rgba(244,245,250,.84);--hdr-line:rgba(11,16,51,.08)}
.hdr__in{position:relative;height:100%;display:flex;align-items:center;gap:clamp(16px,3vw,48px)}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;view-transition-name:brand;color:inherit}
.brand svg{height:clamp(26px,2.3vw,32px);width:auto;overflow:visible}
/* Logó (Áron 10-05): nyugalmi állapotban PONTOSAN a végleges arculati logó (telt gyűrű a nyílással + egy lime pont a helyén).
   Görgetéskor a gyűrű belsejében egy lime réteg töltődik fel a nyílástól körbe; nincs „fej”, nincs második pont
   (szögletes vég, ~2 % alatt láthatatlan). Visszagörgetve a tetejére újra a végleges logó. Csökkentett mozgás: statikus. */
.brand .ring-track{opacity:1}
.brand .ring-prog{stroke:var(--c-lime);stroke-width:3.4;stroke-linecap:butt;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0}
html[data-under-header=fog] .brand .ring-prog,html[data-under-header=fog-2] .brand .ring-prog{stroke:var(--c-cobalt)}
@supports (animation-timeline:scroll()){
  .brand .ring-prog{animation:ringProg linear both;animation-timeline:scroll(root block)}
  @keyframes ringProg{0%{stroke-dashoffset:1;opacity:0}2%{stroke-dashoffset:.98;opacity:0}4%{opacity:1}100%{stroke-dashoffset:0;opacity:1}}
}
@media (prefers-reduced-motion:reduce){.brand .ring-prog{display:none}}
.brand .ring-dot{fill:var(--c-lime)}
html[data-under-header=fog] .brand .ring-dot,html[data-under-header=fog-2] .brand .ring-dot{fill:var(--c-cobalt)}
.nav{margin-left:auto;display:flex;align-items:center;gap:clamp(14px,2.2vw,34px)}
.nav__list{display:flex;gap:clamp(14px,2vw,30px);list-style:none;margin:0;padding:0}
.nav__a{position:relative;display:inline-block;font-size:.9375rem;font-weight:600;letter-spacing:-.005em;padding:8px 0;opacity:.86;transition:opacity var(--t-hover)}
@media (hover:hover){.nav__a:hover,.nav__a[aria-current]{opacity:1}}
.nav__a[aria-current]::after{content:"";position:absolute;left:50%;bottom:-2px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--c-lime);view-transition-name:nav-dot}
html[data-under-header=fog] .nav__a[aria-current]::after,html[data-under-header=fog-2] .nav__a[aria-current]::after{background:var(--c-cobalt)}
.nav__burger{display:none;width:44px;height:44px;border-radius:50%;position:relative}
.nav__burger span{position:absolute;left:12px;right:12px;height:2px;background:currentColor;transition:transform var(--t-state) var(--ease-huzat)}
.nav__burger span:first-child{top:17px}.nav__burger span:last-child{top:25px}
html.menu-open .nav__burger span:first-child{transform:translateY(4px) rotate(45deg)}
html.menu-open .nav__burger span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mmenu{position:fixed;inset:0;z-index:95;background:var(--c-ink);color:var(--c-fog);padding:calc(var(--header-h) + 24px) var(--gutter) 32px;display:flex;flex-direction:column;justify-content:space-between;clip-path:circle(0 at calc(100% - 40px) 44px);visibility:hidden;transition:clip-path var(--t-scene) var(--ease-huzat),visibility 0s var(--t-scene)}
html.menu-open .mmenu{clip-path:circle(150vmax at calc(100% - 40px) 44px);visibility:visible;transition:clip-path var(--t-scene) var(--ease-huzat)}
.mmenu__list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.mmenu__list a{display:flex;align-items:baseline;gap:14px;font-size:clamp(2rem,9vw,3.4rem);font-weight:740;letter-spacing:-.04em;line-height:1.05;padding:6px 0}
.mmenu__list a .mono{color:var(--c-text-2-dark)}
.mmenu__list a[aria-current]{color:var(--c-lime)}
@media (max-width:1023px){.nav__list{display:none}.nav__burger{display:block}.nav .btn{--btn-h:42px;padding-inline:18px}}
@media (min-width:1024px){.mmenu{display:none}}
html.menu-open{overflow:hidden}
html.menu-open .hdr{--hdr-fg:var(--c-fog)}
html.menu-open .hdr::before{opacity:0}

/* ---------- lábléc ---------- */
.ftr{position:relative;background:var(--c-ink-0);color:var(--c-fog);padding-top:clamp(64px,8vw,120px);overflow:hidden;--bg:var(--c-ink-0);--fg:var(--c-fog);--fg-2:var(--c-text-2-dark);--line:var(--c-line-dark);--signal:var(--c-lime);--focus:var(--c-lime)}
.ftr__tag{display:flex;flex-wrap:wrap;gap:.4em 1em;align-items:baseline;font-size:var(--fs-lead);letter-spacing:-.015em;color:var(--c-text-2-dark);max-width:60ch}
.ftr__tag strong{color:var(--c-fog);font-weight:720}
.ftr__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap);margin-top:clamp(40px,5vw,72px);padding-top:28px;border-top:1px solid var(--line)}
.ftr__col h2{font-family:var(--f-mono);font-size:var(--fs-mono);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--c-text-2-dark);margin-bottom:18px}
.ftr__col ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr__col a,.ftr__col button{font-size:1rem;font-weight:560;color:var(--c-fog);opacity:.88}
@media (hover:hover){.ftr__col a:hover,.ftr__col button:hover{opacity:1}}
.ftr__col p{font-size:var(--fs-small);color:var(--c-text-2-dark);margin-bottom:16px;max-width:36ch}
.ftr__word{position:relative;margin-top:clamp(56px,7vw,110px);user-select:none}
.ftr__word-static{display:flex;align-items:flex-end;gap:0;font-size:clamp(3.4rem,calc((min(100vw,var(--maxw)) - 2 * var(--gutter)) / 5),22rem);line-height:.78;font-weight:800;letter-spacing:-.06em;color:var(--c-cobalt);white-space:nowrap}
.ftr__word-static .o-ring{width:.74em;height:.74em;flex:0 0 auto;margin-right:.02em;margin-bottom:.0em;overflow:visible}
.ftr__word-static .o-ring path{stroke:var(--c-cobalt)}
.ftr__word-static .o-ring circle{fill:var(--c-lime)}
.ftr__strip{border-top:1px solid var(--line);margin-top:clamp(24px,3vw,40px);padding-block:22px 28px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center}
.ftr__b2b{font-weight:700;color:var(--c-fog);font-size:var(--fs-small)}
.ftr__legal{font-size:var(--fs-small);color:var(--c-text-2-dark)}
@media (max-width:899px){.ftr__cols{grid-template-columns:1fr;gap:36px}}

/* ---------- betöltő (MOTION 3.1) ---------- */
.loader{position:fixed;inset:0;z-index:300;display:none;background:var(--c-ink);pointer-events:none}
.loader canvas{width:100%;height:100%}
html.has-loader .loader{display:block;animation:loaderFailsafe 0s 2.6s forwards}
html.has-loader .loader.is-live{background:transparent}
@keyframes loaderFailsafe{to{visibility:hidden}}

/* ---------- oldalváltás (MOTION 3.2) ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOld 280ms steps(1,end) both;-webkit-mask:var(--bayer-0) 0 0/16px 16px;mask:var(--bayer-0) 0 0/16px 16px}
::view-transition-new(root){animation:vtNew 360ms var(--ease-jel) 60ms both}
@keyframes vtOld{
  0%{-webkit-mask-image:var(--bayer-1);mask-image:var(--bayer-1)}
  14%{-webkit-mask-image:var(--bayer-2);mask-image:var(--bayer-2)}
  28%{-webkit-mask-image:var(--bayer-3);mask-image:var(--bayer-3)}
  42%{-webkit-mask-image:var(--bayer-4);mask-image:var(--bayer-4)}
  56%{-webkit-mask-image:var(--bayer-5);mask-image:var(--bayer-5)}
  70%{-webkit-mask-image:var(--bayer-6);mask-image:var(--bayer-6)}
  84%{-webkit-mask-image:var(--bayer-7);mask-image:var(--bayer-7)}
  100%{-webkit-mask-image:var(--bayer-8);mask-image:var(--bayer-8)}
}
@keyframes vtNew{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:899px){::view-transition-old(root){-webkit-mask-size:24px 24px;mask-size:24px 24px}}
::view-transition-group(brand),::view-transition-group(nav-dot){animation-duration:420ms;animation-timing-function:var(--ease-huzat)}

/* ---------- kurzor: "a pont" (MOTION 3.6) ---------- */
.cursor{position:fixed;left:0;top:0;z-index:400;pointer-events:none;width:0;height:0;opacity:0;transition:opacity var(--t-hover)}
.cursor[data-on]{opacity:1}
.cursor__dot{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--cur,var(--c-lime));transition:transform var(--t-hover) var(--ease-jel),background-color var(--t-hover)}
.cursor__ring{position:absolute;left:-14px;top:-14px;width:28px;height:28px;opacity:0;transform:scale(.4);transition:opacity var(--t-hover),transform var(--t-hover) var(--ease-jel);color:var(--cur,var(--c-lime))}
.cursor__ring svg{width:100%;height:100%;animation:spin 8s linear infinite}
.cursor[data-mode=link] .cursor__ring{opacity:1;transform:none}
.cursor[data-mode=link] .cursor__dot{transform:translate(9px,-9px) scale(.75)}
.cursor[data-mode=text] .cursor__dot{transform:scale(.5)}
.cursor__wave{position:absolute;left:-12px;top:-12px;width:24px;height:24px;border-radius:50%;border:1px solid var(--cur,var(--c-lime));opacity:0}
.cursor__wave.go{animation:wave .4s var(--ease-jel)}
@keyframes wave{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(2)}}
@keyframes spin{to{transform:rotate(360deg)}}
html[data-under-cursor=fog] .cursor,html[data-under-cursor=fog-2] .cursor{--cur:var(--c-cobalt)}
html.has-cursor,html.has-cursor body,html.has-cursor a,html.has-cursor button,html.has-cursor summary,html.has-cursor [role=button]{cursor:none}
html.has-cursor input,html.has-cursor textarea,html.has-cursor select,html.has-cursor [contenteditable]{cursor:auto}

/* ---------- reveal alapállapot (JS nélkül minden látszik) ---------- */
.js [data-reveal]{opacity:0}
.js [data-reveal].is-revealed{opacity:1}
.line-mask,.ln-mask{padding-block:.1em .16em;margin-block:-.1em -.16em}
/* hero H1: CSS-belépő az első festéstől (QA: nem vár a lusta SplitTextre). Betöltővel: az intro végén (.is-in) indul,
   failsafe 3 s után akkor is látszik, ha a JS nem fut le. */
@keyframes h1In{from{opacity:0;transform:translateY(.32em);clip-path:inset(-12% -4% 72% -4%)}to{opacity:1;transform:none;clip-path:inset(-12% -4% -30% -4%)}}
@keyframes h1Fail{to{opacity:1}}
.js [data-split-now]{animation:h1In .92s var(--ease-jel) .05s backwards}
.js.has-loader [data-split-now]:not(.is-in){opacity:0;animation:h1Fail 0s 3s forwards}
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .js [data-reveal]{opacity:1}
  .js [data-split-now]{animation:none!important;opacity:1!important}
  .js .sec__grid::before{transform:none;opacity:1;transition:none}
  .js .hl[data-sweep]{--hl:1}
  *,*::before,*::after{scroll-behavior:auto!important}
  .cursor__ring svg{animation:none}
}

/* ---------- szélesség-biztonság 320 → 2560 px (hosszú magyar szavak, keskeny fejléc) ---------- */
body{overflow-wrap:break-word}
h1,h2,h3,p,li,dd,td,th,summary{overflow-wrap:break-word}
/* címek: kézi tagolás (&shy;), kiegyensúlyozott sorok; a törzsszöveg maradhat hyphens:auto */
h1,h2,h3,.h1,.h3,.sec-title,.display,.close__title,.faq summary h3{-webkit-hyphens:manual!important;hyphens:manual!important;text-wrap:balance}
@media (max-width:600px){
  p,li,dd,td{-webkit-hyphens:auto;hyphens:auto}
  .btn{white-space:normal;text-align:center;height:auto;min-height:var(--btn-h);padding-block:12px;line-height:1.25}
}
@media (max-width:380px){
  .hdr__in{gap:8px}
  .brand svg{height:21px}
  .nav{gap:6px}
  .hdr .btn{--btn-h:40px;padding:0 12px 0 14px;font-size:.84rem;gap:8px}
  .hdr .btn .btn__dot{display:none}
  .nav__burger{width:40px;height:40px}
  .nav__burger span{left:10px;right:10px}
}
@media (min-width:1920px){:root{--maxw:1680px}}

/* ---------- aloldal-csonk, morzsamenü, 404 ---------- */
.stub{min-height:86vh;display:flex;align-items:flex-end;padding-top:calc(var(--header-h) + 120px)}
.stub__h1{font-size:clamp(2.4rem,1.2rem + 4.6vw,6rem);max-width:16ch;margin:18px 0 24px}
.stub__lead{margin-bottom:32px;color:var(--fg-2)}
.crumbs{display:flex;gap:8px;flex-wrap:wrap;color:var(--fg-2)}
@media (hover:hover){.crumbs a:hover{color:var(--fg)}}
.lost{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding-top:calc(var(--header-h) + clamp(20px,6svh,64px));padding-bottom:clamp(32px,6svh,96px);overflow:hidden}
.lost__field{position:absolute;inset:0;z-index:0}
.lost__in{position:relative;z-index:1;display:grid;gap:clamp(10px,2.4svh,22px);justify-items:start}
.lost__code{color:var(--c-text-2-dark);opacity:.82}
.lost__h1{font-size:min(clamp(2.6rem,1.2rem + 5.4vw,7rem),11svh);max-width:12ch}
@media (min-width:900px) and (max-height:760px){.lost__links{margin:0;gap:6px}.lost__lead{font-size:1.05rem}}
.lost__lead{color:var(--c-text-2-dark);max-width:50ch}
.lost__links{list-style:none;padding:0;margin:8px 0;display:grid;gap:10px}
.lost__micro{max-width:52ch}
.lost__cal{margin-top:24px}
.lost__cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,40px));gap:6px}
.lost__cal-grid i{height:40px;border-radius:6px;border:1px solid var(--line);display:grid;place-items:center}
.lost__cal-grid .is-set{background:var(--c-fog);color:var(--c-ink);border-color:transparent}
.lost__cal-grid .is-set b{font-size:.6rem}
.lost__cal-grid .is-empty{border:1.5px dashed var(--c-lime)}