/* Sziget Étterem Zalakaros – filmes one-page · „Az ízek, a barátok, a család, a jó hangulat szigete.”
   Dizájn: „Kék abrosz & naplemente” – a gerendás terem királykék, apró fehér virágos abrosza, a mézszínű fenyőgerendák, a logó
   naplemente-narancsa, a csárda vörös teteje, este a szilvalila bálfény.
   Kontraszt-szabály (mérve, tools/contrast*.mjs): sötét (éjkék/királykék/gerenda/pálmazöld) felületen a szöveg --papir / --naplemente /
   --mez-vil; papíron --ink / --kek-mely / --gerenda-mely; a --naplemente, --mez, --parazs papíron CSAK dekor (szövegként nem). */
/* magyarra szűkített betűk (tools/fonts-subset.mjs – Google Fonts text= részhalmaz; új karakternél futtasd újra) */
@font-face{font-family:Anton;src:url(../fonts/anton-hu.woff2) format('woff2');font-display:swap}
@font-face{font-family:'Kaushan Script';src:url(../fonts/kaushan-hu.woff2) format('woff2');font-display:swap}
@font-face{font-family:'EB Garamond';font-weight:400 600;src:url(../fonts/garamond-hu.woff2) format('woff2');font-display:swap}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400 600;src:url(../fonts/garamond-i-hu.woff2) format('woff2');font-display:swap}
@font-face{font-family:Figtree;font-weight:400 700;src:url(../fonts/figtree-hu.woff2) format('woff2');font-display:swap}

:root{
  --ej:#0E1531; --ej-2:#141C3F; --kek:#22389A; --kek-mely:#172670; --kek-vil:#8FA3F0; --papir:#F6F0E4; --papir-2:#EFE6D3; --porcelan:#FBF8F2;
  --mez:#C9853E; --mez-vil:#E7B06C; --gerenda:#6E4322; --gerenda-mely:#4A2C16; --naplemente:#F2A33A; --parazs:#E4572E; --csarda:#A3312A;
  --palma:#2F5B3C; --palma-vil:#8CC49A; --szilva:#5B2A6E; --szilva-vil:#C99BDB; --ink:#141A33; --muted:#4B4F66;
  --display:Anton,Impact,'Arial Narrow',sans-serif; --script:'Kaushan Script','Segoe Script','Brush Script MT',cursive;
  --serif:'EB Garamond',Garamond,'Palatino Linotype',Palatino,serif; --body:Figtree,system-ui,-apple-system,'Segoe UI',sans-serif;
  --e-big:cubic-bezier(.76,0,.24,1); --e-soft:cubic-bezier(.25,.46,.45,.94); --e-in:cubic-bezier(.16,1,.3,1); --e-pop:cubic-bezier(.34,1.56,.64,1);
  --pad:clamp(20px,4vw,64px);
  /* a kék virágos abrosz mintája (a gerendás terem abroszai) – az index.html #abrosz SVG-mintájával azonos */
  --abrosz:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44'%3E%3Cg fill='%23F6F0E4' fill-opacity='.9'%3E%3Ccircle cx='6' cy='7' r='1.1'/%3E%3Ccircle cx='8.6' cy='5.6' r='1.1'/%3E%3Ccircle cx='9.6' cy='8.3' r='1.1'/%3E%3Ccircle cx='7.2' cy='10' r='1.1'/%3E%3Ccircle cx='5' cy='9.4' r='1.1'/%3E%3Ccircle cx='28' cy='29' r='1.1'/%3E%3Ccircle cx='30.6' cy='27.6' r='1.1'/%3E%3Ccircle cx='31.6' cy='30.3' r='1.1'/%3E%3Ccircle cx='29.2' cy='32' r='1.1'/%3E%3Ccircle cx='27' cy='31.4' r='1.1'/%3E%3Ccircle cx='30' cy='9' r='.8'/%3E%3Ccircle cx='16' cy='21' r='.8'/%3E%3Ccircle cx='40' cy='19' r='.8'/%3E%3Ccircle cx='12' cy='36' r='.8'/%3E%3Ccircle cx='21' cy='3' r='.6'/%3E%3Ccircle cx='38' cy='40' r='.6'/%3E%3C/g%3E%3Cg fill='%23F2C86A'%3E%3Ccircle cx='7.4' cy='7.9' r='.7'/%3E%3Ccircle cx='29.4' cy='29.9' r='.7'/%3E%3C/g%3E%3C/svg%3E");
  /* az abrosz hullámos szegélye (szekcióelválasztó – a papír szekció TETEJÉN, a saját dobozán belül) */
  --szegely:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='22' viewBox='0 0 64 22'%3E%3Cpath d='M0 0H64V8C56 8 56 20 48 20S40 8 32 8 24 20 16 20 8 8 0 8Z' fill='%2322389A'/%3E%3Cpath d='M0 8C8 8 8 20 16 20S24 8 32 8 40 20 48 20 56 8 64 8' fill='none' stroke='%23F6F0E4' stroke-width='1.2' stroke-dasharray='2 3' stroke-opacity='.7' transform='translate(0 -3)'/%3E%3C/svg%3E");
  --szegely-ej:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='22' viewBox='0 0 64 22'%3E%3Cpath d='M0 0H64V8C56 8 56 20 48 20S40 8 32 8 24 20 16 20 8 8 0 8Z' fill='%230E1531'/%3E%3C/svg%3E");
  /* finom papírszemcse */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg fill='%23141A33' fill-opacity='.045'%3E%3Ccircle cx='14' cy='22' r='1.2'/%3E%3Ccircle cx='78' cy='60' r='1'/%3E%3Ccircle cx='40' cy='96' r='.9'/%3E%3Ccircle cx='110' cy='14' r='1'/%3E%3Ccircle cx='122' cy='112' r='1.2'/%3E%3Ccircle cx='60' cy='128' r='.8'/%3E%3Ccircle cx='96' cy='88' r='.8'/%3E%3C/g%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--ej);-webkit-text-size-adjust:100%;overscroll-behavior-y:none}
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}
body{margin:0;background:var(--papir);color:var(--ink);font:400 clamp(15px,1.02vw,17.5px)/1.62 var(--body)}
@supports (overflow-x:clip){body{overflow-x:clip}}
@supports not (overflow-x:clip){body{overflow-x:hidden}}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,h4,h5{margin:0;font-weight:400}
p{margin:0}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.nw{white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--papir);color:var(--ink);padding:10px 16px;border-radius:999px;font-weight:700}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--naplemente);outline-offset:3px;border-radius:6px}
:is(.journey,.etlap,.reviews,.marquee,.play) :focus-visible{outline-color:var(--kek)}

/* display-sorok: Anton + magyar ékezet – felső belső margó az overflow-hidden alatt (az Á/É/Ő/Ű ne vágódjon) */
.line{display:block;overflow:hidden;padding-block-start:.17em;margin-block-start:-.17em;line-height:1.1}
.line>span{display:block}
html.js .reveal .line>span{transform:translateY(150%);transition:transform 1s var(--e-in)}
html.js .reveal.is-in .line>span{transform:none}
html.js .reveal .line:nth-child(2)>span{transition-delay:.09s}
html.js .reveal .line:nth-child(3)>span{transition-delay:.18s}
html.js .rise{transform:translateY(40px);opacity:0;transition:transform .9s var(--e-in),opacity .9s var(--e-soft)}
html.js .rise.is-in{transform:none;opacity:1}

/* ---------- gombok ---------- */
.pill{display:inline-flex;align-items:center;gap:.55em;min-height:46px;padding:12px 22px;border-radius:999px;border:2px solid transparent;
  font:700 12.5px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;white-space:nowrap;
  transition:transform .35s var(--e-pop),background-color .3s,color .3s,border-color .3s}
