/* Unternehmer:Leben · Veronika & Fabian Westerheide
   Angelehnt an den Rise-of-AI-Styleguide (2022):
   Montserrat (statt Gotham) für Überschriften, versal, Medium, gesperrt 50 · Übertitel Book, gesperrt 200.
   Source Sans 3 (statt Source Sans Pro) für Fließtext, Regular, Zeilenabstand 144 %, linksbündig, kein Kursiv/Fett.
   Farben: Blau #31445b, Orange #f67456, Seidengrau #ada8a9, Altweiß #ededef. Highlight Hellblau #97c4e1, Türkis #4a8297.
   Handschrift-Notizen: Caveat (OFL), wie Randnotizen.
   Zwei Stimmen: Veronika orange (immer zuerst), Fabian türkis/hellblau.
   Schriften lokal, SIL Open Font License 1.1. */
@font-face{font-family:"Montserrat";src:url("../fonts/montserrat.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Caveat";src:url("../fonts/caveat.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../fonts/source-sans-3.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap}

:root{
  color-scheme:light;
  --blue:#31445b; --orange:#f67456; --orange-ink:#d9573a; --silk:#ada8a9; --altweiss:#ededef;
  --ground:#ffffff; --ink:#31445b; --ink-2:#5d6b7c; --line:#31445b; --hair:#dfe2e8;
  --v:#d9573a; --f:#4a8297;
  --display:"Montserrat","Gotham","Helvetica Neue",Arial,sans-serif;
  --body:"Source Sans 3","Source Sans Pro","Segoe UI",Arial,sans-serif;
  --hand:"Caveat","Bradley Hand","Segoe Print",cursive;
}
.dark{--ink:#ffffff; --ink-2:#c9d0da; --line:rgba(255,255,255,.35); --v:#f67456; --f:#97c4e1; background:var(--blue); color:#fff}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--ground);color:var(--ink);font:400 19px/1.44 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}
b,strong{font-weight:inherit}
em,i{font-style:normal}
a{color:inherit}
a:hover{color:var(--v)}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:2px}
img{display:block;max-width:100%;height:auto}
.skip{position:absolute;left:-9999px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip:focus{left:16px;top:16px;background:#fff;color:var(--blue);padding:8px 12px;z-index:10}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3,h4{font-family:var(--display);font-weight:500;margin:0;text-wrap:balance;text-transform:uppercase;letter-spacing:.05em;line-height:1.12;color:var(--ink)}
h2{font-size:clamp(26px,3.4vw,40px)}
p{margin:0}
.kicker{font:400 12.5px/1.3 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--v)}
.dark .kicker{color:#fff}
/* Handschrift-Notizen: Caveat, leicht schräg, wie Randnotizen von Veronika und Fabian */
.hand{font-family:var(--hand);font-weight:600;font-size:30px;letter-spacing:0;line-height:1;display:inline-block;text-transform:none;transform:rotate(-3deg)}
.hand.v{color:var(--v)} .hand.f{color:var(--f)}
.cta{font:500 14px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:12px 0;display:inline-block;color:var(--v)}
.cta:hover{color:var(--ink)}

.colon{display:inline-flex;flex-direction:column;justify-content:center;gap:.13em;margin:0 .06em;height:.72em;vertical-align:baseline}
.colon i{display:block;width:.17em;height:.17em;border-radius:50%}
.colon i:first-child{background:var(--orange)}
.colon i:nth-child(2){background:var(--f)}

/* Kopf */
.sitebar{border-bottom:1px solid var(--line)}
.sitebar .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 28px;padding-block:16px;font:500 12px/1.2 var(--display);letter-spacing:.16em;text-transform:uppercase}
.logo{font:500 17px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;color:var(--ink)}
nav.main ul{display:flex;flex-wrap:wrap;gap:8px 24px;list-style:none;margin:0;padding:0}
nav.main a{text-decoration:none}
nav.main a[aria-current="page"]{color:var(--v)}
.home .sitebar{border-bottom-color:transparent}

header.top .wrap{padding-block:clamp(48px,8vw,104px) 40px;display:flex;flex-direction:column;gap:clamp(36px,5vw,64px)}
.hero h1{font-size:clamp(34px,7.4vw,104px);letter-spacing:.04em;line-height:1.02;display:flex;flex-wrap:wrap;align-items:center}
.hero .sub{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);gap:20px 48px;align-items:end;margin-top:30px}
.hero .sub p{font-size:clamp(20px,2vw,24px);line-height:1.44;max-width:40ch;color:var(--ink-2)}
.hero .sub .hand{font-size:clamp(34px,3.4vw,44px);max-width:14ch}
.baseline{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 24px;border-top:1px solid var(--line);padding-top:20px}
.listen{display:flex;flex-wrap:wrap;gap:10px}
.pill{display:inline-flex;align-items:center;border-radius:999px;padding:11px 22px;font:500 13px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:1.5px solid currentColor;color:var(--ink)}
.pill.solid{background:var(--blue);border-color:var(--blue);color:#fff}
.dark .pill.solid{background:#fff;border-color:#fff;color:var(--blue)}
.pill:hover{border-color:var(--orange);color:var(--v)}
.pill.solid:hover{background:var(--orange);border-color:var(--orange);color:var(--blue)}

.herophoto{position:relative;background:var(--blue);margin:0}
.herophoto img{width:100%;height:clamp(300px,50vw,640px);object-fit:cover;object-position:50% 32%}
.herophoto .hand{position:absolute;left:max(16px,env(safe-area-inset-left,0px));bottom:18px;color:#fff;font-size:clamp(34px,4vw,50px);text-shadow:0 1px 10px rgba(0,0,0,.55)}
.credit{font:400 12px/1.4 var(--display);letter-spacing:.06em;color:var(--ink-2);padding-block:10px}


/* Studio / Regieraum: Live aus unserem Leben */
.studio{background:#1b2633;color:#fff;padding-block:clamp(28px,4vw,48px) clamp(36px,5vw,56px)}
.studio-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-bottom:20px;font:500 12px/1.3 var(--display);letter-spacing:.18em;text-transform:uppercase;color:#c9d0da}
.studio-title{flex:1 1 240px}
.onair{font:600 15px/1 var(--display);letter-spacing:.24em;text-transform:uppercase;color:#ffd9cf;background:#d9573a;border:2px solid #f67456;border-radius:6px;padding:10px 16px;box-shadow:0 0 18px rgba(246,116,86,.75),0 0 46px rgba(246,116,86,.35);text-shadow:0 0 8px rgba(255,255,255,.7)}
.tc{display:inline-flex;align-items:center;gap:10px;font:500 15px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:#fff;font-variant-numeric:tabular-nums}
.rec-dot{width:10px;height:10px;border-radius:50%;background:#f67456;box-shadow:0 0 10px #f67456}
.monitors{display:grid;grid-template-columns:3fr 1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px}
.mon{position:relative;margin:0;background:#0e1622;border:3px solid #0e1622;border-radius:6px;overflow:hidden;min-height:0}
.mon.main{grid-row:1/4}
.mon img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.03)}
.mon:not(.main){aspect-ratio:16/9}
.mon::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.08) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.35) 100%)}
.mon figcaption{position:absolute;left:10px;bottom:8px;z-index:1;font:500 11px/1.3 var(--display);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(14,22,34,.72);padding:5px 9px;border-radius:3px}
.mon figcaption b{color:#f67456;font-weight:600;margin-right:6px}
.mon .rec{position:absolute;right:12px;top:10px;z-index:1;font:600 12px/1 var(--display);letter-spacing:.16em;color:#fff;display:flex;align-items:center;gap:7px}
.mon .rec::before{content:"";width:10px;height:10px;border-radius:50%;background:#f67456;box-shadow:0 0 8px #f67456}
.mon .note{position:absolute;right:18px;bottom:44px;z-index:1;color:#fff;font-size:clamp(28px,3vw,40px);text-shadow:0 1px 10px rgba(0,0,0,.7)}
.mon:hover img{transform:scale(1.03)} .mon img{transition:transform .6s ease}
.ticker{margin-top:14px;overflow:hidden;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);padding-block:10px;white-space:nowrap}
.ticker .track{display:inline-flex;gap:0;animation:tick 40s linear infinite}
.ticker span{font:500 13px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;color:#c9d0da;padding-inline:22px;position:relative}
.ticker span::after{content:"●";position:absolute;right:-5px;color:#f67456;font-size:7px;top:3px}
.truman{margin-top:18px;text-align:right}
.truman .hand{color:#97c4e1;font-size:clamp(24px,2.4vw,32px)}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:no-preference){
  .onair{animation:flicker 2.2s ease-out 1 both}
  .rec-dot,.mon .rec::before{animation:blink 1.2s steps(1) infinite}
  @keyframes flicker{0%{opacity:.25;box-shadow:none}8%{opacity:1}12%{opacity:.3}20%{opacity:1}24%{opacity:.5}32%,100%{opacity:1}}
  @keyframes blink{50%{opacity:.15}}
}
@media (prefers-reduced-motion:reduce){.ticker .track{animation:none;flex-wrap:wrap;white-space:normal}}
@media (max-width:760px){
  .monitors{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .mon.main{grid-row:auto;grid-column:1/-1;aspect-ratio:16/9}
  .mon:not(.main):last-child{grid-column:1/-1}
}

/* Seitenkopf Unterseiten */
.pagehead .wrap{padding-block:clamp(36px,5vw,64px) 44px}
.pagehead h1{font-size:clamp(32px,5.6vw,72px);letter-spacing:.05em;line-height:1.08;margin-top:18px}
.pagehead .sub{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:end;justify-content:space-between;margin-top:22px}
.pagehead .sub p{font-size:clamp(19px,1.9vw,23px);line-height:1.44;max-width:46ch;color:var(--ink-2)}
.pagehead .sub .hand{font-size:clamp(32px,3.2vw,42px)}
.crumb{font:400 12px/1.3 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.crumb a{text-decoration:none}

section.block{padding-block:clamp(56px,8vw,96px)}
section.white{background:var(--altweiss)}
.sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-bottom:36px}
.sechead h2{margin-top:12px}
.sechead p{max-width:42ch;color:var(--ink-2)}
.sechead .hand{font-size:36px}

/* Neueste Folge */
.latest{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.cover{aspect-ratio:1;max-width:100%;background:var(--blue);color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:space-between;position:relative}
.cover .ct{font:500 clamp(26px,3vw,34px)/1.1 var(--display);letter-spacing:.06em;text-transform:uppercase}
.cover .ct .colon i:nth-child(2){background:#97c4e1}
.cover small{font:400 11px/1.3 var(--display);letter-spacing:.2em;text-transform:uppercase;color:#c9d0da}
.cover .hand{position:absolute;right:16px;top:12px;font-size:32px;color:#f67456;transform:rotate(6deg)}
.latest h3{font-size:clamp(22px,2.6vw,32px);margin-block:14px 18px;line-height:1.2}
.latest h3 a{text-decoration:none}
.lead{font-size:21px;line-height:1.44;max-width:62ch}
.player{margin-top:26px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding-block:14px}
.player audio{width:100%;display:block}
.player p{font:400 12px/1.4 var(--display);letter-spacing:.04em;color:var(--ink-2);margin-top:8px}

/* Themen */
.toc a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:baseline;padding-block:20px;border-bottom:1px solid var(--line);text-decoration:none}
.toc a:first-child{border-top:2px solid var(--line)}
.toc .t{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 24px;min-width:0}
.toc .t b{font:500 clamp(22px,2.8vw,34px)/1.15 var(--display);letter-spacing:.06em;text-transform:uppercase}
.toc .n{font:400 12px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;color:var(--ink-2)}
.toc .n::after{content:" →";color:var(--v)}
.toc a:hover b{color:var(--v)}

/* Folgenliste */
.ep{display:grid;grid-template-columns:clamp(56px,7vw,92px) minmax(0,1fr) 120px;gap:10px 28px;padding-block:26px;border-bottom:1px solid var(--hair);align-items:start}
.eps .ep:first-child{border-top:2px solid var(--line)}
.ep .no{font:500 clamp(30px,4vw,48px)/1 var(--display);letter-spacing:.04em;color:var(--orange-ink)}
.ep h3{font-size:clamp(17px,1.8vw,21px);line-height:1.3;letter-spacing:.04em}
.ep h3 a{text-decoration:none}
.ep p{font-size:17.5px;color:var(--ink-2);margin-top:8px;max-width:68ch}
.tags{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:12px}
.tags a{font:500 11px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;background:var(--altweiss);color:var(--ink);padding:6px 11px;border-radius:999px}
.white .tags a{background:#fff}
.tags a:hover{background:var(--orange);color:var(--blue)}
.ep .meta{font:400 12px/1.5 var(--display);letter-spacing:.12em;text-transform:uppercase;text-align:right;font-variant-numeric:tabular-nums}
.ep .meta span{display:block;color:var(--ink-2)}

/* Folgenseite */
.episode{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:clamp(32px,5vw,72px);padding-block:clamp(48px,7vw,88px)}
.episode h2{font-size:clamp(20px,2.2vw,26px);margin-block:48px 16px}
.episode .body p{margin-bottom:14px;max-width:66ch}
.points{list-style:none;margin:0;padding:0}
.points li{padding:12px 0 12px 28px;border-bottom:1px solid var(--hair);position:relative}
.points li::before{content:"";position:absolute;left:0;top:1.3em;width:14px;height:2px;background:var(--orange)}
.points li:first-child{border-top:2px solid var(--line)}
details{border-bottom:1px solid var(--hair);padding-block:16px}
.faq details:first-child{border-top:2px solid var(--line)}
summary{cursor:pointer;font:500 17px/1.35 var(--display);letter-spacing:.02em;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--orange-ink);font-size:22px;line-height:1}
details[open] summary::after{content:"–"}
details p{margin-top:10px;color:var(--ink-2)}
.disclaimer{font-size:16px;color:var(--ink-2);border-left:3px solid var(--orange);padding-left:14px;margin-top:22px}
.side{display:flex;flex-direction:column;min-width:0;font-size:17px}
.side div{border-top:1px solid var(--line);padding-block:16px}
.side div:first-child{border-top-width:2px}
.side .kicker{display:block;margin-bottom:8px}
.side ul{margin:0;padding-left:18px}

/* Hosts */
.hosts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,56px)}
.host .photo{position:relative;margin:0}
.host .photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 15%}
.host .photo .hand{position:absolute;right:16px;bottom:14px;color:#fff;font-size:clamp(30px,3vw,40px);text-shadow:0 1px 10px rgba(0,0,0,.6)}
.host h3{font-size:clamp(24px,2.8vw,34px);margin-block:22px 12px}
.host h3 a{text-decoration:none}
.host .links{font:500 12px/1.6 var(--display);letter-spacing:.1em;text-transform:uppercase;margin-top:16px;border-top:1px solid var(--hair);padding-top:12px}
.host .links a{text-decoration:none}
.story{margin-top:clamp(56px,8vw,88px)}
.story h3{font-size:clamp(22px,2.6vw,30px);margin-bottom:22px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:40px}
.strip figure,.gallery figure{margin:0}
.strip img{width:100%;aspect-ratio:3/4;object-fit:cover}
.strip figcaption,.gallery figcaption{font:400 13px/1.4 var(--display);letter-spacing:.02em;color:var(--ink-2);margin-top:8px}
.quote-hand{display:block;font:600 clamp(34px,3.6vw,46px)/1.05 var(--hand);margin-block:26px 8px;transform:rotate(-2deg);transform-origin:left}
.quote-hand.v{color:var(--v)} .quote-hand.f{color:var(--f)}
.quote-src{font-size:15px!important;color:var(--ink-2)}

/* Wiki */
.wiki{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:clamp(32px,5vw,72px);padding-block:clamp(48px,7vw,88px);align-items:start}
.wiki .body{min-width:0;grid-column:1;grid-row:1}
.wiki .infobox{grid-column:2;grid-row:1;position:sticky;top:16px}
.toc-box{background:var(--altweiss);padding:18px 20px;margin-block:30px 8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 32px}
.toc-box .kicker{grid-column:1/-1;margin-bottom:6px}
.toc-box a{font:500 14px/1.3 var(--display);letter-spacing:.04em;text-decoration:none;padding-block:5px}
.toc-box a span{color:var(--orange-ink);display:inline-block;width:2em;font-variant-numeric:tabular-nums}
.wiki h2.sec{font-size:clamp(20px,2.3vw,28px);margin-block:56px 16px;padding-bottom:12px;border-bottom:2px solid var(--line);scroll-margin-top:16px}
.wiki h2.sec small{font-size:.6em;color:var(--orange-ink);font-weight:500;margin-right:.6em;vertical-align:.12em;letter-spacing:.1em}
.wiki .body p{margin-bottom:14px;max-width:68ch}
.facts{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.facts li{border-bottom:1px solid var(--hair);padding-block:12px;font-size:17px;display:grid;gap:4px}
.facts li b{font:400 11px/1.2 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--orange-ink)}
.timeline-wrap{overflow-x:auto}
.timeline{width:100%;border-collapse:collapse;font-size:17px}
.timeline th,.timeline td{text-align:left;vertical-align:top;padding:12px 16px 12px 0;border-bottom:1px solid var(--hair)}
.timeline th{font:500 14px/1.5 var(--display);letter-spacing:.08em;white-space:nowrap;color:var(--orange-ink);width:110px;font-variant-numeric:tabular-nums}
.timeline tr:first-child th,.timeline tr:first-child td{border-top:2px solid var(--line)}
.infobox{border:1px solid var(--hair);background:#fff;font-size:16px}
.infobox .ib-title{font:500 16px/1.3 var(--display);letter-spacing:.08em;text-transform:uppercase;padding:14px 16px;background:var(--blue);color:#fff}
.infobox img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 15%}
.infobox .cap{font:400 12.5px/1.4 var(--display);color:var(--ink-2);padding:8px 16px;border-bottom:1px solid var(--hair)}
.infobox dl{margin:0;display:grid;grid-template-columns:minmax(0,108px) minmax(0,1fr)}
.infobox dt,.infobox dd{margin:0;padding:9px 16px 9px 0;border-bottom:1px solid var(--hair)}
.infobox dt{padding-left:16px;font:500 11px/1.6 var(--display);letter-spacing:.12em;text-transform:uppercase}
.infobox dl > :nth-last-child(-n+2){border-bottom:0}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover}
.qlist{border-top:2px solid var(--line)}
.qlist p{border-bottom:1px solid var(--hair);padding-block:12px;margin:0!important;font-size:17px}
.qlist b{font:500 13px/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--orange-ink);margin-right:6px}
.qlist a{text-decoration:none}

/* Text */
.legal{padding-block:clamp(48px,7vw,88px);max-width:760px}
.legal h2{font-size:18px;margin-block:32px 10px}
.legal p,.legal ul{margin-bottom:12px}

.ink{display:inline-block;max-width:100%;height:auto;vertical-align:middle}
.v-ink{color:var(--v)} .f-ink{color:var(--f)} .w-ink{color:#fff}
.ink-row{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center;margin-block:28px}
.ink-row .ink:first-child{transform:rotate(-3deg)} .ink-row .ink:last-child{transform:rotate(2deg)}
.hosts-sig{margin-top:36px;transform:rotate(-2deg)}
.pagehead .w-ink{transform:rotate(-3deg)}
/* Schreibt uns */
.ask{background:var(--orange);color:var(--blue)}
.ask .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px 64px;align-items:center;padding-block:clamp(48px,7vw,88px)}
.ask .kicker{color:var(--blue)}
.ask h2{font-size:clamp(34px,5vw,64px);margin-block:12px 16px;color:var(--blue)}
.ask p{font-size:20px;max-width:46ch}
.ask-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:22px}
.ask .pill.solid{background:var(--blue);border-color:var(--blue);color:#fff}
.ask .pill.solid:hover{background:#fff;border-color:#fff;color:var(--blue)}
.ask .mail{font:500 17px/1 var(--display);letter-spacing:.04em;user-select:all}
.ask-sig{display:flex;flex-direction:column;gap:18px;color:var(--blue)}
.ask-sig .ink:first-child{transform:rotate(-4deg)} .ask-sig .ink:last-child{transform:rotate(-1deg)}
footer .egg{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px}
.egg-ink{color:#97c4e1}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-block:30px;font:400 12px/1.5 var(--display);letter-spacing:.14em;text-transform:uppercase}
footer a{text-decoration:none}
footer .egg{flex-basis:100%;font:400 12px/1.4 var(--display);letter-spacing:.04em;text-transform:none;color:#8d9ab0;border-top:1px solid rgba(255,255,255,.15);padding-top:14px}
footer .hand{font-size:30px;color:#f67456;text-transform:none;letter-spacing:0}

@media (max-width:900px){
  .ask .wrap{grid-template-columns:minmax(0,1fr)}
  .latest,.episode,.hosts,.cols,.wiki{grid-template-columns:minmax(0,1fr)}
  .strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cover{max-width:280px}
  .hero .sub{grid-template-columns:minmax(0,1fr)}
  .wiki .infobox{grid-column:1;grid-row:1;position:static;max-width:400px}
  .wiki .body{grid-row:2}
}
@media (max-width:600px){
  .ep{grid-template-columns:minmax(0,1fr)}
  .ep .meta{text-align:left}
  .facts,.toc-box{grid-template-columns:minmax(0,1fr)}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  body{font-size:18px}
  nav.main ul{gap:8px 16px}
}
@media (prefers-reduced-motion:no-preference){
  .hero h1 .colon i{animation:talk 3.4s ease-in-out infinite}
  .hero h1 .colon i:nth-child(2){animation-delay:1.7s}
  @keyframes talk{0%,40%,100%{transform:scale(1)}20%{transform:scale(1.25)}}
}

/* ===== Reality-Show: Live aus dem Leben ===== */
.live-badge{display:inline-flex;align-items:center;gap:8px;color:#fff}
.live-badge i{width:9px;height:9px;border-radius:50%;background:#f67456;box-shadow:0 0 8px #f67456}
.badge-live{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--display);letter-spacing:.18em;text-transform:uppercase;color:#fff;border:1.5px solid #f67456;border-radius:4px;padding:9px 12px}
.badge-live::before{content:"";width:8px;height:8px;border-radius:50%;background:#f67456;box-shadow:0 0 8px #f67456}
.newbadge{position:absolute;right:16px;top:16px;font:600 11px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;background:#f67456;color:var(--blue);padding:6px 10px;border-radius:3px}
.toc .ch{font:500 11px/1 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--v);border:1px solid currentColor;border-radius:3px;padding:6px 8px;align-self:center}
.ep .no{display:flex;flex-direction:column;gap:4px;font-size:clamp(26px,3.2vw,40px)}
.ep .no small{font:500 11px/1 var(--display);letter-spacing:.2em;color:var(--ink-2)}
.ep .meta .on{display:block;font-size:10px;letter-spacing:.2em;color:var(--v);margin-bottom:2px}
/* Bauchbinde (Lower Third) */
.l3{position:absolute;left:0;bottom:18px;display:flex;flex-direction:column;max-width:90%}
.l3 b{font:600 clamp(14px,1.5vw,18px)/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase;background:var(--blue);color:#fff;padding:9px 14px 7px;border-left:5px solid #f67456}
.l3 span{font:400 12px/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;background:#fff;color:var(--blue);padding:6px 14px;align-self:flex-start;border-left:5px solid #f67456}
.host:nth-child(2) .l3 b,.host:nth-child(2) .l3 span{border-left-color:#97c4e1}
/* O-Ton */
.oton{font:500 clamp(18px,1.8vw,22px)/1.35 var(--display);color:var(--ink);margin:0 0 14px;padding-left:14px;border-left:3px solid var(--orange)}
.oton::before{content:"O-Ton";display:block;font:500 10px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--v);margin-bottom:6px}
.host:nth-child(2) .oton{border-left-color:var(--f)}
.oton-head{color:#fff;border-left-color:#f67456;margin:0;max-width:30ch}
.dark .oton-head::before{color:#f67456}
.quote-hand{font:500 clamp(19px,2vw,24px)/1.35 var(--display)!important;transform:none!important;padding-left:14px;border-left:3px solid var(--orange);margin-block:22px 6px}
.quote-hand.f{border-left-color:var(--f)}
.quote-hand::before{content:"O-Ton";display:block;font:500 10px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--v);margin-bottom:6px}
.endcard{font:500 12px/1.4 var(--display);letter-spacing:.16em;text-transform:uppercase;color:#f67456}
.player{position:relative}
.player .rec-label{display:inline-flex;align-items:center;gap:8px;font:600 11px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--v);margin-bottom:10px}
.player .rec-label::before{content:"";width:8px;height:8px;border-radius:50%;background:#f67456}
.ask-sig{align-items:flex-end}
.ask-sig .ink{transform:rotate(-3deg)}
/* 404: Testbild */
.testbild{display:grid;grid-template-columns:repeat(7,1fr);height:90px;max-width:520px;margin-bottom:28px;border-radius:4px;overflow:hidden}
.testbild i:nth-child(1){background:#ededef}.testbild i:nth-child(2){background:#f2b640}.testbild i:nth-child(3){background:#4a8297}.testbild i:nth-child(4){background:#90c08d}.testbild i:nth-child(5){background:#6e5a8c}.testbild i:nth-child(6){background:#f67456}.testbild i:nth-child(7){background:#97c4e1}
@media (prefers-reduced-motion:no-preference){
  .live-badge i,.badge-live::before{animation:blink 1.4s steps(1) infinite}
}

/* ===== TV-Produktion: Klappe, Sendeablauf, O-Töne, Protokoll, Abspann ===== */
.slate{margin-top:20px;max-width:760px;border:2px solid #fff;border-radius:6px;overflow:hidden;background:#1b2633}
.slate-bar{height:26px;background:repeating-linear-gradient(-45deg,#fff 0 22px,#1b2633 22px 44px);border-bottom:2px solid #fff;transform-origin:left bottom}
.slate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.slate-grid>div{padding:10px 14px;border-right:1px solid rgba(255,255,255,.35);border-bottom:1px solid rgba(255,255,255,.35);min-width:0}
.slate-grid>div:nth-child(3n){border-right:0}
.slate-grid span{display:block;font:500 9.5px/1.2 var(--display);letter-spacing:.22em;text-transform:uppercase;color:#97c4e1;margin-bottom:5px}
.slate-grid b{display:block;font:500 17px/1.2 ui-monospace,Menlo,Consolas,monospace;color:#fff;font-weight:500;overflow-wrap:anywhere}
.slate-prod{grid-column:1/-1;border-right:0!important}
.slate-prod b{font:500 clamp(18px,2vw,22px)/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase}
@media (prefers-reduced-motion:no-preference){.slate-bar{animation:clap .9s cubic-bezier(.3,1.6,.5,1) .2s 1 both}@keyframes clap{0%{transform:rotate(-14deg)}60%{transform:rotate(1deg)}100%{transform:rotate(0)}}}
.ep-title{font-size:clamp(28px,4.2vw,58px)!important;margin-top:30px!important;max-width:24ch}
.einsatz{margin-top:22px;max-width:56ch;font:500 clamp(18px,1.9vw,22px)/1.4 var(--display);color:#fff}
.einsatz span{display:block;font:500 10px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:#f67456;margin-bottom:8px}
.einspieler .player{background:#1b2633;border:0;border-radius:6px;padding:16px 16px 12px}
.einspieler .player p{color:#c9d0da}
.rundown{list-style:none;margin:0;padding:0;border-top:2px solid var(--line)}
.rundown li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--hair)}
.rundown .tc{font:500 14px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--orange-ink);font-variant-numeric:tabular-nums}
.rundown .seg{font:500 16px/1.35 var(--display);letter-spacing:.02em}
.otoene{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.oto{margin:0;background:var(--altweiss);padding:20px 20px 0;display:flex;flex-direction:column;justify-content:space-between;gap:16px;border-radius:4px;overflow:hidden}
.oto blockquote{margin:0;font:500 clamp(16px,1.5vw,18px)/1.45 var(--display);color:var(--ink)}
.oto figcaption{margin:0 -20px;padding:9px 20px;font:500 11px/1.3 var(--display);letter-spacing:.14em;text-transform:uppercase;background:var(--blue);color:#fff;border-left:6px solid #f67456}
.oto.f figcaption{border-left-color:#97c4e1}
.oto figcaption b{font-weight:600}
.muted-note{color:var(--ink-2);font-size:16px}
.protokoll{border:1px solid var(--hair);border-radius:4px;padding:0}
.protokoll summary{padding:16px 18px;background:var(--altweiss)}
.protokoll .turns{max-height:560px;overflow:auto;padding:8px 18px 18px}
.protokoll .turns p{margin:0;padding:10px 0;border-bottom:1px solid var(--hair);font-size:16.5px;line-height:1.5;display:grid;grid-template-columns:86px 56px minmax(0,1fr);gap:4px 12px}
.protokoll .who{font:600 11px/1.6 var(--display);letter-spacing:.14em;text-transform:uppercase}
.protokoll .who.v{color:var(--orange-ink)} .protokoll .who.f{color:var(--f)}
.protokoll .tc{font:500 12px/1.7 ui-monospace,Menlo,Consolas,monospace;color:var(--ink-2)}
.epnav{display:flex;justify-content:space-between;gap:12px;margin-top:48px;padding-top:16px;border-top:2px solid var(--line);font:500 13px/1 var(--display);letter-spacing:.14em;text-transform:uppercase}
.epnav a{text-decoration:none;color:var(--v)}
.abspann{background:#1b2633;color:#fff;text-align:center}
.abspann .wrap{padding-block:clamp(40px,6vw,72px)}
.abspann .kicker{color:#97c4e1}
.abspann dl{margin:22px auto 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 28px;max-width:640px}
.abspann dt{text-align:right;font:400 11px/1.6 var(--display);letter-spacing:.2em;text-transform:uppercase;color:#97c4e1}
.abspann dd{margin:0;text-align:left;font:500 15px/1.5 var(--display);letter-spacing:.04em}
.abspann a{color:#fff}
@media (max-width:760px){
  .slate-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .slate-grid>div:nth-child(3n){border-right:1px solid rgba(255,255,255,.35)}
  .slate-grid>div:nth-child(2n+1):not(.slate-prod){border-right:0}
  .otoene{grid-template-columns:minmax(0,1fr)}
  .protokoll .turns p{grid-template-columns:minmax(0,1fr)}
  .abspann dl{grid-template-columns:minmax(0,1fr)} .abspann dt,.abspann dd{text-align:center}
}

/* ---------- Backstage · Kontaktabzug ---------- */
.backstage{background:#1d2836}
.contact-sheet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;background:#0f151d;padding:34px 18px;position:relative;
  background-image:radial-gradient(circle at 50% 50%,#2a3646 0 3.5px,transparent 4px),radial-gradient(circle at 50% 50%,#2a3646 0 3.5px,transparent 4px);
  background-size:22px 14px,22px 14px;background-position:0 9px,0 calc(100% - 9px);background-repeat:repeat-x}
.contact-sheet figure{margin:0;position:relative;background:#0f151d;padding:4px 4px 26px}
.contact-sheet img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;filter:saturate(.9);transition:filter .3s,transform .3s}
.contact-sheet figure:hover img{filter:none;transform:scale(1.015)}
.contact-sheet .fr{position:absolute;left:6px;bottom:6px;font:600 10px/1 var(--display);letter-spacing:.15em;color:#f6a24a}
.contact-sheet figcaption{position:absolute;right:6px;bottom:5px;font:400 12px/1.2 var(--display);letter-spacing:.04em;color:#c9d2dc;text-align:right;max-width:75%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.contact-sheet figure:nth-child(4)::after{content:"";position:absolute;inset:-2px -2px 22px;border:2px solid var(--orange,#f67456);border-radius:46% 54% 48% 52%/55% 45% 55% 45%;transform:rotate(-2deg);pointer-events:none}
.sheet-foot{font:600 11px/1 var(--display);letter-spacing:.25em;color:#6f7f92;margin:14px 0 0;text-align:right}
@media (max-width:760px){.contact-sheet{grid-template-columns:repeat(2,minmax(0,1fr));padding:30px 10px}}
.mon video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.03);background:#0e1622}
.cam-credit{font:400 12px/1.4 var(--display);letter-spacing:.06em;color:#8193a8;text-align:right;margin:6px 0 0}
@media (max-width:760px){.mon .note{font-size:22px;bottom:auto;top:8px;left:12px;right:auto}}