/* Flurio – CI / Design System
   Farbwerte sind auf WCAG 2.1 AA geprueft (Kontrastwerte als Kommentar am Token). */
:root{
  /* Marke */
  --deep:#0D5C4E;            /* Weiss darauf: 7.9:1  (AAA) */
  --deep-dark:#0A4B40;
  --green:#12A37E;           /* nur Flaechen/Grafik – als Text zu hell (3.2:1) */
  --green-ink:#0B7A5E;       /* Textvariante: 5.3:1 auf Weiss */
  --coral:#FF6A3D;           /* Akzentflaeche, Marker, Linien – nicht fuer Text auf Weiss */
  --coral-btn:#CF4718;       /* Weiss darauf: 4.6:1 – fuer Buttons mit weisser Schrift */
  --coral-btn-dark:#B33C13;
  --cyan:#1EA7C5;

  /* Neutral */
  --ink:#0E1B1A;
  --slate:#5B6B68;           /* 5.3:1 auf --paper */
  --slate-dark:#44514F;
  --paper:#F6F9F7;
  --line:#E2E8E5;
  --line-strong:#CBD5D1;
  --white:#fff;

  /* Status */
  --warn-bg:#FFF4E5; --warn-ink:#8A4B00; --warn-line:#F0D3A8;
  --ok-bg:#E8F6F1;  --ok-ink:#0B6B52;

  /* Form */
  --radius:14px; --radius-sm:10px; --radius-xs:8px; --maxw:1140px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:72px;
  --shadow-1:0 1px 2px rgba(13,92,78,.06);
  --shadow-2:0 4px 16px rgba(13,92,78,.10);
  --shadow-3:0 12px 40px rgba(13,92,78,.18);
  --nav-h:68px;

  --font-head:'Space Grotesk',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + 12px)}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;line-height:1.15;color:var(--ink);margin:0 0 .4em;text-wrap:balance}
h1{font-size:clamp(2rem,5vw,3.4rem);letter-spacing:-1.5px}
h2{font-size:clamp(1.5rem,3.5vw,2.2rem);letter-spacing:-1px}
h3{font-size:1.25rem}
p{margin:0 0 1rem}
a{color:var(--deep);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.mono{font-family:var(--font-mono)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.muted{color:var(--slate)}
.center{text-align:center}

/* Sichtbarer Fokus – global, einheitlich, nie entfernt */
:focus-visible{outline:3px solid var(--deep);outline-offset:2px;border-radius:4px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:9999;background:var(--deep);color:#fff;
  padding:12px 18px;border-radius:0 0 var(--radius-sm) 0;font-weight:500}
.skip-link:focus{left:0;text-decoration:none}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);
  font-weight:500;font-size:1rem;padding:13px 22px;border-radius:var(--radius-sm);
  border:1.5px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s;
  min-height:44px;text-align:center}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--coral-btn);color:#fff}