.pill:hover{transform:translateY(-2px) rotate(-1.5deg)}
.pill--sun{background:var(--naplemente);color:var(--ink)}
.pill--sun:hover{background:#FFBA55}
.pill--light{background:var(--papir);color:var(--ink)}
.pill--light:hover{background:#fff}
.pill--ink{background:var(--ej);color:var(--papir)}
.pill--ghost{border-color:rgba(246,240,228,.82);color:var(--papir);background:rgba(14,21,49,.5)}
.pill--ghost:hover{background:rgba(14,21,49,.86)}
.pill--ghost-dark{border-color:var(--ink);color:var(--ink)}

/* ---------- fejléc (transform/backdrop-filter TILOS – a háttér a ::before-on) ---------- */
.head{position:fixed;top:0;left:0;right:0;z-index:50;color:var(--papir)}
.head__bar{position:relative;display:flex;align-items:center;gap:clamp(12px,2vw,28px);padding:12px var(--pad)}
.head__bar::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(14,21,49,.84),rgba(14,21,49,0));transition:background-color .4s;z-index:-1}
.head.is-solid .head__bar::before{background:rgba(14,21,49,.95)}
.head__logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--papir)}
.head__img{width:48px;height:48px;border-radius:50%;flex:none;box-shadow:0 0 0 2px rgba(246,240,228,.5)}
.head__word{display:flex;flex-direction:column;font:400 30px/1 var(--script);color:var(--papir);padding-top:2px}
.head__word small{font:700 9.5px/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--naplemente);margin-top:5px}
.head__logo.logo-in :is(.head__img,.head__word){animation:logoIn .9s var(--e-in) both}
@keyframes logoIn{from{transform:scale(1.2) translateY(-4px)}to{transform:none}}
.head__nav{display:flex;gap:clamp(14px,2vw,30px);margin-left:auto}
.head__nav a{text-decoration:none;font:700 11.5px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:8px 0;position:relative}
.head__nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--naplemente);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--e-soft)}
.head__nav a:hover::after{transform:none}
.head__open{font:700 12px/1.2 var(--body);letter-spacing:.04em;white-space:nowrap}
[data-open].is-open::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#8FD66E;margin-right:8px;box-shadow:0 0 0 4px rgba(143,214,110,.22);vertical-align:1px}
[data-open].is-closed::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#FF8A7B;margin-right:8px;vertical-align:1px}
.head__cta{min-height:42px;padding:10px 18px;letter-spacing:.06em}
.burger{display:none;width:46px;height:46px;border-radius:50%;border:2px solid rgba(246,240,228,.6);background:transparent;position:relative;flex:none}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:var(--papir);transition:transform .3s}
.burger span:first-child{top:17px}.burger span:last-child{top:25px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:45;background:var(--ej);display:flex;flex-direction:column;justify-content:center;gap:2px;padding:90px var(--pad) 40px;overflow:auto}
.mnav::before{content:"";position:absolute;inset:auto 0 0 0;height:30%;background:var(--abrosz) var(--kek);opacity:.35;pointer-events:none;mask-image:linear-gradient(transparent,#000)}
.mnav a{position:relative;font:400 clamp(40px,11vw,70px)/1.12 var(--display);text-transform:uppercase;color:var(--papir);text-decoration:none;letter-spacing:.01em}
.mnav a:nth-child(2n){color:var(--naplemente)}
.mnav .mnav__cta{font:700 16px/1.3 var(--body);color:var(--mez-vil);margin-top:12px;text-transform:none;letter-spacing:0}
.notice{display:flex;align-items:center;gap:14px;padding:9px var(--pad);background:var(--naplemente);color:var(--ink);font:700 13px/1.4 var(--body)}
.notice__txt{flex:1}
.notice__txt b{text-transform:uppercase;letter-spacing:.08em;margin-right:6px}
.notice__x{flex:none;width:32px;height:32px;border-radius:50%;border:1.5px solid rgba(20,26,51,.5);background:transparent;color:var(--ink)}

/* ---------- haladássáv (a pálmás sziget a fején) + kurzor ---------- */
.progress{position:fixed;left:0;top:0;right:0;height:3px;z-index:60;pointer-events:none}
.progress i{position:absolute;left:0;top:0;bottom:0;width:100%;background:linear-gradient(90deg,var(--kek),var(--pc,var(--naplemente)));transform:scaleX(var(--p,0));transform-origin:left;transition:background-color .6s}
.progress__head{position:absolute;top:-8px;left:calc(var(--p,0) * (100% - 20px));width:20px;height:20px;border-radius:50%;background:var(--papir);color:var(--ej);box-shadow:0 2px 6px rgba(0,0,0,.35);opacity:clamp(0,calc(var(--p,0) * 60),1);padding:2px}
.progress__head svg{width:100%;height:100%;display:block}
.cursor{position:fixed;left:0;top:0;z-index:90;pointer-events:none;display:none}
@media (hover:hover) and (pointer:fine){.cursor{display:block}}
.cursor span{position:absolute;left:-14px;top:-14px;width:28px;height:28px;border-radius:50%;border:1.5px solid rgba(242,163,58,.95);
  display:grid;place-items:center;font:700 9px/1 var(--body);letter-spacing:.12em;color:var(--ink);transition:width .35s var(--e-soft),height .35s var(--e-soft),left .35s var(--e-soft),top .35s var(--e-soft),background-color .3s,border-color .3s}
.cursor.is-big span{width:84px;height:84px;left:-42px;top:-42px;background:rgba(246,240,228,.95);border-color:transparent;box-shadow:inset 0 0 0 5px var(--porcelan),inset 0 0 0 7px rgba(34,56,154,.45)}

/* =====================================================================================
   NYITÓANIMÁCIÓ – „Terítés” (az állapotokat az intro.js a saját órájából számolja; a CSS alapállapota a VÉGÁLLAPOT,
   a kezdő rejtések csak .intro--anim alatt)
   ===================================================================================== */
.intro__cv,.intro__gl,.intro__fg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.intro__stage{position:absolute;inset:0;z-index:4;pointer-events:none}
.iplate{position:absolute;left:var(--cx,50%);top:var(--cy,57%);width:var(--pd,min(62vmin,440px));aspect-ratio:1;translate:-50% -50%}
.iplate__svg{display:block;width:100%;height:100%;overflow:visible;transform-origin:50% 50%}
.iplate__ring{font:400 25px var(--script);fill:#22389A;letter-spacing:.02em}
.ip-island,.ip-palm{stroke:#0E1531;stroke-width:9;stroke-linejoin:round;stroke-linecap:round}
.intro--anim .iplate__svg,.intro--anim .ip-sun,.intro--anim .ip-island,.intro--anim .ip-palm{opacity:0}
.intro--anim :is(.ip-island,.ip-palm){stroke-dasharray:1 1;stroke-dashoffset:1;fill-opacity:0}
.intro--anim .ip-napkin{opacity:0}
.intro--anim .iplate__ring tspan{fill-opacity:0}
.iplate__name{position:absolute;left:50%;bottom:calc(100% + var(--pd,300px) * .03);translate:-50% 0;display:flex;flex-direction:column;align-items:center;white-space:nowrap}
.iplate__word{display:flex;overflow:hidden;padding-top:.17em;margin-top:-.17em;font:400 var(--wf,15vh)/1 var(--display);letter-spacing:.02em;text-transform:uppercase;color:var(--papir);transform-origin:50% 50%;text-shadow:0 2px 24px rgba(14,21,49,.35)}
.iplate__word span{display:inline-block}
.intro--anim .iplate__word span{transform:translateY(118%)}
.iplate__sub{margin-top:.7em;padding-left:.44em;font:700 clamp(11px,1.4vmin,15px)/1 var(--body);letter-spacing:.44em;text-transform:uppercase;color:var(--naplemente)}
.intro--anim .iplate__sub{opacity:0}
.intro__pk{position:absolute;left:0;top:0;opacity:0;color:#0E1531;clip-path:circle(57.9% at 50.35% 43.5%);transform-origin:50% 50%;overflow:hidden}
.intro__skip{position:absolute;right:var(--pad);bottom:28px;z-index:6;background:rgba(14,21,49,.4);border:1.5px solid rgba(246,240,228,.5);color:var(--papir);border-radius:999px;padding:10px 18px;font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase}
.intro.is-gone{display:none!important}
.intro.is-fade{transition:opacity .35s var(--e-soft);opacity:0}
.intro.is-end{transition:opacity .4s linear;opacity:0}
/* tisztán CSS-es vészkijárat: ha a JS elakadna, 12 s után az oldal mindenképp látszik */
html.js.intro-on .intro{animation:introBail .3s 12s forwards}
@keyframes introBail{to{opacity:0;visibility:hidden}}
/* az intró alatt a fejléc eleme és a haladássáv rejtve (a FLIP-célpont mérhető marad), a végén beúsznak */
.head__nav,.head__open,.head__cta,.burger,.progress,.head__bar::before{transition:opacity .6s var(--e-soft)}
.head__logo{transition:opacity .25s}
html.js.intro-on :is(.head__nav,.head__open,.head__cta,.burger,.progress){opacity:0}
html.js.intro-on .head__bar::before{opacity:0}
html.js.intro-on:not(.intro-logo) .head__logo{opacity:0}
/* a hero sorai az intró végén beúsznak (animáció, nem kezdő rejtés → az LCP nem késik; az LCP-kivágáson NINCS átlátszóság-belépő) */
html.hero-in .ch--hero :is(.hero__meta,.hero__small,.hero__name,.hero__lead,.hero__cta){animation:heroUp 1s var(--e-in) both}
html.hero-in .ch--hero .hero__name{animation-delay:.06s}
/* ha az intró lefutott, a „SZIGET” szót az intró repíti a helyére (FLIP) – ott nincs saját belépő */
html.intro-played.hero-in .ch--hero .hero__name{animation:none}
html.hero-in .ch--hero .hero__lead{animation-delay:.18s}
html.hero-in .ch--hero .hero__cta{animation-delay:.26s}
html.hero-in .ch--hero .hero__word{animation:heroWord 1.4s .05s var(--e-in) both}
html.hero-in .ch--hero .hero__script{animation:heroScript 1.1s .3s var(--e-in) both}
html.hero-in .hero__float .fl--back{animation:floatIn 1.2s .1s var(--e-in) both}
html.hero-in .hero__float .fl--g{animation:floatIn 1.3s .22s var(--e-in) both}
@keyframes heroUp{from{transform:translateY(60px)}}
@keyframes heroWord{from{transform:translateX(-8%);opacity:0}}
@keyframes heroScript{from{transform:translate(-40px,40px) rotate(-12deg)}to{transform:rotate(-6deg)}}
@keyframes floatIn{from{translate:0 90px}}

/* =====================================================================================
   A FILM
   ===================================================================================== */
.film{position:relative;background:var(--ej);height:600svh}
.film__stage{position:sticky;top:0;height:100svh;overflow:hidden;color:var(--papir);touch-action:none}
@supports not (height:100svh){.film__stage{height:100vh}}
.film__canvas,.film__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film.has-canvas .film__poster{visibility:hidden}
.film__shade{position:absolute;inset:0;pointer-events:none}
.film__shade>.sh{position:absolute;inset:0;opacity:0;transition:opacity .9s var(--e-soft);will-change:opacity}
/* a fátylak a tárgyak helyéhez igazítva (videok/film/checkpointok): C0 a lámpás + teríték balra, a világos gerendás terem jobbra ·
   C1 a leves / C2 a tál a kép alsó felében · C3 a kehely középen-balra · C4/C5 a poharak középen, fent sötét bál-bokeh */
.film[data-c="0"] .sh--r,.film:is([data-c="1"],[data-c="2"],[data-c="4"]) .sh--t,.film:is([data-c="3"],[data-c="5"]) .sh--rr{opacity:1}
.sh--r{background:radial-gradient(62% 96% at 82% 50%,rgba(10,15,36,.9),rgba(10,15,36,.6) 58%,rgba(10,15,36,.12) 90%),linear-gradient(rgba(10,15,36,.55),transparent 24%,transparent 72%,rgba(10,15,36,.6))}
.sh--t{background:linear-gradient(rgba(10,15,36,.92),rgba(10,15,36,.76) 30%,rgba(10,15,36,.42) 46%,rgba(10,15,36,.1) 58%,transparent 66%)}
.sh--rr{background:radial-gradient(46% 90% at 90% 50%,rgba(10,15,36,.92),rgba(10,15,36,.55) 60%,rgba(10,15,36,0) 92%),linear-gradient(rgba(10,15,36,.5),transparent 26%)}
.sh--b{background:linear-gradient(transparent 38%,rgba(10,15,36,.8) 64%,rgba(10,15,36,.96))}
.film__note{position:absolute;right:var(--pad);bottom:6px;font:700 10px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;opacity:.8;z-index:3}

/* fejezetek */
.ch{position:absolute;z-index:2;max-width:min(max(520px,36vw),86vw);text-shadow:0 1px 10px rgba(10,15,36,.6)}
.ch__title,.hero__title{text-shadow:none}
html.js .ch{pointer-events:none;visibility:hidden}
html.js .ch.is-on{pointer-events:auto;visibility:visible}
.ch--r{right:calc(var(--pad) + 40px);top:50%;transform:translateY(-46%);text-align:right;max-width:min(max(440px,30vw),86vw)}
.ch--r .pill{margin-left:auto}
.ch--c5{right:calc(var(--pad) + 30px);top:clamp(88px,11vh,124px);max-width:min(46vw,760px);text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.ch__meta,.hero__meta{font:700 11.5px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--naplemente);margin-bottom:10px;display:inline-block;padding:7px 14px;border-radius:999px;background:rgba(10,15,36,.9);text-shadow:none}
.ch--r .ch__meta{margin-left:auto}
.ch__title{font:400 clamp(92px,11vw,196px)/1 var(--display);text-transform:uppercase;letter-spacing:.01em;color:var(--papir);position:relative;margin-top:.06em}
.ch--c5 .ch__title{font-size:clamp(64px,7vw,128px);display:flex;flex-direction:column;align-items:flex-end}
.ch--r .ch__title{font-size:clamp(80px,8.4vw,150px)}
.ch__title .line{width:max-content;max-width:none}
.ch--r .ch__title{display:flex;flex-direction:column;align-items:flex-end}
.ch__script,.hero__script{display:block;font:400 clamp(34px,3.3vw,58px)/1.15 var(--script);color:var(--naplemente);text-transform:none;letter-spacing:0;margin-top:-.15em;transform:rotate(-6deg);text-shadow:0 2px 16px rgba(10,15,36,.9)}
.ch--r .ch__script{margin-right:.2em}
.ch--night .ch__script{color:var(--szilva-vil)}
.ch__script--c5{margin-top:.1em}
.ch__text{font:500 clamp(16px,1.15vw,19px)/1.55 var(--body);margin-top:20px;max-width:30em}
.ch[data-ch="2"] .ch__text{font-family:var(--serif);font-size:clamp(18px,1.3vw,22px);font-style:italic}
.ch--r .ch__text,.ch--r .ch__small{margin-left:auto}
.ch--c5 .ch__text{margin-top:14px}
.ch__small{font:700 14px/1.5 var(--body);margin-top:10px;max-width:30em;color:var(--mez-vil)}
.ch__open{margin-top:14px;font:700 13px/1.3 var(--body);letter-spacing:.06em;display:inline-block;padding:6px 12px;border-radius:999px;background:rgba(10,15,36,.84);text-shadow:none}
.ch__open:empty{display:none}
.ch .pill{margin-top:22px}
.ch__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;margin-top:22px}
.ch__cta .pill{margin-top:0}
.ch::before{content:"";position:absolute;z-index:-1;inset:-22% -30% -26% -30%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(10,15,36,.86),rgba(10,15,36,.62) 45%,rgba(10,15,36,.26) 75%,rgba(10,15,36,0))}
.ch--c5::before{inset:-30% -16% -30% -24%;background:radial-gradient(closest-side,rgba(10,15,36,.84),rgba(10,15,36,.45) 60%,rgba(10,15,36,0))}
.ch--hero::before{display:none}
html.js .ch:not(.is-on)::before{opacity:0}
html.js .ch::before{transition:opacity .6s var(--e-soft)}
html.js .ch .line>span,html.js .ch .ch__script,html.js .ch .ch__meta,html.js .ch .ch__text,html.js .ch .ch__small,html.js .ch .ch__open,html.js .ch .pill,html.js .ch .ch__cta{transition:transform .8s var(--e-in),opacity .6s var(--e-soft)}
html.js .ch:not(.is-on) .line>span{transform:translateY(150%)}
html.js .ch:not(.is-on) .ch__script{transform:translateY(40%) rotate(-6deg);opacity:0}
html.js .ch:not(.is-on) :is(.ch__meta,.ch__text,.ch__small,.ch__open,.pill,.ch__cta){transform:translateY(24px);opacity:0}
html.js .ch.is-on .ch__script{transition-delay:.14s}
html.js .ch.is-on :is(.ch__text,.ch__small){transition-delay:.21s}
html.js .ch.is-on :is(.ch__open,.pill,.ch__cta){transition-delay:.28s}
/* C1, C2, C4: az étel a kép alsó felében → a szöveg fent, vízszintes sávban (cím | szöveg) */
@media (min-width:781px){
  .ch--top{top:clamp(84px,10.5vh,120px);transform:none;max-width:min(76vw,1120px);display:grid;grid-template-columns:auto minmax(0,26em);grid-template-areas:"meta meta" "title text" "title small" "title cta";column-gap:clamp(24px,3vw,52px);align-items:end}
  .ch--tl{left:var(--pad)}
  .ch--tr{right:calc(var(--pad) + 30px);grid-template-columns:minmax(0,26em) auto;grid-template-areas:"meta meta" "text title" "small title" "cta title"}
  .ch--tr .ch__meta{justify-self:end}
  .ch--tr .ch__title{align-items:flex-end;text-align:right}
  .ch--top .ch__meta{grid-area:meta;justify-self:start}
  .ch--top .ch__title{grid-area:title;font-size:clamp(84px,8.6vw,160px);display:flex;flex-direction:column}
  .ch--top .ch__text{grid-area:text;margin-top:0}
  .ch--top .ch__small{grid-area:small}
  .ch--top .pill{grid-area:cta;justify-self:start;margin-top:14px}
  .ch--top::before{inset:-40% -14% -46% -14%}
  .ch[data-ch="2"] .ch__title{font-size:clamp(74px,7.2vw,136px)}
}

/* HERO (C0) – a szövegblokk jobbra (balra a lámpás és a teríték): meta / ritkított szlogen / óriás SZIGET (mögötte kontúros ÉTTEREM) /
   kézírás / „Várunk szeretettel!” / gombok */
.ch--hero{inset:0;max-width:none;padding:84px var(--pad) 0}
.hero__block{position:absolute;right:var(--pad);top:calc(50% + 10px);transform:translateY(-50%);width:min(44vw,720px);z-index:3;display:flex;flex-direction:column;align-items:flex-start}
.hero__title{position:relative;display:block;width:100%;color:var(--papir);margin-top:.3em}
.hero__small{display:block;font:700 clamp(12px,.95vw,15px)/1.45 var(--body);text-transform:uppercase;letter-spacing:.3em;color:var(--papir);margin-bottom:clamp(4px,.8vw,12px);max-width:30em}
.hero__word{display:none;position:absolute;left:-4%;top:20%;font:400 clamp(120px,12vw,236px)/1 var(--display);letter-spacing:.03em;color:transparent;-webkit-text-stroke:2px rgba(246,240,228,.3);z-index:-1;white-space:nowrap}
.hero__name{display:block;font:400 clamp(140px,15.4vw,300px)/1 var(--display);text-transform:uppercase;letter-spacing:.02em;color:var(--papir);padding-top:.17em;margin-top:-.17em;margin-left:-.03em}
/* fix sormagasság: a kézírásos betű késői cseréje ne tolja el a lenti sorokat (CLS) */
.hero__script{position:relative;margin:-.28em 0 0 auto;width:fit-content;font-size:clamp(34px,3.2vw,58px);color:var(--naplemente);white-space:nowrap;height:1.25em;line-height:1.25em}
.hero__lead{font:500 clamp(18px,1.4vw,24px)/1.4 var(--serif);font-style:italic;margin-top:clamp(12px,2vh,22px);max-width:28em}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero__meta{align-self:flex-start}
.hero__corner{position:absolute;left:var(--pad);bottom:clamp(24px,5vh,54px);font:700 11px/1.7 var(--body);letter-spacing:.18em;text-transform:uppercase;z-index:6;padding:10px 16px;border-radius:14px;background:rgba(10,15,36,.84)}
.hero__badges{position:absolute;right:var(--pad);bottom:clamp(24px,5vh,54px);display:flex;flex-direction:column;align-items:flex-end;gap:8px;z-index:3}
.badge{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;background:rgba(10,15,36,.88);font:700 12px/1.2 var(--body);letter-spacing:.05em;text-shadow:none}
.hero__scroll{position:absolute;left:50%;bottom:clamp(20px,3vh,34px);transform:translateX(-50%);display:flex;align-items:center;gap:12px;font:700 11px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;opacity:.94;z-index:3;text-shadow:0 1px 8px rgba(10,15,36,.8)}
.hero__scroll i{width:26px;height:40px;border:2px solid rgba(246,240,228,.8);border-radius:14px;position:relative}
.hero__scroll i::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;border-radius:2px;background:var(--papir);transform:translateX(-50%);animation:wheelScroll 1.8s var(--e-soft) infinite}
@keyframes wheelScroll{0%{transform:translate(-50%,0);opacity:1}70%{transform:translate(-50%,12px);opacity:0}100%{opacity:0}}
/* lebegő, mélységi rétegek – az AI-val újrarajzolt ételek (a szó előtt ÉS mögött) + fűszerek, gyümölcsök */
.hero__float{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero__float .fl{position:absolute;will-change:transform}
.fl--1{left:39%;top:12%;width:clamp(96px,8.6vw,160px);filter:blur(2.6px) brightness(.7);opacity:.95;animation:turn 60s linear infinite}
.fl--2{right:2.5%;top:13%;width:clamp(44px,3.6vw,68px);filter:blur(3px) brightness(.62);opacity:.9}
.fl--3{left:40%;bottom:-3%;width:clamp(150px,13.6vw,264px);z-index:4;animation:sway 7s ease-in-out infinite;transform-origin:50% 90%}
.fl--g{z-index:5;animation:bob 8s ease-in-out infinite}
.fl--dio{left:47%;top:31%;width:clamp(30px,2.6vw,48px);rotate:-20deg}
.fl--pet{right:5%;bottom:22%;width:clamp(38px,3.2vw,60px);rotate:25deg;animation-delay:-3s}
.fl--eper{left:37%;top:58%;width:clamp(34px,2.8vw,52px);rotate:-12deg;animation-delay:-5s}
.fl--pap{right:9%;top:30%;width:clamp(30px,2.4vw,46px);rotate:40deg;animation-delay:-2s;filter:blur(1.2px)}
@keyframes sway{0%,100%{rotate:-3deg;translate:0 0}50%{rotate:3deg;translate:0 -12px}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes turn{to{rotate:360deg}}
.film:not([data-c="0"]) .hero__float>*{opacity:0;transition:opacity .5s}

/* fejezet-pöttyök: apró tányérok (kék peremmel), az aktív a naplemente-napocska */
.dots{position:absolute;right:calc(var(--pad) * .5 - 5px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:3px;z-index:5}
.dots button{width:24px;height:24px;padding:0;border:0;background:none;position:relative}
.dots button::before{content:"";position:absolute;left:5px;top:5px;width:14px;height:14px;border-radius:50%;background:rgba(246,240,228,.3);box-shadow:inset 0 0 0 2px rgba(246,240,228,.2);transition:background-color .3s,transform .4s var(--e-pop),box-shadow .3s}
.dots button.is-on::before{background:radial-gradient(circle,#FFD84A 0 30%,#F2A33A 34% 52%,var(--porcelan) 56%);box-shadow:inset 0 0 0 1.5px var(--kek);transform:scale(1.5)}
.dots button.is-wait::before{animation:breathe .9s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.8)}}
html.film-var .film__stage{cursor:progress}

/* tartalék: állóképek egymás alatt (reduced-motion / saveData / canvas nélkül / JS nélkül) */
.film.is-static,html:not(.js) .film{height:auto}
.film.is-static .film__stage,html:not(.js) .film .film__stage{position:relative;height:auto;overflow:visible}
.film.is-static :is(.film__canvas,.film__poster,.film__shade,.dots),html:not(.js) .film :is(.film__canvas,.film__poster,.film__shade,.dots){display:none}
.film.is-static .ch,html:not(.js) .film .ch{position:relative;visibility:visible;pointer-events:auto;inset:auto;transform:none;max-width:none;min-height:88svh;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:120px var(--pad) 80px;background-size:cover;background-position:center;text-align:left;isolation:isolate}
.film.is-static .ch::before,html:not(.js) .film .ch::before{display:block;inset:0;opacity:1;background:linear-gradient(90deg,rgba(10,15,36,.9),rgba(10,15,36,.45))}
.film.is-static .ch *,html:not(.js) .film .ch *{transform:none!important;opacity:1!important}
.film.is-static .ch--hero,html:not(.js) .film .ch--hero{min-height:100svh}
:is(.film.is-static,html:not(.js) .film) .hero__block{position:relative;right:auto;top:auto;width:auto;max-width:760px}
.film.is-static .ch__cta,html:not(.js) .film .ch__cta{justify-content:flex-start}
:is(.film.is-static,html:not(.js) .film) .ch--r :is(.ch__text,.ch__small,.pill,.ch__meta){margin-left:0}
:is(.film.is-static,html:not(.js) .film) :is(.ch--r,.ch--tr) .ch__title{align-items:flex-start;text-align:left}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="0"]{background-image:url(../film/d/0000.webp)}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="1"]{background-image:url(../film/d/0275.webp)}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="2"]{background-image:url(../film/d/0562.webp)}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="3"]{background-image:url(../film/d/0842.webp)}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="4"]{background-image:url(../film/d/1115.webp)}
:is(.film.is-static,html:not(.js) .film) .ch[data-ch="5"]{background-image:url(../film/d/1147.webp)}
:is(.film.is-static,html:not(.js) .film) :is(.hero__float,.hero__scroll,.film__note,.hero__word){display:none}
:is(.film.is-static,html:not(.js) .film) :is(.hero__badges,.hero__corner){position:static;margin-top:18px;align-items:flex-start}
:is(.film.is-static,html:not(.js) .film) .ch--top{display:flex}

