/* ==========================================================================
   Lardor Catering – fő stíluslap (v3: grafit, INOX és liquid glass)
   A vizuális nyelv a teszt.html alapján: sötét grafit háttér mozgó ezüst
   fényekkel, áttetsző üvegfelületek, szálcsiszolt fém kiemelések.

   Teljesítmény: élő háttér-elmosás (backdrop-filter) csak a navbaron van.
   A kártyák „üvege” festett, áttetsző réteg + fémes keret, így görgetéskor
   nincs képkockánkénti újramosás. A végtelen animációk csak transform,
   opacity vagy (kis elemen) background-position tulajdonságot mozgatnak.
   ========================================================================== */

/* ---------- Betűk: saját tárhelyről (OFL), latin + latin-ext (ő, ű) ---------- */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-normal-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: "Cormorant Garamond"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-normal-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: "Cormorant Garamond"; font-style: italic; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-italic-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: "Cormorant Garamond"; font-style: italic; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-italic-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: "Jost"; font-style: normal; font-weight: 300 600; font-display: swap;
  src: url("../fonts/jost-normal-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: "Jost"; font-style: normal; font-weight: 300 600; font-display: swap;
  src: url("../fonts/jost-normal-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 {
  color-scheme: dark;

  /* Arculati színek (teszt.html) */
  --grafit: #141517;        /* alap háttér: mély, fekete grafit */
  --pala: #2a2d31;          /* emelt felület */
  --acel: #8e949c;          /* acél, másodlagos UI */
  --ezust: #d6dade;         /* folyó szöveg */
  --feny: #f5f7f9;          /* csúcsfény */
  --muted: #aab0b8;
  --error: #f3a59e;
  --ok: #a9d3b5;
  --silver: linear-gradient(110deg, #7d838c 0%, #e9ecef 22%, #a9aeb6 40%, #ffffff 55%, #9ba1a9 75%, #d6dade 100%);
  --silver-v: linear-gradient(180deg, #f4f6f8 0%, #cfd4da 50%, #a3a9b1 100%);
  /* fémes csúcsfény: sima, felülről érkező fény (csíkozás nélkül) */
  --brushed: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 48%, rgba(0,0,0,.06));
  --steel: linear-gradient(90deg, #2c3036 0%, #8e96a0 16%, #e6eaee 32%, #7d858f 50%, #3c434c 68%, #b4bac2 86%, #2c3036 100%);
  /* fémes keret: a kártyák szélén körbefutó ezüst átmenet */
  --rim: linear-gradient(160deg, rgba(255,255,255,.62), rgba(255,255,255,.16) 24%, rgba(255,255,255,.05) 58%, rgba(255,255,255,.3));

  /* Kompatibilitás a korábbi változónevekkel (inline stílusok is használják) */
  --graphite: var(--grafit);
  --inox: #c3c8ce;
  --inox-hi: #eef1f4;
  --porcelain: #e4e7ea;

  /* Üveg (festett, elmosás nélkül) */
  --glass-fill: radial-gradient(120% 70% at 0% 0%, rgba(255,255,255,.13), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.02) 60%), linear-gradient(180deg, rgba(24,26,29,.36), rgba(14,15,17,.5));
  --glass-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 1px 0 0 rgba(255,255,255,.1), inset 0 26px 36px -30px rgba(255,255,255,.38), inset 0 -22px 30px -28px rgba(255,255,255,.18), inset 0 -1px 0 rgba(0,0,0,.35), 0 30px 60px -30px rgba(0,0,0,.85);
  --blur: blur(18px) saturate(170%);

  /* Tipográfia */
  --serif: "Cormorant Garamond", "Times New Roman", serif;
  --sans: "Jost", "Helvetica Neue", Arial, sans-serif;

  --step--1: .875rem;
  --step-0: 1.0625rem;
  --step-1: 1.25rem;
  --step-2: clamp(1.55rem, 1.25rem + 1vw, 2rem);
  --step-3: clamp(2.2rem, 1.5rem + 2.6vw, 3.6rem);
  --step-4: clamp(2.8rem, 1.7rem + 4.6vw, 5.6rem);
  --step-5: clamp(3.2rem, 1.6rem + 7vw, 7.4rem);

  --gutter: clamp(18px, 4vw, 56px);
  --max: 1280px;
  --section: clamp(52px, 6.2vw, 94px);
  --r: 5px;
  --r-lg: 14px;
  --r-xl: 22px;
  --top: calc(env(safe-area-inset-top, 0px) + 14px);
  --ease: cubic-bezier(.2, .8, .2, 1);
}

/* --------------------------------------------------------------------------
   Alapok
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 110px; background: var(--grafit); }
body {
  margin: 0; min-height: 100vh;
  background: var(--grafit); color: var(--ezust);
  font-family: var(--sans); font-weight: 300; font-size: var(--step-0); line-height: 1.7;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
@supports (overflow: clip) { body { overflow-x: clip; } }
img, svg, picture { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .22em; }
p { margin: 0 0 1em; max-width: 64ch; }
h1, h2, h3, h4 { margin: 0; font-weight: 500; }
h1, h2 { font-family: var(--serif); letter-spacing: -.01em; line-height: 1.02; }
h3 { font-family: var(--serif); font-size: var(--step-2); font-weight: 500; line-height: 1.15; color: var(--feny); }
ul, ol { margin: 0; padding: 0; }
strong, b { font-weight: 500; }
/* kijelölés: áttetsző ezüst fátyol, a szöveg világos marad, alatta vékony ezüst vonal
   (a böngészők a kijelölésre valódi keretet nem engednek, ez a legközelebbi) */
::selection { background: rgba(214,218,222,.24); color: #fff; text-shadow: none;
  text-decoration: underline 1px rgba(233,236,239,.85); text-underline-offset: 3px; }
:focus-visible { outline: 1px solid var(--feny); outline-offset: 4px; border-radius: var(--r); }
main { position: relative; z-index: 1; display: block; }

/* ezüst, szálcsiszolt szövegkitöltés a címekre */
h1, h2 {
  background: var(--silver); background-size: 220% 100%; background-position: 25% 0;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  /* a kitöltés csak a doboz széléig ér: alul-felül tartalék, hogy az ékezet és az alányúló szár is ezüst legyen */
  padding-block: .06em .16em;
}
/* fémes léc a szekciócímek alatt, lassan átfutó fénnyel */
.section-head h2::after, .split__head h2::after, .feature__body h2::after {
  content: ""; display: block; width: 72px; height: 2px; margin-top: 22px; border-radius: 2px;
  background: var(--steel); background-size: 300% 100%; animation: sheen 6s linear infinite;
  box-shadow: 0 0 12px rgba(255,255,255,.18);
}
@keyframes sheen { from { background-position: 100% 0; } to { background-position: -200% 0; } }

.visually-hidden { 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: absolute; left: 16px; top: -100px; z-index: 200; background: var(--feny); color: var(--grafit); padding: 10px 16px; border-radius: var(--r); }
.skip-link:focus { top: 12px; }
.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); position: relative; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 12px; margin: 0 0 18px;
  font-size: .78rem; font-weight: 400; letter-spacing: .32em; text-transform: uppercase; color: var(--acel);
}
.eyebrow::before { content: ""; width: 40px; height: 1px; background: var(--steel); background-size: 300% 100%; animation: sheen 5s linear infinite; }

/* --------------------------------------------------------------------------
/* --------------------------------------------------------------------------
   Háttér: lassan hömpölygő ezüst „folyékony fém” selyemszalagok
   (assets/js/bg.js, WebGL, csökkentett felbontáson → lágy, életlen hatás).
   WebGL nélkül a sötét grafit alap + vándorló fénycsík marad.
   -------------------------------------------------------------------------- */
.bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; contain: strict; pointer-events: none;
  background: radial-gradient(1100px 700px at 80% 10%, rgba(255,255,255,.06), transparent 60%), linear-gradient(180deg, #111214, #0a0b0c); }
.bg__gl { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 2s ease; }
.has-gl .bg__gl { opacity: 1; }
.has-gl .bg__sheen { display: none; }
/* lassan vándorló, széles fényvisszaverődés (mint egy polírozott lemezen) */
.bg__sheen { position: absolute; inset: -20%; opacity: .5; will-change: transform;
  background: linear-gradient(115deg, transparent 38%, rgba(255,255,255,.035) 46%, rgba(255,255,255,.07) 50%, rgba(255,255,255,.035) 54%, transparent 62%);
  animation: sheen-drift 26s ease-in-out infinite alternate; }
@keyframes sheen-drift { from { transform: translate3d(-18%, 0, 0); } to { transform: translate3d(18%, 0, 0); } }
/* finom filmszemcse: statikus SVG-zaj, nem csík */
.bg__grain { position: absolute; inset: 0; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.bg__vignette { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(0,0,0,.55)); }
@keyframes spin { to { transform: rotate(360deg); } }
.paused *, .paused *::before, .paused *::after { animation-play-state: paused !important; }

/* --------------------------------------------------------------------------
   Üveg + fémes keret
   A keret a padding-box / border-box trükkel készül, így lekerekített sarkon
   is ezüst átmenet fut körbe, külön réteg és maszk nélkül.
   -------------------------------------------------------------------------- */
.glass {
  position: relative;
  border: 1px solid transparent;
  background: var(--glass-fill) padding-box, var(--rim) border-box;
  box-shadow: var(--glass-shadow);
}
.glass--blur { -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  background: linear-gradient(140deg, rgba(255,255,255,.15), rgba(255,255,255,.05) 45%, rgba(255,255,255,.1)) padding-box, var(--rim) border-box; }
/* valódi háttér-elmosás csak a fotók feletti néhány nagy panelen */
.page-hero__card, .hero__stats, .photo-band__quote, .closing__card, .crumbs ol, .feature__body, .quote-card, .quote-aside { -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%); }
/* egérkövető csúcsfény (csak finom mutatón kapcsolja be a JS) */
.lit { isolation: isolate; }
.lit::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1; opacity: 0; transition: opacity .4s;
  background: radial-gradient(circle 170px at var(--mx, 30%) var(--my, 0%), rgba(255,255,255,.09), transparent 72%); }
.lit:hover::before { opacity: 1; }
/* --------------------------------------------------------------------------
   Gombok és linkek
   -------------------------------------------------------------------------- */
