/* Q4 2026: Motoröl-Ratgeber mobil conversion-stärker */
.td-oil-conversion{margin:28px 0;padding:26px 28px;border:1px solid #dfe4e1;border-radius:8px;background:#f6f8f7;color:#303834}
.td-oil-conversion__eyebrow{margin:0 0 6px;color:#3f6556;font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.td-oil-conversion h2{margin:0 0 9px;color:#171a18;font-size:25px;line-height:1.22}
.td-oil-conversion__lead{max-width:850px;margin:0 0 18px;color:#58635e;font-size:14px;line-height:1.55}
.td-oil-conversion__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:0 0 18px}
.td-oil-conversion__cards article{padding:18px 18px 16px;border:1px solid #d9e0dc;border-radius:6px;background:#fff}
.td-oil-conversion__cards span{display:block;color:#3f6556;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.td-oil-conversion__cards strong{display:block;margin:5px 0 7px;color:#171a18;font-size:22px;line-height:1.15}
.td-oil-conversion__cards p{margin:0 0 13px;color:#59645f;font-size:12px;line-height:1.45}
.td-oil-conversion__cards a{display:inline-flex;min-height:36px;align-items:center;color:#315344;font-size:12px;font-weight:800;text-decoration:none}
.td-oil-conversion__cards a:hover,.td-oil-conversion__cards a:focus{text-decoration:underline}
.td-oil-conversion__actions{display:flex;flex-wrap:wrap;gap:10px}
.td-oil-conversion__actions a{min-height:42px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;font-size:13px;font-weight:800;text-decoration:none}
.td-oil-conversion__primary{color:#fff;background:#2f7d5b}
.td-oil-conversion__secondary{color:#315344;border:1px solid #3f6556;background:#fff}
@media screen and (max-width:767px){
  .blog--detail-description{overflow:hidden}
  .blog--detail-description table{width:100%!important;max-width:100%!important;display:block!important;overflow:visible!important;border-collapse:separate!important;border-spacing:0!important;background:transparent!important}
  .blog--detail-description table thead{display:none!important}
  .blog--detail-description table tbody,.blog--detail-description table tr,.blog--detail-description table th,.blog--detail-description table td{display:block!important;width:auto!important;max-width:none!important}
  .blog--detail-description table tr{margin:0 0 12px!important;padding:14px 14px 12px!important;border:1px solid #dfe4e1!important;border-radius:7px!important;background:#fff!important}
  .blog--detail-description table th,.blog--detail-description table td{padding:5px 0!important;border:0!important;color:#303834!important;font-size:15px!important;line-height:1.45!important;text-align:left!important;white-space:normal!important;word-break:normal!important}
  .blog--detail-description table td:before,.blog--detail-description table th:before{display:block;margin:0 0 2px;color:#66716c;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
  .blog--detail-description table td:nth-child(1):before,.blog--detail-description table th:nth-child(1):before{content:'Modell'}
  .blog--detail-description table td:nth-child(2):before,.blog--detail-description table th:nth-child(2):before{content:'Motor'}
  .blog--detail-description table td:nth-child(3):before,.blog--detail-description table th:nth-child(3):before{content:'Motoröl'}
  .blog--detail-description table td:nth-child(4):before,.blog--detail-description table th:nth-child(4):before{content:'Ölfüllmenge'}
  .blog--detail-description table td:nth-child(5):before,.blog--detail-description table th:nth-child(5):before{content:'Benötigte Menge'}
  .td-oil-conversion{margin:18px -4px 24px;padding:20px 16px;border-radius:7px}
  .td-oil-conversion h2{font-size:21px}
  .td-oil-conversion__lead{font-size:13px}
  .td-oil-conversion__cards{grid-template-columns:1fr;gap:10px}
  .td-oil-conversion__cards article{padding:15px}
  .td-oil-conversion__actions{display:block}
  .td-oil-conversion__actions a{width:100%;margin-top:9px}
}

.td-oil-conversion__links{display:grid;gap:8px;margin-top:16px}
.td-oil-conversion__links a{display:flex;min-height:42px;padding:10px 13px;align-items:center;justify-content:center;border:1px solid #d7dfda;border-radius:4px;background:#fff;color:#315344;font-weight:800;text-align:center;text-decoration:none}
.td-oil-conversion__links a:first-child{border-color:#2f7d5b;background:#2f7d5b;color:#fff}
@media screen and (max-width:767px){.td-oil-conversion__links{margin-top:18px}.td-oil-conversion__links a{width:100%;min-height:46px;font-size:14px}}

.td-oil-conversion__group-title{margin:24px 0 12px;color:#2f3834;font-size:18px;line-height:1.25}.td-oil-conversion__cards--legacy article{background:#fbfcfb}.td-oil-conversion__cards--legacy span{color:#56645e}


/* Modell-Auswahlmaske im Öl-Ratgeber */
.td-oil-conversion__jumpnav{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 18px}
.td-oil-conversion__jumpnav a{display:inline-flex;padding:7px 10px;border:1px solid #d9e0dc;border-radius:999px;color:#315344;background:#fff;font-size:12px;font-weight:800;text-decoration:none}
.td-oil-selector{margin:0 0 18px;padding:15px;border:1px solid #d9e0dc;border-radius:7px;background:#f7faf8}
.td-oil-selector label{display:block;margin-bottom:7px;color:#3f6556;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.td-oil-selector__select{width:100%;min-height:44px;padding:8px 10px;border:1px solid #cdd6d1;border-radius:5px;background:#fff;color:#171a18;font-size:14px}
.td-oil-conversion__group{margin-top:18px}
.td-oil-conversion__group>h3{margin:0 0 10px;color:#171a18;font-size:20px;line-height:1.25}
.td-oil-conversion__note{margin:0 0 12px;color:#59645f;font-size:13px;line-height:1.5}
@media screen and (max-width:767px){
  .td-oil-conversion__jumpnav{gap:6px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .td-oil-conversion__jumpnav a{white-space:nowrap;font-size:11px}
  .td-oil-selector{margin-left:-2px;margin-right:-2px;padding:13px}
  .td-oil-conversion__group>h3{font-size:18px}
}

/* Auswahlmaske Motoröl-Ratgeber */
.td-oil-select-mask{margin:20px 0 0;padding:20px;border:1px solid #d9e0dc;border-radius:8px;background:#f7f9f8}
.td-oil-select-mask label{display:block;margin:0 0 8px;color:#25372f;font-weight:800;font-size:13px}
.td-oil-select-mask__select{width:100%;min-height:44px;padding:0 12px;border:1px solid #b9c5bf;border-radius:5px;background:#fff;color:#17211c;font-size:15px;font-weight:700}
.td-oil-select-mask__results{margin-top:16px}
.td-oil-result{display:none;padding:18px;border:1px solid #dfe6e2;border-radius:7px;background:#fff}
.td-oil-result.is-active{display:block}
.td-oil-result__group{margin:0 0 5px;color:#3f6556;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.td-oil-result h3{margin:0 0 8px;color:#171a18;font-size:20px;line-height:1.25}
.td-oil-result p{margin:0 0 13px;color:#4e5b55;font-size:13px;line-height:1.5}
.td-oil-result__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.td-oil-result__links a{display:flex;align-items:center;justify-content:center;min-height:40px;padding:9px 11px;border:1px solid #315d4a;border-radius:4px;color:#274d3d;background:#fff;font-size:12px;font-weight:800;text-align:center;text-decoration:none}
.td-oil-result__links a:hover,.td-oil-result__links a:focus{background:#315d4a;color:#fff}
.td-oil-conversion__note{margin:14px 0 0;color:#65716c;font-size:11px;line-height:1.5}
@media screen and (max-width:767px){.td-oil-select-mask{margin:16px -4px 0;padding:16px}.td-oil-result__links{grid-template-columns:1fr}.td-oil-result h3{font-size:18px}.td-oil-result__links a{justify-content:flex-start;text-align:left}}

/* Motoröl-Modellberater: zuverlässige mobile Darstellung und eindeutige Zustände – 08.10.2026 */
.is--ctl-blog.is--act-detail .td-oil-conversion{box-sizing:border-box;max-width:100%;overflow-wrap:anywhere}
.is--ctl-blog.is--act-detail .td-oil-select-mask{box-sizing:border-box;width:100%;max-width:100%;margin:14px 0 0;padding:16px;border:1px solid #dce5df;border-radius:10px;background:#f7f9f8}
.is--ctl-blog.is--act-detail .td-oil-select-mask__select{box-sizing:border-box;display:block;width:100%;max-width:100%;min-height:48px;padding:10px 34px 10px 12px;font-size:15px;line-height:1.3;color:#1c2922;background-color:#fff;border:1px solid #b6c6bd;border-radius:6px}
.is--ctl-blog.is--act-detail .td-oil-result{box-sizing:border-box;max-width:100%;margin-top:12px;padding:18px;border:1px solid #e1e8e4;border-radius:9px;background:#fff}
.is--ctl-blog.is--act-detail .td-oil-result[hidden]{display:none!important}
.is--ctl-blog.is--act-detail .td-oil-result.is-active:not([hidden]){display:block!important}
.is--ctl-blog.is--act-detail .td-oil-result__group{margin:0 0 6px!important;font-size:11px!important;font-weight:800!important;letter-spacing:.06em;color:#456e5b}
.is--ctl-blog.is--act-detail .td-oil-result h3{margin:0 0 9px!important;font-size:clamp(19px,3vw,22px)!important;line-height:1.28!important;overflow-wrap:break-word}
.is--ctl-blog.is--act-detail .td-oil-result p:not(.td-oil-result__group){margin:0 0 12px!important;font-size:14px!important;line-height:1.55!important;color:#475950}
.is--ctl-blog.is--act-detail .td-oil-result__links{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px!important;margin-top:14px!important}
.is--ctl-blog.is--act-detail .td-oil-result__links a{box-sizing:border-box;display:flex!important;align-items:center;justify-content:center;min-width:0;min-height:46px;margin:0!important;padding:11px 12px!important;border:1px solid #aec6b8;border-radius:6px;color:#2b5943;background:#fff;font-size:13px!important;font-weight:750!important;line-height:1.35!important;text-align:center!important;text-decoration:none!important;overflow-wrap:anywhere}
.is--ctl-blog.is--act-detail .td-oil-result__links a:first-child{background:#306e51;color:#fff;border-color:#306e51}
.is--ctl-blog.is--act-detail .td-oil-result__links a:focus-visible{outline:3px solid #b4d2be;outline-offset:2px}
@media(max-width:767px){
  .is--ctl-blog.is--act-detail .td-oil-conversion{margin:18px 0;padding:18px 13px}
  .is--ctl-blog.is--act-detail .td-oil-conversion h2{font-size:21px!important;line-height:1.25!important}
  .is--ctl-blog.is--act-detail .td-oil-select-mask{padding:12px}
  .is--ctl-blog.is--act-detail .td-oil-result{padding:14px 12px}
  .is--ctl-blog.is--act-detail .td-oil-result__links{grid-template-columns:minmax(0,1fr)!important;gap:9px!important}
  .is--ctl-blog.is--act-detail .td-oil-result__links a{width:100%;min-height:48px;justify-content:center!important;text-align:center!important;font-size:14px!important}
}

/* 2026-10-08 – iPhone / Shopware-FancySelect: Pfeil muss zur echten Select-Touchfläche gehören. */
.is--ctl-blog.is--act-detail .td-oil-select-mask > .js--fancy-select.select-field.td-oil-select-mask__select{
  position:relative!important;
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  height:52px!important;
  min-height:52px!important;
  padding:0!important;
  border:1px solid #b6c6bd!important;
  border-radius:6px!important;
  background:#fff!important;
}
.is--ctl-blog.is--act-detail .td-oil-select-mask > .js--fancy-select.select-field.td-oil-select-mask__select > select[data-td-oil-select]{
  -webkit-appearance:none!important;
  appearance:none!important;
  position:absolute!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:0 52px 0 14px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  color:#1c2922!important;
  font-size:15px!important;
  line-height:1.3!important;
  cursor:pointer!important;
  z-index:1!important;
}
.is--ctl-blog.is--act-detail .td-oil-select-mask > .js--fancy-select.select-field.td-oil-select-mask__select::after{
  pointer-events:none!important;
  z-index:2!important;
}

/* Link zum zentralen Wartungsset-Modellfinder */
.td-oil-conversion__hub-link{margin:0 0 18px!important;font-size:13px;font-weight:800}
.td-oil-conversion__hub-link a{color:#245c45;text-decoration:underline;text-underline-offset:3px}