/* =====================================================================================
   FUTÓSZALAG (abroszfehér papír, mint a referencia törtfehérje) – elválasztó: kis lemenő nap a szigettel
   ===================================================================================== */
.marquee{background:var(--papir) var(--grain);padding:clamp(40px,6vw,90px) 0 clamp(30px,4vw,60px);overflow:hidden;position:relative}
.marquee__row{display:flex;white-space:nowrap}
.marquee__track{display:flex;animation:mq 56s linear infinite;will-change:transform}
.marquee__row--fill .marquee__track{animation-duration:48s;animation-direction:reverse}
.marquee__track span{display:flex;align-items:center;font:400 clamp(76px,11.6vw,214px)/1.14 var(--display);text-transform:uppercase;padding-right:.3em;letter-spacing:.01em}
.marquee__row--out span{color:transparent;-webkit-text-stroke:2px var(--kek)}
.marquee__row--fill span{color:var(--ink);font:500 clamp(30px,4vw,70px)/1.2 var(--serif);font-style:italic;text-transform:none;letter-spacing:0}
.marquee__track i{position:relative;display:inline-block;width:.42em;height:.42em;margin:0 .38em;flex:none;border-radius:50%;overflow:hidden;
  background:linear-gradient(transparent 62%,var(--kek) 62%),radial-gradient(circle at 50% 70%,#FFD84A 0 30%,#F2A33A 31% 44%,#E4572E 45% 52%,transparent 53%)}
.marquee__row--fill i{width:.62em;height:.62em}
.anim-off .marquee__track,.anim-off .hero__float>*,.anim-off .journey__obj,.film:not([data-c="0"]) .hero__float>*{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}

/* =====================================================================================
   A HŐSTÁRGY ÚTJA + KIJELENTÉS – papír; a végén a kék virágos abrosz, amire a tányér leérkezik
   ===================================================================================== */
.journey{position:relative;background:var(--papir) var(--grain);padding:0 var(--pad) clamp(80px,10vw,160px);min-height:200vh}
.journey__sticky{position:sticky;top:12vh;height:0;display:flex;justify-content:center;z-index:3;pointer-events:none}
.journey__obj{width:clamp(220px,24vw,420px);height:auto;align-self:flex-start;animation:turn 44s linear infinite;filter:drop-shadow(0 26px 30px rgba(20,26,51,.28))}
.journey.is-landed .journey__obj{animation:land .7s var(--e-in) both,turn 44s .7s linear infinite}
@keyframes land{0%{transform:translateY(-18px) scale(1.02)}55%{transform:translateY(0) scale(1.03,.95)}100%{transform:none}}
.statement{position:relative;z-index:2;max-width:1640px;margin:0 auto;padding-top:clamp(70px,11vw,170px);font:400 clamp(58px,7vw,140px)/1.08 var(--display);text-transform:uppercase;color:var(--ink)}
.statement>span{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(220px,26vw,460px);padding-block:.04em}
.statement .st-l,.statement .st-r{white-space:nowrap}
.statement .st-l{text-align:right}
.statement .st-l,.statement .st-r{display:block;transition:transform 1s var(--e-in)}
.statement em{font-style:normal;color:var(--kek)}
.st-row--b em{color:var(--csarda)}
html.js .journey .st-l{transform:translateX(var(--open-l,0))}
html.js .journey .st-r{transform:translateX(var(--open-r,0))}
.notes{list-style:none;padding:0;margin:clamp(30px,4vw,60px) auto 0;max-width:1100px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px 34px;position:relative;z-index:2}
.notes li{font:400 clamp(26px,2.4vw,42px)/1.25 var(--script);color:var(--kek-mely);transform:rotate(-3deg)}
.notes li:nth-child(2){transform:rotate(2deg);color:var(--gerenda)}
.notes li:nth-child(3){color:var(--csarda)}
.journey__sub{position:relative;z-index:2;text-align:center;max-width:30em;margin:clamp(30px,4vw,56px) auto 0;font:500 clamp(24px,2vw,34px)/1.35 var(--serif);font-style:italic;color:var(--ink)}
.journey__sub footer{margin-top:8px;font:700 12px/1 var(--body);font-style:normal;letter-spacing:.24em;text-transform:uppercase;color:var(--kek-mely)}
.journey__in{position:relative}
.journey__land{position:relative;max-width:1100px;margin:clamp(360px,56vh,600px) auto 0;height:26px}
/* a kék virágos abrosz csíkja, amire a tányér leérkezik (hullámos, öltött szegéllyel) */
.journey__cloth{position:absolute;left:50%;top:0;width:clamp(320px,40vw,660px);height:26px;transform:translateX(-50%);border-radius:4px;
  background:var(--abrosz) 0 0/44px 44px,var(--kek);box-shadow:0 14px 26px rgba(20,26,51,.28),inset 0 -3px 0 rgba(10,15,36,.3),inset 0 2px 0 rgba(246,240,228,.18)}
.journey__cloth::after{content:"";position:absolute;left:8px;right:8px;top:5px;border-top:1.5px dashed rgba(246,240,228,.6)}
.stamp{display:block;position:relative;width:clamp(130px,11vw,180px);aspect-ratio:1}
.stamp>svg{width:100%;height:100%;overflow:visible}
.stamp circle{fill:var(--kek-mely)}
.stamp .stamp__in{fill:var(--porcelan);stroke:rgba(34,56,154,.6);stroke-width:1.5}
.stamp text{font:700 13px var(--body);letter-spacing:.12em;fill:var(--papir)}
.stamp svg svg{color:var(--ej)}
.journey__stamp{position:absolute;right:max(4%,calc(50% - 470px));top:-160px;transform:scale(2.4) rotate(-20deg);opacity:0}
.journey.is-landed .journey__stamp{animation:stampIn .5s .35s var(--e-pop) both}
@keyframes stampIn{0%{transform:scale(2.4) rotate(-20deg);opacity:0}60%{transform:scale(.94) rotate(-4deg);opacity:1}100%{transform:scale(1) rotate(-8deg);opacity:1}}
.journey__burst{position:absolute;left:50%;bottom:0;width:min(1200px,100vw);height:560px;transform:translateX(-50%);pointer-events:none}

/* =====================================================================================
   SZIGET TÁL 2 FŐRE – a játékos szekció (naplemente-narancs, gerenda-csíkokkal; a referencia sárga blokkja)
   ===================================================================================== */
.play{position:relative;background:var(--naplemente);color:var(--ink);padding:clamp(90px,11vw,170px) var(--pad) clamp(150px,14vw,230px);overflow:hidden;display:flex;flex-direction:column}
.play::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(-32deg,transparent 0 120px,rgba(110,67,34,.12) 120px 136px),radial-gradient(60% 50% at 50% 0%,rgba(255,216,74,.45),transparent 70%)}
/* a szekció alja a következő füstjébe olvad */
.play::after{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(110px,12vw,200px);background:linear-gradient(rgba(14,21,49,0),rgba(14,21,49,.55) 45%,var(--ej));pointer-events:none;z-index:1}
.play__stk{position:absolute;inset:0;pointer-events:none;z-index:3}
.play.has-physics .stk{pointer-events:auto;cursor:grab}
.play.has-physics:not(.is-running) .stk{visibility:hidden}
.play.is-dragging .stk{cursor:grabbing}
.stk{position:absolute;display:inline-flex;align-items:center;justify-content:center;padding:11px 22px 12px;border-radius:999px;background:var(--papir);color:var(--ink);
  font:700 clamp(15px,1.15vw,19px)/1 var(--body);letter-spacing:.02em;white-space:nowrap;box-shadow:0 10px 22px rgba(60,30,10,.28);user-select:none;top:0;left:0;will-change:transform;border:2px solid var(--ink)}
.stk--sun{background:#FFD27A}
.stk--blue{background:var(--kek);color:var(--papir);border-color:var(--kek-mely)}
.stk--red{background:var(--csarda);color:var(--papir);border-color:var(--csarda)}
.stk--night{background:var(--ej);color:var(--naplemente);border-color:var(--ej)}
.stk--paper{background:var(--porcelan)}
.stk--round{width:128px;height:128px;padding:14px;border-radius:50%;white-space:normal;text-align:center;line-height:1.1}
.stk--frame{background:var(--papir-2);border:3px solid var(--ink);border-radius:6px;font:400 clamp(20px,1.6vw,27px)/1.1 var(--display);letter-spacing:.05em;text-transform:uppercase;padding:12px 18px 10px}
.stk--script{font:400 clamp(24px,2vw,34px)/1.2 var(--script);letter-spacing:0;background:var(--ej);color:var(--papir);padding:10px 24px;border-color:var(--ej)}
/* formai matricák: fehér tányér kék peremmel, kék virágos abroszdarab, a pálmás sziget */
.stk--plate{width:120px;height:120px;padding:0;border-radius:50%;border:0;background:radial-gradient(circle,var(--porcelan) 0 52%,#E9E3D8 56%,var(--porcelan) 60% 90%,var(--kek) 91% 93%,var(--porcelan) 94%);box-shadow:0 12px 22px rgba(60,30,10,.32)}
.stk--plate-s{width:82px;height:82px}
.stk--cloth{width:120px;height:92px;padding:0;border-radius:6px;border:0;background:var(--abrosz) 0 0/44px 44px,var(--kek);box-shadow:0 10px 18px rgba(20,26,51,.32),inset 0 0 0 5px var(--kek-mely),inset 0 0 0 7px rgba(246,240,228,.55)}
.stk--island{width:112px;height:112px;padding:14px;border-radius:50%;border:0;background:var(--porcelan);color:var(--ej);box-shadow:0 12px 22px rgba(60,30,10,.32),inset 0 0 0 4px var(--kek)}
.stk--island svg{width:100%;height:100%}
.stk--img{padding:0;border-radius:0;background:none;box-shadow:none;width:clamp(130px,11vw,190px);height:auto;border:0}
.stk--img-s{width:clamp(110px,9vw,160px)}
.stk--img-xs{width:clamp(56px,4.4vw,76px)}
/* statikus matricarács (mobil / reduced-motion / fizika előtt) */
.play:not(.has-physics) .play__stk{position:relative;inset:auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;max-width:1100px;margin:44px auto 0;order:3;z-index:2}
.play:not(.has-physics) .stk{position:relative;rotate:var(--r,0deg)}
.play:not(.has-physics) .stk:nth-child(3n){--r:-5deg}.play:not(.has-physics) .stk:nth-child(3n+1){--r:4deg}.play:not(.has-physics) .stk:nth-child(3n+2){--r:-2deg}
.play:not(.has-physics) .stk--img{width:110px}.play:not(.has-physics) .stk--img-s{width:96px}.play:not(.has-physics) .stk--img-xs{width:54px}
.play__head{position:relative;z-index:2;text-align:center;margin-bottom:clamp(40px,5vw,70px);order:1;background:var(--papir);border:3px solid var(--ink);border-radius:28px;padding:clamp(22px,3vw,44px) clamp(22px,4vw,70px);align-self:center;box-shadow:10px 12px 0 var(--kek)}
.play__kicker{display:inline-block;font:700 12px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;background:var(--kek);color:var(--papir);padding:8px 16px;border-radius:999px;margin-bottom:14px}
.play__title{font:400 clamp(58px,7.6vw,146px)/1.05 var(--display);text-transform:uppercase;color:var(--ink)}
.play__title .line>span{display:inline-block}
.play__title .alt{background:var(--kek);color:var(--papir);padding:.06em .22em 0;border-radius:.06em;margin-top:.06em}
.play__script{display:table;margin:.35em auto 0;font:400 clamp(26px,2.4vw,42px)/1.2 var(--script);color:var(--csarda);transform:rotate(-3deg)}
.play__cards{position:relative;z-index:2;order:2;display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,30px);max-width:1200px;margin:0 auto;width:100%}
.pc{background:var(--porcelan);border-radius:22px;padding:clamp(24px,3vw,44px);position:relative;box-shadow:0 20px 40px rgba(60,30,10,.22);border:3px solid var(--ink)}
.pc__k{font:700 12px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--kek-mely)}
.pc h3{font:400 clamp(32px,3vw,54px)/1.08 var(--display);text-transform:uppercase;color:var(--ink);margin:.3em 0 .35em}
.pc p{font:500 16px/1.6 var(--body)}
.pc a{font-weight:700}
.pc--dark{background:var(--ej);color:var(--papir)}
.pc--dark h3{color:var(--naplemente)}
.pc--dark .pc__k{color:var(--mez-vil)}
.pc--dark a{color:var(--naplemente)}
.play__note{position:relative;z-index:2;order:4;text-align:center;margin-top:28px;font:600 12.5px/1.5 var(--body)}

/* =====================================================================================
   AZ ÉTLAP ÍZVILÁGAI – füst (a füst AI-val, Google Flow-val készült)
   ===================================================================================== */
.flavors{position:relative;background:var(--ej);color:var(--papir)}
.flavors__stage{position:relative}
.flavors.is-stepper .flavors__stage{position:sticky;top:0;height:100svh;overflow:hidden}
.flv{position:relative;min-height:100svh;display:grid;grid-template-columns:1fr minmax(320px,36vw) 1fr;align-items:center;gap:clamp(30px,4vw,80px);padding:clamp(100px,11vw,150px) var(--pad);overflow:hidden;isolation:isolate}
.is-stepper .flv{position:absolute;inset:0;min-height:0;opacity:0;visibility:hidden;transition:opacity .9s var(--e-soft),visibility 0s .9s}
.is-stepper .flv.is-on{opacity:1;visibility:visible;transition:opacity .9s var(--e-soft),visibility 0s}
.flv__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.flv::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(62% 72% at 50% 50%,rgba(10,15,36,.3),rgba(10,15,36,.84))}
.flv__word{position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);font:400 clamp(130px,19vw,360px)/1 var(--display);text-transform:uppercase;color:transparent;-webkit-text-stroke:2px rgba(246,240,228,.44);white-space:nowrap;z-index:-1;pointer-events:none;letter-spacing:.02em}
.is-stepper .flv .flv__word{transition:transform 1.1s var(--e-in),opacity .9s}
.is-stepper .flv:not(.is-on) .flv__word{transform:translate(-50%,-40%) scale(.96);opacity:0}
.flv__pick{position:absolute;left:50%;top:clamp(84px,10vw,120px);transform:translateX(-50%);z-index:4;font:700 11.5px/1 var(--body);letter-spacing:.22em;text-transform:uppercase;padding:10px 18px;border-radius:999px;background:rgba(10,15,36,.88);white-space:nowrap}
.flavors:not(.is-stepper) .flv__pick{position:relative;left:auto;top:auto;transform:none;display:table;margin:0 auto;white-space:normal;text-align:center;max-width:calc(100% - 40px);line-height:1.4}
.flavors:not(.is-stepper) .flavors__stage{padding-top:90px;background:var(--ej)}
.flv__stagebox{grid-column:2;position:relative;aspect-ratio:1;display:grid;place-items:center}
.flv__center{position:relative;width:62%;display:grid;place-items:center}
.flv__photo{width:100%;height:auto;max-height:62svh;object-fit:contain;animation:sway 8s ease-in-out infinite;transform-origin:50% 90%}
.flv__center.is-spin .flv__photo{animation:turn 50s linear infinite}
.flv--este .flv__center{width:44%}
.flv__note{position:absolute;left:var(--pad);right:var(--pad);bottom:20px;z-index:4;font:600 11.5px/1.5 var(--body);opacity:.92;text-align:center}
.flavors:not(.is-stepper) .flv__note{position:relative;left:auto;right:auto;bottom:auto;padding:10px var(--pad) 60px}
.flv__ring{position:absolute;inset:0;pointer-events:none;animation:orbit 120s linear infinite}
/* a keringő „tányérok”: fehér porcelán, kék peremcsíkkal */
.flv__ring button{position:absolute;min-width:clamp(84px,6.4vw,112px);max-width:clamp(84px,6.4vw,112px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:0;padding:12px;pointer-events:auto;background:var(--porcelan);color:var(--ink);
  box-shadow:inset 0 0 0 5px var(--porcelan),inset 0 0 0 7px rgba(34,56,154,.55),0 10px 22px rgba(0,0,0,.35);
  font:700 clamp(12px,.9vw,14.5px)/1.1 var(--body);letter-spacing:.01em;display:grid;place-items:center;align-content:center;animation:orbit 120s linear infinite reverse;transition:scale .3s var(--e-pop),background-color .3s,color .3s;overflow-wrap:anywhere;hyphens:auto}
.flv__ring button:hover,.flv__ring button[aria-pressed="true"]{scale:1.14}
.flv__ring button[aria-pressed="true"]{background:var(--naplemente);box-shadow:inset 0 0 0 5px var(--naplemente),inset 0 0 0 7px var(--ink),0 10px 22px rgba(0,0,0,.35)}
@keyframes orbit{to{rotate:360deg}}
.anim-off :is(.flv__ring,.flv__ring button,.flv__photo,.fl--3,.fl--1){animation-play-state:paused}
.flv:nth-of-type(odd) .flv__info{grid-column:3}
.flv:nth-of-type(even) .flv__info{grid-column:1;grid-row:1;text-align:right}
.flv:nth-of-type(even) .flv__stagebox{grid-row:1}
.flv__info h3{font:400 clamp(56px,5.6vw,104px)/1.05 var(--display);text-transform:uppercase;padding-top:.1em}
.flv__info h3 span{display:block;font:700 .15em/1 var(--body);letter-spacing:.3em;opacity:.92;margin-top:.45em}
.flv__script{display:block;font:400 clamp(28px,2.5vw,44px)/1.2 var(--script);color:var(--naplemente);text-transform:none;margin-bottom:.1em;transform:rotate(-4deg);text-shadow:0 2px 14px rgba(0,0,0,.6)}
.flv--sult .flv__script{color:#FF9F7A}.flv--desszert .flv__script{color:var(--mez-vil)}.flv--este .flv__script{color:var(--szilva-vil)}
.flv__lead{margin-top:12px;max-width:30em;font:500 15px/1.55 var(--body)}
.flv:nth-of-type(even) .flv__lead{margin-left:auto}
.flv__list{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:6px;max-width:34em}
.flv:nth-of-type(even) .flv__list{margin-left:auto;justify-content:flex-end}
.flv__list li{padding:7px 12px;border-radius:999px;background:rgba(10,15,36,.74);font:600 13px/1.2 var(--body)}
.flv__list b{color:var(--naplemente);font-weight:700;margin-left:4px;white-space:nowrap}
.is-stepper .flv__list{display:none}
.flv__detail{margin-top:16px;max-width:30em;min-height:7.4em}
.flv:nth-of-type(even) .flv__detail{margin-left:auto}
.flv__detail:empty{display:none}
.flv__detail p{font:500 16px/1.45 var(--serif);font-style:italic;margin-top:4px}
.flv__detail b{display:block;font:400 clamp(30px,2.4vw,42px)/1.12 var(--display);text-transform:uppercase;letter-spacing:.02em;color:var(--papir)}
.flv__price{display:inline-block;margin-top:6px;font:400 26px/1 var(--display);letter-spacing:.03em;color:var(--naplemente);font-variant-numeric:tabular-nums}
.flv__detail .al{margin-left:10px;vertical-align:4px}
.flv__detail small{display:block;margin-top:6px;font:700 11px/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;opacity:.9}
.flv-dots{position:absolute;right:calc(var(--pad) * .5);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:5}
.flavors:not(.is-stepper) .flv-dots{display:none}
.flv-dots button{width:24px;height:24px;padding:4px;border:0;border-radius:50%;background:rgba(246,240,228,.3) content-box;transition:background-color .3s,scale .3s}
.flv-dots button:nth-child(1).is-on{background:var(--naplemente)}.flv-dots button:nth-child(2).is-on{background:var(--parazs)}.flv-dots button:nth-child(3).is-on{background:var(--mez)}.flv-dots button:nth-child(4).is-on{background:#B45CD6}
.flv-dots button.is-on{scale:1.35}

/* =====================================================================================
   ÉTLAP – abroszfehér papír, a nyomtatott étlap antikvája, kék szegély
   ===================================================================================== */
.etlap{background:var(--papir) var(--grain);padding:clamp(100px,11vw,160px) var(--pad);position:relative}
.etlap::before,.reviews::before,.marquee::before{content:"";position:absolute;left:0;right:0;top:0;height:22px;background:var(--szegely-ej) 0 0/64px 22px repeat-x;pointer-events:none}
.marquee::before{background-image:var(--szegely)}
.etlap__head{max-width:1200px;margin:0 auto clamp(28px,4vw,52px);text-align:center;display:flex;flex-direction:column;align-items:center}
.etlap__title{font:400 clamp(120px,17vw,300px)/1 var(--display);text-transform:uppercase;color:var(--ink)}
.etlap__title .line{line-height:1}
.etlap__script{display:block;font:400 clamp(28px,2.8vw,48px)/1.2 var(--script);color:var(--kek);transform:rotate(-3deg);margin-top:-.05em;text-transform:none}
.lang{display:inline-flex;gap:4px;margin-top:22px;padding:4px;border-radius:999px;border:2px solid var(--ink)}
.lang button{min-width:48px;min-height:40px;border:0;border-radius:999px;background:transparent;font:700 12.5px/1 var(--body);letter-spacing:.14em;color:var(--ink)}
.lang button[aria-pressed="true"]{background:var(--kek);color:var(--papir)}
.etlap__body{max-width:1300px;margin:0 auto}
.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:clamp(24px,3vw,40px)}
.tabs button{border:2px solid var(--ink);background:transparent;border-radius:999px;padding:11px 18px;font:700 12px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);min-height:44px}
.tabs button[aria-selected="true"]{background:var(--kek);border-color:var(--kek);color:var(--papir)}
html.js .panel[data-hidden]{display:none}
.panel+.panel{margin-top:60px}
html.js .panel+.panel{margin-top:0}
.panel__title{font:400 clamp(48px,4.6vw,78px)/1.1 var(--display);text-transform:uppercase;color:var(--ink);margin:0 0 22px;text-align:center}
html.js .panel__title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.blks{columns:2 480px;column-gap:clamp(20px,3vw,50px)}
.blks:has(>.blk:only-child){columns:1;max-width:760px;margin:0 auto}
.blk{break-inside:avoid;position:relative;background:var(--porcelan);border:1.5px solid rgba(20,26,51,.14);border-top:6px solid var(--kek);border-radius:6px 6px 20px 20px;padding:clamp(20px,2.2vw,32px);margin:0 0 clamp(18px,2vw,28px);box-shadow:0 14px 30px rgba(20,26,51,.06)}
.blk__img{float:right;width:clamp(96px,9vw,140px);aspect-ratio:4/5;object-fit:cover;border-radius:50% 50% 14px 14px;margin:0 0 10px 16px;border:3px solid var(--porcelan);box-shadow:0 10px 22px rgba(20,26,51,.18);rotate:3deg}
.blk__t{font:400 clamp(30px,2.5vw,42px)/1.1 var(--display);text-transform:uppercase;color:var(--ink);letter-spacing:.01em}
.blk__t em{display:block;font:700 11.5px/1.35 var(--body);letter-spacing:.12em;color:var(--kek-mely);font-style:normal;margin-top:6px;text-transform:uppercase}
.blk__t--sm{font-size:clamp(24px,1.9vw,30px);margin-top:26px}
.blk__note{margin-top:8px;font:500 italic 16px/1.45 var(--serif);color:var(--muted)}
.its{list-style:none;margin:10px 0 0;padding:0}
.it{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;column-gap:8px;padding:10px 0;border-bottom:1px solid rgba(20,26,51,.12)}
.it__n{font:500 19px/1.3 var(--serif);color:var(--ink)}
.it--hi .it__n{font-weight:600}
.it__dots{border-bottom:2px dotted rgba(20,26,51,.26);transform:translateY(-4px);min-width:12px}
.it__p{font:600 19px/1 var(--serif);color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums;text-align:right}
.it__d{grid-column:1/-1;font:400 italic 15.5px/1.45 var(--serif);color:var(--muted);margin-top:3px}
.it__s{grid-column:1/-1;font:600 11px/1.35 var(--body);letter-spacing:.08em;text-transform:uppercase;color:#5A5F78;margin-top:3px}
/* allergén-jelölés: kis kék karikák (G glutén · T tej · L laktóz) */
.al{display:inline-flex;gap:3px;vertical-align:2px;margin-left:4px}
.al i{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--kek);color:var(--kek-mely);font:700 9.5px/1 var(--body);font-style:normal}
.flv__detail .al i{border-color:var(--naplemente);color:var(--naplemente)}
.notes-list{margin:12px 0 0;padding-left:18px;font:500 15px/1.55 var(--body);color:var(--ink)}
.notes-list li+li{margin-top:7px}
.notes-list .is-quote{font-weight:700}
.legend{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font:500 14px/1.4 var(--body)}
.legend i{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--kek);color:var(--kek-mely);font:700 11px/1 var(--body);font-style:normal;margin-right:4px}
.pages{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:12px}
.pages button{position:relative;padding:0;border:0;background:var(--papir-2);border-radius:6px;overflow:hidden;aspect-ratio:160/226;box-shadow:0 6px 14px rgba(20,26,51,.14);transition:transform .35s var(--e-pop)}
.pages button:hover{transform:translateY(-3px) rotate(-2deg)}
.pages img{width:100%;height:100%;object-fit:cover}
.pages span{position:absolute;right:5px;bottom:5px;min-width:22px;height:22px;border-radius:50%;background:var(--kek);color:var(--papir);font:700 11px/22px var(--body);text-align:center}
.etlap__price{max-width:780px;margin:clamp(20px,3vw,34px) auto 0;text-align:center;font:600 15px/1.6 var(--body);color:var(--ink)}

