/* Hospitality Radar · Redesign v2 (22.10.2026), nach redesign/KONZEPT.md.
   Liegt über style-paper.css. Tinte = Handlung, Rot (--mark) = Position/Auswahl, Bernstein = Signal. Kein Teal, keine Schatten, kein Glas. */
:root{
  --paper:#F5F2EC; --paper-2:#EDE9E1; --card:#FFFFFF; --ink:#15171B; --ink-2:#2B2E33; --muted:#6A6E75; --veil:#B8BCC2;
  --line:#DED9CF; --line-strong:#15171B; --mark:#9F2525; --mark-tint:#F3E4E4; --signal:#C98A0A; --signal-tint:#F6ECD6;
  /* alte Namen auf die neuen Rollen legen */
  --radar:#15171B; --radar-deep:#000000; --radar-tint:#EDE9E1; --teal-l:#15171B; --teal-s:#6A6E75; --logo-accent:#9F2525;
  --display:"Funnel Display","Inter",-apple-system,sans-serif;
  --r:3px; --r2:6px; --max:1240px; --head:60px;
}
body{background:var(--paper);color:var(--ink)}
a{color:var(--ink)} a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
h1,h2,h3{font-family:var(--display);letter-spacing:-.01em;font-variation-settings:normal}
h1{font-size:52px;line-height:1.08;font-weight:300;letter-spacing:-.015em}
h2{font-size:34px;line-height:1.15;font-weight:300}
h3{font-size:22px;line-height:1.2;font-weight:500}
.wrap{max-width:var(--max)}
*:focus-visible{outline:2px solid var(--mark);outline-offset:2px}
.eyebrow{display:none!important}

