/* ══════════════════════════════════════════════════════════
   BEREICH.CSS — geteilte Shell für alle Bereichsseiten
   Lindner Technik & Design · Göttingen
   Pro Seite wird nur --accent / --accent-l / --accent-rgb gesetzt.
   ══════════════════════════════════════════════════════════ */

:root {
  --bg:       #0C0B09;
  --bg2:      #111009;
  --surface:  #1A1714;
  --border:   #272320;
  --text:     #F0ECE6;
  --muted:    #8A7F74;
  --accent:   #C9590A;
  --accent-l: #E8701F;
  /* Fläche + darauf lesbare Schrift. Jede Bereichsseite überschreibt beides,
     falls ihr Akzent zu hell für weiße Schrift ist (siehe lackierung.html). */
  --accent-deep:   var(--accent);
  --accent-deep-l: var(--accent-l);
  --on-accent:     #fff;
  /* Akzentfarbe für kleinen TEXT auf dunklem Grund (AA-geprüft je Bereich) */
  --accent-text:   var(--accent);
      /* Tieferer Ton für Flächen mit weißer Schrift — #C9590A schafft nur 4,27:1 */
  --accent-rgb: 201,89,10;
  --nav-bg:   rgba(12,11,9,0.96);
  --mono:     'Space Mono','Space Mono Fallback',monospace;
  --disp:     'Syne','Syne Fallback',sans-serif;
  --body:     'DM Sans','DM Sans Fallback',sans-serif;
  --tr:       0.35s cubic-bezier(0.4,0,0.2,1);
}
[data-theme="light"] {
  --bg:     #F2EFE9;
  --bg2:    #E8E3DB;
  --surface:#FFFFFF;
  --border: #D6D0C6;
  --text:   #1A1714;
  --muted:  #6E645B;
  --nav-bg: rgba(242,239,233,0.96);
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--body); background: var(--bg); color: var(--text); line-height: 1.65; overflow-x: hidden; -webkit-font-smoothing: antialiased; transition: background var(--tr), color var(--tr); }
img { max-width: 100%; display: block; }

/* ── GRAIN ── */
body::after { content:''; position:fixed; inset:0; pointer-events:none; z-index:99997; opacity:0.022; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:200px; }

/* ── CURSOR ── */
/* Eigener Zeiger nur, wenn das Script wirklich läuft (html.js-cursor),
   ein echter Mauszeiger existiert und keine Bewegungsreduktion gewünscht ist. */
.cursor, .cursor-ring { display:none; }
@media (pointer:fine) and (prefers-reduced-motion:no-preference) {
  html.js-cursor body { cursor:none; }
  html.js-cursor .cursor { display:block; position:fixed; width:7px; height:7px; background:var(--accent); border-radius:50%; pointer-events:none; z-index:99999; transform:translate(-50%,-50%); transition:width .2s,height .2s; }
  html.js-cursor .cursor.on { width:12px; height:12px; }
  html.js-cursor .cursor-ring { display:block; position:fixed; width:30px; height:30px; border:1px solid rgba(var(--accent-rgb),.5); border-radius:50%; pointer-events:none; z-index:99998; transform:translate(-50%,-50%); }
  html.js-cursor .cursor-ring.on { width:46px; height:46px; border-color:rgba(var(--accent-rgb),.25); }
}
@media(max-width:900px){ body{cursor:auto} .cursor,.cursor-ring{display:none!important} }

/* ── ICONS (Inline-SVG-Sprite, kein Font-Awesome-CDN) ── */
.ic { width:1em; height:1em; display:inline-block; vertical-align:-.125em; flex:none; }
.ic-spin { animation:icSpin .9s linear infinite; }
@keyframes icSpin { to { transform:rotate(360deg) } }