/* =====================================================================================
   BÁLOK & ZENÉS ESTEK – este: éjkék, szilvalila bál-bokeh
   ===================================================================================== */
.events{position:relative;background:var(--ej);color:var(--papir);padding:clamp(90px,11vw,170px) var(--pad);overflow:hidden;isolation:isolate}
.events::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 8% 14%,rgba(180,92,214,.5) 0 6px,transparent 18px),radial-gradient(circle at 18% 24%,rgba(242,163,58,.35) 0 9px,transparent 26px),radial-gradient(circle at 86% 10%,rgba(180,92,214,.45) 0 7px,transparent 20px),
  radial-gradient(circle at 72% 18%,rgba(201,133,62,.35) 0 12px,transparent 32px),radial-gradient(circle at 94% 30%,rgba(180,92,214,.32) 0 8px,transparent 24px),radial-gradient(70% 40% at 50% 0%,rgba(91,42,110,.55),transparent 70%)}
.events__head{max-width:1400px;margin:0 auto clamp(30px,4vw,56px)}
.events__title{font:400 clamp(84px,11vw,210px)/1.05 var(--display);text-transform:uppercase}
.events__title .line:nth-child(2)>span{color:transparent;-webkit-text-stroke:2px var(--naplemente)}
.events__script{font:400 clamp(28px,2.8vw,50px)/1.2 var(--script);color:var(--szilva-vil);transform:rotate(-3deg);margin-top:.1em}
.events__lead{margin-top:30px;max-width:46em;font:500 clamp(16px,1.2vw,19px)/1.6 var(--body)}
.events__body{max-width:1400px;margin:0 auto}
.evs{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(18px,2.4vw,36px);align-items:start}
.ev{display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2vw,30px);padding:clamp(22px,2.6vw,40px);border-radius:26px;background:var(--ej-2);border:1.5px solid rgba(246,240,228,.14);box-shadow:12px 14px 0 rgba(91,42,110,.9)}
.ev--soon{box-shadow:12px 14px 0 rgba(242,163,58,.75)}
.ev__date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:clamp(96px,8vw,128px);aspect-ratio:1;border-radius:50%;background:var(--porcelan);color:var(--ink);box-shadow:inset 0 0 0 6px var(--porcelan),inset 0 0 0 8px var(--kek);text-align:center}
.ev__date b{font:400 clamp(40px,3.6vw,56px)/1 var(--display)}
.ev__date span{font:700 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--kek-mely)}
.ev__date small{font:600 9.5px/1.2 var(--body);letter-spacing:.06em;margin-top:3px;color:var(--muted)}
.ev__k{font:700 11.5px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--naplemente)}
.ev h3{font:400 clamp(40px,3.8vw,68px)/1.08 var(--display);text-transform:uppercase;margin-top:6px}
.ev__sub{font:400 clamp(22px,1.8vw,30px)/1.25 var(--script);color:var(--szilva-vil);margin-top:2px}
.ev__price,.ev__time{list-style:none;margin:16px 0 0;padding:0}
.ev__price li,.ev__time li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid rgba(246,240,228,.16);font:600 15px/1.35 var(--body)}
.ev__price b{font:400 26px/1 var(--display);letter-spacing:.03em;color:var(--naplemente);font-variant-numeric:tabular-nums;white-space:nowrap}
.ev__time b{font-variant-numeric:tabular-nums;white-space:nowrap}
.ev__menus{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}
.ev__menus>div{padding:14px 16px;border-radius:16px;background:rgba(246,240,228,.06);border:1px solid rgba(246,240,228,.12)}
.ev__menus h4{font:700 12px/1.2 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--naplemente)}
.ev__menus p{margin-top:6px;font:500 italic 16px/1.45 var(--serif)}
.ev__pre{margin-top:16px;font:600 14px/1.5 var(--body)}
.ev__pre b{display:inline-block;padding:7px 12px;border-radius:999px;background:var(--naplemente);color:var(--ink)}
.ev__tel{margin-top:12px;font:600 14px/1.5 var(--body);opacity:.95}
.ev__tba{margin-top:12px;display:inline-block;padding:7px 12px;border-radius:999px;border:1.5px solid var(--naplemente);color:var(--naplemente);font:700 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase}
.ev--soon p:not([class]){margin-top:12px;font:500 15px/1.55 var(--body)}
.ev__poster{margin-top:16px;border:2px solid rgba(246,240,228,.7);background:transparent;border-radius:999px;padding:11px 18px;font:700 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--papir);min-height:44px}
.ev__poster:hover{background:rgba(246,240,228,.1)}
.evs__none{font:500 17px/1.6 var(--body);max-width:40em}
.evs__volt{margin-top:26px;font:700 12px/1.6 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--mez-vil)}
.events__photos{max-width:1400px;margin:clamp(40px,5vw,80px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px)}
.events__photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:22px}
.events__photos img:nth-child(2){margin-top:clamp(30px,4vw,70px);border-radius:50% 50% 22px 22px}
.events__foot{max-width:1400px;margin:28px auto 0;font:600 14px/1.6 var(--body);opacity:.95}
.events__foot a{color:var(--naplemente);font-weight:700}

