/* Lokale Schriften (keine Anfrage an Google → DSGVO) */
@font-face{font-family:"Bangers";src:url(../fonts/bangers.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Special Elite";src:url(../fonts/special-elite.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Libre Franklin";src:url(../fonts/libre-franklin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
/* ==========================================================
   Netzschatz – Child-Theme „Comic-Schatzkarte“
   Zeitungspapier, Tusche, Halbton-Raster, Spot-Farben
   ========================================================== */
:root{
  --paper:#f2ead6;
  --paper-2:#e6d9b8;
  --ink:#15120f;
  --red:#e8392c;
  --yellow:#ffd21f;
  --blue:#2b63e0;
  --line:4px;
  --shadow:7px 7px 0 var(--ink);
  --comic:"Bangers",Impact,sans-serif;
  --type:"Special Elite","Courier New",monospace;
  --body:"Libre Franklin",Georgia,sans-serif;
  /* Papier-Körnung als SVG-Noise */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .25 0 0 0 0 .15 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper) var(--grain);color:var(--ink);font:400 17px/1.6 var(--body);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
@media(max-width:640px){.wrap{padding:0 16px}}

/* Halbton-Hilfsklassen */
.dots{background-image:radial-gradient(var(--ink) 1.3px,transparent 1.6px);background-size:9px 9px}
.dots-red{background:radial-gradient(#b3241a 1.6px,transparent 2px) 0 0/8px 8px,var(--red)}
.dots-yel{background:radial-gradient(#e0a800 1.7px,transparent 2.1px) 0 0/8px 8px,var(--yellow)}
.dots-blu{background:radial-gradient(#1b44a8 1.6px,transparent 2px) 0 0/8px 8px,var(--blue)}

/* ---------- Ticker ---------- */
.ticker{background:var(--ink);color:var(--yellow);font:22px/1 var(--comic);letter-spacing:.06em;overflow:hidden;white-space:nowrap;border-bottom:var(--line) solid var(--ink)}
.ticker div{display:inline-block;padding:10px 0;animation:tick 38s linear infinite}
.ticker a{margin:0 26px;color:inherit}
.ticker a:hover{color:#fff}
.ticker b{color:var(--red);font-weight:400}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---------- Masthead ---------- */
.mast{border-bottom:var(--line) solid var(--ink);background:var(--paper) var(--grain);position:relative;z-index:20}
.mast .wrap{display:flex;align-items:center;justify-content:center;gap:24px;height:92px}
.brand{font:56px/1 var(--comic);letter-spacing:.02em;color:var(--paper);-webkit-text-stroke:2.5px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--red),5px 5px 0 var(--ink);transform:rotate(-2deg);white-space:nowrap}
.brand i{font-style:normal;color:var(--yellow)}
.issue{font:13px/1.35 var(--type);border-left:3px solid var(--ink);padding-left:12px;margin-left:6px}

/* Laden: Panels poppen nacheinander rein */
.pop{animation:pop .6s cubic-bezier(.2,1.6,.4,1) both}
@keyframes pop{from{opacity:0;transform:scale(.9) rotate(-2deg)}}

/* ==========================================================
   SCHATZKARTE
   ========================================================== */
.sec{padding:70px 0}
.sec-title{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.sec-title h2{font:clamp(48px,7vw,92px)/.85 var(--comic);letter-spacing:.01em;text-transform:uppercase}
.sec-title h2 span{color:var(--red);-webkit-text-stroke:2.5px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--ink)}
.sec-title p{font:15px/1.4 var(--type);max-width:360px;padding-bottom:8px}
.sec-title .no{margin-left:auto;font:18px/1 var(--comic);letter-spacing:.08em;background:var(--ink);color:var(--paper);padding:8px 12px 6px;transform:rotate(3deg)}

.map-frame{border:var(--line) solid var(--ink);box-shadow:var(--shadow);background:#e9dcb8 var(--grain);position:relative;overflow:hidden}
.map-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.map-scroll svg{display:block;width:100%;min-width:860px;height:auto}
.isle{cursor:pointer}
.isle .land{transition:transform .35s cubic-bezier(.2,1.8,.4,1);transform-box:fill-box;transform-origin:center}
.isle:hover .land{transform:scale(1.12) rotate(-3deg)}
.isle:hover .tag rect{fill:var(--yellow)}
.isle .tag{transition:transform .25s}
.isle:hover .tag{transform:translateY(-4px)}
.route{stroke-dasharray:14 10;stroke-dashoffset:0}
.route-mask{stroke-dasharray:3000;stroke-dashoffset:3000;transition:stroke-dashoffset 3.2s ease-in-out}
.map-frame.go .route-mask{stroke-dashoffset:0}
.xmark{animation:throb 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes throb{50%{transform:scale(1.18)}}

/* ==========================================================
   FUNDSTÜCKE – Comic-Seite mit Panels
   ========================================================== */
.comic{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(210px,auto);gap:18px}
.fund{position:relative;display:flex;flex-direction:column;border:var(--line) solid var(--ink);background:var(--paper);box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;overflow:hidden}
.fund:hover{transform:translate(-4px,-4px) rotate(-.4deg);box-shadow:11px 11px 0 var(--ink)}
.fund .art{position:relative;flex:1;min-height:150px;border-bottom:var(--line) solid var(--ink);display:grid;place-items:center;overflow:hidden}
.fund .art .word{font:clamp(44px,6vw,88px)/.8 var(--comic);text-transform:uppercase;color:var(--paper);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:5px 5px 0 var(--ink);transform:rotate(-6deg);letter-spacing:.02em}
.fund .num{position:absolute;top:0;left:0;font:20px/1 var(--comic);background:var(--ink);color:var(--paper);padding:8px 10px 6px;z-index:1}
.fund .vid{position:absolute;right:12px;top:12px;z-index:1;font:18px/1 var(--comic);letter-spacing:.04em;background:#fff;border:3px solid var(--ink);padding:8px 10px 6px;border-radius:50%/60%;transform:rotate(8deg)}
.fund .txt{padding:16px 18px 18px;background:var(--paper)}
.fund .kat{font:13px var(--type);color:var(--red)}
.fund h3{font:800 21px/1.15 var(--body);letter-spacing:-.01em;margin-top:4px}
.fund p{font-size:15px;margin-top:6px;color:#3d3833}
.fund .more{display:inline-block;margin-top:10px;font:18px/1 var(--comic);letter-spacing:.05em;border-bottom:3px solid var(--red)}
.fund.big{grid-column:span 4;grid-row:span 2}
.fund.big .art .word{font-size:clamp(52px,11vw,170px)}
.fund.big h3{font-size:30px}
.fund.tall{grid-column:span 2;grid-row:span 2}
.fund.wide{grid-column:span 3}
.fund.sm{grid-column:span 2}
.fund.fill-4{grid-column:span 4}
.fund.fill-6{grid-column:span 6;grid-row:auto}
@media(max-width:980px){.comic{grid-template-columns:repeat(2,1fr)}.fund.big{grid-column:span 2;grid-row:auto}.fund.tall,.fund.wide,.fund.sm{grid-column:span 1;grid-row:auto}.fund.fill-4,.fund.fill-6{grid-column:span 2}}
@media(max-width:560px){.comic{grid-template-columns:1fr}.fund.big,.fund.tall,.fund.wide,.fund.sm,.fund.fill-4,.fund.fill-6{grid-column:auto}}

/* Speed-Lines hinter Panel-Art */
.speed{background:repeating-conic-gradient(from 0deg at 50% 50%,var(--paper) 0 4deg,transparent 4deg 12deg),var(--blue)}

/* ==========================================================
   EINZELBEITRAG – „Fundakte“
   ========================================================== */
.akte-head{padding:40px 0 10px}
.crumbs{font:14px var(--type);margin-bottom:18px}
.crumbs a{border-bottom:2px solid var(--red)}
.cover-panel{display:grid;grid-template-columns:auto 1fr;border:var(--line) solid var(--ink);box-shadow:var(--shadow);background:var(--paper)}
.cover-side{border-right:var(--line) solid var(--ink);padding:22px 18px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;align-items:center;background:var(--red);color:var(--paper)}
.cover-side .n{font:64px/.8 var(--comic);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ink)}
.cover-side small{font:13px var(--type);writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.1em}
.cover-main{padding:34px 36px 30px;position:relative;overflow:hidden}
.cover-main::after{content:"";position:absolute;right:-60px;top:-60px;width:320px;height:320px;border-radius:50%;background:radial-gradient(var(--ink) 1.5px,transparent 1.8px) 0 0/10px 10px;opacity:.35}
.cover-main .kat{display:inline-block;font:20px/1 var(--comic);letter-spacing:.06em;background:var(--yellow);border:3px solid var(--ink);padding:7px 10px 5px;transform:rotate(-2deg)}
.cover-main h1{font:clamp(56px,9vw,128px)/.84 var(--comic);text-transform:uppercase;margin:18px 0 14px;position:relative;z-index:1}
.cover-main h1 span{display:block;color:var(--red);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:5px 5px 0 var(--ink)}
.cover-main .sub{font-size:19px;max-width:620px;position:relative;z-index:1}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;font:14px var(--type);position:relative;z-index:1}
.facts span{border:2px dashed var(--ink);padding:5px 10px}
@media(max-width:640px){.cover-panel{grid-template-columns:1fr}.cover-side{flex-direction:row;border-right:0;border-bottom:var(--line) solid var(--ink);padding:12px 18px}.cover-side small{writing-mode:initial;transform:none}.cover-main{padding:24px 20px}}

/* Retro-Fernseher um das Video */
.tv-zone{display:grid;grid-template-columns:1fr 300px;gap:30px;margin-top:44px;align-items:start}
.tv{position:relative;background:#7a4a26;background:linear-gradient(135deg,#8e5a30,#5e3619);border:var(--line) solid var(--ink);border-radius:28px;padding:22px 110px 22px 22px;box-shadow:var(--shadow)}
.tv::before,.tv::after{content:"";position:absolute;top:-70px;width:5px;height:84px;background:var(--ink);border-radius:4px}
.tv::before{left:38%;transform:rotate(-28deg);transform-origin:bottom}
.tv::after{left:42%;transform:rotate(24deg);transform-origin:bottom}
.screen{position:relative;aspect-ratio:4/3;border:var(--line) solid var(--ink);border-radius:36px/28px;overflow:hidden;background:#1d2a24;display:grid;place-items:center}
.screen::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 3px,rgba(0,0,0,.28) 3px 4px);pointer-events:none;z-index:2}
.screen::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 40% 30%,rgba(255,255,255,.18),transparent 55%),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.6));pointer-events:none;z-index:3}
.screen .static{position:absolute;inset:0;background:var(--grain),#394a41;background-size:180px;animation:static .25s steps(3) infinite;opacity:.9}
@keyframes static{33%{background-position:40px 70px}66%{background-position:-60px 20px}}
.screen .play{position:relative;z-index:4;width:96px;height:96px;border-radius:50%;border:var(--line) solid var(--ink);background:var(--yellow);box-shadow:5px 5px 0 var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .2s}
.screen .play:hover{transform:scale(1.08) rotate(-6deg)}
.screen .onair{position:absolute;z-index:4;left:18px;top:16px;font:18px/1 var(--comic);letter-spacing:.08em;color:var(--paper);background:var(--red);padding:6px 9px 4px;border:2px solid var(--ink)}
.knobs{position:absolute;right:22px;top:26px;bottom:26px;width:66px;display:flex;flex-direction:column;align-items:center;gap:18px}
.knob{width:54px;height:54px;border-radius:50%;background:#d8c9a3;border:var(--line) solid var(--ink);position:relative}
.knob::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:16px;background:var(--ink);transform:translateX(-50%)}
.knob:nth-child(2)::after{transform:translateX(-50%) rotate(60deg);transform-origin:50% 20px}
.grill{flex:1;width:100%;background:repeating-linear-gradient(var(--ink) 0 3px,transparent 3px 9px);opacity:.75;border-radius:6px}
.tv-feet{display:flex;justify-content:space-between;padding:0 60px}
.tv-feet i{width:26px;height:22px;background:var(--ink);transform:skewX(-14deg)}
.tv-feet i:last-child{transform:skewX(14deg)}
@media(max-width:980px){.tv-zone{grid-template-columns:1fr;margin-top:90px}}
@media(max-width:560px){.tv{padding:14px;border-radius:20px}.knobs{display:none}.tv-feet{padding:0 30px}}

/* Notizzettel mit Klebeband */
.note{position:relative;background:#fff6a8;padding:30px 24px 24px;transform:rotate(2deg);box-shadow:4px 6px 0 rgba(21,18,15,.25);font:16px/1.5 var(--type)}
.note::before{content:"";position:absolute;top:-14px;left:50%;width:110px;height:30px;transform:translateX(-50%) rotate(-4deg);background:rgba(232,57,44,.55);border-left:2px dashed rgba(0,0,0,.15);border-right:2px dashed rgba(0,0,0,.15)}
.note h4{font:28px/1 var(--comic);letter-spacing:.04em;margin-bottom:10px}
.note + .note{margin-top:30px;transform:rotate(-2deg);background:#cfe3ff}

/* Tickets = Links */
.tickets-head{margin:70px 0 24px}
.tickets{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 26px}
.ticket{display:flex;position:relative;filter:drop-shadow(5px 5px 0 var(--ink));transition:transform .2s}
.ticket:nth-child(4n+1){transform:rotate(-.8deg)}
.ticket:nth-child(4n+2){transform:rotate(.6deg)}
.ticket:nth-child(4n+3){transform:rotate(.4deg)}
.ticket:nth-child(4n){transform:rotate(-.5deg)}
.ticket:hover{transform:rotate(0) translate(-3px,-3px) scale(1.02)}
.ticket .stub,.ticket .body{border:var(--line) solid var(--ink)}
.ticket .stub{width:96px;flex:none;display:grid;place-items:center;text-align:center;font:34px/.9 var(--comic);background:var(--red);color:var(--paper);border-right:3px dashed var(--ink);
  -webkit-mask:radial-gradient(circle at 100% 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at 100% 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle at 100% 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at 100% 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat}
.ticket .stub small{display:block;font:11px var(--type);letter-spacing:.1em;margin-top:4px}
.ticket .body{flex:1;border-left:0;background:var(--paper) var(--grain);padding:16px 18px;display:flex;align-items:center;gap:12px;
  -webkit-mask:radial-gradient(circle at 0 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at 0 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle at 0 0,transparent 12px,#000 13px) top/100% 51% no-repeat,radial-gradient(circle at 0 100%,transparent 12px,#000 13px) bottom/100% 51% no-repeat}
.ticket b{display:block;font:28px/1 var(--comic);letter-spacing:.04em}
.ticket small.d{font:13px var(--type);color:#5b544b}
.ticket .arrow{margin-left:auto;font:34px/1 var(--comic);transition:transform .2s}
.ticket:hover .arrow{transform:translateX(5px);color:var(--red)}
.ticket:nth-child(3n+2) .stub{background:var(--blue)}
.ticket:nth-child(3n) .stub{background:var(--ink);color:var(--yellow)}
@media(max-width:700px){.tickets{grid-template-columns:1fr}}

/* Wegweiser vorher/nachher */
.signs{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:70px}
.sign{position:relative;padding:22px 26px;background:#c98b4d;border:var(--line) solid var(--ink);box-shadow:var(--shadow);transition:transform .2s}
.sign.prev{clip-path:polygon(9% 0,100% 0,100% 100%,9% 100%,0 50%);padding-left:60px;transform:rotate(-1.5deg)}
.sign.next{clip-path:polygon(0 0,91% 0,100% 50%,91% 100%,0 100%);padding-right:60px;text-align:right;transform:rotate(1.5deg)}
.sign:hover{transform:rotate(0) scale(1.02)}
.sign small{font:13px var(--type)}
.sign b{display:block;font:30px/1 var(--comic);letter-spacing:.03em;margin-top:6px}
@media(max-width:640px){.signs{grid-template-columns:1fr}}


@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ==========================================================
   THEME-ERGÄNZUNGEN (WordPress / GeneratePress)
   ========================================================== */

/* GeneratePress-Container für Vollbreite neutralisieren */
body.ns{background:var(--paper) var(--grain);color:var(--ink);font:400 17px/1.6 var(--body)}
.ns-full .site.grid-container{max-width:none;padding:0;background:none}
.ns-full .site-content{display:block;padding:0}
.ns-full .site-content > .content-area{width:auto}
.ns h1,.ns h2,.ns h3,.ns h4{color:inherit}
.ns a{transition:color .15s}
.ns button{border-radius:0}


/* Kopfzeile auf dem Handy: Logo und Ausgabe-Info untereinander, zentriert */
@media(max-width:640px){
  .mast .wrap{flex-direction:column;gap:10px;height:auto;padding-top:16px;padding-bottom:14px}
  .brand{font-size:44px}
  .issue{border-left:0;padding-left:0;margin-left:0;text-align:center}
  .issue .legal{justify-content:center}
}

/* Rechtliches im Masthead */
.issue .legal{display:flex;gap:10px;margin-top:2px}
.issue .legal a{text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:2px}


/* Echtes Video im Fernseher */
.screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;z-index:1}
.screen .static{z-index:2}
.screen.playing .static,.screen.playing .play,.screen.playing .onair{display:none}
.screen.playing::before,.screen.playing::after{display:none}
.screen.playing video{object-fit:contain}
.tv-stack{display:grid;gap:40px}
.tv-small .tv{padding-right:22px}
.tv-small .knobs{display:none}
.tv-zone.no-video{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:40px}
.tv-zone.no-video .notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:30px}
.tv-zone.no-video .note + .note{margin-top:0}

/* Fließtext auf Themen-Seiten (z. B. IPTV-Artikel) */
.prose{max-width:760px;margin:0 auto;padding:36px 40px;background:#fff;border:var(--line) solid var(--ink);box-shadow:var(--shadow);font-size:18px}
.prose h2{font:clamp(34px,4vw,48px)/.95 var(--comic);letter-spacing:.02em;margin:1.2em 0 .4em}
.prose h2:first-child{margin-top:0}
.prose h3{font:800 22px/1.2 var(--body);margin:1.2em 0 .4em}
.prose p,.prose ul,.prose ol{margin:0 0 1em}
.prose ul,.prose ol{padding-left:1.3em}
.prose a{color:var(--red);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose strong{background:linear-gradient(transparent 60%,var(--yellow) 60%)}
.prose-sec{padding:60px 0 0}
@media(max-width:640px){.prose{padding:24px 18px;font-size:17px}}

/* Wegweiser: Platzhalter, wenn es keinen Vorgänger gibt */
.signs > span{display:block}

/* Standard-Seiten von GeneratePress (Impressum, Suche, 404 …) im Comic-Look */
body.ns:not(.ns-full) .site.grid-container{background:none}
body.ns:not(.ns-full) .site-content{padding:40px 28px 80px}
.ns .inside-article,.ns .page-header,.ns .no-results .inside-article{background:var(--paper);border:var(--line) solid var(--ink);box-shadow:var(--shadow)}
.ns .separate-containers .inside-article,.separate-containers.ns .inside-article{padding:36px 40px}
.ns .entry-title,.ns .page-title{font:clamp(40px,6vw,72px)/.9 var(--comic);letter-spacing:.02em;text-transform:uppercase}
.ns .entry-title a{color:var(--ink)}
.ns .entry-title a:hover{color:var(--red)}
.ns .entry-meta,.ns .entry-meta a{font:14px var(--type);color:#5b544b}
.ns .entry-content a{color:var(--red);text-decoration:underline}
.ns .search-form .search-field{border:3px solid var(--ink);background:#fff;font:16px var(--type)}
.ns .search-form .search-submit,.ns .search-form button{background:var(--ink);color:var(--yellow);border:0}
.ns .site-main > article{margin-bottom:24px}
.ns .paging-navigation a,.ns .nav-links a{font:22px/1 var(--comic);letter-spacing:.04em}
@media(max-width:640px){body.ns:not(.ns-full) .site-content{padding:24px 16px 60px}.ns .separate-containers .inside-article,.separate-containers.ns .inside-article{padding:22px 18px}}

/* Handy-Karte: senkrechte Schlangen-Route statt Wisch-Karte */
.map-mobile{display:none}
@media(max-width:700px){
  .map-scroll{display:none}
  .map-mobile{display:block;width:100%;height:auto}
  .map-mobile .isle:hover .land{transform:scale(1.06) rotate(-2deg)}
}