/* WEITFORM · Projektanfrage (Prototyp)
   Gestaltung folgt der Website: Papierton, Georgia-Titel, scharfe Kanten, feine Linien.
   Mobile first. Der CRM-Eingang (Bereich .crm) nutzt bewusst die Farben des Studio-CRM. */

:root{
  --paper:#f6f4ee; --ink:#28342e; --muted:#566257; --line:#bec6ba; --soft:#e4e8dc; --field:#a9b5a4;
  --focus:#6d7846; --err:#9b3d2f; --err-bg:#f6e8e3;
  --gutter:clamp(20px,4.5vw,72px);
  --serif:Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 'Segoe UI',Arial,sans-serif;overflow-x:hidden}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,p,figure,ol,ul,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;line-height:1.05}
h1{font-size:clamp(32px,4.4vw,60px)}
h2{font-size:clamp(28px,3.3vw,42px);outline:none}
.wrap{max-width:1560px;margin:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;z-index:50;top:6px;left:6px;transform:translateY(-200%);padding:10px 14px;background:var(--soft);border:1px solid var(--ink)}
.skip:focus{transform:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.eyebrow{font-size:10.5px;font-weight:650;letter-spacing:.16em;text-transform:uppercase}
.hint{font-size:12.5px;color:var(--muted)}
[hidden]{display:none!important}

/* ---------- Prototyp-Leiste ---------- */
.protobar{position:relative;z-index:30;background:var(--soft);border-bottom:1px solid var(--line);font-size:12px;color:#3a4a3d}
.pb-in{display:flex;justify-content:space-between;align-items:center;gap:6px 18px;flex-wrap:wrap;padding-block:6px}
.pb-nav{display:flex;align-items:center;gap:2px 16px;flex-wrap:wrap}
.pb-nav a,.pb-menu summary{display:inline-flex;align-items:center;min-height:36px;font-weight:600;text-decoration:none;cursor:pointer;list-style:none;padding-inline:2px;border-bottom:2px solid transparent}
.pb-menu summary::-webkit-details-marker{display:none}
.pb-menu summary::after{content:"▾";margin-left:5px;font-size:10px}
.pb-n{margin-left:5px;color:var(--err);font-weight:700}
.pb-nav a[aria-current],.pb-nav a:hover,.pb-menu summary:hover{border-bottom-color:var(--ink)}
.pb-menu{position:relative}
.pb-pop{position:absolute;right:0;top:100%;z-index:40;min-width:290px;max-width:calc(100vw - 2*var(--gutter));background:var(--paper);border:1px solid var(--ink);padding:14px;display:grid;gap:10px;box-shadow:0 10px 30px rgba(40,52,46,.16)}
.pb-item{text-align:left;background:transparent;border:1px solid var(--line);padding:11px 12px;min-height:44px;cursor:pointer;font-size:13.5px}
.pb-item:hover{border-color:var(--ink);background:#fff8}
.pb-item.danger{color:var(--err);border-color:var(--err)}
.pb-hint{font-size:12px;color:var(--muted)}
.pb-pop fieldset{border:0;padding:0;margin:0;display:grid;gap:6px}
.pb-pop legend{font-weight:650;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:0 0 4px}
.pb-radio{display:flex;gap:10px;align-items:center;min-height:40px;font-size:13.5px;cursor:pointer}
.pb-radio input{accent-color:var(--ink);width:18px;height:18px;margin:0}
.pb-field{display:grid;gap:4px;font-size:12px;font-weight:600}
.pb-field select{min-height:44px;border:1px solid var(--field);background:transparent;padding:8px 10px;font-size:14px}
@media(max-width:700px){.pb-long{display:none}.pb-in{padding-block:2px}.pb-txt{font-size:11px}.pb-nav{gap:0 12px;width:100%;justify-content:space-between}.pb-menu{position:static}.pb-pop{left:var(--gutter);right:var(--gutter);min-width:0}}

/* ---------- Kopf & Fuss (wie Website) ---------- */
.site-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand svg{width:30px;height:35px}
.brand strong{display:block;font-size:20px;line-height:1.1;font-weight:550;letter-spacing:.055em}
.brand small{display:block;font-size:9px;letter-spacing:.17em;margin-top:5px}
.site-header nav a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:13px;font-weight:600;text-decoration:none}
.site-header nav a:hover{text-decoration:underline;text-underline-offset:6px}
.site-footer .inner{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--line);padding-block:22px;margin-top:clamp(40px,6vw,88px);font-size:12px;color:var(--muted)}
.footer-links{display:flex;flex-wrap:wrap;gap:4px 24px}
.footer-links a{display:inline-flex;min-height:44px;align-items:center}
body[data-view="crm"] .site-header,body[data-view="crm"] .site-footer{display:none}

/* ---------- Einleitung & Fortschritt ---------- */
.intro{border-top:1px solid var(--line);padding-block:clamp(24px,4vw,44px) clamp(18px,3vw,30px)}
.intro .eyebrow{margin-bottom:14px}
.progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 clamp(26px,4vw,44px)}
.progress li{border-top:2px solid var(--line);padding-top:10px;font-size:13px;font-weight:600;color:var(--muted)}
.progress li.current{border-top-color:var(--ink);color:var(--ink)}
.progress li.done{border-top-color:var(--muted);color:var(--ink)}
.progress li.done .pn::after{content:" ✓"}
.progress a,.progress span{display:inline-flex;gap:8px;align-items:baseline;text-decoration:none;min-height:30px}
@media(max-width:560px){.progress{gap:6px}.progress a,.progress span{flex-direction:column;gap:0;min-height:44px}.progress .pt{font-size:12.5px}}
.progress a:hover .pt{text-decoration:underline;text-underline-offset:4px}
.pn{font-size:11px;color:var(--muted);font-weight:500;letter-spacing:.06em}