/* Kopf */
.nav,.nav.dark{background:var(--paper)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-bottom:1px solid var(--line)}
.nav .wrap{height:var(--head);gap:32px;max-width:none;padding:0 28px}
.brand{display:flex;align-items:center}
.brand .logo{height:26px;width:auto;display:block}
.brand .logo-s{display:none;height:20px;width:auto}
.nav nav{gap:26px;align-items:center}
.nav nav a{opacity:1;color:var(--ink-2);font-size:14.5px}
.nav nav a:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ink);text-underline-offset:6px}
.nav .nav-sep{width:1px;height:20px;background:var(--line)}
.nav nav a.btn{color:#fff}
.nav nav a.btn:hover{text-decoration:none}

/* Bausteine */
.btn{border-radius:var(--r)!important;height:40px;padding:0 18px!important;font-size:14.5px;font-weight:500;box-shadow:none!important;transform:none!important;transition:background .12s,border-color .12s,color .12s}
.btn-sm{height:32px;padding:0 12px!important;font-size:13.5px}
.btn-primary,.btn-primary:visited,#stage .copy .btn-primary{background:var(--ink)!important;color:#fff!important;border:1px solid var(--ink)!important}
.btn-primary:hover{background:#000!important;color:#fff!important;text-decoration:none}
.btn-ghost,.btn-ghost-d{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important}
.btn-ghost:hover,.btn-ghost-d:hover{background:var(--paper-2)!important;text-decoration:none}
input[type=search],input[type=text],input[type=email],input[type=number],select,textarea{border-radius:var(--r)!important;border:1px solid var(--line)!important;background:var(--card)!important;color:var(--ink)!important;box-shadow:none!important;font-family:var(--ui)}
input:focus,select:focus,textarea:focus{border-color:var(--ink)!important;outline:none}
.chip,.chips button{border-radius:var(--r)!important;box-shadow:none!important}
.chip.on,.chips button.on{background:var(--ink)!important;color:#fff!important;border-color:var(--ink)!important}

/* Bühne · Startzustand als zweispaltiger Hero */
#stage{background:var(--paper)!important}
#stage::before,#stage::after,#stage .stars{display:none!important}
#stage:not(.city):not(.rail){height:min(calc(100vh - var(--head)),720px)!important;min-height:600px!important;border-bottom:1px solid var(--line)}
#stage:not(.city):not(.rail) .copy{width:clamp(420px,38%,540px)!important;background:var(--paper)!important;border-right:1px solid var(--line);padding:64px 40px 0 48px!important;z-index:4}
#stage .copy h1{font-family:var(--display)!important;font-weight:300!important;font-size:clamp(40px,3.6vw,54px)!important;line-height:1.06!important;max-width:11ch!important;color:var(--ink)!important;font-variation-settings:normal!important}
#stage .copy .lead{font-size:17px!important;line-height:1.5!important;color:var(--ink-2)!important;max-width:40ch!important;margin:22px 0 26px!important}
#stage .copy .hsearch{display:flex;gap:8px;max-width:460px}
#stage .copy .hsearch input{height:44px;flex:1;padding:0 14px;font-size:15px}
#stage .copy .hsearch .btn{height:44px}
#stage .copy .hquick{margin-top:16px;font-size:14px;color:var(--muted)}
#stage .copy .hquick button,#stage .copy .hquick a{background:none!important;border:0!important;padding:0!important;margin:0 4px!important;color:var(--ink)!important;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px;font-size:14px!important;height:auto!important;border-radius:0!important}
#stage .copy .hquick button:hover{text-decoration-color:var(--ink)}
#stage .copy .hint-dive{color:var(--muted);font-size:13.5px;margin-top:22px}
#stage:not(.city):not(.rail) #card{display:none!important}
#stage .ticker{display:none!important}
#wtools{left:auto!important;right:24px!important;bottom:24px!important;top:auto!important;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--card);box-shadow:none!important}
#wtools button{height:32px;padding:0 14px;font-size:13.5px;border-radius:0!important;background:var(--card);color:var(--ink);border:0}
#wtools button.on{background:var(--ink)!important;color:#fff!important}
#stage.city #wtools,#stage.rail #wtools{display:none}

/* Explorer: flache Panels statt Glas */
#card,#rail,#crumb,#tools,#browse,#myradar,#mfile{background:var(--card)!important;border:1px solid var(--line)!important;border-radius:var(--r2)!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#crumb{border-radius:var(--r)!important}
#crumb button.cur,#crumb button:last-child{color:var(--mark)!important}
#tools,#wtools{border-radius:var(--r)!important}
#tools button.on{background:var(--ink)!important;color:#fff!important}
#card h2,#card h3,#card .t,#card .ttl{font-family:var(--display)}
#card .illu,#card .cimg .illu{display:none}
.ri.on,.ri.sel{background:var(--mark-tint)!important;box-shadow:inset 2px 0 0 var(--mark)}
.ri:hover{background:var(--paper-2)!important}

/* Kennzahlenzeile */
.stats,.stats.dark{background:var(--paper)!important;color:var(--ink)!important;border-bottom:1px solid var(--line);padding:36px 0!important}
.stats .wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.stats .wrap>div{padding:0 24px;border-left:1px solid var(--line)}
.stats .wrap>div:first-child{border-left:0;padding-left:0}
.stats .z{font-family:var(--display)!important;font-weight:300!important;font-size:40px!important;line-height:1!important;color:var(--ink)!important;letter-spacing:-.01em}
.stats .l{font-size:13.5px!important;color:var(--muted)!important;margin-top:8px;text-transform:none!important;letter-spacing:0!important;font-family:var(--ui)!important}

/* Abschnitte: Linie über der H2, ruhiger Rhythmus */
.ways,.wall,.netband,.alts,.sec{background:var(--paper)!important;color:var(--ink)!important;padding:96px 0!important}
.sec.tint,.tint{background:var(--paper)!important}
.ways h2,.wall h2,.netband h2,.alts h2,.sec h2{border-top:1px solid var(--line-strong);padding-top:20px;color:var(--ink)!important;font-family:var(--display)!important;font-weight:300!important}
.sec-head p,.whead p,.plead{color:var(--ink-2)!important;font-size:16.5px;max-width:58ch}
.access h2{border-top:0!important;padding-top:0!important}

/* How it works: drei nummerierte Zeilen */
.alt3{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:0!important;border-top:1px solid var(--line);margin-top:32px}
.alt3 .alt{background:none!important;border:0!important;border-left:1px solid var(--line)!important;border-radius:0!important;padding:24px 28px 8px!important;text-align:left;box-shadow:none!important;transform:none!important}
.alt3 .alt:first-child{border-left:0!important;padding-left:0!important}
.alt3 .alt .num{display:block;font-family:var(--display);font-weight:300;font-size:40px;line-height:1;color:var(--ink);margin-bottom:14px}
.alt3 .alt h3{font-size:22px;margin-bottom:8px}
.alt3 .alt p{color:var(--ink-2);font-size:15px}
.alt3 .alt .price{margin-top:14px;font-family:var(--mono);font-size:13px;color:var(--muted)}
.alt3 .alt:hover h3{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}

/* Musterakte */
.proof .file{background:var(--card)!important;border:1px solid var(--line)!important;border-radius:var(--r2)!important;box-shadow:none!important;padding:24px!important}
.proof .file .h b{font-family:var(--display);font-weight:500;font-size:24px}
.proof .file .r{border-bottom:1px solid var(--line)}
.proof .file .v.veil{background:var(--veil)!important;opacity:.5;border-radius:2px}

/* Preise */
.plans{gap:0!important;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)}
.plan{background:none!important;border:0!important;border-left:1px solid var(--line)!important;border-radius:0!important;box-shadow:none!important;padding:28px 24px!important;transform:none!important}
.plan:first-child{border-left:0!important;padding-left:0!important}
.plan.hi{background:none!important;outline:0!important}
.plan.hi .name::after{content:"Most teams start here";display:block;font-family:var(--ui);font-size:12.5px;font-weight:400;color:var(--muted);margin-top:4px}
.plan .name{font-family:var(--display);font-size:22px;font-weight:500;color:var(--ink)}
.plan .amt{font-family:var(--display);font-weight:300;font-size:40px;color:var(--ink)}
.plan .cr{font-family:var(--mono);font-size:13px;color:var(--muted)}
.month{background:none!important;border:0!important;border-top:1px solid var(--line)!important;border-radius:0!important;box-shadow:none!important;padding:32px 0 0!important}
.month .roi{display:none!important}
.month .z{font-family:var(--display)!important;font-weight:300!important;color:var(--ink)!important}
table.credits th{border-bottom:1px solid var(--line-strong)!important;color:var(--muted);font-weight:500}
table.credits td{border-bottom:1px solid var(--line)}

/* Zielgruppe, FAQ, Anfrage, Fuß */
.tradeline{font-size:19px;line-height:1.5;color:var(--ink);max-width:60ch;margin-top:20px}
.faq details{border-bottom:1px solid var(--line)!important;border-top:0!important;border-radius:0!important;background:none!important}
.faq summary{font-family:var(--display);font-size:19px;font-weight:400}
.access{background:var(--ink)!important;color:#fff!important;border-radius:var(--r2)!important;box-shadow:none!important}
.access h2,.access p{color:#fff!important}
.access .btn-primary{background:#fff!important;color:var(--ink)!important;border-color:#fff!important}
footer{background:var(--paper)!important;color:var(--muted)!important;border-top:1px solid var(--line)}
footer .wrap{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
footer .flogo img{height:20px;display:block}
footer a{color:var(--ink-2)!important}
#hrb-legal{display:none!important}

/* Signale, Rangliste, Verzeichnis: keine Kartenkästen */
.wgrid>*,.dir>*,.prank li,.pcol{box-shadow:none!important}
.ptabs button{border-radius:0!important;background:none!important;border:0!important;border-bottom:1px solid transparent!important;padding:6px 0!important;margin-right:18px;color:var(--muted)!important}
.ptabs button.on{color:var(--ink)!important;border-bottom-color:var(--ink)!important}

@media (max-width:1100px){.brand .logo{height:22px}}
@media (max-width:980px){
  #stage:not(.city):not(.rail){height:auto!important;min-height:0!important}
  #stage:not(.city):not(.rail) .copy{position:relative!important;width:auto!important;border-right:0;border-bottom:1px solid var(--line);padding:36px 20px 28px!important}
  .stats .wrap{grid-template-columns:repeat(2,1fr);row-gap:24px}
  .stats .wrap>div:nth-child(odd){border-left:0;padding-left:0}
  .alt3{grid-template-columns:1fr!important}
  .alt3 .alt{border-left:0!important;padding-left:0!important;border-bottom:1px solid var(--line)!important}
  .plan{border-left:0!important;padding-left:0!important;border-bottom:1px solid var(--line)!important}
}
@media (max-width:640px){
  h1{font-size:36px} h2{font-size:28px}
  .nav .wrap{padding:0 16px;gap:16px}
  .brand .logo{display:none} .brand .logo-s{display:block}
  #stage .copy h1{font-size:34px!important}
  .ways,.wall,.netband,.alts,.sec{padding:64px 0!important}
}

/* Runde v2a-Korrekturen nach erstem Rendering */
#stage:not(.city):not(.rail) .copy{top:0!important;bottom:0!important}
.brand .logo{height:31px}
#stage .copy h1{max-width:12ch!important;font-size:clamp(40px,3.4vw,50px)!important}
#stage:not(.city):not(.rail) #browse,#stage:not(.city):not(.rail) #myradar{display:none!important}
#card .chero:not(.photo){display:none!important}
.wbar{height:8px!important;border-radius:0!important;margin-top:24px!important}
.wbar i{border-radius:0!important}
.wbar i.wb{background:var(--ink)!important}
.stagebar{border-radius:var(--r)!important;background:var(--card)!important}
#card .big,#card .score .z{font-family:var(--display)!important;font-weight:300!important}

/* v2b: ein Umschalter, Handy-Karte, Kennzahlen, Akte */
#card .vsw{display:none!important}
.stats .wrap{padding-left:24px!important;padding-right:24px!important}
#card .wnote,#card .buynote,#card .bnow{background:var(--signal-tint)!important;border-left:2px solid var(--signal)!important}
#rail .rsel,#rail .here,#rail .cur{background:var(--mark-tint)!important;border-color:var(--line)!important;box-shadow:inset 2px 0 0 var(--mark)}
@media (max-width:980px){
  #stage:not(.city):not(.rail){padding-bottom:56vh!important}
  #stage:not(.city):not(.rail) #globe{top:auto!important;bottom:0!important;height:56vh!important}
  #stage:not(.city):not(.rail) #wtools{bottom:12px!important;right:12px!important}
  .stats .wrap{padding-left:20px!important;padding-right:20px!important}
}
.wst{border-radius:0!important;background:var(--paper-2)!important;border-left:2px solid var(--muted)!important}
.wst.buy{background:var(--signal-tint)!important;border-left-color:var(--signal)!important}
.rctx{background:var(--mark-tint)!important;border:1px solid var(--line)!important;border-radius:var(--r)!important;box-shadow:inset 2px 0 0 var(--mark)}

/* ===== Etappe 3: Explorer ===== */
#stage.city,#stage.rail{height:calc(100vh - var(--head))!important;min-height:560px!important}
#xbar,#mlegend{display:none}
#stage.city #xbar,#stage.rail #xbar{display:block;position:absolute;top:0;left:0;right:0;height:52px;background:var(--paper);border-bottom:1px solid var(--line);z-index:8}
#stage.city #crumb,#stage.rail #crumb{top:8px!important;left:16px!important;height:36px;background:transparent!important;border:0!important;z-index:9;padding:0 4px!important;font-size:14px}
#crumb button{font-size:14px;color:var(--ink-2)}
#crumb button small{font-size:11.5px;color:var(--muted);margin-left:4px}
#crumb i{color:var(--muted);font-style:normal;margin:0 4px}
#stage.city #tools,#stage.rail #tools{top:10px!important;left:50%!important;transform:translateX(-50%)!important;z-index:9;padding:0!important;gap:0!important;overflow:hidden}
#tools button{height:32px;padding:0 14px;font-size:13.5px;border-radius:0!important}
#stage.city #browse,#stage.rail #browse,#stage.city #myradar,#stage.rail #myradar{top:10px!important;left:auto!important;height:32px;padding:0 12px!important;font-size:13.5px;z-index:9;display:flex;align-items:center;border-radius:var(--r)!important}
#stage.city #browse,#stage.rail #browse{right:16px!important}
#stage.city #myradar,#stage.rail #myradar{right:112px!important}
#stage.city #rail,#stage.rail #rail{top:52px!important;width:360px;background:var(--paper)!important;border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important}
#stage.city #card,#stage.rail #card{top:68px!important}

/* Filter in der Liste */
#rail .rhead .t{font-family:var(--display);font-size:20px;font-weight:500;color:var(--ink)}
#rail .rfilter{padding:0 18px 12px}
#rail .rfilter label{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted)}
#rail .rfilter select{flex:1;height:36px;padding:0 10px;font-size:14px}
#rail #rq{height:40px}

/* Projektzeile: Zahlen | Beschreibung | Akte */
#rail .ri.pr{display:grid!important;grid-template-columns:56px 1fr auto;gap:12px;align-items:start;padding:12px 18px!important;text-align:left;border-bottom:1px solid var(--line)}
#rail .ri.pr .pr-l{font-family:var(--mono);font-size:15px;line-height:1.15;color:var(--ink);font-variant-numeric:tabular-nums}
#rail .ri.pr .pr-l small{display:block;font-family:var(--ui);font-size:11px;color:var(--muted);margin-top:2px}
#rail .ri.pr .pr-m b{display:block;font-family:var(--ui);font-size:14.5px;font-weight:500;color:var(--ink);line-height:1.3}
#rail .ri.pr .pr-m>span{display:block;font-size:12.5px;line-height:1.45;color:var(--muted)}
#rail .ri.pr em,#rail .ri em{position:static!important;font-family:var(--mono);font-style:normal;font-size:13px;color:var(--muted);text-align:right;line-height:1.15}
#rail .ri.pr em small{display:block;font-family:var(--ui);font-size:11px;color:var(--muted)}
#rail .ri.pr em.ok{color:var(--ink)}
#rail .ri .wt.buy,#card .wt.buy{color:var(--signal)!important;font-family:var(--ui)!important;font-style:normal;font-weight:500}
#rail .rsub{font-family:var(--ui);font-size:12.5px;font-weight:500;color:var(--muted);padding:18px 18px 6px;border-bottom:1px solid var(--line-strong);margin:0 18px;padding-left:0;padding-right:0}

/* Akte */
#card h3{font-family:var(--display)!important;font-size:26px!important;font-weight:500!important;line-height:1.15!important}
#card .fsum{font-size:13px;color:var(--muted);padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:14px 0}
#card .fsum b{color:var(--ink);font-weight:600}
#card .sub{font-family:var(--ui);font-size:12.5px;font-weight:500;color:var(--muted);border-bottom:1px solid var(--line-strong);padding-bottom:6px;margin-top:22px}
#card .flist li{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px}
#card .flist .st{font-family:var(--mono);font-size:12px;display:flex;align-items:center;gap:8px}
#card .flist .st.ok{color:var(--ink)}
#card .flist .st.no{color:var(--muted)}
#card .flist .vb{display:inline-block;width:56px;height:8px;background:var(--veil);opacity:.6}
#card .offer{border-top:1px solid var(--line)!important;background:var(--card)!important}
#card .offer .mono{font-family:var(--ui)!important;font-size:12.5px!important;color:var(--muted)!important;letter-spacing:0!important;text-transform:none!important}
#card .offer b{font-family:var(--mono);font-size:15px;font-weight:500}

/* Legende auf der Karte */
#stage.city #mlegend{display:flex;position:absolute;left:16px;bottom:16px;z-index:5;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:7px 12px;font-size:12px;color:var(--ink-2)}
#stage.city.rail #mlegend{left:376px}
#mlegend span{display:flex;align-items:center;gap:6px}
#mlegend i{width:9px;height:9px;border-radius:50%;display:inline-block}
#mlegend i.c{background:#15171B}#mlegend i.p{background:#6A6E75}#mlegend i.v{background:#B8BCC2}#mlegend i.r{background:#9C7F4A}
#mlegend i.s{border:2px solid var(--mark);width:11px;height:11px}
@media (max-width:980px){#mlegend{display:none!important}}
#rail .ri.pr{grid-template-areas:none!important}
#rail .ri.pr>*{grid-area:auto!important;align-self:start!important}
#rail .ri.pr .pr-m>span{font-size:12.5px!important;color:var(--muted)!important}
#rail .ri.pr .wt{font-size:12.5px!important;letter-spacing:0!important}
#rail .ri.pr .nm{font-size:inherit!important;color:inherit!important;font-family:inherit!important;font-weight:inherit!important}
@media (max-width:640px){
  #stage.city #myradar,#stage.rail #myradar{display:none!important}
  #stage.city #tools,#stage.rail #tools{top:62px!important;left:12px!important;transform:none!important;background:var(--card)!important;border:1px solid var(--line)!important}
  #stage.city #crumb,#stage.rail #crumb{left:8px!important;max-width:calc(100% - 120px);overflow:hidden;white-space:nowrap}
  #stage.city #browse,#stage.rail #browse{right:12px!important}
  #stage.city #rail,#stage.rail #rail{width:100%!important}
}
@media (max-width:980px){#stage.city #card,#stage.rail #card{top:auto!important}}
/* Kennzahlen: Zahlen oben bündig, Trennlinien gleich hoch (Denis 22.10.) */
.stats .wrap{align-items:stretch!important}
.stats .wrap>div{display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-self:stretch!important;margin:0!important}
.stats .l{white-space:nowrap}
@media (max-width:980px){.stats .l{white-space:normal}}

/* Abnahme Fable 22.10. */
#rail .ri.pr .pr-l{grid-column:1!important;grid-row:1!important}
#rail .ri.pr .pr-m{grid-column:2!important;grid-row:1!important;min-width:0}
#rail .ri.pr>em{grid-column:3!important;grid-row:1!important}
@media (max-width:640px){
  #stage.city #tools,#stage.rail #tools{top:auto!important;bottom:calc(44% + 12px)!important}
  #stage #myradar{display:none!important}
}
@media (min-width:981px){#stage.city .maplibregl-ctrl-bottom-right,#stage.rail .maplibregl-ctrl-bottom-right{right:420px}}
#card .offer{padding:10px 22px!important}
@media (max-width:980px){#stage .copy .lead{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;max-height:none!important}}
#crumb button small{display:inline!important;margin-left:4px}
@media (max-width:640px){#stage.rail #tools{display:none!important}}
#crumb button{display:inline-flex!important;flex-direction:row!important;align-items:baseline!important}