/* ── NAV ── */
nav { position:fixed; top:0; left:0; width:100%; z-index:1000; background:var(--nav-bg); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid var(--border); transition:all var(--tr); }
.nav-inner { max-width:1400px; margin:0 auto; padding:0 3rem; height:60px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { font-family:var(--disp); font-weight:800; font-size:1.15rem; letter-spacing:-1px; text-decoration:none; color:var(--text); }
.nav-logo em { color:var(--accent); font-style:normal; }
.nav-links { display:flex; list-style:none; gap:0; align-items:center; }
.nav-links > li { position:relative; }
.nav-links a { display:block; font-family:var(--mono); font-size:.65rem; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; color:var(--muted); padding:.45rem 1.1rem; position:relative; transition:color var(--tr); }
.nav-links a::after { content:''; position:absolute; bottom:0; left:1.1rem; right:1.1rem; height:1px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .35s cubic-bezier(.4,0,.2,1); }
.nav-links a:hover, .nav-links a[aria-current="page"] { color:var(--text); }
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after { transform:scaleX(1); }

/* Bereiche-Dropdown */
.nav-drop > a::before { content:''; }
.nav-drop-menu { position:absolute; top:100%; left:.5rem; min-width:250px; background:var(--nav-bg); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--border); border-radius:2px; padding:.4rem 0; opacity:0; visibility:hidden; transform:translateY(-6px); transition:all .25s cubic-bezier(.4,0,.2,1); list-style:none; box-shadow:0 20px 50px rgba(0,0,0,.45); }
.nav-drop:hover .nav-drop-menu, .nav-drop:focus-within .nav-drop-menu { opacity:1; visibility:visible; transform:translateY(0); }
.nav-drop-menu a { padding:.6rem 1.1rem; display:flex; align-items:center; gap:.6rem; letter-spacing:1px; }
.nav-drop-menu a::after { display:none; }
.nav-drop-menu a:hover { color:var(--text); background:rgba(var(--accent-rgb),.08); }
.nd-swatch { width:7px; height:7px; border-radius:1px; flex-shrink:0; }

.nav-right { display:flex; align-items:center; gap:.5rem; }
.ctrl-btn { background:none; border:1px solid var(--border); color:var(--muted); padding:.28rem .6rem; border-radius:2px; font-size:.75rem; cursor:pointer; transition:all var(--tr); }
.ctrl-btn:hover { border-color:var(--accent); color:var(--accent); }
.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.hamburger span { display:block; width:20px; height:1.5px; background:var(--text); transition:all .3s; }
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mobile-menu { display:none; position:fixed; top:60px; left:0; width:100%; max-height:calc(100vh - 60px); overflow-y:auto; background:var(--nav-bg); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); padding:1rem 2rem 1.5rem; flex-direction:column; gap:0; z-index:999; animation:slideDown .25s ease; }
.mobile-menu.open { display:flex; }
@keyframes slideDown { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
.mobile-menu a { font-family:var(--mono); font-size:.72rem; letter-spacing:2px; text-transform:uppercase; text-decoration:none; color:var(--text); padding:.7rem 0; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.6rem; }
.mobile-menu .mm-sub { padding-left:1rem; font-size:.66rem; color:var(--muted); }
.mobile-controls { display:flex; gap:.5rem; padding-top:.75rem; }

/* ── BREADCRUMB ── */
.crumb { max-width:1400px; margin:0 auto; padding:1.4rem 3rem 0; font-family:var(--mono); font-size:.58rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); display:flex; gap:.5rem; flex-wrap:wrap; }
.crumb a { color:var(--muted); text-decoration:none; transition:color var(--tr); }
.crumb a:hover { color:var(--accent-text); }
.crumb .sep { opacity:.4; }
.crumb .cur { color:var(--accent-text); }

/* ── BEREICHS-HERO ── */
.bhero { position:relative; padding:5.5rem 3rem 5rem; max-width:1400px; margin:0 auto; overflow:hidden; }
.bhero-ghost { position:absolute; right:-2vw; bottom:-4vw; font-family:var(--disp); font-size:clamp(8rem,26vw,22rem); font-weight:800; line-height:.8; letter-spacing:-1.5vw; color:transparent; -webkit-text-stroke:1.5px rgba(var(--accent-rgb),.10); user-select:none; pointer-events:none; z-index:0; }
.bhero-inner { position:relative; z-index:1; max-width:900px; }
.bhero-eyebrow { display:flex; align-items:center; gap:1rem; margin-bottom:2rem; font-family:var(--mono); font-size:.62rem; letter-spacing:2.5px; text-transform:uppercase; color:var(--muted); }
.bhero-eyebrow .n { color:var(--accent-text); }
.bhero-eyebrow .rule { width:40px; height:1px; background:var(--border); }
.bhero h1 { font-family:var(--disp); font-size:clamp(2.6rem,7vw,6rem); font-weight:800; line-height:.92; letter-spacing:-3px; margin-bottom:1.5rem; }
.bhero h1 .acc { color:var(--accent); }
.bhero-sub { font-size:clamp(.95rem,1.5vw,1.12rem); color:var(--muted); max-width:620px; line-height:1.8; }
.bhero-meta { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:2.2rem; }
.bmeta { border:1px solid var(--border); border-radius:2px; padding:.34rem .8rem; font-family:var(--mono); font-size:.58rem; color:var(--muted); letter-spacing:1px; text-transform:uppercase; transition:all var(--tr); }
.bmeta:hover { border-color:var(--accent); color:var(--accent); }