.cta, .btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  min-height: 54px; padding: 0 32px; border: 0; border-radius: 999px; cursor: pointer; isolation: isolate;
  font: 500 .95rem/1 var(--sans); letter-spacing: .05em; color: #17181a; text-decoration: none; white-space: nowrap;
  background: var(--brushed), var(--silver); background-size: auto, 220% 100%; background-position: 0 0, 0 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -2px 6px rgba(0,0,0,.2), 0 8px 26px rgba(200,206,214,.2);
  transition: background-position .7s ease, box-shadow .4s, transform .3s var(--ease);
}
/* fénycsík: háttérpozíció-animáció, a gomb kerekítésén belül marad */
.cta::after, .btn::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(100deg, transparent 35%, rgba(255,255,255,.8) 50%, transparent 65%) no-repeat;
  background-size: 300% 100%; background-position: 150% 0;
}
.cta::after { animation: glint 5s 2s ease-in-out infinite; }
.btn:hover::after { animation: glint 1.1s ease-out; }
@keyframes glint { 0%, 55% { background-position: 150% 0; } 100% { background-position: -60% 0; } }
.cta:hover, .btn:hover { background-position: 0 0, 100% 0; transform: translateY(-1px); box-shadow: inset 0 1px 0 #fff, inset 0 -2px 6px rgba(0,0,0,.18), 0 12px 34px rgba(220,226,234,.34); }
.btn:active, .cta:active { transform: translateY(1px); }
.btn--ghost {
  color: #eceff2; border: 1px solid transparent;
  background: linear-gradient(140deg, rgba(70,74,80,.6), rgba(40,43,47,.5)) padding-box, var(--rim) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 14px 30px -14px rgba(0,0,0,.6);
}
.btn--ghost::after { background-image: linear-gradient(100deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%); }
.btn--ghost:hover { background: linear-gradient(140deg, rgba(90,95,102,.65), rgba(50,54,58,.55)) padding-box, var(--rim) border-box; color: #fff; }
.btn--sm { min-height: 44px; padding: 0 22px; font-size: .875rem; }
.btn[disabled] { opacity: .55; cursor: progress; }

.link {
  display: inline-flex; align-items: center; gap: .6em;
  font-weight: 400; font-size: .95rem; letter-spacing: .04em; text-decoration: none; color: var(--feny);
  padding-bottom: 5px;
  background: linear-gradient(90deg, var(--ezust), rgba(214,218,222,.2)) left bottom / 100% 1px no-repeat;
  transition: background-size .45s var(--ease);
}
.link::after { content: "→"; font-size: .95em; transition: transform .3s var(--ease); }
.link:hover { background-size: 40% 1px; }
.link:hover::after { transform: translateX(4px); }
button.link::after { content: none; }

/* --------------------------------------------------------------------------
   NAVBAR – kapszula alakú üvegsáv fémes peremmel
   -------------------------------------------------------------------------- */
.nav { position: fixed; top: var(--top); left: 0; right: 0; z-index: 60; display: flex; justify-content: center; padding: 0 14px; pointer-events: none;
  animation: drop 1s .1s var(--ease) backwards; }
@keyframes drop { from { transform: translateY(-24px) scale(.97); } }
.bar { pointer-events: auto; width: min(1240px, 100%); height: 72px; border-radius: 999px; position: relative; isolation: isolate;
  padding: 0 10px 0 26px; display: flex; align-items: center; justify-content: space-between; gap: 18px;
  transition: height .5s cubic-bezier(.3,.7,.2,1); }
.nav.scrolled .bar { height: 62px; }
.bar-bg { position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; }
.bar-bg::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: rgba(27,29,31,.6); opacity: 0; transition: opacity .5s; }
.nav.scrolled .bar-bg::after { opacity: 1; }
/* görgetésjelző: vékony ezüst vonal a képernyő legfelső szélén, az oldal végére ér át */
/* ugyanaz a szálcsiszolt ezüst, mint a gombokon: fémes csík, felső csúcsfény, alsó árnyék és időnként végigfutó fénycsillanás */
/* valódi szélességgel nő (nem nyújtással), így a vége nem torzul; a vége lágyan, lekerekítve fut ki */
.scroll-progress { position: fixed; top: 0; left: 0; width: 0; height: 3px; z-index: 70; pointer-events: none; overflow: hidden;
  opacity: 0; transition: opacity .5s; border-radius: 0 3px 3px 0;
  background: var(--brushed), var(--silver); background-size: auto, 1200px 100%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(0,0,0,.35);
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), rgba(0,0,0,.35)); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), rgba(0,0,0,.35)); }
.scroll-progress::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 35%, rgba(255,255,255,.9) 50%, transparent 65%) no-repeat;
  background-size: 300% 100%; background-position: 150% 0; animation: glint 5s 1s ease-in-out infinite; }
.scroll-progress.is-on { opacity: 1; }
.nav-open .scroll-progress { opacity: 0; }

.logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; position: relative; z-index: 1; text-decoration: none; }
.logo__mark { display: block; width: 40px; height: 40px; flex: none; transition: transform 1.2s var(--ease), filter 1.2s var(--ease); }
.logo:hover .logo__mark { transform: scale(1.06); filter: drop-shadow(0 0 8px rgba(255,255,255,.35)); }
.wordmark { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.wordmark__word { display: block; width: auto; height: 19px; }
.wordmark b { font-family: var(--serif); font-weight: 600; font-size: 23px; letter-spacing: .32em; margin-right: -.32em;
  background: var(--silver); background-size: 260% 100%; background-position: 28% 0; -webkit-background-clip: text; background-clip: text; color: transparent; }
.wordmark small { font-size: 8px; font-weight: 400; letter-spacing: .6em; margin: 6px -.6em 0 0; color: #aab0b8; }
@keyframes sweep { from { background-position: 100% 0; } to { background-position: 28% 0; } }

.menu { position: relative; display: flex; align-items: center; z-index: 1; }
.menu a.l { position: relative; z-index: 1; font-size: 14.5px; font-weight: 400; letter-spacing: .03em; color: #cfd3d8; padding: 10px 15px; border-radius: 999px; text-decoration: none; transition: color .3s; white-space: nowrap; }
.menu a.l:hover, .menu a.l[aria-current] { color: #fff; }
.ind { position: absolute; top: 0; bottom: 0; left: 0; width: 0; border-radius: 999px; pointer-events: none; opacity: 0;
  border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.07)) padding-box, var(--rim) border-box;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  transition: transform .45s cubic-bezier(.3,.8,.2,1), width .45s cubic-bezier(.3,.8,.2,1), opacity .3s; }

.right { display: flex; align-items: center; gap: 16px; position: relative; z-index: 1; }
/* Nyelvváltó: fém kapszula, csúszó ezüst gombbal és földgömb-ikonnal */
.lang { display: flex; align-items: center; gap: 8px; padding: 4px 4px 4px 10px; border-radius: 999px; font-size: 12px; letter-spacing: .16em;
  border: 1px solid transparent; background: linear-gradient(180deg, rgba(14,15,17,.75), rgba(34,36,40,.7)) padding-box, var(--rim) border-box;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.06); }
.lang__globe { width: 15px; height: 15px; color: var(--ezust); flex: none; transition: transform 1s var(--ease); }
.lang:hover .lang__globe { transform: rotate(-30deg); }
.lang-fx .lang__globe { transform: rotate(360deg); }
.lang__track { position: relative; display: grid; grid-template-columns: 1fr 1fr; isolation: isolate; }
.lang__thumb { position: absolute; top: 0; bottom: 0; left: 0; width: 50%; z-index: -1; border-radius: 999px;
  background: var(--brushed), var(--silver-v);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 2px rgba(0,0,0,.25), 0 3px 10px rgba(0,0,0,.45), 0 0 14px rgba(255,255,255,.18);
  transition: transform .55s cubic-bezier(.5,1.6,.4,1); }
.lang[data-active="en"] .lang__thumb { transform: translateX(100%); }
.lang button { font: inherit; letter-spacing: inherit; color: #b9bec5; background: none; border: 0; cursor: pointer; padding: 7px 12px; border-radius: 999px; min-width: 40px; transition: color .35s; }
.lang button:hover { color: #fff; }
.lang button[aria-pressed="true"] { color: #17181a; font-weight: 500; }
/* nyelvváltáskor ezüst fénysöprés halad át a képernyőn, közben cserélődik a szöveg */
.lang-sweep { position: fixed; inset: 0; z-index: 90; pointer-events: none; overflow: hidden; }
.lang-sweep::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 60vw; min-width: 420px;
  background: linear-gradient(100deg, transparent, rgba(235,239,244,.05) 30%, rgba(255,255,255,.2) 50%, rgba(235,239,244,.05) 70%, transparent);
  transform: translateX(-70vw); animation: langsweep .9s cubic-bezier(.6,0,.3,1) forwards; }
@keyframes langsweep { to { transform: translateX(140vw); } }
main, .site-footer { transition: opacity .3s ease; }
.lang-fx main, .lang-fx .site-footer { opacity: .35; }
.bar .cta { min-height: 50px; padding: 0 28px; font-size: 14.5px; }

/* 8 menüpont: asztali nézetben szorosabb menü, hogy a magyar és az angol felirat is kiférjen */
@media (min-width: 1241px) {
  .menu a.l { padding-inline: 11px; font-size: 14px; letter-spacing: .01em; }
  .right { gap: 12px; }
  .bar .cta { padding: 0 22px; }
}

.burger { display: none; width: 46px; height: 46px; border-radius: 50%; padding: 0; cursor: pointer; color: inherit; position: relative; flex: none;
  border: 1px solid transparent; background: linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.06)) padding-box, var(--rim) border-box; }
.burger i { position: absolute; left: 13px; right: 13px; height: 1.5px; background: #eceff2; border-radius: 2px; transition: transform .45s cubic-bezier(.3,.7,.2,1), top .45s; }
.burger i:nth-child(1) { top: 17px; } .burger i:nth-child(2) { top: 26px; }
.open .burger i:nth-child(1) { top: 21.5px; transform: rotate(45deg); }
.open .burger i:nth-child(2) { top: 21.5px; transform: rotate(-45deg); }

@media (max-width: 1240px) {
  .burger { display: block; }
  .desk { display: none; }
  .bar { padding: 0 12px 0 22px; gap: 10px; }
  .burger { margin-left: auto; }
  .panel { position: fixed; left: 14px; right: 14px; top: calc(var(--top) + 84px); border-radius: var(--r-xl); padding: 14px; pointer-events: none;
    max-height: calc(100svh - var(--top) - 100px); overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-12px) scale(.97); transform-origin: top right;
    transition: opacity .35s, transform .45s cubic-bezier(.3,.8,.2,1), visibility .35s;
    background: linear-gradient(140deg, rgba(40,43,47,.97), rgba(58,62,67,.95)) padding-box, var(--rim) border-box; }
  .open .panel { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
  .panel .menu { flex-direction: column; align-items: stretch; gap: 2px; }
  .panel .menu a.l { font-family: var(--serif); font-size: 24px; padding: 13px 18px; border-radius: var(--r-lg); }
  .panel .ind { display: none; }
  .panel .menu a.l[aria-current] { background: linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,.03)); box-shadow: inset 2px 0 0 var(--ezust); }
  .pfoot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 6px 4px; margin-top: 8px; border-top: 1px solid rgba(255,255,255,.1); flex-wrap: wrap; }
  .pfoot .tel { width: 100%; color: var(--acel); font-size: 14px; text-decoration: none; padding: 0 12px; }
  .pfoot .tel b { color: var(--feny); font-weight: 400; }
}
@media (max-width: 420px) {
  .wordmark__word { height: 15px; }
  .wordmark small { letter-spacing: .45em; margin-right: -.45em; }
  .logo { gap: 8px; } .logo__mark { width: 32px; height: 32px; }
  .bar { padding: 0 8px 0 16px; }
}
@media (min-width: 1241px) { .panel { display: contents; } .pfoot { display: none; } }
.nav-open { overflow: hidden; }

/* --------------------------------------------------------------------------
   Hero – teljes képernyős fotó
   -------------------------------------------------------------------------- */
.hero { position: relative; overflow: hidden; isolation: isolate;
  min-height: 100svh; display: flex; align-items: flex-end; padding: calc(var(--top) + clamp(24px, 6vh, 90px)) 0 clamp(26px, 5vh, 56px); }
.hero__bg, .page-hero__bg, .photo-band__bg, .closing__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
/* lassú Ken Burns a kereten (scale), parallax a képen (translate) – nem ütik egymást */
.hero__bg, .page-hero__bg { animation: kenburns 22s ease-out both; }
@keyframes kenburns { from { transform: scale(1.12); } }
.hero__bg img, .page-hero__bg img, .photo-band__bg img, .closing__bg img {
  position: absolute; left: 0; top: -8%; width: 100%; height: 116%; object-fit: cover; max-width: none;
  transform: translate3d(0, var(--py, 0px), 0); filter: saturate(.85) contrast(1.05); }
.hero__bg::after { content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(80% 70% at 75% 40%, rgba(27,29,31,.12), rgba(27,29,31,.72) 70%),
    linear-gradient(90deg, rgba(23,24,26,.94) 0%, rgba(23,24,26,.68) 45%, rgba(23,24,26,.3) 100%),
    linear-gradient(180deg, rgba(23,24,26,.5) 0%, transparent 30%, transparent 70%, var(--grafit) 100%); }
