/**
 * LKE Konfigurator — Frontend Styles
 *
 * Design tokens derived from LKE Group branding.
 * BEM naming: .lke-konfig__element--modifier
 * Mobile-first responsive.
 */
/* ================================================================
   DESIGN TOKENS
================================================================ */
:root{
  /* LKE Brand */
  --lke-navy:        #012352;
  --lke-navy-2:      #0a2e62;
  --lke-blue:        #123B74;
  --lke-orange:      #EC652D;
  --lke-orange-dark: #c44e1a;
  --lke-orange-bg:   #fdf0e8;
  --lke-bg-light:    #f7f8fa;
  --lke-white:       #ffffff;
  --lke-grey-100:    #f2f2f2;
  --lke-grey-200:    #e4e7eb;
  --lke-grey-300:    #d6dae0;
  --lke-grey-500:    #6c727b;
  --lke-grey-700:    #424852;
  --lke-ink:         #1c2330;
  --lke-ok:          #2f7d4f;
  --lke-warn:        #b5790c;
  --lke-err:         #c0392b;
  --r-0: 0;
  --r-xs: 2px;
}
#lke-konfigurator{
  color:var(--lke-ink);
  font-size:15px;
  line-height:1.55;
}
#lke-konfigurator h1,#lke-konfigurator h2,#lke-konfigurator h3,#lke-konfigurator h4{
  font-weight:700;
  letter-spacing:-0.01em;
  line-height:1.18;
  color:var(--lke-navy);
  text-wrap:balance
}
#lke-konfigurator .mono,
#lke-konfigurator code,
#lke-konfigurator .tabular{
  font-family:'Avenir Next','Avenir','Montserrat',sans-serif;
  font-variant-numeric:tabular-nums
}
#lke-konfigurator button{font-family:inherit;cursor:pointer;touch-action:manipulation}
#lke-konfigurator input,
#lke-konfigurator select,
#lke-konfigurator textarea{
  font-family:inherit;
  touch-action:manipulation
}
#lke-konfigurator img{max-width:100%;display:block;height:auto}
#lke-konfigurator select{
  -webkit-appearance:menulist!important;
  -moz-appearance:menulist!important;
  appearance:auto!important;
  font-weight:400!important;
  background-image:none!important;
}


/* Skip link */
#lke-konfigurator .skip{position:absolute;left:-9999px;top:0;background:var(--lke-navy);color:#fff;padding:10px 16px;border-radius:0;z-index:1000;font-weight:600;font-size:13px;text-decoration:none}
#lke-konfigurator .skip:focus{left:0}

/* Screen-reader only */
#lke-konfigurator .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Globaler Focus-Ring */
#lke-konfigurator :focus{outline:none}
#lke-konfigurator :focus-visible{outline:2px solid var(--lke-orange);outline-offset:2px;border-radius:0}
#lke-konfigurator .btn:focus-visible,#lke-konfigurator .btn-s:focus-visible,#lke-konfigurator .opt:focus-visible,#lke-konfigurator .step:focus-visible{outline-offset:3px}

/* ============ TOPBAR ============ */
#lke-konfigurator .topbar{background:var(--lke-navy);color:#fff;padding:14px 0;border-bottom:1px solid #001637}
#lke-konfigurator .topbar .in{max-width:1240px;margin:0 auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
#lke-konfigurator .brand{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:#fff}
#lke-konfigurator .brand .logo-img{display:block;height:36px;width:auto;flex-shrink:0}
#lke-konfigurator .brand .tag{font-size:10.5px;letter-spacing:.18em;color:#8aa1c4;text-transform:uppercase;font-weight:600;padding-left:14px;border-left:1px solid rgba(255,255,255,.18);align-self:center;line-height:1.35}
@media (max-width:600px){
  #lke-konfigurator .brand .tag{display:none}
}
#lke-konfigurator .topbar .meta{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:#8aa1c4;letter-spacing:.06em}
#lke-konfigurator .topbar-right{display:flex;align-items:center;gap:14px}
#lke-konfigurator .code-search{display:inline-flex;align-items:center;gap:0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);height:32px;padding:0 4px 0 9px;transition:border-color .15s ease, background-color .15s ease}
#lke-konfigurator .code-search:focus-within{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.12)}
#lke-konfigurator .code-search.bad{border-color:var(--lke-err);background:rgba(192,57,43,.18);animation:csShake .25s ease}
@keyframes csShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
#lke-konfigurator .code-search .cs-ico{width:14px;height:14px;color:#8aa1c4;flex-shrink:0}
#lke-konfigurator .code-search input{background:transparent;border:0;color:#fff;font-size:12px;padding:0 8px;width:230px;outline:none;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;letter-spacing:.02em}
#lke-konfigurator .code-search input::placeholder{color:#8aa1c4;font-style:normal}
#lke-konfigurator .code-search input:focus{outline:none}
#lke-konfigurator .code-search .cs-go{background:transparent;border:0;color:#8aa1c4;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;font-weight:700;border-radius:0;transition:color .15s ease, background-color .15s ease}
#lke-konfigurator .code-search .cs-go:hover{color:#fff;background:rgba(255,255,255,.1)}
@media(max-width:760px){
  #lke-konfigurator .code-search input{width:140px}
}
@media(max-width:520px){
  #lke-konfigurator .code-search{display:none}
}
#lke-konfigurator .merk-btn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid rgba(255,255,255,.18);
  color:#fff;padding:7px 12px;border-radius:0;font-size:12.5px;font-weight:600;
  transition:background-color .15s ease, border-color .15s ease}
#lke-konfigurator .merk-btn:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4)}
#lke-konfigurator .merk-btn .ico{width:14px;height:14px;display:inline-block}
#lke-konfigurator .merk-btn .badge{background:var(--lke-orange);color:#fff;border-radius:99px;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;
  font-size:10px;padding:2px 7px;font-weight:700;min-width:18px;text-align:center;font-variant-numeric:tabular-nums}
#lke-konfigurator .merk-btn .badge.empty{background:rgba(255,255,255,.12);color:#8aa1c4}


/* ============ HEAD ============ */
#lke-konfigurator .head{max-width:1240px;margin:0 auto;padding:1rem 0 0;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
#lke-konfigurator .head-main{flex:1 1 480px;min-width:0}
#lke-konfigurator .kicker{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;letter-spacing:.18em;
  color:var(--lke-orange);font-weight:600}
#lke-konfigurator .head h1{font-size:32px;margin-top:10px;font-weight:800;line-height:1.12;color:var(--lke-navy)}
#lke-konfigurator .head .sub{color:var(--lke-grey-500);margin-top:14px;font-size:15px;max-width:920px}


/* Referenznummer-Lookup — lädt eine gespeicherte Konfiguration (?konfig=<uuid>) */
#lke-konfigurator .head-ref{display:inline-flex;align-items:center;gap:0;background:#fff;border:1.5px solid var(--lke-grey-300);
  border-radius:0;height:44px;padding:0 4px 0 14px;flex-shrink:0;margin-top:6px;
  transition:border-color .15s ease}