/* =====================================================================================
   A HELY – mézszínű fenyőgerenda (sötét fa)
   ===================================================================================== */
.place{position:relative;background:var(--gerenda-mely);color:var(--papir);padding:clamp(90px,11vw,170px) var(--pad);display:grid;grid-template-columns:minmax(280px,.9fr) 1.4fr;gap:clamp(30px,5vw,80px);align-items:start;overflow:hidden}
.place::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(201,133,62,.07) 0 3px,transparent 3px 90px),radial-gradient(60% 60% at 0% 0%,rgba(242,163,58,.16),transparent 70%)}
.place>*{position:relative}
.place__head{position:sticky;top:120px}
.place__title{font:400 clamp(70px,7.6vw,146px)/1.05 var(--display);text-transform:uppercase}
.place__script{display:block;margin-top:.15em;font:400 clamp(24px,2.1vw,36px)/1.25 var(--script);color:var(--naplemente);transform:rotate(-2deg);text-transform:none}
.place__lead{margin-top:20px;font:500 clamp(18px,1.35vw,22px)/1.5 var(--serif);font-style:italic;max-width:32em}
.facts{margin:26px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.facts>div{padding:12px 0;border-bottom:1px solid rgba(246,240,228,.2)}
.facts dt{font:700 11.5px/1.2 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--mez-vil)}
.facts dd{margin:4px 0 0;font:500 15px/1.4 var(--body)}
.place__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(12px,1.4vw,20px)}
.place__grid figure{margin:0;position:relative;overflow:hidden;border-radius:18px;background:var(--gerenda)}
.place__grid figure:nth-child(1){grid-column:span 4;aspect-ratio:4/3}
.place__grid figure:nth-child(2){grid-column:span 2;aspect-ratio:3/5;margin-top:clamp(40px,6vw,110px)}
.place__grid figure:nth-child(3){grid-column:span 3;aspect-ratio:3/4}
.place__grid figure:nth-child(4){grid-column:span 3;aspect-ratio:3/4;margin-top:clamp(30px,4vw,70px);border-radius:50%;align-self:center;aspect-ratio:1}
.place__grid img{width:100%;height:118%;object-fit:cover;transform:translateY(var(--py,0));will-change:transform}
.place__grid figcaption{position:absolute;left:14px;bottom:14px;padding:8px 14px;border-radius:999px;background:var(--papir);color:var(--ink);font:700 11px/1.25 var(--body);letter-spacing:.08em;text-transform:uppercase;max-width:calc(100% - 28px)}
.place__grid figure:nth-child(4) figcaption{left:50%;transform:translateX(-50%);bottom:12%;white-space:nowrap}
/* felfedés tányér-kör maszkkal (a kör kitágul téglalappá) */
html.js .place__grid figure{clip-path:circle(12% at 50% 50%);transition:clip-path 1.3s var(--e-in)}
html.js .place__grid figure.is-in{clip-path:circle(80% at 50% 50%)}

