/*
 * SAM-PRO Consulting Layout v358
 * Vollbreite Einordnungsbilder und kompakte, textbasierte Anlasskarten.
 */

/* Das Einordnungsbild bleibt bei jeder Desktop- und Tablet-Breite eine eigene Zeile. */
html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v328__context-main{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:0 !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__context-copy{
  flex:0 0 auto !important;
  width:100% !important;
  max-width:none !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__context-figure{
  display:block !important;
  flex:0 0 auto !important;
  align-self:stretch !important;
  width:calc(100% - 26px) !important;
  max-width:none !important;
  height:clamp(250px,17vw,310px) !important;
  min-height:250px !important;
  max-height:310px !important;
  aspect-ratio:auto !important;
  margin:0 13px 13px !important;
  overflow:hidden !important;
  border-radius:14px !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__context-figure img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
}

html body .sampro-topic-v271:is([data-topic="audit-readiness-software-audits"],[data-topic="kostenoptimierung-softwarelizenzen"]) #einordnung .sampro-topic-v326__context-figure img{
  object-position:center 12% !important;
}

/* Ohne Piktogramme steht die gesamte Kartenbreite für Titel und Erklärung bereit. */
html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecase-item{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  grid-template-areas:"title" "text" !important;
  column-gap:0 !important;
  row-gap:4px !important;
  align-content:start !important;
  align-items:start !important;
  min-height:0 !important;
  padding:13px 14px 12px !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecase-icon{
  display:none !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecase-item strong{
  grid-area:title !important;
  align-self:start !important;
  width:100% !important;
  font-size:14.5px !important;
  line-height:1.22 !important;
}

html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecase-item > span:not(.sampro-topic-v326__usecase-icon){
  grid-area:text !important;
  width:100% !important;
  font-size:13px !important;
  line-height:1.4 !important;
}

@media (max-width:720px){
  html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__context-figure{
    width:calc(100% - 22px) !important;
    height:210px !important;
    min-height:210px !important;
    max-height:210px !important;
    margin:0 11px 11px !important;
  }

  html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecase-item{
    padding:12px 13px 11px !important;
  }
}

@media (max-width:560px){
  html body .sampro-topic-v271[data-topic] #einordnung .sampro-topic-v326__usecases-grid{
    grid-template-columns:1fr !important;
  }
}