#lke-konfigurator .head-ref:focus-within{border-color:var(--lke-navy)}
#lke-konfigurator .head-ref.bad{border-color:var(--lke-err);animation:headRefShake .25s ease}
@keyframes headRefShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
#lke-konfigurator .head-ref input{background:transparent !important;border:0;color:var(--lke-ink);font-size:13px;padding:0 10px 0 0;
  width:220px;outline:none;font-family:'Montserrat',sans-serif}
#lke-konfigurator .head-ref input::placeholder{color:var(--lke-grey-500)}
#lke-konfigurator .head-ref .hr-go{background:var(--lke-navy);border:0;color:#fff;width:34px;height:34px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  transition:background-color .15s ease}
#lke-konfigurator .head-ref .hr-go:hover{background:var(--lke-navy-2)}
#lke-konfigurator .head-ref .hr-go svg{width:16px;height:16px;display:block}


/* ============ STEPPER ============ */
#lke-konfigurator .stepper{max-width:1240px;margin:24px auto 0;padding:0 28px;display:flex;gap:6px;flex-wrap:wrap}
#lke-konfigurator .step{flex:1;min-width:160px;background:#fff;border:1px solid var(--lke-grey-200);border-radius:0;
  padding:12px 14px;display:flex;gap:11px;align-items:center;text-align:left;
  transition:border-color .15s ease, background-color .15s ease}
#lke-konfigurator .step:hover{border-color:var(--lke-grey-300)}
#lke-konfigurator .step.active{border-color:var(--lke-orange);background:var(--lke-orange-bg)}
#lke-konfigurator .step .n{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--lke-grey-300);
  display:flex;align-items:center;justify-content:center;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;
  font-size:12px;font-weight:600;flex-shrink:0;color:var(--lke-grey-500);background:#fff;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease}
#lke-konfigurator .step.active .n{background:var(--lke-orange);border-color:var(--lke-orange);color:#fff}
#lke-konfigurator .step.done{border-color:var(--lke-ok);background:#eaf5ee}
#lke-konfigurator .step.done .n{background:var(--lke-ok);border-color:var(--lke-ok);color:transparent;font-size:0;position:relative}
#lke-konfigurator .step.done .n::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;color:#fff}
#lke-konfigurator .step.warn{border-color:var(--lke-err);background:#fdecea}
#lke-konfigurator .step.warn .n{background:var(--lke-err);border-color:var(--lke-err);color:transparent;font-size:0;position:relative}
#lke-konfigurator .step.warn .n::after{content:"!";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-weight:800;font-size:14px;color:#fff}
#lke-konfigurator .step.warn.active{border-color:var(--lke-err);background:#fdecea}
#lke-konfigurator .step .t{font-size:12.5px;font-weight:600;line-height:1.3;color:var(--lke-navy);min-width:0}
#lke-konfigurator .step .t small{display:block;font-weight:400;color:var(--lke-grey-500);font-size:11px;margin-top:3px;line-height:1.35}
#lke-konfigurator .step[disabled],#lke-konfigurator .step:disabled{opacity:.4;cursor:not-allowed;background:#fafbfd}
#lke-konfigurator .step:disabled:hover{border-color:var(--lke-grey-200)}
@media(max-width:600px){
  #lke-konfigurator .head-ref input{width:150px}
  #lke-konfigurator .stepper{padding: 0;}
}


/* Option-Warn-Hervorhebung */
#lke-konfigurator .opt.warn{border-color:var(--lke-err);background:#fdecea}
#lke-konfigurator .opt.warn.sel{border-color:var(--lke-err);background:#fdecea;box-shadow:0 0 0 2px rgba(192,57,43,.12)}
#lke-konfigurator .opt.warn .check{border-color:var(--lke-err)}
#lke-konfigurator .opt.warn.sel .check{background:var(--lke-err);border-color:var(--lke-err)}
#lke-konfigurator .opt.disabled-by-dep{opacity:.5;cursor:not-allowed;background:var(--lke-grey-100)}
#lke-konfigurator .opt.disabled-by-dep:hover{border-color:var(--lke-grey-200);background:var(--lke-grey-100)}
#lke-konfigurator .opt.disabled-by-dep .check{display:none}
#lke-konfigurator .dep-note{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--lke-grey-500);font-style:italic;margin-top:8px;padding:8px 10px;background:#fafbfd;border-left:3px solid var(--lke-grey-300)}
#lke-konfigurator .dep-note.dep-error{color:#7a1d11;background:#fdecea;border:1.5px solid var(--lke-err);border-left:4px solid var(--lke-err);font-style:normal;font-size:12.5px;align-items:center;flex-wrap:wrap}
#lke-konfigurator .dep-note.dep-error b{color:var(--lke-err)}
#lke-konfigurator .dep-note.dep-error > span:first-child{font-weight:800;color:var(--lke-err);min-width:14px;align-self:flex-start;padding-top:2px}
#lke-konfigurator .dep-note.dep-error > span:nth-child(2){flex:1 1 240px;min-width:0}
#lke-konfigurator .dep-ack{
  margin-left:auto;
  background:var(--lke-err);
  border:1.5px solid var(--lke-err);
  color:#fff;
  font-family:inherit;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.03em;
  text-transform:uppercase;
  padding:7px 12px;
  border-radius:0;
  cursor:pointer;
  flex-shrink:0;
  transition:background-color .15s ease,color .15s ease;
  max-width:100%;
  word-break:break-word;
}
#lke-konfigurator .dep-ack:hover{background:#7a1d11;border-color:#7a1d11}
#lke-konfigurator .dep-ack:focus-visible{outline:2px solid #fff;outline-offset:-3px}


/* Konkrete Rollentyp-Auswahl */
#lke-konfigurator .rollen-modell-wrap{margin-top:22px;padding-top:18px;border-top:1px solid var(--lke-grey-200)}
#lke-konfigurator .rollen-modell-wrap .rm-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
#lke-konfigurator .rollen-modell-wrap .rm-head h4{font-size:14.5px;font-weight:700;color:var(--lke-navy);letter-spacing:-0.005em}
#lke-konfigurator .rollen-modell-wrap .rm-head .rm-counter{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10.5px;color:var(--lke-grey-500);letter-spacing:.04em;font-weight:600}
#lke-konfigurator .rollen-modell-wrap .rm-intro{font-size:12.5px;color:var(--lke-grey-500);line-height:1.5;margin-bottom:12px}
#lke-konfigurator .rollen-modell-wrap .rm-intro b{color:var(--lke-warn);font-weight:600}
#lke-konfigurator .rollen-list{display:grid;gap:6px}
#lke-konfigurator .rollen-card{display:grid;grid-template-columns:24px 56px minmax(0,1fr) 150px 110px;gap:10px;align-items:center;padding:11px 13px;border:1.5px solid var(--lke-grey-200);background:#fff;cursor:pointer;font-family:inherit;color:inherit;text-align:left;font-size:13px;transition:border-color .15s ease, background-color .15s ease}
#lke-konfigurator .rollen-card:hover:not(.disabled){border-color:var(--lke-grey-300);background:#fafbfd}
#lke-konfigurator .rollen-card.sel{border-color:var(--lke-orange);background:var(--lke-orange-bg)}
#lke-konfigurator .rollen-card.disabled{opacity:.4;cursor:not-allowed;background:var(--lke-grey-100)}
#lke-konfigurator .rollen-card.disabled:hover{border-color:var(--lke-grey-200);background:var(--lke-grey-100)}