/* ── SECTION COMMON ── */
.sec { padding:6rem 3rem; max-width:1400px; margin:0 auto; }
.sec-alt { background:var(--bg2); max-width:none; padding:6rem 0; }
.sec-alt > .sa-inner { max-width:1400px; margin:0 auto; padding:0 3rem; }
.sec-eyebrow { display:flex; align-items:center; gap:1rem; margin-bottom:3rem; font-family:var(--mono); font-size:.6rem; letter-spacing:3px; text-transform:uppercase; color:var(--muted); }
.sec-eyebrow .n { color:var(--accent-text); }
.sec-eyebrow::after { content:''; flex:1; height:1px; background:var(--border); }
.sec-title { font-family:var(--disp); font-size:clamp(2rem,4.4vw,3.8rem); font-weight:800; letter-spacing:-2px; line-height:1; margin-bottom:1.2rem; }
.sec-lead { font-size:.98rem; color:var(--muted); line-height:1.85; max-width:640px; }
.sec-lead strong { color:var(--text); font-weight:600; }
.sec-lead + .sec-lead { margin-top:1rem; }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1); }
.reveal.visible { opacity:1; transform:translateY(0); }
.rd1{transition-delay:.1s} .rd2{transition-delay:.2s} .rd3{transition-delay:.3s} .rd4{transition-delay:.4s}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  html { scroll-behavior:auto; }
}

/* ── BUTTONS ── */
.btn-pri { background:var(--accent-deep); color:var(--on-accent); padding:.9rem 2.2rem; border-radius:2px; text-decoration:none; font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; display:inline-flex; align-items:center; gap:.6rem; transition:background var(--tr),box-shadow var(--tr); box-shadow:0 4px 24px rgba(var(--accent-rgb),.3); border:none; cursor:pointer; }
.btn-pri:hover { background:var(--accent-deep-l); box-shadow:0 8px 32px rgba(var(--accent-rgb),.4); }
.btn-ghost { background:transparent; color:var(--text); padding:.9rem 2.2rem; border-radius:2px; border:1px solid var(--border); text-decoration:none; font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; display:inline-flex; align-items:center; gap:.6rem; transition:border-color var(--tr),color var(--tr); cursor:pointer; }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-row { display:flex; gap:1rem; flex-wrap:wrap; margin-top:2.5rem; }
@media(max-width:900px){ .btn-pri:active,.btn-ghost:active{transform:scale(.96)} }

/* ── HINWEIS-BLOCK (ehrlicher Status-Hinweis) ── */
.notice { border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:2px; background:var(--surface); padding:1.5rem 1.75rem; max-width:760px; }
.notice-lbl { font-family:var(--mono); font-size:.56rem; letter-spacing:2px; text-transform:uppercase; color:var(--accent-text); margin-bottom:.6rem; }
.notice p { font-size:.88rem; color:var(--muted); line-height:1.8; }
.notice p + p { margin-top:.7rem; }
.notice strong { color:var(--text); font-weight:600; }

/* ── FAKTEN-RASTER ── */
.facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); border-top:1px solid var(--border); }
.fact { padding:1.6rem 1.4rem 1.6rem 0; border-bottom:1px solid var(--border); }
.fact-v { font-family:var(--disp); font-size:1.9rem; font-weight:800; color:var(--accent); line-height:1; letter-spacing:-1px; }
.fact-l { font-family:var(--mono); font-size:.56rem; color:var(--muted); letter-spacing:1.5px; text-transform:uppercase; margin-top:.5rem; line-height:1.6; }