.btn-primary:hover{background:var(--coral-btn-dark);color:#fff}
.btn-dark{background:var(--deep);color:#fff}
.btn-dark:hover{background:var(--deep-dark);color:#fff}
.btn-ghost{background:#fff;border-color:var(--line-strong);color:var(--ink)}
.btn-ghost:hover{border-color:var(--slate);background:var(--paper)}
.btn-sm{padding:8px 14px;font-size:.9rem;min-height:36px}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}

/* Formularelemente */
.field{display:block;font-size:.9rem;font-weight:500;color:var(--ink);margin-bottom:6px}
input[type=text],input[type=search],input[type=email],input[type=number],select,textarea{
  width:100%;padding:11px 13px;font-family:var(--font-body);font-size:1rem;color:var(--ink);
  background:#fff;border:1.5px solid var(--line-strong);border-radius:var(--radius-sm);
  transition:border-color .15s;min-height:44px}
input:hover,select:hover,textarea:hover{border-color:var(--slate)}
input:focus,select:focus,textarea:focus{border-color:var(--deep);outline:none;box-shadow:0 0 0 3px rgba(13,92,78,.15)}
select{appearance:none;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%235B6B68' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:12px;padding-right:38px}
textarea{min-height:120px;resize:vertical}
/* Das versteckte Honigtopf-Feld der Kontaktseite: die Feldregeln oben (Breite 100 %, Mindesthoehe, Innenabstand)
   machten es bildschirmbreit – die Seite liess sich seitlich verschieben. */
input.visually-hidden,textarea.visually-hidden{width:1px;height:1px;min-height:0;padding:0;border:0}

/* Header */
.nav{position:sticky;top:0;z-index:1200;background:rgba(246,249,247,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:1.5rem;letter-spacing:-1px;color:var(--ink);flex-shrink:0}
.brand:hover{text-decoration:none}
.brand-mark{width:32px;height:32px;border-radius:9px}
.nav-links{display:flex;align-items:center;gap:22px}
.nav-links a{color:var(--ink);font-size:.95rem;white-space:nowrap}
.nav-links a.btn-primary{color:#fff}
.nav-links a[aria-current="page"]{color:var(--deep);font-weight:600;box-shadow:inset 0 -2px 0 var(--coral)}
.nav-links a[aria-current="page"]:hover{text-decoration:none}
.nav-toggle{display:none;background:none;border:1.5px solid var(--line-strong);border-radius:var(--radius-xs);
  font-size:1.25rem;line-height:1;color:var(--ink);cursor:pointer;width:44px;height:44px;align-items:center;justify-content:center}
@media(max-width:900px){
  .nav-toggle{display:flex}
  .nav-links{position:absolute;top:var(--nav-h);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--white);border-bottom:1px solid var(--line);padding:8px 24px 16px;display:none;box-shadow:var(--shadow-2)}
  .nav.open .nav-links{display:flex}
  /* Menue darf nie hoeher als der Schirm sein (Querformat: die Rechtslinks lagen unter dem Bildrand, und
     die Kartenseite scrollt mobil nicht) und liegt ueber Dossier- (1280) und Ebenen-Blatt (1300). */
  .nav-links{max-height:calc(100vh - var(--nav-h));max-height:calc(var(--sicht-h,100dvh) - var(--nav-h));overflow-y:auto;overscroll-behavior:contain}
  .nav.open{z-index:1310}
  /* Erstbesuch im Querformat: der Hinweis unten (z-index 2000) laege sonst ueber den Rechtslinks am Menue-Ende */
  body.cc-offen .nav-links{padding-bottom:96px}
  .nav-links a{padding:13px 0;border-bottom:1px solid var(--line)}
  .nav-links a[aria-current="page"]{box-shadow:none;border-left:3px solid var(--coral);padding-left:10px}
  .nav-links a.btn{margin-top:10px;border-bottom:none}
  .nav-links .nav-recht{display:flex;flex-wrap:wrap;gap:4px 18px;padding-top:12px}   /* zwei Klassen: schlaegt die Grundregel weiter unten */
  .nav-links .nav-recht a{padding:6px 0;border-bottom:none;font-size:.85rem;color:var(--slate)}
}

/* Hero */
.hero{padding:64px 0 48px;text-align:center}
.hero .sub{font-size:1.15rem;max-width:680px;margin:0 auto 1.6rem;color:var(--slate)}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}
.searchbar{display:flex;max-width:560px;margin:24px auto 8px;border:1.5px solid var(--line-strong);background:#fff;
  border-radius:12px;overflow:hidden;transition:border-color .15s}
.searchbar:focus-within{border-color:var(--deep);box-shadow:0 0 0 3px rgba(13,92,78,.15)}
.searchbar input{flex:1;border:none;padding:15px 18px;font-size:1rem;font-family:var(--font-body);min-height:52px}
.searchbar input:focus{box-shadow:none;border:none}
.searchbar button{border:none;background:var(--deep);color:#fff;padding:0 22px;cursor:pointer;font-family:var(--font-body);
  font-size:1rem;font-weight:500;min-height:52px}
.searchbar button:hover{background:var(--deep-dark)}
.trust{font-size:.85rem;color:var(--slate);margin-top:10px}
.trust-list{list-style:none;padding:0;margin:14px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 20px;
  font-size:.92rem;color:var(--slate-dark)}
.trust-list li::before{content:"✓";color:var(--deep);font-weight:700;margin-right:6px}

/* Stoerer "kostenlos – ohne Anmeldung": rund neben der Ueberschrift, schmal als
   schraeger Aufkleber darunter. Echter Text (Screenreader, Suche). Weiss auf --coral-btn: 4.6:1. */
.hero .wrap{position:relative;z-index:1}

/* Startseite: Luftbild leicht durchscheinend im Kopf, unten weich ausgeblendet. Drei Groessen,
   damit Handys nicht das grosse Bild laden. */
.hero-bild{position:relative;overflow:hidden}
.hero-bild::before{content:"";position:absolute;left:0;right:0;top:0;height:min(820px,100%);z-index:0;pointer-events:none;
  background:url(/assets/img/home/hero-hintergrund-1920.webp) center 30%/cover no-repeat;opacity:.16;
  -webkit-mask-image:linear-gradient(180deg,#000 50%,transparent);mask-image:linear-gradient(180deg,#000 50%,transparent)}
@media(max-width:1280px){.hero-bild::before{background-image:url(/assets/img/home/hero-hintergrund-1280.webp)}}
@media(max-width:800px){.hero-bild::before{background-image:url(/assets/img/home/hero-hintergrund-800.webp)}}
.hero-bild .sub{color:var(--slate-dark)}   /* --slate fiel ueber dunklen Bildstellen auf 3,8:1 */
.hero-bild .searchbar{margin-bottom:20px}

/* Produktbild: Desktop im Browserrahmen, Handy (eigene Aufnahme) im Telefonrahmen */
.produktbild{max-width:1040px;margin:44px auto 0}
.produktbild .rahmen{position:relative;background:#fff;border:1px solid var(--line-strong);border-radius:14px;overflow:hidden;
  padding-top:28px;box-shadow:0 40px 80px -40px rgba(13,92,78,.45),0 12px 30px -18px rgba(14,27,26,.3)}
.produktbild .rahmen::before{content:"";position:absolute;left:0;right:0;top:0;height:28px;border-bottom:1px solid var(--line);
  background:radial-gradient(circle at 18px 14px,var(--line-strong) 4.5px,transparent 5px),
    radial-gradient(circle at 34px 14px,var(--line-strong) 4.5px,transparent 5px),
    radial-gradient(circle at 50px 14px,var(--line-strong) 4.5px,transparent 5px),#F1F4F2}
.produktbild img{display:block;width:100%;height:auto}
.produktbild figcaption,.bildkarte figcaption,.bildquelle{font-size:.78rem;color:var(--slate);margin-top:10px;line-height:1.45;text-wrap:pretty}
/* Lizenzkuerzel nicht umbrechen; als URL verlinkte Fundstellen duerfen umbrechen (sonst scrollt das Dossier-Blatt seitlich). */
.lizenz{white-space:nowrap}
.lizenz.url{white-space:normal;overflow-wrap:anywhere}
@media(max-width:640px){
  .produktbild{max-width:none;margin-top:32px}
  .produktbild .rahmen{max-width:290px;margin:0 auto;padding-top:0;border:7px solid var(--ink);border-radius:30px}
  .produktbild .rahmen::before{display:none}
}

/* "In drei Schritten" mit Bildern */
.schritte{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:28px;counter-reset:s}
.schritt img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:top left;
  border-radius:var(--radius-sm);border:1px solid var(--line);box-shadow:var(--shadow-2);background:var(--paper);margin-bottom:16px}
.schritt h3{display:flex;align-items:center;gap:10px}
.schritt h3::before{counter-increment:s;content:counter(s);flex:0 0 30px;height:30px;border-radius:50%;background:var(--deep);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:.95rem}
.bildquelle{margin:14px 0 0}
@media(max-width:900px){.schritte{grid-template-columns:1fr;max-width:520px;gap:30px}}
@media(min-width:641px) and (max-width:900px){
  .schritte{max-width:none}
  .schritt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;align-items:center}
  .schritt img{grid-row:1 / span 2;margin:0}
  .schritt h3{align-self:end}
  .schritt p{align-self:start}
}

/* Text und Bild nebeneinander (Datenebenen) */
.split-bild{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:44px;align-items:center}
.bildkarte{margin:0}
.bildkarte img{display:block;width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow-2)}
@media(max-width:900px){.split-bild{grid-template-columns:1fr;gap:20px}}
.stoerer{--st-rot:-12deg;position:absolute;top:0;right:calc(50% - 465px);width:136px;height:136px;margin:0;
  border-radius:50%;background:var(--coral-btn);color:#fff;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:2px;text-align:center;font-family:var(--font-head);line-height:1.05;
  transform:rotate(var(--st-rot));box-shadow:0 12px 26px -10px rgba(179,60,19,.7)}
.stoerer::before{content:"";position:absolute;inset:6px;border:1.5px dashed rgba(255,255,255,.55);border-radius:inherit;pointer-events:none}
.stoerer b{font-size:1.5rem;letter-spacing:-.5px}
.stoerer span{font-size:.8rem;font-weight:600;letter-spacing:.2px}
@media(max-width:1060px){
  .stoerer{--st-rot:-2deg;position:relative;right:auto;width:auto;height:auto;flex-direction:row;flex-wrap:wrap;
    gap:0 .35em;margin:12px auto 22px;width:fit-content;max-width:100%;padding:8px 18px;border-radius:999px;
    box-shadow:0 8px 18px -10px rgba(179,60,19,.7)}
  .stoerer::before{inset:3px}
  .stoerer b,.stoerer span{font-size:1rem}
  .stoerer .st-unten::before{content:"·";margin-right:.35em}
}
@media(max-width:480px){
  .stoerer{padding:7px 14px}
  .stoerer b,.stoerer span{font-size:.9rem}
}
@media(prefers-reduced-motion:no-preference){
  .stoerer{animation:stoerer-rein .55s cubic-bezier(.2,1.5,.45,1) .25s both}
  @keyframes stoerer-rein{from{opacity:0;transform:rotate(calc(var(--st-rot) - 18deg)) scale(.6)}
    to{opacity:1;transform:rotate(var(--st-rot)) scale(1)}}
}

/* Sections */
section{padding:56px 0}
.label{font-family:var(--font-mono);font-size:.8rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--green-ink);margin-bottom:8px}
.grid{display:grid;gap:18px}
.cols-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.cols-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:400px){.cols-4{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.card h3{margin-top:0}
a.card{transition:border-color .15s,box-shadow .15s,transform .15s;display:block}
a.card:hover{border-color:var(--deep);box-shadow:var(--shadow-2);transform:translateY(-2px);text-decoration:none}
.tile-data{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px}
.tile-data b{color:var(--deep)}

/* Steps */
.steps{counter-reset:s}
.step{position:relative;padding-left:52px;margin-bottom:20px}
.step:before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;
  background:var(--deep);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700}

/* FAQ */
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:0;margin-bottom:10px}
.faq summary{font-weight:500;cursor:pointer;font-family:var(--font-head);padding:16px 20px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";font-size:1.4rem;color:var(--deep);line-height:1;flex-shrink:0}
.faq details[open] summary:after{content:"−"}
.faq details[open] summary{border-bottom:1px solid var(--line)}
.faq .faq-body{padding:14px 20px 4px}
.faq .faq-body p:last-child{margin-bottom:14px}

/* CTA band */
.band{background:var(--deep);color:#fff;border-radius:var(--radius);padding:48px 32px;text-align:center}
.band h2{color:#fff}
.band p{color:#CFE7E0}
.band .btn-primary{background:#fff;color:var(--deep)}
.band .btn-primary:hover{background:#E8F6F1;color:var(--deep-dark)}

/* Fliesstext-Artikel */
.article h2{font-size:1.35rem;margin:28px 0 10px}
.article ul{padding-left:20px;margin:0 0 1rem}
.article li{margin:6px 0}
.article a{text-decoration:underline}

/* Tabellen – nie horizontal ueber die Seite hinaus */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:#fff}
.table-scroll table{width:100%;min-width:660px;border-collapse:collapse;font-size:.92rem}
.table-scroll th{text-align:left;padding:12px 14px;border-bottom:2px solid var(--line);
  font-family:var(--font-head);font-size:.85rem;background:var(--paper);position:sticky;top:0}
.table-scroll td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.table-scroll tr:last-child td{border-bottom:none}

/* Cookie-Consent */
.cookie-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:2000;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-3);max-width:680px;margin:0 auto}
.cookie-inner{padding:16px 18px}
.cookie-inner p{font-size:.88rem;color:var(--slate);margin:0 0 12px}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.cookie-actions .btn{padding:9px 16px;font-size:.9rem;min-height:40px}
.cookie-kurz{display:none}
/* Kleine Schirme: nur der Kurztext in einer flachen Leiste – vorher verdeckte der Hinweis bis zu 45 %
   des Bildschirms samt Suchfeld, Dossier und Hauptknopf. Der Langtext steht in der Datenschutzerklaerung. */
@media(max-width:640px),(max-height:480px){
  .cookie-consent{left:8px;right:8px;bottom:8px}
  .cookie-inner{display:flex;align-items:center;gap:10px;padding:10px 12px}
  .cookie-inner p{margin:0;font-size:.82rem;line-height:1.35}
  .cookie-lang{display:none}
  .cookie-kurz{display:inline}
  .cookie-actions{flex:none}
  .cookie-actions .btn{min-height:44px}
}
.nav-recht{display:none}

/* Footer */
footer{background:#fff;border-top:1px solid var(--line);padding:48px 0 28px;margin-top:40px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px;margin-bottom:24px}
.fgrid h4{font-family:var(--font-head);font-size:.95rem;margin:0 0 10px}
.fgrid a{display:block;color:var(--slate);font-size:.9rem;padding:5px 0}
.fgrid a:hover{color:var(--deep)}
.fnote{font-size:.8rem;color:var(--slate);border-top:1px solid var(--line);padding-top:18px}

/* ══════════════════════════════════════════════════════════════════
   KARTEN-APP
   ══════════════════════════════════════════════════════════════════ */
.app{display:grid;grid-template-columns:340px 1fr;height:calc(100vh - var(--nav-h));min-height:520px}
.map-pane{position:relative;min-width:0}
/* Nur in der Karten-App: sonst gewinnt die ID-Regel gegen .pot-map und die
   Potenzialkarte bekaeme Hoehe 0. */
.map-pane #map{height:100%;width:100%;background:#E8EDEB}

/* — Sidebar — */
.sidebar{border-right:1px solid var(--line);background:#fff;display:flex;flex-direction:column;min-height:0}
.sb-top{padding:12px 14px 10px;border-bottom:1px solid var(--line);flex-shrink:0;background:#fff}
.sb-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
.sb-title h2{font-size:1.05rem;margin:0;letter-spacing:-.3px}
.sb-count{font-family:var(--font-mono);font-size:.72rem;color:var(--slate)}
.sb-search{position:relative}
.sb-search input{padding-left:36px;padding-right:36px;min-height:40px;font-size:.9rem}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
.sb-search:before{content:"";position:absolute;left:12px;top:50%;width:15px;height:15px;margin-top:-7px;
  background:no-repeat center/contain url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B68' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");pointer-events:none}
.sb-clear{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:none;
  background:none;color:var(--slate);font-size:1.1rem;cursor:pointer;border-radius:50%;line-height:1;display:none}
.sb-clear:hover{background:var(--paper);color:var(--ink)}
.sb-search.has-value .sb-clear{display:block}

.sb-scroll{overflow-y:auto;overscroll-behavior:contain;padding:10px 14px 28px;flex:1;min-height:0}

/* Aktive Ebenen – einklappbar, eigene Scrollflaeche, damit die Themenliste nie verschwindet */
.sb-active{border-bottom:1px solid var(--line);padding:8px 14px 10px;flex-shrink:0;background:var(--ok-bg);display:none}
.sb-active.on{display:block}
.sb-active-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sb-active-toggle{display:flex;align-items:center;gap:8px;background:none;border:none;padding:6px 2px;cursor:pointer;
  color:var(--ok-ink);font:inherit;min-height:32px}
.sb-active-toggle b{font-family:var(--font-head);font-size:.85rem}
.sb-active-toggle .chev,.lgroup>summary .chev{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);transition:transform .15s;flex-shrink:0;margin-left:2px}
.sb-active.zu .sb-active-toggle .chev{transform:rotate(-45deg)}
.sb-active-clear{background:none;border:none;color:var(--ok-ink);font-size:.78rem;cursor:pointer;
  text-decoration:underline;padding:4px 2px}
#actList{max-height:min(40vh,360px);overflow-y:auto;overscroll-behavior:contain;margin-top:6px;padding-right:2px}
.sb-active.zu #actList{display:none}
.act{background:#fff;border:1px solid #C3E3D8;border-radius:var(--radius-xs);padding:6px 8px 8px;margin-bottom:6px}
.act.aus{background:var(--paper);border-color:var(--line)}
.act-row{display:flex;align-items:center;gap:6px}
.act-name{flex:1;font-size:.82rem;line-height:1.25;min-width:0;overflow-wrap:anywhere;font-weight:600}
.act.aus .act-name{color:var(--slate);font-weight:400}
.act-name small{font-weight:400}
.act-x,.act-eye{border:none;background:none;color:var(--slate);cursor:pointer;line-height:1;width:30px;height:30px;
  border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.act-x{font-size:1.15rem}
.act-eye{color:var(--deep)}
.act.aus .act-eye{color:var(--slate)}
.act-x:hover,.act-eye:hover{background:var(--paper);color:var(--ink)}
.act-op{display:flex;align-items:center;gap:8px;margin-top:4px;padding-left:4px}
.act-hinweis{font-size:.72rem;line-height:1.35;color:var(--slate);margin:4px 0 0;padding-left:4px}
.act-op label{font-size:.74rem;color:var(--slate);flex-shrink:0}
.act-op input[type=range]{flex:1;min-height:0;padding:0;accent-color:var(--deep);height:18px;cursor:pointer;min-width:0}
.act-op output{font-family:var(--font-mono);font-size:.7rem;color:var(--slate);width:40px;text-align:right;flex-shrink:0}
.act.aus .act-op{opacity:.5}
.act-zoom{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;padding:6px 8px;
  background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:6px;font-size:.74rem;color:var(--warn-ink);line-height:1.3}
.act-zoom[hidden]{display:none}
.act-zoom button{border:1px solid var(--warn-line);background:#fff;color:var(--warn-ink);border-radius:20px;
  padding:3px 10px;font-size:.74rem;cursor:pointer;flex-shrink:0;font-family:inherit}
.act-zoom button:hover{background:var(--warn-bg)}
.act-leg{margin-top:4px;padding-left:4px}
.act-leg-btn{background:none;border:none;padding:3px 0;font-size:.74rem;color:var(--slate);cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;font-family:inherit}
.act-leg-btn:before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);transition:transform .15s}
.act-leg-btn[aria-expanded=true]:before{transform:rotate(45deg)}
.act-legend{margin-top:4px;max-width:100%;max-height:220px;overflow:auto}
.act-legend img{max-width:100%;background:#fff;border-radius:4px;display:block}

/* Bereichs-Umschalter (Bundesland) */
.sb-scope{margin-bottom:12px}
.sb-scope-row{display:flex;align-items:center;gap:8px}
.sb-scope label{font-size:.75rem;color:var(--slate);white-space:nowrap}
.sb-scope select{min-height:36px;font-size:.85rem;padding-top:6px;padding-bottom:6px;flex:1;min-width:0}
.sb-scope .hint{font-size:.72rem;color:var(--slate);margin:6px 0 0;line-height:1.35}

/* Zwischentitel + Schnellwahl */
.sb-sub{font-family:var(--font-head);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.7px;
  color:var(--slate);margin:4px 0 7px}
.sb-quick{margin-bottom:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line-strong);background:#fff;color:var(--ink);border-radius:100px;padding:5px 11px;
  font-size:.8rem;cursor:pointer;font-family:inherit;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip:hover{border-color:var(--deep)}
.chip[aria-pressed=true]{background:var(--deep);border-color:var(--deep);color:#fff}
.chip[aria-pressed=true]:before{content:"✓ "}

/* Themen */
.lgroup{border:1px solid var(--line);border-radius:var(--radius-xs);margin-bottom:7px;background:#fff}
.lgroup>summary{display:flex;align-items:center;gap:8px;padding:9px 11px;cursor:pointer;list-style:none;
  font-family:var(--font-head);font-size:.88rem;font-weight:700;border-radius:var(--radius-xs);min-height:42px;color:var(--ink)}
.lgroup>summary::-webkit-details-marker{display:none}
.lgroup>summary:hover{background:var(--paper)}
.lgroup>summary .chev{color:var(--slate);transform:rotate(-45deg)}
.lgroup[open]>summary .chev{transform:rotate(45deg)}
.lgroup>summary .gname{flex:1;min-width:0}
.lgroup>summary .gact{font-family:var(--font-body);font-weight:600;font-size:.68rem;color:var(--ok-ink);background:var(--ok-bg);
  border-radius:20px;padding:2px 7px;flex-shrink:0}
.lgroup>summary .gact[hidden]{display:none}
.lgroup>summary .gcount{font-family:var(--font-mono);font-size:.7rem;color:var(--slate);background:var(--paper);
  border-radius:20px;padding:2px 7px;flex-shrink:0;font-weight:400}
.lgroup[open]{border-color:var(--line-strong)}
.lgroup[open]>summary{border-bottom:1px solid var(--line);border-radius:var(--radius-xs) var(--radius-xs) 0 0}
.lgroup-body{padding:4px 6px 6px}
.lsub{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.6px;color:var(--slate);
  padding:8px 7px 3px}
.lsub:first-child{padding-top:4px}

/* Ebenen-Zeile – kompakt (Quelle/Stand auf Anforderung) */
.layer-item{border-radius:6px}
.layer-item.on{background:var(--ok-bg)}
.li-row{display:flex;align-items:center;gap:4px}
.li-main{display:flex;align-items:center;gap:9px;padding:6px 7px;border-radius:6px;flex:1;min-width:0;
  font-size:.86rem;line-height:1.3;cursor:pointer;min-height:38px}
.li-main:hover{background:var(--paper)}
.layer-item.on .li-main:hover{background:transparent}
.li-main input[type=checkbox]{width:17px;height:17px;flex-shrink:0;accent-color:var(--deep);cursor:pointer;margin:0}
.li-label{flex:1;min-width:0;overflow-wrap:anywhere}
.layer-item.on .li-label{font-weight:600}
.li-zoom{display:block;font-size:.72rem;color:var(--slate);font-weight:400;margin-top:1px}
.li-zoom:empty{display:none}
.layer-item.fern .li-label{color:var(--slate-dark)}
.li-info{border:1px solid transparent;background:none;color:var(--slate);cursor:pointer;flex-shrink:0;width:26px;height:26px;
  border-radius:50%;font-size:.78rem;font-family:var(--font-mono);line-height:1;opacity:.55;transition:opacity .12s}
.layer-item:hover .li-info,.li-info:focus-visible,.li-info[aria-expanded=true]{opacity:1}
.li-info[aria-expanded=true]{border-color:var(--line-strong);background:#fff}
.li-info:hover{background:var(--line);color:var(--ink)}
@media(hover:none){.li-info{opacity:1}}
.li-meta{font-size:.72rem;color:var(--slate);line-height:1.4;padding:0 10px 8px 33px;margin:0}
.sb-empty{color:var(--slate);font-size:.86rem;padding:18px 4px;text-align:center}

/* — Karten-Bedienelemente — */
.map-tools{position:absolute;top:12px;left:52px;right:12px;z-index:900;display:flex;gap:8px;
  align-items:flex-start;pointer-events:none;flex-wrap:wrap}
.map-tools>*{pointer-events:auto}
.map-search{position:relative;flex:1;max-width:380px;min-width:190px}
.map-search input{padding-left:14px;padding-right:44px;min-height:44px;box-shadow:var(--shadow-2);
  border-color:transparent;font-size:.94rem}
.map-search>button{position:absolute;right:4px;top:4px;width:36px;height:36px;border:none;background:var(--deep);
  color:#fff;border-radius:var(--radius-xs);cursor:pointer;display:flex;align-items:center;justify-content:center}
.map-search>button:hover{background:var(--deep-dark)}
.map-suggest{position:absolute;top:calc(100% + 5px);left:0;right:0;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius-sm);box-shadow:var(--shadow-3);overflow:hidden;display:none;max-height:280px;overflow-y:auto}
.map-suggest.on{display:block}
.map-suggest button{display:block;width:100%;text-align:left;border:none;background:none;padding:10px 14px;
  cursor:pointer;font-size:.88rem;font-family:var(--font-body);color:var(--ink);border-bottom:1px solid var(--line)}
.map-suggest button:last-child{border-bottom:none}
.map-suggest button:hover,.map-suggest button:focus-visible{background:var(--paper)}
.map-suggest .ms-note{padding:10px 14px;font-size:.85rem;color:var(--slate)}
.map-suggest .ms-quelle{padding:6px 14px;font-size:.72rem}

.basemap-switch{display:flex;background:#fff;border-radius:var(--radius-sm);box-shadow:var(--shadow-2);overflow:hidden;flex-shrink:0}
.basemap-switch button{border:none;background:none;padding:0 14px;height:44px;cursor:pointer;font-size:.88rem;
  font-family:var(--font-body);color:var(--slate);white-space:nowrap}
.basemap-switch button[aria-pressed="true"]{background:var(--deep);color:#fff;font-weight:500}
.basemap-switch button:not([aria-pressed="true"]):hover{background:var(--paper);color:var(--ink)}
.map-icon-btn{width:44px;height:44px;border:none;background:#fff;border-radius:var(--radius-sm);box-shadow:var(--shadow-2);
  cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--deep);flex-shrink:0}
.map-icon-btn:hover{background:var(--paper)}

/* Onboarding-Hinweis */
.map-hint{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:800;background:var(--ink);
  color:#fff;padding:11px 18px;border-radius:100px;box-shadow:var(--shadow-3);font-size:.9rem;
  display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px)}
.map-hint button{border:none;background:none;color:#fff;opacity:.7;cursor:pointer;font-size:1.1rem;line-height:1;
  padding:2px 4px;flex-shrink:0}
.map-hint button:hover{opacity:1}
.map-hint[hidden]{display:none}
@media(prefers-reduced-motion:no-preference){
  .map-hint{animation:hintIn .4s ease-out}
  @keyframes hintIn{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
}

/* Kachel-Ausfall eines WMS-Dienstes */
.map-warn{position:absolute;left:50%;transform:translateX(-50%);top:66px;z-index:850;background:var(--warn-bg);
  color:var(--warn-ink);border:1px solid var(--warn-line);border-radius:var(--radius-sm);padding:8px 14px;
  font-size:.84rem;box-shadow:var(--shadow-2);max-width:calc(100% - 32px)}
.map-warn[hidden]{display:none}

/* — Dossier — */
.dossier{position:absolute;top:68px;right:12px;width:344px;max-height:calc(100% - 84px);overflow-y:auto;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-3);
  display:none;z-index:950;overscroll-behavior:contain}
.dossier.open{display:block}
.dossier-griff{display:none}
.dossier-head{background:var(--deep);color:#fff;padding:13px 16px;border-radius:var(--radius) var(--radius) 0 0;
  font-weight:500;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;position:sticky;top:0;z-index:2}
.dossier-head span{line-height:1.3;font-size:.95rem;overflow-wrap:anywhere;flex:1 1 0;min-width:0}
/* PDF und Teilen im festen Kopf (karte.php): zweite Zeile unter Titel und Schliessen-Knopf */
.dossier-head{flex-wrap:wrap;row-gap:6px}
.dossier-aktionen{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px}
.dossier-aktionen[hidden]{display:none}
.dossier-aktionen .btn{background:#fff;color:var(--deep);border-color:#fff;padding:5px 12px;min-height:32px;font-size:.82rem;font-weight:600}
.dossier-aktionen .btn:hover{background:var(--ok-bg)}
.dossier-aktionen .btn-hell{background:transparent;color:#fff;border-color:rgba(255,255,255,.65)}
.dossier-aktionen .btn-hell:hover{background:rgba(255,255,255,.14)}
.dossier-aktionen .btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.dossier-aktionen .btn:disabled{opacity:.8;cursor:progress}
.dossier-aktionen .shareout{flex-basis:100%;margin:0;font-size:.74rem;line-height:1.4;overflow-wrap:anywhere;font-weight:400}
.dossier-aktionen .shareout:empty{display:none}
.dossier-aktionen .shareout a{color:#fff;text-decoration:underline;text-underline-offset:2px}
/* Touch: groessere Tippflaechen (der kleinere Zeilenabstand oben gleicht die Hoehe aus) */
@media(pointer:coarse){.dossier-aktionen .btn{min-height:38px}}
.dossier-close{background:none;border:none;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;
  padding:0;opacity:.85;width:30px;height:30px;flex-shrink:0;border-radius:50%}
.dossier-close:hover{opacity:1;background:rgba(255,255,255,.15)}
.dossier-close:focus-visible{outline-color:#fff}
.dossier-body{padding:14px 16px 16px}
.dossier-sec{font-family:var(--font-head);font-weight:700;font-size:.74rem;text-transform:uppercase;
  letter-spacing:.9px;color:var(--green-ink);margin:16px 0 4px}
.dossier-sec:first-child{margin-top:0}
.dnote{background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink);
  border-radius:var(--radius-xs);padding:10px 12px;font-size:.82rem;line-height:1.45;margin:0 0 14px}
.dnote a{color:var(--warn-ink);text-decoration:underline}
.dossier-foot{font-size:.72rem;margin:14px 0 0;line-height:1.45}
/* Huellen fuer Teile, die das Nachladen ersetzt: Abstaende wie ohne Huelle */
.dteil>.dossier-sec:first-child{margin-top:16px}
.dteil:empty+.dossier-sec{margin-top:0}
.drow{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.88rem}
/* Beschriftung hoechstens halbe Zeile: lange Labels ("Heizungsart im 100-m-Feld …") drueckten
   den Wert sonst auf ein Zeichen Breite. Kein min-width:0, sonst ragen lange Woerter in den Wert. */
.drow>span:first-child{color:var(--slate);flex-shrink:0;max-width:50%;overflow-wrap:break-word}
.drow .v{font-family:var(--font-mono);font-weight:500;text-align:right;overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto}
.pill{display:inline-block;font-size:.74rem;padding:3px 9px;border-radius:100px;font-weight:500}
.pill-ok{background:var(--ok-bg);color:var(--ok-ink)}
.pill-warn{background:var(--warn-bg);color:var(--warn-ink)}
.parcel-hint{font-size:.78rem;color:var(--ok-ink);background:var(--ok-bg);border-radius:var(--radius-xs);
  padding:7px 10px;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.parcel-hint button{border:none;background:none;color:var(--ok-ink);font:inherit;text-decoration:underline;
  cursor:pointer;padding:2px 0}
.skeleton{height:12px;background:linear-gradient(90deg,var(--line) 25%,#EDF2F0 50%,var(--line) 75%);
  background-size:200% 100%;border-radius:4px;margin:9px 0}
@media(prefers-reduced-motion:no-preference){
  .skeleton{animation:sk 1.2s infinite}
  @keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}
}

.sb-grip{display:none}
.sb-close{display:none;border:none;background:none;color:var(--slate);font-size:1.5rem;line-height:1;
  cursor:pointer;width:34px;height:34px;border-radius:50%;align-items:center;justify-content:center}
.sb-close:hover{background:var(--paper);color:var(--ink)}

/* Mobiler Ebenen-Umschalter */
.sb-toggle{display:none;position:absolute;left:12px;bottom:12px;z-index:900;align-items:center;gap:8px;
  background:var(--deep);color:#fff;border:none;border-radius:100px;padding:0 18px;height:48px;
  box-shadow:var(--shadow-3);cursor:pointer;font-family:var(--font-body);font-size:.94rem;font-weight:500}
.sb-toggle .badge{background:var(--coral);color:#fff;border-radius:100px;font-size:.72rem;
  padding:1px 7px;font-family:var(--font-mono)}
.sb-backdrop{display:none;position:fixed;inset:0;background:rgba(14,27,26,.45);z-index:1250}
.sb-backdrop.on{display:block}

/* ── Mobil: Karte zuerst, Ebenen als Bottom-Sheet ── */
@media(max-width:900px){
  /* Sichtbare Hoehe per JS (innerHeight): 100vh reicht bei eingeblendeter Adressleiste unter den Rand –
     Quellenvermerk und Ebenen-Knopf laegen dann hinter dem Blatt, das am sichtbaren Rand sitzt. */
  .app{grid-template-columns:1fr;height:calc(100vh - var(--nav-h));height:calc(var(--sicht-h, 100vh) - var(--nav-h));min-height:0}
  .map-pane{grid-row:1;height:100%}
  .sb-toggle{display:flex;bottom:calc(var(--quelle-h, 28px) + 8px)}   /* ueber dem Quellenvermerk (Hoehe per JS) */
  /* Werkzeugleiste ueber die volle Breite in zwei Zeilen (Suche; Karte/Luftbild + Standort);
     Leaflets Zoom-Bedienung rutscht unter beide, sonst liegt sie auf dem Umschalter. */
  .map-tools{left:12px;top:12px}
  .map-search{max-width:none;flex:1 1 100%}
  .map-pane .leaflet-top.leaflet-left{top:112px}
  /* iOS zoomt in die Seite, sobald ein angetipptes Feld unter 16 px Schrift hat – und bleibt gezoomt */
  .map-search input,.sb-search input,.sb-scope select{font-size:16px}
  /* Die Kartenseite selbst scrollt nicht: sonst liess sie sich als Ganzes verschieben, und Suchfeld samt
     Karte/Luftbild verschwanden unter der Kopfzeile. Impressum & Co. stehen dafuer im Menue (nav-recht). */
  body.page-map{overflow:hidden;height:var(--sicht-h, 100vh);overscroll-behavior:none}
  body.page-map footer{display:none}
  .map-warn{top:118px}                       /* unter der zweizeiligen Werkzeugleiste */
  /* Bei offener Trefferliste liegt die Leiste ueber Blatt (1280) und Leaflet-Ecken (1000), unter dem Ebenen-Blatt (1300) */
  .map-tools.suche-offen{z-index:1290}
  .map-suggest{max-height:min(280px, calc(var(--sicht-h, 100vh) - var(--nav-h) - 72px))}

  .sidebar{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:1300;max-height:86vh;height:86vh;
    border-right:none;border-top:1px solid var(--line);border-radius:18px 18px 0 0;box-shadow:var(--shadow-3);
    transform:translateY(101%);transition:transform .25s ease;padding-bottom:env(safe-area-inset-bottom)}
  .sidebar.open{transform:translateY(0)}
  .sb-top{border-radius:18px 18px 0 0;padding-top:8px}
  .sb-grip{display:block;width:40px;height:4px;border-radius:4px;background:var(--line-strong);margin:0 auto 10px}
  .sb-close{display:flex}

  /* Mindesthoehe = eingeklappte Hoehe (px per JS, sonst 38vh): kurzer Inhalt (Laden, Fehler) laesst keine
     Luecke unter dem Quellenvermerk, und Aufklappen macht das Blatt nie kleiner. */
  .dossier{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:var(--blatt-max, 76vh);min-height:var(--blatt-h, 38vh);
    border-radius:18px 18px 0 0;z-index:1280;padding-bottom:env(safe-area-inset-bottom);transition:max-height .25s ease}
  /* Eingeklappt: Kopf und erste Angaben, darueber bleibt die Karte bedienbar (Nachbarflurstuecke) */
  .dossier.klein{max-height:var(--blatt-h, 38vh)}
  .dossier-griff{display:block;position:sticky;top:0;z-index:3;width:100%;height:24px;margin:0;padding:0;border:0;
    background:var(--deep);border-radius:18px 18px 0 0;cursor:pointer;touch-action:none}
  .dossier-griff-strich{display:block;width:44px;height:5px;border-radius:5px;background:rgba(255,255,255,.6);margin:10px auto 0}
  .dossier-griff:focus-visible{outline:3px solid #fff;outline-offset:-4px}
  .dossier-head{border-radius:0;top:24px;padding-top:4px;cursor:pointer;touch-action:none}
  /* Quellenvermerk liegt immer ueber dem Blatt und folgt ihm, der Ebenen-Knopf beim eingeklappten */
  .map-pane .leaflet-bottom{bottom:var(--blatt-ist, 0px)}   /* zwei Klassen: leaflet.css kommt nach flurio.css */
  /* angehoben rechts: links liegen die Zoom-Knoepfe, an die ein mehrzeiliger Quellenvermerk den Knopf sonst schiebt */
  html.blatt-klein .sb-toggle{bottom:calc(var(--blatt-ist, 0px) + var(--quelle-h, 28px) + 8px);left:auto;right:12px}
  .map-hint{bottom:calc(var(--quelle-h, 28px) + 66px)}
}
/* Handy quer (niedrig und breit genug fuer eine Zeile): Werkzeugleiste einzeilig, Ebenen-Knopf rechts
   daneben, Zoom darunter – sonst laege der angehobene Knopf auf Karte/Luftbild und den Zoom-Knoepfen.
   Der Quellenvermerk bleibt rechts der Zoom-Spalte. Gleiche Bedingung wie einzeilig() in app.js. */
@media(max-width:900px) and (max-height:500px) and (min-width:530px){
  .map-tools{right:166px}
  .map-search{flex:1 1 150px;min-width:150px}
  .map-pane .leaflet-top.leaflet-left{top:56px}
  .sb-toggle,html.blatt-klein .sb-toggle{top:12px;bottom:auto;left:auto;right:12px;height:44px}
  .map-hint{bottom:calc(var(--quelle-h, 28px) + 10px)}
  .map-pane .leaflet-control-attribution{max-width:calc(100vw - 60px)}
  .map-warn{top:66px}
  /* PDF und Teilen in der Titelzeile (zwischen Titel und Schliessen): eine eigene Knopfzeile kostete im
     niedrigen Blatt 44 px, dann blieb unter dem Kopf keine Datenzeile. Die Teilen-Rueckmeldung bleibt
     eigene Zeile darunter. Reihenfolge fuer Tastatur/Vorleser unveraendert (DOM). */
  .dossier-head{align-items:center}
  .dossier-aktionen:not([hidden]){display:contents}
  /* max-width: lange Zwischenstaende ("Warte auf eingeblendete Ebenen …") brechen im Knopf um, statt den
     Schliessen-Knopf in eine eigene Zeile zu schieben (der Kopf bricht nach Grundgroesse um, nicht nach Schrumpfen) */
  .dossier-aktionen .btn{order:1;max-width:30%}
  .dossier-close{order:2}
  .dossier-aktionen .shareout{order:3}
}
/* Sehr niedrig (Querformat mit Browserleisten): kein Platz fuer die Zoom-Knoepfe ueber dem Blatt –
   auf Touchgeraeten zoomt man mit zwei Fingern. */
@media(max-width:900px) and (max-height:340px) and (pointer:coarse){
  .map-pane .leaflet-control-zoom{display:none}
}

@media(max-width:1100px) and (min-width:901px){.app{grid-template-columns:300px 1fr}}

/* Potenzialsuche */
.pot-layout{display:grid;grid-template-columns:300px 1fr;gap:18px;margin-top:18px;align-items:start}
.pot-map{height:min(60vh,520px);border-radius:var(--radius);border:1px solid var(--line);background:#E8EDEB}
@media(max-width:900px){
  .pot-layout{grid-template-columns:1fr}
  .pot-filter{order:2}
  .pot-map{height:min(52vh,420px)}
}

/* Ebenen, deren Dienst leere Kacheln deckend weiss liefert: multiplizieren macht Weiss unsichtbar */
.leaflet-layer.kachel-weiss{mix-blend-mode:multiply}

/* Leaflet-Feinschliff */
.leaflet-container{font-family:var(--font-body)}
.leaflet-control-zoom a{color:var(--deep)!important}
.leaflet-control-attribution{font-size:10px;max-width:100vw}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Druck – für den geteilten Standortbericht */
@media print{
  .nav,footer,.cookie-consent,.sidebar,.map-tools,.sb-toggle,.dossier-aktionen,.bericht-aktionen,.skip-link,.dossier-griff{display:none!important}
  /* Karte mit Dossier: A4 ist schmaler als 900px, ohne diese Regeln griffe das mobile Blatt (fest unten,
     begrenzte Hoehe) und vom Dossier kaeme nur ein Ausschnitt aufs Papier. */
  .app{height:auto}
  .map-pane #map{height:420px}
  .map-pane .leaflet-bottom{bottom:0}
  .dossier.open{position:static;max-height:none;min-height:0;overflow:visible;width:auto;box-shadow:none;border-radius:0}
  .dossier-head{position:static;background:none;color:var(--ink);border-bottom:1px solid var(--line)}
  .dossier-close{display:none}
  body{background:#fff}
  section{padding:0}
  .card,.tile-data,.table-scroll{break-inside:avoid}
  a[href^="http"]:after{content:" (" attr(href) ")";font-size:.75em;color:#555}
}