/* gewählt, aber durch spätere Änderung inkompatibel → Konflikt */
#lke-konfigurator .rollen-card.sel.disabled{opacity:1;border-color:var(--lke-err);background:#fdecea;cursor:pointer}
#lke-konfigurator .rollen-card.sel.disabled .rc-radio{background:var(--lke-err);border-color:var(--lke-err);box-shadow:inset 0 0 0 3px #fff}
#lke-konfigurator .rollen-card.sel.disabled .rc-name{color:var(--lke-err)}
#lke-konfigurator .rollen-card.sel.disabled .rc-reason{color:var(--lke-err);font-style:italic}
#lke-konfigurator .rollen-card .rc-radio{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--lke-grey-300);background:#fff;flex-shrink:0;position:relative}
#lke-konfigurator .rollen-card.sel .rc-radio{background:var(--lke-orange);border-color:var(--lke-orange);box-shadow:inset 0 0 0 3px #fff}
#lke-konfigurator .rollen-card .rc-info{min-width:0}
#lke-konfigurator .rollen-card .rc-name{display:block;font-weight:700;color:var(--lke-navy);font-size:13.5px;font-variant-numeric:tabular-nums}
#lke-konfigurator .rollen-card .rc-desc{display:block;font-size:11.5px;color:var(--lke-grey-500);margin-top:2px;line-height:1.4}
#lke-konfigurator .rollen-card .rc-tag{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10px;padding:3px 8px;background:#fff;border:1px solid var(--lke-grey-200);color:var(--lke-grey-700);border-radius:99px;letter-spacing:.04em;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:center;justify-self:end;min-width:0}
#lke-konfigurator .rollen-card .rc-tag.empty{visibility:hidden}
#lke-konfigurator .rollen-card.sel .rc-tag{background:#fff;border-color:#f4c4a3}
#lke-konfigurator .rollen-card.disabled .rc-reason{color:var(--lke-err);font-style:italic}
#lke-konfigurator .rollen-card .rc-reason{display:block;font-size:11px;margin-top:3px;color:var(--lke-grey-500)}
#lke-konfigurator .rollen-empty{padding:18px;text-align:center;color:var(--lke-grey-500);font-size:12.5px;border:1.5px dashed var(--lke-grey-300);background:#fff}
@media(max-width:760px){
  #lke-konfigurator .rollen-card{grid-template-columns:20px 48px 1fr;gap:8px}
  #lke-konfigurator .rollen-card .rc-thumb{width:48px;height:38px}
  #lke-konfigurator .rollen-card .rc-tag{grid-column:3;justify-self:start}
}

/* ============ LAYOUT ============ */
#lke-konfigurator .layout{max-width:1240px;margin:18px auto 60px;padding:0 28px;display:grid;
  grid-template-columns:1fr 340px;gap:22px;align-items:start}

@media(max-width:600px){
  #lke-konfigurator .layout{
    padding: 0;
  }
}

/* ============ PANEL ============ */
#lke-konfigurator .panel{background:#fff;border:1px solid var(--lke-grey-200);border-radius:0;padding:28px 32px;box-shadow:0 1px 0 rgba(1,35,82,.03)}
#lke-konfigurator .panel-step{display:none}
#lke-konfigurator .panel-step.show{display:block}
#lke-konfigurator .fieldset{margin-bottom:30px}
#lke-konfigurator .fieldset:last-child{margin-bottom:0}
#lke-konfigurator .flabel{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
#lke-konfigurator .flabel .fn{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-grey-500)}
#lke-konfigurator .flabel h3{font-size:17px;font-weight:700}
#lke-konfigurator .flabel .req{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10px;color:var(--lke-orange);
  letter-spacing:.08em;font-weight:600;text-transform:uppercase}
#lke-konfigurator .flabel.flabel-row{align-items:center;justify-content:flex-start;gap:12px}
#lke-konfigurator .flabel.flabel-row .info-btn{margin-left:auto}
#lke-konfigurator .info-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid var(--lke-navy);color:var(--lke-navy);font-family:inherit;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:7px 11px;cursor:pointer;border-radius:0;transition:background-color .15s ease,color .15s ease}
#lke-konfigurator .info-btn:hover{background:var(--lke-navy);color:#fff}
#lke-konfigurator .info-btn svg{width:14px;height:14px;flex-shrink:0}

/* Bodenarten-Modal */
#lke-konfigurator .modal.modal-wide{max-width:1200px}
#lke-konfigurator .boden-table-wrap{overflow-x:auto;border:1px solid var(--lke-grey-200)}
#lke-konfigurator .boden-table{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums}
#lke-konfigurator .boden-table thead{background:var(--lke-navy);color:#fff}
#lke-konfigurator .boden-table th{padding:10px 12px;text-align:left;font-weight:700;font-size:11px;border-left:0;border-right:0;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;background:var(--lke-navy)}
#lke-konfigurator .boden-table td{padding:12px 12px;border-top:1px solid var(--lke-grey-200);border-left:0;border-right:0;vertical-align:middle;color:var(--lke-grey-700)}
#lke-konfigurator .boden-table td.b-img-cell{padding:8px 10px;width:96px}
#lke-konfigurator .b-img{display:block;width:80px;height:80px;border:1px solid var(--lke-grey-200);overflow:hidden;line-height:0;background:#fff}
#lke-konfigurator .b-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
#lke-konfigurator .boden-table tbody tr:nth-child(even){background:#fafbfd}
#lke-konfigurator .boden-table tbody tr:hover{background:var(--lke-orange-bg)}
#lke-konfigurator .boden-table td.b-name{font-weight:700;color:var(--lke-navy);white-space:nowrap}
#lke-konfigurator .boden-table .cat{display:inline-block;font-size:10.5px;font-weight:700;padding:3px 8px;letter-spacing:.04em;text-transform:uppercase;border-radius:99px;white-space:nowrap}
#lke-konfigurator .boden-table .cat-innen{background:#e6f1fb;color:#1d4f86;border:1px solid #b6d2eb}
#lke-konfigurator .boden-table .cat-aussen{background:#fdf0e8;color:#a3491b;border:1px solid #f4c4a3}
#lke-konfigurator .boden-table .none{color:var(--lke-grey-500);font-style:italic}
#lke-konfigurator .boden-table td small{color:var(--lke-grey-500);font-size:10.5px}
@media(max-width:680px){
  #lke-konfigurator .boden-table th,#lke-konfigurator .boden-table td{padding:8px 9px;font-size:11.5px}
}

