/* ==========================================================================
   Vision-Teaser: Hinweis auf /vision/ auf den Karriereseiten
   Ein Baustein, identisches Markup auf /karriere/ und den drei Stellenanzeigen.
   Passt sich per Container Query an die verfügbare Breite an
   (schmale .main-Spalte der Anzeigen oder volle Container-Breite).
   ========================================================================== */

.vision-teaser{
  --vt-ink:#1A1D24;
  --vt-bone:#F5F1EA;
  --vt-champagne:#C9A961;
  --vt-sans:var(--wcg-font-sans,'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif);
  --vt-serif:var(--wcg-font-serif,'Literata',Georgia,'Times New Roman',serif);
  container-type:inline-size;
  position:relative;
  margin:40px 0 0;
  background:var(--vt-ink);
  color:var(--vt-bone);
  text-align:left;
  border:1px solid rgba(201,169,97,.28);
  border-radius:var(--wcg-r-md,4px);
  overflow:hidden;
}
.vision-teaser::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--vt-champagne) 0,rgba(201,169,97,0) 70%);
}
.vision-teaser .vision-teaser__inner{
  display:grid;grid-template-columns:1fr;gap:32px;
  padding:36px 22px 26px;
}
.vision-teaser .vision-teaser__eyebrow{
  display:block;margin:0 0 18px;
  font-family:var(--vt-sans);font-weight:500;font-size:12px;line-height:1.4;
  letter-spacing:.12em;text-transform:uppercase;color:var(--vt-champagne);
}
.vision-teaser .vision-teaser__title{
  margin:0 0 18px;max-width:20ch;text-align:left;
  font-family:var(--vt-serif);font-weight:300;
  font-size:28px;line-height:1.1;letter-spacing:-.02em;color:var(--vt-bone);
}
.vision-teaser .vision-teaser__nobr{white-space:nowrap}
.vision-teaser .vision-teaser__title em{
  display:block;font-style:italic;font-weight:300;color:var(--vt-champagne);
}
.vision-teaser .vision-teaser__text{
  margin:0 0 28px;max-width:44ch;
  font-family:var(--vt-sans);font-weight:300;font-size:16px;line-height:1.65;
  color:rgba(245,241,234,.78);
}
.vision-teaser .vision-teaser__btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 22px;
  font-family:var(--vt-sans);font-weight:600;font-size:14px;line-height:1;
  color:var(--vt-ink);background:var(--vt-champagne);
  border:1px solid var(--vt-champagne);border-radius:var(--wcg-r-sm,2px);
  text-decoration:none;white-space:nowrap;
  transition:background .22s ease,color .22s ease,border-color .22s ease;
}
.vision-teaser .vision-teaser__btn:hover,
.vision-teaser .vision-teaser__btn:focus-visible{
  background:var(--vt-bone);border-color:var(--vt-bone);color:var(--vt-ink);
}
.vision-teaser .vision-teaser__btn:focus-visible{outline:2px solid var(--vt-champagne);outline-offset:3px}

.vision-teaser .vision-teaser__media{
  position:relative;margin:0;
  aspect-ratio:3/2;overflow:hidden;background:var(--vt-ink);
  border:1px solid rgba(201,169,97,.55);border-radius:var(--wcg-r-md,4px);
}
.vision-teaser .vision-teaser__media picture,
.vision-teaser .vision-teaser__media img{display:block;width:100%;height:100%}
.vision-teaser .vision-teaser__media img{object-fit:cover;object-position:46% center;max-width:none}

/* Breiter Kontext: zwei Spalten, Text links, Bild rechts */
@container (min-width:620px){
  .vision-teaser .vision-teaser__inner{
    grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
    align-items:center;gap:40px;padding:48px 40px 48px 44px;
  }
  .vision-teaser .vision-teaser__title{font-size:clamp(28px,4.6cqi,44px)}
  .vision-teaser .vision-teaser__media{
    aspect-ratio:4/5;box-shadow:14px 14px 0 rgba(201,169,97,.12);
    margin-right:14px;
  }
}
@container (min-width:960px){
  .vision-teaser .vision-teaser__inner{gap:72px;padding:72px 72px 72px 64px}
  .vision-teaser .vision-teaser__media{aspect-ratio:3/2}
  .vision-teaser .vision-teaser__text{font-size:17px}
}

/* Eigenes Band auf /karriere/ (direkt nach #warum, gleicher warmer Grund) */
.vision-teaser-band{padding:0 0 120px;background:var(--wcg-bone-warm,#EDE7DB)}
.vision-teaser-band .vision-teaser{margin:0}
@media (max-width:780px){.vision-teaser-band{padding:0 0 80px}}