/* ── LEISTUNGS-LISTE (Zeilen statt Karten) ── */
.rowlist { border-bottom:1px solid var(--border); }
.rowitem { display:grid; grid-template-columns:2.4rem 1fr auto; align-items:start; gap:1.2rem; padding:1.5rem 0; border-top:1px solid var(--border); position:relative; overflow:hidden; }
.rowitem::before { content:''; position:absolute; left:0; top:0; bottom:0; width:0; background:rgba(var(--accent-rgb),.06); transition:width .5s cubic-bezier(.4,0,.2,1); }
.rowitem:hover::before { width:100%; }
.rowitem > * { position:relative; z-index:1; }
.row-num { font-family:var(--mono); font-size:.58rem; color:var(--muted); letter-spacing:1px; padding-top:.3rem; transition:color var(--tr); }
.rowitem:hover .row-num { color:var(--accent); }
.row-name { font-family:var(--disp); font-size:1.05rem; font-weight:700; letter-spacing:-.3px; margin-bottom:.35rem; }
.row-desc { font-size:.85rem; color:var(--muted); line-height:1.7; max-width:620px; }
.row-tag { font-family:var(--mono); font-size:.55rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent); border:1px solid rgba(var(--accent-rgb),.3); border-radius:1px; padding:.22rem .6rem; white-space:nowrap; margin-top:.3rem; }

/* ── ACCORDION ── */
.acc { border-top:1px solid var(--border); }
.acc-item { border-bottom:1px solid var(--border); }
.acc-head { width:100%; background:none; border:none; color:var(--text); font-family:var(--disp); font-size:1rem; font-weight:700; letter-spacing:-.2px; text-align:left; padding:1.3rem 0; display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; transition:color var(--tr); }
.acc-head:hover { color:var(--accent); }
.acc-chev { font-family:var(--mono); font-size:.75rem; color:var(--accent); transition:transform .35s cubic-bezier(.4,0,.2,1); flex-shrink:0; }
.acc-item.open .acc-chev { transform:rotate(45deg); }
.acc-body { max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(.4,0,.2,1); }
.acc-item.open .acc-body { max-height:900px; }
.acc-inner { padding:0 0 1.6rem; font-size:.88rem; color:var(--muted); line-height:1.85; max-width:720px; }
.acc-inner ul { list-style:none; margin-top:.8rem; }
.acc-inner li { padding-left:1.3rem; position:relative; margin-bottom:.45rem; }
.acc-inner li::before { content:'—'; position:absolute; left:0; color:var(--accent); }

/* ── CTA / KONTAKT ── */
.cta { background:var(--bg2); padding:6rem 0; border-top:1px solid var(--border); }
.cta-inner { max-width:1400px; margin:0 auto; padding:0 3rem; display:grid; grid-template-columns:1fr 1.4fr; gap:5rem; align-items:start; }
.cta h2 { font-family:var(--disp); font-size:clamp(1.8rem,3.4vw,2.8rem); font-weight:800; letter-spacing:-1.5px; line-height:1.05; margin-bottom:1rem; }
.cta p { font-size:.9rem; color:var(--muted); line-height:1.8; margin-bottom:2rem; }
.c-detail { display:flex; align-items:center; gap:1rem; padding:.85rem 0; border-bottom:1px solid var(--border); }
.c-icon { width:36px; height:36px; background:rgba(var(--accent-rgb),.1); border-radius:2px; display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:.8rem; flex-shrink:0; }
.c-lbl { font-family:var(--mono); font-size:.55rem; color:var(--muted); text-transform:uppercase; letter-spacing:1.5px; margin-bottom:.1rem; }
.c-val { font-size:.88rem; font-weight:500; }
.c-val a { color:inherit; text-decoration:none; }
.c-val a:hover { color:var(--accent); }