/* ============ OPTION CARDS ============ */
#lke-konfigurator .opts{display:grid;gap:10px}
#lke-konfigurator .opts.c2{grid-template-columns:1fr 1fr}
#lke-konfigurator .opts.c3{grid-template-columns:1fr 1fr 1fr}
#lke-konfigurator .opts.c4{grid-template-columns:repeat(4,1fr)}
#lke-konfigurator .opt{border:1.5px solid var(--lke-grey-200);border-radius:0;background:#fff;
  padding:14px 38px 14px 15px;text-align:left;position:relative;font-family:inherit;color:inherit;
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-height:74px;
  transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease}
#lke-konfigurator .opt:hover{border-color:var(--lke-grey-300);background:#fafbfd}
#lke-konfigurator .opt.sel{border-color:var(--lke-orange);background:var(--lke-orange-bg)}
#lke-konfigurator .opt .ot{display:block;font-weight:700;font-size:14.5px;color:var(--lke-navy);font-family:'Montserrat',sans-serif;line-height:1.25;font-variant-numeric:tabular-nums}
#lke-konfigurator .opt .od{display:block;color:var(--lke-grey-500);font-size:12.5px;line-height:1.45;text-wrap:pretty}
#lke-konfigurator .opt .ocode{display:block;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10px;color:var(--lke-grey-500);margin-top:2px;letter-spacing:.04em}
#lke-konfigurator .opt .check{position:absolute;top:13px;right:13px;width:18px;height:18px;border-radius:50%;
  border:1.5px solid var(--lke-grey-300);background:#fff;transition:background-color .15s ease, border-color .15s ease}
#lke-konfigurator .opt.sel .check{background:var(--lke-orange);border-color:var(--lke-orange)}
#lke-konfigurator .opt.sel .check::after{content:"✓";color:#fff;font-size:11px;position:absolute;top:0;left:3.5px;font-weight:700}
#lke-konfigurator .opt .badge{display:inline-block;background:var(--lke-orange);color:#fff;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;
  font-size:9.5px;padding:2.5px 7px;border-radius:0;margin-top:2px;letter-spacing:.06em;font-weight:600;text-transform:uppercase}

/* ============ BILD-PLATZHALTER (Vorschau folgt) ============ */
#lke-konfigurator .ph{display:block;flex-shrink:0;background:#e9ecf0;border:1px dashed var(--lke-grey-300);position:relative;overflow:hidden}
#lke-konfigurator .ph::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(255,255,255,.6) 0%, rgba(1,35,82,.04) 100%)}
#lke-konfigurator .ph::after{content:"";position:absolute;inset:0;opacity:.4;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c727b' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='14'/%3E%3Ccircle cx='8.5' cy='10' r='1.5'/%3E%3Cpath d='M3 17l5-5 4 4 3-3 6 6'/%3E%3C/svg%3E") center/26px no-repeat}
#lke-konfigurator .opt-thumb{width:100%;aspect-ratio:5/2;max-height:96px;margin-bottom:3px}
#lke-konfigurator .rc-thumb{width:56px;height:44px}

/* Bild links, Optionen rechts untereinander (Klemmbrett, Dokumententasche) */
#lke-konfigurator .media-opts{display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px;align-items:stretch}
#lke-konfigurator .media-opts .mo-img{width:100%;height:100%;min-height:160px}
#lke-konfigurator .media-opts .opts{grid-template-columns:1fr}
#lke-konfigurator .media-opts .opt{min-height:0;padding-top:11px;padding-bottom:11px}
@media(max-width:760px){
  #lke-konfigurator .media-opts{grid-template-columns:1fr}
  #lke-konfigurator .media-opts .mo-img{max-width:240px;min-height:0;aspect-ratio:4/3}
  #lke-konfigurator .opts.c2{grid-template-columns:1fr;}
}
@media(max-width:600px){
  #lke-konfigurator .opt-thumb{max-height:72px}
}


/* hint — Farbcodierung: neutral grau (Info), gelb (Hinweis), rot (Konflikt/Error) */
#lke-konfigurator .hint{display:flex;gap:11px;background:#f4f5f7;border:1px solid var(--lke-grey-200);border-left:3px solid var(--lke-grey-300);
  padding:11px 14px;border-radius:0;margin-top:14px;font-size:13px;color:var(--lke-grey-700)}
#lke-konfigurator .hint b{color:var(--lke-navy)}
#lke-konfigurator .hint .hi{flex-shrink:0;width:18px;display:inline-flex;align-items:flex-start;justify-content:center;font-weight:700;line-height:1.4}
#lke-konfigurator .hint.accent{border-color:var(--lke-orange);background:var(--lke-orange-bg);border-left-color:var(--lke-orange)}
#lke-konfigurator .hint.warn{border-color:#e9d18a;background:#fff8e6;border-left-color:var(--lke-warn);color:#5b4307}
#lke-konfigurator .hint.warn .hi{color:var(--lke-warn)}
#lke-konfigurator .hint.error{border:1.5px solid var(--lke-err);background:#fdecea;border-left-width:4px;color:#7a1d11}
#lke-konfigurator .hint.error b{color:var(--lke-err)}
#lke-konfigurator .hint.error .hi{color:var(--lke-err)}

/* ============ CHECKBOX-BOXEN (Beratung, Grundboden, Datenschutz) ============ */
#lke-konfigurator .advisory{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 14px;
  background:var(--lke-bg-light);border:1px solid var(--lke-grey-200);cursor:pointer;
  font-size:13px;color:var(--lke-grey-700)}
#lke-konfigurator .advisory input[type="checkbox"]{accent-color:var(--lke-orange);width:16px;height:16px;
  margin-top:2px;flex-shrink:0}
#lke-konfigurator .advisory b{color:var(--lke-navy)}

/* Direkt unter einem Label platziert — kein Abstand nach oben, dafür nach unten. */
#lke-konfigurator .advisory.flush{margin-top:0;margin-bottom:14px}

/* Klappt darunter das Optionsfeld auf, sitzt es bündig an der Box (muss nach .flush stehen). */
#lke-konfigurator .advisory.joined{margin-bottom:0}

/* Ausgegraut, wenn die Option gerade nicht wählbar ist (Grundboden vs. Sondertief). */
#lke-konfigurator .advisory.locked{opacity:.5}

/* Der Text kommt teils aus dem WYSIWYG-Editor und bringt <p> mit — die sollen
   hier nicht umbrechen oder Abstände erzeugen. */
#lke-konfigurator .advisory-text p{display:inline;margin:0;padding:0}

/* ESD-Widerstandswert — Platzhalter (Wert folgt) */
#lke-konfigurator .esd-ohm{display:inline-block;margin-top:5px;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10.5px;color:var(--lke-grey-500);border:1px dashed var(--lke-grey-300);padding:1px 7px;letter-spacing:.02em}
#lke-konfigurator .esd-ohm em{font-style:normal;color:var(--lke-warn);font-weight:600}