/* mozgó fényfolt és fénynyaláb a hero fotója felett */
.hero__glow { position: absolute; z-index: -1; width: 70vmax; height: 70vmax; right: -20vmax; top: -25vmax; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 60%); animation: d2 18s ease-in-out infinite alternate; will-change: transform; }
.hero .wrap { display: grid; gap: clamp(26px, 5vh, 60px); }
.hero__text { max-width: 760px; }
.hero h1 { font-size: min(var(--step-5), 12vh); line-height: .96; margin-bottom: .3em; max-width: 14ch; animation: rise 1s both var(--ease), sweep 5s 1s ease-out both reverse; }
.hero__lede { font-size: clamp(1.05rem, 1.6vw, 1.22rem); color: #c3c8ce; max-width: 40em; margin-bottom: clamp(1.2em, 3.4vh, 2.4em); line-height: 1.7; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero__note { margin-top: clamp(12px, 2.2vh, 26px); color: var(--acel); font-size: var(--step--1); letter-spacing: .02em; }
.hero__text > * { animation: rise 1s both var(--ease); }
.hero__text > :nth-child(2) { animation-delay: .1s; } .hero__text > :nth-child(3) { animation-delay: .25s; }
.hero__text > :nth-child(4) { animation-delay: .4s; } .hero__text > :nth-child(5) { animation-delay: .5s; }
@keyframes rise { from { opacity: 0; transform: translateY(20px); } }
.hero__stats { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; border-radius: var(--r-xl); overflow: hidden;
  animation: rise 1.1s .65s both var(--ease); }
.hero__stats li { padding: 22px 26px; display: flex; flex-direction: column; gap: 4px; position: relative; }
.hero__stats li + li::after { content: ""; position: absolute; left: 0; top: 18%; bottom: 18%; width: 1px; background: linear-gradient(180deg, transparent, rgba(255,255,255,.4), transparent); }
.hero__stats strong { font-family: var(--serif); font-weight: 500; font-size: clamp(1.9rem, 3vw, 2.6rem); line-height: 1; padding-block: .08em .12em;
  background: var(--silver); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__stats li > span { color: var(--muted); font-size: .9rem; line-height: 1.4; }
/* görgő-számláló: minden számjegy egy 0–9 szalag (kétszer), ami a helyére pörög */
.hero__stats strong.has-odo { background: none; color: #eef1f4; font-variant-numeric: lining-nums tabular-nums; }
.odo { display: inline-flex; align-items: flex-start; }
.odo__d { display: inline-block; height: 1.1em; overflow: hidden; }
.odo__s { display: flex; flex-direction: column; transform: translate3d(0, 0, 0);
  background: linear-gradient(180deg, #fdfdfe 0%, #dfe3e7 45%, #a3aab2 100%) 0 0 / 100% 1.1em repeat-y; -webkit-background-clip: text; background-clip: text; color: transparent;
  transition: transform 2.4s cubic-bezier(.16, 1, .3, 1) calc(var(--i) * .14s); }
.odo__s i { font-style: normal; display: block; height: 1.1em; line-height: 1.1em; }
.is-counted .odo__s { transform: translate3d(0, calc((10 + var(--n)) * -1.1em), 0); }
.odo__suf { display: inline-block; height: 1.1em; line-height: 1.1em; margin-left: .04em; color: #c9ced4; opacity: 0; transform: translateY(.3em); transition: opacity .8s 1.6s, transform .8s 1.6s var(--ease); }
.is-counted .odo__suf { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .odo__s, .odo__suf { transition: none; } }
/* alacsony laptopképernyőn a megjegyzés (a statisztika is elmondja) helyet ad, hogy minden elférjen */
@media (max-height: 760px) and (min-width: 761px) { .hero__note { display: none; } }
@media (max-width: 760px) {
  .hero { padding: calc(var(--top) + 56px) 0 36px; }
  .hero__bg::after { background: linear-gradient(180deg, rgba(23,24,26,.55) 0%, rgba(23,24,26,.55) 35%, rgba(23,24,26,.92) 70%, var(--grafit) 100%); }
  .hero .wrap { gap: 26px; }
  .hero__note { display: none; }
  .hero__lede { margin-bottom: 1.4em; font-size: 1rem; line-height: 1.6; }
  .hero__stats li { padding: 14px 12px; }
  .hero__stats strong { font-size: 1.6rem; }
  .hero__stats li > span { font-size: .74rem; }
  .hero__actions .btn { flex: 1 1 100%; }
}

/* --------------------------------------------------------------------------
   Aloldali hero – teljes képernyős fotó, ezüst cím
   -------------------------------------------------------------------------- */
.page-hero { position: relative; overflow: hidden; isolation: isolate; min-height: 100svh; display: flex; align-items: flex-end;
  padding: calc(var(--top) + 120px) 0 clamp(40px, 8vh, 96px); }
.page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; z-index: 1;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.32) 25%, rgba(255,255,255,.32) 75%, transparent); }
.page-hero > .wrap { width: 100%; }
.page-hero__bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(23,24,26,.62) 0%, rgba(23,24,26,.42) 40%, rgba(23,24,26,.88) 82%, var(--grafit) 100%),
              linear-gradient(90deg, rgba(23,24,26,.6), transparent 70%); }
.page-hero__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px 32px; align-items: end; }
.page-hero__grid > * { animation: rise 1s both var(--ease); }
.page-hero__title { grid-column: 1 / span 7; animation-delay: .08s; }
.page-hero__title .eyebrow { margin-bottom: 10px; }
.page-hero h1 { font-size: clamp(2.6rem, 1.4rem + 6vw, 6.6rem); }
/* jobb oldali üvegkártya: bevezető, három kulcsadat, gombok */
.page-hero__card { grid-column: 8 / span 5; display: grid; gap: 20px; padding: 26px 28px 24px; border-radius: var(--r-xl); animation-delay: .22s; }
.page-hero__lede { color: #c9cdd2; font-size: var(--step-0); margin: 0; }
.page-hero__facts { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(min-content, 1fr); padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); }
.page-hero__facts li { padding: 0 14px; border-left: 1px solid rgba(255,255,255,.12); }
.page-hero__facts li:first-child { padding-left: 0; border-left: 0; }
.page-hero__facts strong { display: block; font-family: var(--serif); font-weight: 500; font-size: 1.7rem; line-height: 1.05; padding-bottom: .08em; font-variant-numeric: lining-nums;
  background: var(--silver); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.page-hero__facts span { display: block; margin-top: 4px; color: var(--muted); font-size: .8rem; line-height: 1.35; }
.page-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
/* „Ezen az oldalon”: ugrólinkek az oldal szekcióira (Referenciáknál gyorsszűrő) */
.page-hero__toc { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); animation-delay: .36s;
  overflow-x: auto; scrollbar-width: none; }
.page-hero__toc::-webkit-scrollbar { display: none; }
.page-hero__toc span { flex: none; margin-right: 10px; color: var(--acel); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; }
.page-hero__toc a { flex: none; padding: 9px 18px; border-radius: 999px; font-size: .9rem; color: var(--ezust); text-decoration: none; white-space: nowrap;
  border: 1px solid transparent; background: linear-gradient(rgba(20,22,24,.5), rgba(20,22,24,.5)) padding-box, var(--rim) border-box; transition: color .25s, transform .3s var(--ease), background .3s; }
.page-hero__toc a:hover { color: #17181a; background: var(--silver-v) padding-box, var(--rim) border-box; transform: translateY(-2px); }
.crumbs { grid-column: 1 / -1; font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--acel); margin-bottom: 4px; }
.crumbs a { color: var(--ezust); text-decoration: none; }
.crumbs a:hover { color: #fff; }
.crumbs ol { list-style: none; display: inline-flex; flex-wrap: wrap; gap: 10px; padding: 9px 18px; border-radius: 999px;
  border: 1px solid transparent; background: linear-gradient(rgba(20,22,24,.55), rgba(20,22,24,.55)) padding-box, var(--rim) border-box; }
.crumbs li + li::before { content: "/"; margin-right: 10px; color: rgba(255,255,255,.3); }
/* Esküvő: középre igazított üveggomb a hero tetején (teremtervező, teszt) */
.hero-tool { position: absolute; left: 0; right: 0; top: calc(var(--top) + 98px); z-index: 2; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 12px; padding: 0 var(--gutter); pointer-events: none; }
@media (max-width: 520px) { .hero-tool__btn { min-height: 44px; padding-left: 14px; gap: 9px; font-size: .84rem; } .hero-tool__btn svg { display: none; } }
.hero-tool__btn { pointer-events: auto; display: inline-flex; align-items: center; gap: 12px; min-height: 50px; padding: 0 10px 0 20px; border-radius: 999px;
  font-size: .9rem; letter-spacing: .08em; color: var(--feny); text-decoration: none; border: 1px solid transparent;
  background: linear-gradient(140deg, rgba(255,255,255,.14), rgba(255,255,255,.04) 45%, rgba(255,255,255,.09)) padding-box, var(--rim) border-box;
  box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  animation: rise 1s .3s both var(--ease); transition: transform .35s var(--ease), box-shadow .35s; }
.hero-tool__btn svg { width: 20px; height: 20px; flex: none; color: var(--ezust); }
.hero-tool__btn em { font-style: normal; font-size: .68rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: #17181a;
  padding: 6px 11px; border-radius: 999px; background: var(--brushed), var(--silver-v); box-shadow: inset 0 1px 0 #fff; }
.hero-tool__btn:hover { transform: translateY(-2px); box-shadow: var(--glass-shadow), 0 0 0 4px rgba(255,255,255,.05); }
@media (max-width: 1280px) and (min-width: 901px) { .page-hero__title { grid-column: 1 / span 6; } .page-hero__card { grid-column: 7 / span 6; } }
@media (max-width: 900px) {
  .page-hero__title, .page-hero__card { grid-column: 1 / -1; }
  .page-hero__card { padding: 20px 20px 18px; gap: 16px; }
  .page-hero__facts strong { font-size: 1.35rem; overflow-wrap: break-word; }
  .page-hero__facts li { padding: 0 10px; }
  /* a sáv kifut a képernyő szélére, jobbra elhalványul */
  .page-hero__toc { margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter);
    -webkit-mask: linear-gradient(90deg, #000 85%, transparent); mask: linear-gradient(90deg, #000 85%, transparent); }
}

/* --------------------------------------------------------------------------
   Szekciók
   -------------------------------------------------------------------------- */
.section { position: relative; padding-block: var(--section); }

/* Teljes szélességű sávok: a szekciók felváltva „kiemelkednek” (világos üveg)
   vagy „besüllyednek” (mély, sötét réteg), így nem folynak egybe.
   Élő elmosás nincs rajtuk (a mozgó háttér miatt drága lenne), a mélységet
   áttetszőség, belső fények és árnyékok adják. */
.plane-out {
  background:
    radial-gradient(90% 120% at 15% 0%, rgba(255,255,255,.07), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.018) 45%, rgba(255,255,255,.04)),
    rgba(28,30,34,.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 60px 80px -70px rgba(255,255,255,.14), inset 0 -1px 0 rgba(255,255,255,.08), 0 40px 80px -40px rgba(0,0,0,.7);
  z-index: 1;
}
.plane-in {
  background: linear-gradient(180deg, rgba(4,5,6,.84), rgba(9,10,11,.78) 50%, rgba(4,5,6,.86));
  box-shadow: inset 0 40px 60px -36px rgba(0,0,0,.95), inset 0 -40px 60px -36px rgba(0,0,0,.95);
}
/* a besüllyedő sávban a kártyák jobban kiugranak */
.plane-in .pledges li, .plane-in .case, .plane-in .format, .plane-in .steps li, .plane-in .faq details, .plane-in .contact-card, .plane-in .leader, .plane-in .feature__body {
  box-shadow: var(--glass-shadow), 0 40px 70px -30px rgba(0,0,0,.95);
}

/* szálcsiszolt acélcsík a sávok, a fotósávok és a záró rész tetején, átfutó fénnyel */
.plane-out::before, .plane-in::before, .closing::before, .photo-band::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 2; opacity: .6;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.95), transparent) no-repeat, var(--steel);
  background-size: 18% 100%, 100% 100%; background-position: -20% 0, 0 0; animation: rail 9s ease-in-out infinite;
  -webkit-mask: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.plane-in::before { opacity: .35; animation-delay: -4.5s; }
@keyframes rail { 0% { background-position: -20% 0, 0 0; } 100% { background-position: 120% 0, 0 0; } }

.split { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.split__head { grid-column: 1 / span 5; }
.split__body { grid-column: 6 / span 7; }
.split__head h2 { font-size: var(--step-3); }
.split__head p { color: var(--muted); margin-top: 1.2em; max-width: 30em; }
.split__lead { font-family: var(--serif); font-size: var(--step-2); line-height: 1.35; color: var(--feny); max-width: 26em; }
@media (min-width: 901px) { .split__head--sticky { position: sticky; top: 120px; align-self: start; } }
@media (max-width: 900px) { .split__head, .split__body { grid-column: 1 / -1; } .split__body { margin-top: 28px; } }

.section-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: clamp(32px, 4vw, 52px); }
.section-head h2 { font-size: var(--step-3); max-width: 15em; }
.section-head p { color: var(--muted); max-width: 30em; margin: 0; }

/* közös kártyaalap: festett üveg + fémes keret */
.pledges li, .case, .format, .steps li, .faq details, .segment, .contact-card, .summary, .choice span, .chip, .allergens li, .index-list a {
  border: 1px solid transparent;
  background: var(--glass-fill) padding-box, var(--rim) border-box;
}

/* Vállalások */
.pledges { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.pledges li { position: relative; padding: 30px 28px; border-radius: var(--r-lg); box-shadow: var(--glass-shadow); transition: transform .5s var(--ease); }
.pledges li { transition: box-shadow .5s var(--ease), background .5s; }
.pledges li:hover { box-shadow: var(--glass-shadow), 0 0 0 1px rgba(255,255,255,.18), 0 0 40px -10px rgba(255,255,255,.18); }
.pledges h3 { transition: letter-spacing .6s var(--ease); }
.pledges li:hover h3 { letter-spacing: .01em; }
.pledges h3 { font-size: 1.55rem; margin-bottom: .45em; }
.pledges p { color: var(--muted); margin: 0; }
@media (max-width: 640px) { .pledges { grid-template-columns: 1fr; } }

/* Szegmensek (főoldal) */
.segments { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.segments__divider { display: none; }
.segment { position: relative; padding: clamp(28px, 4vw, 52px); border-radius: var(--r-xl); overflow: hidden; isolation: isolate; box-shadow: var(--glass-shadow); }
.segment__bg { position: absolute; inset: 0; z-index: -1; }
.segment__bg img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--ease); filter: saturate(.8); }
.segment__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23,24,26,.7), rgba(23,24,26,.9) 55%, rgba(23,24,26,.96)); }
.segment:hover .segment__bg img { transform: scale(1.06); filter: saturate(1); }
.segment li { transition: padding .45s var(--ease), border-color .45s; }
.segment li:hover { padding-left: 10px; border-color: rgba(255,255,255,.35); }
.segment h2 { font-size: var(--step-3); margin-bottom: .45em; }
.segment > p { color: #c3c8ce; }
.segment ul { list-style: none; margin: 26px 0 34px; }
.segment li { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.segment li span:last-child { color: var(--muted); font-size: var(--step--1); text-align: right; }
@media (max-width: 900px) { .segments { grid-template-columns: 1fr; } }

/* Esettanulmányok */
.cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.4vw, 30px); }
/* a fotó tölti ki a kártyát, a cím alul, átmeneten ül; asztali gépen a leírás és a részletek hoverre csúsznak elő */
.case { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: clamp(430px, 36vw, 540px); padding: clamp(22px, 2.2vw, 30px);
  border-radius: var(--r-xl); overflow: hidden; isolation: isolate; box-shadow: var(--glass-shadow), 0 30px 60px -30px rgba(0,0,0,.8); transition: transform .6s var(--ease), box-shadow .6s; }