/* ---------- Slogan, Studiostandort, Einsatzgebiet ---------- */
.slogan{font-size:clamp(34px,5vw,64px);max-width:16ch}
.slogan span{display:block}
.studio-loc{display:flex;align-items:center;gap:10px;margin-top:18px;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:var(--muted)}
.studio-loc::before{content:"";flex:none;width:10px;height:10px;border:2px solid var(--ink);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.intro-lead{margin-top:12px;color:var(--muted);font-size:15.5px;max-width:58ch}
.intro.compact .studio-loc,.intro.compact .intro-lead{display:none}
.intro.compact .slogan{font-size:clamp(26px,3.2vw,38px);max-width:none}
.intro.compact .slogan span{display:inline}
.intro.compact{padding-block:clamp(16px,2.5vw,26px) 8px}
.loc-block{display:grid;gap:14px}
.zone-box:empty{display:none}
.zone{border-left:2px solid var(--ink);background:var(--soft);padding:14px 16px;font-size:14.5px}
.zone strong{display:block;font-size:14.5px;margin-bottom:3px}
.zone p{margin:0;color:#3b4a3e}
.zone .zone-dis{margin-top:8px;font-size:12px;color:var(--muted)}
.zone-actions{display:flex;flex-wrap:wrap;gap:0 22px;align-items:flex-start;margin-top:4px}
.zone-more{flex:1 1 220px}
.zone-more summary{cursor:pointer;display:inline-flex;align-items:center;min-height:36px;font-size:13px;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.zone-more p{margin-top:6px;font-size:13.5px}
.zone-link{display:inline-flex;align-items:center;min-height:36px;margin-top:4px;font-size:13px;font-weight:650}
.zone-outside,.zone-unknown{border-left-style:dashed;background:#efeee6}
.zone-chip{display:inline-block;margin-left:8px;padding:1px 8px;border:1px solid var(--ink);font-size:11.5px;font-weight:600;white-space:nowrap}
.zone-chip.z-outside,.zone-chip.z-unknown{border-style:dashed;color:var(--muted);border-color:var(--muted)}
.mode{display:inline-block;padding:0 7px;border:1px solid var(--line);font-size:11px;line-height:18px;color:var(--muted);white-space:nowrap}
.m-onsite{border-color:var(--ink);color:var(--ink)}
.special{border-top:1px solid var(--line);padding-top:16px}
.special-h{font-family:var(--serif);font-size:21px;letter-spacing:-.025em;margin-bottom:4px}
.special .opt{margin-top:12px}
.opt-special{background:var(--soft);border-style:dashed;border-color:var(--ink)}
.adapt{border-left:2px solid var(--err);background:var(--err-bg);padding:12px 16px}
.adapt p{font-size:14px;margin-top:2px}
.docs-note{margin:2px 0 10px}

/* ---------- Briefing ---------- */
.brief-block{display:grid;gap:14px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.date-row{display:grid;gap:4px}
.date-row .f-date{max-width:260px}
input[type=date],input[type=url]{display:block;width:100%;min-width:0;margin:0;background:transparent;border:1px solid var(--field);border-radius:0;padding:11px 13px;min-height:50px;font-size:16px;color:var(--ink);-webkit-appearance:none;appearance:none}
input[type=date]{max-width:260px}
.budget-block{display:grid;gap:6px}
.hint.docs-note{margin:0}
.crm .pre{white-space:pre-wrap}

/* ---------- Layout ---------- */
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.form{max-width:720px;min-width:0}
.side{display:none}
@media(min-width:960px){
  .layout{grid-template-columns:minmax(0,1fr) 320px;gap:clamp(40px,7vw,120px);align-items:start}
  .side{display:block;position:sticky;top:24px;border-top:1px solid var(--ink);padding-top:16px}
  .side dl{display:grid;gap:16px;margin-top:18px}
  .side dt{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .side dd{margin-top:3px;font-size:14.5px}
  .side dd.empty{color:var(--muted);font-style:italic}
  .side ul li{padding-block:1px}
  .side ul li::before{content:"– "}
  .side-note{margin-top:24px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
}

/* ---------- Schritt-Inhalt ---------- */
.step{display:grid;gap:clamp(18px,2.6vw,26px)}
.step>.lead{margin-top:-12px;color:var(--muted);font-size:16px;max-width:52ch}
.lead{color:var(--muted)}
.q{border:0;padding:0;margin:0;min-width:0}
.q legend,.f>label,.grp legend{padding:0}
.q legend,.f>label{display:block;font-size:13px;font-weight:650;margin-bottom:8px}
.req{color:var(--err)}
.opt-tag{font-weight:400;color:var(--muted)}
summary .opt-tag{margin-left:5px}
.err{color:var(--err);font-size:13.5px;font-weight:600;margin-top:7px}
.err::before{content:"⚠ ";font-weight:400}

/* Gruppen & Checkbox-Zeilen */
.grp{border:0;padding:0;margin:0;min-width:0}
.grp legend{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;width:100%;padding:16px 0 10px;border-top:1px solid var(--line)}
.grp .no{font-size:11px;color:var(--muted);letter-spacing:.06em}
.grp .gt{font-family:var(--serif);font-size:21px;letter-spacing:-.025em}
.grp .gl{font-size:13px;color:var(--muted);flex-basis:100%;margin-left:0}
@media(min-width:560px){.grp .gl{flex-basis:auto;margin-left:auto}}
.opt{display:flex;gap:14px;align-items:flex-start;min-height:56px;padding:13px 14px;border:1px solid var(--line);margin-top:-1px;cursor:pointer;position:relative;background:transparent;transition:background .12s}
.opt:hover{background:rgba(228,232,220,.55)}
.opt input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:1px 0 0;border:1.5px solid var(--ink);background:transparent;display:grid;place-content:center;cursor:pointer;border-radius:0}
.opt input::after{content:"";width:12px;height:12px;background:var(--paper);clip-path:polygon(14% 52%,0 66%,38% 100%,100% 22%,86% 8%,38% 72%);transform:scale(0);transition:transform .1s}
.opt input:checked{background:var(--ink)}
.opt input:checked::after{transform:scale(1)}
.opt:has(input:checked){background:var(--soft);border-color:var(--ink);z-index:1}
.opt:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px;z-index:2}
.opt-t{display:flex;flex-direction:column;gap:1px;min-width:0}
.opt-l{font-size:16px;font-weight:600;line-height:1.35}
.opt-t small{display:flex;flex-wrap:wrap;align-items:center;gap:3px 8px;font-size:13px;color:var(--muted);line-height:1.4}
.opt-alt{margin-top:20px;border-style:dashed}
.opt-inline{min-height:48px;margin-top:10px;border-color:transparent;padding-inline:0}
.opt-inline:has(input:checked){background:transparent;border-color:transparent}
.opt-inline:hover{background:transparent}
.has-error>.opt,.has-error .opt{border-color:var(--err)}
.has-error.step{outline:0}

/* Chips (Einzelauswahl) */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;display:inline-flex}
.chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:48px;padding:9px 16px;border:1px solid var(--field);font-size:15px;font-weight:600;background:transparent;transition:background .12s}
.chip:hover span{background:rgba(228,232,220,.6)}
.chip input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink)}
.chip input:focus-visible+span{outline:2px solid var(--focus);outline-offset:3px}
.has-error .chip span{border-color:var(--err)}

/* Felder */
.f{min-width:0}
input[type=text],input[type=email],input[type=tel],select,textarea{display:block;width:100%;min-width:0;margin:0;background:transparent;border:1px solid var(--field);border-radius:0;padding:11px 13px;min-height:50px;font-size:16px;color:var(--ink);-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;background-size:6px 6px;background-repeat:no-repeat;padding-right:38px}
textarea{resize:vertical;min-height:110px}
input::placeholder,textarea::placeholder{color:#5f6b61;opacity:1}
input:focus,select:focus,textarea:focus{outline:2px solid var(--focus);outline-offset:2px;border-color:var(--ink)}
[aria-invalid="true"]{border-color:var(--err)!important;box-shadow:inset 0 0 0 1px var(--err)}
.with-suffix{position:relative}
.with-suffix input{padding-right:48px}
.suffix{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:600;pointer-events:none}
.is-off input{opacity:.5}
.f .hint{display:block;margin-top:6px}
.row2{display:grid;gap:clamp(18px,2.6vw,26px);grid-template-columns:minmax(0,1fr)}
.row-plz{display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px}
@media(min-width:560px){.row2{grid-template-columns:1fr 1fr}.row-plz{grid-template-columns:130px minmax(0,1fr)}}
.area-block{display:grid;gap:0}
.area-block .f-area{max-width:320px}
.bezug{margin-top:10px}
.bezug .chip span{min-height:44px;font-size:14px;font-weight:550;padding-inline:13px}
.bezug legend{font-weight:550;color:var(--muted)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
details.more{border-top:1px solid var(--line);padding-top:6px}
details.more summary{cursor:pointer;display:flex;align-items:center;min-height:48px;font-size:14px;font-weight:650;list-style:none}
details.more summary::-webkit-details-marker{display:none}
details.more summary::before{content:"+";display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--ink);margin-right:10px;font-size:15px;line-height:1}
details.more[open] summary::before{content:"–"}
.docs{display:grid;margin-top:8px}

/* Zusammenfassung & Einwilligung */
.sum{border-top:1px solid var(--ink);padding-top:16px}
.sum h3{font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:-.03em;margin-bottom:8px}
.srow{display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 14px;padding:11px 0;border-top:1px solid var(--line);align-items:baseline}
.srow dd{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0}
.sv{min-width:0}
.srow dt{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.srow dd li::before{content:"– "}
.chg{font-size:13px;font-weight:600;min-height:36px;display:inline-flex;align-items:center;padding-inline:4px}
.honorar{background:var(--soft);border-left:2px solid var(--ink);padding:14px 16px;margin-top:14px}
.honorar strong{font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.honorar .hint{margin-top:4px;font-size:13px}
.honorar .big{font-family:var(--serif);font-size:30px;letter-spacing:-.03em;margin:4px 0 2px}
.honorar.test{border-left-style:dashed}
.honorar .proto{font-size:12px;color:var(--err);font-weight:600;margin-top:6px}
.consent .opt{margin-top:0}
.consent a{text-underline-offset:3px}

/* Fehlerübersicht */
.errsum{border:1px solid var(--err);border-left-width:4px;background:var(--err-bg);padding:14px 16px;margin-bottom:24px}
.errsum h3{font:650 14px 'Segoe UI',Arial,sans-serif;margin-bottom:6px}
.errsum ul{display:grid;gap:2px}
.errsum a{display:inline-block;padding-block:3px;font-size:14px}
.errsum:focus{outline:2px solid var(--err);outline-offset:2px}

/* Aktionsleiste */
.bar{margin-top:clamp(26px,4vw,40px)}
.bar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding-top:18px}
.count{font-size:13px;color:var(--muted)}
.back{display:inline-flex;align-items:center;gap:8px;min-height:48px;font-size:14px;font-weight:650;text-decoration:none;padding-inline:2px;border-bottom:1px solid transparent}
.back:hover{border-bottom-color:var(--ink)}
.button{display:inline-flex;justify-content:space-between;align-items:center;gap:26px;border:1px solid var(--ink);padding:12px 20px;min-height:52px;color:#fff;background:var(--ink);font-size:15px;font-weight:650;cursor:pointer;border-radius:0}
.button:hover{background:#415b4b}
.button:active{transform:translateY(1px)}
@media(max-width:959px){
  .bar{position:sticky;bottom:0;z-index:10;margin-inline:calc(-1*var(--gutter));margin-top:28px;padding-inline:var(--gutter);padding-bottom:calc(12px + env(safe-area-inset-bottom));background:var(--paper);box-shadow:0 -10px 18px -12px rgba(40,52,46,.25)}
  .bar-in{padding-top:12px}
  .button{flex:1;max-width:260px}
}

/* ---------- Bestätigung ---------- */
.thanks{padding-block:clamp(28px,5vw,64px) 0;display:grid;gap:22px;max-width:820px;margin-left:0}
.thanks h1{outline:none}
.thanks .lead{font-size:18px;max-width:46ch}
.recap{display:grid;gap:10px;border-top:1px solid var(--ink);padding-top:14px}
.recap div{display:grid;grid-template-columns:96px 1fr;gap:12px}
.recap dt{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;padding-top:3px}
.next{display:grid;gap:0}
.next li{display:grid;grid-template-columns:44px 1fr;gap:6px;border-top:1px solid var(--line);padding-block:16px}
.next .pn{padding-top:4px}
.next p{color:var(--muted);font-size:14.5px;margin-top:2px}
.thanks-actions{display:flex;flex-wrap:wrap;gap:6px 28px}
.text-link{display:inline-flex;align-items:center;gap:14px;min-height:48px;background:none;border:0;border-bottom:1px solid var(--ink);padding:0 2px;font-size:14px;font-weight:650;text-decoration:none;cursor:pointer}

/* ================================================================
   CRM-Eingang (Prototyp) – Farben und Formen des Studio-CRM
   ================================================================ */
body[data-view="crm"]{background:#f4f2ed}
.crm{--c-surface:#fbfaf7;--c-rule:#dcd8cf;--c-soft:#e8e5de;--c-ink:#1f1e1c;--c-muted:#6a665f;--c-accent:#8a5a3c;--c-accent-soft:#f1e8e1;--c-ok:#56704f;--c-warn:#8f6a1c;--c-danger:#a2463a;
  display:grid;grid-template-columns:232px minmax(0,1fr);min-height:calc(100vh - 40px);color:var(--c-ink);font:14px/1.5 'Inter','Helvetica Neue',Helvetica,Arial,sans-serif}
.crm a{color:inherit}
.crm h1,.crm h2,.crm h3{font-family:inherit;letter-spacing:-.01em}
.crm h1{font-size:28px;font-weight:400;letter-spacing:-.02em;line-height:1.2;outline:none}
.crm-side{background:#ece9e2;border-right:1px solid var(--c-rule);padding:20px 0}
.crm-brand{display:flex;gap:10px;align-items:center;padding:0 22px 22px}
.crm-brand .mark{width:28px;height:28px;border:1px solid var(--c-ink);background:linear-gradient(to top right,transparent 48%,var(--c-accent) 49%,var(--c-accent) 52%,transparent 53%)}
.crm-brand strong{display:block;font-size:14px;line-height:1.2}
.crm-brand small{color:var(--c-muted);font-size:12px}
.crm-side nav{display:grid}
.crm-side nav a,.crm-side nav .dead{display:flex;justify-content:space-between;align-items:center;padding:10px 22px;color:var(--c-muted);font-size:14px;text-decoration:none;border-left:2px solid transparent}
.crm-side nav a.active{background:var(--c-surface);color:var(--c-ink);border-left-color:var(--c-accent);font-weight:600}
.crm-side .n{font-size:11px;background:var(--c-accent);color:#fff;padding:1px 7px;border-radius:99px}
.crm-main{padding:28px clamp(18px,3vw,40px) 60px;min-width:0}
.crm .crumb{margin-bottom:10px;font-size:13px}
.crm .crumb a{border-bottom:1px solid var(--c-rule);text-decoration:none}
.crm .page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--c-ink)}
.crm .page-head .eyebrow{color:var(--c-muted);margin-bottom:6px;letter-spacing:.1em}
.crm .head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.crm .note{background:var(--c-accent-soft);border-left:2px solid var(--c-accent);padding:9px 14px;margin-bottom:18px;font-size:13px}
.crm .btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:7px 14px;border:1px solid var(--c-ink);background:transparent;font:inherit;font-size:13px;cursor:pointer;text-decoration:none;border-radius:0}
.crm .btn:hover{background:var(--c-ink);color:#fff}
.crm .btn.ghost{border-color:var(--c-rule)}
.crm select{min-height:40px;border:1px solid var(--c-rule);background:#fff;padding:6px 10px;font-size:13px;width:auto}
.crm .card{background:var(--c-surface);border:1px solid var(--c-rule);padding:20px 22px;margin-bottom:20px}
.crm .card>h2{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--c-muted);font-weight:500;margin-bottom:14px}
.crm .grid2{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;align-items:start}
.crm .grid2>*{min-width:0}
.crm table.list{width:100%;border-collapse:collapse}
.crm table.list th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--c-muted);font-weight:500;padding:8px 10px;border-bottom:1px solid var(--c-rule)}
.crm table.list td{padding:12px 10px;border-bottom:1px solid var(--c-soft);vertical-align:top}
.crm table.list tr.clickable{cursor:pointer}
.crm table.list tr.clickable:hover{background:#f4f1ea}
.crm table.list tr.fresh{background:#fbf3ea}
.crm .subj a{font-weight:600;text-decoration:none;border-bottom:1px solid var(--c-rule)}
.crm .newtag{margin-left:8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--c-accent);font-weight:700}
.crm .badge{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;padding:2px 8px;border:1px solid var(--c-rule);white-space:nowrap}
.crm .b-neu{border-color:var(--c-accent);color:var(--c-accent);font-weight:700}
.crm .b-in_pruefung,.crm .b-offeriert{border-color:var(--c-warn);color:var(--c-warn)}
.crm .b-gewonnen{border-color:var(--c-ok);color:var(--c-ok)}
.crm .b-abgelehnt{border-color:var(--c-danger);color:var(--c-danger)}
.crm .form{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;max-width:none}
.crm .field{display:flex;flex-direction:column;gap:5px;min-width:0}
.crm .field.wide{grid-column:1/-1}
.crm .field>span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--c-muted)}
.crm .field input,.crm .field textarea{width:100%;border:1px solid var(--c-rule);background:#fff;padding:8px 10px;min-height:40px;font:inherit;font-size:14px;color:var(--c-ink);border-radius:0}
.crm .field textarea{resize:vertical;line-height:1.5}
.crm .facts{display:grid;gap:0}
.crm .fact{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;padding:9px 0;border-top:1px solid var(--c-soft)}
.crm .fact:first-child{border-top:0;padding-top:0}
.crm .fact dt{color:var(--c-muted);font-size:13px}
.crm .tags{display:flex;flex-wrap:wrap;gap:5px}
.crm .tag{display:inline-block;font-size:12px;padding:2px 8px;background:var(--c-soft);border:1px solid var(--c-rule)}
.crm .tag.alt{border-style:dashed;background:transparent}
.crm .tag.zin{background:#eef2e8;border-color:#a9b5a4}
.crm .tag.zout{background:#fbf3ea;border-color:var(--c-accent);border-style:dashed;color:var(--c-accent);font-weight:600}
.crm .tag.size{background:var(--c-accent-soft);border-color:var(--c-accent);color:var(--c-accent);font-weight:600}
.crm .btnrow{display:flex;flex-wrap:wrap;gap:8px}
.crm .empty{color:var(--c-muted);font-style:italic;padding:6px 0}
.crm .json summary{cursor:pointer;font-size:13px;color:var(--c-muted);padding:8px 0}
.crm .json pre{margin:0;max-height:300px;overflow:auto;background:#fff;border:1px solid var(--c-rule);padding:12px;font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;white-space:pre-wrap}
@media(max-width:959px){
  .crm{grid-template-columns:minmax(0,1fr)}
  .crm-side{border-right:0;border-bottom:1px solid var(--c-rule);padding:12px 0 0}
  .crm-brand{padding:0 var(--gutter) 10px}
  .crm-side nav{display:flex;overflow-x:auto;padding-inline:calc(var(--gutter) - 10px)}
  .crm-side nav a,.crm-side nav .dead{padding:10px;border-left:0;border-bottom:2px solid transparent;white-space:nowrap}
  .crm-side nav a.active{border-bottom-color:var(--c-accent)}
  .crm-main{padding-inline:var(--gutter)}
  .crm .grid2{grid-template-columns:minmax(0,1fr)}
  .crm .grid2>.stack{order:-1}
}
@media(max-width:700px){
  .crm .form{grid-template-columns:minmax(0,1fr)}
  .crm .fact{grid-template-columns:minmax(0,1fr);gap:2px}
  .crm table.list,.crm table.list tbody,.crm table.list tr,.crm table.list td{display:block}
  .crm table.list thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .crm table.list tr{border-bottom:1px solid var(--c-rule);padding:10px 0}
  .crm table.list td{border:0;padding:3px 0}
  .crm table.list td::before{content:attr(data-l) ": ";color:var(--c-muted);font-size:12px}
  .crm table.list td.subj::before{content:""}
}
@media(max-width:700px){.zone-link,.zone-more summary{min-height:44px}.chg{min-height:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}