/* Haftungsausschluss-Bestätigung (Fußschutz-Abwahl) */
#lke-konfigurator .haftung-ack{display:flex;gap:9px;align-items:flex-start;margin-top:11px;font-weight:600;color:#7a1d11;cursor:pointer;font-size:12.5px;line-height:1.4}
#lke-konfigurator .haftung-ack input{accent-color:var(--lke-err);width:16px;height:16px;margin-top:1px;flex-shrink:0}

/* Boden-Visualisierung: ganzes Bild zoombar (Cursor) */
#lke-konfigurator .opt-thumb,#lke-konfigurator .rc-thumb,#lke-konfigurator .mo-img,#lke-konfigurator .b-img,#lke-konfigurator .zoom-wrap{cursor:zoom-in}

/* Bodentypen-Legende unter der Live-Seitenansicht */
#lke-konfigurator .cv-floor-legend{margin-top:10px;padding-top:9px;border-top:1px solid var(--lke-grey-200);display:flex;flex-direction:column;gap:5px}
#lke-konfigurator .cv-floor-legend:empty{display:none}
#lke-konfigurator .cv-floor-legend .lg-it{display:flex;align-items:center;gap:8px;font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10.5px;color:var(--lke-grey-700);line-height:1.2}
#lke-konfigurator .cv-floor-legend .lg-it svg{width:38px;height:16px;flex-shrink:0}

/* ============ HERO IM PANEL (Step 1+) ============ */
#lke-konfigurator .heroline{display:grid;grid-template-columns:96px 1fr;gap:20px;align-items:center;margin-bottom:26px;
  padding-bottom:22px;border-bottom:1px solid var(--lke-grey-200)}
#lke-konfigurator .heroline .img-box{background:#fff;border:1.5px solid var(--lke-navy);border-radius:0;
  aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:14px;position:relative}
#lke-konfigurator .heroline .img-box::before{content:"";position:absolute;left:-1.5px;right:-1.5px;bottom:-1.5px;height:4px;background:var(--lke-orange)}
#lke-konfigurator .heroline .img-box svg{width:100%;height:100%;display:block;color:var(--lke-navy)}
#lke-konfigurator .heroline .ti{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-orange);letter-spacing:.14em;text-transform:uppercase;font-weight:600}
#lke-konfigurator .heroline h2{font-size:23px;margin-top:4px;font-weight:800}
#lke-konfigurator .heroline .desc{color:var(--lke-grey-500);font-size:13.5px;margin-top:5px}

/* ============ FLOOR BUILDER ============ */
#lke-konfigurator .fb-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:16px}
#lke-konfigurator .fb-count{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:12px;color:var(--lke-grey-500)}
#lke-konfigurator .fb-count b{color:var(--lke-orange);font-size:15px}
#lke-konfigurator .fb-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#lke-konfigurator .fb-controls label{display:inline-flex;align-items:center}
#lke-konfigurator .fb-spacing{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px;padding:10px 13px;background:var(--lke-bg-light);border:1px solid var(--lke-grey-200)}
#lke-konfigurator .fb-spacing label{display:inline-flex;align-items:center}
#lke-konfigurator .fb-spacing-note{font-size:11.5px;color:var(--lke-grey-500);line-height:1.4;flex:1 1 200px;min-width:0}
#lke-konfigurator .fb-section-label{font-size:10.5px;font-weight:700;color:var(--lke-grey-500);text-transform:uppercase;letter-spacing:.09em;margin:16px 0 6px}
#lke-konfigurator .fb-section-label:first-child{margin-top:0}
#lke-konfigurator .fb-quick{display:flex;gap:8px}
#lke-konfigurator .fb-quick #qbType{flex:1;min-width:0}
#lke-konfigurator .fb-quick #qbCount{flex:0 0 84px}
#lke-konfigurator .fb-quick .btn-s{white-space:nowrap}
#lke-konfigurator .fb-quick-note{font-size:11px;color:var(--lke-grey-500);line-height:1.45;margin-top:7px}
#lke-konfigurator .fb-add{display:flex;gap:8px}
#lke-konfigurator .fb-add select{flex:1;min-width:0}
#lke-konfigurator .fb-add .btn-s{white-space:nowrap}
#lke-konfigurator .fb-distribute{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--lke-grey-200);
}
#lke-konfigurator .fb-distribute label{display:inline-flex;align-items:center}
#lke-konfigurator .fb-distribute .btn-s{margin-left:auto;white-space:nowrap}
#lke-konfigurator .fb-distribute-note{font-size:11px;color:var(--lke-grey-500);line-height:1.45;margin-top:7px}
#lke-konfigurator .mini-sel{font-size:12.5px;border:1px solid var(--lke-grey-300);border-radius:0;padding:7px 9px;background:#fff;color:var(--lke-ink);transition:border-color .15s ease;min-width: 90px;}
#lke-konfigurator .btn-s{font-size:12px;font-weight:700;padding:9px 16px;border-radius:0;border:1.5px solid var(--lke-navy);background:#fff;color:var(--lke-navy);text-transform:uppercase;letter-spacing:.04em;transition:background-color .15s ease, color .15s ease, border-color .15s ease}
#lke-konfigurator .btn-s:hover{background:var(--lke-navy);color:#fff}
#lke-konfigurator .btn-s.primary{background:var(--lke-orange);border-color:var(--lke-orange);color:#fff}
#lke-konfigurator .btn-s.primary:hover{background:var(--lke-orange-dark);border-color:var(--lke-orange-dark)}
#lke-konfigurator .btn-s:disabled{opacity:.4;cursor:not-allowed}
#lke-konfigurator .btn-s:disabled:hover{background:#fff;color:var(--lke-navy)}
#lke-konfigurator .btn-s.primary:disabled:hover{background:var(--lke-orange);color:#fff}
#lke-konfigurator .fb-grid{display:grid;grid-template-columns:1fr 240px;gap:20px;align-items:start}
#lke-konfigurator .floor-list{display:flex;flex-direction:column;gap:9px}
#lke-konfigurator .floor-row{border:1px solid var(--lke-grey-200);border-radius:0;padding:12px 13px 28px;background:#fafbfd;position:relative}
#lke-konfigurator .floor-row.dragging{opacity:.55;border-style:dashed;background:#fff}
#lke-konfigurator .floor-row.drop-target{border-color:var(--lke-orange);background:var(--lke-orange-bg);box-shadow:inset 0 -3px 0 var(--lke-orange)}
#lke-konfigurator .fr-move{position:absolute;right:6px;bottom:6px;border:1px solid var(--lke-grey-200);background:#fff;color:var(--lke-grey-500);width:26px;height:22px;display:inline-flex;align-items:center;justify-content:center;cursor:grab;border-radius:0;font-size:14px;line-height:1;padding:0;user-select:none;touch-action:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
#lke-konfigurator .fr-move:hover{background:var(--lke-navy);border-color:var(--lke-navy);color:#fff}
#lke-konfigurator .fr-move:active{cursor:grabbing;background:var(--lke-orange);border-color:var(--lke-orange);color:#fff}
#lke-konfigurator .fr-move svg{width:14px;height:14px;display:block}
#lke-konfigurator .floor-row .fr-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
#lke-konfigurator .floor-row .fr-tag{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-orange);font-weight:600;letter-spacing:.04em}
#lke-konfigurator .fr-del{border:none;background:none;color:var(--lke-grey-500);font-size:16px;line-height:1;padding:2px 5px;border-radius:0}
#lke-konfigurator .fr-del:hover{color:var(--lke-err);background:var(--lke-grey-100)}
#lke-konfigurator .fr-fields{display:grid;grid-template-columns:1fr 130px;gap:7px}
#lke-konfigurator .fr-fields select{width:100%;font-family:inherit;font-size:12.5px;border:1px solid var(--lke-grey-300);border-radius:0;padding:7px 8px;background:#fff;color:var(--lke-ink)}
#lke-konfigurator .fr-checks{display:flex;gap:16px;margin-top:10px;flex-wrap: wrap;}
#lke-konfigurator .fr-checks label{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--lke-grey-700);cursor:pointer}
#lke-konfigurator .fr-checks input{accent-color:var(--lke-orange);width:15px;height:15px}
#lke-konfigurator .fr-err{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-err);margin-top:8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#lke-konfigurator .fr-fix-group{display:inline-flex;gap:6px;flex-wrap:wrap}
#lke-konfigurator .fr-fix{background:var(--lke-orange);border:none;color:#fff;font-family:'Montserrat',sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:5px 10px;border-radius:0;cursor:pointer;flex-shrink:0;transition:background-color .15s ease}
#lke-konfigurator .fr-fix:hover{background:var(--lke-orange-dark)}
#lke-konfigurator .fr-fix:focus-visible{outline:2px solid var(--lke-navy);outline-offset:2px}
#lke-konfigurator .fb-empty{border:1.5px dashed var(--lke-grey-300);border-radius:0;padding:28px;text-align:center;color:var(--lke-grey-500);font-size:13.5px}
#lke-konfigurator .cart-vis{position:sticky;top:14px;border:1px solid var(--lke-grey-200);border-radius:0;background:#fafbfd;padding:14px}
#lke-konfigurator .cart-vis .cv-title{font-size:10.5px;color:var(--lke-grey-500);letter-spacing:.08em;text-align:center;margin-bottom:8px;font-weight:600}
#lke-konfigurator .cart-vis svg{width:100%;height:auto;display:block}
#lke-konfigurator .cv-legend{font-size:10px;color:var(--lke-grey-500);display:flex;justify-content:space-between;margin-top:8px}
#lke-konfigurator .raster-note{background:var(--lke-bg-light);border:1px solid #c9deef;border-radius:0;padding:13px 16px;font-size:12.5px;color:var(--lke-navy);margin-top:16px;line-height:1.6}
#lke-konfigurator .raster-note b{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-orange)}

