/* =====================================================================
   PÉNZÜGYES · LIQUID GLASS  (látványterv, 2026-09-30)
   Közös rendszer: tokenek, üveg, nav, gombok, holdív, lábléc, blob-kártyák.
   Minden osztály gl- előtagú (kivéve a rövid .lg üveget), hogy a régi
   styles.css / components.css osztályaival ne ütközzön.
   ===================================================================== */

@font-face { font-family:'ResistSansDisplay'; src:url('/fonts/ResistSansDisplay-Light.otf') format('opentype'); font-weight:300; font-display:swap; }
@font-face { font-family:'ResistSansDisplay'; src:url('/fonts/ResistSansDisplay-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'ResistSansDisplay'; src:url('/fonts/ResistSansDisplay-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }
@font-face { font-family:'ResistSansText'; src:url('/fonts/ResistSansText-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'ResistSansText'; src:url('/fonts/ResistSansText-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }

/* ============ TOKENEK ============ */
:root {
  --gl-night: #030604;          /* az éjszaka: fekete, épp csak zöldre hangolva */
  --gl-night-2: #070d09;
  --gl-lime: #c6ff3d;           /* a márka-neon: fényként és felületként */
  --gl-lime-soft: #e4ffa6;
  --gl-aqua: #3cf2c8;           /* hűvös ellenpont */
  --gl-amber: #ffab3d;          /* a check-in narancsának szelídebb rokona */
  --gl-ink: #f2f6ee;
  --gl-ink-2: rgba(232, 242, 226, .64);
  --gl-ink-3: rgba(232, 242, 226, .42);
  --gl-hair: rgba(255, 255, 255, .08);
  --gl-fill: rgba(255, 255, 255, .045);
  --gl-display: 'ResistSansDisplay', 'SF Pro Display', Inter, system-ui, sans-serif;
  --gl-text: 'ResistSansText', 'SF Pro Text', Inter, system-ui, sans-serif;
  --gl-u: clamp(1100px, 100vw, 1760px);   /* a holdív-geometria egysége */
  --gl-nav-h: 84px;
  --gl-ease: cubic-bezier(.22, 1, .36, 1);
  --gl-spring: cubic-bezier(.34, 1.36, .5, 1);
}

html { background: var(--gl-night); overflow-x: clip; scroll-padding-top: var(--gl-nav-h); }
body.gl { margin: 0; }
body.gl {
  background: var(--gl-night);
  color: var(--gl-ink);
  font-family: var(--gl-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
body.gl ::selection { background: rgba(198,255,61,.85); color: #0b1409; }

/* ============ LIQUID GLASS ============
   Áttetsző kitöltés + elmosott háttér + fényperem (gradiens-keret maszkkal)
   + belső csúcsfény. Chromiumban a glass.js ráadja a valódi fénytörést
   (SVG-displacement a backdrop-filteren): a perem meghajlítja a hátteret. */
:where(.lg) { position: relative; }   /* nulla specificitás: a régi sticky/absolute pozíció nyer */
.lg {
  isolation: isolate;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.02) 55%, rgba(255,255,255,.045));
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  backdrop-filter: blur(18px) saturate(170%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -1px 0 rgba(255,255,255,.05),
    inset 0 0 22px rgba(255,255,255,.03),
    0 18px 40px -18px rgba(0,0,0,.7);
}
.lg::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  width: auto; height: auto; margin: 0; transform: none; display: block; opacity: 1;
  background: linear-gradient(135deg,
    rgba(255,255,255,.55) 0%, rgba(255,255,255,.10) 22%,
    rgba(255,255,255,0) 45%, rgba(255,255,255,0) 60%,
    rgba(214,255,140,.22) 82%, rgba(255,255,255,.42) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events: none; z-index: 2;
}
.lg::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  width: auto; height: auto; margin: 0; transform: none; display: block; opacity: 1;
  background: radial-gradient(90% 55% at 50% -8%, rgba(255,255,255,.085), transparent 70%);
  pointer-events: none; z-index: 1;
}
:where(.lg) > :where(*) { position: relative; z-index: 3; }

/* ============ TIPOGRÁFIA ============ */
.gl-h1 {
  font-family: var(--gl-display); font-weight: 400;
  font-size: clamp(40px, 4.3vw, 76px); line-height: 1.04; letter-spacing: -.038em;
  color: var(--gl-ink); text-wrap: balance; margin: 0;
}
.gl-h2 {
  font-family: var(--gl-display); font-weight: 400;
  font-size: clamp(34px, 4.2vw, 62px); line-height: 1.05; letter-spacing: -.036em;
  color: var(--gl-ink); text-wrap: balance; margin: 0;
}
.gl-h1 .dim, .gl-h2 .dim { color: rgba(242,246,238,.38); }
.gl-lead { margin: 20px auto 0; max-width: 540px; color: var(--gl-ink-2); font-size: 15.5px; line-height: 1.55; text-wrap: pretty; }
.gl-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font: 500 12px/1 var(--gl-text); letter-spacing: .14em; text-transform: uppercase;
  color: var(--gl-ink-3); margin-bottom: 22px;
}
.gl-eyebrow::before {
  content: ""; width: 7px; height: 7px; border-radius: 2px; background: var(--gl-lime);
  box-shadow: 0 0 12px rgba(198,255,61,.8);
}
.gl-head { text-align: center; max-width: 880px; margin: 0 auto 64px; }
.gl-wrap { width: min(1180px, 100% - 40px); margin: 0 auto; }
.gl-sec { position: relative; padding: 150px 0 0; scroll-margin-top: 20px; }


/* ============ GOMBOK ============ */
.gl-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: 500 13.5px/1 var(--gl-text); padding: 14px 20px; border-radius: 999px;
  color: var(--gl-ink); white-space: nowrap; text-decoration: none; border: 0; cursor: pointer;
  transition: transform .35s var(--gl-spring), box-shadow .3s, background .3s;
}
.gl-btn:hover { transform: translateY(-1px); }
.gl-btn:active { transform: scale(.97); }
.gl-btn.solid {
  background: #f4f8f0; color: #0b1409;
  box-shadow: inset 0 1px 0 #fff, 0 10px 30px -10px rgba(198,255,61,.6);
}
.gl-btn.lime {
  background: var(--gl-lime); color: #0b1409;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 12px 34px -10px rgba(198,255,61,.75);
}
.gl-btn .n { color: var(--gl-lime); font-feature-settings: "tnum"; }
.gl-btn svg { width: 17px; height: 17px; flex: none; }

/* ============ NAV ============ */
.gl-nav {
  position: fixed; top: 18px; left: 0; right: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(16px, 4.2vw, 64px);
  pointer-events: none;
}
.gl-nav > * { pointer-events: auto; }
.gl-brand {
  display: inline-flex; align-items: center; gap: 10px;
  height: 44px; padding: 0 16px 0 5px; border-radius: 999px;
  font: 500 14px/1 var(--gl-display); letter-spacing: -.01em; color: var(--gl-ink); text-decoration: none;
}
.gl-brand .gl-disc {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: #f4f8f0; box-shadow: inset 0 1px 0 #fff, 0 6px 18px -6px rgba(198,255,61,.55);
}
.gl-mark {
  display: block; width: 14px; height: 15px; background: currentColor;
  -webkit-mask: url('/assets/logo-mark-full.png') center / contain no-repeat;
          mask: url('/assets/logo-mark-full.png') center / contain no-repeat;
}
.gl-brand .gl-mark { color: #06110b; }
.gl-links {
  position: absolute; left: 50%; transform: translateX(-50%);
  display: flex; gap: 2px; padding: 5px; border-radius: 999px;
}
.gl-links a {
  position: relative; z-index: 4;
  font: 500 13px/1 var(--gl-text); letter-spacing: .005em;
  padding: 11px 15px; border-radius: 999px; color: var(--gl-ink-2); text-decoration: none;
  transition: color .35s var(--gl-ease);
  display: inline-flex; align-items: center; gap: 6px;
}
.gl-links a:hover { color: var(--gl-ink); }
.gl-links a.is-on { color: #0b1409; }
.gl-links a .n { font-size: 11px; color: var(--gl-lime); font-feature-settings: "tnum"; transition: color .35s; }
.gl-links a.is-on .n { color: #3c7500; }
/* a csúszó jelző: fehér csepp, mozgás közben megnyúlik (glass.js) */
.gl-ind, .gl-hov {
  position: absolute; top: 5px; left: 0; height: calc(100% - 10px); width: 0;
  border-radius: 999px; pointer-events: none;
}
.gl-ind {
  z-index: 3; background: #f4f8f0; opacity: 0;
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 6px rgba(0,0,0,.08), 0 8px 22px -8px rgba(198,255,61,.7);
  transition: opacity .35s var(--gl-ease);
}
.gl-ind.is-on { opacity: 1; }
.gl-hov {
  z-index: 2; background: rgba(255,255,255,.07); opacity: 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
  transition: opacity .25s, transform .45s var(--gl-spring), width .45s var(--gl-spring);
}
.gl-links:hover .gl-hov.is-on { opacity: 1; }
.gl-nav-cta { display: flex; gap: 8px; align-items: center; }
.gl-menu-btn {
  display: none; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
  color: var(--gl-ink); place-items: center; padding: 0;
}
.gl-menu-btn i, .gl-menu-btn i::before, .gl-menu-btn i::after {
  display: block; width: 16px; height: 1.6px; background: currentColor; border-radius: 2px;
  transition: transform .4s var(--gl-spring), opacity .2s;
}
.gl-menu-btn i { position: relative; }
.gl-menu-btn i::before, .gl-menu-btn i::after { content: ""; position: absolute; left: 0; }
.gl-menu-btn i::before { top: -5px; } .gl-menu-btn i::after { top: 5px; }
.gl-nav.is-open .gl-menu-btn i { background: transparent; }
.gl-nav.is-open .gl-menu-btn i::before { transform: translateY(5px) rotate(45deg); }
.gl-nav.is-open .gl-menu-btn i::after { transform: translateY(-5px) rotate(-45deg); }
.gl-sheet {
  position: fixed; top: 74px; left: 12px; right: 12px; z-index: 999;
  border-radius: 28px; padding: 10px; display: grid;
  opacity: 0; transform: translateY(-10px) scale(.97); transform-origin: top right;
  pointer-events: none; transition: opacity .3s var(--gl-ease), transform .45s var(--gl-spring);
}
.gl-nav.is-open + .gl-sheet { opacity: 1; transform: none; pointer-events: auto; }
.gl-sheet a {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 18px; border-radius: 18px; color: var(--gl-ink); text-decoration: none;
  font: 400 19px/1 var(--gl-display); letter-spacing: -.02em;
}
.gl-sheet a + a { border-top: 1px solid var(--gl-hair); }
.gl-sheet a.is-on { color: var(--gl-lime); }
.gl-sheet a .n { font: 500 12px/1 var(--gl-text); color: var(--gl-lime); }
.gl-sheet .gl-btn { margin-top: 8px; padding: 17px; font: 500 15px/1 var(--gl-text); letter-spacing: 0; justify-content: center; }
@media (max-width: 1100px) {
  .gl-links { display: none; }
  .gl-menu-btn { display: grid; }
  .gl-nav-cta .gl-btn:not(.solid) { display: none; }
}
@media (min-width: 1101px) { .gl-sheet { display: none; } }
@media (max-width: 420px) { .gl-brand .gl-word { display: none; } .gl-brand { padding-right: 5px; } }

/* ============ HOLDÍV (napfogyatkozás-perem) ============ */
.gl-arc {
  position: absolute; left: 50%; aspect-ratio: 1; border-radius: 50%;
  transform: translateX(-50%); pointer-events: none;
}
.gl-arc.rim-down {           /* felülről lelógó hold: a perem alul izzik */
  box-shadow:
    inset 0 0 2px rgba(255,255,255,.6),
    inset 0 -3px 2px rgba(255,255,255,1),
    inset 0 -12px 16px rgba(240,255,205,.9),
    inset 0 -34px 50px rgba(198,255,61,.72),
    inset 0 -110px 150px rgba(140,230,60,.34),
    inset 0 0 40px rgba(198,255,61,.30),
    0 3px 10px rgba(240,255,200,.85),
    0 18px 50px rgba(198,255,61,.60),
    0 60px 160px rgba(120,220,50,.40);
}
.gl-arc.rim-up {             /* alulról felkelő hold: a perem felül izzik */
  box-shadow:
    inset 0 0 2px rgba(255,255,255,.55),
    inset 0 3px 2px rgba(255,255,255,.95),
    inset 0 10px 12px rgba(238,255,200,.8),
    inset 0 28px 44px rgba(198,255,61,.55),
    inset 0 90px 120px rgba(140,230,60,.22),
    0 -3px 8px rgba(236,255,190,.75),
    0 -16px 44px rgba(198,255,61,.55),
    0 -50px 150px rgba(120,220,50,.35);
}
.gl-grain {
  position: absolute; inset: 0; pointer-events: none; opacity: .08; mix-blend-mode: overlay;
  -webkit-mask: linear-gradient(180deg, #000 55%, transparent); mask: linear-gradient(180deg, #000 55%, transparent);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* aloldali horizont: a lap-hero alatt egy lapos, izzó kettős ív.
   A sáv a folyamban van, így sosem metszi a címet. */
/* mindig kifut a teljes képernyőszélességre, akármilyen keskeny dobozban ül (blog-hasáb, wrap) */
.gl-horizon { position: relative; pointer-events: none; z-index: 0; overflow-x: clip;
  width: 100vw; left: 50%; margin-left: -50vw; height: 168px; }
.gl-horizon .gl-arc { width: calc(var(--gl-u) * 2.5); background: transparent; }
.gl-horizon .gl-arc.h1 { top: calc(86px - var(--gl-u) * 2.5); opacity: .88; }
.gl-horizon .gl-arc.h2 { top: calc(122px - var(--gl-u) * 2.5); opacity: .62; }
.gl-horizon::after {
  content: ""; position: absolute; left: 50%; top: 24px; width: min(900px, 90vw); height: 170px;
  transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%, rgba(160,235,60,.15), transparent 70%);
}
.gl-horizon.is-tight { height: 170px; }

/* oldal-ég: halvány fény a lap tetején, a nav mögött */
.gl-sky {
  position: absolute; left: 0; right: 0; top: 0; height: 700px; pointer-events: none; z-index: 0;
  background:
    radial-gradient(60% 55% at 50% -12%, rgba(150,230,60,.16), transparent 70%),
    radial-gradient(30% 40% at 12% 0%, rgba(60,242,200,.06), transparent 70%);
}

/* ============ BLOB-KÁRTYÁK ============
   A folt a kártya MÖGÖTT él, az üveg törve és elmosva látja. */
.gl-bcard { position: relative; isolation: isolate; }
.gl-blob {
  position: absolute; z-index: 0; pointer-events: none;
  width: 62%; aspect-ratio: 1.1;
  background: radial-gradient(circle at 40% 40%, var(--c1, var(--gl-lime)), rgba(0,0,0,0) 68%);
  border-radius: 42% 58% 63% 37% / 45% 40% 60% 55%;
  filter: blur(26px); opacity: .78;
  animation: gl-morph 16s ease-in-out infinite alternate;
}
.gl-blob.b2 { animation-duration: 21s; animation-direction: alternate-reverse; opacity: .5; width: 44%; }
@keyframes gl-morph {
  0%   { border-radius: 42% 58% 63% 37% / 45% 40% 60% 55%; transform: translate(0,0) rotate(0deg) scale(1); }
  50%  { border-radius: 60% 40% 38% 62% / 55% 62% 38% 45%; transform: translate(8%, -6%) rotate(40deg) scale(1.08); }
  100% { border-radius: 38% 62% 50% 50% / 38% 50% 50% 62%; transform: translate(-6%, 5%) rotate(-20deg) scale(.95); }
}
.gl-card {
  position: relative; z-index: 1; height: 100%;
  border-radius: 34px; padding: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.015) 50%, rgba(255,255,255,.035));
}
.gl-label { font: 500 12.5px/1.2 var(--gl-text); letter-spacing: .12em; text-transform: uppercase; color: var(--gl-ink-2); }
.gl-num { font-family: var(--gl-display); font-weight: 300; line-height: 1; letter-spacing: -.04em; font-feature-settings: "tnum"; }
.gl-num small { font-size: .4em; color: var(--gl-ink-3); letter-spacing: -.01em; margin-left: 5px; font-weight: 400; }

/* ============ LÁBLÉC: felkelő hold ============ */
.gl-footer { position: relative; height: 700px; margin-top: 80px; z-index: 1; }
/* az ív saját rétegben: 220px-rel a lábléc fölé nyúlik (ott izzik), alul és oldalt vág,
   így nem nyújtja meg a görgethető területet */
.gl-footer-sky { position: absolute; left: 0; right: 0; top: -220px; bottom: 0; overflow: hidden; pointer-events: none; }
.gl-footer .gl-arc.rim-up {
  width: calc(var(--gl-u) * 1.04);
  top: 330px;
  background: radial-gradient(circle at 50% 50%, #020503 60%, #06150a 84%, #133010 97%);
}
.gl-footer-in {
  position: relative; z-index: 3; width: min(820px, 100% - 40px); margin: 0 auto; padding-top: 200px;
  display: flex; flex-direction: column; align-items: center; text-align: center;
}
.gl-footer-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--gl-ink); text-decoration: none; font: 400 22px/1 var(--gl-display); letter-spacing: -.02em; }
.gl-footer-brand .gl-mark { width: 18px; height: 19px; color: var(--gl-lime); }
.gl-footer-tag { margin-top: 12px; font-size: 13.5px; color: var(--gl-ink-3); }
.gl-footer-cols { margin-top: 44px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 56px; text-align: left; }
.gl-footer-cols h5 { font: 500 11.5px/1 var(--gl-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gl-ink-3); margin: 0 0 16px; }
.gl-footer-cols a { display: block; font-size: 13.5px; color: var(--gl-ink-2); text-decoration: none; padding: 5px 0; transition: color .2s; }
.gl-footer-cols a:hover { color: var(--gl-ink); }
.gl-social { display: flex; gap: 10px; justify-content: center; margin-top: 36px; }
.gl-social a { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; color: var(--gl-ink-2); transition: color .25s, transform .4s var(--gl-spring); }
.gl-social a:hover { color: var(--gl-lime); transform: translateY(-2px); }
.gl-social svg { width: 18px; height: 18px; }
.gl-footer-bottom { margin-top: 26px; display: flex; gap: 22px; justify-content: center; flex-wrap: wrap; font-size: 12px; color: var(--gl-ink-3); }
@media (max-width: 640px) {
  .gl-footer { height: 830px; }
  .gl-footer-in { padding-top: 170px; }
  .gl-footer-cols { grid-template-columns: repeat(2, 1fr); gap: 22px 40px; }
  .gl-sec { padding-top: 110px; }
  .gl-head { margin-bottom: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .gl-blob { animation: none; }
  html { scroll-behavior: auto; }
}

/* ============ BOLT-GOMBOK (üveg App Store / Google Play) ============
   A hivatalos fekete jelvény-képek helyett: ikon + kétsoros felirat üvegen. */
.gl-stores { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.gl-store {
  display: inline-flex; align-items: center; gap: 12px;
  height: 60px; min-width: 212px; padding: 0 24px 0 18px; border-radius: 19px;
  color: var(--gl-ink); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: transform .45s var(--gl-spring), box-shadow .35s;
}
.gl-store svg { width: 26px; height: 26px; flex: none; filter: drop-shadow(0 0 10px rgba(255,255,255,.25)); }
.gl-store-t { display: flex; flex-direction: column; align-items: flex-start; line-height: 1; }
.gl-store-t small { font: 400 11px/1 var(--gl-text); letter-spacing: .02em; color: var(--gl-ink-2); }
.gl-store-t b { font: 400 20px/1 var(--gl-display); letter-spacing: -.02em; margin-top: 4px; color: var(--gl-ink); }
.gl-store.lg {
  background:
    radial-gradient(80% 60% at 50% 120%, rgba(198,255,61,.22), transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.03) 55%, rgba(255,255,255,.06));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34), inset 0 -1px 0 rgba(255,255,255,.06),
    inset 0 -10px 22px -12px rgba(198,255,61,.5),
    0 16px 40px -18px rgba(198,255,61,.55), 0 18px 40px -18px rgba(0,0,0,.7);
}
a.gl-store:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -12px 26px -12px rgba(198,255,61,.7), 0 22px 50px -18px rgba(198,255,61,.75), 0 18px 40px -18px rgba(0,0,0,.7); }
a.gl-store:active { transform: scale(.97); }
.gl-store.is-soon { cursor: default; }
.gl-store.is-soon.lg { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02) 55%, rgba(255,255,255,.04)); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 18px 40px -18px rgba(0,0,0,.7); }
.gl-store.is-soon svg, .gl-store.is-soon .gl-store-t b { opacity: .62; }
@media (max-width: 420px) {
  .gl-store { height: 56px; padding: 0 18px 0 15px; gap: 10px; }
  .gl-store-t b { font-size: 18px; }
  }