.case:hover { transform: translateY(-6px); box-shadow: var(--glass-shadow), 0 0 0 1px rgba(255,255,255,.2), 0 40px 70px -30px rgba(0,0,0,.9); }
.case figure { position: absolute; inset: 0; z-index: -1; margin: 0; background: var(--pala); }
.case figure::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,15,17,.2) 0%, rgba(14,15,17,0) 28%, rgba(14,15,17,.72) 60%, rgba(14,15,17,.96) 100%); }
.case figure img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85) brightness(.92); transition: transform 1.4s var(--ease), filter .8s; }
.case:hover figure img { transform: scale(1.06); filter: saturate(.95) brightness(.95); }
@media (hover: hover) and (min-width: 641px) { .case:hover figure img { filter: saturate(.9) brightness(.62); } }
/* hoverre a cím alatt kinyúlik egy vékony ezüst vonal */
.case h3::after { content: ""; display: block; width: 36px; height: 1px; margin-top: 14px;
  background: linear-gradient(90deg, rgba(255,255,255,.9), rgba(255,255,255,.2)); transition: width .7s var(--ease), box-shadow .7s; }
.case:hover h3::after { width: 120px; box-shadow: 0 0 10px rgba(255,255,255,.35); }
.case__meta { color: var(--ezust); font-size: .76rem; letter-spacing: .22em; text-transform: uppercase; margin-bottom: 10px; }
.case h3 { margin: 0; font-size: clamp(1.45rem, 2vw, 1.85rem); line-height: 1.15; }
.case p:not(.case__meta) { color: #c3c8ce; font-size: .95rem; margin: 12px 0 0; }
.case dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 16px 0 0; font-size: var(--step--1); padding-top: 14px; border-top: 1px solid rgba(255,255,255,.16); }
.case dt { color: var(--acel); }
.case dd { margin: 0; color: var(--feny); }
@media (hover: hover) and (min-width: 641px) {
  .case p:not(.case__meta), .case dl { max-height: 0; opacity: 0; margin-top: 0; padding-top: 0; border-top-color: transparent; overflow: hidden;
    transition: max-height .7s var(--ease), opacity .5s, margin .7s var(--ease), padding .7s var(--ease), border-color .5s; }
  .case:hover p:not(.case__meta), .case:focus-within p:not(.case__meta) { max-height: 9em; opacity: 1; margin-top: 12px; }
  .case:hover dl, .case:focus-within dl { max-height: 9em; opacity: 1; margin-top: 16px; padding-top: 14px; border-top-color: rgba(255,255,255,.16); transition-delay: .08s; }
}
.case[hidden] { display: none; }
.case .sample-tag, .sample-tag { position: absolute; top: 24px; left: 24px; z-index: 3; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; padding: 5px 12px;
  border-radius: 999px; color: var(--feny); border: 1px solid transparent; background: linear-gradient(rgba(27,29,31,.7), rgba(27,29,31,.7)) padding-box, var(--rim) border-box; }
