/* Kupp-west Variante 15 · Split Duo — zwei Gewerke, ein Set */

.kwsd{
  --stage:#eceef1;
  --panel:#ffffff;
  --ink:#181d24;
  --muted:#68707c;
  --line:#d7dbe0;
  --steel:#33404f;
  --steel-deep:#212a35;
  --steel-tint:#e6ebf0;
  --copper:#a85c22;
  --copper-deep:#7a3f13;
  --copper-tint:#f6ecdf;
  box-sizing:border-box;
  margin:0;
  background:var(--stage);
  color:var(--ink);
  font:15px/1.65 Arial,Helvetica,sans-serif;
  overflow:hidden;
}
.kwsd *,.kwsd *::before,.kwsd *::after{box-sizing:border-box}
.kwsd img{display:block;width:100%;max-width:100%;height:auto}
.kwsd h1,.kwsd h2,.kwsd h3,.kwsd p,.kwsd ul,.kwsd ol,.kwsd dl,.kwsd dd,.kwsd figure{margin:0}
.kwsd a{color:inherit}
.kwsd a:focus-visible,.kwsd .kwsd-btn:focus-visible{outline:3px solid var(--copper);outline-offset:2px}

.kwsd h1,.kwsd h2,.kwsd .kwsd-duo-name,.kwsd .kwsd-feature-value{
  font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.02em;
  line-height:1.12;
  font-weight:bold;
}

.kwsd-summary,.kwsd-head,.kwsd-vehiclebar,.kwsd-main,.kwsd-foot{
  max-width:1140px;margin-left:auto;margin-right:auto;padding-left:22px;padding-right:22px;
}

.kwsd-summary{padding-top:14px;padding-bottom:14px;font-size:12px;color:var(--muted)}

.kwsd-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;flex-wrap:wrap;
  padding-top:10px;padding-bottom:18px;
  border-bottom:1px solid var(--line);
}
.kwsd-mark{
  font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;
  font-weight:bold;font-size:24px;letter-spacing:.14em;
}
.kwsd-head-note{font-size:12px;color:var(--muted);letter-spacing:.05em}

