/* 06 — Riviera Pop: Fogi Gyermekszínház.
   Türkiz, korall, napsárga és világos tónusok; játékos, de igényesen szerkesztett világ. */
@font-face { font-family:"PMSZ Kids"; src:url("/assets/fonts/kids-display.woff2") format("woff2"); font-weight:400 800; font-display:swap; }
@font-face { font-family:"PMSZ Kids Sans"; src:url("/assets/fonts/kids-sans.woff2") format("woff2"); font-weight:200 1000; font-display:swap; }

.kids-page {
  --teal-900:#063F46; --teal-800:#0B5A60; --teal-600:#0E7C80; --turq-400:#2FB3AE; --turq-100:#CDEFEA;
  --coral-k:#FA6475; --coral-deep:#C8344E; --sun:#FFC845; --sun-soft:#FFE7A3; --paper:#FFF6EA; --sky:#E3F5F6; --kink:#0D3B42;
  --bg:var(--paper); --surface:#FFFFFF; --text:var(--kink); --text-soft:#3E6168; --accent:var(--coral-deep); --accent-text:#FFFFFF; --line:rgba(14,124,128,.25); --focus:var(--coral-deep);
  --f-display:"PMSZ Kids", "Baloo 2", "Trebuchet MS", sans-serif;
  --f-sans:"PMSZ Kids Sans", "Nunito", "Segoe UI", sans-serif;
  --radius:18px;
  font-family:var(--f-sans);
}
.kids-page h1,.kids-page h2,.kids-page h3 { font-weight:800; letter-spacing:-.01em; line-height:1.02; }
.kids-page .eyebrow,.story-eyebrow { font:800 .78rem/1.3 var(--f-sans); letter-spacing:.16em; text-transform:uppercase; color:var(--coral-deep); }
.kids-page .button,.kids-page .outline-button,.kids-page .ticket-link,.kids-page .text-link { border-radius:999px; letter-spacing:.06em; }
.kids-page .button { box-shadow:0 6px 0 rgba(13,59,66,.18); }
.kids-page .button:hover { background:var(--teal-900); border-color:var(--teal-900); transform:translateY(-2px); }
.kids-page .outline-button { border-width:2px; }
.kids-page .outline-button:hover,.kids-page .ticket-link:hover { background:var(--teal-800); border-color:var(--teal-800); color:#fff; }
.kids-page .text-link { border:0; text-decoration:underline; text-decoration-color:var(--coral-k); text-decoration-thickness:2px; text-underline-offset:4px; }

/* fejléc */
.kids-page .header { background:#fff; color:var(--teal-900); box-shadow:0 1px 0 var(--line); }
.kids-page .header::before { content:""; display:block; height:6px; background:linear-gradient(90deg, var(--turq-400) 0 25%, var(--sun) 25% 50%, var(--coral-k) 50% 75%, var(--teal-800) 75%); }
.kids-brand { display:inline-flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--teal-900); }
.kids-brand picture { flex-shrink:0; }
.kids-brand-mark { width:104px; height:auto; }
.kids-brand strong { display:block; font:800 1.7rem/0.9 var(--f-display); color:var(--teal-800); letter-spacing:.02em; }
.kids-brand span { display:block; font:800 .62rem/1.2 var(--f-sans); letter-spacing:.24em; text-transform:uppercase; color:var(--coral-deep); }
.kids-page #main-nav a { font-family:var(--f-sans); font-weight:800; letter-spacing:.06em; }
.kids-page .search-toggle,.kids-page .menu-toggle { border-radius:999px; border-width:2px; }
.kids-page .nav-ticket { background:var(--coral-deep); border-color:var(--coral-deep); color:#fff; }
@media (max-width:1180px) { .kids-page #main-nav { background:#fff; } }
@media (max-width:560px) { .kids-brand-mark { width:70px; } .kids-brand strong { font-size:1.35rem; } .kids-brand span { font-size:.52rem; letter-spacing:.18em; } }

/* varázspálca-kurzor: csak egérrel/érintőpaddal, a kattintási pont a pálca csillagos hegye */
@media (hover:hover) and (pointer:fine) {
  .kids-page { cursor:url("/assets/kids/wand.svg") 6 6, auto; }
  .kids-page :is(a, button, summary, [role="tab"], label[for], select) { cursor:url("/assets/kids/wand-active.svg") 6 6, pointer; }
  .kids-page :is(input, textarea) { cursor:text; }
}
.stardust-layer { position:fixed; inset:0; pointer-events:none; z-index:200; overflow:hidden; }
/* szivárványcsóva (kids.js): teljes képernyős, kattintásokat átengedő vászon */
.rainbow-trail { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:199; }
.rainbow-trail[hidden] { display:none; }
.stardust { position:absolute; width:9px; height:9px; margin:-4.5px 0 0 -4.5px; background:var(--c); clip-path:polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); animation:stardust .65s ease-out forwards; }
@keyframes stardust { from { transform:translate(0,0) scale(.4); opacity:1; } to { transform:translate(var(--dx), var(--dy)) scale(1.1) rotate(90deg); opacity:0; } }

/* mesekönyv-nyitány: réteges égbolt, függöny, meseajtó */
.storybook { position:relative; overflow:hidden; isolation:isolate; padding-block:clamp(4.5rem, 3rem + 5vw, 7.5rem) clamp(3rem, 2rem + 4vw, 6rem); }
.storybook-backdrop { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.stage-valance { position:absolute; top:0; left:0; right:0; height:clamp(34px, 2rem + 2vw, 62px); z-index:2; pointer-events:none;
  background:radial-gradient(circle at 50% 0, var(--coral-deep) 70%, transparent 71%) 0 0/clamp(60px, 4rem + 3vw, 110px) 100% repeat-x;
  filter:drop-shadow(0 6px 0 rgba(255,200,69,.9)); }
.storybook { --curtain:clamp(18px, .2rem + 3.6vw, 64px); }
.stage-curtain { position:absolute; top:0; bottom:0; width:var(--curtain); z-index:1; pointer-events:none;
  background:repeating-linear-gradient(90deg, #C8344E 0 12px, #A92440 12px 18px, #D84A60 18px 28px); }
.stage-curtain--left { left:0; border-bottom-right-radius:100% 22%; transform-origin:left top; box-shadow:inset -8px 0 14px rgba(0,0,0,.18); }
.stage-curtain--right { right:0; border-bottom-left-radius:100% 22%; transform-origin:right top; box-shadow:inset 8px 0 14px rgba(0,0,0,.18); }
.storybook .wrap { width:min(100% - 2 * (var(--curtain) + var(--gutter)), var(--max)); }
.storybook__grid { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.95fr); gap:clamp(1.25rem, .5rem + 2vw, 2.75rem); align-items:center; }
.storybook__copy { display:grid; gap:var(--s-5); justify-items:start; }
.storybook__copy h1 { font-size:clamp(2.9rem, 1.2rem + 5.6vw, 6.2rem); color:var(--teal-900); text-shadow:0 3px 0 #fff; }
.storybook__copy h1 em { display:block; font-style:normal; color:var(--coral-deep); }
.storybook__lead { font-size:var(--t-lead); color:var(--text-soft); max-width:32rem; }
.kids-page .outline-button { background:rgba(255,255,255,.8); color:var(--teal-900); border-color:var(--teal-800); }

/* Aladdin a gyermekfőoldalon: a fotó természetes 3:2 arányában, vágás nélkül – minden fej látszik.
   Fényjáték és enyhe térhatás csak a kereten; magán a fotón nincs effekt. */
.fairy-door { margin:0; justify-self:center; width:min(100%, 720px); display:grid; gap:var(--s-3); justify-items:center; }
.fairy-door__frame { position:relative; width:100%; perspective:1400px; }
.fairy-door__glow { position:absolute; inset:-22px; border-radius:40px; background:conic-gradient(from var(--door-angle, 0deg), #FFC845, #FF8FA3, #6FD3D8, #FFC845); filter:blur(14px); opacity:.75; pointer-events:none; }
.fairy-door__arch { contain:paint; position:relative; width:100%; aspect-ratio:16/9; border-radius:22px; overflow:hidden; box-shadow:0 0 0 10px #fff, 0 0 0 13px var(--sun), 0 40px 70px -30px rgba(6,63,70,.6); background:var(--teal-900); transform-style:preserve-3d; }
.fairy-door__arch img { display:block; width:100%; height:100%; object-fit:contain; }
/* mesekapu-film: a 16:9-es keretet pontosan kitölti (a film a forrásvideók teljes 16:9-es képe) */
.fairy-door__film { display:block; width:100%; height:100%; object-fit:cover; background:var(--teal-900); }
.fairy-door__toggle { position:absolute; right:14px; bottom:14px; z-index:3; width:44px; height:44px; display:grid; place-items:center; padding:0; border:2px solid #fff; border-radius:50%; background:rgba(13,59,66,.72); color:#fff; cursor:pointer; opacity:.85; transition:opacity .2s, background-color .2s; }
.fairy-door__toggle:hover,.fairy-door__toggle:focus-visible { opacity:1; background:var(--coral-deep); }
.fairy-door__toggle:focus-visible { outline:3px solid var(--sun); outline-offset:3px; }
/* szünet-jel (két csík), szüneteltetve lejátszás-jel (háromszög) */
.fairy-door__toggle span { width:14px; height:16px; border-inline:4px solid currentColor; box-sizing:border-box; }
@media (max-width:560px) { .fairy-door__toggle { right:9px; bottom:9px; width:36px; height:36px; } }
.fairy-door__toggle[aria-pressed="true"] span { width:0; height:0; border:0; border-left:14px solid currentColor; border-block:9px solid transparent; margin-left:4px; }
.fairy-door__leaf { position:absolute; top:0; bottom:0; width:50%; pointer-events:none; background:linear-gradient(90deg, #0B5A60, #0E7C80); box-shadow:inset 0 0 0 6px rgba(255,200,69,.8); }
.fairy-door__leaf::after { content:""; position:absolute; top:52%; width:12px; height:12px; border-radius:50%; background:var(--sun); }
.fairy-door__leaf--l { left:0; transform-origin:left center; transform:rotateY(-104deg); }
.fairy-door__leaf--l::after { right:14px; }
.fairy-door__leaf--r { right:0; transform-origin:right center; transform:rotateY(104deg); }
.fairy-door__leaf--r::after { left:14px; }
.fairy-door figcaption a { display:inline-flex; gap:.4rem; padding:.6rem 1.1rem; border-radius:999px; background:var(--teal-800); color:#fff; font:800 .85rem/1.2 var(--f-sans); text-decoration:none; box-shadow:0 8px 20px -8px rgba(6,63,70,.6); }
.fairy-door figcaption a:hover { background:var(--coral-deep); }
@media (max-width:900px) { .storybook__grid { grid-template-columns:1fr; } .fairy-door { width:min(100% - 24px, 680px); } }
@media (max-width:560px) { .storybook { padding-top:4rem; } .stage-curtain { width:22px; } .fairy-door__arch { border-radius:16px; box-shadow:0 0 0 6px #fff, 0 0 0 8px var(--sun), 0 30px 50px -26px rgba(6,63,70,.6); } .fairy-door__glow { inset:-12px; }   }

.kids-section-top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:var(--s-4) var(--s-6); margin-bottom:var(--s-6); }
.kids-section-top > div { display:grid; gap:var(--s-2); }
.kids-section-top h2 { color:var(--teal-900); }
.kids-section-top h2 em { font-style:normal; color:var(--coral-deep); }
.kids-section-top > p { max-width:30rem; color:var(--text-soft); }

/* nyitó függöny: a /gyermek/ első megnyitásakor (munkamenetenként egyszer) a függöny alól előbukkan
   a Süsü-film, majd beúszik az oldal. A sorrendet a kids.js vezérli (is-open → is-ending → is-done);
   JS nélkül vagy csökkentett mozgásnál nincs nyitány. Biztosíték: 18 s után mindenképp eltűnik. */
.curtain-intro { display:none; }
.fogi-intro { overflow:hidden; }
.fogi-intro .curtain-intro { display:block; position:fixed; inset:0; z-index:300; overflow:hidden; background:#2A0B16; cursor:pointer; animation:ci-done .01s 18s forwards; }
.curtain-intro.is-done { display:none !important; }
/* a színpad: a film álló képarányban, mögötte a jelenet elmosott, sötétített mása és egy reflektorfény */
.curtain-intro__stage { position:absolute; inset:0; display:grid; place-items:center; overflow:hidden; background:#E3F5F6; transform:scale(1.06); filter:brightness(.6) saturate(.9); transition:transform 3.2s cubic-bezier(.2,.7,.2,1), filter 2.6s ease, opacity 1.3s ease; }
/* asztalon a film két oldalát a főoldal napos, váras mesejelenete tölti ki – ugyanaz fogad az oldalon is */
.curtain-intro__scene { position:absolute; inset:0; width:100%; height:100%; }
.curtain-intro__stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(42% 70% at 50% 48%, rgba(255,246,234,.55), transparent 72%); }
.curtain-intro__video { position:relative; z-index:1; }
.curtain-intro .drift { animation:drift 26s ease-in-out infinite alternate; }
.curtain-intro .spin-slow { animation-duration:40s; }
.curtain-intro__video { display:block; height:min(90vh, 1036px); aspect-ratio:720 / 1036; width:auto; max-width:92vw; object-fit:cover; border-radius:22px; background:#2A0B16; box-shadow:0 0 0 6px #FFF6EA, 0 0 0 9px #FFC845, 0 50px 90px -30px rgba(0,0,0,.75); }
@media (max-aspect-ratio:3/4) {
  /* telefonon is keretben áll, fölötte az ég, alatta a hullámok – a fejét sem a felső sáv, sem a notch nem takarja */
  .curtain-intro__video { width:min(92vw, 70dvh); height:auto; max-width:none; border-radius:18px; box-shadow:0 0 0 5px #FFF6EA, 0 0 0 8px #FFC845, 0 30px 60px -24px rgba(0,0,0,.6); }
  .curtain-intro__stage { padding-top:env(safe-area-inset-top); }
}
.curtain-intro__drape { position:absolute; top:0; bottom:0; width:51%; z-index:2; background:repeating-linear-gradient(90deg, #C8344E 0 18px, #9E1F3A 18px 26px, #DC4C63 26px 40px); box-shadow:inset 0 -60px 80px rgba(0,0,0,.25); transition:transform 3s cubic-bezier(.6,0,.2,1); }
.curtain-intro__drape--l { left:0; border-right:6px solid #FFC845; transform-origin:left top; }
.curtain-intro__drape--r { right:0; border-left:6px solid #FFC845; transform-origin:right top; }
.curtain-intro__valance { position:absolute; z-index:3; top:0; left:0; right:0; height:16vh; background:radial-gradient(circle at 50% 0, #A92440 70%, transparent 71%) 0 0/120px 100% repeat-x; filter:drop-shadow(0 6px 0 #FFC845); transition:transform 1.1s cubic-bezier(.5,0,.3,1); }
.curtain-intro__title { position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; justify-items:center; color:#FFF6EA; font:800 clamp(1rem, .7rem + 1vw, 1.4rem)/1 var(--f-sans); letter-spacing:.3em; text-transform:uppercase; text-shadow:0 3px 0 rgba(0,0,0,.25); animation:ci-title 1.2s .15s cubic-bezier(.2,.7,.2,1) both; transition:opacity .7s ease, transform .9s ease; }
.curtain-intro__title b { font:800 clamp(3.5rem, 2rem + 6vw, 7rem)/1 var(--f-display); letter-spacing:.02em; color:#FFC845; }
.curtain-intro__sparks { position:absolute; z-index:4; left:50%; top:50%; }
.curtain-intro__sparks i { position:absolute; width:14px; height:14px; margin:-7px; background:#FFC845; clip-path:polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); opacity:0; animation:ci-spark 1.3s calc(.9s + var(--d)) ease-out forwards; }
.curtain-intro__sparks i:nth-child(3n) { background:#fff; } .curtain-intro__sparks i:nth-child(3n+1) { background:#2FB3AE; }
.curtain-intro__skip { position:absolute; z-index:5; right:clamp(14px, 3vw, 32px); bottom:clamp(14px, 3vw, 32px); min-height:46px; padding:.6rem 1.15rem; border:2px solid rgba(255,246,234,.85); border-radius:999px; background:rgba(42,11,22,.45); color:#FFF6EA; font:800 .95rem/1 var(--f-sans); letter-spacing:.04em; cursor:pointer; backdrop-filter:blur(6px); opacity:0; animation:ci-skip .6s 1.2s ease forwards; transition:background-color .2s, color .2s, opacity .5s; }
.curtain-intro__skip:hover,.curtain-intro__skip:focus-visible { background:#FFC845; border-color:#FFC845; color:#0D3B42; }
/* 2) nyílik a függöny, alóla előbukkan a film */
.curtain-intro.is-open .curtain-intro__drape--l { transform:translateX(-104%) skewX(-6deg); }
.curtain-intro.is-open .curtain-intro__drape--r { transform:translateX(104%) skewX(6deg); }
.curtain-intro.is-open .curtain-intro__valance { transform:translateY(-110%); }
.curtain-intro.is-open .curtain-intro__title { opacity:0; transform:translate(-50%,-50%) scale(1.12); }
.curtain-intro.is-open .curtain-intro__stage { transform:none; filter:none; }
/* 3) a film elhalványul, mögüle beúszik az oldal */
.curtain-intro.is-ending { background:transparent; pointer-events:none; }
.curtain-intro.is-ending .curtain-intro__stage { opacity:0; transform:scale(1.04); filter:blur(6px) brightness(1.15); transition:opacity 1.4s ease, transform 1.6s ease, filter 1.4s ease; }
.curtain-intro.is-ending .curtain-intro__drape,.curtain-intro.is-ending .curtain-intro__valance,.curtain-intro.is-ending .curtain-intro__title,.curtain-intro.is-ending .curtain-intro__skip,.curtain-intro.is-ending .music-toggle { opacity:0; transition:opacity .5s ease; }
.curtain-intro.is-fast .curtain-intro__stage { transition-duration:.6s; }
/* az oldal a nyitány alatt várakozik (animációi szünetelnek), majd lágyan beúszik */
.fogi-intro :is(.header, main > :not(.curtain-intro, script), footer) { opacity:0; transform:translate3d(0,42px,0); }
.fogi-intro :is(.header, main > :not(.curtain-intro, script), footer) * { animation-play-state:paused !important; }
.fogi-entering :is(.header, main > :not(.curtain-intro, script), footer) { transition:opacity 1.2s ease, transform 1.5s cubic-bezier(.2,.7,.2,1); }
.fogi-entering main > .storybook ~ * { transition-delay:.15s; }
@keyframes ci-title { from { opacity:0; transform:translate(-50%,-40%) scale(.85); } }
@keyframes ci-spark { 0% { opacity:1; transform:rotate(var(--a)) translateY(0) scale(.4); } 100% { opacity:0; transform:rotate(var(--a)) translateY(-34vmin) scale(1.2); } }
@keyframes ci-skip { to { opacity:1; } }
@keyframes ci-done { to { visibility:hidden; pointer-events:none; } }

/* élő nyitány: csillanások, felugró cím, hömpölygő szalag */
.storybook-sparkles { position:absolute; inset:0; z-index:0; pointer-events:none; }
.storybook-sparkles i { position:absolute; left:var(--x); top:var(--y); width:16px; height:16px; background:#FFC845; clip-path:polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); opacity:.7; }
.storybook-sparkles i:nth-child(3n) { background:#fff; width:12px; height:12px; } .storybook-sparkles i:nth-child(3n+1) { background:var(--coral-k); width:10px; height:10px; }
.story-ribbon { overflow:hidden; padding:1rem 0; background:var(--teal-800); color:#fff; font:800 .85rem/1.2 var(--f-sans); letter-spacing:.18em; }
.story-ribbon__track { display:flex; gap:2.5rem; width:max-content; padding-left:2.5rem; }
.story-ribbon span:nth-child(4n+2) { color:var(--sun); } .story-ribbon span:nth-child(4n+3) { color:#FFB3BD; } .story-ribbon span:nth-child(4n+4) { color:var(--turq-100); }
@media (prefers-reduced-motion:no-preference) {
  .storybook-sparkles i { animation:twinkle 2.6s var(--t) ease-in-out infinite, bob 5s var(--t) ease-in-out infinite; }
  .storybook__copy .pop { display:inline-block; animation:pop-word .9s cubic-bezier(.2,1.4,.4,1) both; }
  .storybook__copy em.pop { animation-delay:.25s; }
  .curtain-seen .storybook__copy .pop { animation-delay:0s; }
  .story-ribbon__track { animation:ribbon 28s linear infinite; }
  /* a kapu csak egyszer nyílik ki; a végtelen fény-, gomb- és kártyaanimációk kikerültek (iPhone-memória) */
  .fairy-door__arch { animation:door-in 1.4s cubic-bezier(.2,.7,.2,1) both; }
  .kid-show-card { animation:card-in .7s calc(var(--i) * 80ms) cubic-bezier(.2,.7,.2,1) both; }
}
@keyframes pop-word { 0% { opacity:0; transform:translateY(30px) scale(.8) rotate(-4deg); } 100% { opacity:1; transform:none; } }
@keyframes ribbon { to { transform:translateX(-50%); } }
@keyframes door-in { from { transform:rotateX(9deg) translateY(18px) scale(.97); } }
@keyframes card-in { from { opacity:0; transform:translateY(34px) scale(.96); } }

/* időpont nélküli mesék: külön, halványabb polc, egyértelmű jelöléssel */
.shelf-divider { display:grid; gap:.4rem; margin:var(--s-8) 0 var(--s-5); padding-top:var(--s-5); border-top:2px dashed var(--line); }
.shelf-divider h2 { font-size:clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem); color:var(--text-soft); }
.shelf-divider p { color:var(--text-soft); max-width:40rem; }
.shelf-off .kid-show-card .show-card__frame { filter:saturate(.35); }
.shelf-off .kid-show-card:hover .show-card__frame,.shelf-off .kid-show-card:focus-within .show-card__frame { filter:none; }
.shelf-off .kid-show-card > a::before { background:#C9D8D8; }
.show-card__next { grid-column:1/-1; display:block; max-width:100%; justify-self:start; padding:.25rem .65rem; border-radius:12px; background:var(--sun-soft); color:var(--kink); font:800 .72rem/1.3 var(--f-sans); }
.show-card__next b { color:var(--coral-deep); }
.show-card__next.is-off { background:#E7ECEC; color:#41585C; }

/* mesepolc: mesekapu-kártyák függönnyel */
.kids-shelf { padding-block:var(--section); background:#fff; }
.kids-page .show-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--s-6) var(--s-5); align-items:start; }
@media (max-width:1100px) { .kids-page .show-grid { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:760px) { .kids-page .show-grid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s-5) var(--s-3); } .kid-show-card .show-card__meta { grid-template-columns:minmax(0,1fr); } .kid-show-card .show-card__cta { white-space:normal; } }
/* mesekapu: az ív a plakát mögött díszkeret, a plakátból semmit nem vág le */
.kid-show-card > a { position:relative; padding-top:26px; }
.kid-show-card > a::before { content:""; position:absolute; top:0; left:0; right:0; aspect-ratio:1/1.05; border-radius:999px 999px 26px 26px / 50% 50% 26px 26px; background:repeating-conic-gradient(from -90deg at 50% 52%, rgba(255,255,255,.16) 0 4deg, transparent 4deg 12deg), var(--world-c, var(--turq-400)); box-shadow:inset 0 0 0 3px rgba(255,255,255,.5); z-index:0; transition:transform .3s cubic-bezier(.2,.7,.2,1); }
.kid-show-card > a > * { position:relative; z-index:1; }
.kid-show-card .show-card__frame { margin-inline:12px; }
.kid-show-card .show-card__frame { border-radius:16px; border:6px solid #fff; box-shadow:0 18px 36px -22px rgba(6,63,70,.55); background:var(--sky); transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.kid-show-card > a:hover::before { transform:translateY(-6px) scale(1.02); }
.world-ej { --world-c:#3E4F96; } .world-erdo { --world-c:#0E7C80; } .world-tenger { --world-c:#2FB3AE; } .world-palota { --world-c:#8B6FC9; } .world-ho { --world-c:#2C6F9E; } .world-nap { --world-c:#F2A93B; }
.card-curtain { position:absolute; inset:0; z-index:3; pointer-events:none; }
.card-curtain::before,.card-curtain::after { content:""; position:absolute; top:0; bottom:0; width:40%; background:repeating-linear-gradient(90deg, #C8344E 0 10px, #A92440 10px 15px, #D84A60 15px 24px); transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.card-curtain::before { left:0; transform:translateX(-100%); }
.card-curtain::after { right:0; transform:translateX(100%); }
.kid-show-card .show-card__frame::after { content:""; position:absolute; inset:0; z-index:4; pointer-events:none; background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.55) 45%, transparent 60%); transform:translateX(-120%); }
.kid-show-card > a:hover .show-card__frame,.kid-show-card > a:focus-visible .show-card__frame { transform:translateY(-6px) rotate(-.6deg); box-shadow:0 0 0 3px var(--sun), 0 26px 44px -24px rgba(6,63,70,.6); }
.kid-show-card .show-card__meta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.3rem .6rem; align-items:center; padding:var(--s-3) 12px 0; }
.kid-show-card .show-card__meta h3 { grid-column:1/-1; font-size:clamp(1.08rem, .95rem + .5vw, 1.35rem); color:var(--teal-900); }
.kid-show-card .show-card__cta { color:var(--coral-deep); font-family:var(--f-sans); letter-spacing:.04em; }
.show-card__chips { display:flex; flex-wrap:wrap; gap:.3rem; }

/* illusztrált tartalékplakát (ha egyszer hiányozna plakát és fotó is) */
.story-poster { position:absolute; inset:0; display:grid; grid-template-rows:1fr auto; color:#fff; }
.story-poster .world-scene { position:relative; z-index:0; }
.story-poster__title { padding:.75rem .9rem 1rem; background:var(--teal-800); font:800 clamp(1.1rem, .95rem + .6vw, 1.45rem)/1.02 var(--f-display); text-wrap:balance; }
.story-poster__label { display:block; font:800 .62rem/1.2 var(--f-sans); letter-spacing:.18em; text-transform:uppercase; opacity:.9; margin-bottom:.25rem; }

/* mozgás – csak ha a látogató nem kért csökkentett mozgást */
@media (prefers-reduced-motion:no-preference) {
  .storybook .drift { animation:drift 26s ease-in-out infinite alternate; }
  .drift.slow { animation-duration:38s; }
  .twinkle { animation:twinkle 3.2s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
  .twinkle.slow,.twinkle:nth-of-type(3n) { animation-duration:4.6s; animation-delay:-1.4s; }
  .spin-slow { animation:spin 90s linear infinite; }
  .wave { animation:wave 9s ease-in-out infinite alternate; }
  .wave.slow { animation-duration:13s; }
  .bob { animation:bob 5s ease-in-out infinite; }
  .sway { animation:sway 4s ease-in-out infinite alternate; transform-box:fill-box; transform-origin:50% 100%; }
  .fall { animation:fall 14s linear infinite; }
  .rise { animation:rise 6s ease-in infinite; }
  .glow { animation:glow 3s ease-in-out infinite alternate; }
  .stage-curtain--left { animation:curtain-l 1.6s cubic-bezier(.3,.7,.2,1) both; }
  .stage-curtain--right { animation:curtain-r 1.6s cubic-bezier(.3,.7,.2,1) both; }
  .fairy-door__leaf--l { animation:door-l 1.8s .35s cubic-bezier(.3,.7,.2,1) both; }
  .fairy-door__leaf--r { animation:door-r 1.8s .35s cubic-bezier(.3,.7,.2,1) both; }
  .kid-show-card > a:hover .card-curtain::before,.kid-show-card > a:focus-visible .card-curtain::before { animation:card-curtain-l .9s cubic-bezier(.3,.7,.2,1); }
  .kid-show-card > a:hover .card-curtain::after,.kid-show-card > a:focus-visible .card-curtain::after { animation:card-curtain-r .9s cubic-bezier(.3,.7,.2,1); }
  .kid-show-card > a:hover .show-card__frame::after { transition:transform .8s ease; transform:translateX(120%); }
  
}
@keyframes drift { to { transform:translateX(60px); } }
@keyframes twinkle { 50% { opacity:.3; transform:scale(.7); } }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes wave { to { transform:translateX(-50px); } }
@keyframes bob { 50% { transform:translateY(-8px); } }
@keyframes sway { from { transform:rotate(-4deg); } to { transform:rotate(4deg); } }
@keyframes fall { from { transform:translateY(-40px); } to { transform:translateY(40px); } }
@keyframes rise { 0% { transform:translateY(0); opacity:0; } 20% { opacity:1; } 100% { transform:translateY(-80px); opacity:0; } }
@keyframes glow { to { fill:#FFC845; } }
@keyframes curtain-l { from { transform:scaleX(5); } to { transform:scaleX(1); } }
@keyframes curtain-r { from { transform:scaleX(5); } to { transform:scaleX(1); } }
@keyframes door-l { from { transform:rotateY(0); } to { transform:rotateY(-104deg); } }
@keyframes door-r { from { transform:rotateY(0); } to { transform:rotateY(104deg); } }
@keyframes card-curtain-l { 0%,100% { transform:translateX(-100%); } 40% { transform:translateX(-70%); } }
@keyframes card-curtain-r { 0%,100% { transform:translateX(100%); } 40% { transform:translateX(70%); } }
@keyframes pop-in { from { transform:translateY(14px); opacity:0; } }

/* gyermekműsor */
.kids-dates { padding-block:var(--section); background:var(--sky); border-radius:40px 40px 0 0; }
.kids-dates .events { background:#fff; border-radius:24px; padding:var(--s-2) var(--s-5); box-shadow:0 18px 40px -30px rgba(6,63,70,.5); }
.kids-page .event-row { border-color:var(--line); }
.kids-page .event-row time { border:0; border-radius:16px; background:var(--turq-100); color:var(--teal-900); }
.kids-page .event-row time strong { font-family:var(--f-display); font-weight:800; }
.kids-page .event-info h3 { font-family:var(--f-display); color:var(--teal-900); }
.kids-page .ticket-link { border-width:2px; color:var(--coral-deep); }
.kids-page .data-note { color:var(--text-soft); }

.story-back { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--s-5); padding:clamp(1.5rem, 1rem + 2vw, 3rem); margin-block:var(--section); background:var(--teal-800); color:#fff; border-radius:28px; }
.story-back .story-eyebrow { color:var(--sun); }
.story-back h2 { color:#fff; }
.story-back .outline-button { background:#fff; color:var(--teal-900); border-color:#fff; }

.kids-page .credits { background:#fff; border:2px solid var(--turq-100); border-radius:20px; }
.kids-page .show-schedule { border-color:var(--line); }

/* lábléc */
.kids-page footer { background:var(--turq-100); color:var(--teal-900); border-top:6px solid; border-image:linear-gradient(90deg, var(--turq-400) 0 25%, var(--sun) 25% 50%, var(--coral-k) 50% 75%, var(--teal-800) 75%) 1; }
.kids-page footer .eyebrow { color:#A3243C; }
.kids-page .footer-contacts strong { color:#A3243C; }
.kids-page .footer-bottom { border-color:var(--line); }
.kids-page dialog#search-dialog { border-radius:24px; border-color:var(--turq-400); }

/* Shared draggable ticket cards, in the children's palette. */
.kids-page .flip-schedule { --navy-900:var(--teal-900); --coral-700:var(--coral-deep); --ink-soft:var(--text-soft); --gold-500:var(--sun); background:linear-gradient(145deg,var(--sky),var(--paper)); }
.kids-page .flip-ticket__front,.kids-page .flip-ticket__back,.kids-page .flip-ticket__foreground { background:linear-gradient(140deg,var(--teal-900),var(--teal-600)); }
.kids-page .flip-ticket__back h3 { color:#fff; }
.kids-page .flip-ticket__buy { background:var(--sun); color:var(--teal-900); }

/* Children-only ticket accents: the adult homepage retains a restrained,
   fully static variation. The shared flip/scroll engine is untouched. */
.kids-page .flip-schedule { background:linear-gradient(165deg,#FFF5E5 4%,#E8F5F1 70%,#FFF8ED); }
.kids-page .flip-schedule__heading h2 { color:#144A50; }
.kids-page .flip-schedule__heading h2 em { color:#CF4A61; }
.kids-page .flip-schedule__arrows button { color:#1B6269; border-color:#1B6269; }
.kids-page .flip-schedule__arrows button:not(:disabled):hover { background:#1B6269; color:white; }
.kids-page .flip-ticket--kids .flip-ticket__date { background:linear-gradient(105deg,#F9E9E0,#E8F7EF); border-color:rgba(27,98,105,.24); }
.kids-page .flip-ticket--kids .flip-ticket__foreground { background:linear-gradient(130deg,#146269,#347D70 75%); }
.kids-page .flip-ticket--kids .flip-ticket__face { border-radius:13px; }
.kids-page .flip-ticket--kids .flip-ticket__image { position:relative; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 77% 18%,#8CB5A2,#1A515B 78%); }
/* A soft painted sunbeam and one tiny star bring the illustrations to life.
   The overlays cannot intercept a tap or a horizontal swipe. */
/* a jegyeken álló napsugár és csillag: a korábbi végtelen animációjuk 36 nagy GPU-réteget tartott életben */
.kids-page .flip-ticket--kids .flip-ticket__image::before { content:""; position:absolute; z-index:2; inset:-36% -22%; pointer-events:none; background:conic-gradient(from 5deg at 74% 21%,transparent 0deg,rgba(255,241,191,.13) 13deg,transparent 35deg,rgba(255,246,217,.08) 55deg,transparent 73deg,rgba(255,241,191,.1) 93deg,transparent 116deg); transform-origin:74% 21%; opacity:.7; }
.kids-page .flip-ticket--kids .flip-ticket__image::after { content:""; position:absolute; z-index:3; right:14%; top:12%; width:17px; height:17px; pointer-events:none; background:#FFF6C7; clip-path:polygon(50% 0,58% 37%,85% 15%,63% 43%,100% 50%,63% 57%,85% 85%,58% 63%,50% 100%,42% 63%,15% 85%,37% 57%,0 50%,37% 43%,15% 15%,42% 37%); filter:drop-shadow(0 0 6px rgba(255,219,145,.8)); }

/* The children's destination uses a brighter, illustrated-poster treatment.
   On the adult homepage the same cards retain restrained static colours. */
.kids-page .flip-ticket--kids .flip-ticket__image { background:#D9E8DD; }
.kids-page .flip-ticket--kids .flip-ticket__foreground {
  background:linear-gradient(0deg,rgba(255,251,233,.99),rgba(255,251,233,.91) 48%,rgba(255,251,233,0));
}
.kids-page .flip-ticket--kids .flip-ticket__back {
  background:#FFF8E6;
  color:#184A51;
}
.kids-page .flip-ticket--kids .flip-ticket__backdrop img { opacity:.75; }
.kids-page .flip-ticket--kids .flip-ticket__back::before {
  background:linear-gradient(180deg,rgba(255,251,230,.62) 0%,rgba(255,249,229,.5) 38%,rgba(255,250,233,.83) 70%,rgba(255,250,232,.97) 100%);
}
.kids-page .flip-ticket--kids .flip-ticket__back h3 { color:#0D3B42; }
.kids-page .flip-ticket--kids .flip-ticket__event-details { background:rgba(255,250,230,.8); }
.kids-page .flip-ticket--kids .flip-ticket__buy {
  color:#fff;
  background:#D74762;
  border-radius:9px;
  box-shadow:0 5px 0 rgba(154,49,71,.16);
}
.kids-page .flip-ticket--kids .flip-ticket__buy:hover { background:#AD304B; }

/* Override the earlier isolated sparkle wrapper: photographic posters must fill
   the entire face, including on narrow WebKit/iPad layouts. */
.kids-page .flip-ticket--kids .flip-ticket__image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

/* ═══════════════════════════════════════════════════════════════════════════
   2026-10-21 — Rövidebb, egymásba futó sávok; olvashatóság; lábléc gombokkal
   ═══════════════════════════════════════════════════════════════════════════ */
.kids-page { --section:clamp(2.5rem, 1.4rem + 2.6vw, 4.4rem); --text-soft:#2F535A; }
.kids-page .kids-shelf { background:linear-gradient(180deg, #FBF7EE 0%, #FFFFFF 10%, #FFFFFF 86%, var(--sky) 100%); }
.kids-page .kids-dates { border-radius:0; background:linear-gradient(180deg, var(--sky) 0%, var(--sky) 80%, var(--paper) 100%); }
.kids-page .story-back { margin-block:clamp(1.5rem, 3vw, 2.5rem); }
/* a jelenleg nem játszott mesék kisebb kártyákon – a polc fele olyan hosszú */
.kids-page .shelf-divider { margin:var(--s-6) 0 var(--s-4); }
@media (min-width:761px) {
  .kids-page .shelf-off .show-grid { grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:var(--s-5) var(--s-4); }
  .kids-page .shelf-off .show-card h3 { font-size:1rem; }
}
/* időpontok két hasábban */
@media (min-width:1000px) {
  .kids-page .kids-dates .events { grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:var(--s-7); }
}
/* lábléc: mesés gombok */
.kids-page footer { background:linear-gradient(180deg, var(--paper) 0%, var(--turq-100) 120px); }
.kids-page .footer-grid p,.kids-page .footer-contacts a { color:var(--teal-900); }
.kids-page .footer-links a { border:2px solid rgba(11,90,96,.35); border-radius:999px; color:var(--teal-900); background:#fff; font-family:var(--f-display); font-weight:700; }
.kids-page .footer-links a span { color:var(--coral-deep); }
.kids-page .footer-links a:hover,.kids-page .footer-links a:focus-visible { background:var(--teal-800); border-color:var(--teal-800); color:#fff; }
.kids-page .footer-links a:hover span { color:var(--sun); }

/* zene be/ki a nyitány alatt: kerek, mesés gomb a bal alsó sarokban (a nyitánnyal együtt tűnik el) */
.music-toggle { position:fixed; z-index:310; left:clamp(12px, 2.4vw, 24px); bottom:clamp(12px, 2.4vw, 24px); display:inline-flex; align-items:center; gap:.45rem; min-height:46px; padding:.5rem 1rem .5rem .6rem; border:2px solid #FFC845; border-radius:999px; background:#0B5A60; color:#FFF6EA; font:800 .92rem/1 var(--f-sans); letter-spacing:.04em; cursor:pointer; box-shadow:0 10px 24px -12px rgba(6,63,70,.6); transition:background-color .2s, transform .2s; }
.music-toggle__icon { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:#FFC845; color:#0B5A60; font-size:1.05rem; }
.music-toggle:hover,.music-toggle:focus-visible { background:#063F46; transform:translateY(-1px); }
.music-toggle:not(.is-playing) .music-toggle__icon { background:#FFF6EA; color:#8A9A9C; text-decoration:line-through; }
.music-toggle.is-waiting .music-toggle__icon { background:#FFC845; color:#0B5A60; text-decoration:none; }
@media (prefers-reduced-motion:no-preference) {
  .music-toggle.is-playing .music-toggle__icon { animation:music-bob 1.5s ease-in-out infinite; }
  .music-toggle.is-waiting { animation:music-hint 2.4s ease-in-out infinite; }
}
@keyframes music-bob { 50% { transform:translateY(-2px) rotate(-8deg); } }
@keyframes music-hint { 50% { box-shadow:0 0 0 6px rgba(255,200,69,.35), 0 10px 24px -12px rgba(6,63,70,.6); } }
@media (max-width:520px) { .music-toggle__label { display:none; } .music-toggle { padding:.4rem; } }

/* fejléc: a mesevilág menüpontjai színes, kerek gombok, amelyek kitöltik a logó és a kereső közti teret */
.kids-page #main-nav a { --c:#0E7C80; --ink:#063F46; --soft:#E3F5F6; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; min-height:46px; padding:.55rem 1.15rem; border:2px solid var(--c); border-radius:999px; background:var(--soft); color:var(--ink); font:800 .86rem/1.1 var(--f-sans); letter-spacing:.05em; text-transform:none; box-shadow:0 3px 0 var(--c); transition:transform .15s, background-color .15s, color .15s, box-shadow .15s; }
.kids-page #main-nav a::before { content:""; width:.55rem; height:.55rem; border-radius:50%; background:var(--c); flex:none; }
.kids-page #main-nav a:nth-child(2) { --c:#E9A800; --ink:#5A3E00; --soft:#FFF4D2; }
.kids-page #main-nav a:nth-child(3) { --c:#D74762; --ink:#7A1A2E; --soft:#FFE8EC; }
.kids-page #main-nav a:nth-child(4) { --c:#0B5A60; --ink:#0B5A60; --soft:#FFFFFF; }
.kids-page #main-nav a:hover,.kids-page #main-nav a:focus-visible,.kids-page #main-nav a[aria-current="page"] { background:var(--c); color:#fff; border-color:var(--c); transform:translateY(-1px); box-shadow:0 4px 0 var(--ink); }
.kids-page #main-nav a:nth-child(2):hover,.kids-page #main-nav a:nth-child(2):focus-visible { color:#3A2800; }
.kids-page #main-nav a:hover::before,.kids-page #main-nav a:focus-visible::before { background:#fff; }
@media (min-width:1181px) {
  .kids-page #main-nav { justify-content:center; gap:clamp(.5rem, .2rem + .6vw, 1rem); padding-inline:clamp(.5rem, 2vw, 2rem); }
  .kids-page #main-nav a { flex:1 1 0; max-width:15rem; white-space:nowrap; }
}
@media (min-width:1181px) and (max-width:1320px) { .kids-page #main-nav a { padding-inline:.8rem; font-size:.8rem; } }
@media (max-width:1180px) {
  .kids-page #main-nav { gap:.6rem; padding-top:1rem; }
  .kids-page #main-nav a { justify-content:flex-start; padding:.8rem 1.1rem; border-bottom-width:2px; font-size:.95rem; }
}

/* hős alatti kereső: „A varázslat közelebb van, mint hinnéd!” – irányítószám vagy térkép */
.kids-nearby { width:100%; max-width:34rem; display:grid; gap:.6rem; padding:clamp(1rem, 2vw, 1.4rem); background:#fff; border:2px solid var(--turq-100); border-radius:24px; box-shadow:0 18px 40px -26px rgba(6,63,70,.6); position:relative; overflow:hidden; }
.kids-nearby::after { content:""; position:absolute; right:-28px; top:-28px; width:96px; height:96px; border-radius:50%; background:radial-gradient(circle, #FFE7A3 0 38%, transparent 40%), repeating-conic-gradient(from 0deg, rgba(255,200,69,.55) 0 8deg, transparent 8deg 22deg); pointer-events:none; opacity:.8; }
.kids-nearby__eyebrow { margin:0; font:900 .74rem/1.2 var(--f-sans); letter-spacing:.14em; text-transform:uppercase; color:var(--coral-deep); }
.kids-nearby h2 { margin:0; font:800 clamp(1.45rem, 1.1rem + 1.1vw, 2rem)/1.08 var(--f-display); color:var(--teal-900); }
.kids-nearby h2 em { font-style:normal; color:var(--coral-deep); }
.kids-nearby > p:not(.kids-nearby__eyebrow) { margin:0; color:var(--text-soft); font-size:1rem; line-height:1.5; }
.kids-nearby__form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.5rem; margin-top:.2rem; }
.kids-nearby__form input { min-height:48px; padding:.6rem 1rem; border:2px solid var(--turq-400); border-radius:999px; background:#F6FCFB; color:var(--teal-900); font:700 1rem/1 var(--f-sans); }
.kids-nearby__form input:focus-visible { outline:3px solid var(--sun); outline-offset:2px; }
.kids-nearby__form .button { min-height:48px; border-radius:999px; }
.kids-nearby__map { justify-self:start; min-height:46px; border-radius:999px; }
@media (max-width:420px) { .kids-nearby__form { grid-template-columns:1fr; } .kids-nearby__map { justify-self:stretch; justify-content:center; } }

/* közösségi sáv – mesevilág: türkiz Facebook-fél, korall Instagram-fél */
.kids-page .social-band__half--facebook { --bg:#0B5A60; --fg:#FFFFFF; --accent:#FFC845; }
.kids-page .social-band__half--instagram { --bg:#C8344E; --fg:#FFFFFF; --accent:#FFE7A3; }
.kids-page .social-band__text strong { font-family:var(--f-display); font-weight:800; }
.kids-page .social-band__half--facebook:hover { background:#063F46; }
.kids-page .social-band__half--instagram:hover { background:#A92440; }
