/* Mediathek v2 und Sperrseite (inc/mediathek-v2.php). Gleiche Tokens wie die uebrigen v2-Seiten, alles unter .mt
   gekapselt. Ueberschriften und Formularelemente mit !important, weil das Elementor-Kit sie global setzt. */
.mt{
  --mt-bg:#00070C; --mt-bg2:#04131D; --mt-bg3:#0A1F2C;
  --mt-fg:#F2F7FA; --mt-muted:#8FA6B4; --mt-muted2:#6E8798;
  --mt-line:rgba(255,255,255,.09); --mt-line2:rgba(255,255,255,.16);
  --mt-cta:#D63A44; --mt-cta-h:#C2303A; /* Knopfflaechen: Kontrast >= 4,5:1 */
  --mt-green:#02D095; --mt-amber:#FFC43D; --mt-red:#FF4D5E; --mt-blue:#5AB4FF; --mt-violet:#A98BFF;
  --mt-font:"Inter","Segoe UI Variable","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  background:var(--mt-bg); color:var(--mt-fg); font-family:var(--mt-font); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.mt *,.mt *::before,.mt *::after{box-sizing:border-box}
body .mt :is(:is(h1,:where([data-ff-hd="1"])),:is(h2,:where([data-ff-hd="2"])),:is(h3,:where([data-ff-hd="3"])),p,li,a,span,b,small,summary,details,div,input,button,label){font-family:var(--mt-font)!important}
.mt :is(h1,h2,h3,[data-ff-hd]){color:var(--mt-fg);margin:0;padding:0;text-wrap:balance;letter-spacing:-.02em!important}
.mt p{margin:0}
.mt a{color:inherit;text-decoration:none}
.mt b{color:var(--mt-fg);font-weight:650}
.mt-sr{position:absolute!important;left:-9999px}
.mt-wrap{max-width:1240px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.mt-sec{padding-block:clamp(40px,5.5vw,72px)}
.mt-tight{padding-top:0}
.mt-eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mt-green)}
.mt-amber{color:var(--mt-amber)}
.mt-lede{color:var(--mt-muted);font-size:clamp(1rem,1.3vw,1.13rem);max-width:62ch}
.mt-head{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:end;justify-content:space-between;margin-bottom:clamp(18px,2.6vw,28px)}
.mt .mt-head :is(h2,div[data-ff-hd="2"]){font-size:clamp(1.5rem,3vw,2.2rem)!important;font-weight:800!important;line-height:1.1!important}
.mt-head>a{color:var(--mt-green);font-weight:700;font-size:14.5px}

