/* cashmoneyfactory – Designsystem
   Fabrik-Look: dunkles Grün, Signal-Orange, schmale Display-Schrift wie auf einer Anzeigetafel.
   Schriften kommen bewusst vom System (keine Google-Server, DSGVO-freundlich). */
:root{
  --ink:#10201A; --ink-2:#3A4A42; --muted:#4A5A52; --line:#D5DDD8; --line-2:#C3CEC7;
  --ground:#EEF2EF; --card:#FFFFFF; --soft:#F6F8F7;
  --accent:#C2410C; --accent-ink:#9A3412; --accent-soft:#FDE7D8; --accent-light:#FB923C;
  --dark:#10201A; --dark-line:#2E4239; --dark-text:#E8EFEA; --dark-muted:#B9C8BF; --dark-faint:#8FA79A;
  --teal-dark:#0E2F3A; --teal-line:#24505E; --teal:#0B6F8A; --teal-light:#7DD3E8; --teal-soft:#DCEFF4;
  --go:#0F6B40; --go-soft:#DDF3E7; --wait:#7A4F00; --wait-soft:#FBEFD6; --stop:#B3261E; --stop-soft:#FBE3E1;
  --p-netflix:#7A2E2E; --p-prime:#1D4B6B; --p-wow:#4A3A6E; --p-disney:#23407A; --p-hbo:#53308A; --p-paramount:#1F4F9A; --p-apple:#3C4250; --p-tv:#0B6F8A;
  --display:"Bahnschrift","DIN Condensed","Roboto Condensed","Arial Narrow","Helvetica Neue",sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}
img{max-width:100%}
a{color:var(--accent-ink)}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--accent-light);outline-offset:2px}
.wrap{max-width:1200px;margin:0 auto;padding-inline:20px}
.display{font-family:var(--display);font-stretch:condensed;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.95}
h1,h2,h3{text-wrap:balance}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.muted{color:var(--muted)}
.small{font-size:14px}
.tabnum{font-variant-numeric:tabular-nums}

