/* Immoagenten · Exposé „Die Akte“ — heller Look (nur Vorschau, 03.11.2026).
   Wird nur eingebunden, wenn der Generator mit AKTEN_HELL läuft (Deploy-Skript, VARIANTE != produktion). Aktiv per html.hell (muster-look.js bei ?look=w|m|m2).
   Gleiche Haltung wie der helle Look der Gesamtseite: Weiß / #F5F5F3, Schwarz #111, Gelb als Etikett und Knopf (--y), Karten mit weichem Schatten.
   Gelb als Schrift nur abgedunkelt (--gelb-t #111111). Akten-Charakter bleibt: Special Elite, Stempel, Aktendeckel, Fallnummer, Polaroids, roter Faden. */
html{--y:#F5A800;--yrgb:245,168,0}
html.hell{
  --bg:#FFFFFF; --bg2:#F5F5F3; --bg3:#ECECE9; --wall1:#F5F5F3; --wall2:#ECECE9;
  --fg:#111111; --dim:#494949; --mute:#828282; --gelb-t:#111111;
  --rot:#C0141E; --rot-h:#C0141E;
  --paper:#FFFFFF; --paper-d:#ECECE9; --ink:#111111; --ink-2:#575757;
  --line:rgba(17,17,17,.10); --line-g:rgba(var(--yrgb),.55);
  --schatten:0 1px 2px rgba(17,17,17,.04),0 10px 30px rgba(17,17,17,.07);
  --schatten-h:0 2px 6px rgba(17,17,17,.05),0 22px 48px rgba(17,17,17,.13);
  color-scheme:light;
}
.hell body{background:#fff;color:#111}
.hell .korn,.hell .vign{display:none}
.hell ::selection{background:var(--y);color:#111}
.hell h1,.hell h2,.hell h3{font-weight:700;letter-spacing:-.028em;line-height:1.05;text-transform:none}
.hell h1{font-size:clamp(34px,7vw,84px)}
.hell h2{font-size:clamp(28px,4.4vw,56px)}
.hell h3{font-size:clamp(20px,2.2vw,26px)}
.hell .sec{padding-block:clamp(72px,11vw,150px)}
.hell .gelb{color:var(--gelb-t)}
.hell .lead{font-weight:400}

/* Etiketten, Knöpfe, Stempel */
.hell .kick{display:inline-flex;align-items:center;gap:.7em;background:var(--y);color:#111;padding:7px 13px 6px;border-radius:999px;font-size:12px;letter-spacing:.12em;margin-bottom:20px}
.hell .kick::before{width:7px;height:7px;border-radius:50%;background:#111}
.hell .btn{border-radius:999px;background:var(--y);border-color:var(--y);color:#111;padding:15px 28px}
.hell .btn:hover{background:#111;border-color:#111;color:var(--y)}
.hell .btn.ghost{background:transparent;color:#111;border-color:#111}
.hell .btn.ghost:hover{background:#111;color:var(--y)}
.hell .stamp{box-shadow:0 2px 8px rgba(17,17,17,.12)}
.hell .stamp.rot{background:rgba(255,255,255,.94);color:#C0141E;border-color:#C0141E;outline-color:#C0141E}

/* Kopf */
.hell .top{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,0))}
.hell .top.fest{background:rgba(255,255,255,.94);border-color:var(--line);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px)}
.hell .top .logo img{filter:brightness(0)}
.hell .top nav a.zur{color:#111}
.hell .top nav a.zur:hover{color:var(--gelb-t)}
.hell .top .burger{background:#fff;border-color:rgba(17,17,17,.2);border-radius:10px}
.hell .top .burger span{background:#111;box-shadow:0 6px 0 #111,0 -6px 0 #111}
/* Menü bleibt in allen Looks dunkel (Alex 03.11.2026: „das dunkle Menü sieht wirklich geil aus“) – keine hellen Überschreibungen. */

/* Hero: helles Foto, Text auf Weiß */
.hell .hero{background:#fff}
.hell .hero-bg img{filter:saturate(1.02) brightness(1.04)}
.hell .hero::before{background:linear-gradient(0deg,#fff 2%,rgba(255,255,255,.95) 40%,rgba(255,255,255,.6) 62%,rgba(255,255,255,.4) 80%,rgba(255,255,255,.7) 100%)}
.hell .hero::after{display:none}
.hell .hero-deko{opacity:.06}
.hell .hero h1,.hell .hero .unter{color:#111;text-shadow:none}
.hell .hero .unter{color:var(--dim)}
.hell .hero .akte-nr{color:var(--gelb-t)}
.hell .hero-schnur path{filter:none}
.hell .hero .preis b{color:#111;text-shadow:none}
.hell .hero .preis small{color:var(--dim)}
.hell .ki-tag{background:rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(17,17,17,.12)}

/* Aktendeckel, Kennzahlen, Steckbrief, Energieausweis, Klartext */
.hell .deckel-innen{box-shadow:var(--schatten-h);border-radius:6px}
.hell .deckel-fotos a{box-shadow:0 4px 12px rgba(17,17,17,.18)}
.hell .band{background:var(--y)}
.hell .steck{transform:none;border-radius:20px;box-shadow:var(--schatten);border:0}
.hell .steck::before{background:var(--y);color:#111;border-radius:10px 10px 0 0;box-shadow:none}
.hell .energie{background:#fff;border:0;border-radius:20px;box-shadow:var(--schatten)}
.hell .klartext{transform:none;border-radius:16px;box-shadow:var(--schatten)}
.hell .spuren li::before{box-shadow:0 1px 2px rgba(17,17,17,.3)}

/* Beweiswand: helle Pinnwand, weiße Polaroids */
.hell .wand-sec{background:var(--bg2)}
.hell .wand-sec::before,.hell .wand-deko{display:none}
.hell .pol{box-shadow:0 8px 22px rgba(17,17,17,.14)}
.hell .pol:hover,.hell .pol:focus-visible{box-shadow:0 18px 40px rgba(17,17,17,.22)}
.hell .pol .foto{background:#e9e9e6}
.hell .pol .foto img{filter:none}
.hell .pol .nr{color:#828282}
.hell .vergleich{border-color:#fff;box-shadow:var(--schatten-h)}

/* Verlauf, Karte, Grundriss, Agent, weitere Fälle */
.hell .verlauf{background:#fff}
.hell .karte{border:0;border-radius:20px;overflow:hidden;box-shadow:var(--schatten)}
.hell .agent-sec{background:var(--bg2);border-color:var(--line)}
.hell .agent-txt h2{color:#111}
.hell .partner{background:#fff;border:0;border-radius:18px;box-shadow:var(--schatten)}
.hell .partner b{color:#111}
.hell .fall{background:#fff;border:0;border-radius:18px;box-shadow:var(--schatten);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.hell .fall:hover{transform:translateY(-4px);box-shadow:var(--schatten-h)}
.hell .fall img{filter:none;border-radius:10px}
.hell .fall small{color:var(--gelb-t)}

/* Fuß und Schnellleiste */
.hell .fuss-sec{background:var(--bg2);border-color:var(--line)}
.hell .fuss-sec .claim span{color:#111;background:linear-gradient(transparent 60%,var(--y) 60%,var(--y) 90%,transparent 90%)}
.hell .entwurf{color:#C0141E;border-color:#C0141E}
.hell .bar{background:rgba(255,255,255,.96);border-top:2px solid var(--y);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px)}
.hell .bar b{color:#111}
.hell a:focus-visible,.hell button:focus-visible{outline-color:#111}

/* Weiß: Fuß schwarz (wie auf der Gesamtseite) */
html.look-w .fuss-sec{--fg:#F4F4F2;--dim:#BEBEBA;--mute:#8E8E8A;--line:rgba(244,244,242,.14);background:#0a0a0a;color:#F4F4F2;border-top:2px solid var(--y)}
html.look-w .fuss-sec .claim span{color:var(--y);background:none}
html.look-w .fuss-sec .entwurf{color:#E8434C;border-color:#E8434C}
/* Menü dunkel erzwingen – auch wenn der helle Look --bg auf Weiß setzt */
html.hell .menu{--bg:#0e0d0c;--fg:#F4F4F2;background:#0e0d0c !important;color:#F4F4F2}
html.hell .menu a,html.hell .menu b{color:#F4F4F2}
html.hell .menu small{color:#F5A800}
html.hell .menu a{border-color:rgba(244,244,242,.14)}
html.hell .menu-zu{color:#F4F4F2;border-color:rgba(244,244,242,.28)}
html.hell.menu-auf .top{background:#0e0d0c}
/* Kleingedrucktes unter der Akte (03.11.2026): ruhig, nicht als grosse Rubrik */
.hell .akte-recht{padding-block:clamp(36px,5vw,64px)}
.hell .akte-recht h2{font-size:clamp(20px,2.4vw,28px);margin-bottom:18px}
/* Gold raus (06.11.2026): gelbe Schrift auf Weiß -> schwarz */
html.hell :is(.wege span,.fall small){color:#111}