:root{--bg:#07080b;--fg:rgba(255,255,255,.92);--muted:rgba(255,255,255,.72);--faint:rgba(255,255,255,.52);--gold:#d9a441;--gold-soft:#e8b87a;--line:rgba(217,164,65,.55)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.5;overflow-x:hidden}
a{color:inherit}
.wrap{max-width:980px;margin:0 auto;padding:0 22px 60px}
/* entfernt */ .x-proto{position:sticky;top:0;z-index:60;background:#2a1d08;color:#f6d996;font:12px/1.4 'Courier New',monospace;letter-spacing:.08em;text-align:center;padding:7px 12px;border-bottom:1px solid rgba(217,164,65,.35)}
.back{display:inline-block;margin:22px 0 26px;font:12px 'Courier New',monospace;color:var(--faint);text-decoration:none}
.back:hover{color:var(--gold-soft)}
.kicker{font:12px 'Courier New',monospace;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);margin:0 0 10px}
h1{margin:0;font-size:clamp(28px,5vw,48px);line-height:1.05;font-weight:800}
h1 span{color:var(--gold-soft)}
.lead{margin:12px 0 24px;color:var(--muted);font-size:clamp(15px,1.9vw,19px)}
.titel{margin:0;border-radius:22px;overflow:hidden;border:1px solid rgba(217,164,65,.28);box-shadow:0 20px 60px rgba(0,0,0,.45)}
.titel img{display:block;width:100%;height:auto}
.intro{margin:26px 0 10px;max-width:720px;color:var(--muted);font-size:15.5px}
.intro b{color:var(--fg)}
.sec-title{margin:44px 0 4px;font-size:clamp(20px,2.6vw,26px)}
.sec-sub{margin:0 0 14px;color:var(--faint);font-size:14px}
.sec-link{margin:10px 0 0}
/* Hausschnitt – Bleistiftzeichnung (P26037, 19.09.2026) */
@font-face{font-family:"Architects Daughter";src:url("../assets/fonts/architects-daughter-400.woff2") format("woff2");font-weight:400;font-display:swap}
.schnitt{width:100%;height:auto;display:block;border-radius:6px;box-shadow:0 18px 50px rgba(0,0,0,.55);transform:rotate(-.35deg);background:#eee7d9}
.schnitt .g{stroke:#2d2d31;fill:none;stroke-linecap:round}
.schnitt .b{stroke:#2f5d8a;fill:none}
.schnitt .red path{stroke:#b3322a;opacity:.8}
.schnitt .t{fill:#2b2b2f;font-family:"Architects Daughter","Segoe Print","Bradley Hand",cursive;letter-spacing:.02em}
.schnitt .t-soft{fill:#55534f}
.schnitt .t-big{fill:#1f1f22;letter-spacing:.04em}
.schnitt .t-blue{fill:#2f5d8a}
.schnitt .t-red{fill:#b3322a}
.schnitt .green path{stroke:#3f8a3a;fill:none}
.schnitt .green path:first-child{fill:rgba(80,160,70,.18)}
.schnitt .t-green{fill:#2f6e2b}
.schnitt .stamp *{stroke:#2c4f9e;fill:none;opacity:.78}
.schnitt .stamp .st{fill:#2c4f9e;stroke:none;font-family:"Courier New",monospace;font-weight:700;letter-spacing:.06em}
.schnitt .t-ink{fill:#243f7a}
@font-face{font-family:"IBM Plan";src:url("../assets/fonts/barlow-condensed-600.woff2") format("woff2");font-weight:600;font-display:swap}
.schnitt .t-title{fill:#1f1f22;font-family:"IBM Plan","Barlow Condensed","Arial Narrow",sans-serif;font-weight:600;letter-spacing:.12em}
.schnitt .s-room rect{fill:rgba(217,164,65,0);transition:fill .2s}
.schnitt .s-room:hover rect,.schnitt .s-room:focus rect{fill:rgba(217,164,65,.28)}
.schnitt .s-room:focus{outline:none}
.schnitt .s-room:focus-visible rect{stroke:#b3322a;stroke-width:1.5}

.schnitt-wrap{overflow-x:auto;padding:6px 4px 14px;-webkit-overflow-scrolling:touch}
@media (max-width:760px){.schnitt{min-width:720px}}

/* Etagen */
.floor-sec{margin-top:54px;scroll-margin-top:50px}
.floor-head{display:flex;align-items:center;gap:16px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(217,164,65,.22)}
.floor-no{flex:0 0 auto;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 16px 'Courier New',monospace;color:#1a1206;background:radial-gradient(circle at 35% 30%,#f6d996,#d9a441 60%,#8a6320);box-shadow:0 0 22px rgba(217,164,65,.25)}
.floor-head h2{margin:0;font-size:clamp(20px,2.6vw,26px)}
.floor-head p{margin:0;color:var(--faint);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.room{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:start;padding:16px;margin-bottom:10px;border-radius:16px;border:1px solid rgba(217,164,65,.14);background:linear-gradient(135deg,rgba(217,164,65,.045),rgba(7,8,11,.2));scroll-margin-top:50px}
.room:target{border-color:rgba(217,164,65,.7);box-shadow:0 0 0 1px rgba(217,164,65,.25),0 10px 40px rgba(0,0,0,.4)}
.room__img{position:relative;width:150px;height:150px;border-radius:50%;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 22px rgba(0,0,0,.5)}
.room__img img{width:100%;height:100%;object-fit:cover;display:block}
.room__img--ph{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,rgba(217,164,65,.3),rgba(60,40,12,.5) 55%,rgba(15,12,8,.9));border:1px dashed rgba(217,164,65,.45);font:10px 'Courier New',monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,217,150,.7)}
.ai{position:absolute;right:14%;bottom:12%;font:700 9px/1 ui-sans-serif,system-ui,Arial;color:#111;background:#fff;border-radius:3px;padding:3px 4px}
.room h3{margin:4px 0 6px;font-size:17px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.room p{margin:0 0 8px;color:var(--muted);font-size:14.5px}
.room__who{color:var(--faint)!important;font-size:13px!important}
.room__who b{color:var(--gold-soft);font-weight:600}
.links{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.pill{font:700 11.5px 'Courier New',monospace;letter-spacing:.06em;text-decoration:none;padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.88);background:rgba(255,255,255,.03);white-space:nowrap}
.pill:hover{border-color:var(--gold);color:#f6d996;background:rgba(217,164,65,.08)}
.pill--about{border-color:rgba(217,164,65,.4);color:var(--gold-soft)}
.pill[aria-disabled="true"]{opacity:.45}
.pill small{font-weight:400;opacity:.7}
@media (max-width:620px){.room{grid-template-columns:1fr}.room__img{width:120px;height:120px}}
.foot{margin-top:50px;color:var(--faint);font-size:12.5px}
/* Aufzug-Bedienfeld */
.lift{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:50;display:flex;flex-direction:column;gap:7px;align-items:center;padding:12px 10px;border-radius:16px;background:linear-gradient(180deg,#1b1a17,#0e0d0b);border:1px solid rgba(217,164,65,.35);box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.06)}
.lift__display{font:700 15px 'Courier New',monospace;color:#ff9a3c;text-shadow:0 0 8px rgba(255,140,40,.7);background:#130a04;border:1px solid rgba(255,140,40,.25);border-radius:6px;width:46px;text-align:center;padding:4px 0;margin-bottom:4px}
.lift__btn{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;font:700 12px 'Courier New',monospace;color:rgba(255,255,255,.8);background:radial-gradient(circle at 40% 35%,#3a3833,#1c1b18);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 -2px 3px rgba(0,0,0,.5);transition:box-shadow .25s,color .25s,border-color .25s}
.lift__btn:hover{border-color:rgba(217,164,65,.6)}
.lift__btn.is-active{color:#1a1206;background:radial-gradient(circle at 40% 35%,#f6d996,#d9a441);border-color:#f6d996;box-shadow:0 0 14px rgba(217,164,65,.55)}
@media (max-width:1120px){
  .lift{top:auto;bottom:0;right:0;left:0;transform:none;flex-direction:row;justify-content:center;flex-wrap:nowrap;border-radius:14px 14px 0 0;padding:8px 6px;gap:5px;overflow-x:auto}
  .lift__display{margin:0 4px 0 0;width:40px;font-size:13px}
  .lift__btn{width:34px;height:34px;font-size:11px;flex:0 0 auto}
  .wrap{padding-bottom:90px}
}

.titel--wechsel{position:relative}
.titel--wechsel img{transition:opacity 1.2s ease}
.titel--wechsel .t-nacht{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.titel--wechsel.is-nacht .t-nacht{opacity:1}
.t-switch{position:absolute;top:14px;right:14px;font:700 12px 'Courier New',monospace;letter-spacing:.1em;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(7,8,11,.55);color:#fff;cursor:pointer;backdrop-filter:blur(4px)}
.t-switch:hover{border-color:#d9a441;color:#f6d996}
@media (prefers-reduced-motion:reduce){.titel--wechsel img{transition:none}}
/* Hotspots im Titelbild (P26037, 19.09.2026) */
.titel--wechsel .hot{position:absolute;z-index:3;display:block;padding:0;margin:0;background:transparent;border:2px solid transparent;border-radius:10px;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.titel--wechsel .hot::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:hotpuls 2.4s ease-out infinite;opacity:.8}
.titel--wechsel .hot span{position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);white-space:nowrap;font:600 12px/1.2 ui-sans-serif,system-ui,sans-serif;color:#111;background:#f3eee3;padding:5px 9px;border-radius:7px;box-shadow:0 6px 18px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .2s}
.titel--wechsel .hot:hover,.titel--wechsel .hot:focus-visible{border-color:#fff;box-shadow:0 0 0 3px rgba(0,0,0,.25),0 0 18px rgba(255,255,255,.35)}
.titel--wechsel .hot:hover::after,.titel--wechsel .hot:focus-visible::after{opacity:0}
.titel--wechsel .hot:hover span,.titel--wechsel .hot:focus-visible span{opacity:1}
.titel--wechsel .hot--flugtaxi span,.titel--wechsel .hot--apfel span,.titel--wechsel .hot--bar span{left:auto;right:0;transform:none}
.titel--wechsel .t-switch{z-index:4}
@keyframes hotpuls{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}70%{box-shadow:0 0 0 12px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media (prefers-reduced-motion:reduce){.titel--wechsel .hot::after{animation:none}}
@media (max-width:760px){.titel--wechsel .hot::after{width:7px;height:7px;margin:-3.5px 0 0 -3.5px}.titel--wechsel .hot span{display:none}}
/* Nachts liegt Carl nicht am Steg, sondern läuft über den Parkplatz */
.titel--wechsel.is-nacht .hot--carl{left:86.5%!important;top:48%!important}
/* Einladende Links zu Räumen, die man wirklich betreten kann */
.pill--go{background:rgba(217,164,65,.16);border-color:rgba(217,164,65,.7);color:#f6d996}
.pill--go:hover{background:rgba(217,164,65,.3);color:#fff}

/* Echte Fotos (P26037, 12.10.2026) */
.echt-row{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 10px}
.echt{margin:0;width:150px;max-width:46%}
.echt a{display:block;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.16);box-shadow:0 6px 18px rgba(0,0,0,.45)}
.echt img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s}
.echt a:hover img{transform:scale(1.04)}
.echt figcaption{margin-top:5px;color:var(--faint);font-size:12px;line-height:1.35}
.echt__tag{display:inline-block;margin-right:4px;font:700 9px/1 'Courier New',monospace;letter-spacing:.12em;text-transform:uppercase;padding:3px 6px;border-radius:999px;border:1px solid rgba(217,164,65,.55);color:var(--gold-soft);vertical-align:1px}
.echt--intro{width:240px;max-width:70%;margin:16px 0 4px}
.echt--intro img{aspect-ratio:3/4}
@media (prefers-reduced-motion:reduce){.echt img{transition:none}}