.wk { --wk-yellow:#ffd52a; --wk-red:#e32732; --wk-blue:#1762c4; --wk-ink:#17191b; --wk-white:#fff; --wk-muted:#5c6064; --wk-line:#dedfe0; color:var(--wk-ink); font-family:Manrope,Arial,sans-serif; letter-spacing:0; }
.wk *, .wk *::before, .wk *::after { box-sizing:border-box; }
.wk a { color:inherit; text-decoration:none; }
.wk button, .wk a, .wk summary { -webkit-tap-highlight-color:transparent; }
.wk a:focus-visible, .wk summary:focus-visible { outline:3px solid var(--wk-blue); outline-offset:5px; }
.wk p, .wk h1, .wk h2, .wk h3 { margin:0; letter-spacing:0; }
.wk h1, .wk h2, .wk h3 { font-family:Manrope,Arial,sans-serif; font-weight:800; color:inherit; }
.wk-shell { width:min(1240px,calc(100% - 96px)); margin-inline:auto; }
.wk-header { background:var(--wk-white); border-bottom:1px solid var(--wk-line); position:relative; z-index:20; }
.wk-header-inner { display:flex; gap:28px; align-items:center; min-height:96px; }
.wk-logo { display:flex; align-items:center; flex:1; min-width:0; gap:8px; }
.wk-logo img { width:92px; height:64px; object-fit:contain; flex-shrink:0; }
.wk-logo span { font-weight:800; font-size:22px; white-space:nowrap; }
.wk-nav { display:flex; align-items:center; gap:30px; font-size:14px; font-weight:700; }
.wk-nav a { padding:12px 0; border-bottom:2px solid transparent; }
.wk-nav a:hover { border-color:var(--wk-red); }
.wk-button { display:inline-flex; justify-content:center; align-items:center; gap:20px; min-height:54px; padding:14px 24px; border:2px solid transparent; border-radius:4px; font-size:15px; font-weight:800; line-height:1.4; text-align:center; transition:background .15s,transform .15s; }
.wk-button span:last-child { font-size:23px; line-height:1; flex-shrink:0; }
.wk-button:hover { transform:translateY(-2px); }
.wk .wk-button-dark { color:var(--wk-white); background:var(--wk-ink); }
.wk .wk-button-dark:hover { background:#33373a; }
.wk .wk-button-yellow { color:var(--wk-ink); background:var(--wk-yellow); }
.wk .wk-button-yellow:hover { background:#ffe568; }
.wk-header-cta { min-height:44px; padding:10px 18px; font-size:13px; }
.wk-hero { position:relative; min-height:560px; height:calc(100svh - 228px); max-height:720px; overflow:hidden; background:#242628; display:flex; align-items:center; }
.wk-hero-image { position:absolute; width:100%; height:100%; object-fit:cover; object-position:center; }
.wk-hero-shade { position:absolute; inset:0; background:rgba(0,0,0,.52); }
.wk-hero-content { position:relative; padding-block:52px; color:var(--wk-white); }
.wk-eyebrow { font-size:12px; font-weight:800; line-height:1.6; }
.wk-hero h1 { font-size:76px; line-height:1.05; margin:16px 0 14px; color:var(--wk-white); }
.wk-hero-title { white-space:pre-line; font-size:40px; line-height:1.14; font-weight:800; max-width:780px; }
.wk-hero-description { max-width:540px; margin-top:22px!important; font-size:17px; line-height:1.75; }
.wk-actions { display:flex; align-items:center; gap:28px; margin-top:30px; flex-wrap:wrap; }
.wk-hero-link { font-size:14px; font-weight:700; border-bottom:1px solid #fff; padding:8px 0; }
.wk-colorbar { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; height:10px; }
.wk-colorbar span:nth-child(1) { background:var(--wk-red); }
.wk-colorbar span:nth-child(2) { background:var(--wk-yellow); }
.wk-colorbar span:nth-child(3) { background:var(--wk-blue); }
.wk-colorbar span:nth-child(4) { background:#22995b; }
.wk-ribbon { background:#f4f5f6; border-bottom:1px solid var(--wk-line); }
.wk-ribbon .wk-shell { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:66px; font-size:13px; font-weight:700; }
.wk-ribbon span::before { content:''; display:inline-block; width:7px; height:7px; background:var(--wk-red); margin-right:10px; }
.wk-ribbon span:nth-child(2)::before { background:var(--wk-blue); }
.wk-ribbon span:nth-child(3)::before { background:#22995b; }
.wk-intro { padding-block:78px; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; scroll-margin-top:24px; }
.wk-kicker { font-size:11px; line-height:1.7; font-weight:800; }
.wk h2 { font-size:42px; line-height:1.17; white-space:pre-line; margin-top:14px; overflow-wrap:break-word; }
.wk-intro-copy p { max-width:540px; color:var(--wk-muted); font-size:16px; line-height:1.85; }
.wk-text-link { display:inline-flex; align-items:center; gap:28px; margin-top:22px; border-bottom:2px solid var(--wk-ink); padding-bottom:6px; font-size:14px; font-weight:800; }
.wk-text-link span:last-child { font-size:24px; line-height:1; }
.wk-product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; padding-bottom:64px; }
.wk-product-grid > [class^="section_block_id_"] { display:contents; }
.wk-product { min-width:0; border:1px solid var(--wk-line); border-radius:4px; padding:18px; }
.wk-product-image { aspect-ratio:1; background:#f5f6f7; margin-bottom:20px; overflow:hidden; }
.wk-product-image .f-image { display:block; width:100%; height:100%; }
.wk-product-img { width:100%; height:100%; object-fit:contain; }
.wk-product h3 { font-size:21px; }
.wk-product p { margin-top:10px; font-size:14px; color:var(--wk-muted); }
.wk-spotlight { display:grid; grid-template-columns:1fr 1fr; background:var(--wk-yellow); }
.wk-spotlight-image { min-height:450px; overflow:hidden; }
.wk-spotlight-image img { width:100%; height:100%; object-fit:cover; object-position:26% center; }
.wk-spotlight-content { padding:68px max(48px,calc((100vw - 1240px)/2)); padding-left:64px; }
.wk-spotlight h2 { margin-bottom:22px; }
.wk-spotlight-content > p:not(.wk-kicker):not(.wk-image-note) { font-size:16px; line-height:1.8; max-width:480px; }
.wk-spotlight .wk-button { margin-top:26px; }
.wk-image-note { font-size:11px; line-height:1.6; margin-top:24px!important; max-width:420px; }
.wk-process { padding-block:78px 84px; scroll-margin-top:24px; }
.wk-process-head { margin-bottom:42px; }
.wk-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.wk-steps > [class^="section_block_id_"] { display:contents; }
.wk-step { border-top:4px solid var(--wk-red); padding-top:22px; min-width:0; }
.wk-step:nth-of-type(2) { border-color:var(--wk-blue); }
.wk-step:nth-of-type(3) { border-color:#22995b; }
.wk-step-number { font-size:13px; font-weight:800; color:var(--wk-muted); }
.wk-step h3 { margin:16px 0 12px; font-size:23px; line-height:1.3; }
.wk-step p { color:var(--wk-muted); font-size:14px; line-height:1.85; }
.wk-faq { background:#f4f5f6; padding-block:72px; scroll-margin-top:24px; }
.wk-faq-inner { display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; }
.wk-faq-item { border-bottom:1px solid #c9cbcd; }
.wk-faq-item:first-child { border-top:1px solid #c9cbcd; }
.wk-faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; font-size:16px; font-weight:700; cursor:pointer; list-style:none; }
.wk-faq-item summary::-webkit-details-marker { display:none; }
.wk-faq-plus { width:20px; height:20px; position:relative; flex-shrink:0; }
.wk-faq-plus::before, .wk-faq-plus::after { content:''; position:absolute; background:var(--wk-ink); left:2px; right:2px; top:9px; height:2px; }
.wk-faq-plus::after { transform:rotate(90deg); }
.wk-faq-item[open] .wk-faq-plus::after { transform:rotate(0); }
.wk-faq-item > p { margin-bottom:24px; max-width:570px; font-size:14px; color:var(--wk-muted); line-height:1.85; }
.wk-contact { padding-block:62px; background:var(--wk-blue); color:var(--wk-white); }
.wk-contact-inner { display:flex; justify-content:space-between; align-items:center; gap:40px; }
.wk-contact h2 { font-size:38px; color:var(--wk-white); }
.wk-contact p:last-child { margin-top:18px; max-width:540px; font-size:14px; line-height:1.8; }
.wk-contact .wk-button { flex-shrink:0; background:var(--wk-yellow); color:var(--wk-ink); }
.wk-footer { background:#fff; padding-block:45px 28px; }
.wk-footer-top { display:flex; justify-content:space-between; gap:30px; padding-bottom:32px; }
.wk-footer-brand { font-size:26px; font-weight:800; }
.wk-footer-top p { font-size:13px; color:var(--wk-muted); margin-top:8px; }
.wk-footer-contact { display:flex; flex-direction:column; gap:12px; font-size:14px; text-align:right; }
.wk-footer-contact a:first-child { font-weight:800; text-decoration:underline; }
.wk-footer-bottom { border-top:1px solid var(--wk-line); padding-top:24px; display:grid; grid-template-columns:1fr 2fr; gap:10px 35px; font-size:11px; line-height:1.8; color:var(--wk-muted); }
.wk-attribution { grid-column:2; }
.wk-attribution a { text-decoration:underline; }
@media (min-width:1800px) { .wk-hero { max-height:620px; } }
@media (max-width:1000px) { .wk-shell { width:calc(100% - 64px); } .wk-header-inner { gap:16px; } .wk-nav { gap:18px; } .wk-logo span { display:none; } .wk-intro { gap:36px; } .wk h2 { font-size:36px; } .wk-spotlight-content { padding:48px 32px; } .wk-spotlight-image { min-height:420px; } .wk-steps { gap:24px; } .wk-faq-inner { gap:36px; } .wk-contact-inner { flex-direction:column; align-items:flex-start; gap:28px; } }
@media (max-width:767px) {
  .wk-shell { width:calc(100% - 40px); }
  .wk-header-inner { display:grid; grid-template-columns:1fr auto; gap:0 12px; min-height:112px; padding-block:5px; }
  .wk-logo { gap:4px; } .wk-logo img { width:72px; height:48px; } .wk-logo span { display:block; font-size:18px; }
  .wk-header-cta { grid-column:2; grid-row:1; font-size:12px; padding:8px 12px; gap:8px; min-height:40px; }
  .wk-nav { grid-column:1 / -1; grid-row:2; justify-content:space-between; gap:20px; font-size:13px; } .wk-nav a { padding:10px 0; }
  .wk-hero { height:auto; min-height:560px; max-height:none; align-items:center; }
  .wk-hero-image { object-position:51% center; } .wk-hero-shade { background:rgba(0,0,0,.57); }
  .wk-hero-content { padding-block:48px; } .wk-eyebrow { font-size:10px; max-width:260px; }
  .wk-hero h1 { font-size:53px; margin-top:20px; } .wk-hero-title { font-size:29px; line-height:1.22; }
  .wk-hero-description { font-size:14px; line-height:1.8; max-width:390px; }
  .wk-actions { gap:14px; flex-direction:column; align-items:flex-start; margin-top:26px; } .wk-button { gap:16px; font-size:13px; padding:12px 18px; min-height:50px; }
  .wk-colorbar { height:8px; } .wk-ribbon .wk-shell { justify-content:flex-start; overflow-x:auto; gap:28px; min-height:52px; font-size:11px; } .wk-ribbon span { flex-shrink:0; }
  .wk-intro { grid-template-columns:1fr; gap:24px; padding-block:48px; } .wk h2 { font-size:32px; line-height:1.2; } .wk-intro-copy p { font-size:14px; } .wk-text-link { font-size:13px; }
  .wk-product-grid { grid-template-columns:1fr; }
  .wk-spotlight { grid-template-columns:1fr; } .wk-spotlight-image { min-height:0; height:260px; } .wk-spotlight-image img { object-position:25% center; } .wk-spotlight-content { padding:36px 20px 40px; } .wk-spotlight-content > p:not(.wk-kicker):not(.wk-image-note) { font-size:14px; }
  .wk-process { padding-block:48px; } .wk-process-head { margin-bottom:30px; } .wk-steps { grid-template-columns:1fr; gap:28px; } .wk-step { padding-top:16px; } .wk-step h3 { margin:10px 0; font-size:21px; }
  .wk-faq { padding-block:46px; } .wk-faq-inner { grid-template-columns:1fr; gap:28px; } .wk-faq-item summary { font-size:14px; padding-block:22px; } .wk-faq-item > p { font-size:13px; }
  .wk-contact { padding-block:42px; } .wk-contact h2 { font-size:32px; } .wk-contact p:last-child { font-size:13px; }
  .wk-footer { padding-block:32px 24px; } .wk-footer-top { flex-direction:column; gap:24px; } .wk-footer-contact { text-align:left; } .wk-footer-bottom { grid-template-columns:1fr; gap:12px; } .wk-attribution { grid-column:1; }
}
@media (prefers-reduced-motion:reduce) { .wk-button { transition:none; } }

/* --- 产品墙：30 张全量展示时的多列自适应 --- */
.wk-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap:20px; }
.wk-product img { content-visibility:auto; }
@media (min-width:1200px) {
  .wk-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap:24px; }
}
@media (max-width:767px) {
  /* 一行 2 个产品：窄卡内按钮纵向堆叠（44px 高易点击）、缩略图缩小、描述限 3 行（与 liquid 内联保持一致） */
  .wk-product-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; padding-bottom:40px; }
  .wk-product { padding:8px; }
  .wk-product-image { margin-bottom:10px; }
  .wk-product h3 { font-size:13.5px; line-height:1.3; min-height:0; }
  .wk-product p { margin-top:5px; font-size:11px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .wk-product .wk-text-link { font-size:11px; margin-top:6px; }
}
/* 2 列小屏（≤385px）：按钮字号微缩防「Produkt anfragen」截断 */
@media (max-width:385px) {
  .wk-product-actions .wk-pbtn { font-size:11px; }
}
/* 超窄屏（≤365px）：2 列过窄，回退单列 */
@media (max-width:365px) {
  .wk-product-grid { grid-template-columns:1fr; gap:14px; }
  .wk-product { padding:12px; }
  .wk-product h3 { font-size:15px; }
  .wk-product p { font-size:12px; -webkit-line-clamp:4; }
}

/* --- 支付与保障模块 --- */
.wk-pay { background:#f7f8f9; padding:76px 0 72px; text-align:center; }
.wk-pay .wk-kicker { letter-spacing:.18em; opacity:.6; }
.wk-pay h2 { margin:12px auto 0; max-width:640px; }
.wk-pay-sub { max-width:560px; margin:12px auto 0; color:#5b6572; font-size:15px; line-height:1.65; }
.wk-pay-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; max-width:820px; margin:26px auto 0; }
.wk-pay-item { display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid #e4e8ec; border-radius:999px; padding:10px 18px 10px 14px; font-weight:600; font-size:14.5px; color:#17191b; box-shadow:0 1px 2px rgba(16,24,40,.05); transition:transform .18s ease, box-shadow .18s ease; }
.wk-pay-item:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(16,24,40,.10); }
.wk-pay-ic { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex:0 0 24px; }
.wk-pay-ic svg { width:24px; height:24px; display:block; }
.wk-pay-protect { display:flex; align-items:flex-start; gap:12px; max-width:680px; margin:26px auto 0; padding:16px 20px; background:linear-gradient(180deg,#f0fdf4,#eafbf1); border:1px solid #bbf7d0; border-radius:14px; text-align:left; }
.wk-pay-protect > svg { width:22px; height:22px; flex:0 0 22px; color:#15803d; margin-top:2px; }
.wk-pay-protect span { color:#14532d; font-weight:500; font-size:14px; line-height:1.65; }
@media (prefers-reduced-motion:reduce) { .wk-pay-item { transition:none; } .wk-pay-item:hover { transform:none; } }

/* --- 手机端排版 --- */
@media (max-width:767px) {
  .wk-pay { padding:46px 0 40px; }
  .wk-pay h2 { font-size:24px; }
  .wk-pay h2 br { display:none; }
  .wk-pay-sub { font-size:13.5px; margin-top:10px; padding:0 4px; }
  .wk-pay-grid { gap:8px; margin-top:18px; }
  .wk-pay-item { padding:8px 13px 8px 10px; font-size:13px; gap:7px; }
  .wk-pay-ic, .wk-pay-ic svg { width:20px; height:20px; flex-basis:20px; }
  .wk-pay-protect { margin-top:16px; padding:13px 15px; gap:10px; border-radius:12px; }
  .wk-pay-protect > svg { width:20px; height:20px; flex-basis:20px; margin-top:1px; }
  .wk-pay-protect span { font-size:12.5px; line-height:1.6; }
  .wk-product-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; padding-bottom:40px; }
  .wk-product { padding:8px; }
  .wk-product-image { margin-bottom:10px; }
  .wk-product h3 { font-size:13.5px; line-height:1.3; margin:0; min-height:0; }
  .wk-product p { margin-top:5px; font-size:11px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .wk-product .wk-text-link { font-size:11px; margin-top:6px; }
}

/* FAQ「Alle Fragen」按钮（首页限量展示时跳转独立 FAQ 页） */
.wk-faq-all { display:inline-flex; align-items:center; gap:9px; margin-top:30px; padding:13px 26px; border-radius:999px; background:var(--wk-ink); color:#fff; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; transition:transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease; }
.wk-faq-all span { display:inline-block; transition:transform .3s ease; }
.wk-faq-all:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(16,24,40,.18); }
.wk-faq-all:hover span { transform:translateX(3px); }
@media (max-width:900px) { .wk-faq-all { margin-top:24px; padding:12px 22px; font-size:11px; } }
@media (prefers-reduced-motion:reduce) { .wk-faq-all, .wk-faq-all span { transition:none; } .wk-faq-all:hover { transform:none; } .wk-faq-all:hover span { transform:none; } }