.c-form { display:flex; flex-direction:column; gap:1rem; }
.f-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.f-group { display:flex; flex-direction:column; gap:.35rem; }
.f-label { font-family:var(--mono); font-size:.58rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
.f-inp,.f-sel,.f-ta { background:var(--surface); border:1px solid var(--border); border-radius:2px; color:var(--text); padding:.78rem 1rem; font-family:var(--body); font-size:.88rem; outline:none; transition:border-color var(--tr),box-shadow var(--tr); width:100%; }
.f-inp:focus,.f-sel:focus,.f-ta:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.08); }
.f-sel option { background:var(--surface); color:var(--text); }
.f-ta { resize:vertical; min-height:120px; }
.f-submit { background:var(--accent-deep); color:var(--on-accent); border:none; border-radius:2px; padding:.9rem 2rem; font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.6rem; transition:all var(--tr); box-shadow:0 4px 20px rgba(var(--accent-rgb),.25); }
.f-submit:hover { background:var(--accent-deep-l); transform:translateY(-2px); box-shadow:0 8px 30px rgba(var(--accent-rgb),.35); }
.f-submit:disabled { opacity:.7; cursor:default; }
.f-ok { display:none; background:rgba(34,197,94,.1); border:1px solid rgba(34,197,94,.3); border-radius:2px; padding:.9rem; color:#4ade80; font-size:.85rem; text-align:center; }
.f-note { font-family:var(--mono); font-size:.55rem; color:var(--muted); letter-spacing:.5px; line-height:1.7; }
.f-note a { color:var(--accent); text-decoration:none; }

/* ── BEREICHS-WECHSLER (Fußnavigation) ── */
.switch { padding:4rem 3rem; max-width:1400px; margin:0 auto; }
.switch-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.switch-card { border:1px solid var(--border); border-radius:2px; padding:1.5rem; text-decoration:none; color:var(--text); background:var(--surface); position:relative; overflow:hidden; transition:border-color var(--tr),transform var(--tr); display:block; }
.switch-card::before { content:''; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--sc); }
.switch-card:hover { border-color:var(--sc); transform:translateY(-3px); }
.sc-lbl { font-family:var(--mono); font-size:.54rem; letter-spacing:2px; text-transform:uppercase; color:var(--sc); margin-bottom:.5rem; }
.sc-name { font-family:var(--disp); font-size:1.05rem; font-weight:700; letter-spacing:-.3px; margin-bottom:.3rem; }
.sc-desc { font-size:.78rem; color:var(--muted); line-height:1.6; }