/* ============ BEÚSZÓ ANIMÁCIÓ ============
   gl-anim: a <head> inline szkriptje teszi fel (reduced-motion esetén nem).
   Első festéstől rejtve, amíg a glass.js szerepet nem oszt (gl-ready). */
html.gl-anim:not(.gl-ready) body.gl-home :is(.gl-head > *, .hero .gl-h1, .hero-sub, .hero-foot, .kasszak > .gl-bcard, .bento > .gl-bcard, .sim, .coach, .tudas > .gl-bcard, .phone-stage, .kalk > a, .center-cta, .steps > .step, .gl-stores, .orb-stage),
html.gl-anim:not(.gl-ready) body.gl:not(.gl-home) :is(.reveal, .reveal-stagger > *, main .lg, section .lg, article .lg, main h1, main h2, section h1, section h2, article h2, header:not(.gl-nav) :is(h1, h2, p), .gl-head > *) { opacity: 0; }

/* a régi reveal-rendszer kikapcsolva: az új vezérel mindent */
body.gl .reveal, body.gl .reveal-stagger > * { opacity: 1; transform: none; transition: none; }

/* szöveg: finom emelkedés, életlenből élesre */
html.gl-anim .gl-rv-txt:not(.is-in) { opacity: 0; transform: translate3d(0, 18px, 0); filter: blur(8px); }
html.gl-anim .gl-rv-txt.is-in { opacity: 1; transform: none; filter: blur(0);
  transition: opacity .9s var(--gl-ease) var(--d, 0ms), transform 1.1s var(--gl-ease) var(--d, 0ms), filter .9s var(--gl-ease) var(--d, 0ms); }