.kwsd-vehiclebar{
  display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  padding-top:16px;padding-bottom:16px;
}
.kwsd-vehiclebar-facts{display:flex;align-items:center;gap:10px 22px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.kwsd-vehiclebar-primary{font-weight:bold;color:var(--ink);font-size:15px;text-decoration:none;border-bottom:2px solid var(--copper)}

.kwsd-btn{
  display:inline-block;padding:12px 26px;font-size:13px;font-weight:bold;
  letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
}
.kwsd-btn-dark{background:var(--steel-deep);color:#fff}
.kwsd-btn-line{border:2px solid var(--ink);color:var(--ink)}

/* ---------- Hero ---------- */

.kwsd-hero{padding:44px 0 0}
.kwsd-hero-intro{max-width:780px;margin:0 auto 40px;text-align:center}
.kwsd-eyebrow{display:flex;justify-content:center;align-items:center;gap:12px;font-size:12px;font-weight:bold;letter-spacing:.22em;text-transform:uppercase;margin-bottom:18px}
.kwsd-eyebrow-steel{color:var(--steel)}
.kwsd-eyebrow-copper{color:var(--copper)}
.kwsd-eyebrow-plus{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  background:linear-gradient(90deg,var(--steel) 0 50%,var(--copper) 50% 100%);
  color:#fff;font-size:15px;letter-spacing:0;
}
.kwsd h1{font-size:clamp(34px,4.6vw,58px)}
.kwsd-lead{margin-top:18px;font-size:17px;color:var(--muted)}

.kwsd-duo{display:grid;grid-template-columns:1fr 58px 1fr;align-items:stretch}
.kwsd-duo-half{background:var(--panel);padding:30px 30px 34px;display:flex;flex-direction:column}
.kwsd-duo-steel{border-top:5px solid var(--steel)}
.kwsd-duo-copper{border-top:5px solid var(--copper)}
.kwsd-duo-kicker{font-size:11px;font-weight:bold;letter-spacing:.18em;text-transform:uppercase;margin-bottom:14px}
.kwsd-duo-steel .kwsd-duo-kicker,.kwsd-detail-steel .kwsd-duo-kicker{color:var(--steel)}
.kwsd-duo-copper .kwsd-duo-kicker,.kwsd-detail-copper .kwsd-duo-kicker{color:var(--copper)}
.kwsd-duo-figure{flex:1;display:flex;align-items:center;padding:6px 0 20px}
.kwsd-duo-figure img{aspect-ratio:4/3;object-fit:contain}
.kwsd-duo-name{font-size:24px;margin-bottom:14px}
.kwsd-duo-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kwsd-duo-stats div{border-top:1px solid var(--line);padding-top:9px}
.kwsd-duo-stats dt{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kwsd-duo-stats dd{font-size:17px;font-weight:bold;margin-top:2px}
.kwsd-duo-steel .kwsd-duo-stats dd{color:var(--steel-deep)}
.kwsd-duo-copper .kwsd-duo-stats dd{color:var(--copper-deep)}

/* Die Naht: gestrichelte Steckverbindung mit Plus-Stecker */
.kwsd-seam{position:relative}
.kwsd-seam::before{
  content:"";position:absolute;top:0;bottom:0;left:50%;width:0;
  border-left:2px dashed #aeb6c0;transform:translateX(-1px);
}
.kwsd-seam-plug{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(90deg,var(--steel) 0 50%,var(--copper) 50% 100%);
  color:#fff;font-size:24px;font-weight:bold;
  border:5px solid var(--stage);
}

.kwsd-unite{
  display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;
  background:var(--panel);border-top:1px solid var(--line);
  padding:30px;margin-bottom:26px;
}
.kwsd-unite-figure img{aspect-ratio:16/9;object-fit:contain}
.kwsd-unite-kicker{
  font-size:11px;font-weight:bold;letter-spacing:.18em;text-transform:uppercase;
  background:linear-gradient(90deg,var(--steel),var(--copper));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:10px;
}
.kwsd-unite-text{color:var(--muted);margin-bottom:20px}

/* ---------- Passungshinweis ---------- */

.kwsd-fit{
  background:var(--panel);
  border-left:6px solid var(--copper);
  padding:20px 24px;margin-bottom:26px;
}
.kwsd-fit-title{font-weight:bold;margin-bottom:4px}
.kwsd-fit-copy{color:var(--muted);font-size:14px}

/* ---------- Sektionen ---------- */

.kwsd-section{padding:58px 0 8px}
.kwsd-sechead{font-size:clamp(24px,3vw,34px);padding-bottom:12px;position:relative;margin-bottom:26px}
.kwsd-sechead::after{
  content:"";position:absolute;left:0;bottom:0;height:4px;width:72px;
  background:linear-gradient(90deg,var(--steel) 0 50%,var(--copper) 50% 100%);
}
.kwsd-sechead-sub{margin-top:50px}
.kwsd-secintro{color:var(--muted);margin:-12px 0 24px;max-width:640px}

/* Merkmale */
.kwsd-features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.kwsd-feature{background:var(--panel);padding:26px 24px 24px}
.kwsd-feature-steel{border-top:4px solid var(--steel)}
.kwsd-feature-copper{border-top:4px solid var(--copper)}
.kwsd-feature-dual{border-top:4px solid transparent;border-image:linear-gradient(90deg,var(--steel) 0 50%,var(--copper) 50% 100%) 1}
.kwsd-feature-value{font-size:40px;line-height:1;margin-bottom:8px}
.kwsd-feature-steel .kwsd-feature-value{color:var(--steel)}
.kwsd-feature-copper .kwsd-feature-value{color:var(--copper)}
.kwsd-feature h3{font-size:16px;margin-bottom:6px}
.kwsd-feature p{color:var(--muted);font-size:14px}

/* Lieferumfang */
.kwsd-contents{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:kwsd-item}
.kwsd-contents li{background:var(--panel);padding:20px 18px;counter-increment:kwsd-item}
.kwsd-contents li::before{
  content:"0" counter(kwsd-item);
  display:block;font-size:12px;font-weight:bold;letter-spacing:.1em;margin-bottom:10px;
}
.kwsd-content-steel{border-top:3px solid var(--steel)}
.kwsd-content-steel::before{color:var(--steel)}
.kwsd-content-copper{border-top:3px solid var(--copper)}
.kwsd-content-copper::before{color:var(--copper)}
.kwsd-content-dual{border-top:3px solid transparent;border-image:linear-gradient(90deg,var(--steel) 0 50%,var(--copper) 50% 100%) 1}
.kwsd-content-dual::before{color:var(--copper-deep)}
.kwsd-contents b{display:block;font-size:15px;margin-bottom:4px}
.kwsd-contents span{color:var(--muted);font-size:13px}

/* Angebotsvergleich */
.kwsd-offergrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kwsd-offer{background:var(--panel);padding:30px 28px;border:1px solid var(--line)}
.kwsd-offer-this{border:2px solid var(--steel-deep)}
.kwsd-offer-flag{
  display:inline-block;font-size:11px;font-weight:bold;letter-spacing:.14em;text-transform:uppercase;
  background:var(--steel-deep);color:#fff;padding:5px 12px;margin-bottom:16px;
}
.kwsd-offer-flag-alt{background:var(--copper-tint);color:var(--copper-deep)}
.kwsd-offer h3{font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;text-transform:uppercase;font-size:24px;margin-bottom:6px}
.kwsd-offer-sub{color:var(--muted);font-size:14px;margin-bottom:18px}
.kwsd-offer ul{list-style:none;padding:0;margin-bottom:24px}
.kwsd-offer li{padding:9px 0 9px 26px;border-top:1px solid var(--line);position:relative;font-size:14px}
.kwsd-offer li::before{content:"✓";position:absolute;left:2px;font-weight:bold;color:var(--copper)}
.kwsd-offer-this li::before{color:var(--steel)}

/* Fahrzeugtabelle */
.kwsd-tablewrap{background:var(--panel);padding:8px 20px 14px}
.kwsd-table{width:100%;border-collapse:collapse;font-size:13px}
.kwsd-table th,.kwsd-table td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.kwsd-table thead th{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-bottom:2px solid var(--ink)}
.kwsd-table tbody tr:last-child td{border-bottom:0}

/* Detailpaar */
.kwsd-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kwsd-detail{background:var(--panel);display:grid;grid-template-columns:150px 1fr;gap:22px;padding:24px;align-items:center}
.kwsd-detail-steel{border-left:5px solid var(--steel)}
.kwsd-detail-copper{border-left:5px solid var(--copper)}
.kwsd-detail figure img{aspect-ratio:1/1;object-fit:contain}
.kwsd-detail h3{font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;text-transform:uppercase;font-size:20px;margin-bottom:8px}
.kwsd-detail p{color:var(--muted);font-size:14px}

/* Spezifikationen */
.kwsd-spec{background:var(--panel)}
.kwsd-spec-title{
  font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;text-transform:uppercase;
  font-size:17px;letter-spacing:.04em;color:#fff;padding:14px 20px;
}
.kwsd-spec-steel .kwsd-spec-title{background:var(--steel)}
.kwsd-spec-copper .kwsd-spec-title{background:var(--copper)}
.kwsd-spectable{width:100%;border-collapse:collapse;font-size:14px}
.kwsd-spectable th,.kwsd-spectable td{padding:10px 20px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.kwsd-spectable th{font-weight:normal;color:var(--muted);width:52%}
.kwsd-spectable td{font-weight:bold}
.kwsd-spectable tr:last-child th,.kwsd-spectable tr:last-child td{border-bottom:0}

/* Hinweise + Anleitungen */
.kwsd-note{padding:26px}
.kwsd-note-steel{background:var(--steel-tint)}
.kwsd-note-copper{background:var(--copper-tint)}
.kwsd-note h3{font-family:'Arial Narrow','Helvetica Neue',Arial,sans-serif;text-transform:uppercase;font-size:19px;margin-bottom:10px}
.kwsd-note>p{font-size:14px}
.kwsd-note p.kwsd-manual-head{font-size:11px;font-weight:bold;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:20px 0 8px}
.kwsd-manuals{list-style:none;padding:0}
.kwsd-manuals li{border-top:1px solid rgba(24,29,36,.14)}
.kwsd-manuals a{
  display:block;padding:9px 2px;font-size:14px;text-decoration:none;font-weight:bold;
}
.kwsd-manuals a::after{content:" ↗";font-weight:normal}
.kwsd-note-steel .kwsd-manuals a{color:var(--steel-deep)}
.kwsd-note-copper .kwsd-manuals a{color:var(--copper-deep)}
.kwsd-manuals a:hover{text-decoration:underline}

/* Weitere Angebote */
.kwsd-moregrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kwsd-more{background:var(--panel);padding:18px;text-decoration:none;display:flex;flex-direction:column;gap:12px;border-bottom:3px solid transparent}
.kwsd-more:hover{border-bottom-color:var(--copper)}
.kwsd-more img{aspect-ratio:4/3;object-fit:contain}
.kwsd-more span{font-size:12px;font-weight:bold;letter-spacing:.1em;text-transform:uppercase;color:var(--steel-deep)}

/* Herstellerband */
.kwsd-brands{
  margin-top:58px;
  background:var(--steel-deep);
  display:grid;grid-template-columns:repeat(5,1fr);gap:24px;align-items:center;
  padding:30px 36px;
}
.kwsd-brands img{width:100%;height:auto;opacity:.85}

/* FAQ */
.kwsd-faqgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kwsd-faq{background:var(--panel);padding:24px}
.kwsd-faq h3{font-size:16px;margin-bottom:8px;padding-left:16px;position:relative}
.kwsd-faq h3::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:4px;background:linear-gradient(180deg,var(--steel) 0 50%,var(--copper) 50% 100%)}
.kwsd-faq p{color:var(--muted);font-size:14px}

/* Footer */
.kwsd-foot{
  margin-top:64px;padding-top:28px;padding-bottom:34px;border-top:1px solid var(--line);
  display:flex;align-items:baseline;gap:8px 26px;flex-wrap:wrap;font-size:13px;color:var(--muted);
}
.kwsd-foot p{max-width:560px}
.kwsd-token{font-size:11px;overflow-wrap:anywhere;margin-left:auto}

/* ---------- Responsive ---------- */

@media(max-width:920px){
  .kwsd-features,.kwsd-pair,.kwsd-offergrid,.kwsd-faqgrid{grid-template-columns:1fr}
  .kwsd-contents{grid-template-columns:1fr 1fr}
  .kwsd-moregrid{grid-template-columns:1fr 1fr}
  .kwsd-brands{grid-template-columns:repeat(5,1fr);gap:14px;padding:22px}
}

@media(max-width:720px){
  .kwsd-summary,.kwsd-head,.kwsd-vehiclebar,.kwsd-main,.kwsd-foot{padding-left:16px;padding-right:16px}
  .kwsd-hero{padding-top:30px}
  .kwsd-hero-intro{text-align:left;margin-bottom:28px}
  .kwsd-eyebrow{justify-content:flex-start}
  .kwsd-duo{grid-template-columns:1fr}
  .kwsd-seam{height:58px}
  .kwsd-seam::before{top:50%;bottom:auto;left:0;right:0;width:auto;border-left:0;border-top:2px dashed #aeb6c0;transform:translateY(-1px)}
  .kwsd-unite{grid-template-columns:1fr;padding:22px;gap:20px}
  .kwsd-section{padding-top:44px}
  .kwsd-detail{grid-template-columns:110px 1fr;padding:18px;gap:16px}
  .kwsd-contents{grid-template-columns:1fr}
  .kwsd-brands{grid-template-columns:repeat(3,1fr)}
  .kwsd-brands img:nth-child(4),.kwsd-brands img:nth-child(5){grid-column:span 1}

  /* Tabelle wird zu Karten */
  .kwsd-tablewrap{padding:4px 16px 10px}
  .kwsd-table,.kwsd-table thead,.kwsd-table tbody,.kwsd-table tr,.kwsd-table th,.kwsd-table td{display:block}
  .kwsd-table thead{display:none}
  .kwsd-table tr{border-bottom:2px solid var(--ink);padding:10px 0}
  .kwsd-table tr:last-child{border-bottom:0}
  .kwsd-table td{border:0;padding:4px 4px 4px 46%;position:relative;min-height:28px}
  .kwsd-table td::before{
    content:attr(data-label);position:absolute;left:2px;width:42%;
    font-size:9px;font-weight:bold;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
    top:8px;
  }
}

@media(max-width:400px){
  .kwsd h1{font-size:31px}
  .kwsd-duo-stats{grid-template-columns:1fr 1fr}
  .kwsd-moregrid{grid-template-columns:1fr}
  .kwsd-brands{grid-template-columns:1fr 1fr}
  .kwsd-table td{padding-left:44%}
}

@media(prefers-reduced-motion:reduce){
  .kwsd *{transition:none !important;animation:none !important}
}

.kwsd a.kwsd-btn-dark{color:#fff}