.mt .mt-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 1rem/1.15 var(--mt-font)!important;padding:14px 20px!important;border-radius:14px!important;border:1px solid transparent;transition:background .2s,transform .2s;cursor:pointer;text-align:center}
.mt a.mt-btn-primary{background:var(--mt-cta);color:#fff;box-shadow:0 10px 30px -10px rgba(254,79,89,.7)}
.mt a.mt-btn-primary:hover{background:var(--mt-cta-h);color:#fff;transform:translateY(-2px)}
.mt .mt-btn-ghost{background:rgba(255,255,255,.04)!important;border-color:var(--mt-line2)!important;color:var(--mt-fg)!important}
.mt .mt-btn-ghost:hover{border-color:rgba(255,255,255,.35)!important}
.mt a:focus-visible,.mt button:focus-visible,.mt input:focus-visible,.mt summary:focus-visible{outline:3px solid var(--mt-amber)!important;outline-offset:3px}
.mt-ctas{display:flex;flex-wrap:wrap;gap:12px}

/* Kopf; die Kopfzeile liegt auf dieser Seite durchsichtig ueber dem Inhalt */
.mt-hero{background:radial-gradient(900px 420px at 85% -20%,rgba(169,139,255,.14),transparent 60%),radial-gradient(600px 360px at -10% 120%,rgba(2,208,149,.09),transparent 60%);padding-block:130px clamp(20px,3vw,30px)}
@media (max-width:1024px){.mt-hero{padding-top:100px}}
.mt-crumb{font-size:13px;color:var(--mt-muted2);margin-bottom:16px;display:flex;gap:8px}
.mt-crumb a:hover{color:var(--mt-green)}
.mt .mt-hero :is(h1,:where([data-ff-hd="1"])){font-size:clamp(2rem,4.4vw,3.3rem)!important;font-weight:800!important;line-height:1.05!important;margin:12px 0!important}
.mt-hero :is(h1,:where([data-ff-hd="1"])) em{font-style:normal;color:var(--mt-violet)}
.mt-counts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:14px 0 22px;color:var(--mt-muted);font-size:14.5px}
.mt-counts b{font-size:1.15rem;font-variant-numeric:tabular-nums}
.mt-search{display:flex;gap:10px;flex-wrap:wrap;max-width:760px;margin:0}
.mt .mt-search input[type=search]{flex:1 1 280px;min-width:0;background:var(--mt-bg2)!important;border:1px solid var(--mt-line2)!important;border-radius:14px!important;color:var(--mt-fg)!important;font-size:16px!important;padding:14px 16px!important;height:auto!important}
.mt-search input::placeholder{color:var(--mt-muted2)}
.mt-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.mt a.mt-chip{background:rgba(255,255,255,.04);border:1px solid var(--mt-line2);color:var(--mt-muted);font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px}
.mt a.mt-chip:hover{color:var(--mt-fg)}
.mt a.mt-chip-on{background:rgba(169,139,255,.14);border-color:rgba(169,139,255,.5);color:var(--mt-fg)}
.mt-ai{margin-top:18px;font-size:13px;color:var(--mt-muted2);max-width:900px}
.mt-ai summary{cursor:pointer;list-style:none}
.mt-ai summary::-webkit-details-marker{display:none}
.mt-ai summary b{color:var(--mt-muted)}
.mt-ai summary span{color:var(--mt-green);text-decoration:underline}
.mt-ai-full{margin-top:10px;padding:14px 16px;background:var(--mt-bg2);border:1px solid var(--mt-line);border-radius:12px;color:var(--mt-muted)}
.mt .mt-ai-full :is(h2,:where([data-ff-hd="2"])){font-size:1rem!important;margin-bottom:6px!important}
.mt-ai-full p{margin:0 0 8px!important}

/* Zugang */
.mt-access{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;padding:16px 20px;border:1px solid rgba(254,79,89,.35);border-radius:18px;background:linear-gradient(135deg,rgba(254,79,89,.12),var(--mt-bg2) 65%)}
.mt-access b{display:block}
.mt-access p{font-size:14px;color:var(--mt-muted)}
.mt-ok{border-color:rgba(2,208,149,.35);background:linear-gradient(135deg,rgba(2,208,149,.10),var(--mt-bg2) 65%)}

/* Etiketten */
.mt-tags{display:flex;flex-wrap:wrap;gap:6px}
.mt-tag{font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;border:1px solid var(--mt-line2);color:var(--mt-muted);white-space:nowrap}
.mt-t-video{color:#ff8a8a;border-color:rgba(255,77,94,.4)}
.mt-t-podcast{color:var(--mt-violet);border-color:rgba(169,139,255,.45)}
.mt-t-analyse{color:var(--mt-blue);border-color:rgba(90,180,255,.45)}
.mt-t-free{color:var(--mt-green);border-color:rgba(2,208,149,.45);background:rgba(2,208,149,.08)}
.mt-t-prem{color:var(--mt-amber);border-color:rgba(255,196,61,.45);background:rgba(255,196,61,.08)}
.mt-t-ai{color:var(--mt-muted2)}

/* Beitrag der Woche */
.mt-feature{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);background:var(--mt-bg2);border:1px solid var(--mt-line2);border-radius:22px;overflow:hidden}
@media (max-width:860px){.mt-feature{grid-template-columns:minmax(0,1fr)}}
.mt a.mt-fmedia{min-height:280px;background:linear-gradient(135deg,#1a2a1a,#0a1f2c) center/cover no-repeat;display:grid;place-items:center}
.mt-play{width:78px;height:78px;border-radius:50%;background:rgba(0,0,0,.55);border:2px solid rgba(255,255,255,.7);display:grid;place-items:center}
.mt-play i{width:0;height:0;border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:6px}
.mt-fbody{padding:clamp(20px,3vw,32px);display:grid;gap:12px;align-content:center}
.mt .mt-fbody :is(h3,div[data-ff-hd="3"]){font-size:clamp(1.3rem,2.4vw,1.8rem)!important;font-weight:800!important;line-height:1.2!important}
.mt-fbody p{color:var(--mt-muted)}

/* Raster */
.mt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
@media (max-width:340px){.mt-grid{grid-template-columns:minmax(0,1fr)}}
.mt a.mt-card{display:grid;grid-template-rows:auto 1fr;background:var(--mt-bg2);border:1px solid var(--mt-line);border-radius:18px;overflow:hidden;transition:border-color .2s,transform .2s}
.mt a.mt-card:hover{border-color:var(--mt-line2);transform:translateY(-2px)}
.mt-thumb{display:block;aspect-ratio:16/9;max-width:100%;background:center/cover no-repeat}
.mt-th-video{background-color:#2a1420}.mt-th-podcast{background-color:#211a35}.mt-th-analyse{background-color:#112436}.mt-th-x{background-color:#0a1f2c}
.mt-cbody{display:grid;gap:8px;align-content:start;padding:14px 16px 16px}
/* Kartentitel fest auf 16 px: hohe Spezifitaet und px statt rem, weil auf Staging einzelne Titel in
   Kit-/Abschnittsgroesse (ca. 28 px) erschienen (2026-11-03 fix4). Gilt fuer Raster, Reihen, Archiv. */
html body .mt .mt-card .mt-cbody :is(h3,div[data-ff-hd="3"]){font-size:16px!important;font-weight:700!important;line-height:1.35!important;letter-spacing:0!important;margin:0!important;padding:0!important;color:var(--mt-fg)!important;text-transform:none!important;transition:none!important;animation:none!important}
html body .mt .mt-card:hover .mt-cbody :is(h3,div[data-ff-hd="3"]){color:var(--mt-fg)!important}
html body .mt .mt-card .mt-cbody small{display:block;color:var(--mt-muted2)!important;font-size:12.5px!important;line-height:1.4!important;font-weight:400!important}
html body .mt .mt-card .mt-tag{font-size:11.5px!important;line-height:1.5!important}

/* Reihen (ersetzen die alten Karussells): waagerecht scrollbar, auf grossen Bildschirmen 4 nebeneinander */
.mt-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:14px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity;scrollbar-width:thin}
.mt-row>a{scroll-snap-align:start}
@media (min-width:1100px){.mt-row{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible}.mt-row>a:nth-child(n+5){display:none}}

/* Kategorie-Seiten */
.mt-hero-sm{padding-bottom:clamp(14px,2vw,22px)}
.mt-filter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.mt .mt-filter label{font-size:14px;color:var(--mt-muted)}
.mt .mt-filter select{background:var(--mt-bg2)!important;color:var(--mt-fg)!important;border:1px solid var(--mt-line2)!important;border-radius:12px!important;padding:11px 14px!important;font-size:15px!important;min-width:260px;max-width:100%;height:auto!important}
.mt-pages{margin-top:28px}
.mt-pages ul{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0;padding:0;list-style:none}
.mt .mt-pages .page-numbers{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border:1px solid var(--mt-line2);border-radius:10px;color:var(--mt-fg);font-weight:600;font-size:14px}
.mt .mt-pages .page-numbers.current{background:rgba(169,139,255,.14);border-color:rgba(169,139,255,.5)}
.mt .mt-pages a.page-numbers:hover{border-color:rgba(255,255,255,.35)}
.mt-back-wrap{margin-top:24px!important}

/* Kategorien */
.mt-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.mt a.mt-cat{display:grid;gap:4px;background:var(--mt-bg2);border:1px solid var(--mt-line);border-radius:16px;padding:16px 18px}
.mt a.mt-cat:hover{border-color:var(--mt-line2);background:var(--mt-bg3)}
.mt-cat b{font-size:1.02rem}
.mt-cat span{font-size:13px;color:var(--mt-muted)}

.mt-final{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;background:linear-gradient(135deg,rgba(254,79,89,.12),var(--mt-bg2) 60%);border:1px solid rgba(254,79,89,.35);border-radius:22px;padding:clamp(22px,3.4vw,34px)}
@media (max-width:760px){.mt-final{grid-template-columns:minmax(0,1fr)}}
.mt .mt-final :is(h2,:where([data-ff-hd="2"])){font-size:clamp(1.4rem,2.6vw,1.9rem)!important;font-weight:800!important;line-height:1.2!important}
.mt-final p{color:var(--mt-muted);margin-top:6px!important}

/* Sperrseite */
.mt-lockpage{max-width:780px;padding-block:140px clamp(40px,6vw,80px)}
@media (max-width:1024px){.mt-lockpage{padding-top:110px}}
.mt-lpcard{background:var(--mt-bg2);border:1px solid var(--mt-line2);border-radius:22px;padding:clamp(22px,4vw,40px);display:grid;gap:18px}
.mt .mt-lpcard :is(h1,:where([data-ff-hd="1"])){font-size:clamp(1.6rem,3.4vw,2.3rem)!important;font-weight:800!important;line-height:1.15!important}
.mt-lpcard>p{color:var(--mt-muted)}
.mt-lppost{display:flex;gap:14px;align-items:center;background:var(--mt-bg);border:1px solid var(--mt-line);border-radius:14px;padding:12px}
.mt-lppost .mt-thumb{width:120px;flex:none;border-radius:10px}
.mt-lppost small{color:var(--mt-muted2);font-size:12.5px}
.mt-lppost b{display:block;line-height:1.3}
.mt-when{font-size:14.5px;color:var(--mt-muted);background:rgba(2,208,149,.06);border:1px solid rgba(2,208,149,.3);border-radius:12px;padding:12px 14px}
.mt-when b{color:var(--mt-green)}
.mt-when a{color:var(--mt-fg);text-decoration:underline}
.mt-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.mt-opts{grid-template-columns:minmax(0,1fr)}}
.mt-opt{border:1px solid var(--mt-line2);border-radius:16px;padding:16px;display:grid;gap:8px;align-content:start}
.mt-opt-hl{border-color:rgba(254,79,89,.45);background:rgba(254,79,89,.06)}
.mt-opt b{font-size:1.05rem}
.mt-opt span{font-size:13.5px;color:var(--mt-muted)}
.mt a.mt-back{color:var(--mt-green);font-weight:700;font-size:14.5px}
@media (prefers-reduced-motion:reduce){.mt *{transition:none!important}}

/* Filter nach Art, Fondsgruppe und Kategorie (2026-11-04, Entwurf freigegeben von Eike) */
.mt-flt{display:grid;gap:12px;margin-top:20px;padding:16px;border:1px solid var(--mt-line);border-radius:16px;background:rgba(4,19,29,.6);max-width:100%}
.mt-frow{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;align-items:start}
.mt .mt-flabel{font-size:12px!important;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mt-muted2)!important;padding-top:8px;margin:0!important}
.mt-flt .mt-chips{margin-top:0;min-width:0}
.mt .mt-chip{display:inline-flex;align-items:center;gap:7px;line-height:1.3}
.mt-chip .mt-n{font-size:12px;font-weight:700;color:var(--mt-muted2);font-variant-numeric:tabular-nums}
.mt-chip-on .mt-n{color:var(--mt-violet)}
.mt a.mt-chip-g.mt-chip-on{background:rgba(2,208,149,.12);border-color:rgba(2,208,149,.5)}
.mt-chip-g.mt-chip-on .mt-n{color:var(--mt-green)}
.mt span.mt-chip-off{background:transparent;border:1px solid var(--mt-line);color:var(--mt-muted2);font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;opacity:.5;cursor:not-allowed}
.mt-fcat{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;min-width:0}
.mt .mt-fcat select{background:var(--mt-bg2)!important;color:var(--mt-fg)!important;border:1px solid var(--mt-line2)!important;border-radius:12px!important;padding:10px 14px!important;font-size:15px!important;width:min(440px,100%);max-width:100%;height:auto!important;margin:0!important}
.mt .mt-fcat select:focus{border-color:var(--mt-green)!important}
.mt .mt-fcat select option{background:var(--mt-bg2);color:var(--mt-fg)}
.mt a.mt-freset{color:var(--mt-green);font-weight:700;font-size:14px}
.mt a.mt-freset:hover{text-decoration:underline}
.mt-flt + .mt-filter{margin-top:14px}
@media (max-width:640px){
  .mt-flt{padding:14px}
  .mt-frow{grid-template-columns:minmax(0,1fr);gap:6px}
  .mt .mt-flabel{padding-top:0}
  .mt-chips-scroll{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
  .mt-chips-scroll>*{flex:none}
}