@media (max-width: 1000px) { .cases { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .cases { grid-template-columns: 1fr; } }
/* Referenciák oldal: bármennyi kártya; a hiányos utolsó sor középre kerül, nem lóg balra */
.cases--all { display: flex; flex-wrap: wrap; justify-content: center; --gap: clamp(18px, 2.4vw, 30px); gap: var(--gap); }
.cases--all .case { flex: 0 1 calc((100% - 2 * var(--gap)) / 3); }
@media (max-width: 1000px) { .cases--all .case { flex-basis: calc((100% - var(--gap)) / 2); } }
@media (max-width: 640px) { .cases--all .case { flex-basis: 100%; } }
.cases-more { display: flex; justify-content: center; margin-top: clamp(28px, 4vw, 44px); }
.cases-more .btn[hidden] { display: none; }

/* Szűrő */
.filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 40px; }
.chip { font: inherit; font-size: .93rem; color: var(--ezust); border-radius: 999px; padding: 11px 20px; cursor: pointer; transition: color .25s, transform .3s var(--ease); }
.chip:hover { color: #fff; transform: translateY(-1px); }
.chip[aria-pressed="true"] { color: #17181a; background: var(--silver-v) padding-box, var(--rim) border-box; box-shadow: inset 0 1px 0 #fff, 0 6px 18px rgba(0,0,0,.3); }
.chip { display: inline-flex; align-items: center; gap: 10px; }
.chip[hidden] { display: none; }
.chip__n { min-width: 22px; padding: 1px 7px; border-radius: 999px; font-size: .74rem; line-height: 1.6; text-align: center; color: var(--acel); background: rgba(255,255,255,.07); font-variant-numeric: tabular-nums; }
.chip[aria-pressed="true"] .chip__n { color: #17181a; background: rgba(0,0,0,.1); }
.filters__status { width: 100%; color: var(--acel); font-size: var(--step--1); margin: 6px 0 0; }

/* Kép + szöveg: fémkeretes fotó */
.feature { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: center; }
.feature__media { grid-column: 1 / span 5; margin: 0; aspect-ratio: 4 / 5; border-radius: var(--r-xl); position: relative; padding: 6px;
  background: var(--brushed), linear-gradient(160deg, #6f767f, #e6eaee 25%, #8a919a 45%, #3a4048 70%, #b9bfc6);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.6); }
.feature__media img { width: 100%; height: 100%; object-fit: cover; border-radius: calc(var(--r-xl) - 6px); }
.feature__media::after { content: ""; position: absolute; inset: 6px; border-radius: calc(var(--r-xl) - 6px); box-shadow: inset 0 0 0 1px rgba(0,0,0,.5); background: linear-gradient(200deg, rgba(255,255,255,.12), transparent 40%); pointer-events: none; }
.feature__body { grid-column: 7 / span 6; padding: clamp(28px, 4vw, 48px); border-radius: var(--r-xl); }
.feature--flip .feature__media { grid-column: 8 / span 5; order: 2; }
.feature--flip .feature__body { grid-column: 1 / span 6; order: 1; }
.feature__body h2 { font-size: var(--step-3); margin-bottom: .55em; }
.feature__body > p { color: #c9cdd2; }
.signature { margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); display: flex; flex-direction: column; gap: 2px; }
.signature strong { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: var(--step-2); color: var(--feny); }
.signature span { color: var(--acel); font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; }
@media (max-width: 900px) {
  .feature__media, .feature__body, .feature--flip .feature__media, .feature--flip .feature__body { grid-column: 1 / -1; order: initial; }
  .feature__media { aspect-ratio: 4 / 3; }
  .feature__body { margin-top: -60px; margin-inline: 12px; }
}

/* Folyamat: ugyanolyan üvegkártyák, mint az oldal többi kártyája.
   Fejlécben ezüst sorszám és az időtáv, alatta vékony elválasztó; hoverre a kártya megemelkedik,
   a pereme felfénylik, a sorszámon átfut a fény. */
.steps { list-style: none; position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; counter-reset: step; }
.steps li { position: relative; counter-increment: step; }
.steps h3 { font-size: 1.5rem; margin: 0 0 10px; }
.steps p { color: var(--muted); font-size: .97rem; margin: 0; }
.steps:not(.steps--vertical) li { display: grid; grid-template-columns: auto 1fr; align-content: start; padding: 26px 26px 28px; border-radius: var(--r-lg);
  box-shadow: var(--glass-shadow); transition: transform .6s var(--ease), box-shadow .6s; }
.steps:not(.steps--vertical) li::before { content: counter(step, decimal-leading-zero); grid-column: 1; grid-row: 1; align-self: center;
  font-family: var(--serif); font-weight: 500; font-size: 2.5rem; line-height: 1; padding-block: .04em .1em;
  background: var(--silver); background-size: 220% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; color: transparent;
  transition: background-position 1.2s var(--ease); }
.steps:not(.steps--vertical) .when { grid-column: 2; grid-row: 1; justify-self: end; align-self: center; color: var(--feny); font-size: .7rem; letter-spacing: .16em;
  text-transform: uppercase; padding: 5px 11px; border-radius: 999px; border: 1px solid transparent; background: linear-gradient(rgba(20,22,24,.6), rgba(20,22,24,.6)) padding-box, var(--rim) border-box; }
.steps:not(.steps--vertical) h3 { grid-column: 1 / -1; margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); }
.steps:not(.steps--vertical) p { grid-column: 1 / -1; }
.steps:not(.steps--vertical) li:hover { transform: translateY(-6px); box-shadow: var(--glass-shadow), 0 0 0 1px rgba(255,255,255,.18), 0 0 40px -10px rgba(255,255,255,.18); }
.steps:not(.steps--vertical) li:hover::before { background-position: 0 0; }
.steps.steps--three { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1000px) { .steps:not(.steps--vertical) { grid-template-columns: repeat(2, 1fr); } .steps.steps--three { grid-template-columns: 1fr; max-width: 640px; } }
@media (max-width: 560px) { .steps:not(.steps--vertical) { grid-template-columns: 1fr; } }
/* Hét lépés (főoldal): ugyanazok az üvegkártyák, kompaktan – 4 + 3, a második sor középre igazítva;
   a sorszám és a cím egy sorban, alatta vékony elválasztó és a rövid leírás */
.steps.steps--seven { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.steps.steps--seven li { flex: 0 1 calc((100% - 3 * 14px) / 4); column-gap: 14px; padding: 22px 22px 24px; }
.steps.steps--seven li::before { font-size: 2.1rem; }
.steps.steps--seven h3 { grid-column: 2; grid-row: 1; align-self: center; margin: 0; padding: 0; border: 0; font-size: 1.35rem; }
.steps.steps--seven p { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.12); font-size: .93rem; }
@media (max-width: 1000px) { .steps.steps--seven li { flex-basis: calc((100% - 14px) / 2); } }
@media (max-width: 560px) {
  .steps.steps--seven { gap: 10px; }
  .steps.steps--seven li { flex-basis: 100%; padding: 16px 18px 18px; }
  .steps.steps--seven li::before { font-size: 1.75rem; }
  .steps.steps--seven h3 { font-size: 1.22rem; }
  .steps.steps--seven p { margin-top: 10px; padding-top: 10px; }
}
/* Ajánlatkérés: függőleges, fém számgombos változat */
.steps.steps--vertical { grid-template-columns: 1fr; padding: 0 0 0 58px; gap: 12px; margin-top: 22px; }
.steps.steps--vertical::before { content: ""; position: absolute; left: 19px; top: 6px; bottom: 6px; width: 2px; border-radius: 2px;
  background: linear-gradient(180deg, #2c3036, #e6eaee 30%, #7d858f 60%, #2c3036); }
.steps.steps--vertical li { padding: 14px 16px; border-radius: var(--r-lg); box-shadow: none; }
.steps.steps--vertical li::before { content: counter(step, decimal-leading-zero); position: absolute; top: 8px; left: -58px; width: 40px; height: 40px;
  display: grid; place-items: center; font-family: var(--serif); font-size: .95rem; font-weight: 600; font-variant-numeric: lining-nums; color: #17181a;
  background: var(--brushed), var(--silver-v); border-radius: 50%;
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 4px rgba(0,0,0,.25), 0 0 0 5px rgba(27,29,31,.9), 0 0 0 6px rgba(255,255,255,.18), 0 8px 20px rgba(0,0,0,.4); }
.steps.steps--vertical p { color: var(--ezust); }

/* GYIK (főoldal) */
.faq { display: grid; gap: 10px; counter-reset: faq; }
.faq details { counter-increment: faq; border-radius: var(--r-lg); transition: box-shadow .4s; }
.faq details[open] { box-shadow: var(--glass-shadow), 0 0 0 1px rgba(255,255,255,.12); }
.faq summary { list-style: none; cursor: pointer; position: relative; padding: 22px 76px 22px 74px; font-family: var(--serif); font-size: 1.45rem; font-weight: 500;
  line-height: 1.25; color: var(--feny); transition: color .3s; }
.faq summary::-webkit-details-marker { display: none; }
/* sorszám balra */
.faq summary::before { content: counter(faq, decimal-leading-zero); position: absolute; left: 26px; top: 50%; transform: translateY(-50%);
  font-family: var(--sans); font-size: .74rem; letter-spacing: .2em; color: var(--acel); transition: color .3s; }
/* kinyitó gomb: vékony fém gyűrű, benne rajzolt plusz; nyitva a függőleges szár eltűnik (mínusz) és a gyűrű ezüstre telik */
.faq summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.28);
  background: linear-gradient(#e9edf1, #e9edf1) center / 12px 1.5px no-repeat, linear-gradient(#e9edf1, #e9edf1) center / 1.5px 12px no-repeat, rgba(255,255,255,.03);
  transition: background-size .45s var(--ease), border-color .3s, box-shadow .4s, transform .5s var(--ease); }
.faq summary:hover { color: #fff; }
.faq summary:hover::before { color: var(--feny); }
.faq summary:hover::after { border-color: rgba(255,255,255,.6); box-shadow: 0 0 18px rgba(255,255,255,.15); }
/* nyitva: a „+” negyed fordulattal „×”-re vált, ezüst lapkán, halvány fénnyel */
.faq details[open] summary::after { transform: rotate(135deg); border-color: rgba(255,255,255,.75);
  background: linear-gradient(#17181a, #17181a) center / 12px 1.5px no-repeat, linear-gradient(#17181a, #17181a) center / 1.5px 12px no-repeat, var(--brushed), var(--silver-v);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 4px rgba(255,255,255,.06), 0 0 20px rgba(255,255,255,.3); }
.faq details[open] summary::before { color: var(--feny); }
.faq .faq__a { padding: 0 76px 24px 74px; color: var(--muted); max-width: 72ch; animation: rise .5s var(--ease); }
.faq .faq__a p:last-child { margin-bottom: 0; }
.faq__ask { margin-top: 10px; }
@media (max-width: 640px) {
  .faq summary { font-size: 1.22rem; padding: 18px 64px 18px 54px; }
  .faq summary::before { left: 18px; }
  .faq summary::after { right: 16px; width: 32px; height: 32px; margin-top: -16px; }
  .faq .faq__a { padding: 0 20px 20px 54px; }
}

/* Fotósáv idézettel */
.photo-band { position: relative; overflow: hidden; isolation: isolate; min-height: clamp(320px, 52vh, 520px); display: flex; align-items: center; padding: 60px 0; }
.photo-band__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--grafit) 0%, rgba(23,24,26,.45) 22%, rgba(23,24,26,.45) 78%, var(--grafit) 100%), radial-gradient(60% 80% at 50% 50%, transparent, rgba(23,24,26,.55)); }
.photo-band__quote { margin: 0 auto; max-width: 820px; padding: clamp(32px, 5vw, 56px); border-radius: var(--r-xl); text-align: center;
  background: linear-gradient(140deg, rgba(40,43,47,.66), rgba(27,29,31,.55)) padding-box, var(--rim) border-box; }
.photo-band__quote p { margin: 0 auto; max-width: none; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(1.7rem, 1.1rem + 2.4vw, 3rem); line-height: 1.18; color: var(--feny); }
.photo-band__quote cite { display: inline-flex; align-items: center; gap: 14px; margin-top: 22px; font-style: normal; font-size: .76rem; letter-spacing: .32em; text-transform: uppercase; color: var(--acel); }
.photo-band__quote cite::before, .photo-band__quote cite::after { content: ""; width: 34px; height: 1px; background: var(--steel); }

/* Képmozaik (fenntarthatóság) */
.mosaic { display: grid; grid-template-columns: 1.4fr 1fr; grid-template-rows: 1fr 1fr; gap: 16px; min-height: 520px; }
.mosaic figure { margin: 0; border-radius: var(--r-xl); overflow: hidden; position: relative; background: var(--pala); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); }
.mosaic figure::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(180deg, transparent, rgba(10,11,12,.82)); pointer-events: none; }
.mosaic figure:first-child { grid-row: span 2; }
.mosaic figure::after { transition: opacity .6s var(--ease); opacity: .85; }
.mosaic img { display: block; width: 100%; height: 100%; object-fit: cover; filter: brightness(.88) saturate(.9); transition: transform 1.4s var(--ease), filter .8s var(--ease); }
.mosaic figcaption { position: absolute; left: 24px; right: 24px; bottom: 20px; z-index: 1; font-size: .95rem; line-height: 1.45; color: var(--feny); transition: transform .6s var(--ease); }
.mosaic figcaption::before { content: ""; display: block; width: 28px; height: 1px; margin-bottom: 10px; background: var(--silver); transition: width .6s var(--ease); }
.mosaic figure:hover img { transform: scale(1.05); filter: brightness(1) saturate(1); }
.mosaic figure:hover::after { opacity: 1; }
.mosaic figure:hover figcaption { transform: translateY(-4px); }
.mosaic figure:hover figcaption::before { width: 72px; }
@media (max-width: 760px) { .mosaic { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; } .mosaic figure { aspect-ratio: 4 / 3; } .mosaic figure:first-child { grid-row: auto; } }
/* Esküvő: öt egyforma kép, fent kettő (középre), lent három */
.mosaic--five { grid-template-columns: repeat(6, 1fr); grid-template-rows: none; grid-auto-rows: clamp(220px, 22vw, 300px); min-height: 0; }
.mosaic--five figure, .mosaic--five figure:first-child { grid-row: auto; grid-column: span 2; }
.mosaic--five figure:nth-child(1) { grid-column: 2 / span 2; }
.mosaic--five figure:nth-child(2) { grid-column: 4 / span 2; }
@media (max-width: 760px) {
  .mosaic--five { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .mosaic--five figure, .mosaic--five figure:nth-child(1), .mosaic--five figure:nth-child(2) { grid-column: auto; }
}

/* Mintamenük (Gasztronómia) */
.menus { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); }
.menu-card { display: flex; flex-direction: column; padding: clamp(24px, 2.4vw, 32px); border-radius: var(--r-lg); transition: transform .5s var(--ease); }
.menu-card:hover { transform: translateY(-6px); }
.menu-card__meta { color: var(--ezust); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 10px; }
.menu-card h3 { font-size: clamp(1.5rem, 2vw, 1.85rem); line-height: 1.15; margin: 0 0 18px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.14); }
.menu-card ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; align-content: start; flex: 1; }
.menu-card li { display: grid; grid-template-columns: 1fr auto; gap: 3px 14px; }
.menu-card__dish { color: var(--feny); line-height: 1.4; }
.menu-card__al { color: var(--acel); font-size: .76rem; letter-spacing: .06em; white-space: nowrap; padding-top: .25em; }
.menu-card__wine { grid-column: 1 / -1; color: var(--muted); font-family: var(--serif); font-style: italic; font-size: 1.05rem; }
.menu-card__note { color: var(--muted); font-size: var(--step--1); margin: 22px 0 0; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.1); }
/* büfémenü: fogássoronként csoportosítva (címke + tételek) */
.menu-card li.menu-card__group { display: block; }
.menu-card__course { display: block; margin-bottom: 8px; color: var(--acel); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; }
.menu-card__group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.menu-card__group ul li { display: block; color: var(--feny); line-height: 1.4; font-size: .97rem; }
.menu-card__tag { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; vertical-align: 2px;
  font-style: normal; font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ezust); background: rgba(255,255,255,.08); }
@media (max-width: 1100px) { .menus { grid-template-columns: 1fr; max-width: 640px; } }


/* Kapcsolati kártyák */
.contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.contact-cards--two { grid-template-columns: repeat(2, 1fr); max-width: 900px; }
.contact-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 30px 28px; border-radius: var(--r-xl); text-decoration: none; box-shadow: var(--glass-shadow); transition: transform .5s var(--ease); }
.contact-card { transform-style: preserve-3d; }
.contact-card .ico { transition: transform .8s var(--ease), box-shadow .6s; }
.contact-card:hover .ico { transform: rotate(-14deg) scale(1.08); box-shadow: inset 0 1px 0 #fff, 0 0 0 8px rgba(255,255,255,.07), 0 0 30px rgba(255,255,255,.25); }
.contact-card .ico { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 14px; color: #17181a;
  background: var(--brushed), var(--silver-v); box-shadow: inset 0 1px 0 #fff, inset 0 -2px 4px rgba(0,0,0,.25), 0 0 0 5px rgba(255,255,255,.06), 0 8px 20px rgba(0,0,0,.4); }
.contact-card .ico svg { width: 20px; height: 20px; }
.contact-card span { color: var(--acel); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; }
.contact-card strong { font-family: var(--serif); font-weight: 500; font-size: 1.7rem; color: var(--feny); line-height: 1.2; word-break: break-word; }
.contact-card small { color: var(--muted); font-size: .9rem; }
@media (max-width: 900px) { .contact-cards { grid-template-columns: 1fr; } }

/* Záró CTA: fotó + üvegkártya + INOX tányér */
.closing { position: relative; overflow: hidden; isolation: isolate; padding-block: clamp(40px, 5vw, 68px); }
.closing__bg img { filter: saturate(.8) brightness(.9); }
.closing__bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, var(--grafit) 0%, rgba(23,24,26,.3) 24%, rgba(23,24,26,.38) 76%, var(--grafit) 100%),
    radial-gradient(120% 90% at 50% 50%, transparent 40%, rgba(14,15,17,.6) 100%); }