/* =====================================================================================
   GALÉRIA – éjkék
   ===================================================================================== */
.gallery{background:var(--ej);color:var(--papir);padding:clamp(90px,11vw,160px) 0 clamp(70px,8vw,120px)}
.gallery__title{padding:0 var(--pad);font:400 clamp(76px,10.6vw,200px)/1.05 var(--display);text-transform:uppercase;margin-bottom:clamp(30px,4vw,56px)}
.gallery__script{display:block;font:400 clamp(24px,2.2vw,38px)/1.25 var(--script);color:var(--naplemente);text-transform:none;transform:rotate(-2deg);margin-top:.1em}
.gallery__strip{scroll-padding-inline:var(--pad);display:flex;gap:clamp(12px,1.4vw,20px);overflow-x:auto;padding:0 var(--pad) 18px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--naplemente) transparent;cursor:grab}
.gallery__strip.is-drag{cursor:grabbing;scroll-snap-type:none}
.gallery__strip figure{margin:0;flex:none;width:clamp(240px,23vw,360px);scroll-snap-align:start}
.gallery__strip figure:nth-child(3n+2){margin-top:clamp(30px,4vw,70px)}
.gallery__strip button{display:block;width:100%;padding:0;border:0;background:var(--ej-2);border-radius:18px;overflow:hidden;aspect-ratio:4/5}
.gallery__strip figure:nth-child(4n+1) button{border-radius:50% 50% 18px 18px}
.gallery__strip img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e-soft);pointer-events:none}
.gallery__strip button:hover img{transform:scale(1.05)}
.gallery__strip figcaption{font:700 12px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;opacity:.94;margin-top:10px}
.gallery__hint{padding:10px var(--pad) 0;font:400 clamp(22px,1.8vw,30px)/1.2 var(--script);color:var(--mez-vil)}