/* kártya, panel: lágy emelkedés, kicsit kisebből */
html.gl-anim .gl-rv-box:not(.is-in) { opacity: 0; transform: translate3d(0, 40px, 0) scale(.97); }
html.gl-anim .gl-rv-box.is-in { opacity: 1; transform: none;
  transition: opacity 1s var(--gl-ease) var(--d, 0ms), transform 1.3s cubic-bezier(.16, 1, .3, 1) var(--d, 0ms); }
/* cím: soronként, maszk mögül úszik fel */
.gl-ln { display: block; overflow: hidden; padding-bottom: .14em; margin-bottom: -.14em; }
.gl-ln > span { display: block; }
html.gl-anim .gl-rv-lines:not(.is-in) .gl-ln > span { transform: translate3d(0, 110%, 0); }
html.gl-anim .gl-rv-lines.is-in .gl-ln > span { transform: none;
  transition: transform 1.25s cubic-bezier(.16, 1, .3, 1) calc(var(--d, 0ms) + var(--li, 0) * 110ms); }
/* a hero üveggömbje a holdívekkel együtt dereng elő */
html.gl-anim .orb-stage.gl-rv-box:not(.is-in) { transform: translate3d(0, 28px, 0) scale(.94); }
html.gl-anim .orb-stage.gl-rv-box.is-in { transition: opacity 1.6s var(--gl-ease) var(--d, 0ms), transform 1.8s cubic-bezier(.16, 1, .3, 1) var(--d, 0ms); }
/* üveget tartalmazó egység: maga csak emelkedik, a halványítás a levelein fut (nincs backdrop-gyökér-váltás) */
html.gl-anim .gl-rv-lift:not(.is-in) { transform: translate3d(0, 40px, 0) scale(.97); }
html.gl-anim .gl-rv-lift.is-in { transform: none; transition: transform 1.3s cubic-bezier(.16, 1, .3, 1) var(--d, 0ms); }
html.gl-anim .gl-rv-lift:not(.is-in) .gl-rv-fade { opacity: 0 !important; }
html.gl-anim .gl-rv-lift.is-in .gl-rv-fade { transition: opacity 1s var(--gl-ease) var(--d, 0ms); }
html.gl-anim .gl-rv-lift.orb-stage:not(.is-in) { transform: translate3d(0, 28px, 0) scale(.94); }
html.gl-anim .gl-rv-lift.orb-stage.is-in { transition: transform 1.8s cubic-bezier(.16, 1, .3, 1) var(--d, 0ms); }
html.gl-anim .gl-rv-lift.orb-stage.is-in .gl-rv-fade { transition: opacity 1.6s var(--gl-ease) var(--d, 0ms); }
html.gl-anim .gl-rv-lift.is-done, html.gl-anim .gl-rv-lift.is-done .gl-rv-fade { transition: none; }
/* vége: semmi ne maradjon a backdrop-filter útjában */
html.gl-anim .gl-rv.is-done { transition: none; filter: none; }
@media (max-width: 640px) { html.gl-anim .gl-rv-lift:not(.is-in) { transform: translate3d(0, 26px, 0) scale(.98); } }
@media (max-width: 640px) {
  html.gl-anim .gl-rv-box:not(.is-in) { transform: translate3d(0, 26px, 0) scale(.98); }
  html.gl-anim .gl-rv-txt:not(.is-in) { filter: blur(5px); }
}