/* ============ SUMMARY ============ */
#lke-konfigurator .summary{background:#fff;border:1px solid var(--lke-grey-200);border-radius:0;position:sticky;top:14px;overflow:hidden;box-shadow:0 1px 0 rgba(1,35,82,.03)}
#lke-konfigurator .sum-head{background:var(--lke-navy);color:#fff;padding:16px 20px}
#lke-konfigurator .sum-head .m{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10px;color:#8aa1c4;letter-spacing:.14em;font-weight:600;text-transform:uppercase}
#lke-konfigurator .sum-head h3{font-size:17px;margin-top:3px;color:#fff;font-weight:700;}
#lke-konfigurator .sum-head .pp{font-size:12.5px;color:#b6c5dc;margin-top:4px}

/* Produktfoto als Kopf des Datenblatts (Summary-Sidebar) */
#lke-konfigurator .sum-photo{background:#fafbfd;padding:18px 20px 14px;display:flex;align-items:center;justify-content:center;
  min-height:160px;position:relative}
#lke-konfigurator .sum-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--lke-orange)}
#lke-konfigurator .sum-photo img{max-height:170px;width:auto;max-width:80%;object-fit:contain;mix-blend-mode:multiply}
#lke-konfigurator .sum-body{padding:6px 20px 14px}
#lke-konfigurator .sum-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--lke-grey-200);font-size:13px;font-variant-numeric:tabular-nums}
#lke-konfigurator .sum-row:last-of-type{border-bottom:none}
#lke-konfigurator .sum-row .k{color:var(--lke-grey-500);font-size:12px;flex:0 0 auto}
#lke-konfigurator .sum-row .v{text-align:right;font-weight:600;font-family:'Montserrat',sans-serif;color:var(--lke-navy);min-width:0;word-break:break-word}
#lke-konfigurator .sum-row .v.empty{color:var(--lke-grey-500);font-weight:400}
#lke-konfigurator .sum-code{background:var(--lke-bg-light);border-top:1px solid var(--lke-grey-200);padding:13px 20px}
#lke-konfigurator .sum-code .cl{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:10px;color:var(--lke-grey-500);letter-spacing:.08em;font-weight:600}
#lke-konfigurator .sum-code .cv{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:12px;font-weight:600;
  word-break:break-all;margin-top:4px;color:var(--lke-navy)}

/* ============ FORM (Step 5) ============ */
#lke-konfigurator .lke-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
#lke-konfigurator .formgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#lke-konfigurator .field{display:flex;flex-direction:column}
#lke-konfigurator .field.full{grid-column:1/-1}
#lke-konfigurator .field label{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-grey-500);
  letter-spacing:.06em;margin-bottom:6px;font-weight:600;text-transform:uppercase}
#lke-konfigurator .rq{color:var(--lke-orange)}
#lke-konfigurator .field input,#lke-konfigurator .field textarea{
  font-family:'Montserrat',sans-serif;
  font-size:14px;
  border:1.5px solid var(--lke-grey-200) !important;
  border-radius:0;
  padding:10px 12px !important;
  background:#fff !important;
  color:var(--lke-ink);
  transition:border-color .15s ease, box-shadow .15s ease;
}
#lke-konfigurator .field input:focus-visible,#lke-konfigurator .field textarea:focus-visible{outline:none;border-color:var(--lke-orange);box-shadow:0 0 0 3px rgba(236,101,45,.18)}
#lke-konfigurator .field textarea{resize:vertical;min-height:80px}
#lke-konfigurator .recap{background:#fafbfd;border:1px solid var(--lke-grey-200);border-radius:0;padding:18px 22px;margin-bottom:18px}
#lke-konfigurator .recap h3{font-size:16px;margin-bottom:12px}
#lke-konfigurator .recap-ref{font-size:12.5px;color:var(--lke-grey-500);margin-bottom:12px;word-break:break-all}
#lke-konfigurator .recap-ref b{color:var(--lke-navy);font-weight:600}
#lke-konfigurator .recap .rl{display:flex;justify-content:space-between;gap:16px;padding:7px 0;font-size:13px;border-bottom:1px dotted var(--lke-grey-200);font-variant-numeric:tabular-nums}
#lke-konfigurator .recap .rl:last-child{border-bottom:none}
#lke-konfigurator .recap .rl .rk{color:var(--lke-grey-500);flex:0 0 auto}
#lke-konfigurator .recap .rl .rv{font-weight:600;text-align:right;color:var(--lke-navy);min-width:0;word-break:break-word}