/* =====================================================================================
   VÉLEMÉNYEK – az összesítők porcelántányérokon
   ===================================================================================== */
.reviews{position:relative;background:var(--papir) var(--grain);padding:clamp(100px,10vw,150px) var(--pad);text-align:center}
.reviews__title{font:400 clamp(66px,8.6vw,160px)/1.05 var(--display);text-transform:uppercase;color:var(--ink)}
.reviews__title .line{display:inline-block}
.scores{max-width:1300px;margin:clamp(40px,5vw,70px) auto 0;display:flex;flex-wrap:wrap;gap:clamp(30px,5vw,90px);justify-content:center;align-items:center}
.score{position:relative;width:clamp(230px,21vw,300px);aspect-ratio:1;border-radius:50%;background:var(--porcelan);color:var(--ink);text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  box-shadow:inset 0 0 0 20px var(--porcelan),inset 0 0 0 23px var(--kek),inset 0 0 0 30px #EFE9DE,0 26px 44px rgba(20,26,51,.2);rotate:-4deg;transition:rotate .5s var(--e-pop)}
.score:nth-child(2){rotate:4deg}
.score:hover{rotate:0deg}
.score b{font:400 clamp(66px,6vw,96px)/1 var(--display);letter-spacing:.01em;color:var(--kek-mely)}
.score span{font:700 12px/1.35 var(--body);letter-spacing:.08em;text-transform:uppercase;max-width:14em}
.score--turul{margin:0;width:auto;aspect-ratio:auto;border-radius:22px;padding:16px;flex-direction:row;gap:18px;text-align:left;max-width:520px;box-shadow:0 26px 44px rgba(20,26,51,.2),inset 0 0 0 2px rgba(20,26,51,.1);rotate:-2deg}
.score--turul img{width:clamp(120px,10vw,160px);border-radius:10px;box-shadow:0 8px 18px rgba(20,26,51,.2)}
.score--turul figcaption{display:flex;flex-direction:column;gap:8px}
.score--turul figcaption span{text-transform:none;letter-spacing:.02em;font-size:14px;font-weight:600}
.tags{list-style:none;margin:clamp(34px,4vw,56px) auto 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:960px}
.tags li{padding:9px 16px;border-radius:999px;border:2px solid var(--ink);color:var(--ink);font:500 italic 18px/1.1 var(--serif)}
.tags li:nth-child(3n+2){background:var(--kek);color:var(--papir);border-color:var(--kek)}
.reviews__note{margin-top:18px;font:600 12.5px/1.5 var(--body);color:var(--muted)}

/* =====================================================================================
   CSATLAKOZZ A CSAPATUNKHOZ – pálmazöld
   ===================================================================================== */
.jobs{background:var(--palma);color:var(--papir);padding:clamp(70px,8vw,120px) var(--pad);position:relative;overflow:hidden}
.jobs::before{content:"";position:absolute;right:-6%;top:50%;width:clamp(260px,30vw,520px);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,rgba(242,163,58,.32),rgba(242,163,58,0) 70%);pointer-events:none}
.job{position:relative;max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:8px 40px;align-items:end}
.job>*{grid-column:1}
.job .pill{grid-column:2;grid-row:2/span 3;align-self:center}
.job__k{font:700 12px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;color:#FFD27A}
.job__t{font:400 clamp(52px,6vw,110px)/1.05 var(--display);text-transform:uppercase}
.job__pos{list-style:none;margin:6px 0 4px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.job__pos li{padding:8px 16px;border-radius:999px;background:var(--papir);color:var(--ink);font:700 14px/1.2 var(--body)}
.job p{font:500 16px/1.55 var(--body);max-width:40em}

/* =====================================================================================
   NYITVATARTÁS ÉS ELÉRHETŐSÉG – királykék abrosz
   ===================================================================================== */
.visit{position:relative;background:var(--kek);color:var(--papir);padding:clamp(90px,10vw,150px) var(--pad);display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);isolation:isolate}
.visit::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--abrosz) 0 0/44px 44px;opacity:.22;pointer-events:none}
.visit::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,38,112,.9),rgba(23,38,112,.55));pointer-events:none}
.visit__title{font:400 clamp(64px,7.2vw,136px)/1.05 var(--display);text-transform:uppercase}
.visit__big{display:block;color:var(--naplemente);font-variant-numeric:tabular-nums;margin-top:.04em}
.visit__open{margin:22px 0 14px;font:700 16px/1.3 var(--body)}
.hours{width:100%;max-width:560px;border-collapse:collapse;font-size:16px}
.hours th,.hours td{padding:12px 0;border-bottom:1px solid rgba(246,240,228,.22);text-align:left;font-weight:600}
.hours td{text-align:right;font-variant-numeric:tabular-nums}
.hours tr[data-closed]{opacity:.72}
.hours tr.is-today{color:var(--naplemente);opacity:1}
.hours small{font:700 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;margin-left:6px;padding:4px 8px;border-radius:999px;background:var(--naplemente);color:var(--ink)}
.visit__note{margin-top:16px;font-size:14px;max-width:36em}
.visit__exc{margin-top:16px;display:inline-block;padding:8px 14px;border-radius:14px;background:var(--naplemente);color:var(--ink);font:700 13px/1.4 var(--body)}
.visit__tel{display:block;text-decoration:none;font:400 clamp(52px,5.6vw,104px)/1.05 var(--display);margin-bottom:14px;font-variant-numeric:tabular-nums;letter-spacing:.01em;word-break:break-word}
.visit__tel small{display:block;font:700 11.5px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--naplemente);margin-bottom:8px}
.visit__tel:hover{color:var(--naplemente)}
.visit__addr{font:500 clamp(20px,1.6vw,26px)/1.35 var(--serif);margin-bottom:16px}
.visit__addr span{font:600 14px/1.4 var(--body);opacity:.95}
.visit__must{margin-bottom:20px;padding:14px 18px;border-radius:16px;background:rgba(14,21,49,.55);font:500 14.5px/1.55 var(--body);max-width:36em}
.visit__links{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.map{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:radial-gradient(circle at 50% 50%,var(--kek-mely),var(--ej));border:3px solid rgba(246,240,228,.3)}
.map__load{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:2px solid rgba(246,240,228,.75);background:rgba(14,21,49,.75);border-radius:999px;padding:14px 22px;font:700 12.5px/1.3 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--papir);text-align:center}
.map__load small{display:block;font-weight:600;letter-spacing:.04em;text-transform:none;opacity:.9;margin-top:4px}
.map iframe{width:100%;height:100%;border:0}

/* =====================================================================================
   ZÁRÓ + LÁBLÉC
   ===================================================================================== */
