.ker-web-sync { --ker-sync-blue:#143657; --ker-sync-orange:#c87b30; color:var(--ker-sync-blue); }
.ker-web-sync section { margin:2.5rem 0; scroll-margin-top:7rem; }
.ker-web-sync h2 { font-size:clamp(1.6rem,3vw,2.6rem); margin:0 0 1rem; }
.ker-web-sync h3 { font-size:1.3rem; }
.ker-web-sync p,.ker-web-sync li { line-height:1.65; white-space:pre-line; }
.ker-web-sync .ker-catalog-nav { display:flex; flex-wrap:wrap; gap:.5rem; }
.ker-web-sync .ker-catalog-nav a { padding:.6rem .85rem; background:#f2f6fa; color:inherit; text-decoration:none; }
.ker-web-sync .ker-catalog-variants,.ker-web-sync .ker-catalog-cooling { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:1rem; }
.ker-web-sync .ker-catalog-card { padding:1.5rem; border:1px solid #d7e2ed; background:#f8fafc; min-width:0; }
.ker-web-sync table { width:100%; border-collapse:collapse; font-size:.95rem; }
.ker-web-sync th,.ker-web-sync td { padding:.6rem .3rem; border-bottom:1px solid #d7e2ed; text-align:left; overflow-wrap:anywhere; }
.ker-web-sync .ker-catalog-accessory { padding:1rem 0; border-bottom:1px solid #d7e2ed; }
.ker-web-sync .ker-catalog-accessory .ker-catalog-accessory { margin-left:1rem; padding-left:1rem; border-left:3px solid #d7e2ed; }
.ker-web-sync .ker-catalog-applies,.ker-web-sync .ker-catalog-date { color:#52677a; font-size:.9rem; }
.ker-web-sync details { border:1px solid #d7e2ed; margin:.7rem 0; background:#f8fafc; }
.ker-web-sync summary { cursor:pointer; display:flex; gap:1rem; align-items:center; padding:1.3rem; font-size:1.15rem; font-weight:600; list-style:none; }
.ker-web-sync summary::-webkit-details-marker { display:none; }
.ker-web-sync summary small { margin-left:auto; font-size:.8rem; font-weight:400; text-transform:uppercase; color:#63778a; }
.ker-web-sync summary::after { content:'+'; display:grid; place-items:center; background:var(--ker-sync-orange); color:#fff; width:2.2rem; height:2.2rem; flex-shrink:0; font-size:1.5rem; }
.ker-web-sync details[open]>summary::after { content:'−'; }
.ker-web-sync summary:focus-visible { outline:3px solid var(--ker-sync-blue); outline-offset:3px; }
.ker-web-sync .ker-required-equipment-panel { padding:0 1.5rem 1rem; }
@media(max-width:600px) { .ker-web-sync summary { padding:1rem; font-size:1rem; } .ker-web-sync summary small { display:none; } .ker-web-sync summary::after { margin-left:auto; } .ker-web-sync .ker-catalog-card { padding:1rem; } }
.ker-sync-preview { max-width:1100px; }
@media print { .ker-web-sync .ker-catalog-nav { display:none; } }
.ker-web-sync .ker-option-gallery { display:flex; flex-wrap:wrap; gap:12px; margin:12px 0 16px; }
.ker-web-sync .ker-option-gallery .ker-option-image { box-sizing:border-box; width:146px; max-width:100%; height:110px; margin:0; padding:0; overflow:hidden; border:1px solid #d7e2ed; border-radius:6px; background:#fff; }
.ker-web-sync .ker-option-image a { display:block; width:100%; height:100%; }
.ker-web-sync .ker-option-image img { display:block; box-sizing:border-box; width:144px; max-width:100%; height:108px; padding:8px; object-fit:contain; object-position:center; background:#fff; }
.ker-web-sync .ker-option-image a:focus-visible { outline:3px solid #143657; outline-offset:-3px; }
@media(max-width:400px) { .ker-web-sync .ker-option-gallery .ker-option-image { width:130px; height:98px; } .ker-web-sync .ker-option-image img { width:128px; height:96px; } }

/* One shared image layout for catalog imports and directly published vehicle pages. */
.ker-vehicle-image-showcase[aria-label] > .ker-wrap {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}
.ker-vehicle-image-showcase .ker-wrap .ker-vehicle-thumb-grid {
  display: contents;
}
.ker-vehicle-image-showcase .ker-wrap figure {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: auto;
  aspect-ratio: 4 / 3;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d7e2ed;
  border-radius: 8px;
  background: #fff;
}
.ker-vehicle-image-showcase .ker-wrap figure img {
  position: absolute;
  inset: 0;
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  aspect-ratio: auto;
  margin: 0;
  padding: 12px;
  object-fit: contain;
  object-position: center;
  background: #fff;
}
@media (max-width: 680px) {
  .ker-vehicle-image-showcase[aria-label] > .ker-wrap { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ker-vehicle-image-showcase .ker-wrap figure img { padding: 8px; }
}