#lke-konfigurator .confirm{text-align:center;padding:34px 20px}
#lke-konfigurator .confirm .ico{width:60px;height:60px;border-radius:50%;background:var(--lke-ok);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto 16px;font-weight:700}
#lke-konfigurator .confirm h2{font-size:24px;color:var(--lke-navy)}
#lke-konfigurator .confirm p{color:var(--lke-grey-500);margin-top:9px;font-size:14px}

/* ============ NAV ============ */
#lke-konfigurator .navbar{display:flex;justify-content:space-between;margin-top:26px;gap:12px}
#lke-konfigurator .btn{font-family:'Montserrat',sans-serif;font-size:14px;font-weight:600;padding:13px 26px;
  border-radius:0;border:1.5px solid var(--lke-navy);display:inline-flex;align-items:center;gap:9px;cursor:pointer;
  transition:background-color .14s ease, color .14s ease, border-color .14s ease;text-transform:uppercase;letter-spacing:.03em}
#lke-konfigurator .btn-back{background:#fff;color:var(--lke-navy)}
#lke-konfigurator .btn-back:hover{background:var(--lke-bg-light)}

/* Primary CTA: Solid Orange, ohne Split, ohne Outline */
#lke-konfigurator .btn-next{background:var(--lke-orange);border:none;color:#fff;margin-left:auto;padding:14px 32px}
#lke-konfigurator .btn-next:hover{background:var(--lke-orange-dark)}
#lke-konfigurator .btn:disabled{opacity:.35;cursor:not-allowed}
#lke-konfigurator .actions-end{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap}

/* ============ FOOTER NOTES ============ */
#lke-konfigurator .protonote{max-width:1240px;margin:0 auto 50px;padding:0 28px}
#lke-konfigurator .protonote div{background:#fff8e6;border:1px solid #e9d9a0;border-radius:0;padding:13px 18px;
  font-size:12.5px;color:#5b4307;line-height:1.55}
#lke-konfigurator .protonote b{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px}

/* ============ MERKZETTEL MODAL ============ */
#lke-konfigurator .modal-backdrop{position:fixed;inset:0;background:rgba(1,35,82,.55);z-index:100000;display:none;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto;overscroll-behavior:contain}
#lke-konfigurator .modal-backdrop.open{display:flex}
#lke-konfigurator .modal{background:#fff;border-radius:0;max-width:760px;width:100%;box-shadow:0 24px 60px -20px rgba(1,35,82,.5);overflow:hidden;animation:modalIn .18s ease}
@keyframes modalIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
#lke-konfigurator .modal-head{background:var(--lke-navy);color:#fff;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;gap:14px}
#lke-konfigurator .modal-head h2{color:#fff;font-size:18px;font-weight:700}
#lke-konfigurator .modal-head .close{background:transparent;border:1px solid rgba(255,255,255,.25);color:#fff;width:32px;height:32px;border-radius:0;font-size:18px;line-height:1;display:inline-flex;align-items:center;justify-content:center;
  transition:background-color .15s ease, border-color .15s ease}
#lke-konfigurator .modal-head .close:hover{background:rgba(255,255,255,.1)}
#lke-konfigurator .modal-body{padding:22px 24px;max-height:60vh;overflow-y:auto}
#lke-konfigurator .modal-foot{padding:14px 24px;background:#fafbfd;border-top:1px solid var(--lke-grey-200);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;align-items:center}
#lke-konfigurator .modal-empty{padding:36px 20px;text-align:center;color:var(--lke-grey-500);font-size:13.5px;border:1.5px dashed var(--lke-grey-300);border-radius:0}
#lke-konfigurator .merk-list{display:flex;flex-direction:column;gap:10px}
#lke-konfigurator .merk-item{border:1px solid var(--lke-grey-200);border-radius:0;padding:14px 16px;background:#fff;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
#lke-konfigurator .merk-item .mi-main{min-width:0}
#lke-konfigurator .merk-item .mi-label{font-weight:700;color:var(--lke-navy);font-size:14px;margin-bottom:4px}
#lke-konfigurator .merk-item .mi-code{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-grey-700);word-break:break-all;font-variant-numeric:tabular-nums}
#lke-konfigurator .merk-item .mi-meta{font-size:11.5px;color:var(--lke-grey-500);margin-top:4px;font-variant-numeric:tabular-nums}
#lke-konfigurator .merk-item .mi-actions{display:flex;gap:6px;flex-shrink:0}
#lke-konfigurator .merk-item .mi-actions button{font-family:'Montserrat',sans-serif;font-size:12px;font-weight:600;padding:7px 11px;border-radius:0;border:1.5px solid var(--lke-grey-300);background:#fff;color:var(--lke-navy);
  transition:background-color .15s ease, border-color .15s ease, color .15s ease}
#lke-konfigurator .merk-item .mi-actions button:hover{border-color:var(--lke-navy);background:var(--lke-navy);color:#fff}
#lke-konfigurator .merk-item .mi-actions .danger:hover{border-color:var(--lke-err);background:var(--lke-err);color:#fff}
#lke-konfigurator .sitefoot{background:var(--lke-navy);color:#8aa1c4;padding:20px 0;font-size:12px;position:fixed;bottom:0;left:0;right:0;z-index:50}
#lke-konfigurator .sitefoot .in{max-width:1240px;margin:0 auto;padding:0 28px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
#lke-konfigurator .sitefoot a{color:#b6c5dc;text-decoration:none}
#lke-konfigurator .sitefoot a:hover{color:#fff}

/* ============ RESPONSIVE ============ */
@media(max-width:1000px){
  #lke-konfigurator .layout{grid-template-columns:1fr}
  #lke-konfigurator .summary{position:static}
  #lke-konfigurator .fb-grid{grid-template-columns:1fr}
  #lke-konfigurator .cart-vis{position:static;max-width:100%;}
  #lke-konfigurator .opts.c4{grid-template-columns:1fr 1fr}
  #lke-konfigurator .formgrid{grid-template-columns:1fr}
  #lke-konfigurator .heroline{grid-template-columns:60px 1fr;gap:14px}
}
@media(max-width:600px){
  #lke-konfigurator .panel{padding:22px 18px}
  #lke-konfigurator .head h1{font-size:26px}
  #lke-konfigurator .step{min-width:130px}
  #lke-konfigurator .opts.c3,#lke-konfigurator .opts.c4{grid-template-columns:1fr;}
}