.closing .wrap { position: relative; z-index: 2; }
/* egyetlen üvegsáv: balra a szöveg, jobbra a gombok, alul egy sorban az elérhetőségek */
.closing__card { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "eyebrow actions" "title actions" "text actions" "contacts contacts";
  column-gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(26px, 3.2vw, 42px) clamp(24px, 3.6vw, 48px); border-radius: var(--r-xl); }
.closing__card .eyebrow { grid-area: eyebrow; margin-bottom: 10px; }
.closing h2 { grid-area: title; font-size: var(--step-3); max-width: 18em; margin-bottom: .2em; }
.closing p:not(.eyebrow) { grid-area: text; color: #c3c8ce; max-width: 40em; margin: 0; font-size: .98rem; }
.closing__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.closing .closing__actions { grid-area: actions; justify-content: flex-end; }
.closing__contacts { grid-area: contacts; display: flex; flex-wrap: wrap; gap: 10px 36px; margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); }
.closing__contacts a { text-decoration: none; display: flex; align-items: baseline; gap: 10px; }
.closing__contacts a span:first-child { color: var(--acel); font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; }
.closing__contacts a span:last-child { font-size: 1rem; color: var(--feny); transition: color .3s; }
.closing__contacts a:hover span:last-child { color: #fff; }
@media (max-width: 900px) {
  .closing__card { grid-template-columns: 1fr; grid-template-areas: "eyebrow" "title" "text" "actions" "contacts"; }
  .closing .closing__actions { justify-content: flex-start; margin-top: 22px; }
}
@media (max-width: 900px) { .closing__actions .btn { flex: 1 1 100%; } }

/* --------------------------------------------------------------------------
   Lábléc – teljes szélességű, szálcsiszolt acél sáv
   -------------------------------------------------------------------------- */
.site-footer { position: relative; z-index: 1; overflow: hidden; isolation: isolate; padding: clamp(36px, 4vw, 52px) 0 18px; font-size: .88rem; color: var(--muted);
  background: radial-gradient(900px 260px at 50% 0%, rgba(255,255,255,.06), transparent 70%), var(--brushed), linear-gradient(180deg, #1f2124, #121315); }
.footer-edge { position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.95), transparent) no-repeat, var(--brushed), var(--steel);
  background-size: 22% 100%, auto, 100% 100%; animation: rail 8s ease-in-out infinite; box-shadow: 0 0 20px rgba(255,255,255,.15); }
.site-footer .wrap { position: relative; }
.footer-grid, .footer-bottom { position: relative; z-index: 1; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 28px 40px; align-items: start; }
.footer-grid h2 { font-family: var(--sans); font-size: .7rem; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; margin-bottom: 12px;
  background: none; color: var(--feny); -webkit-text-fill-color: var(--feny); }
.footer-grid ul { list-style: none; display: grid; grid-template-columns: repeat(2, max-content); gap: 6px 26px; }
.footer-grid li a { text-decoration: none; transition: color .25s; }
.footer-grid li a:hover { color: #fff; }
.footer-brand .logo { margin-bottom: 12px; }
.footer-brand .logo__mark { width: 36px; height: 36px; }
.footer-brand .wordmark__word { height: 17px; }
.footer-brand p { max-width: 26em; margin-bottom: .8em; font-size: .85rem; }
.footer-brand .btn { min-height: 38px; padding: 0 18px; font-size: .8rem; }
/* halvány, óriás L’ARDOR vízjel a lábléc tartalma mögött (a logó felirata) */
.footer-mark { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -52%); z-index: 0; margin: 0; pointer-events: none; user-select: none; white-space: nowrap;
  font-family: var(--serif); font-weight: 600; line-height: 1; letter-spacing: .16em; padding-left: .16em;
  font-size: clamp(5rem, 19vw, 17rem);
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.015)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.footer-mark img { display: block; width: 5.6em; max-width: 96vw; height: auto; opacity: .1;
  -webkit-mask-image: linear-gradient(180deg, #000, rgba(0,0,0,.15)); mask-image: linear-gradient(180deg, #000, rgba(0,0,0,.15)); }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 24px; margin-top: 24px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.09); font-size: .78rem; }
.footer-bottom p { margin: 0; }
.footer-bottom ul { list-style: none; display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.footer-bottom a { text-decoration: none; }
.footer-bottom a:hover { color: #fff; }
.footer-credit { color: rgba(170,176,184,.7); }
@media (max-width: 760px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-grid ul { grid-template-columns: 1fr; }
  .footer-mark { font-size: 16vw; top: 30%; }
}

/* Mobil, ragadós CTA-sáv (fém kapszula) */
.mobile-cta { display: none; }
@media (max-width: 860px) {
  .mobile-cta { position: fixed; z-index: 50; left: 12px; right: 12px; bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
    display: grid; grid-template-columns: 1fr 1fr 1.5fr; gap: 6px; padding: 6px; border-radius: 999px; border: 1px solid transparent;
    /* ugyanaz az üveg + fémes perem, mint a navbaron (görgetett állapotában) */
    background: linear-gradient(rgba(27,29,31,.6), rgba(27,29,31,.6)) padding-box,
                linear-gradient(140deg, rgba(255,255,255,.15), rgba(255,255,255,.05) 45%, rgba(255,255,255,.1)) padding-box,
                var(--rim) border-box;
    -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
    box-shadow: var(--glass-shadow), 0 18px 40px -10px rgba(0,0,0,.7);
    transform: translateY(140%); transition: transform .45s var(--ease); }
  .mobile-cta.is-visible { transform: none; }
  .mobile-cta a { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 48px; border-radius: 999px; text-decoration: none; font-size: .9rem; color: var(--feny); }
  .mobile-cta a.is-primary { background: var(--brushed), var(--silver); color: #17181a; font-weight: 500; box-shadow: inset 0 1px 0 #fff; }
  .mobile-cta svg { width: 17px; height: 17px; }
  body.has-mobile-cta .site-footer { padding-bottom: 100px; }
  .nav-open .mobile-cta { transform: translateY(140%); }
}

/* --------------------------------------------------------------------------
   Tartalmi elemek
   -------------------------------------------------------------------------- */
.formats { list-style: none; display: grid; gap: 12px; }
.format { position: relative; display: grid; grid-template-columns: 1fr 1.4fr; gap: 18px 44px; padding: 30px 30px 32px; border-radius: var(--r-lg); box-shadow: var(--glass-shadow); }
.format h3 { font-size: 1.75rem; transition: transform .6s var(--ease); }
.format::after { content: ""; position: absolute; left: -1px; top: 20%; bottom: 20%; width: 2px; border-radius: 2px; background: var(--silver-v);
  box-shadow: 0 0 14px rgba(255,255,255,.5); transform: scaleY(0); transition: transform .6s var(--ease); }
.format:hover::after { transform: scaleY(1); }
.format:hover h3 { transform: translateX(8px); }
.format__facts { color: var(--acel); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; margin-top: 10px; }
.format p { color: var(--muted); }
@media (max-width: 900px) { .format { grid-template-columns: 1fr; gap: 8px; padding: 24px 22px; } }

.index-list { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.index-list a { display: inline-block; padding: 10px 18px; border-radius: 999px; font-size: .9rem; text-decoration: none; color: var(--ezust); transition: color .25s, transform .3s var(--ease); }
.index-list a:hover { color: #17181a; background: var(--silver-v) padding-box, var(--rim) border-box; transform: translateY(-2px); }

/* minden sor a legmagasabb (kétsoros) elemhez igazodik, így az összes kapszula egyforma */
.allergens { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); grid-auto-rows: 1fr; gap: 10px; }
.allergens li { min-height: 60px; padding: 10px 18px 10px 10px; border-radius: 999px; display: flex; gap: 14px; align-items: center; }
.allergens li span { font-size: .95rem; line-height: 1.3; }
.allergens li { transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.allergens li:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,.22), 0 12px 26px -14px rgba(0,0,0,.85); }
.allergens li span { transition: color .3s; }
.allergens li:hover span { color: var(--feny); }
.allergens li:hover b { box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(0,0,0,.4), 0 0 0 4px rgba(255,255,255,.08), 0 0 18px rgba(255,255,255,.3); }
.allergens b { transition: box-shadow .4s var(--ease); flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 600; font-size: 1.05rem; color: #17181a;
  background: var(--brushed), var(--silver-v); box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(0,0,0,.4); }

.prose { max-width: 76ch; padding: clamp(28px, 5vw, 56px); border-radius: var(--r-xl); }
.prose h2 { font-size: var(--step-2); margin: 2em 0 .6em; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose li { color: var(--ezust); }
.prose ul { padding-left: 1.2em; margin-bottom: 1em; }
.prose li { margin-bottom: .4em; }
.prose a { color: var(--feny); }
.prose__date { margin-top: 2em; color: var(--muted); }
.prose table { width: 100%; border-collapse: collapse; margin: 1em 0 1.6em; font-size: .95rem; }
.prose th, .prose td { text-align: left; padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(255,255,255,.12); vertical-align: top; }
.prose th { color: var(--acel); font-weight: 400; }
.table-scroll { overflow-x: auto; }
.lang-note { display: none; }
html[lang="en"] .lang-note { display: block; margin-bottom: 28px; }

/* --------------------------------------------------------------------------
   Űrlap
   -------------------------------------------------------------------------- */
.field { display: grid; gap: 8px; }
.field > label, .legend { font-size: .9rem; font-weight: 400; letter-spacing: .04em; color: var(--feny); }
.field .hint { color: var(--acel); font-size: var(--step--1); margin: 0; }
.req { color: var(--acel); font-weight: 300; }
.input, select.input, textarea.input {
  width: 100%; min-height: 54px; padding: 14px 18px;
  font: inherit; font-size: 1rem; font-weight: 300; color: var(--feny);
  background-color: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.16); border-radius: var(--r-lg);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.3), 0 1px 0 rgba(255,255,255,.06);
  transition: border-color .25s, box-shadow .25s, background-color .25s; }
textarea.input { min-height: 150px; resize: vertical; line-height: 1.6; }
select.input { -webkit-appearance: none; appearance: none; padding-right: 46px;
  background-image: linear-gradient(45deg, transparent 50%, var(--ezust) 50%), linear-gradient(135deg, var(--ezust) 50%, transparent 50%);
  background-position: calc(100% - 24px) 50%, calc(100% - 18px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
select.input option { background: #2a2d31; color: var(--feny); }

/* Üveg lenyíló lista (main.js: glassSelect) – a natív select rejtve a helyén marad */
.gsel { position: relative; }
.gsel__native { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.gsel__btn { display: flex; align-items: center; text-align: left; cursor: pointer; padding-right: 46px; }
.gsel__btn::after { content: ""; position: absolute; right: 20px; top: 50%; width: 7px; height: 7px; margin-top: -6px;
  border-right: 1.5px solid var(--ezust); border-bottom: 1.5px solid var(--ezust); transform: rotate(45deg); transition: transform .35s var(--ease), margin .35s var(--ease); }
.gsel.is-open .gsel__btn { border-color: rgba(255,255,255,.6); background-color: rgba(255,255,255,.06); box-shadow: 0 0 0 4px rgba(255,255,255,.08), inset 0 1px 2px rgba(0,0,0,.2); }
.gsel.is-open .gsel__btn::after { transform: rotate(225deg); margin-top: -2px; }
.gsel__btn:disabled { opacity: .5; cursor: default; }
.gsel__val { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gsel__list { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 40; list-style: none; margin: 0; padding: 6px; max-height: 300px; overflow-y: auto;
  border-radius: var(--r-lg); border: 1px solid transparent; overscroll-behavior: contain; scrollbar-width: thin;
  background: linear-gradient(160deg, rgba(58,62,68,.86), rgba(24,26,29,.94) 60%) padding-box, var(--rim) border-box;
  -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur);
  box-shadow: var(--glass-shadow), 0 28px 60px -18px rgba(0,0,0,.9);
  transform-origin: 50% 0; animation: gsel-in .24s var(--ease); }
.gsel.is-up .gsel__list { top: auto; bottom: calc(100% + 8px); transform-origin: 50% 100%; }
@keyframes gsel-in { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
.gsel.is-up .gsel__list { animation-name: gsel-up; }
@keyframes gsel-up { from { opacity: 0; transform: translateY(6px) scale(.98); } }
.gsel__list li { position: relative; padding: 11px 40px 11px 14px; border-radius: 10px; color: var(--ezust); font-size: .98rem; line-height: 1.35; cursor: pointer;
  transition: background-color .15s, color .15s; }
.gsel__list li.is-active { background-color: rgba(255,255,255,.1); color: #fff; }
.gsel__list li[aria-selected="true"] { color: var(--feny); font-weight: 400; }
.gsel__list li[aria-selected="true"]::after { content: ""; position: absolute; right: 16px; top: 50%; width: 11px; height: 6px; margin-top: -5px;
  border-left: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); }
.gsel__list li[aria-disabled="true"] { opacity: .4; cursor: default; }
.gsel__btn.input--sm + .gsel__list li { padding-block: 8px; font-size: .92rem; }
.input::placeholder { color: #8b929b; }
.input:hover { border-color: rgba(255,255,255,.3); }
.input:focus { outline: none; border-color: rgba(255,255,255,.6); background-color: rgba(255,255,255,.06); box-shadow: 0 0 0 4px rgba(255,255,255,.08), inset 0 1px 2px rgba(0,0,0,.2); }
.input[aria-invalid="true"] { border-color: var(--error); }
.field__error { color: var(--error); font-size: var(--step--1); margin: 0; }
.field__error:empty { display: none; }
input[type="date"].input { color-scheme: dark; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
@media (max-width: 640px) { .grid-2 { grid-template-columns: 1fr; } }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

.choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 10px; margin-top: 12px; }
.choice { position: relative; }
.choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.choice span { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 16px 18px; border-radius: var(--r-lg); transition: box-shadow .3s, transform .3s var(--ease); }
.choice span strong { color: var(--feny); font-weight: 400; }
.choice span small { color: var(--acel); font-size: var(--step--1); }
.choice input:hover + span { transform: translateY(-1px); }
.choice input:checked + span { background: linear-gradient(140deg, rgba(110,116,124,.55), rgba(60,64,70,.5)) padding-box, var(--silver) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 10px 26px -12px rgba(0,0,0,.6), 0 0 18px rgba(255,255,255,.12); }
.choice input:focus-visible + span { outline: 1px solid var(--feny); outline-offset: 3px; }
.choices--compact { grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); }
.choices--compact span { padding: 13px 16px; flex-direction: row; align-items: center; }

.check { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; font-size: .95rem; cursor: pointer; }
/* „Egyéb allergia:” jelölőnégyzet mellett a látogató maga írja be */
.check-other { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.check-other .check { flex: none; align-items: center; }
.check-other .check input { margin-top: 0; }
.input--inline { flex: 1 1 220px; width: auto; min-height: 44px; padding: 9px 14px; font-size: .95rem; }
.check input { -webkit-appearance: none; appearance: none; width: 22px; height: 22px; margin: 2px 0 0; border: 1px solid rgba(255,255,255,.3); border-radius: 6px;
  background: rgba(0,0,0,.2); display: grid; place-items: center; cursor: pointer; transition: background .25s, border-color .25s; }
.check input::after { content: ""; width: 11px; height: 6px; border-left: 2px solid #17181a; border-bottom: 2px solid #17181a; transform: rotate(-45deg) translate(1px, -1px); opacity: 0; }
.check input:checked { background: var(--silver-v); border-color: #fff; }
.check input:checked::after { opacity: 1; }
.check input[aria-invalid="true"] { border-color: var(--error); }
.check a { color: var(--feny); }

.quote-layout { display: grid; grid-template-columns: 1fr 360px; gap: clamp(24px, 4vw, 56px); align-items: start; }
.quote-card { padding: clamp(24px, 4vw, 52px); border-radius: var(--r-xl); }
.quote-aside { position: sticky; top: 110px; display: grid; gap: 26px; font-size: .95rem; padding: 30px 28px; border-radius: var(--r-xl); }
.quote-aside h2 { font-size: var(--step-2); }
.quote-aside p { color: var(--muted); margin: 0; }
.quote-aside .contact-line { display: flex; flex-direction: column; text-decoration: none; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.12); }
.quote-aside .contact-line span:first-child { color: var(--acel); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; }
.quote-aside .contact-line span:last-child { font-size: var(--step-1); color: var(--feny); }
@media (max-width: 1000px) { .quote-layout { grid-template-columns: 1fr; } .quote-aside { position: static; } }

/* Lépésjelző: fém számkorongok egy sínen; a sín ezüstre telik (--p: 0…1, a form.js állítja),
   a kész lépés pipát kap és visszalépésre kattintható */
.progress { list-style: none; position: relative; display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 0 44px; padding-bottom: 28px; counter-reset: p; --p: 0;
  border-bottom: 1px solid rgba(255,255,255,.12); }
.progress::before, .progress::after { content: ""; position: absolute; top: 21px; left: calc(100% / 6); height: 2px; border-radius: 2px; }
.progress::before { right: calc(100% / 6); background: rgba(255,255,255,.12); }
.progress::after { width: calc(100% / 3 * 2 * var(--p)); background: var(--brushed), var(--steel); background-size: auto, 300% 100%; box-shadow: 0 0 14px rgba(255,255,255,.35);
  transition: width .8s var(--ease); }
.progress li { counter-increment: p; position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center;
  font-size: .85rem; line-height: 1.3; letter-spacing: .04em; color: var(--acel); transition: color .4s; }
.progress li::before { content: counter(p); width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  font-family: var(--serif); font-size: 1.2rem; font-weight: 600; font-variant-numeric: lining-nums; color: var(--ezust);
  border: 1px solid transparent; background: linear-gradient(#1c1e21, #141517) padding-box, var(--rim) border-box;
  box-shadow: 0 0 0 6px rgba(20,21,23,.9), 0 10px 24px -10px rgba(0,0,0,.8);
  transition: color .4s, background .4s, box-shadow .5s var(--ease), transform .4s var(--ease); }
.progress li span { max-width: 14ch; }
.progress li.is-current { color: var(--feny); }
.progress li.is-current::before { color: #17181a; background: var(--brushed), var(--silver-v);
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 4px rgba(0,0,0,.25), 0 0 0 6px rgba(20,21,23,.9), 0 0 0 7px rgba(255,255,255,.2), 0 0 30px rgba(255,255,255,.32); }
.progress li.is-done { color: var(--ezust); cursor: pointer; }
.progress li.is-done::before { color: transparent;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317181a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 18px no-repeat, var(--brushed), var(--silver-v);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 6px rgba(20,21,23,.9); }
.progress li.is-done:hover { color: var(--feny); }
.progress li.is-done:hover::before { transform: scale(1.07); }
.progress li:focus-visible { outline: none; }
.progress li:focus-visible::before { outline: 1px solid var(--feny); outline-offset: 4px; }
@media (max-width: 560px) { .progress { margin-bottom: 32px; padding-bottom: 22px; } .progress li { font-size: .78rem; } }
.no-js .progress { display: none; }

.step { display: grid; gap: 30px; }
.js .step:not(.is-active) { display: none; }
.js .step.is-active { animation: rise .6s var(--ease); }
.step__title { font-size: var(--step-3); line-height: 1.05; }
.no-js .step + .step { margin-top: 64px; padding-top: 48px; border-top: 1px solid rgba(255,255,255,.12); }
.form-nav { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-top: 12px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.12); }
.form-nav .spacer { flex: 1; }
@media (max-width: 560px) { .form-nav .btn { flex: 1 1 auto; } }

.alert { padding: 18px 22px; border-radius: var(--r-lg); background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.2); font-size: .95rem; max-width: none; }
.alert--error { border-color: var(--error); background: rgba(243,165,158,.08); }
.alert--ok { border-color: var(--ok); }
.alert[hidden] { display: none; }
.alert a { color: var(--feny); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.summary { display: grid; grid-template-columns: auto 1fr; gap: 8px 24px; font-size: .95rem; padding: 20px 22px; margin: 0; border-radius: var(--r-lg); }
.summary dt { color: var(--acel); }
.summary dd { margin: 0; color: var(--feny); }

/* Köszönő / 404 / PHP-hibaoldal */
.center-page { position: relative; min-height: 100svh; display: grid; align-items: center; padding: calc(var(--top) + 130px) 0 96px; overflow: hidden; isolation: isolate; }
.center-page h1 { font-size: var(--step-4); margin-bottom: .4em; max-width: 12em; }
.center-page p { color: #c3c8ce; max-width: 36em; }
.center-page .closing__actions { margin-top: 28px; }

/* Ügyvezetés (Rólunk) */
.leaders { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.leader { position: relative; padding: 34px 30px 32px; border-radius: var(--r-xl); text-align: center; box-shadow: var(--glass-shadow); transition: transform .5s var(--ease);
  border: 1px solid transparent; background: var(--glass-fill) padding-box, var(--rim) border-box; }
.leader { transform-style: preserve-3d; }
.leader__photo { transition: transform .8s var(--ease), box-shadow .8s; }
.leader:hover .leader__photo { transform: scale(1.05); box-shadow: 0 0 0 8px rgba(255,255,255,.06), 0 0 46px rgba(255,255,255,.22), 0 18px 40px -14px rgba(0,0,0,.8); }
.leader__photo { width: 200px; height: 200px; margin: 0 auto 24px; border-radius: 50%; padding: 4px; display: grid; place-items: center; overflow: hidden;
  background: var(--brushed), linear-gradient(160deg, #6f767f, #e6eaee 25%, #8a919a 45%, #3a4048 70%, #b9bfc6);
  box-shadow: 0 0 0 6px rgba(255,255,255,.04), 0 18px 40px -14px rgba(0,0,0,.8); color: var(--acel); }
.leader__photo svg, .leader__photo img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; background: radial-gradient(circle at 50% 30%, #3a3e44, #1b1d20); }
.leader__photo svg { padding: 22px; }
.leader h3 { font-size: 1.6rem; margin-bottom: 6px; }
.leader p.leader__role, .leader p.leader__role:last-child { color: var(--acel); font-size: .76rem; letter-spacing: .18em; text-transform: uppercase; margin: 0 auto 16px; }
.leader p:last-child { color: var(--muted); font-size: .95rem; margin: 0 auto; }
/* egy vagy két kártya középre igazítva; a következő sor (pl. rendezvényigazgató) kisebb térközzel alatta */
.leaders--duo { grid-template-columns: repeat(auto-fit, minmax(0, 400px)); justify-content: center; }
.leaders--next { margin-top: 18px; }
/* monogram a portré helyén, amíg nincs fotó */
.leader__mono { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, #3a3e44, #1b1d20);
  font-family: var(--serif); font-size: 2.6rem; font-weight: 500; letter-spacing: .04em; color: var(--feny); }
.leader__contact { display: grid; gap: 4px; margin-top: 4px !important; }
.leader__contact a { color: var(--feny); text-decoration: none; transition: color .25s; }
.leader__contact a:hover { color: #fff; }
/* egy ember: kártya + mellette rövid bemutatkozás, azonos magasságban */
.person { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 18px; max-width: 1000px; margin-inline: auto; }
.person + .person { margin-top: 18px; }
.bio { padding: clamp(28px, 4vw, 44px); border-radius: var(--r-xl); display: flex; flex-direction: column; justify-content: center; }
.bio p { color: #c9cdd2; max-width: none; }
.bio p:last-child { margin-bottom: 0; }
.bio .bio__goal { font-family: var(--serif); font-style: italic; font-size: 1.3rem; line-height: 1.4; color: var(--feny); margin-top: .4em; }
@media (max-width: 900px) { .person { grid-template-columns: 1fr; max-width: 520px; } }
@media (max-width: 900px) { .leaders, .leaders--duo { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; } }

/* Betöltő: a logót ezüst vonal rajzolja meg, a betűk egyenként úsznak be, majd a lap
   redőnyként felcsúszik. Oldalváltáskor a redőny leereszkedik; a következő oldalon
   (html.lq) már csak a rövid felhúzás fut. */
.loader { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; pointer-events: none;
  background: radial-gradient(900px 600px at 50% 45%, #1f2124, #0a0b0c 70%);
  transform: translate3d(0, 0, 0); transition: transform 1s cubic-bezier(.76,0,.24,1);
  animation: loader-auto 0s 3.5s forwards; }
@keyframes loader-auto { to { transform: translate3d(0, -101%, 0); } }
/* fémes alsó perem a redőnyön */
.loader::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent); box-shadow: 0 0 24px 2px rgba(255,255,255,.25); }
.loader__inner { display: grid; justify-items: center; gap: 16px; transition: opacity .45s ease, transform .8s var(--ease); }
.loader__mark { width: 104px; height: 104px; margin-bottom: 4px; overflow: visible; filter: drop-shadow(0 0 10px rgba(255,255,255,.22)); }
/* a logójel részei: előbb a körvonal rajzolódik ki, aztán fémesen kitöltődik */
.lm { stroke: #e9ecef; stroke-width: 3; fill-opacity: 0; stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: lm-draw 1.1s cubic-bezier(.65,0,.35,1) var(--d, 0s) forwards, lm-fill .6s ease calc(var(--d, 0s) + .75s) forwards; }
@keyframes lm-draw { to { stroke-dashoffset: 0; } }
@keyframes lm-fill { to { fill-opacity: 1; stroke-opacity: 0; } }
.loader__word { display: block; width: 200px; height: auto; overflow: visible; }
.loader__word path { opacity: 0; transform: translateY(40px); transform-box: fill-box;
  animation: lw-in .8s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: calc(.55s + var(--i) * .07s); }
@keyframes lw-in { to { opacity: 1; transform: none; filter: none; } }
.loader__sub { font-size: 9px; letter-spacing: .7em; margin-right: -.7em; color: var(--acel); opacity: 0; animation: fade-in .8s 1s forwards; }
@keyframes fade-in { to { opacity: 1; } }
.loader__line { width: 160px; height: 1px; margin-top: 10px; background: rgba(255,255,255,.1); overflow: hidden; border-radius: 1px; }
.loader__line i { display: block; height: 100%; background: linear-gradient(90deg, rgba(255,255,255,.2), #fff); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .5s ease; box-shadow: 0 0 10px rgba(255,255,255,.6); }
/* gyors változat (már látott oldal / oldalváltás): rajzolás és betűzés nélkül */
.lq .lm, .lq .loader__word path, .lq .loader__sub { animation: none; stroke-dashoffset: 0; fill-opacity: 1; stroke-opacity: 0; opacity: 1; transform: none; filter: none; }
.lq .loader__line { opacity: 0; }
/* felhúzás */
.is-loaded .loader { transform: translate3d(0, -101%, 0); }
.is-loaded .loader__inner { opacity: 0; transform: translateY(-40px); }
/* leeresztés oldalváltáskor */
.is-leaving .loader { transform: translate3d(0, 0, 0); animation: none; transition-duration: .38s; }
.is-leaving .loader__inner { opacity: 1; transform: none; transition-delay: .08s; }
/* oldalváltás utáni felhúzás is rövidebb, mint az első látogatás bevezetője */
.lq .loader { transition-duration: .55s; }
.is-leaving .lm, .is-leaving .loader__word path, .is-leaving .loader__sub { animation: none; stroke-dashoffset: 0; fill-opacity: 1; stroke-opacity: 0; opacity: 1; transform: none; filter: none; }
.is-leaving .loader__line { opacity: 0; }
/* a tartalom finoman „felúszik”, amikor a redőny felmegy */
main, .site-footer { transition: opacity .6s ease, transform .9s var(--ease); }
.js:not(.is-loaded) main { transform: translateY(30px); }
.is-leaving main, .is-leaving .site-footer { opacity: .4; transform: translateY(-20px); }
.no-js .loader { display: none; }

/* --------------------------------------------------------------------------
   Görgetésre előtűnő elemek (a JS adja hozzá, majd leveszi)
   -------------------------------------------------------------------------- */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--d, 0s); }
.js .reveal.is-in { opacity: 1; transform: none; }

/* Angol nyelvnél a fordítás betöltéséig nem villan fel a magyar szöveg */
@media (prefers-reduced-motion: reduce) { .i18n-wait body { opacity: 0; animation: i18n-show 0s 1.4s forwards; } }
@keyframes i18n-show { to { opacity: 1; } }

/* Fejlesztői segédlet: ?todo a címben kiemeli a cserélendő helyőrzőket */
.show-todo [data-todo] { outline: 1px dashed #f0c674; outline-offset: 3px; background-color: rgba(240,198,116,.08); }
.show-todo [data-todo]::after { content: " ⚑"; color: #f0c674; font-size: .8em; }

/* Gyengébb gépeken (vagy ha a JS lassú képkockát mér) a díszítő animációk egy része leáll */
.lite .bg__sheen { animation: none; }


@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .js .reveal { opacity: 1; transform: none; }
  .wordmark b, h1 { background-position: 0 0; }
  .loader { display: none; }
  .js:not(.is-loaded) main { transform: none; }
}


/* --- Reszponzív finomhangolás: érintőképernyő, kis kijelző, tablet, fekvő telefon --- */
/* érintőképernyőn a szöveges linkek láthatatlanul nagyobb (~44 px magas) célfelületet kapnak, az aláhúzás nem mozdul */
@media (pointer: coarse) {
  .link { position: relative; }
  .link::before { content: ""; position: absolute; inset: -8px -6px; }
  .closing__contacts a { padding-block: 8px; }
}
@media (max-width: 560px) {
  /* a kis, nagybetűs címkék mobilon sem mennek 12 px alá */
  .steps:not(.steps--vertical) .when, .closing__contacts a span:first-child, .footer-grid h2 { font-size: .75rem; }
  /* a szolgáltatáslista megjegyzése a tétel alá kerül, nem préselődik keskeny oszlopba */
  .segment li { flex-direction: column; gap: 2px; }
  .segment li span:last-child { text-align: left; }
  .closing__contacts { gap: 0 28px; }
}
/* tableten a főoldal 3 referencia-kártyájából a harmadik teljes szélességű, nem marad egyedül fél sorban */
@media (min-width: 641px) and (max-width: 1000px) {
  .cases--home .case:nth-child(3) { grid-column: 1 / -1; min-height: 380px; }
}
/* fekvő telefonon a lenyíló menü két oszlopban, kisebb betűvel fér ki */
@media (max-width: 1240px) and (max-height: 520px) and (orientation: landscape) {
  .panel .menu { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 8px; }
  .panel .menu a.l { font-size: 19px; padding: 9px 16px; }
}


/* --- Fémes apróságok: görgetősáv, címcsillanás, gombnyomás, mágneses gombok, vissza a tetejére, képek érkezése --- */
/* fémes görgetősáv: sötét sínen szálcsiszolt ezüst csúszka (Chrome, Edge, Safari) */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #101113; }
::-webkit-scrollbar-thumb { border: 3px solid #101113; border-radius: 999px; background-clip: padding-box;
  background-image: linear-gradient(90deg, #6f767f, #e6eaee 38%, #a7acb4 62%, #6f767f); }
::-webkit-scrollbar-thumb:hover { background-image: linear-gradient(90deg, #8a9099, #ffffff 38%, #c3c8ce 62%, #8a9099); }
::-webkit-scrollbar-corner { background: #101113; }
/* Firefox: egyszínű ezüst csúszka (színátmenetet nem tud) */
@supports not selector(::-webkit-scrollbar) { html { scrollbar-color: #a9aeb6 #101113; } }

/* címcsillanás: amikor egy cím a képbe ér, egyszer végigfut rajta a fény */
h1.glint, h2.glint { animation: title-glint 1.8s cubic-bezier(.45,0,.2,1) both; }
@keyframes title-glint { 0% { background-position: 25% 0; } 45% { background-position: 100% 0; } 100% { background-position: 25% 0; } }

/* gombnyomás: a gomb fémgombként „besüllyed” és felvillan; a mágneses eltolás (--bx/--by) is ebben a transformban van */
.cta, .btn { transform: translate(var(--bx, 0px), var(--by, 0px)); }
.cta:hover, .btn:hover { transform: translate(var(--bx, 0px), calc(var(--by, 0px) - 1px)); }
/* a benyomás csak a fémes (ezüst kitöltésű) gombokon; az üveggombok a régi, egy pixeles lenyomást tartják */
.btn:not(.btn--ghost):active, .cta:active { transform: translate(var(--bx, 0px), calc(var(--by, 0px) + 1px)) scale(.97); transition-duration: .08s;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.35), inset 0 -1px 0 rgba(255,255,255,.6), 0 0 0 4px rgba(255,255,255,.08), 0 0 26px rgba(230,234,238,.35); filter: brightness(1.06); }
.btn--ghost:active { transform: translateY(1px); }

/* vissza a tetejére: csak asztali gépen; ezüst kör, körben a görgetés haladásával */
.to-top { display: none; }
@media (hover: hover) and (pointer: fine) and (min-width: 861px) {
  .to-top { display: grid; place-items: center; position: fixed; right: 26px; bottom: 26px; z-index: 55; width: 54px; height: 54px; padding: 0; border-radius: 50%; cursor: pointer;
    border: 1px solid transparent; color: var(--feny);
    background: linear-gradient(rgba(27,29,31,.6), rgba(27,29,31,.6)) padding-box, linear-gradient(140deg, rgba(255,255,255,.15), rgba(255,255,255,.05) 45%, rgba(255,255,255,.1)) padding-box, var(--rim) border-box;
    -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); box-shadow: var(--glass-shadow);
    opacity: 0; visibility: hidden; transform: translateY(14px) scale(.9);
    transition: opacity .4s, visibility .4s, transform .5s var(--ease), box-shadow .4s; }
  .to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
  .to-top:hover { box-shadow: var(--glass-shadow), 0 0 0 1px rgba(255,255,255,.2), 0 0 26px rgba(255,255,255,.2); }
  .to-top:hover .to-top__arrow { transform: translateY(-3px); }
  .to-top:active { transform: scale(.94); }
  .to-top__arrow { width: 18px; height: 18px; transition: transform .35s var(--ease); }
  .to-top__ring { position: absolute; inset: -1px; width: calc(100% + 2px); height: calc(100% + 2px); transform: rotate(-90deg); pointer-events: none; }
  .to-top__ring circle { fill: none; stroke: url(#tt-silver); stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: var(--tt, 1);
    filter: drop-shadow(0 0 3px rgba(255,255,255,.45)); }
  .nav-open .to-top { opacity: 0; visibility: hidden; }
}

/* képek érkezése: a fotó elmosott, sötétebb fátyol mögül élesedik ki, amikor a képbe ér és betöltött */
.case figure::before, .mosaic figure::before, .feature__media::before {
  content: ""; position: absolute; pointer-events: none; z-index: 0; border-radius: inherit;
  inset: 0; background: rgba(18,19,21,.55); opacity: 0; transition: opacity 1.2s cubic-bezier(.3,.7,.2,1); }
.feature__media::before { inset: 6px; border-radius: calc(var(--r-xl) - 6px); }
/* a drága háttér-elmosás csak várakozás és kiélesedés alatt él, utána a réteg teljesen kikapcsol */
.img-pending::before, .img-fading::before { -webkit-backdrop-filter: blur(14px) saturate(.6); backdrop-filter: blur(14px) saturate(.6); }
.img-pending::before { opacity: 1 !important; transition: none !important; }

@media print {
  .nav, .bg, .mobile-cta, .scroll-progress, .to-top, .hero__bg, .page-hero__bg, .photo-band__bg, .closing__bg, .footer-mark { display: none !important; }
  body { background: #fff; color: #000; }
  h1, h2 { color: #000; background: none; }
}