/* Kopf */
.top{background:var(--dark);color:var(--dark-text)}
.ticker{border-bottom:1px solid var(--dark-line);font-size:13px;padding-block:9px}
.ticker .wrap{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}
.ticker b{color:#FDBA74;letter-spacing:.08em;text-transform:uppercase}
.ticker span.f{color:var(--dark-faint)}
.header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 32px;padding-block:18px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.logo span{font-size:28px;color:#fff}
.logo span em{font-style:normal;color:var(--accent-light)}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;font-weight:600;font-size:15px}
.nav a{color:var(--dark-text);text-decoration:none}
.nav a:hover{color:#fff;text-decoration:underline}
.nav a.cta{background:var(--accent);color:#fff;padding:9px 15px;border-radius:8px;text-decoration:none}

/* Hero */
.hero{padding-block:44px 76px}
.hero .wrap{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.hero-main{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:22px}
.hero h1{margin:0;color:#fff;font-size:clamp(48px,7.4vw,100px);line-height:.88;overflow-wrap:anywhere}
.hero h1 em{font-style:normal;color:var(--accent-light)}
.hero p.lead{margin:0;font-size:19px;max-width:34em;color:var(--dark-muted)}
.hero .eyebrow{color:#FDBA74}
.search{display:flex;flex-direction:column;gap:8px;max-width:580px}
.search label{font-weight:700;color:#fff}
.search-box{display:flex;flex-wrap:wrap;gap:8px;background:#fff;border-radius:14px;padding:6px}
.search-box input{flex:1 1 220px;min-width:0;font:500 17px var(--body);padding:12px 14px;border:0;border-radius:10px;color:var(--ink);background:#fff}
.btn{display:inline-block;font:700 16px var(--body);padding:12px 22px;border:0;border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;cursor:pointer;min-height:46px;text-align:center}
.btn:hover{background:var(--accent-ink);color:#fff}
.btn.dark{background:var(--ink)}
.btn.dark:hover{background:#000}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:var(--dark-faint)}
.chips a{padding:4px 11px;border:1px solid #3B5247;border-radius:999px;text-decoration:none;color:var(--dark-text)}
.chips a:hover{border-color:var(--dark-text)}
.journey{flex:1 1 380px;min-width:0;position:relative;background:#fff;color:var(--ink);border-radius:16px;padding:30px 28px 26px;display:flex;flex-direction:column;gap:18px;box-shadow:0 24px 48px rgba(0,0,0,.35)}
.stamp{position:absolute;top:18px;right:18px;transform:rotate(-9deg);border:3px solid var(--go);color:var(--go);border-radius:8px;padding:6px 10px;text-align:center;font-family:var(--display);font-stretch:condensed;font-weight:900;line-height:.95;text-transform:uppercase}
.stamp b{display:block;font-size:26px}.stamp small{font-size:12px;letter-spacing:.08em}
.journey ol{list-style:none;margin:0;padding:0}
.journey li{position:relative;margin-left:7px;padding:0 0 16px 18px;border-left:2px solid var(--line-2)}
.journey li:last-child{border-left-color:transparent;padding-bottom:0}
.journey li::before{content:"";position:absolute;left:-8px;top:4px;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--muted)}
.journey li.go::before{background:var(--go);border-color:var(--go)}
.journey li.free::before{background:var(--teal);border-color:var(--teal)}
.journey .row-l{display:flex;justify-content:space-between;gap:12px;font-weight:700}

/* Abschnitte */
section{padding-block:64px 0}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:8px 24px;margin-bottom:22px}
.sec-head h2{margin:4px 0 0;font-size:clamp(36px,5vw,48px)}
.grid{display:flex;flex-wrap:wrap;gap:16px}
.grid > *{flex:1 1 260px;min-width:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:10px}
.card.strong{border:2px solid var(--ink)}
.card.dashed{background:var(--soft);border:2px dashed #A9B8AF}
.tag{align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:3px 7px;border-radius:4px;background:#DCE4DF;color:var(--muted)}
.tag.dark{background:var(--ink);color:#fff}
.tag.go{background:var(--go-soft);color:var(--go)}
.tag.teal{background:var(--teal-soft);color:var(--teal)}
.tag.violet{background:#E7E2F3;color:#4A3A6E}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.price b{font-family:var(--display);font-stretch:condensed;font-weight:900;font-size:50px;line-height:.9;color:var(--accent-ink)}
.price.off b{color:#7F9488}
.steps{display:flex;flex-direction:column;font-size:14px}
.steps div{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-top:1px solid #E3E9E5}
.steps div:last-child{border-bottom:1px solid #E3E9E5}
.card .btn{margin-top:auto;align-self:flex-start;font-size:15px;padding:10px 16px;min-height:0}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:700}

/* Kinokarten */
.ticket{display:flex;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:var(--ink)}
.ticket.strong{border:2px solid var(--ink)}
.ticket:hover{border-color:var(--ink)}
.stub{flex:0 0 82px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 8px;text-align:center}
.stub b{font-family:var(--display);font-stretch:condensed;font-size:44px;font-weight:900;line-height:.9}
.stub small{font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.1em}
.ticket-body{flex:1 1 auto;min-width:0;border-left:2px dashed var(--line-2);padding:18px;display:flex;flex-direction:column;gap:6px}
.ticket-body h3{margin:0;font-size:19px;line-height:1.25}
.prov{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.bg-netflix{background:var(--p-netflix)}.bg-prime{background:var(--p-prime)}.bg-wow{background:var(--p-wow)}.bg-disney{background:var(--p-disney)}.bg-hbo{background:var(--p-hbo)}.bg-paramount{background:var(--p-paramount)}.bg-apple{background:var(--p-apple)}.bg-tv{background:var(--p-tv)}
.c-netflix{color:var(--p-netflix)}.c-prime{color:var(--p-prime)}.c-wow{color:var(--p-wow)}.c-disney{color:var(--p-disney)}.c-hbo{color:var(--p-hbo)}.c-paramount{color:var(--p-paramount)}.c-apple{color:var(--p-apple)}.c-tv{color:var(--p-tv)}
.pill{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px}
.pill.go{background:var(--go-soft);color:var(--go)}
.pill.free{background:var(--teal-soft);color:var(--teal)}
.pill.wait{background:var(--wait-soft);color:var(--wait)}
.pill.stop{background:var(--stop-soft);color:var(--stop)}
.pill i{width:9px;height:9px;border-radius:50%;background:currentColor;display:inline-block}

/* Gratis im TV */
.band{background:var(--teal-dark);color:#E6F1F4;padding-block:64px;margin-top:64px}
.band .wrap{display:flex;flex-wrap:wrap;gap:32px 56px}
.band h2{color:#fff;margin:4px 0 0;font-size:clamp(36px,5vw,48px)}
.band .eyebrow{color:var(--teal-light)}
.band p{color:#B5CDD4}
.band a.more{color:#FDBA74;font-weight:700}
.tv-list{flex:2 1 560px;min-width:0}
.tv-row{display:flex;flex-wrap:wrap;gap:6px 24px;align-items:baseline;padding:16px 0;border-top:1px solid var(--teal-line)}
.tv-row:last-child{border-bottom:1px solid var(--teal-line)}
.tv-row .t{flex:0 0 160px;font-weight:700;color:var(--teal-light)}
.tv-row .s{flex:0 0 130px;font-size:14px;color:#B5CDD4}
.tv-row .n{flex:1 1 220px;min-width:0}
.tv-row .n a{color:#fff;font-weight:700;text-decoration:none}
.tv-row .n a:hover{text-decoration:underline}
.tv-row .n span{font-size:14px;color:#B5CDD4}

/* Prognose */
.split{display:flex;flex-wrap:wrap;gap:40px 56px;align-items:flex-start}
.split > *{flex:1 1 400px;min-width:0}
.rows{display:flex;flex-direction:column;font-size:15px;max-width:32em}
.rows div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line-2)}
.rows div:last-child{border-bottom:1px solid var(--line-2)}
.prog{background:var(--wait-soft);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:8px;color:#3D2C0A}
.prog .ph{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-weight:700;color:var(--wait)}
.conf{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:2px 7px;border-radius:4px}
.conf.hoch{background:var(--go-soft);color:var(--go)}
.conf.mittel{border:1px solid var(--wait);color:var(--wait)}
.conf.unsicher{background:var(--stop-soft);color:var(--stop)}
.tip{color:var(--teal);font-weight:600;font-size:14px}

/* Werkzeuge */
.tool{text-decoration:none;color:var(--ink)}
.tool:hover{border-color:var(--ink)}
.icon{width:48px;height:48px;border-radius:12px;background:var(--accent-soft);display:flex;align-items:center;justify-content:center}
.icon.teal{background:var(--teal-soft)}

/* Newsletter */
.news{background:var(--accent);color:#fff;border-radius:18px;padding:40px;display:flex;flex-wrap:wrap;gap:20px 48px;align-items:center}
.news > *{flex:1 1 360px;min-width:0}
.news h2{margin:0;font-size:clamp(32px,4.5vw,44px)}
.news p{margin:0;color:#FFF1E8}

/* Fuß */
footer{background:var(--dark);color:var(--dark-muted);padding-block:40px;margin-top:80px;font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 40px}
footer .brand{font-size:24px;color:#fff}
footer .brand em{font-style:normal;color:var(--accent-light)}
footer nav{display:flex;flex-wrap:wrap;gap:8px 22px}
footer nav a{color:var(--dark-text);text-decoration:none}
footer nav a:hover{text-decoration:underline}
footer .copy{flex-basis:100%;color:#7F9488;font-size:13px}

/* Unterseiten */
.page-head{background:var(--dark);color:var(--dark-text);padding-block:40px 48px}
.page-head h1{margin:6px 0 10px;color:#fff;font-size:clamp(44px,7vw,84px)}
.page-head p{margin:0;max-width:44em;color:var(--dark-muted);font-size:18px}
.page-head .eyebrow{color:#FDBA74}
.prose{max-width:46em}
.prose h2{font-family:var(--display);font-stretch:condensed;text-transform:uppercase;font-size:32px;margin:36px 0 8px}
.placeholder{background:var(--wait-soft);border:1px dashed var(--wait);border-radius:10px;padding:14px 16px;color:#3D2C0A}

/* Flat-Radar */
.legend{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:16px;font-size:13px;color:var(--dark-muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.dot.free{background:var(--teal-light)}.dot.go{background:#4FD093}.dot.wait{background:#F0B44A}.dot.stop{background:#FF8A80}
.filters{position:sticky;top:0;z-index:5;background:var(--ground);padding-block:12px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px}
.filters .search-box{flex:1 1 100%;border:2px solid var(--ink)}
.chip{font:600 13px var(--body);border:1px solid var(--line);background:#fff;color:var(--ink);padding:7px 12px;border-radius:999px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.chip.free-chip{border-color:var(--teal);color:var(--teal)}
.chip.free-chip[aria-pressed="true"]{background:var(--teal);color:#fff}
.radar h2{font-family:var(--display);font-stretch:condensed;text-transform:uppercase;font-size:30px;margin:32px 0 4px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.radar h2 small{font:500 13px var(--body);color:var(--muted);text-transform:none}
.radar .sub{margin:0 0 10px;color:var(--muted);font-size:14px;max-width:70ch}
.rrow{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.rrow:last-child{border-bottom:1px solid var(--line)}
.rdate{text-align:center;font-family:var(--display);font-stretch:condensed;line-height:.9}
.rdate b{display:block;font-size:40px;font-weight:900}
.rdate small{font-size:15px;font-weight:700;letter-spacing:.08em;color:var(--muted)}
.rdate .tm{display:block;font:600 12px var(--body);color:var(--teal);margin-top:4px}
.rinfo{min-width:0;display:flex;flex-direction:column;gap:4px}
.rinfo h3{margin:0;font-size:17px;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.rinfo h3 a{color:var(--ink);text-decoration:none}
.rinfo h3 a:hover{text-decoration:underline}
.badge{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:2px 7px;border-radius:4px;border:1px solid currentColor;white-space:nowrap}
.rinfo p{margin:0;color:var(--muted);font-size:14px}
.notfound{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px;margin-top:20px}
.empty{color:var(--muted);font-size:14px;padding:12px 0}

/* Filmseite */
.answer{background:#fff;border:2px solid var(--ink);border-radius:16px;padding:26px;display:flex;flex-direction:column;gap:12px;margin-top:-28px;position:relative}
.answer .big{font-family:var(--display);font-stretch:condensed;font-weight:900;font-size:clamp(34px,5vw,52px);line-height:.95;text-transform:uppercase}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 24px;margin-top:8px}
.facts div{border-top:1px solid var(--line);padding-top:8px}
.facts dt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:2px 0 0;font-weight:600}
.table-wrap{overflow-x:auto}
table.kompass{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
table.kompass th,table.kompass td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
table.kompass th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--soft)}

@media (max-width:560px){
  .stub{flex-basis:66px}.stub b{font-size:36px}
  .rrow{grid-template-columns:58px minmax(0,1fr)}
  .rdate b{font-size:32px}
  .news{padding:28px}
  .journey{padding:26px 20px}
}
@media (prefers-reduced-motion:no-preference){.ticket,.tool,.chip{transition:border-color .15s,background .15s}}