/* ============ PRINT (PDF-Export) ============ */
@page {size:A4;margin:14mm 12mm}
@media print{
  * {
    print-color-adjust:exact;
    -webkit-print-color-adjust:exact
  }
  body{background:#fff;color:#000;font-size:11pt;line-height:1.45}
  .topbar,
  .stepper,
  .summary,
  .navbar,
  .protonote,
  .sitefoot,
  .head .sub,
  .panel-step:not(.show),
  .heroline,
  .modal-backdrop,
  .skip,
  #reqArea,
  #confirmArea,
  .fb-controls,
  .cv-legend,
  .opt .check,
  .btn,
  .btn-s,
  .head-ref,
  #fastcontact_holder,
  #usercentrics-root,
  #cartSvg,
  .cart-vis,
  #lightbox {
    display:none !important;
  }
  #lke-konfigurator .layout{grid-template-columns:1fr;margin:0;padding:0;gap:0;display:block}
  #lke-konfigurator .panel{border:none;padding:0;box-shadow:none}
  #lke-konfigurator .head{padding:0 0 6mm 0;border-bottom:2px solid var(--lke-navy);margin-bottom:6mm}
  #lke-konfigurator .head h1{font-size:20pt}
  #lke-konfigurator .head .kicker{font-size:9pt;color:var(--lke-orange)}
  #lke-konfigurator .recap{background:#fff;border:1px solid var(--lke-grey-200);padding:0;margin:0 0 6mm 0}
  #lke-konfigurator .recap h3{padding:8pt 10pt;background:var(--lke-navy);color:#fff;font-size:11pt;border-radius:0}
  #lke-konfigurator .recap .rl{padding:5pt 10pt;font-size:10pt}
  #lke-konfigurator .recap-ref{padding:6pt 10pt 0;margin-bottom:4pt;font-size:9.5pt}
  #lke-konfigurator .panel-step.show{display:block}
  
  /* Print-Header */
  #lke-konfigurator .print-header{display:flex!important;justify-content:space-between;align-items:center;
      padding-bottom:4mm;border-bottom:2px solid var(--lke-navy);margin-bottom:6mm}
  #lke-konfigurator .print-header .pl{font-weight:800;font-size:16pt;color:var(--lke-navy);letter-spacing:.02em}
  #lke-konfigurator .print-header .pl span{background:var(--lke-orange);color:#fff;padding:2pt 6pt;border-radius:0;margin-right:6pt}
  #lke-konfigurator .print-header .pr{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:9pt;color:var(--lke-grey-700);text-align:right;font-variant-numeric:tabular-nums}
    
  /* Print-Footer */
  #lke-konfigurator .print-footer{
    display:block!important;
    margin-top:8mm;
    padding-top:4mm;
    border-top:1px solid var(--lke-grey-300);
    font-size:8.5pt;
    color:var(--lke-grey-700)
  }
  #lke-konfigurator .print-footer p{margin-bottom:1mm}
  #lke-konfigurator .print-svg{margin:4mm 0;padding:4mm;border:1px solid var(--lke-grey-200);border-radius:0;background:#fafbfd}
  #lke-konfigurator .print-svg svg{max-width:80mm;height:auto;display:block;margin:0 auto}
  #lke-konfigurator .print-svg .ti{
    font-size:9pt;
    color:var(--lke-grey-500);
    text-align:center;
    margin-bottom:2mm
  }
}

/* Hidden außerhalb print */
#lke-konfigurator .print-header,#lke-konfigurator .print-footer,#lke-konfigurator .print-svg{display:none}

/* ===== Bild-Zoom / Lightbox ===== */
#lke-konfigurator .zoom-wrap{position:relative;display:block}
#lke-konfigurator .sum-photo>.zoom-wrap{max-width:100%;display:flex;align-items:center;justify-content:center}
#lke-konfigurator .b-img>.zoom-wrap{width:100%;height:100%;display:block}
#lke-konfigurator .b-img.ph{position:relative}
#lke-konfigurator .zoom-btn{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;border:none;background:rgba(1,35,82,.82);color:#fff;cursor:zoom-in;opacity:0;transition:opacity .15s ease;display:flex;align-items:center;justify-content:center;z-index:6;padding:0}
#lke-konfigurator .b-img .zoom-btn{width:24px;height:24px;top:4px;right:4px}
#lke-konfigurator .zoom-wrap:hover .zoom-btn,#lke-konfigurator .cart-vis:hover .zoom-btn,#lke-konfigurator .b-img:hover .zoom-btn,#lke-konfigurator .zoom-btn:focus-visible{opacity:1}
#lke-konfigurator .zoom-btn:hover{background:var(--lke-orange)}
#lke-konfigurator .zoom-btn svg{width:15px;height:15px;display:block}
#lke-konfigurator .b-img .zoom-btn svg{width:13px;height:13px}

/* Platzhalter-Produktbilder (Auswahl, Gruppen-Vorschau, Recap) zoombar */
#lke-konfigurator .zoomable-ph{position:relative}
#lke-konfigurator .zoomable-ph:hover .zoom-btn,#lke-konfigurator .zoomable-ph:focus-within .zoom-btn{opacity:1}
#lke-konfigurator .opt-thumb .zoom-btn,#lke-konfigurator .rc-thumb .zoom-btn{width:22px;height:22px;top:5px;right:5px}
#lke-konfigurator .opt-thumb .zoom-btn svg,#lke-konfigurator .rc-thumb .zoom-btn svg{width:12px;height:12px}

/* Lightbox-Platzhalterkarte (Bauteil-Vorschau folgt) */
#lke-konfigurator .lb-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  width:min(60vw,420px);aspect-ratio:4/3;background:var(--lke-bg-light);border:1px dashed var(--lke-grey-300)}
#lke-konfigurator .lb-ph-ic{width:74px;height:74px;color:var(--lke-grey-500)}
#lke-konfigurator .lb-ph-ic svg{width:100%;height:100%}
#lke-konfigurator .lb-ph-nm{font-weight:700;color:var(--lke-navy);font-size:18px;text-align:center;padding:0 18px}
#lke-konfigurator .lb-ph-sub{font-family:'Avenir Next','Avenir','Montserrat',sans-serif;font-size:11px;color:var(--lke-grey-500);text-transform:uppercase;letter-spacing:.12em}
#lke-konfigurator .lb-backdrop{position:fixed;inset:0;background:rgba(1,35,82,.8);display:none;align-items:center;justify-content:center;z-index:100001;padding:34px}
#lke-konfigurator .lb-backdrop.open{display:flex}
#lke-konfigurator .lb-content{position:relative;background:#fff;padding:12px;box-shadow:0 24px 70px rgba(0,0,0,.45);max-width:94vw;max-height:92vh}
#lke-konfigurator .lb-content img,#lke-konfigurator .lb-content svg{display:block;width:auto;height:auto;max-width:88vw;max-height:82vh}
#lke-konfigurator .lb-close{position:absolute;top:-15px;right:-15px;width:40px;height:40px;border-radius:50%;border:2px solid #fff;background:var(--lke-orange);color:#fff;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
#lke-konfigurator .lb-close:hover{background:var(--lke-orange-dark)}