/* Különszám · tipografikus, fekete-fehér és egyetlen vörös. Bodoni Moda (didone cím) + Literata (szöveg). */

@font-face{font-family:'Bodoni Moda';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/bodoni-moda.woff2) format('woff2');unicode-range:U+0000-00FF,U+2013-2026,U+20AC}
@font-face{font-family:'Bodoni Moda';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/bodoni-moda-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}
@font-face{font-family:'Bodoni Moda';font-style:italic;font-weight:400 900;font-display:swap;src:url(fonts/bodoni-moda-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+2013-2026,U+20AC}
@font-face{font-family:'Bodoni Moda';font-style:italic;font-weight:400 900;font-display:swap;src:url(fonts/bodoni-moda-italic-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}
@font-face{font-family:'Literata';font-style:normal;font-weight:200 900;font-display:swap;src:url(fonts/literata.woff2) format('woff2');unicode-range:U+0000-00FF,U+2013-2026,U+20AC}
@font-face{font-family:'Literata';font-style:normal;font-weight:200 900;font-display:swap;src:url(fonts/literata-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}
@font-face{font-family:'Literata';font-style:italic;font-weight:200 900;font-display:swap;src:url(fonts/literata-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+2013-2026,U+20AC}
@font-face{font-family:'Literata';font-style:italic;font-weight:200 900;font-display:swap;src:url(fonts/literata-italic-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}

:root{
  --ink:#141312;
  --paper:#f3efe6;
  --paper-2:#ebe5d8;
  --muted:#55514a;
  --red:#c4122f;
  --table:#1b1917;
  --on-table:#efe9dd;
  --didone:'Bodoni Moda',Didot,'Bodoni 72',serif;
  --text:'Literata',Georgia,serif;
  --ease:cubic-bezier(.3,.7,.2,1);
  --bk-edit:rgba(196,18,47,.6);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3  0 0 0 0 .28  0 0 0 0 .24  0 0 0 .2 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --linen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .95  0 0 0 0 .88  0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--table)}
body{margin:0;min-height:100svh;color:var(--ink);font:400 1.0625rem/1.6 var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden;
  background:var(--linen),radial-gradient(120% 70% at 40% 0%,#34302b 0%,#211f1c 45%,var(--table) 100%) fixed,var(--table)}
body.locked{overflow:hidden;height:100svh;touch-action:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
p{margin:0 0 1em}
h1,h2,h3{margin:0;overflow-wrap:break-word}
p,li,dd{overflow-wrap:break-word}

.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* Papír (címlap és belső oldalak) */
.paper{position:relative;overflow:clip;color:var(--ink);background:var(--grain),linear-gradient(170deg,#f7f3eb 0%,var(--paper) 55%,#ece6da 100%);background-color:var(--paper)}

/* ───────────── Fejléc: a címlap az asztalon ───────────── */
.hero{position:relative;padding:14px 8px 76px;isolation:isolate}
.cam{position:relative;width:min(100%,1100px);margin:0 auto;transform-origin:0 0;transition:opacity .35s ease}
.hero.pre .cam{opacity:0}
.pshadow{position:absolute;left:0;right:0;top:0;height:100%;box-shadow:0 2px 3px rgba(0,0,0,.45),0 30px 60px -12px rgba(0,0,0,.65),0 70px 120px -40px rgba(0,0,0,.5);pointer-events:none}
.cover{padding:16px 16px 22px}
.cover::before{content:'';position:absolute;left:0;right:0;top:var(--fold,57%);height:8px;margin-top:-4px;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(255,255,255,.45) 45%,rgba(0,0,0,.07) 60%,transparent)}
.paper.folded{clip-path:inset(0 0 calc(100% - var(--fold)) 0)}
.paper.folded::after{content:'';position:absolute;left:0;right:0;top:calc(var(--fold) - 30px);height:30px;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(30,25,20,.13) 80%,rgba(255,255,255,.4) 97%,rgba(0,0,0,.2))}
.strips{position:absolute;left:0;top:0;perspective:1700px;pointer-events:none}
.strip{position:absolute;left:0;width:100%;overflow:hidden;transform-origin:50% 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform}
.strip::after{content:'';position:absolute;inset:0 0 1.5px 0;background:rgba(12,10,8,var(--sh,0));pointer-events:none}
.paper.clone{position:absolute;left:0;width:100%;margin:0}
.paper.clone::before{display:none}

.mast{text-align:center;border-bottom:4px double var(--ink);padding-bottom:6px}
.mast-side{display:flex;justify-content:space-between;margin:0;font:italic 400 .8125rem/1.3 var(--text);color:var(--muted)}
.mast-title{margin:.02em 0 .06em;white-space:nowrap;font:900 min(15.2vw,9rem)/.92 var(--didone);font-variation-settings:'opsz' 96;letter-spacing:-.025em}
.folio{display:flex;justify-content:space-between;gap:10px;margin:0;padding:6px 0;border-top:1px solid var(--ink);font:500 .8125rem/1.3 var(--text)}
.headline{margin:.28em 0 .2em;font:800 calc(clamp(3.3rem,16.5vw,8rem) * var(--hs,1))/.9 var(--didone);font-variation-settings:'opsz' 96;letter-spacing:-.025em;text-wrap:balance}
.headline .hn{white-space:nowrap}
.headline em{font-style:italic;font-weight:500;color:var(--red)}
.headline .verb{display:block;margin-top:.12em;font-style:italic;font-weight:500;font-size:.5em;letter-spacing:-.01em}
.lede{display:grid;gap:14px;align-items:end;padding-bottom:4px}
.deck{margin:0;font:italic 400 1.1875rem/1.45 var(--text)}
.datebig{position:relative;justify-self:start;display:inline-flex;align-items:baseline;gap:12px;margin:6px 0 6px 14px;padding:4px 6px;font:800 1.75rem/1.1 var(--didone);font-variation-settings:'opsz' 48;white-space:nowrap}
.datebig .t{font-weight:500;font-style:italic}
.ring{position:absolute;left:-16px;right:-16px;top:-16px;bottom:-14px;width:calc(100% + 32px);height:calc(100% + 30px);overflow:visible;pointer-events:none}
.ring path{fill:none;stroke:var(--red);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.92}
.hero.done .ring path,.szerk .ring path{stroke-dashoffset:0;transition:stroke-dashoffset 1s cubic-bezier(.5,.1,.3,1) .25s}
.fold-after{display:grid;gap:18px;margin-top:16px;padding-top:16px;border-top:1px solid var(--ink)}
.cover-photo{margin:0}
.ht{position:relative;aspect-ratio:3/2;overflow:hidden;background:#d9d4c9 center/cover no-repeat}
.ht img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15);transition:opacity .5s ease}
.ht.ready img{opacity:0}
.cover-photo figcaption{padding:7px 0;border-bottom:1px solid rgba(20,19,18,.35);font:italic 400 .875rem/1.4 var(--text);color:var(--muted)}
.cover-side{display:grid;gap:18px;align-content:start}
.facts{border-top:3px solid var(--ink);padding-top:10px}
.facts p{margin:0 0 .4em;font-size:1rem}
.facts-h{font:italic 700 1.0625rem/1.3 var(--didone)!important;margin-bottom:.35em!important}
.facts-place{font:800 1.5rem/1.15 var(--didone)!important}
.toc{border-top:3px solid var(--ink);padding-top:10px}
.toc ol{list-style:none;margin:0;padding:0}
.toc a{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dotted rgba(20,19,18,.5);color:inherit;text-decoration:none;font-size:1rem}
.toc a:hover span{text-decoration:underline}
.toc i{font-style:italic;color:var(--red);white-space:nowrap}

.hero-cue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font:italic 400 .9375rem/1 var(--text);color:var(--on-table);text-decoration:none;opacity:.85;transition:opacity .5s}
.hero.opening .hero-cue{opacity:0;pointer-events:none}
.hero.opening{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;height:100svh;overflow:hidden}

.scene-ui{position:fixed;left:0;right:0;bottom:max(14px,env(safe-area-inset-bottom));z-index:9;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 16px;text-align:center;pointer-events:none;color:var(--on-table)}
.scene-hint{margin:0;font:italic 500 1.0625rem/1.3 var(--didone);transition:opacity .4s}
.scene-hint span{display:block;font:400 .8125rem/1.4 var(--text);font-style:normal;opacity:.85}
.scene-skip{pointer-events:auto;border:0;background:none;padding:8px 10px;font:400 .8125rem/1 var(--text);color:var(--on-table);text-decoration:underline;text-underline-offset:4px;cursor:pointer;transition:opacity .4s}
.hero.pulling .scene-hint,.hero.settling .scene-skip{opacity:0}

/* ───────────── Belső oldalak ───────────── */
main{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;padding:0 8px 40px}
.sheet{width:min(100%,1100px);margin:0 auto;padding:20px 18px 28px;box-shadow:0 2px 3px rgba(0,0,0,.4),0 30px 60px -20px rgba(0,0,0,.6)}
.s-interju{rotate:.35deg}
.s-program{rotate:-.4deg}
.s-ads{rotate:.25deg}
.runhead{display:flex;justify-content:space-between;gap:10px;margin:0 0 18px;padding-bottom:6px;border-bottom:1px solid var(--ink);font:italic 400 .875rem/1.3 var(--text);color:var(--muted)}
.sheet-title{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:anywhere;font:800 clamp(2.1rem,10vw,5.2rem)/.95 var(--didone);font-variation-settings:'opsz' 96;letter-spacing:-.02em;margin-bottom:.25em;text-wrap:balance}
.sheet-deck{font:italic 400 1.1875rem/1.45 var(--text);color:var(--muted);max-width:40em;padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid rgba(20,19,18,.3)}

.story-cols{column-gap:36px;column-rule:1px solid rgba(20,19,18,.22)}
.story-cols h3{break-after:avoid;margin:1.1em 0 .45em;font:700 1.1875rem/1.3 var(--text)}
.story-cols h3:first-of-type{margin-top:0}
.story-cols p{margin:0 0 .75em;font-size:1.0625rem;line-height:1.62}
.story-cols .who{font-weight:700;font-variant:small-caps;letter-spacing:.02em}
.story-cols ul{margin:0 0 1em;padding-left:1.1em}
.story-cols.article>p:first-of-type::first-letter{float:left;margin:.06em .1em 0 0;font:900 4.4em/.78 var(--didone);color:var(--red)}
.pull{column-span:all;margin:4px 0 24px;padding:.5em .2em;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);font:italic 500 clamp(1.6rem,6.2vw,2.8rem)/1.15 var(--didone);text-align:center;text-wrap:balance}
.pull::before{content:'„';color:var(--red)}
.pull::after{content:'”';color:var(--red)}

.prog-grid{display:grid;gap:30px}
.live{list-style:none;margin:0;padding:0;border-top:3px solid var(--ink)}
.live li{display:grid;grid-template-columns:76px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(20,19,18,.25)}
.live time{font:800 1.375rem/1.15 var(--didone);font-variation-settings:'opsz' 36;color:var(--red);font-variant-numeric:lining-nums}
.live h3{font:700 1.1875rem/1.3 var(--text)}
.live p{margin:.15em 0 0;color:var(--muted);font-size:1rem}
.venue{align-self:start;padding:18px 18px 20px;border:2px solid var(--ink);background:rgba(255,255,255,.35)}
.venue-k{margin-bottom:.25em;font:italic 600 1.0625rem/1.3 var(--didone);color:var(--red)}
.venue h3{font:800 clamp(1.7rem,6vw,2.4rem)/1.05 var(--didone);margin-bottom:.35em}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:2px solid var(--ink);border-radius:0;background:var(--ink);color:var(--paper);font:600 1rem/1 var(--text);text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--red);border-color:var(--red)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.red{background:var(--red);border-color:var(--red)}
.btn.red:hover{background:#9d0e25;border-color:#9d0e25}

.ads{column-gap:16px;margin-top:6px}
.ad{break-inside:avoid;margin:0 0 16px;padding:12px 14px 10px;border:1.5px solid var(--ink)}
.ad h3{font:900 1.375rem/1.1 var(--didone);margin-bottom:.3em}
.ad .txt p{margin:0 0 .5em;font-size:1rem;line-height:1.5}
.ad .txt ul{margin:0;padding-left:1.1em}
.ad-big{border:4px double var(--ink);padding:14px 16px 12px}
.ad-big h3{font-size:1.75rem}

.coupon{position:relative;margin-top:30px;padding:26px 18px 24px;border:2px dashed var(--ink);background:rgba(255,255,255,.4)}
.scissors{position:absolute;top:-11px;left:22px;width:32px;height:20px;padding:0 4px;background:var(--paper);color:var(--ink)}
.coupon-title{font:800 clamp(1.9rem,7vw,2.8rem)/1 var(--didone);margin-bottom:.3em}
.coupon-intro{color:var(--muted)}
.field{display:block;margin:0 0 20px;border:0;padding:0;min-width:0}
.field label,.field legend{display:block;margin-bottom:4px;padding:0;font:600 .9375rem/1.4 var(--text)}
.field small{display:block;margin-top:5px;font:italic 400 .875rem/1.4 var(--text);color:var(--muted)}
.input{width:100%;min-height:46px;padding:10px 2px;border:0;border-bottom:1.5px solid var(--ink);border-radius:0;background:transparent;font-size:1.0625rem}
select.input{padding-right:24px}
.input:focus{outline:none;border-bottom-color:var(--red);box-shadow:0 2px 0 var(--red)}
textarea.input{min-height:100px;padding:10px;border:1.5px solid var(--ink);resize:vertical}
.choice{display:grid;gap:8px}
.choice label{display:flex;align-items:center;gap:12px;min-height:48px;margin:0;padding:8px 2px;font-weight:500;cursor:pointer;border-bottom:1px dotted rgba(20,19,18,.4)}
.choice input{width:20px;height:20px;margin:0;accent-color:var(--red)}
.cond{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.cond>div{overflow:hidden}
.cond.show{grid-template-rows:1fr}
.form-error{min-height:1.4em;margin:0 0 10px;color:var(--red);font-weight:600}
.rsvp-submit{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.demo-note{margin:0;font:italic 400 .875rem/1.4 var(--text);color:var(--muted)}
.thanks{outline:none;padding:6px 0}
.stamp{display:inline-block;margin:0 0 14px;padding:4px 14px;border:3px solid var(--red);color:var(--red);font:900 1.6rem/1.1 var(--didone);rotate:-7deg;opacity:.9;animation:stamp .35s cubic-bezier(.2,1.6,.4,1) both}
@keyframes stamp{from{transform:scale(1.7);opacity:0}to{transform:none;opacity:.9}}
.thanks-who{font:800 1.6rem/1.15 var(--didone);overflow-wrap:anywhere}

.colophon{padding:24px 20px 70px;text-align:center;color:var(--on-table)}
.colo-title{margin:0 0 .1em;font:900 clamp(2.6rem,12vw,4.6rem)/1 var(--didone);font-variation-settings:'opsz' 96}
.colo-names{font:italic 400 1.125rem/1.4 var(--text)}
.colophon p{opacity:.9}
.replay{margin-top:10px;border:0;background:none;color:var(--on-table);font:italic 400 1rem/1 var(--text);text-decoration:underline;text-underline-offset:5px;cursor:pointer;padding:10px}

.gate{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px;overflow:auto;background:var(--linen),radial-gradient(120% 70% at 40% 0%,#34302b 0%,var(--table) 100%)}
.gate form{width:min(100%,440px);padding:26px 24px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7)}
.gate-mast{margin:0 0 6px;padding-bottom:4px;border-bottom:4px double var(--ink);font:900 2.4rem/1 var(--didone);text-align:center}
.gate h1{font:800 1.9rem/1.1 var(--didone);margin:.4em 0 .4em;overflow-wrap:anywhere}
.gate .btn{width:100%}

/* ───────────── Szélesebb képernyő ───────────── */
@media (min-width:600px){
  .cover{padding:24px 30px 30px}
  .sheet{padding:26px 34px 36px}
  .lede{grid-template-columns:1.6fr auto;gap:24px}
  .datebig{justify-self:end;margin-right:20px}
  .ads{column-count:2}
  .story-cols{column-count:2}
}
@media (min-width:900px){
  .hero{padding:44px 24px 96px}
  main{gap:56px;padding:0 24px 60px}
  .cover{padding:28px 48px 40px}
  .sheet{padding:30px 48px 46px}
  .mast-title{font-size:min(10vw,9rem)}
  .headline{font-size:calc(clamp(4.4rem,8.6vw,8.2rem) * var(--hs,1))}
  .headline .verb{display:inline;margin-left:.15em}
  .deck{font-size:1.375rem}
  .datebig{font-size:2.1rem}
  .fold-after{grid-template-columns:1.65fr 1fr;gap:34px}
  .prog-grid{grid-template-columns:1.5fr 1fr;gap:48px}
  .ads{column-count:3}
  .coupon{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;padding:34px 36px 30px}
}
@media (min-width:1100px){.story-cols.article{column-count:3}}

@media (prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none}
  .ring path{transition:none!important}
  .stamp{animation:none}
}