.outro{position:relative;min-height:92svh;display:grid;place-items:start center;overflow:hidden;color:var(--papir);text-align:center;background:var(--ej)}
.outro picture{position:absolute;inset:0}
.outro__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.outro::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(10,15,36,.9),rgba(10,15,36,.55) 50%,rgba(10,15,36,.1) 74%)}
.outro__in{position:relative;z-index:2;padding:clamp(80px,11vh,130px) var(--pad);display:flex;flex-direction:column;align-items:center}
.outro__title{font:400 clamp(80px,11vw,210px)/1.05 var(--display);text-transform:uppercase}
.outro__script{display:block;font:400 clamp(28px,3vw,54px)/1.2 var(--script);color:var(--naplemente);margin-top:.1em;transform:rotate(-4deg);text-shadow:0 2px 20px rgba(10,15,36,.8);max-width:22em}
.outro__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}
.foot{background:var(--ej);color:var(--papir);padding:clamp(60px,7vw,100px) var(--pad) 36px;font-size:14px;position:relative}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:var(--abrosz) 0 0/44px 44px,var(--kek)}
.foot__in{display:grid;grid-template-columns:auto 1fr auto auto;gap:30px 44px;align-items:center;padding-bottom:36px;border-bottom:1px solid rgba(246,240,228,.15)}
.foot__brand{display:flex;align-items:center;gap:16px}
.foot__brand img{width:88px;height:88px;border-radius:50%}
.foot__brand p{font:400 30px/1.1 var(--script)}
.foot__brand span{display:block;font:500 italic 15px/1.4 var(--serif);margin-top:4px;opacity:.95}
.foot nav{display:flex;flex-wrap:wrap;gap:12px 26px;justify-content:center}
.foot nav a{text-decoration:none;font:700 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase}
.foot nav a:hover{color:var(--naplemente)}
.foot address{font-style:normal;line-height:1.7}
.foot address a{text-decoration:none}
.foot__hours{line-height:1.7}
.foot__legal{padding-top:24px;font-size:12.5px;opacity:.9;max-width:80em}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;z-index:120;background:rgba(10,15,36,.95);display:grid;place-items:center;padding:60px 70px}
.lb figure{margin:0;max-width:min(1200px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;gap:14px}
.lb img{max-height:80vh;width:auto;border-radius:16px}
.lb figcaption{color:var(--papir);font-size:14px;text-align:center;max-width:60ch}
.lb button{position:absolute;width:52px;height:52px;border-radius:50%;border:1.5px solid rgba(246,240,228,.5);background:rgba(14,21,49,.6);color:var(--papir);font-size:20px}
.lb__x{top:18px;right:18px}.lb__prev{left:14px;top:50%}.lb__next{right:14px;top:50%}

/* =====================================================================================
   RESZPONZÍV
   ===================================================================================== */
@media (max-width:1180px){
  .head__nav{display:none}
  .burger{display:block}
  .head__open{margin-left:auto}
  .place{grid-template-columns:1fr}
  .place__head{position:relative;top:0}
  .play__cards{grid-template-columns:1fr}
  .evs{grid-template-columns:1fr}
  .foot__in{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .flv{grid-template-columns:1fr;grid-template-rows:auto auto;text-align:left;padding:90px 20px 70px;gap:30px}
  .flv__stagebox,.flv:nth-of-type(even) .flv__stagebox{grid-column:1;grid-row:1;width:min(80vw,440px);margin:0 auto}
  .flv:nth-of-type(odd) .flv__info,.flv:nth-of-type(even) .flv__info{grid-column:1;grid-row:2;text-align:left}
  .flv:nth-of-type(even) :is(.flv__detail,.flv__list,.flv__lead){margin-left:0;justify-content:flex-start}
  .flv__word{font-size:min(30vw,170px);top:24%}
  .flv__ring{display:none}
  .flv__center{width:72%}
  .events__photos{grid-template-columns:1fr 1fr}
  .events__photos img:nth-child(3){display:none}
  .job{grid-template-columns:1fr}
  .job .pill{grid-column:1;grid-row:auto;justify-self:start;margin-top:10px}
}
@media (max-width:780px){
  .head__bar{padding:10px 14px;gap:10px}
  .head__open{display:none}
  .head__word{font-size:26px}
  .head__word small{display:none}
  .head__img{width:42px;height:42px}
  .head__cta{margin-left:auto;padding:10px 12px;font-size:11.5px}
  /* a filmfejezetek mobilon fent (az étel a kép alsó felében ül), saját felső fátyollal; a hero alul */
  .ch--r,.ch--top,.ch--c5{left:20px;right:36px;top:clamp(72px,9.5vh,100px);bottom:auto;transform:none;text-align:left;max-width:none;align-items:flex-start}
  .ch--c5 .ch__title{align-items:flex-start}
  .film[data-c="5"] .sh--t{opacity:1}.film[data-c="5"] .sh--rr{opacity:0}
  .ch--r :is(.ch__text,.ch__small,.pill,.ch__meta){margin-left:0}
  .ch--r .ch__title{align-items:flex-start}
  .ch--r .ch__script{margin-right:0}
  .ch__cta{justify-content:flex-start}
  .ch :is(.ch__small){display:none}
  .ch[data-ch="3"] .ch__text{display:none}
  .film:is([data-c="1"],[data-c="2"],[data-c="3"],[data-c="4"],[data-c="5"]) .sh--t{opacity:1}
  .film[data-c="3"] .sh--rr{opacity:0}
  .sh--t{background:linear-gradient(rgba(10,15,36,.96),rgba(10,15,36,.86) 36%,rgba(10,15,36,.35) 52%,transparent 60%)}
  .film[data-c="0"] .sh--r{opacity:0}
  .film[data-c="0"] .sh--b{opacity:1}
  .sh--b{background:linear-gradient(rgba(10,15,36,.55),rgba(10,15,36,.1) 18%,rgba(10,15,36,.35) 40%,rgba(10,15,36,.92) 60%,rgba(10,15,36,.98))}
  .ch::before{inset:-30% -10% -20% -10%}
  .ch__title{font-size:clamp(50px,14vw,96px)}
  .ch--c5 .ch__title{font-size:clamp(52px,14.5vw,92px)}
  .ch__text{font-size:15px;margin-top:12px}
  .ch--hero{padding:0}
  .hero__block{left:20px;right:20px;width:auto;top:auto;bottom:clamp(64px,10vh,104px);transform:none}
  .hero__word{font-size:clamp(84px,26vw,160px);left:-2%;top:14%;-webkit-text-stroke-color:rgba(246,240,228,.2)}
  .hero__name{font-size:clamp(110px,33vw,190px)}
  .hero__small{font-size:clamp(10px,2.7vw,12.5px);letter-spacing:.2em;display:table;padding:7px 12px;border-radius:10px;background:rgba(10,15,36,.9)}
  .hero__script{font-size:clamp(26px,7.4vw,40px)}
  .hero__lead{font-size:18px;margin-top:8px}
  .hero__corner,.hero__scroll,.hero__badges,.hero__meta,.hide-s{display:none}
  .hero__cta{flex-wrap:nowrap}
  .ch__meta{max-width:calc(100% - 34px);font-size:10.5px;letter-spacing:.14em}
  .fl--1{left:auto;right:6%;top:12%;width:24vw}.fl--2{left:auto;right:36%;top:14%;width:9vw}
  .fl--3{left:auto;right:3%;bottom:auto;top:24%;width:30vw}
  .fl--dio{left:auto;right:40%;top:30%;width:8vw}.fl--pet{right:auto;left:52%;bottom:auto;top:9%;width:9vw}.fl--eper,.fl--pap{display:none}
  .dots{right:3px;gap:0}
  .film__note{display:none}
  .statement{font-size:clamp(44px,12.6vw,78px);text-align:center;padding-top:clamp(300px,52vh,400px);z-index:4}
  .statement>span{display:block}
  .statement .st-l,.statement .st-r{display:inline;text-align:center;white-space:normal}
  .statement .st-l::after{content:" "}
  .journey{min-height:150vh}
  .journey__sticky{top:11vh}
  .journey__obj{width:56vw}
  .journey__stamp{right:4%;top:-130px}
  .play__head{box-shadow:6px 7px 0 var(--kek);padding:22px 14px}
  .play__title{font-size:clamp(46px,14vw,84px)}
  .etlap__title{font-size:clamp(96px,30vw,170px)}
  .tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin-inline:calc(var(--pad) * -1);padding:0 var(--pad) 6px;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:none}
  .blks{columns:1}
  .it{grid-template-columns:1fr auto}
  .it__dots{display:none}
  .it__n{font-size:18px}
  .pages{grid-template-columns:repeat(5,1fr);gap:6px}
  .ev{grid-template-columns:1fr;box-shadow:6px 8px 0 rgba(91,42,110,.9)}
  .ev--soon{box-shadow:6px 8px 0 rgba(242,163,58,.75)}
  .ev__menus{grid-template-columns:1fr}
  .events__title{font-size:clamp(62px,18vw,120px)}
  .place__grid{grid-template-columns:repeat(2,1fr)}
  .place__grid figure:nth-child(n){grid-column:span 1;aspect-ratio:3/4;margin-top:0}
  .place__grid figure:nth-child(1){grid-column:span 2;aspect-ratio:4/3}
  .place__grid figure:nth-child(4){aspect-ratio:1}
  .place__grid figure:nth-child(4) figcaption{white-space:normal;text-align:center;width:max-content;max-width:86%}
  .facts{grid-template-columns:1fr}
  .visit{grid-template-columns:minmax(0,1fr)}
  .visit__title{font-size:clamp(42px,14.2vw,96px)}
  .job__t{font-size:clamp(38px,12.2vw,90px)}
  .reviews__title{font-size:clamp(52px,15vw,100px)}
  .score--turul{flex-direction:column;text-align:center}
  .outro::before{background:linear-gradient(rgba(10,15,36,.92),rgba(10,15,36,.58) 55%,rgba(10,15,36,.16))}
  .outro__title{font-size:clamp(58px,16vw,120px)}
  .foot__in{grid-template-columns:1fr;text-align:left}
  .foot nav{justify-content:flex-start}
  .lb{padding:70px 12px}
  .lb__prev,.lb__next{top:auto;bottom:16px}
  .pill{white-space:normal;text-align:center;justify-content:center;line-height:1.25}
  .ch,.hero__block{max-width:calc(100vw - 40px)}
  .notice{padding:7px 12px;gap:10px;font-size:11.5px;line-height:1.35}
  .notice__txt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .notice__x{width:28px;height:28px}
  .intro__skip{bottom:18px}
  /* hajtás alatti szekciók: renderelés-megtakarítás mobilon (desktopon NEM – a sticky-/lépegető-méréseknek kell) */
  .marquee,.journey,.play,.flavors,.etlap,.events,.reviews,.visit,.gallery,.foot,.place,.outro,.jobs{content-visibility:auto;contain-intrinsic-size:auto 900px}
}
@media (max-width:780px) and (max-height:620px){
  .hero__block{bottom:20px}
  .hero__name{font-size:min(26vw,120px)}
  .hero__lead{display:none}
  .fl--3,.fl--g{display:none}
}
@media (min-width:781px) and (max-height:1020px){ .hero__scroll{display:none} }
@media (min-width:781px) and (max-height:760px){ .hero__corner,.hero__lead{display:none} }
@media (min-width:901px){
  .flv:nth-of-type(odd) .flv__info{padding-left:clamp(20px,2vw,50px)}
  .flv:nth-of-type(even) .flv__info{padding-right:clamp(20px,2vw,50px)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .marquee__track{animation:none}
}
@media print{
  .intro,.progress,.cursor,.head,.film,.marquee,.journey,.flavors,.gallery,.map,.lb,.play{display:none!important}
  body{background:#fff}
}