/* ── FOOTER ── */
footer { background:#070605; padding:2rem 3rem; border-top:1px solid #1a1714; }
.ft-inner { max-width:1400px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.ft-logo { font-family:var(--disp); font-weight:800; font-size:1rem; color:#fff; letter-spacing:-.5px; }
.ft-logo em { color:var(--accent); font-style:normal; }
.ft-copy { font-family:var(--mono); font-size:.58rem; color:rgba(255,255,255,.58); letter-spacing:1px; }
.ft-links { display:flex; gap:2rem; flex-wrap:wrap; justify-content:center; }
.ft-links a { font-family:var(--mono); color:rgba(255,255,255,.62); text-decoration:none; font-size:.58rem; letter-spacing:1px; text-transform:uppercase; transition:color var(--tr); }
.ft-links a:hover { color:#fff; }
.ft-social a { width:32px; height:32px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:2px; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.65); text-decoration:none; font-size:.85rem; transition:all .3s; }
.ft-social a:hover { background:var(--accent); border-color:var(--accent); color:#fff; }

/* ── COOKIE ── */
.cookie-banner { position:fixed; bottom:0; left:0; right:0; background:rgba(8,7,5,.98); color:var(--text); padding:1.25rem 3rem; z-index:99990; box-shadow:0 -2px 30px rgba(0,0,0,.6); font-family:var(--body); transform:translateY(100%); transition:transform .4s cubic-bezier(.4,0,.2,1); backdrop-filter:blur(12px); border-top:1px solid var(--border); }
.cookie-banner.show { transform:translateY(0); }
.ck-inner { max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.ck-txt { font-size:.8rem; color:var(--muted); max-width:600px; line-height:1.6; }
.ck-txt a { color:var(--text); text-decoration:underline; text-underline-offset:2px; }
.ck-btns { display:flex; gap:.75rem; flex-shrink:0; }
.ck-btn { padding:.48rem 1.2rem; border-radius:2px; border:none; font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; cursor:pointer; transition:all .2s; }
.ck-btn-ok { background:var(--accent-deep); color:var(--on-accent); }
.ck-btn-ok:hover { background:var(--accent-deep-l); }
.ck-btn-no { background:rgba(255,255,255,.08); color:var(--text); }
.ck-cfg-btn { position:fixed; bottom:1rem; right:1rem; background:rgba(8,7,5,.92); color:var(--text); border:1px solid var(--border); border-radius:2px; padding:.38rem .8rem; font-family:var(--mono); font-size:.58rem; letter-spacing:1px; cursor:pointer; display:none; z-index:9990; }
.ck-cfg-btn.show { display:block; }

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .cta-inner { grid-template-columns:1fr; gap:3rem; }
  .switch-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:900px){
  .nav-links{display:none} .hamburger{display:flex} .nav-right .ctrl-btn{display:none}
  .nav-inner{padding:0 1.5rem}
  .crumb{padding:1.2rem 1.5rem 0}
  .bhero{padding:4.5rem 1.5rem 3.5rem}
  .sec{padding:4rem 1.5rem}
  .sec-alt{padding:4rem 0}
  .sec-alt > .sa-inner{padding:0 1.5rem}
  .cta{padding:4rem 0}
  .cta-inner{padding:0 1.5rem}
  .switch{padding:3rem 1.5rem}
  .switch-grid{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .rowitem{grid-template-columns:2rem 1fr; gap:.9rem}
  .row-tag{grid-column:2; justify-self:start}
  footer{padding:2rem 1.5rem}
  .ft-inner{flex-direction:column;text-align:center}
  .cookie-banner{padding:1.25rem 1.5rem}
}
@media(max-width:480px){
  .bhero h1{letter-spacing:-1.5px}
  /* Auch hier lief die Akzentzeile über den Rand hinaus */
  .bhero h1{ font-size:clamp(1.9rem,8.4vw,3rem); line-height:1.0; hyphens:auto; }
  .sec-title{ font-size:clamp(1.9rem,7.8vw,2.9rem); letter-spacing:-1.2px; hyphens:auto; }
  .bhero-ghost{ display:none; }
  .cookie-banner{ padding:1.1rem 1.25rem; }
  .ck-inner{ gap:1rem; }
  .mob-bar-btn{ min-width:0; flex:1 1 0; font-size:.55rem; letter-spacing:1px; padding:.85rem .25rem; }
  .tab-btn{ min-width:0; }
  .sec,.sec-alt,.bhero,.switch{ max-width:100vw; overflow-x:clip; }
  .btn-row{flex-direction:column}
  .btn-pri,.btn-ghost{width:100%;justify-content:center}
}


/* ── FORMULAR-FEHLER (statt alert) ── */
.f-err { display:none; background:rgba(220,60,40,.1); border:1px solid rgba(220,60,40,.35); border-radius:2px; padding:.9rem; color:#f08b78; font-size:.85rem; text-align:center; }
.f-err a { color:inherit; }

/* ── STICKY MOBILE-LEISTE (Handwerker rufen an) ── */
.mob-bar { display:none; position:fixed; left:0; right:0; bottom:0; z-index:9995; background:rgba(8,7,5,.97); backdrop-filter:blur(14px); border-top:1px solid var(--border); }
[data-theme="light"] .mob-bar { background:rgba(242,239,233,.97); }
.mob-bar-btn { flex:1; display:flex; align-items:center; justify-content:center; gap:.45rem; padding:.85rem .4rem; font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; color:var(--text); border-right:1px solid var(--border); }
.mob-bar-btn:last-child { border-right:none; }
.mob-bar-call { background:var(--accent-deep); color:var(--on-accent); }
@media(max-width:900px){
  .mob-bar { display:flex; }
  body { padding-bottom:52px; }
  .cookie-banner { bottom:52px; }
  .ck-cfg-btn { bottom:60px; }
}

/* ── FOTO-SLOTS ──
   Bereichsseiten ohne Bild verkaufen nichts. Die Slots stehen, sobald
   echte Aufnahmen da sind: Datei in img/<bereich>/ legen, <figure class="shot">
   entsprechend füllen — kein Redesign nötig. */
.shots { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.2rem; margin-top:2.5rem; }
.shot { position:relative; border:1px solid var(--border); border-radius:2px; overflow:hidden; background:var(--surface); }
.shot img { display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.shot-empty {
  aspect-ratio:4/3; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.7rem; text-align:center; padding:1.5rem; color:var(--muted);
  background:
    repeating-linear-gradient(45deg, rgba(var(--accent-rgb),.045) 0 10px, transparent 10px 20px),
    var(--bg2);
}
.shot-empty .ic { font-size:1.5rem; color:var(--accent); opacity:.55; }
.shot-empty b { font-family:var(--disp); font-size:.92rem; font-weight:700; color:var(--text); letter-spacing:-.2px; }
.shot-empty span { font-family:var(--mono); font-size:.56rem; letter-spacing:1.5px; text-transform:uppercase; line-height:1.9; }
.shot-cap {
  position:absolute; left:0; right:0; bottom:0; padding:.55rem .8rem;
  background:linear-gradient(to top, rgba(8,7,5,.9), transparent);
  font-family:var(--mono); font-size:.55rem; letter-spacing:1.5px; text-transform:uppercase; color:rgba(255,255,255,.8);
}
.shots-note { font-family:var(--mono); font-size:.56rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); margin-top:1rem; }