/* közösségi ikonok: a social.css (pu-social-link) kerete és kitöltése helyett üveg */
.gl-social .pu-social-link { border: 0; background: transparent; width: 42px; height: 42px; color: var(--gl-ink-2); }
.gl-social .pu-social-link:hover, .gl-social .pu-social-link:focus-visible { background: rgba(198,255,61,.12); color: var(--gl-lime); border: 0; outline: none; }
.gl-social .pu-social-link svg { fill: currentColor; }
.gl-social .pu-social-link svg.stroke { fill: none; }

/* ============ NAV-NYITÁS ============ (a glass.js nyitja ki középről; addig rejtve, villanás nélkül) */
html.gl-anim .gl-nav:not(.gl-open) > * { opacity: 0; }

/* ============ SÜTI-BANNER + KILÉPÉSI ABLAK (minden oldalon, a főoldalon is) ============ */
/* ---------- süti-banner (pu-consent.js): sötét üveg, jobb alsó sarokban ---------- */
body.gl .pu-cbar {
  left: auto; right: 20px; bottom: 20px; max-width: 470px; border: 0; border-radius: 26px; padding: 22px 24px 20px;
  color: var(--gl-ink); font-family: var(--gl-text);
  background: radial-gradient(80% 70% at 100% 0%, rgba(198,255,61,.12), transparent 70%), linear-gradient(180deg, rgba(22,30,24,.82), rgba(8,13,10,.88));
  -webkit-backdrop-filter: blur(22px) saturate(170%); backdrop-filter: blur(22px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 0 0 1px rgba(255,255,255,.08), 0 30px 70px -20px rgba(0,0,0,.85), 0 0 50px -16px rgba(198,255,61,.3);
}
body.gl .pu-cbar h2 { font: 400 19px/1.2 var(--gl-display); letter-spacing: -.02em; color: var(--gl-ink); }
body.gl .pu-cbar p { color: var(--gl-ink-2); font-size: 13.5px; line-height: 1.55; }
body.gl .pu-cbar a { color: var(--gl-lime); }
body.gl .pu-cbar button { font: 500 13.5px/1 var(--gl-text); border: 0; padding: 13px 20px; }
body.gl .pu-cbar .pu-cb-ok { background: #f4f8f0; color: #0b1409; box-shadow: inset 0 1px 0 #fff, 0 10px 26px -10px rgba(198,255,61,.65); }
body.gl .pu-cbar .pu-cb-ok:hover { background: #fff; }
body.gl .pu-cbar .pu-cb-nem { background: rgba(255,255,255,.06); color: var(--gl-ink); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
@media (max-width: 560px) { body.gl .pu-cbar { left: 10px; right: 10px; bottom: 10px; max-width: none; } }

/* ---------- kilépési ablak (pu-exitpopup.js): sötét üvegkártya ---------- */
body.gl .puxp-overlay { background: rgba(2,5,3,.62); -webkit-backdrop-filter: blur(10px) saturate(140%); backdrop-filter: blur(10px) saturate(140%); }
body.gl .puxp-card {
  color: var(--gl-ink); font-family: var(--gl-text); border-radius: 34px; padding: 36px 34px 30px;
  background: radial-gradient(70% 55% at 88% 0%, rgba(198,255,61,.17), transparent 70%), radial-gradient(60% 50% at 0% 100%, rgba(60,242,200,.10), transparent 70%), linear-gradient(180deg, rgba(22,30,24,.94), rgba(7,12,9,.96));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), inset 0 0 0 1px rgba(255,255,255,.08), 0 40px 100px -20px rgba(0,0,0,.85), 0 0 70px -22px rgba(198,255,61,.4);
}
body.gl .puxp-close { background: rgba(255,255,255,.06); color: var(--gl-ink); border: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
body.gl .puxp-close:hover { background: rgba(255,255,255,.12); }
body.gl .puxp-kicker { background: none; border: 0; padding: 0; color: var(--gl-ink-3); font-weight: 500; letter-spacing: .14em; }
body.gl .puxp-kicker::before { border-radius: 2px; box-shadow: 0 0 12px rgba(198,255,61,.8); }
body.gl .puxp-title { font-family: var(--gl-display); font-weight: 400; letter-spacing: -.036em; color: var(--gl-ink); }
body.gl .puxp-title .puxp-hl { color: var(--gl-lime); text-shadow: 0 0 28px rgba(198,255,61,.4); }
body.gl .puxp-lead { color: var(--gl-ink-2); }
body.gl .puxp-lead strong { color: var(--gl-ink); }
body.gl .puxp-steps { border: 0; border-radius: 20px; background: rgba(255,255,255,.045); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
body.gl .puxp-stepslabel { color: var(--gl-ink-3); font-weight: 500; letter-spacing: .14em; }
body.gl .puxp-steps li { color: var(--gl-ink); font-weight: 400; }
body.gl .puxp-stepnum { background: var(--gl-lime); color: #0b1409; font-weight: 500; box-shadow: 0 0 12px rgba(198,255,61,.5); }
body.gl .puxp-store { gap: 10px; }
body.gl .puxp-store .gl-store { display: inline-flex; align-items: center; gap: 10px; height: 54px; min-width: 0; padding: 0 18px 0 14px; line-height: 1; border-radius: 17px; }
body.gl .puxp-store .gl-store svg { width: 22px; height: 22px; }
body.gl .puxp-store .gl-store-t b { font-size: 17px; }
body.gl .puxp-qr { background: rgba(255,255,255,.045); border: 0; border-radius: 22px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
body.gl .puxp-qr img { background: #fff; border-radius: 12px; padding: 7px; box-sizing: border-box; }
body.gl .puxp-qr span { color: var(--gl-ink-3); }
body.gl .puxp-later { color: var(--gl-ink-3); }
body.gl .puxp-later:hover { color: var(--gl-ink); }
body.gl .puxp-fine { border-top: 1px solid var(--gl-hair); color: var(--gl-ink-3); }