/* Fenster-Konfigurator (/fenster-konfigurator/) — baut auf den Tokens aus style.css auf */

.kf-sec{padding-top:clamp(40px,6vw,72px);}
.kf-noscript{padding:16px 18px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);margin-bottom:24px;}
.kf-noscript a{color:var(--copper);text-decoration:underline;}

.kf{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(24px,4vw,48px);align-items:start;}
.kf-main{min-width:0;}

/* Blöcke */
.kf-block{border:0;margin:0 0 34px;padding:0;min-width:0;}
.kf-block legend{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,30px);line-height:1.1;margin-bottom:16px;padding:0;}
.kf-nr{display:inline-grid;place-items:center;flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--copper);color:#fff;font-family:var(--sans);font-size:14px;font-weight:700;}
.kf-opt{font-family:var(--sans);font-size:14px;font-weight:400;color:var(--ink-soft);}
.kf-hint{font-size:15px;color:var(--ink-soft);margin:-6px 0 14px;}

/* Kacheln */
.kf-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.kf-tiles-4{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}
.kf-tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px 12px;background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);cursor:pointer;font:inherit;color:var(--ink);text-align:center;transition:border-color .2s,box-shadow .2s;}
.kf-tile:hover{border-color:#cdbfae;}
.kf-tile[aria-checked="true"]{border-color:var(--copper);box-shadow:0 0 0 1px var(--copper);}
.kf-tile:focus-visible{outline:2px solid var(--copper);outline-offset:2px;}
.kf-tile svg{width:64px;height:64px;}
.kf-tile b{font-size:14.5px;line-height:1.25;font-weight:600;}
.kf-tile em{font-style:normal;font-size:13px;color:var(--ink-soft);line-height:1.3;}
.kf-swatch{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);}

/* Felder */
.kf-row{display:flex;flex-wrap:wrap;gap:14px;}
.kf-field{display:flex;flex-direction:column;gap:5px;flex:1 1 160px;min-width:0;margin-bottom:12px;}
.kf-field-s{flex:0 1 110px;}
.kf-field label{font-size:13px;font-weight:700;letter-spacing:.04em;}
.kf-field input,.kf-field select,.kf-field textarea{font:inherit;font-size:16px;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--white);color:var(--ink);width:100%;}
.kf-field input:focus,.kf-field select:focus,.kf-field textarea:focus{outline:none;border-color:var(--copper);}
.kf-field small{font-size:12.5px;color:var(--ink-soft);}
.kf-field .ungueltig{border-color:#b3261e;}
.kf-farbton{margin-top:14px;max-width:340px;}
.req{color:var(--copper);}

.kf-checks{display:grid;gap:10px;margin-top:14px;}
.kf-checks-2{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-top:0;}
.kf-check{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);cursor:pointer;}
.kf-check input{margin-top:4px;width:18px;height:18px;accent-color:var(--copper);flex:0 0 auto;}
.kf-check span{display:flex;flex-direction:column;}
.kf-check b{font-size:15px;font-weight:600;}
.kf-check em{font-style:normal;font-size:13px;color:var(--ink-soft);}
.kf-check:has(input:checked){border-color:var(--copper);}

/* Zusammenfassung */
.kf-side{position:sticky;top:96px;}
.kf-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:0 10px 30px rgba(34,29,24,.06);}
.kf-vorschau{display:grid;place-items:center;height:190px;background:var(--cream);border-radius:var(--r);margin-bottom:14px;}
.kf-vorschau svg{max-width:85%;max-height:165px;}
.kf-name{font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.15;}
.kf-details{font-size:14px;color:var(--ink-soft);margin:4px 0 14px;}
.kf-preis{border-top:1px solid var(--line);padding-top:14px;margin-bottom:16px;}
.kf-preis small{display:block;font-size:12.5px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em;font-weight:700;}
.kf-preis b{display:block;font-family:var(--serif);font-size:34px;line-height:1.15;color:var(--ink);margin-top:2px;}
.kf-preis.laedt b{opacity:.45;}
.kf-fehler{display:block;font-size:14px;color:#b3261e;margin-top:6px;}
.kf-add{width:100%;justify-content:center;}
.kf-add[disabled]{opacity:.5;cursor:not-allowed;transform:none;}
.kf-klein{font-size:12.5px;color:var(--ink-soft);line-height:1.45;margin-top:12px;}

/* Positionsliste */
.kf-liste{margin-top:clamp(40px,6vw,64px);max-width:820px;}
.kf-liste h2{font-size:clamp(30px,4vw,40px);margin-bottom:18px;}
.kf-pos{list-style:none;counter-reset:pos;display:grid;gap:10px;}
.kf-pos li{counter-increment:pos;display:grid;grid-template-columns:56px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 14px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);}
.kf-pos li svg{width:56px;height:56px;}
.kf-pos .p-txt b{display:block;font-size:15.5px;}
.kf-pos .p-txt span{font-size:13.5px;color:var(--ink-soft);}
.kf-pos .p-preis{font-weight:700;white-space:nowrap;font-size:15px;}
.kf-pos .p-weg{background:none;border:0;cursor:pointer;color:var(--ink-soft);font-size:22px;line-height:1;padding:4px 8px;}
.kf-pos .p-weg:hover{color:var(--copper);}
.kf-summe{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;padding:16px 4px;border-bottom:2px solid var(--ink);margin-bottom:32px;}
.kf-summe span{font-size:15px;color:var(--ink-soft);}
.kf-summe b{font-family:var(--serif);font-size:30px;}
.kf-form h3{font-size:26px;margin-bottom:8px;}
.kf-form .kf-hint{margin:0 0 16px;}

.kf-info{padding-top:0;}
.kf-info h2{font-size:clamp(28px,3.5vw,38px);margin-bottom:16px;}

.kf-mobil{display:none;}

@media (max-width:980px){
  .kf{grid-template-columns:1fr;}
  .kf-side{position:static;order:2;}
  /* sitzt über der Anrufen/WhatsApp/Angebot-Leiste aus site.js (.sticky-cta, ~49px hoch) */
  .kf-mobil{display:flex;position:fixed;left:0;right:0;bottom:49px;z-index:100;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--white);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(34,29,24,.08);}
  .kf-mobil small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:700;}
  .kf-mobil b{display:block;font-family:var(--serif);font-size:22px;line-height:1.1;}
  .kf-mobil span{font-size:12px;color:var(--copper);font-weight:700;}
  .kf-mobil .btn{padding:12px 18px;}
  .kf-mobil .btn[disabled]{opacity:.5;}
  body{padding-bottom:130px;}
}
@media (max-width:560px){
  .kf-tiles,.kf-tiles-4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .kf-tile svg{width:52px;height:52px;}
  .kf-pos li{grid-template-columns:44px minmax(0,1fr) auto;}
  .kf-pos li svg{width:44px;height:44px;}
  .kf-pos .p-preis{grid-column:2;}
  .kf-pos .p-weg{grid-column:3;grid-row:1;}
}