:root{
  --primary:#6587B7;
  --primary-dark:#4F6F9E;
  --accent:#EC7E41;
  --accent-dark:#D4682E;
  --tint:#BDD4E9;
  --tint2:#AFCAD8;
  --heading:#51596E;
  --border2:#D8D4C8;
  --menu-bg:#BDD4E9;
  --menu-text:#3F4557;
  --menu-hover:#BDD4E9;
  --bg:#FAF8F3;
  --surface:#FFFFFF;
  --text:#3F4557;
  --muted:#6F7688;
  --border:#E7E4DB;
  --header-bg:#51596E;
  --header-text:#FAF8F3;
  --footer-bg:#51596E;
  --footer-text:#D8DCE6;
  --free-bg:#e0edd4;
  --busy-bg:#ffb5af;
  --option-bg:#a8c6fe;
  --font-body:'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-display:'Playfair Display', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  --radius:14px;
  --maxw:1200px;
  --readw:68ch;
  --shadow:0 1px 2px rgba(20,30,28,.05),0 8px 24px rgba(20,30,28,.06);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.6}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--primary);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--primary-dark)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:99;background:var(--surface);padding:10px 14px;border-radius:8px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
h1,h2,h3,h4{color:var(--heading)}
h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.15;letter-spacing:-.01em;margin:0 0 .4em}
h1{font-size:clamp(2rem,5vw,3.4rem)}
h2{font-size:clamp(1.5rem,3vw,2.2rem)}
h3{font-size:1.2rem}
.eyebrow{font-family:var(--font-body);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 .6em}
.lead{font-size:1.15rem;color:var(--muted);max-width:var(--readw)}
.muted{color:var(--muted)}
.small{font-size:.86rem}
.right{text-align:right}
.nowrap{white-space:nowrap}

/* Kopf und Fuß */
.site-head{background:var(--header-bg);color:var(--header-text);position:sticky;top:0;z-index:20}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px;flex-wrap:wrap}
.brandmark{color:inherit;text-decoration:none;display:block;padding:12px 0}
.brandmark-name{display:block;font-family:var(--font-display);font-size:1.25rem}
.brandmark-claim{display:block;font-size:.8rem;opacity:.7}
.site-nav{display:flex;gap:22px;flex-wrap:wrap}
.site-nav a{color:inherit;text-decoration:none;font-size:.95rem;opacity:.85;padding:6px 0;border-bottom:2px solid transparent}
.site-nav a:hover{opacity:1;border-bottom-color:var(--accent)}
.site-foot{background:var(--footer-bg);color:var(--footer-text);margin-top:80px;padding:52px 0 22px}
.site-foot a{color:inherit}
.foot-in{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.foot-title{font-family:var(--font-display);color:#fff;margin-bottom:10px}
.foot-note{margin-top:32px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);display:flex;justify-content:space-between;gap:16px;font-size:.82rem;opacity:.8;flex-wrap:wrap}

/* Bausteine */
.section{padding:64px 0}
.section-tight{padding:36px 0}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.pad{padding:24px}
.flash{margin:18px 0;padding:12px 16px;border-radius:10px;border:1px solid var(--border);background:var(--surface)}
.flash-ok{border-left:4px solid var(--primary)}
.flash-err{border-left:4px solid var(--busy-bg)}
.flash-info{border-left:4px solid var(--accent)}
.btn{display:inline-block;border:1px solid var(--primary);background:var(--primary);color:#fff;border-radius:999px;padding:11px 22px;font:inherit;font-size:.95rem;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--primary-dark);border-color:var(--primary-dark);color:#fff}
.btn-ghost{background:transparent;color:var(--primary)}
.btn-ghost:hover{background:var(--primary);color:#fff}
.btn-quiet{background:transparent;border-color:var(--border);color:var(--text)}
.btn-quiet:hover{background:var(--bg);color:var(--text);border-color:var(--muted)}
.btn-danger{background:var(--busy-bg);border-color:var(--busy-bg)}
.btn-sm{padding:6px 14px;font-size:.85rem}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.76rem;background:var(--bg);border:1px solid var(--border);color:var(--muted)}
.badge-ok{background:var(--free-bg);border-color:var(--primary);color:var(--primary-dark)}
.badge-warn{background:#FBF2DC;border-color:var(--option-bg);color:#7A5A00}
.badge-bad{background:#FBE9E8;border-color:var(--busy-bg);color:#8C2F2A}

/* Hero */
.hero{position:relative;background:var(--primary-dark);color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.5}
.hero-in{position:relative;padding:96px 0 72px;max-width:var(--readw)}
.hero h1{color:#fff}
.hero p{color:rgba(255,255,255,.86);font-size:1.15rem}
.hero .btn{margin-top:14px}

/* Apartmentliste */
.aptlist{display:grid;gap:34px}
.apt{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:0;overflow:hidden}
.apt-media{background:var(--bg);min-height:260px}
.apt-media img{width:100%;height:100%;object-fit:cover}
.apt-body{padding:28px}
.apt-facts{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px}
.apt-price{font-family:var(--font-display);font-size:1.5rem;margin-top:6px}
.apt-price small{font-family:var(--font-body);font-size:.8rem;color:var(--muted)}
@media(max-width:820px){.apt{grid-template-columns:1fr}}

/* Belegungsband */
.ribbon{margin:14px 0 6px}
.ribbon-bars{display:flex;gap:1px;height:26px;border-radius:6px;overflow:hidden;background:var(--border)}
.rb{flex:1 1 0;min-width:0}
.rb-free{background:var(--free-bg)}
.rb-busy{background:var(--busy-bg)}
.rb-option{background:var(--option-bg)}
.ribbon-marks{position:relative;height:16px;font-size:.68rem;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.rb-mark{position:absolute;top:2px;transform:translateX(-1px);border-left:1px solid var(--border);padding-left:4px}
.legend{display:flex;gap:16px;font-size:.8rem;color:var(--muted);margin-top:10px;flex-wrap:wrap}
.lg{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;border:1px solid var(--border)}
.lg-free{background:var(--free-bg)}.lg-busy{background:var(--busy-bg)}.lg-option{background:var(--option-bg)}

/* Monatskalender */
.cal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.cal-title{font-family:var(--font-display);font-size:1.05rem;margin-bottom:8px}
.cal-week,.cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-wd{font-size:.7rem;color:var(--muted);text-align:center;padding-bottom:4px}
.cal-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:.8rem;border-radius:6px;background:var(--surface);border:1px solid var(--border)}
.cal-empty{border:0;background:transparent}
.cal-past{color:#B9BFBC;background:transparent;border-color:transparent}
.cal-free{background:var(--free-bg);border-color:var(--free-bg)}
.cal-busy{background:var(--busy-bg);border-color:var(--busy-bg);color:#fff}
.cal-option{background:var(--option-bg);border-color:var(--option-bg);color:#5C4400}

/* Formulare */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.field{display:block;margin-bottom:14px}
.field>span{display:block;font-size:.82rem;color:var(--muted);margin-bottom:5px}
.field .hint{font-size:.78rem;color:var(--muted);margin-top:4px}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],input[type=url],input[type=password],select,textarea{
  width:100%;padding:10px 12px;font:inherit;font-size:.95rem;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:9px}
textarea{min-height:110px;resize:vertical}
input[type=color]{width:56px;height:36px;padding:2px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.check{display:flex;gap:9px;align-items:flex-start;margin:8px 0;font-size:.92rem}
.check input{margin-top:4px}
fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin:0 0 22px}
legend{font-family:var(--font-display);padding:0 8px}

/* Tabellen */
table.data{width:100%;border-collapse:collapse;font-size:.92rem}
table.data th,table.data td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--border);vertical-align:top}
table.data th{font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
table.data tr:hover td{background:var(--bg)}
table.data td.num,table.data th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}

/* Verwaltung */
body.admin{background:var(--bg)}
.admin-head{background:var(--header-bg);color:var(--header-text)}
.admin-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:62px;flex-wrap:wrap}
.admin-head a{color:inherit;text-decoration:none}
.admin-nav{display:flex;gap:18px;flex-wrap:wrap;font-size:.92rem}
.admin-nav a{opacity:.82;padding:4px 0;border-bottom:2px solid transparent}
.admin-nav a:hover,.admin-nav a.on{opacity:1;border-bottom-color:var(--accent)}
.admin-main{padding:30px 0 70px}
.admin-title{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:24px}
.tabs a{padding:9px 15px;text-decoration:none;color:var(--muted);border:1px solid transparent;border-bottom:0;border-radius:9px 9px 0 0;font-size:.92rem}
.tabs a.on{background:var(--surface);border-color:var(--border);color:var(--text);margin-bottom:-1px}
.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:26px}
.stat .card{padding:16px}
.stat b{display:block;font-family:var(--font-display);font-size:1.8rem;line-height:1.1}
.stat span{font-size:.8rem;color:var(--muted)}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:18px}
.split{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px;align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr}}
.login-page{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:24px}
.login-card{width:100%;max-width:420px}

/* Rechnungsdruck */
@media print{
  .site-head,.site-foot,.admin-head,.actions,.no-print{display:none!important}
  body{background:#fff;font-size:12pt}
  .page-break{page-break-before:always}
  .card{box-shadow:none;border:0}

  /* Safari erzeugt beim Speichern als PDF eine weiße Seite, wenn im Dokument
     haftende Elemente, Weichzeichner oder Verwandlungen vorkommen — auch wenn
     die Druckvorschau noch richtig aussieht. Deshalb hier alles davon aus. */
  *,*::before,*::after{
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    filter:none!important;box-shadow:none!important;text-shadow:none!important;
    transform:none!important;transition:none!important;animation:none!important;
    opacity:1!important;mix-blend-mode:normal!important;will-change:auto!important}
  [style*="position:sticky"],[style*="position: sticky"]{position:static!important}
  .prod-bar,.ask-card,.plist-head,.site-head{position:static!important}
  html,body{overflow:visible!important;height:auto!important}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}


/* ============================================================ Startseite
   Aufbau nach dem Prototyp: Hero, Apartmentblöcke mit Galerie und
   Belegungsband, Vorteile, Anfrage, Fragen, Lage.                        */

.eyebrow-line{display:inline-flex;align-items:center;gap:10px;color:var(--primary-dark);font-weight:600}
.eyebrow-line::before{content:'';width:26px;height:2px;background:var(--primary)}

.lang-switch{display:inline-flex;border:1px solid var(--border2);border-radius:999px;overflow:hidden}
.lang-switch a{padding:6px 13px;font-size:.8rem;font-weight:600;color:var(--muted);text-decoration:none}
.lang-switch a.on{background:var(--primary);color:#fff}

/* Hero */
.hero-home{padding:56px 0 40px}
.hero-home .grid{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
.hero-home h1{margin-bottom:18px}
.hero-home h1 .hl{color:var(--primary-dark)}
.hero-home .lead{font-size:1.2rem;margin-bottom:28px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
.hero-trust{display:flex;gap:26px;flex-wrap:wrap}
.hero-trust div{display:flex;flex-direction:column}
.hero-trust b{font-family:var(--font-display);font-size:1.6rem;color:var(--primary-dark)}
.hero-trust span{font-size:.84rem;color:var(--muted)}
.hero-photo{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:5/6;background:var(--tint);
  box-shadow:0 26px 60px -24px rgba(79,111,158,.45)}
.hero-photo svg,.hero-photo img{width:100%;height:100%;object-fit:cover}
.photo-tag{position:absolute;left:16px;bottom:16px;background:rgba(255,255,255,.93);padding:10px 15px;
  border-radius:12px;font-size:.86rem;font-weight:600;color:var(--primary-dark);display:flex;align-items:center;gap:8px}

/* Apartmentblock */
.apt-block{padding:80px 0;border-top:1px solid var(--border)}
.apt-block:nth-of-type(even){background:var(--surface)}
.apt-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;flex-wrap:wrap}
.apt-idx{font-family:var(--font-display);font-size:.9rem;color:var(--muted);font-weight:600;letter-spacing:.06em;margin-bottom:6px}
.apt-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.badge-soft{font-size:.78rem;font-weight:600;padding:6px 12px;border-radius:999px;background:var(--tint);color:var(--primary-dark)}
.badge-soft.solid{background:var(--primary);color:#fff}
.apt-cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.apt-price{font-size:.9rem;color:var(--muted);font-weight:500}

.apt-media{display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:420px;margin-bottom:18px}
.media-cell{border-radius:14px;overflow:hidden;position:relative;background:var(--tint);cursor:pointer;border:0;padding:0;display:block;width:100%}
.media-cell svg,.media-cell img{width:100%;height:100%;object-fit:cover}
.media-cell.big{grid-row:1/3}
.media-cell .veil{position:absolute;inset:0;background:rgba(63,69,87,.16);opacity:0;transition:.2s;
  display:flex;align-items:center;justify-content:center}
.media-cell:hover .veil,.media-cell:focus-visible .veil{opacity:1}
.media-cell .veil span{background:rgba(255,255,255,.95);border-radius:999px;padding:8px 14px;font-size:.8rem;font-weight:600;color:var(--heading)}
.play-veil{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(63,69,87,.3)}
.play-veil .circle{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center}
.play-veil .circle::after{content:'';border-left:17px solid var(--accent);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
.cell-label{position:absolute;left:12px;bottom:12px;background:rgba(30,33,44,.6);color:#fff;font-size:.74rem;
  font-weight:600;padding:5px 11px;border-radius:8px;display:flex;gap:6px;align-items:center}
.cell-count{position:absolute;right:12px;bottom:12px;background:rgba(30,33,44,.55);color:#fff;font-size:.76rem;
  font-weight:600;padding:5px 11px;border-radius:8px}

.apt-detail{display:grid;grid-template-columns:1.3fr 1fr;gap:44px;margin-top:32px}
.apt-desc p{color:var(--muted);margin:0 0 16px}
.apt-desc p:first-of-type{color:var(--text);font-size:1.06rem}
.spec-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:24px 26px}
.apt-block:nth-of-type(even) .spec-card{background:#F7F5EF}
.spec-card h4{font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--primary-dark);margin:0 0 14px}
.spec-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.spec-list li{display:flex;gap:11px;font-size:.94rem;line-height:1.45}
.spec-list li::before{content:'';flex-shrink:0;width:7px;height:7px;border-radius:50%;background:var(--primary);margin-top:8px}

/* Vorteile */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.why-card{border:1px solid var(--border);border-radius:var(--radius);padding:26px;background:var(--bg)}
.why-card .ic{width:44px;height:44px;border-radius:12px;background:var(--tint);display:flex;align-items:center;
  justify-content:center;font-size:1.3rem;margin-bottom:14px}
.why-card h4{font-family:var(--font-body);font-size:1.02rem;font-weight:700;margin:0 0 6px;color:var(--text)}
.why-card p{font-size:.92rem;color:var(--muted);margin:0}

/* Fragen */
.faq-tabs{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.faq-tab{border:1px solid var(--border2);background:var(--bg);border-radius:999px;padding:10px 19px;
  font:inherit;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer}
.faq-tab.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.faq-list{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface)}
.faq-group{display:none}.faq-group.on{display:block}
.qa{border-bottom:1px solid var(--border)}.qa:last-child{border-bottom:none}
.qa>summary{padding:20px 22px;font-size:1rem;font-weight:600;cursor:pointer;color:var(--heading);
  display:flex;justify-content:space-between;gap:16px;list-style:none}
.qa>summary::-webkit-details-marker{display:none}
.qa>summary::after{content:'+';color:var(--primary);font-size:1.3rem;line-height:1;flex-shrink:0}
.qa[open]>summary::after{content:'\2013'}
.qa .a{padding:0 22px 20px;color:var(--muted);font-size:.95rem}

/* Lage */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.loc-map{border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);aspect-ratio:4/3;background:var(--tint)}
.loc-map iframe{width:100%;height:100%;border:0}
.loc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.loc-list li{display:flex;gap:14px;align-items:flex-start}
.loc-list .ic{width:40px;height:40px;border-radius:10px;background:var(--tint);display:flex;align-items:center;
  justify-content:center;flex-shrink:0;font-size:1.1rem}
.loc-list b{display:block;font-size:1rem}
.loc-list span{font-size:.9rem;color:var(--muted)}

/* Lichtkasten */
.lightbox{position:fixed;inset:0;background:rgba(30,33,44,.93);z-index:100;display:none;
  align-items:center;justify-content:center;padding:36px}
.lightbox.on{display:flex}
.lightbox .inner{max-width:920px;width:100%}
.lightbox .stage{border-radius:16px;overflow:hidden;background:#000;aspect-ratio:4/3}
.lightbox .stage svg,.lightbox .stage img,.lightbox .stage video{width:100%;height:100%;object-fit:contain}
.lightbox .cap{color:#fff;text-align:center;margin-top:14px;font-size:.94rem;display:flex;
  align-items:center;justify-content:center;gap:16px}
.lightbox .cap button{background:rgba(255,255,255,.14);border:none;color:#fff;width:42px;height:42px;
  border-radius:50%;font-size:1.2rem;cursor:pointer}
.lightbox .close{position:absolute;top:20px;right:24px;background:none;border:none;color:#fff;
  font-size:2rem;cursor:pointer;line-height:1}

/* Logo */
.logo-svg{height:30px;width:auto;display:block}
.brandmark-row{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.brandmark-row .bar{width:1px;height:24px;background:var(--border2)}
.brandmark-row .sub{font-family:var(--font-display);font-size:1.05rem;color:var(--primary-dark);font-weight:600}
.site-foot .logo-svg path{fill:#fff!important}

@media(max-width:900px){
  .hero-home .grid,.apt-detail,.loc-grid{grid-template-columns:1fr}
  .hero-photo{order:-1;aspect-ratio:4/3}
  .apt-media{grid-template-columns:1fr 1fr;height:330px}
  .media-cell.big{grid-row:auto;grid-column:1/3}
  .why-grid{grid-template-columns:1fr}
  .apt-block{padding:56px 0}
  .brandmark-row .sub,.brandmark-row .bar{display:none}
}
@media print{.lightbox,.lang-switch,.hero-actions{display:none!important}}

/* Bausteine, die die Startseite zusätzlich braucht */
section{padding:76px 0}
.section-alt{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.section-head{max-width:660px;margin-bottom:44px}
.section-head h2{margin-bottom:12px}
.section-head .lead{margin:0}
.btn-lg{padding:15px 28px;font-size:1rem}
.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-accent:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.row2{grid-template-columns:1fr}}
.ribbon-block{margin:22px 0 6px}
.head-right{display:flex;align-items:center;gap:14px}
.site-head .site-nav a{color:inherit;text-decoration:none;font-size:.95rem;font-weight:500}
.site-head .site-nav a:hover{color:var(--primary-dark)}
.site-head{border-bottom:1px solid var(--border);backdrop-filter:blur(8px)}
@media(max-width:900px){.site-nav{display:none}section{padding:52px 0}}

/* ==================================================== Mini-Editor & Listen
   Nur im Verwaltungsbereich sichtbar.                                     */

.mini-editor{border:1px solid var(--border2);border-radius:10px;overflow:hidden;background:#fff}
.mini-editor-bar{display:flex;gap:2px;flex-wrap:wrap;padding:5px 6px;background:var(--bg);border-bottom:1px solid var(--border)}
.mini-editor-btn{min-width:30px;height:28px;border:1px solid transparent;background:transparent;border-radius:6px;
  cursor:pointer;font:inherit;font-size:.86rem;line-height:1;color:var(--text);padding:0 7px}
.mini-editor-btn:hover{background:var(--tint);border-color:var(--border2)}
.mini-editor-area{min-height:88px;max-height:340px;overflow-y:auto;padding:11px 13px;font-size:.95rem;line-height:1.55;outline:none}
.mini-editor-area:focus{box-shadow:inset 0 0 0 2px var(--tint)}
.mini-editor-area p{margin:0 0 .6em}
.mini-editor-area p:last-child{margin-bottom:0}
.mini-editor-area ul,.mini-editor-area ol{margin:0 0 .6em 1.2em;padding:0}
.mini-editor-area a{color:var(--primary-dark);text-decoration:underline}
.mini-editor-hint{padding:6px 12px;background:var(--bg);border-top:1px solid var(--border);
  font-size:.76rem;color:var(--muted)}

.rep{margin:6px 0 4px}
.rep-rows{display:flex;flex-direction:column;gap:12px}
.rep-row{border:1px solid var(--border);border-radius:12px;background:var(--bg);padding:12px 14px}
.rep-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.rep-num{font-family:var(--font-display);font-weight:600;color:var(--muted);font-size:.92rem}
.rep-move{display:flex;gap:3px}
.rep-btn{width:28px;height:28px;border:1px solid var(--border2);background:#fff;border-radius:6px;
  cursor:pointer;font:inherit;font-size:.85rem;line-height:1;color:var(--muted)}
.rep-btn:hover{background:var(--tint);color:var(--primary-dark)}
.rep-btn.rep-del:hover{background:#FBE9E7;color:#B3261E;border-color:#E8C4BE}
.rep-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 14px}
.rep-field{display:flex;flex-direction:column;gap:4px;margin:0}
.rep-field>span{font-size:.76rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.rep-field.rep-full{grid-column:1/-1}
.rep-field input,.rep-field textarea,.rep-field select{width:100%}
.rep-empty{padding:14px;border:1px dashed var(--border2);border-radius:10px;text-align:center}
@media(max-width:700px){.rep-fields{grid-template-columns:1fr}}

/* Redaktioneller Text aus dem Editor */
.rich p{margin:0 0 .7em}
.rich p:last-child{margin-bottom:0}
.rich ul,.rich ol{margin:.2em 0 .7em 1.15em;padding:0}
.rich li{margin-bottom:.25em}
.rich a{color:var(--primary-dark);text-decoration:underline;text-underline-offset:2px}
.rich a:hover{text-decoration-thickness:2px}
.why-card .rich{font-size:.92rem;color:var(--muted)}
.loc-list .rich{font-size:.9rem;color:var(--muted)}
.faq-list .rich{font-size:.95rem;color:var(--muted)}
.site-foot .foot-small,.site-foot .foot-small .rich{font-size:.82rem;line-height:1.75}
.site-foot .rich a{color:inherit}

/* ============================================== Preisliste (Leistungen)
   Kompakte Liste: eine Zeile je Leistung, kleine Schrift, feste Spalten.
   Alles Seltene liegt in einer aufklappbaren zweiten Zeile.            */

.plist{font-size:.84rem;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--surface)}

.plist-head,.plist-row{display:grid;align-items:center;
  grid-template-columns:26px minmax(160px,1fr) 96px 92px 56px 74px 82px 46px 34px;gap:8px;
  padding:0 12px}
.plist-head{height:34px;background:var(--bg);border-bottom:1px solid var(--border);
  font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.plist-head .r{text-align:right}
.plist-head .c{text-align:center}

.plist-group{display:flex;align-items:baseline;gap:10px;padding:9px 12px;
  background:var(--tint);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.plist-group span{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--primary-dark)}
.plist-group em{font-style:normal;font-size:.74rem;color:var(--muted)}

.plist-row{height:38px;border-bottom:1px solid var(--border)}
.plist-row:nth-of-type(even){background:rgba(0,0,0,.012)}
.plist-row:hover{background:var(--tint)}
.plist-row.off{opacity:.5}
.plist-row .r{text-align:right}
.plist-row .c{text-align:center}

.plist input[type=text],.plist input[type=number],.plist select{
  width:100%;height:27px;padding:2px 7px;font-size:.84rem;border:1px solid transparent;
  background:transparent;border-radius:5px;color:var(--text)}
.plist input:hover,.plist select:hover{border-color:var(--border2);background:#fff}
.plist input:focus,.plist select:focus{border-color:var(--primary);background:#fff;outline:none;
  box-shadow:0 0 0 2px var(--tint)}
.plist input:disabled,.plist input[readonly]{color:var(--muted);cursor:not-allowed}
.plist .r input,.plist .pl-price input{text-align:right}

.pl-name{display:flex;align-items:center;gap:5px;min-width:0}
.pl-name input{font-weight:600}
.pl-tag{flex-shrink:0;font-style:normal;font-size:.66rem;font-weight:700;letter-spacing:.02em;
  background:var(--tint);color:var(--primary-dark);border-radius:4px;padding:2px 5px}
.pl-price input{font-weight:700}
.pl-price input.warn{border-color:#E0A47A;background:#FFF7F0;color:#A85B18}

.pl-pn{display:flex;gap:3px;justify-content:center}
.pl-pn label{display:inline-flex;align-items:center;gap:2px;margin:0;cursor:pointer;
  font-size:.68rem;color:var(--muted);border:1px solid transparent;border-radius:4px;padding:1px 3px}
.pl-pn label:hover{border-color:var(--border2);background:#fff}
.pl-pn input{width:auto;height:auto;margin:0}
.pl-pn b{font-weight:700}

.pl-more{width:22px;height:22px;border:1px solid transparent;background:transparent;border-radius:5px;
  cursor:pointer;color:var(--muted);font-size:.72rem;line-height:1;padding:0}
.pl-more:hover,.pl-more.on{background:var(--tint);color:var(--primary-dark);border-color:var(--border2)}
.pl-del{width:24px;height:24px;border:1px solid transparent;background:transparent;border-radius:5px;
  cursor:pointer;color:var(--muted);font-size:1rem;line-height:1;padding:0}
.pl-del:hover{background:#FBE9E7;color:#B3261E;border-color:#E8C4BE}

.plist-detail{display:grid;grid-template-columns:repeat(4,1fr);gap:9px 14px;
  padding:11px 12px 13px 46px;background:var(--bg);border-bottom:1px solid var(--border)}
.plist-detail label{display:flex;flex-direction:column;gap:3px;margin:0}
.plist-detail label>span{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.plist-detail label>span em{font-style:normal;font-weight:400;text-transform:none;letter-spacing:0}
.plist-detail input,.plist-detail select{border-color:var(--border2)!important;background:#fff!important;text-align:left!important}
.plist-detail .wide{grid-column:span 2}
.plist-detail p.wide{grid-column:1/-1}

.hint-box{border:1px solid var(--border);border-radius:10px;background:var(--surface);
  margin-bottom:16px;font-size:.84rem;max-width:78ch}
.hint-box>summary{padding:9px 14px;cursor:pointer;font-weight:600;color:var(--primary-dark);font-size:.84rem}
.hint-box>p{margin:0;padding:0 14px 11px;color:var(--muted)}
.hint-box>p:last-child{padding-bottom:13px}

.prod-bar{position:sticky;bottom:0;background:rgba(250,248,243,.96);backdrop-filter:blur(8px);
  border-top:1px solid var(--border);margin-top:18px;padding:12px 0;display:flex;gap:9px;flex-wrap:wrap;z-index:20}

@media(max-width:1080px){
  .plist{font-size:.8rem}
  .plist-head,.plist-row{grid-template-columns:24px minmax(120px,1fr) 84px 74px 48px 62px 74px 40px 30px;gap:6px;padding:0 8px}
  .plist-detail{grid-template-columns:repeat(2,1fr);padding-left:34px}
}
@media(max-width:760px){
  /* Auf schmalen Geräten bekommt jede Leistung zwei Reihen. */
  .plist-head{display:none}
  .plist-row{grid-template-columns:24px 1fr 74px 40px 30px;grid-template-areas:'m n p a d' 'm u v q .';
    height:auto;padding:8px;row-gap:5px}
  .plist-row>.pl-more{grid-area:m;align-self:start}
  .plist-row>.pl-name{grid-area:n}
  .plist-row>.pl-price{grid-area:p}
  .plist-row>span:nth-of-type(3){grid-area:u}
  .plist-row>span:nth-of-type(4){grid-area:v}
  .plist-row>span:nth-of-type(5){grid-area:q}
  .plist-row>.pl-pn{grid-area:.;display:none}
  .plist-row>span:nth-last-of-type(2){grid-area:a}
  .plist-row>span:last-of-type{grid-area:d}
  .plist input{border-color:var(--border2);background:#fff}
  .plist-detail{grid-template-columns:1fr;padding-left:8px}
}

/* Bildverwaltung */
.img-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.img-card{display:grid;grid-template-columns:140px 1fr;gap:14px;border:1px solid var(--border);
  border-radius:12px;background:var(--bg);padding:10px;align-items:start}
.img-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;display:block}
.img-fields{display:flex;flex-direction:column;gap:7px}
.img-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.img-num{font-size:.76rem;font-weight:700;color:var(--primary-dark);text-transform:uppercase;letter-spacing:.04em}
@media(max-width:600px){.img-card{grid-template-columns:1fr}}

/* ============================================== Aufforderung am Seitenende */
.cta-band{background:linear-gradient(135deg,var(--primary-dark),var(--primary));color:#fff;padding:56px 0;
  border-top:1px solid var(--border)}
.cta-in{display:grid;grid-template-columns:1.5fr auto;gap:36px;align-items:center}
.cta-band h2{color:#fff;font-size:1.9rem;margin:0 0 10px}
.cta-band .eyebrow{color:rgba(255,255,255,.85)}
.cta-band .eyebrow-line::before{background:var(--accent)}
.cta-lead{color:rgba(255,255,255,.9);max-width:56ch}
.cta-lead a{color:#fff}
.cta-action{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.cta-phone{color:rgba(255,255,255,.9);font-size:.95rem;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4)}
.cta-phone:hover{color:#fff}
@media(max-width:820px){.cta-in{grid-template-columns:1fr;gap:22px}.cta-band h2{font-size:1.5rem}.cta-band{padding:40px 0}}

/* ====================================== Apartment-Vorschau auf der Startseite */
.apt-preview{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:start}
.apt-pv-media{display:grid;grid-template-columns:2.1fr 1fr;gap:10px;height:340px}
.pv-main,.pv-thumb{position:relative;border-radius:14px;overflow:hidden;background:var(--tint);display:block}
.pv-main img,.pv-thumb img,.pv-main svg,.pv-thumb svg{width:100%;height:100%;object-fit:cover;display:block}
.pv-side{display:grid;grid-template-rows:1fr 1fr;gap:10px}
.apt-pv-body h2{font-size:1.7rem;margin:0 0 4px}
.apt-pv-body h2 a{color:inherit;text-decoration:none}
.apt-pv-body h2 a:hover{color:var(--primary-dark)}
.apt-pv-sub{margin:0 0 10px}
.apt-pv-text{margin:14px 0 4px;color:var(--muted)}
@media(max-width:900px){
  .apt-preview{grid-template-columns:1fr;gap:24px}
  .apt-pv-media{height:250px}
}

/* ====================================================== Apartment-Seite */
.apt-top{padding:34px 0 22px}
.crumbs{font-size:.84rem;color:var(--muted);margin-bottom:16px;display:flex;gap:8px}
.crumbs a{color:var(--primary-dark);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.apt-title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.apt-title-row h1{font-size:2.4rem;margin:0 0 8px}
.apt-title-row .lead{margin:0}
.apt-title-row .apt-badges{margin:0;max-width:46ch;justify-content:flex-end}

.gal-wrap{padding:0 0 8px}
.gallery{display:grid;gap:10px;height:440px;
  grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr}
.gallery .gal-main{grid-column:1;grid-row:1/3}
.gallery.has-video .gal-video{grid-column:2/4;grid-row:1}
.gallery:not(.has-video) .gal-main{grid-column:1/2}
.gal-main,.gal-video,.gal-thumb{position:relative;border:0;padding:0;border-radius:16px;overflow:hidden;
  background:var(--tint);cursor:pointer;display:block;width:100%;height:100%}
.gal-main img,.gal-video img,.gal-thumb img,.gal-main svg,.gal-video svg,.gal-thumb svg,.gal-fill{width:100%;height:100%;object-fit:cover;display:block}
.gal-fill{display:block}
.gal-main:hover .veil,.gal-thumb:hover .veil,.gal-main:focus-visible .veil,.gal-thumb:focus-visible .veil{opacity:1}
.gal-video .play-veil{background:rgba(63,69,87,.34)}
.gal-video:hover .play-veil{background:rgba(63,69,87,.2)}
@media(max-width:900px){
  .gallery{grid-template-columns:1fr 1fr;grid-template-rows:200px 130px;height:auto}
  .gallery .gal-main{grid-column:1/3;grid-row:1}
  .gallery.has-video .gal-video{grid-column:1/3;grid-row:2}
  .gallery.has-video .gal-thumb{display:none}
  .apt-title-row h1{font-size:1.8rem}
  .apt-title-row .apt-badges{justify-content:flex-start}
}

.apt-main{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;padding:44px 0;align-items:start}
.apt-desc-full{font-size:1.06rem}
.h-sub{font-size:1.25rem;margin:32px 0 14px}
.feat-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}
.feat-grid li{display:flex;gap:10px;font-size:.97rem;line-height:1.45}
.feat-grid li::before{content:'';flex-shrink:0;width:7px;height:7px;border-radius:50%;background:var(--primary);margin-top:8px}

.ask-card{position:sticky;top:86px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:24px 26px;box-shadow:0 12px 32px -22px rgba(79,111,158,.4)}
.ask-price{font-family:var(--font-display);font-size:1.5rem;color:var(--heading);margin:0 0 6px;font-weight:600}
.ask-price span{font-family:var(--font-body);font-size:.9rem;font-weight:400;color:var(--muted)}
.ask-card .btn{margin:16px 0 4px}
.ask-facts{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;margin:18px 0 0;padding-top:16px;
  border-top:1px solid var(--border);font-size:.88rem}
.ask-facts dt{color:var(--muted)}
.ask-facts dd{margin:0;text-align:right}
@media(max-width:900px){
  .apt-main{grid-template-columns:1fr;gap:28px;padding:30px 0}
  .ask-card{position:static}
  .feat-grid{grid-template-columns:1fr}
}

.cal-wide{width:100%}
.cal-wide .cal-grid{grid-template-columns:repeat(4,1fr);gap:22px}
@media(max-width:1100px){.cal-wide .cal-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.cal-wide .cal-grid{grid-template-columns:1fr}}

.other-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.other-card{display:block;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  background:var(--surface);text-decoration:none;color:inherit;transition:transform .16s,box-shadow .16s}
.other-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px -20px rgba(79,111,158,.5)}
.other-img{display:block;aspect-ratio:16/10;background:var(--tint);overflow:hidden}
.other-img img,.other-img svg{width:100%;height:100%;object-fit:cover;display:block}
.other-body{display:block;padding:15px 17px}
.other-body b{display:block;font-family:var(--font-display);font-size:1.05rem;color:var(--heading);margin-bottom:4px}
.other-body em{font-style:normal;font-size:.88rem;color:var(--muted)}

/* Ausklappmenü der Apartments */
.nav-drop{position:relative;display:inline-block}
.nav-drop>a .chev{font-size:.7em;opacity:.7}
.nav-menu{position:absolute;top:100%;left:-14px;min-width:230px;background:var(--menu-bg);
  border:1px solid var(--border);border-radius:12px;padding:7px;display:none;flex-direction:column;
  box-shadow:0 16px 34px -18px rgba(63,69,87,.4);z-index:70}
.nav-menu a{color:var(--menu-text)}
.nav-menu a:hover{background:var(--menu-hover);color:var(--primary-dark)}
.nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu{display:flex}
.nav-menu a{padding:9px 12px;border-radius:8px;font-size:.93rem;white-space:nowrap}
.nav-menu a:hover{background:var(--tint);color:var(--primary-dark)}
.nav-menu-all{border-top:1px solid var(--border);margin-top:4px;padding-top:11px!important;
  font-size:.86rem!important;color:var(--muted)}
.it-group{font-size:.8rem;padding:3px 6px;height:28px}
.char-count{display:block;font-size:.72rem;color:var(--muted);text-align:right;margin-top:2px}
.char-count.near{color:#B0651E}
.char-count.over{color:#B3261E;font-weight:700}


/* Kopfzeile: alle Links auf einer Linie, größeres Logo ohne Schriftzug */
.site-head .head-in{align-items:center}
.site-nav{display:flex;align-items:center;gap:26px}
.site-nav>a,.nav-drop>a{display:inline-flex;align-items:center;line-height:1.2;padding:6px 0}
.nav-drop{display:inline-flex;align-items:center}
.brandmark-row{align-items:center}
.logo-img{width:auto;display:block;object-fit:contain}
.logo-header{max-height:64px}
.logo-footer{max-height:56px}
.site-head .logo-svg{height:50px}
.site-foot .logo-svg{height:34px}
.foot-logo{margin-bottom:12px}

/* Fußzeile: drei Spalten, rechtliche Verweise unter der Trennlinie */
.site-foot .foot-in{grid-template-columns:1.4fr 1fr 1fr}
.foot-note{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:.78rem}
.foot-copy{opacity:.8}
.foot-legal{display:flex;gap:16px;align-items:center;font-size:.78rem}
.foot-legal a{opacity:.85}
.foot-legal a:hover{opacity:1}
@media(max-width:820px){
  .site-foot .foot-in{grid-template-columns:1fr 1fr}
  .foot-note{flex-direction:column;align-items:flex-start;gap:8px}
}
@media(max-width:560px){.site-foot .foot-in{grid-template-columns:1fr}}
.apt-code{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.03em;
  background:var(--tint);color:var(--primary-dark);border-radius:5px;padding:2px 6px;margin-right:5px}

/* ================================================== Auswertung (Controlling) */
.rep-h{font-size:1.15rem;margin:26px 0 14px;padding-bottom:8px;border-bottom:2px solid var(--primary)}
.rep-h span{font-weight:400;color:var(--muted);font-size:.9rem;margin-left:8px}
.rep-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:18px}
.rep-box{border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:14px 16px}
.rep-box.rep-accent{background:var(--tint);border-color:var(--primary)}
.rep-lbl{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.rep-val{font-family:var(--font-display);font-size:1.6rem;font-weight:600;color:var(--heading);line-height:1.2;margin:4px 0 2px}
.rep-accent .rep-val{color:var(--primary-dark)}
.rep-sub{font-size:.76rem;color:var(--muted)}
.filters{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
@media print{.rep-box{break-inside:avoid}.filters{display:none}details{display:block}details>summary{display:none}}

/* ================================ Kompakte Auswahllisten (sevDesk-Treffer) */
.pick-list{list-style:none;margin:10px 0 0;padding:0;border:1px solid var(--border);
  border-radius:10px;overflow:hidden;background:var(--surface);font-size:.84rem}
.pick-list li{display:grid;grid-template-columns:1fr auto;grid-template-areas:'main btn' 'sub btn';
  gap:0 10px;align-items:center;padding:7px 9px 7px 11px;border-bottom:1px solid var(--border)}
.pick-list li:last-child{border-bottom:none}
.pick-list li:nth-child(even){background:rgba(0,0,0,.012)}
.pick-list li:hover{background:var(--tint)}
.pick-main{grid-area:main;display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;line-height:1.3}
.pick-main b{font-weight:700;color:var(--heading)}
.pick-main i{font-style:normal;font-size:.76rem;color:var(--muted)}
.pick-main em{font-style:normal;font-weight:700;color:var(--primary-dark)}
.pick-sub{grid-area:sub;font-size:.76rem;color:var(--muted);line-height:1.3;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pick-list .btn{grid-area:btn;padding:4px 11px;font-size:.78rem}


/* Abstand vor dem Aufforderungsband — vorher stießen die anderen Apartments
   unmittelbar daran. */
.sec-others{padding-bottom:76px}
.cta-band{margin-top:0}
section + .cta-band{border-top:1px solid var(--border)}
.other-grid{margin-bottom:8px}
@media(max-width:820px){.sec-others{padding-bottom:48px}}

/* ====================================================== Aufgaben (Checklisten) */
.tk-list{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:10px;
  overflow:hidden;background:var(--surface);font-size:.86rem}
.tk{display:grid;grid-template-columns:104px minmax(180px,1fr) minmax(260px,auto);gap:12px;align-items:start;
  padding:9px 11px;border-bottom:1px solid var(--border)}
.tk:last-child{border-bottom:none}
.tk:nth-child(even){background:rgba(0,0,0,.012)}
.tk:hover{background:var(--tint)}
.tk-when{font-size:.8rem;line-height:1.35}
.tk-when b{display:block;color:var(--heading)}
.tk-when i{font-style:normal;font-size:.72rem;color:var(--muted)}
.tk-late .tk-when b{color:#B3261E}
.tk-late .tk-when i{color:#B3261E;font-weight:700}
.tk-done{opacity:.6}
.tk-done .tk-main>b{text-decoration:line-through}
.tk-main{min-width:0}
.tk-main>b{color:var(--heading)}
.tk-tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:3px;font-size:.74rem;color:var(--muted)}
.tk-tags i{font-style:normal}
.tk-ref{color:var(--primary-dark);text-decoration:none;border-bottom:1px dotted currentColor}
.tk-note{display:block;font-size:.78rem;color:var(--muted);margin-top:4px}
.tk-log{display:block;font-size:.74rem;color:var(--primary-dark);margin-top:3px}
.tk-act{display:flex;align-items:center;justify-content:flex-end}
.tk-act form{width:100%;justify-content:flex-end}
/* Das Feld für die Notiz beim Erledigen — vorher zu schmal für einen Satz. */
.tk-note-in{flex:1;min-width:150px;max-width:280px;height:28px;font-size:.82rem;padding:3px 8px}
.tk-compact .tk{grid-template-columns:100px 1fr auto;padding:7px 10px}
@media(max-width:1100px){
  .tk{grid-template-columns:96px 1fr;grid-template-areas:'when main' 'act act';row-gap:7px}
  .tk-when{grid-area:when}
  .tk-main{grid-area:main}
  .tk-act{grid-area:act;justify-content:flex-start;padding-left:96px}
  .tk-note-in{max-width:none}
}
@media(max-width:760px){
  .tk{grid-template-columns:1fr;grid-template-areas:'when' 'main' 'act';gap:5px}
  .tk-act{padding-left:0}
  .tk-act form{flex-wrap:wrap}
}

/* Checkliste in der Buchung */
.ck-block{margin-bottom:14px}
.ck-head{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--primary-dark);margin-bottom:6px}
.ck-item{display:flex;gap:9px;align-items:flex-start;margin:0 0 5px;padding:6px 9px;
  border:1px solid var(--border);border-radius:8px;background:var(--bg);cursor:pointer;font-size:.88rem}
.ck-item:hover{border-color:var(--border2);background:#fff}
.ck-item input{margin:2px 0 0}
.ck-txt i{font-style:normal;font-size:.76rem;color:var(--muted);margin-left:7px}
.ck-txt em{display:block;font-style:normal;font-size:.74rem;color:var(--muted);margin-top:1px}
.ck-done{opacity:.62}
.ck-done .ck-txt{text-decoration:line-through}
.ck-late{border-color:#E8C4BE;background:#FDF3F1}
.ck-late .ck-txt i{color:#B3261E;font-weight:700}


/* ======================================================= Kopfzeile, mobil
   Auf dem Telefon war das Menü bisher schlicht ausgeblendet. Jetzt gibt es
   einen Aufklapper; er kommt ohne JavaScript aus, damit nichts hängen bleibt. */

.site-head{position:sticky;top:0;z-index:80;background:var(--header-bg)}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-height:66px;padding-top:8px;padding-bottom:8px}
.head-lang{display:flex;align-items:center;order:3}
.head-right{display:flex;align-items:center;gap:22px;order:2;margin-left:auto}
.head-meta{display:flex;align-items:center;gap:12px}
.nav-toggle{position:absolute;opacity:0;pointer-events:none}
.nav-burger{display:none}

@media(max-width:900px){
  .head-in{min-height:62px;gap:10px;flex-wrap:wrap}
  /* Logo deutlich größer als zuvor — es ist das Erkennungszeichen. */
  .logo-header,.site-head .logo-svg{max-height:50px;height:50px}
  /* Sprachumschalter bleibt oben auf Höhe des Logos, links neben dem Knopf. */
  .head-lang{order:2;margin-left:auto}
  .head-lang .lang-switch a{padding:6px 11px}

  /* Der Aufklapper */
  .nav-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:42px;height:38px;padding:0 9px;cursor:pointer;border:1px solid var(--border2);
    border-radius:9px;background:var(--surface);order:3}
  .nav-burger span{display:block;height:2px;background:var(--header-text);border-radius:2px;transition:.18s}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .head-right{order:4;width:100%;display:none;flex-direction:column;align-items:stretch;gap:0;
    margin-left:0;padding:2px 0 10px}
  .nav-toggle:checked ~ .head-right{display:flex}

  .site-nav{display:flex;flex-direction:column;align-items:stretch;gap:0}
  /* Zeilen enger, damit das Menü ohne Scrollen auf den Schirm passt. */
  .site-nav>a,.nav-drop>a{padding:8px 4px;border-bottom:1px solid var(--border);font-size:.97rem}
  .site-nav>a:last-child{border-bottom:none}

  /* Das Ausklappmenü der Apartments wird zur einfachen Liste */
  .nav-drop{display:block;position:static}
  .nav-drop>a .chev{display:none}
  .nav-menu{display:flex!important;position:static;border:0;box-shadow:none;background:transparent;
    padding:0 0 3px 14px;min-width:0}
  .nav-menu a{padding:6px 4px;font-size:.92rem;border-bottom:1px solid var(--border)}
  .nav-menu a:last-child{border-bottom:none}
  .nav-menu-all{display:none}

  .head-meta{justify-content:stretch;padding-top:11px}
  .head-cta{flex:1;text-align:center;padding:11px 18px}
}

@media(max-width:380px){
  .logo-header,.site-head .logo-svg{max-height:42px;height:42px}
  .head-in{min-height:56px}
  .head-lang .lang-switch a{padding:5px 9px;font-size:.76rem}
}

/* =============================================================== Gästeseite
   Eigene Farbwelt, angelehnt an die Vorlage der Gästeinformation: warmes
   Cremeweiß statt Grau, tiefes Blau für Überschriften, Orange als Akzent für
   Nummern und Kennzeichen, weiche Karten mit großzügigem Radius. Bewusst
   getrennt von der übrigen Website, damit sich die Seite wie ein eigenes
   kleines Heft anfühlt. */

.guestpage{
  --g-cream:#FBF8F3; --g-paper:#FFFFFF;
  --g-ink:#2E3A46; --g-ink-soft:#5B6B78;
  --g-blue:#6587B7; --g-blue-deep:#3E5A7D; --g-blue-pale:#E9EFF6;
  --g-orange:#EC7E41; --g-orange-deep:#D9682B; --g-peach:#F6E3CE;
  --g-line:rgba(62,90,125,.16);
  --g-shadow:0 10px 30px rgba(62,90,125,.10);
  --g-radius:20px;
  background:var(--g-cream);
  color:var(--g-ink);
}
.guestpage .site-nav,.guestpage .nav-burger,.guestpage .head-cta{display:none}
.guestpage .site-head{background:var(--g-cream);border-bottom:1px solid var(--g-line)}
.guestpage .site-foot{background:var(--g-blue-deep)}
.guestpage h1,.guestpage h2,.guestpage h3{color:var(--g-blue-deep)}

/* --- Anmeldung --- */
.gp-gate{padding:60px 0;display:flex;justify-content:center}
.gp-gate-card{max-width:430px;width:100%;background:var(--g-paper);border:1px solid var(--g-line);
  border-radius:var(--g-radius);padding:34px 32px;box-shadow:var(--g-shadow)}
.gp-gate-card h1{font-size:1.7rem;margin:6px 0 10px}
.gp-gate-card .lead{color:var(--g-ink-soft)}
.gp-gate-card .eyebrow{color:var(--g-orange-deep);letter-spacing:.12em;font-size:.76rem}
.gp-gate-card .eyebrow::before{background:var(--g-orange)}
.gp-pin-in{font-size:1.8rem;letter-spacing:.4em;text-align:center;padding:12px;font-weight:700;
  border-radius:14px;border:1px solid var(--g-line);background:var(--g-cream);color:var(--g-blue-deep)}
.gp-pin-in:focus{outline:2px solid var(--g-blue);border-color:var(--g-blue);background:#fff}
.guestpage .btn-accent{background:var(--g-orange)}
.guestpage .btn-accent:hover{background:var(--g-orange-deep)}
.guestpage .btn-quiet{border-color:var(--g-line);color:var(--g-blue-deep)}
.guestpage .btn-quiet:hover{background:var(--g-blue-pale)}

/* --- Aufmacher --- */
.gp-hero{position:relative;background:linear-gradient(140deg,var(--g-blue-deep),var(--g-blue));
  color:#fff;padding:56px 0 50px;overflow:hidden}
.gp-hero.has-img{padding:84px 0 72px}
.gp-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.30}
.gp-hero-in{position:relative}
.gp-hero h1{color:#fff;font-size:clamp(1.9rem,4vw,2.7rem);font-weight:600;max-width:22ch;margin:6px 0 14px}
.gp-hero .lead{color:rgba(255,255,255,.92);max-width:60ch;margin:0;font-size:1.05rem}
.gp-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;letter-spacing:.12em;
  text-transform:uppercase;font-weight:700;color:var(--g-peach);margin:0}

/* --- Gerüst --- */
.gp-layout{padding:38px 0 68px}
.gp-layout .gp-body{max-width:74ch;padding:0}

/* --- Eckdaten --- */
.gp-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin-bottom:26px}
.gp-facts>div{background:var(--g-paper);border:1px solid var(--g-line);border-radius:16px;
  box-shadow:var(--g-shadow);padding:15px 17px;display:flex;flex-direction:column;gap:2px}
.gp-facts span{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--g-orange-deep)}
.gp-facts b{font-family:var(--font-display);font-size:1.16rem;color:var(--g-blue-deep)}
.gp-facts i{font-style:normal;font-size:.78rem;color:var(--g-ink-soft)}

/* --- Zugangsdaten --- */
.gp-access{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:20px}
.gp-acc-card{background:var(--g-blue-pale);border-radius:var(--g-radius);padding:20px 22px;text-align:center;
  border:1px solid var(--g-line)}
.gp-acc-lbl{display:block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--g-orange-deep);margin-bottom:8px}
.gp-acc-sub{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--g-orange-deep);margin-top:11px}
.gp-code{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:1.7rem;font-weight:700;letter-spacing:.08em;color:var(--g-blue-deep);word-break:break-all;line-height:1.25}
.gp-code-sm{font-size:1.18rem}
.gp-note{background:var(--g-peach);color:var(--g-orange-deep);border-radius:14px;border:0;
  padding:13px 18px;margin-bottom:26px;font-size:.9rem;font-weight:600}
.gp-note p{margin:0}
.gp-note.is-bad{background:#F6DADA;color:#8E2F2F}

/* Zwei Kacheln nebeneinander, das WLAN darunter über die ganze Breite —
   der QR-Code braucht den Platz. */
.gp-access{grid-template-columns:1fr}
@media(min-width:680px){.gp-access{grid-template-columns:1fr 1fr}}
.gp-acc-full{grid-column:1/-1}
.gp-acc-full.has-qr{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:14px 32px;text-align:left}
.gp-acc-full.has-qr .gp-wifi-txt{flex:1 1 220px;min-width:0}
.gp-qr{margin:0;flex:0 0 auto;text-align:center}
.gp-qr svg{display:block;width:150px;height:150px;border-radius:10px;background:#fff;
  padding:7px;box-shadow:var(--g-shadow)}
.gp-qr figcaption{margin-top:7px;font-size:.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;color:var(--g-orange-deep)}
@media(max-width:520px){.gp-acc-full.has-qr{flex-direction:column;text-align:center}
  .gp-acc-full.has-qr .gp-wifi-txt{flex-basis:auto}}

/* Späte Abreise */
.gp-late-txt{margin:10px 0 0;font-size:.86rem;line-height:1.45;color:var(--g-ink-soft)}
.gp-late-preis{margin:8px 0 0;font-size:.82rem;color:var(--g-ink-soft)}
.gp-late-preis b{color:var(--g-blue-deep)}
.gp-late-form{margin-top:12px}
.gp-late-state{margin:10px 0 0;font-size:.84rem;font-weight:600;line-height:1.45;color:var(--g-ink-soft)}
.gp-late-state.is-ok{color:#2F6B47}
.gp-late.is-off{opacity:.72}
.gp-late.is-off .gp-code{color:var(--g-ink-soft)}

/* --- Abschnitte als Karten --- */
.gp-block{background:var(--g-paper);border:1px solid var(--g-line);border-radius:var(--g-radius);
  box-shadow:var(--g-shadow);padding:26px 28px;margin:0 0 18px}
.gp-block h2{display:flex;align-items:center;gap:12px;font-size:clamp(1.25rem,2.2vw,1.55rem);margin:0 0 14px;
  font-weight:600;line-height:1.2}
.gp-num{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--g-orange);color:#fff;
  font-family:var(--font-body);font-size:.9rem;font-weight:700;font-variant-numeric:tabular-nums;
  display:flex;align-items:center;justify-content:center}
.gp-ico{font-size:1.25rem}
.gp-img{width:100%;border-radius:16px;margin:4px 0 16px;display:block;border:1px solid var(--g-line)}
.gp-block .rich{font-size:.99rem;color:var(--g-ink)}
.gp-block .rich p{margin:0 0 .8em}
.gp-block .rich p:last-child{margin-bottom:0}
.gp-block .rich b{color:var(--g-blue-deep)}
.gp-block .rich a{color:var(--g-orange-deep);text-decoration:underline;text-underline-offset:2px}
.gp-block .rich ul{margin:.5em 0 .9em;padding-left:1.1em}
.gp-block .rich li{margin-bottom:.35em}
.gp-block .rich li::marker{color:var(--g-orange)}

/* Bausteine, die sich im Text verwenden lassen — Marke der Vorlage */
.guestpage .tag{display:inline-block;background:var(--g-orange);color:#fff;font-size:.66rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;padding:5px 10px;border-radius:999px;line-height:1.2;
  white-space:nowrap;margin-right:5px}
.guestpage .tag.kid{background:var(--g-blue);}
.guestpage .badge{display:inline-flex;align-items:center;gap:8px;background:var(--g-peach);
  color:var(--g-orange-deep);font-weight:700;font-size:.85rem;padding:8px 16px;border-radius:999px}
.guestpage .note{font-size:.85rem;color:var(--g-ink-soft);background:var(--g-blue-pale);
  border-radius:12px;padding:11px 15px;margin-top:14px}
.guestpage .note.warm{background:var(--g-peach);color:var(--g-orange-deep);font-weight:600}
.guestpage .pantry-item{display:inline-block;background:var(--g-blue-pale);color:var(--g-blue-deep);
  font-weight:600;font-size:.82rem;padding:6px 12px;border-radius:999px;margin:0 5px 5px 0}

.gp-gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0 4px}
.gp-gal.one{grid-template-columns:1fr}
.gp-gal img{width:100%;border-radius:14px;display:block;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--g-line)}
.gp-gal.one img{aspect-ratio:auto}

.gp-contact{background:var(--g-blue-pale)}
.gp-contact-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.gp-signoff{margin-top:26px;font-family:var(--font-display);font-style:italic;font-size:1.2rem;
  color:var(--g-blue-deep);text-align:center;line-height:1.5}
.gp-signoff b{font-style:normal;font-size:.95rem;color:var(--g-ink-soft)}

/* --- Inhaltsverzeichnis --- */
@media(min-width:1000px){
  .gp-layout.has-toc{display:grid;grid-template-columns:222px minmax(0,1fr);gap:44px;align-items:start;
    max-width:1090px}
  .gp-toc{position:sticky;top:88px;max-height:calc(100vh - 120px);overflow-y:auto;padding-right:6px;
    scrollbar-width:thin}
  .gp-toc nav{display:flex;flex-direction:column;gap:1px}
  .gp-toc a{display:flex;gap:10px;align-items:flex-start;padding:7px 11px;border-radius:11px;
    font-size:.85rem;line-height:1.35;color:var(--g-ink-soft);text-decoration:none;transition:.13s}
  .gp-toc a:hover{background:var(--g-paper);color:var(--g-blue-deep)}
  .gp-toc a.on{background:var(--g-paper);color:var(--g-blue-deep);font-weight:600;box-shadow:var(--g-shadow)}
  .gp-toc-n{flex-shrink:0;width:17px;text-align:right;font-variant-numeric:tabular-nums;
    font-size:.72rem;font-weight:700;color:var(--g-orange);padding-top:1px}
  .gp-toc-head{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;
    color:var(--g-orange-deep);margin:0 0 10px;padding-left:11px}
}
@media(max-width:999px){
  .gp-toc{position:sticky;top:0;z-index:40;margin:0 -20px 18px;padding:10px 20px;
    background:rgba(251,248,243,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--g-line);
    overflow-x:auto;-webkit-overflow-scrolling:touch}
  .gp-toc-head{display:none}
  .gp-toc nav{display:flex;gap:7px;width:max-content}
  .gp-toc a{white-space:nowrap;font-size:.8rem;padding:7px 14px;border-radius:999px;
    background:var(--g-paper);border:1px solid var(--g-line);color:var(--g-ink-soft);text-decoration:none}
  .gp-toc a.on{background:var(--g-orange);border-color:var(--g-orange);color:#fff;font-weight:700}
  .gp-toc-n{display:none}
}
.gp-block,#gp-zugang{scroll-margin-top:80px}

@media(max-width:600px){
  .gp-hero{padding:40px 0 36px}
  .gp-hero.has-img{padding:58px 0 50px}
  .gp-block{padding:20px 18px;border-radius:16px}
  .gp-code{font-size:1.5rem}
  .gp-gate-card{padding:26px 22px}
}
@media print{
  .guestpage{background:#fff}
  .gp-hero{background:#fff!important;color:#000!important;padding:0 0 14px}
  .gp-hero h1,.gp-kicker,.gp-hero .lead{color:#000!important}
  .gp-hero-img,.gp-toc{display:none}
  .gp-layout.has-toc{display:block}
  .gp-block{box-shadow:none;break-inside:avoid}
  .site-head,.site-foot{display:none!important}
}

.gz-copy{display:none;width:100%;margin-top:10px;font-size:.8rem;font-family:ui-monospace,Menlo,monospace;
  line-height:1.5;background:var(--bg)}
.gz-copy.show{display:block}
.gz-copy-note{display:none;margin-top:5px}
.gz-copy-note.show{display:block}
.btn.is-ok{background:var(--ok-bg,#E7F3EA);border-color:#8CBE9C;color:#2C6B3F}

/* ==========================================================================
   Schmale Bildschirme — durchgängig
   Gesammelt statt über die Seiten verstreut: Tabellen bekommen einen eigenen
   Rollbereich, mehrspaltige Formularreihen werden einspaltig, Knopfreihen und
   Filter brechen um, und alles zum Antippen wird groß genug.
   ========================================================================== */

@media(max-width:820px){
  /* --- Formulare --- */
  .row2,.row3,.form-grid,.grid-2,.grid-3{grid-template-columns:1fr!important}
  .field{min-width:0}
  .field input,.field select,.field textarea{width:100%;max-width:none!important;min-height:44px}
  .field textarea{min-height:88px}
  fieldset{padding:16px 14px}
  legend{font-size:1rem}

  /* --- Knopfreihen --- */
  .actions{flex-wrap:wrap;gap:8px}
  .actions .btn{min-height:42px}
  .admin-title{flex-direction:column;align-items:flex-start;gap:10px}
  .admin-title .actions{margin:0}

  /* --- Filterleisten --- */
  .filters{flex-direction:column;align-items:stretch;gap:10px}
  .filters .field{margin:0}
  .filters .btn{width:100%}

  /* --- Karten --- */
  .card.pad{padding:16px 14px}
  .stat{grid-template-columns:repeat(auto-fit,minmax(132px,1fr))}
  .split{grid-template-columns:1fr}

  /* --- Reiter --- */
  .faq-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;
    padding-bottom:4px;margin-right:-18px;padding-right:18px}
  .faq-tab{white-space:nowrap;flex-shrink:0}

  /* --- Verwaltungsmenü --- */
  .admin-nav{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;
    padding-bottom:6px;margin-right:-18px;padding-right:18px}
  .admin-nav a{white-space:nowrap;flex-shrink:0}
}

/* Tabellen rollbar machen — die Hülle setzt ein kleines Skript (siehe _head.php) */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px;padding-bottom:2px}
.tbl-scroll>table{min-width:520px}
.tbl-scroll.is-scrollable{position:relative}
.tbl-scroll.is-scrollable::after{content:'';position:absolute;top:0;right:0;bottom:8px;width:26px;
  pointer-events:none;background:linear-gradient(90deg,transparent,var(--surface))}

@media(max-width:620px){
  .data th,.data td{padding:7px 8px;font-size:.86rem}
  .rep-row{grid-template-columns:1fr!important}
  .rep-actions{justify-content:flex-start}
  h1{font-size:1.6rem!important}
  h2{font-size:1.25rem}
  .eyebrow{font-size:.7rem}
}

@media(max-width:480px){
  .wrap{padding-left:16px;padding-right:16px}
  .stat{grid-template-columns:1fr 1fr}
  .stat .card{padding:12px}
  .stat b{font-size:1.3rem}
  .rep-grid,.gp-facts{grid-template-columns:1fr}
  .btn{padding:11px 16px}
  .btn-sm{padding:9px 13px}
}


/* --------------------------------------- Öffentliche Seiten, schmale Schirme */
@media(max-width:820px){
  section{padding:44px 0}
  .section-head{margin-bottom:28px}
  .apt-preview,.apt-detail,.book-grid,.loc-grid,.hero-grid{grid-template-columns:1fr!important;gap:26px}
  .gallery,.gal-main{grid-template-columns:1fr!important}
  .gal-thumb{grid-template-columns:repeat(4,1fr)}
  .ask-card{position:static!important;margin-top:22px}
  .cal-wide{grid-template-columns:1fr!important}
  .cal-wide .cal{max-width:none}
  .why-grid,.other-grid,.f-grid{grid-template-columns:1fr 1fr!important}
  .cta-band{padding:34px 0}
  .cta-band .actions{flex-direction:column;align-items:stretch}
  .cta-band .btn{width:100%}
}
@media(max-width:560px){
  .why-grid,.other-grid,.f-grid{grid-template-columns:1fr!important}
  .hero h1{font-size:1.85rem}
  .lead{font-size:1rem}
  .gal-thumb{grid-template-columns:repeat(3,1fr)}
  table.pos th,table.pos td{font-size:.8rem;padding:6px 4px 6px 0}
}

/* Nichts darf die Seite in die Breite schieben */
img,svg,video,iframe,table{max-width:100%}
pre,code{overflow-x:auto;max-width:100%}
body{overflow-x:hidden}


/* Letzte feste Breiten für sehr schmale Geräte lösen */
@media(max-width:420px){
  .tk-note-in{min-width:0;width:100%}
  .tbl-scroll>table{min-width:420px}
  .gz-in{min-width:0}
  .rep-gal-add,.rep-img-ctl{min-width:0}
}

/* ------------------------------------------------------------- Dokumente */
.dok-block{margin-bottom:16px}
.dok-head{font-family:var(--font-body);font-size:.8rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--primary-dark);margin:0 0 7px}
.dok-head span{font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted);margin-left:7px}
.dok-list{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:9px;overflow:hidden}
.dok-list li{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;
  padding:8px 10px;border-bottom:1px solid var(--border);background:var(--surface);font-size:.86rem}
.dok-list li:last-child{border-bottom:none}
.dok-list li:hover{background:var(--tint)}
.dok-meta{font-size:.74rem;color:var(--muted);white-space:nowrap}

/* Gästeseite */
.gp-person{display:grid;grid-template-columns:auto 1fr;gap:7px 18px;margin:12px 0 14px;font-size:.95rem}
.gp-person dt{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--g-orange-deep);padding-top:3px}
.gp-person dd{margin:0;color:var(--g-ink)}
.gp-person-hint{font-size:.9rem;color:var(--g-ink-soft);margin:0}
.gp-docs{list-style:none;margin:10px 0 6px;padding:0;border:1px solid var(--g-line);border-radius:12px;overflow:hidden}
.gp-docs li{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;
  padding:11px 14px;border-bottom:1px solid var(--g-line);background:var(--g-cream)}
.gp-docs li:last-child{border-bottom:none}
.gp-docs a{color:var(--g-blue-deep);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.gp-docs span{font-size:.78rem;color:var(--g-ink-soft)}
.gp-upload{background:var(--g-blue-pale);border-radius:14px;padding:16px 18px;margin:12px 0 8px}
.gp-upload .field{margin-bottom:11px}
.gp-upload input[type=file]{background:#fff;border:1px solid var(--g-line);border-radius:10px;padding:10px}
@media(max-width:560px){
  .gp-person{grid-template-columns:1fr;gap:2px 0}
  .gp-person dd{margin-bottom:8px}
  .dok-list li{grid-template-columns:1fr auto}
  .dok-meta{grid-column:1/-1}
}

/* --------------------------------------------------- Videos, Gästeseite */
.gp-video{width:100%;border-radius:16px;display:block;margin:16px 0 4px;background:#000;
  border:1px solid var(--g-line);max-height:70vh}

/* Im Verwaltungsformular */
.rep-vid{display:flex;flex-direction:column;gap:6px}
.rep-vid-ok{font-size:.78rem;color:#2C6B3F;font-weight:600;word-break:break-all}
.rep-vid-miss{font-size:.78rem;color:#B3261E;font-weight:600;word-break:break-all}
.rep-vid-none{font-size:.78rem;color:var(--muted)}
.rep-vid-up{display:flex;flex-direction:column;gap:3px}
.rep-vid-up input[type=file]{font-size:.78rem}
.rep-vid-del{margin:0;font-size:.78rem}
@media print{.gp-video{display:none}}

/* ==========================================================================
   Verwaltung: Seitenmenü links
   Die waagrechte Leiste wurde mit jedem Bereich unübersichtlicher. Links
   gruppiert bleibt auch bei einem Dutzend Einträgen alles überblickbar.
   ========================================================================== */

body.admin{background:var(--bg)}
.side-toggle{position:absolute;opacity:0;pointer-events:none}

.admin-shell{display:grid;grid-template-columns:238px minmax(0,1fr);min-height:100vh;align-items:start}
.admin-side{position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;
  background:var(--heading);color:rgba(255,255,255,.86);padding:18px 0 14px;scrollbar-width:thin}
.side-brand{display:block;padding:0 20px 18px;color:#fff;text-decoration:none;line-height:1.25}
.side-brand b{display:block;font-family:var(--font-display);font-size:1.06rem}
.side-brand span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.62}

.side-nav{flex:1;display:flex;flex-direction:column;gap:1px;padding:0 10px}
.side-group{font-size:.64rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.42);margin:16px 0 5px;padding:0 10px}
.side-group:first-child{margin-top:0}
.side-nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;
  color:rgba(255,255,255,.82);text-decoration:none;font-size:.9rem;line-height:1.3;transition:.12s}
.side-nav a:hover{background:rgba(255,255,255,.09);color:#fff}
.side-nav a.on{background:var(--primary);color:#fff;font-weight:600}
.side-ico{flex-shrink:0;width:19px;text-align:center;font-size:1rem;opacity:.8}
.side-nav a.on .side-ico{opacity:1}
.side-txt{flex:1;min-width:0}
.side-nav .badge{font-size:.66rem;padding:2px 6px}

.side-foot{padding:14px 10px 0;margin-top:12px;border-top:1px solid rgba(255,255,255,.13)}
.side-foot a{display:flex;align-items:center;gap:11px;padding:7px 11px;border-radius:9px;
  color:rgba(255,255,255,.66);text-decoration:none;font-size:.84rem}
.side-foot a:hover{background:rgba(255,255,255,.09);color:#fff}
.side-me{margin:10px 0 0;padding:0 11px;font-size:.72rem;color:rgba(255,255,255,.5);line-height:1.45;
  word-break:break-all}
.side-me span{opacity:.75}

.admin-main{min-width:0;padding:0}
.admin-inner{max-width:1180px;margin:0 auto;padding:26px 30px 20px}
.admin-foot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:22px 0 34px;margin-top:26px;border-top:1px solid var(--border)}

/* Die alte Kopfleiste erscheint nur auf schmalen Schirmen */
.admin-bar{display:none}
.side-veil{display:none}

@media(max-width:900px){
  .admin-shell{grid-template-columns:1fr}
  .admin-bar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:70;
    background:var(--heading);color:#fff;padding:9px 14px;min-height:52px}
  .admin-brand{display:flex;flex-direction:column;line-height:1.2;color:#fff;text-decoration:none}
  .admin-brand b{font-family:var(--font-display);font-size:.98rem}
  .admin-brand span{font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6}
  .admin-bar-right{margin-left:auto}
  .admin-bar-right a{color:rgba(255,255,255,.8)}

  .side-burger{display:flex;flex-direction:column;justify-content:center;gap:4px;
    width:38px;height:34px;padding:0 8px;border-radius:8px;cursor:pointer;
    background:rgba(255,255,255,.12)}
  .side-burger span{display:block;height:2px;background:#fff;border-radius:2px;transition:.16s}
  .side-toggle:checked ~ .admin-bar .side-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .side-toggle:checked ~ .admin-bar .side-burger span:nth-child(2){opacity:0}
  .side-toggle:checked ~ .admin-bar .side-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .admin-side{position:fixed;top:0;left:0;bottom:0;width:252px;z-index:90;
    transform:translateX(-100%);transition:transform .2s ease;height:100vh}
  .side-toggle:checked ~ .admin-shell .admin-side{transform:translateX(0)}
  .side-brand{display:none}
  .side-veil{position:fixed;inset:0;background:rgba(30,33,44,.5);z-index:85}
  .side-toggle:checked ~ .admin-shell .side-veil{display:block}
  .admin-inner{padding:18px 18px 14px}
}
@media(max-width:520px){.admin-inner{padding:14px 14px 12px}}
.flash-warn{background:#FDF6E7;border-color:#E8D9A8;color:#7A5B12}

/* ==========================================================================
   Listen statt breiter Tabellen
   Zehn Spalten sind auf einem Telefon nicht zu retten. Jede Zeile wird zu
   einer Karte: auf breiten Schirmen spaltig angeordnet wie eine Tabelle, auf
   schmalen gestapelt — ohne waagrechtes Rollen.
   ========================================================================== */

.blist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}

.bcard{position:relative;display:grid;gap:4px 18px;align-items:baseline;
  grid-template-columns:150px minmax(150px,1.3fr) 160px 120px 1fr auto;
  grid-template-areas:'ref guest when apt tags sum';
  background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:12px 16px;transition:border-color .12s,box-shadow .12s}
.bcard:hover{border-color:var(--primary);box-shadow:0 4px 14px -8px rgba(63,69,87,.4)}
/* Wo steht der Aufenthalt heute: Gast im Haus grün, Abgereiste grau. */
.bcard.is-current{background:#E7F3EA;border-color:#B9DCC3}
.bcard.is-current:hover{border-color:#8CBE9C}
.bcard.is-past{background:#F1F0EC;border-color:#E3E0D8}
.bcard.is-past>span{opacity:.78}
.bcard.is-past:hover>span{opacity:1}

/* Die ganze Karte ist anklickbar, ohne die Auszeichnung zu verschachteln */
.bcard-hit{position:absolute;inset:0;border-radius:12px;z-index:1}
.bcard-hit:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.bcard>span{position:relative;z-index:2;pointer-events:none;min-width:0}
.bcard a:not(.bcard-hit){pointer-events:auto}

.bc-ref{grid-area:ref;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.bc-ref b{font-size:.94rem;color:var(--heading);font-variant-numeric:tabular-nums}
.bc-guest{grid-area:guest;display:flex;flex-direction:column;gap:1px;overflow:hidden}
.bc-guest b{font-size:.92rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-when{grid-area:when;display:flex;flex-direction:column;gap:1px}
.bc-when b{font-size:.88rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.bc-apt{grid-area:apt;display:flex;flex-direction:column;gap:3px;align-items:flex-start;overflow:hidden}
.bc-apt i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bc-tags{grid-area:tags;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.bc-sum{grid-area:sum;font-family:var(--font-display);font-size:1.02rem;font-weight:600;
  color:var(--heading);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}

.bcard i{font-style:normal;font-size:.76rem;color:var(--muted);line-height:1.35}
.bcard .badge{font-size:.68rem;padding:2px 7px}
.bcard .apt-code{margin:0}

@media(max-width:1180px){
  .bcard{grid-template-columns:140px minmax(140px,1fr) 150px auto;
    grid-template-areas:'ref guest when sum' 'ref apt tags tags'}
  .bc-sum{align-self:start}
}
@media(max-width:820px){
  .bcard{grid-template-columns:1fr auto;
    grid-template-areas:'ref sum' 'guest guest' 'when apt' 'tags tags';
    gap:6px 14px;padding:13px 15px}
  .bc-ref{flex-direction:row;align-items:center;gap:9px}
  .bc-when b{font-size:.86rem}
  .bc-apt{align-items:flex-end;text-align:right}
}
@media(max-width:520px){
  .bcard{grid-template-columns:1fr;grid-template-areas:'ref' 'sum' 'guest' 'when' 'apt' 'tags';gap:5px}
  .bc-sum{text-align:left;font-size:1.1rem;margin-top:-2px}
  .bc-apt{align-items:flex-start;text-align:left}
}

/* Vormerkungen: dieselbe Kartenform, eigene Spaltenaufteilung */
.icard{grid-template-columns:132px minmax(160px,1.4fr) 148px 150px 132px auto;
  grid-template-areas:'src name when apt state act';cursor:default}
.icard:hover{border-color:var(--border);box-shadow:none}
.ic-src{grid-area:src;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.ic-name{grid-area:name;display:flex;flex-direction:column;gap:2px;overflow:hidden;min-width:0}
.ic-name b{font-size:.92rem;color:var(--heading)}
.ic-when{grid-area:when;display:flex;flex-direction:column;gap:1px}
.ic-when b{font-size:.88rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.ic-apt{grid-area:apt;display:flex;flex-direction:column;gap:3px;align-items:flex-start;min-width:0}
.ic-state{grid-area:state;display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.ic-act{grid-area:act;display:flex;gap:5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.icard>span{pointer-events:auto}
.icard .small.muted,.icard .muted{font-size:.75rem}
.icard details summary{font-size:.72rem}
.icard-open{list-style:none;margin:-4px 0 4px;padding:0}
.icard-open>.card{border-top-left-radius:0;border-top-right-radius:0}

@media(max-width:1180px){
  .icard{grid-template-columns:126px minmax(150px,1fr) 140px auto;
    grid-template-areas:'src name when act' 'src apt state state'}
}
@media(max-width:820px){
  .icard{grid-template-columns:1fr auto;
    grid-template-areas:'src state' 'name name' 'when apt' 'act act';gap:7px 14px}
  .ic-src{flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap}
  .ic-state{align-items:flex-end;text-align:right}
  .ic-apt{align-items:flex-end;text-align:right}
  .ic-act{justify-content:flex-start;padding-top:3px;border-top:1px solid var(--border)}
  .ic-act .btn{flex:1;min-width:120px;text-align:center}
}
@media(max-width:520px){
  .icard{grid-template-columns:1fr;grid-template-areas:'src' 'name' 'when' 'apt' 'state' 'act'}
  .ic-state,.ic-apt{align-items:flex-start;text-align:left}
}

/* Übersicht: offene Anfragen */
.dcard{grid-template-columns:110px minmax(140px,1fr) 200px auto;
  grid-template-areas:'ref guest when sum'}
.dc-ref{grid-area:ref}
.dc-ref b{font-size:.92rem;color:var(--heading);font-variant-numeric:tabular-nums}
.dc-guest{grid-area:guest;display:flex;flex-direction:column;gap:1px;overflow:hidden}
.dc-guest b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.dc-when{grid-area:when;display:flex;flex-direction:column;gap:2px}
.dc-when b{font-size:.86rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.dc-when i{display:flex;align-items:center;gap:5px}
.dc-sum{grid-area:sum;font-family:var(--font-display);font-weight:600;color:var(--heading);
  white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:820px){
  .dcard{grid-template-columns:1fr auto;grid-template-areas:'ref sum' 'guest guest' 'when when'}
  .dc-sum{align-self:start}
}

/* Übersicht: nächste Anreisen */
.acard{grid-template-columns:118px minmax(130px,1fr) auto;
  grid-template-areas:'day guest sheet';padding:11px 14px}
.ac-day{grid-area:day;display:flex;flex-direction:column;gap:1px}
.ac-day b{font-size:.88rem;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--heading)}
.ac-guest{grid-area:guest;display:flex;flex-direction:column;gap:2px;overflow:hidden}
.ac-guest b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.ac-guest i{display:flex;align-items:center;gap:5px}
.ac-sheet{grid-area:sheet;display:flex;align-items:center}
@media(max-width:640px){
  .acard{grid-template-columns:1fr auto;grid-template-areas:'day sheet' 'guest guest'}
  .ac-sheet{align-items:flex-start}
}

/* -------------------------------------------- Buchung: Summen kompakt
   Feste Spaltenbreiten sind der Kern: Ohne sie weitet eine lange Beschriftung
   die Tabelle, und der Kasten muss waagrecht gerollt werden. */
.sumtab{width:100%;table-layout:fixed;border-collapse:collapse;font-size:.8rem;margin:0}
.sumtab th,.sumtab td{padding:3px 0;vertical-align:baseline;border:0;background:none}
.sumtab th{text-align:left;font-weight:400;color:var(--muted);line-height:1.35;
  overflow-wrap:anywhere;padding-right:8px}
.sumtab td{width:88px;text-align:right;white-space:nowrap;color:var(--text);
  font-variant-numeric:tabular-nums}
.sumtab th i{font-style:normal;opacity:.72;font-size:.74rem}

.sumtab .st-sep th,.sumtab .st-sep td{border-top:1px solid var(--border);padding-top:7px}
.sumtab .st-total th,.sumtab .st-total td{border-top:2px solid var(--primary);padding-top:7px;
  font-size:.94rem;color:var(--heading)}
.sumtab .st-total th{font-weight:600}
.sumtab .st-total td{font-family:var(--font-display);font-weight:600}
.sumtab .st-note th,.sumtab .st-note td{padding-top:5px;font-size:.74rem;color:var(--muted)}

@media(max-width:400px){
  .sumtab{font-size:.76rem}
  .sumtab td{width:76px}
  .sumtab .st-total th,.sumtab .st-total td{font-size:.88rem}
}

/* Zwischensumme unter den Positionen */
.it-sum td{background:var(--bg);border-top:2px solid var(--border2);padding-top:9px;padding-bottom:9px}
.it-sum b{color:var(--heading)}
.it-sum td:first-child .small{display:block;font-weight:400;margin-top:1px}
.it-sum td.num b{font-size:1.02rem;font-variant-numeric:tabular-nums}
.it-sum td.num .small{display:block;font-weight:400;margin-top:1px}
@media(max-width:820px){
  .it-sum td{padding:8px 6px}
  .it-sum td:first-child{font-size:.86rem}
}

/* ------------------------------------------------------ Journal der Buchung */
.jrn{list-style:none;margin:12px 0 0;padding:0;font-size:.84rem}
.jrn-day{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);margin:14px 0 5px;padding-bottom:3px;border-bottom:1px solid var(--border)}
.jrn-day:first-child{margin-top:0}
.jrn-row{display:grid;grid-template-columns:44px 22px 1fr auto;gap:9px;align-items:baseline;
  padding:5px 2px;border-bottom:1px solid rgba(0,0,0,.04)}
.jrn-row:last-child{border-bottom:none}
.jrn-time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.78rem}
.jrn-ico{text-align:center;opacity:.7;font-size:.9rem}
.jrn-txt{color:var(--text);line-height:1.4;overflow-wrap:anywhere}
.jrn-by{color:var(--muted);font-size:.74rem;white-space:nowrap}
.jrn-status .jrn-txt{font-weight:600;color:var(--heading)}
.jrn-versand .jrn-txt{color:var(--primary-dark)}
.jrn-papierkorb .jrn-txt{color:#B3261E}
@media(max-width:600px){
  .jrn-row{grid-template-columns:40px 20px 1fr;gap:7px}
  .jrn-by{grid-column:2/-1;padding-bottom:2px}
}

/* Persönliche Nachricht auf der Gästeseite */
.gp-msg{display:flex;gap:15px;align-items:flex-start;background:var(--g-peach);
  border-radius:var(--g-radius);padding:20px 24px;margin:0 0 20px}
.gp-msg-ico{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--g-orange);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem}
.gp-msg-head{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;
  color:var(--g-orange-deep);margin:2px 0 7px}
.gp-msg .rich{color:var(--g-ink);font-size:1rem}
.gp-msg .rich p{margin:0 0 .6em}
.gp-msg .rich p:last-child{margin-bottom:0}
.gp-msg .rich a{color:var(--g-orange-deep);text-decoration:underline}
#gp-nachricht{scroll-margin-top:80px}
@media(max-width:560px){.gp-msg{padding:16px 17px;gap:12px}}

/* ==================================================== Zustimmungshinweis
   Unten angesetzt statt als Sperrfläche über der Seite: Wer nur eine
   Telefonnummer sucht, soll nicht erst wegklicken müssen. */
.ck-bar{position:fixed;left:0;right:0;bottom:0;z-index:95;background:var(--surface);
  border-top:1px solid var(--border);box-shadow:0 -6px 24px -14px rgba(63,69,87,.4)}
.ck-in{max-width:var(--maxwidth);margin:0 auto;padding:14px 24px;
  display:flex;gap:22px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ck-txt{flex:1;min-width:260px}
.ck-head{font-family:var(--font-display);font-size:1rem;color:var(--heading);margin:0 0 3px}
.ck-txt p{margin:0;font-size:.84rem;color:var(--muted);line-height:1.5;max-width:82ch}
.ck-txt a{color:var(--primary-dark);text-decoration:underline;text-underline-offset:2px}
.ck-act{display:flex;gap:9px;align-items:center;flex-shrink:0;margin:0}
.ck-act .btn{min-height:40px}

/* Damit der Hinweis den Fuß der Seite nicht verdeckt */
body:has(.ck-bar) .site-foot{padding-bottom:104px}

@media(max-width:700px){
  .ck-in{padding:13px 18px;gap:12px;flex-direction:column;align-items:stretch}
  .ck-act{width:100%}
  .ck-act .btn{flex:1;text-align:center}
  body:has(.ck-bar) .site-foot{padding-bottom:170px}
}
@media print{.ck-bar{display:none}}

/* ------------------------------------- Buchung: die drei Notizfelder */
.notes{display:flex;flex-direction:column;gap:14px;margin-top:4px}
.notes .field{margin:0;max-width:none}
.notes textarea{width:100%;max-width:none;font-size:.92rem;line-height:1.55;resize:vertical}
.notes .mini-editor{min-height:110px}
/* Die Notizen für den Gast hervorheben — sie werden veröffentlicht. */
.notes .field:nth-child(2){background:var(--tint);border-radius:10px;padding:12px 14px}
.notes .field:nth-child(2)>span:first-child{color:var(--primary-dark)}
.notes .field:nth-child(2) .mini-editor,
.notes .field:nth-child(2) textarea{background:#fff}

/* ------------------------------ Buchung: der Gast-Abschnitt in Blöcken */
.g-block{margin-top:18px;padding-top:16px;border-top:1px dashed var(--border)}
.g-block:first-of-type{margin-top:0;padding-top:0;border-top:0}
.g-head{font-family:var(--font-body);font-size:.78rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--primary-dark);margin:0 0 10px}
.g-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px;align-items:start}
.g-row .field{margin:0;max-width:none}
.g-row textarea{width:100%;max-width:none;resize:vertical}
@media(max-width:600px){.g-row{grid-template-columns:1fr}}

/* -------------------------- Buchung: Sprungleiste, nur auf breiten Schirmen
   Rechts neben dem Inhalt, bleibt beim Rollen stehen und zeigt, wo man ist.
   Unterhalb von 1400px gibt es sie nicht; die Sprungmarken bleiben. */
.be-toc{display:none}

/* Kopf der Buchung: Name, Eckdaten, Belege */
.be-head{margin-bottom:12px}
.be-facts{margin:6px 0 0;font-size:.9rem;color:var(--muted)}
.be-facts b{color:var(--heading);font-weight:600}

/* Mitlaufende Leiste: sagt immer, welche Buchung und welcher Abschnitt.
   Sie bleibt oben stehen; darunter die Sprungmarken als Chips, solange
   die Sprungleiste rechts keinen Platz hat. */
.be-bar{position:sticky;top:10px;z-index:40;background:var(--surface);
  border:1px solid var(--border);border-radius:12px;
  box-shadow:0 10px 26px -20px rgba(63,69,87,.7);padding:0 14px;margin:0 0 22px}
.be-bar-in{display:flex;align-items:center;gap:12px;min-height:50px;flex-wrap:wrap}
.be-bar-ref{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.be-bar-name{font-family:var(--font-display);font-size:1rem;color:var(--heading);white-space:nowrap}
.be-bar-dates{font-size:.84rem;color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums}
.be-bar-where{display:flex;align-items:center;gap:7px;min-width:0;font-size:.8rem;color:var(--muted)}
.be-bar-where::before{content:"";width:1px;height:20px;background:var(--border)}
.be-bar-where b{color:var(--primary-dark);font-weight:600;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.be-bar-act{margin:0 0 0 auto;gap:8px}
.be-chips{display:flex;gap:6px;overflow-x:auto;padding:0 0 10px;scrollbar-width:thin;
  border-top:1px solid var(--border);padding-top:9px}
.be-chips a{flex:0 0 auto;display:flex;align-items:center;gap:6px;font-size:.8rem;line-height:1;
  text-decoration:none;color:var(--muted);background:var(--bg);border:1px solid var(--border);
  border-radius:999px;padding:6px 12px;white-space:nowrap;transition:.12s}
.be-chips a i{font-style:normal;font-size:.68rem;opacity:.65;font-variant-numeric:tabular-nums}
.be-chips a:hover{color:var(--text);border-color:var(--muted)}
.be-chips a.on{background:var(--primary);border-color:var(--primary);color:#fff}
.be-chips a.on i{opacity:.8}
@media(max-width:900px){.be-bar{top:60px}}
@media(max-width:700px){.be-bar-name,.be-bar-where{display:none}}
@media(max-width:460px){.be-bar-dates{display:none}}

/* Gruppenbanderole: teilt die Seite in vier lesbare Etappen */
.be-group{display:flex;align-items:center;gap:11px;margin:38px 0 14px}
.be-group:first-child{margin-top:4px}
.be-group-no{flex:0 0 auto;width:25px;height:25px;border-radius:50%;background:var(--tint);
  color:var(--primary-dark);font-size:.76rem;font-weight:700;display:flex;align-items:center;
  justify-content:center}
.be-group b{font-family:var(--font-display);font-size:1.12rem;font-weight:600;color:var(--heading)}
.be-group em{font-style:normal;font-size:.82rem;color:var(--muted)}
.be-group::after{content:"";flex:1;height:1px;background:var(--border)}
@media(max-width:600px){.be-group em{display:none}}

/* Abschnitte als Karten — Rand allein trennt zu schwach */
.be-main fieldset{background:var(--surface);box-shadow:var(--shadow);padding:20px 22px}
.be-main legend{font-size:1.1rem;color:var(--heading);padding:0 9px;margin-left:-3px}

/* Die Summe begleitet die Abrechnung */
@media(min-width:901px){.be-main .split>aside #summe{position:sticky;top:120px;z-index:1}}

.be-main fieldset[id],.be-main .card[id]{scroll-margin-top:118px}
@media(max-width:900px){.be-main fieldset[id],.be-main .card[id]{scroll-margin-top:172px}}
@media(min-width:1400px){
  .admin-inner:has(.be-layout){max-width:1400px}
  .be-layout{display:grid;grid-template-columns:minmax(0,1fr) 186px;gap:36px;align-items:start}
  .be-main{min-width:0}
  .be-main fieldset[id],.be-main .card[id]{scroll-margin-top:84px}
  .be-chips{display:none}
  .be-toc{display:flex;flex-direction:column;position:sticky;top:22px;
    max-height:calc(100vh - 44px);overflow-y:auto;padding:2px 0}
  .be-toc-head{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;
    color:var(--muted);margin:0 0 10px 13px}
  .be-toc-group{display:flex;align-items:center;gap:7px;margin:14px 0 4px 13px;
    font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--heading)}
  .be-toc-group:first-of-type{margin-top:0}
  .be-toc-group span{width:17px;height:17px;border-radius:50%;background:var(--tint);
    color:var(--primary-dark);font-size:.64rem;display:flex;align-items:center;justify-content:center;
    letter-spacing:0}
  .be-toc a[data-toc]{display:block;padding:5px 12px;border-left:2px solid var(--border);
    font-size:.86rem;line-height:1.35;color:var(--muted);text-decoration:none;transition:.12s}
  .be-toc a[data-toc]:hover{color:var(--text);border-left-color:var(--primary)}
  .be-toc a.on{color:var(--primary-dark);font-weight:600;border-left-color:var(--primary);
    background:var(--bg);border-radius:0 8px 8px 0}
  .be-toc-foot{display:flex;flex-direction:column;align-items:flex-start;gap:8px;
    margin:16px 0 0 13px;padding-top:14px;border-top:1px solid var(--border)}
}

/* ------------------------------------------ Bildbetrachter, Gästeseite */
.gp-zoom{cursor:zoom-in;transition:filter .15s}
.gp-zoom:hover{filter:brightness(1.04)}
.gp-zoom:focus-visible{outline:3px solid var(--g-orange);outline-offset:2px}

.gp-lb{position:fixed;inset:0;z-index:120;background:rgba(30,38,48,.94);
  display:flex;align-items:center;justify-content:center;padding:26px}
.gp-lb[hidden]{display:none}
body.gp-lb-on{overflow:hidden}
.gp-lb-fig{margin:0;max-width:min(1100px,100%);max-height:100%;display:flex;
  flex-direction:column;align-items:center;gap:12px}
.gp-lb-fig img{max-width:100%;max-height:calc(100vh - 110px);border-radius:12px;display:block;
  box-shadow:0 24px 60px -24px rgba(0,0,0,.7);background:#000}
.gp-lb-fig figcaption{color:rgba(255,255,255,.86);font-size:.86rem;text-align:center;
  font-family:var(--font-body)}
.gp-lb-close{position:absolute;top:16px;right:20px;width:44px;height:44px;border:0;border-radius:50%;
  background:rgba(255,255,255,.14);color:#fff;font-size:1.9rem;line-height:1;cursor:pointer}
.gp-lb-close:hover{background:rgba(255,255,255,.26)}
.gp-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border:0;
  border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:2rem;line-height:1;cursor:pointer}
.gp-lb-nav:hover{background:rgba(255,255,255,.28)}
.gp-lb-prev{left:14px}
.gp-lb-next{right:14px}
.gp-lb-nav[hidden]{display:none}
@media(max-width:600px){
  .gp-lb{padding:12px}
  .gp-lb-nav{width:44px;height:44px;font-size:1.6rem;top:auto;bottom:16px;transform:none}
  .gp-lb-prev{left:16px}
  .gp-lb-next{right:16px}
  .gp-lb-fig img{max-height:calc(100vh - 150px)}
}
@media print{.gp-lb{display:none!important}}

/* ---------------------------------- Buchung: Aufenthalt kompakt
   Der erste Abschnitt ist reine Dateneingabe — enge Spalten und kleinere
   Felder bringen ihn auf einen Blick unter. */
#aufenthalt .form-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px 14px;
  margin-bottom:10px}
#aufenthalt .form-grid:last-of-type{margin-bottom:0}
#aufenthalt .field{margin-bottom:0}
#aufenthalt .field>span{font-size:.76rem;margin-bottom:3px}
#aufenthalt .field .hint{font-size:.72rem;margin-top:2px;line-height:1.35}
#aufenthalt input,#aufenthalt select{padding:7px 10px;font-size:.88rem}

/* ------------------------------------------------ Endreinigung in der Buchung */
.clean-box{margin-top:16px;padding:13px 15px;background:var(--bg);border:1px solid var(--border);
  border-radius:10px}
.clean-head{display:flex;gap:10px;align-items:center;margin-bottom:9px}
.clean-head>span:first-child{font-size:.78rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--primary-dark)}
.clean-row{display:flex;gap:9px;align-items:flex-end;flex-wrap:wrap}
.clean-row .field{min-width:190px}
@media(max-width:600px){.clean-row{align-items:stretch;flex-direction:column}.clean-row .btn{width:100%}}
/* Sperre wegen Endreinigung im Kalender: schräg gestreift statt gefüllt,
   damit sie sich auf einen Blick von einer Buchung unterscheidet. */
.cal-day.cal-clean{background:repeating-linear-gradient(45deg,
  var(--busy-bg) 0 4px, color-mix(in srgb, var(--busy-bg) 55%, #fff) 4px 8px)!important;
  color:var(--muted)}
@supports not (background: color-mix(in srgb, red 50%, blue)){
  .cal-day.cal-clean{background:repeating-linear-gradient(45deg,
    var(--busy-bg) 0 4px, var(--surface) 4px 8px)!important}
}
.lg-clean{background:repeating-linear-gradient(45deg,
  var(--busy-bg) 0 3px, var(--surface) 3px 6px)}

/* ------------------------------------------- Belegungsplan (admin/plan.php)
   Ein Raster: links die Tage, danach je Apartment eine Spalte. Jede Tageszeile
   ist gleich hoch (--prh); die Balken werden über grid-row gesetzt und um eine
   halbe Zeile versetzt — dadurch liegen Abreise und Anreise desselben Tages in
   derselben Zeile, ohne sich zu überdecken. Kein overflow auf .plan, sonst
   klebt die Kopfzeile beim Rollen nicht mehr. */
.plan{--prh:30px;--pdc:76px;display:grid;grid-template-rows:auto;grid-auto-rows:var(--prh);
  border:1px solid var(--border);background:var(--surface);margin-bottom:16px}
.pl-head{position:sticky;top:0;z-index:7;background:var(--heading);color:#fff;
  display:flex;flex-direction:column;justify-content:center;gap:1px;
  padding:7px 9px;font-size:.86rem;line-height:1.2;min-height:42px;
  border-left:1px solid rgba(255,255,255,.14)}
.pl-head a{color:#fff;text-decoration:none;font-weight:600}
.pl-head a:hover{text-decoration:underline}
.pl-head-sub{font-size:.66rem;opacity:.72}
.pl-corner{grid-column:1;grid-row:1;font-size:.68rem;opacity:.8;border-left:0}

.pl-date{grid-column:1;display:flex;align-items:center;gap:5px;padding:0 8px;
  font-size:.72rem;color:var(--muted);border-top:1px solid var(--border)}
.pl-dow{width:22px}
.pl-num{font-variant-numeric:tabular-nums}
.pl-mon{font-weight:700;color:var(--primary-dark)}
.pl-cell{border-top:1px solid var(--border);border-left:1px solid var(--border)}
.pl-cell.is-we,.pl-date.is-we{background:var(--bg)}
.pl-cell.is-past,.pl-date.is-past{background:repeating-linear-gradient(135deg,
  transparent 0 6px, rgba(0,0,0,.028) 6px 12px)}
.pl-cell.is-month,.pl-date.is-month{border-top:2px solid var(--primary)}
.pl-cell.is-today,.pl-date.is-today{border-top:2px solid var(--accent);background:var(--tint)}
.pl-date.is-today{font-weight:700;color:var(--primary-dark)}

/* Balken: Buchungen, Sperren, Reinigung */
.pl-bar{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;border-radius:7px;padding:1px 7px;min-height:14px;
  font-size:.74rem;line-height:1.15;text-decoration:none;color:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.14)}
.pl-bar:hover{filter:brightness(1.07);box-shadow:0 2px 7px rgba(0,0,0,.22)}
.pl-n{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-s{font-size:.64rem;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-more{font-size:.58rem;opacity:.85;text-align:center;line-height:1}
/* An- und Abreisezeit: oben rechts die Anreise, unten rechts die Abreise.
   Abweichende Zeiten stehen in einem hellen Feld — sie sind der Hinweis,
   den man beim Planen braucht. */
.pl-t{position:absolute;right:4px;font-size:.58rem;line-height:1.1;opacity:.72;
  font-variant-numeric:tabular-nums;pointer-events:none}
.pl-t-in{top:1px}
.pl-t-out{bottom:1px}
.pl-t.is-x{opacity:1;font-weight:700;background:#fff;color:var(--primary-dark);
  border-radius:4px;padding:0 3px;box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.pl-bar.has-t .pl-n,.pl-bar.has-t .pl-meta{padding-right:34px}

/* Checkliste: unter dem Namen zwei Reihen kleiner Zeichen — oben vor, unten
   nach dem Aufenthalt. Erledigt schaltet auf grün, überfällig auf rot. */
.pl-meta{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.pl-line{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%}
.pl-meta .pl-s{min-width:0}
/* Die zweite Reihe etwas zurückgenommen, damit die Reihenfolge ins Auge fällt. */
.pl-ck-nach i{background:rgba(255,255,255,.66);box-shadow:0 0 0 1px rgba(0,0,0,.12) inset}
.pl-ck-nach i.is-done,.pl-ck-nach i.is-late{box-shadow:none}
.pl-ck{display:flex;gap:2px;flex:0 0 auto}
.pl-ck i{font-style:normal;font-size:.6rem;line-height:1.35;min-width:13px;text-align:center;
  padding:0 2px;border-radius:3px;background:rgba(255,255,255,.88);color:#55605B;
  box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.pl-ck i.is-done{background:#2F7D5B;color:#fff;box-shadow:none}
.pl-ck i.is-late{background:#B3261E;color:#fff;box-shadow:none}
.pl-ck-more{font-size:.56rem!important;background:transparent!important;box-shadow:none!important;
  color:inherit!important;opacity:.8}
.pl-bar.is-past{opacity:.6}

/* Buchungsbalken beschriften von oben: bei mehreren Zeilen (Name, zwei
   Checklisten) bliebe zentriert sonst oben und unten etwas abgeschnitten. */
.pl-b{justify-content:flex-start}
.pl-st-bestaetigt{background:var(--busy-bg)}
.pl-st-abgereist{background:var(--busy-bg);opacity:.72}
.pl-st-option{background:var(--option-bg);color:#5C4400}
.pl-st-neu{background:var(--surface);color:var(--text);
  border:1px dashed var(--busy-bg);box-shadow:none}
.pl-x{background:repeating-linear-gradient(45deg,#8E9A95 0 5px,#AAB4B0 5px 10px);color:#fff}

/* Die Endreinigung liegt über den Balken — sie ist der Hinweis, auf den es in
   der Planung ankommt. Kommt am selben Tag schon der nächste Gast, schrumpft
   sie zum Zeichen am rechten Rand (pl-c-mini). */
.pl-c{z-index:5;flex-direction:row;align-items:center;gap:5px;min-height:12px;
  padding:0 6px;border-radius:5px;font-size:.66rem;
  background:var(--accent);color:#402F00;box-shadow:0 1px 2px rgba(0,0,0,.18)}
.pl-bar.pl-c::before{content:'✻';font-size:.8rem;line-height:1}
.pl-c .pl-n{font-weight:700}
.pl-c.is-done{background:#2F7D5B;color:#fff}
.pl-c.is-soft{background:var(--surface);color:var(--muted);
  border:1px dashed var(--accent);box-shadow:none}
.pl-c-mini{width:auto!important;margin-left:0!important;justify-self:end;
  margin-right:3px;padding:0 5px}
.pl-c-mini .pl-n{display:none}

.pl-legend{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.pl-key{display:inline-block;width:17px;height:11px;border-radius:3px;
  margin-right:6px;vertical-align:-1px}

@media(max-width:820px){
  .plan{--prh:27px;--pdc:58px}
  .pl-date{font-size:.66rem;gap:3px;padding:0 5px}
  .pl-dow{width:17px}
  .pl-head{font-size:.76rem;padding:6px}
  .pl-bar{font-size:.68rem;padding:1px 5px}
  .pl-s{display:none}
  /* Auf schmalen Schirmen ist nur Platz für das, was abweicht. */
  .pl-t:not(.is-x){display:none}
  .pl-bar.has-t .pl-n{padding-right:0}
}

/* ------------------------------------------- Aufgaben nach Apartment gegliedert */
.tg{margin-bottom:26px}
.tg-head{display:flex;align-items:center;gap:9px;font-size:1.12rem;margin:0 0 10px;
  padding-bottom:7px;border-bottom:2px solid var(--primary)}
.tg-head .apt-code{margin:0;font-size:.76rem}
.tg-n{margin-left:auto;font-family:var(--font-body);font-size:.76rem;font-weight:600;
  color:var(--muted);background:var(--bg);border-radius:999px;padding:2px 9px}
.tg-sub{margin-bottom:12px}
.tg-sub-head{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;margin:0 0 5px;
  font-size:.8rem;color:var(--muted)}
.tg-sub-head a{color:var(--primary-dark);font-weight:700;font-variant-numeric:tabular-nums;
  text-decoration:none;border-bottom:1px dotted currentColor}
.tg-sub-head b{color:var(--heading);font-weight:600}
.tg-sub-head span{margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:600px){
  .tg-sub-head span{margin-left:0;width:100%}
  .tg-head{font-size:1rem}
}
.dash-tg{display:flex;align-items:center;gap:8px;margin:12px 0 5px;font-size:.82rem;
  font-weight:600;color:var(--heading)}
.dash-tg:first-of-type{margin-top:4px}
.dash-tg .apt-code{margin:0}
.dash-tg i{margin-left:auto;font-style:normal;font-size:.72rem;font-weight:400;color:var(--muted)}
/* Auf der Übersicht etwas gedrängter als auf der Aufgabenseite */
.tg-dash{margin-bottom:16px}
.tg-dash:last-child{margin-bottom:0}
.tg-dash .tg-head{font-size:.98rem;border-bottom-width:1px;margin-bottom:7px;padding-bottom:5px}
.tg-dash .tg-sub{margin-bottom:9px}
.tg-dash .tg-sub:last-child{margin-bottom:0}
.tg-dash .tg-sub-head{font-size:.76rem;margin-bottom:3px}
