/* ==========================================================
   EMAN GROUP — Aktuelle Themen / Microsoft-style peek carousel
   Loaded after style.css and site-stability.css.
   ========================================================== */

.eman-carousel-section{
  --eg-themes-gap:20px;
  --eg-themes-card-width:clamp(760px,58vw,900px);
  --eg-themes-card-height:clamp(360px,24vw,410px);

  width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  padding:clamp(56px,6vw,92px) 0 42px!important;
  overflow-x:clip!important;
  overflow-y:visible!important;
  background:#fff!important;
}

.eman-carousel-inner{
  width:min(1360px,calc(100vw - 72px))!important;
  max-width:none!important;
  margin-inline:auto!important;
  overflow:visible!important;
}

.eman-carousel-head{
  width:min(980px,100%)!important;
  margin:0 0 clamp(26px,3vw,38px)!important;
}

.eman-carousel-head h2{
  max-width:900px!important;
  font-size:clamp(38px,3.7vw,56px)!important;
  line-height:1.04!important;
  letter-spacing:-.05em!important;
}

.eman-carousel-viewport{
  width:100%!important;
  max-width:none!important;
  padding:0 0 16px!important;
  overflow:visible!important;
  isolation:isolate!important;
}

.eman-carousel-track{
  display:flex!important;
  align-items:stretch!important;
  width:max-content!important;
  max-width:none!important;
  gap:var(--eg-themes-gap)!important;
  column-gap:var(--eg-themes-gap)!important;
  transition:transform .64s cubic-bezier(.22,1,.36,1)!important;
  will-change:transform!important;
}

.eman-carousel-card{
  flex:0 0 var(--eg-themes-card-width)!important;
  width:var(--eg-themes-card-width)!important;
  max-width:var(--eg-themes-card-width)!important;
  height:var(--eg-themes-card-height)!important;
  min-height:var(--eg-themes-card-height)!important;
  max-height:var(--eg-themes-card-height)!important;

  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr)!important;
  align-items:stretch!important;
  padding:8px!important;
  overflow:hidden!important;

  border:1px solid rgba(15,23,42,.14)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 2px 5px rgba(15,23,42,.08),0 12px 28px rgba(15,23,42,.06)!important;

  opacity:1!important;
  transform:none!important;
  filter:none!important;
  transition:border-color .22s ease,box-shadow .22s ease!important;
}

.eman-carousel-card::after{
  display:none!important;
  content:none!important;
}

.eman-carousel-card.is-active{
  border-color:rgba(15,23,42,.18)!important;
  box-shadow:0 2px 6px rgba(15,23,42,.10),0 14px 32px rgba(15,23,42,.08)!important;
}

.eman-carousel-copy{
  min-width:0!important;
  height:100%!important;
  min-height:0!important;
  padding:clamp(30px,3vw,48px)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  background:#fff!important;
}

.eman-carousel-label,
.eman-carousel-copy .kicker,
.eman-carousel-copy .eyebrow{
  margin:0 0 clamp(28px,3vw,42px)!important;
  color:#5f6b7a!important;
  font-size:12px!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

.eman-carousel-copy h2,
.eman-carousel-copy h3{
  max-width:520px!important;
  margin:0 0 14px!important;
  color:#111827!important;
  font-size:clamp(25px,2vw,32px)!important;
  font-weight:500!important;
  line-height:1.14!important;
  letter-spacing:-.035em!important;
}

.eman-carousel-copy p:not(.eman-carousel-label){
  max-width:560px!important;
  margin:0!important;
  color:#4b5563!important;
  font-size:14px!important;
  line-height:1.55!important;
}

.eman-carousel-copy .btn,
.eman-carousel-copy a.btn,
.eman-carousel-btn{
  width:auto!important;
  min-height:40px!important;
  margin-top:auto!important;
  padding:9px 15px!important;
  border-radius:6px!important;
  font-size:13px!important;
  font-weight:700!important;
}

.eman-carousel-media{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
  border-radius:10px!important;
  background:#eef2f6!important;
}

.eman-carousel-media img{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
}

.eman-carousel-controls{
  width:var(--eg-themes-card-width)!important;
  max-width:var(--eg-themes-card-width)!important;
  margin:18px 0 0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}

.eman-carousel-arrow,
.eman-carousel-prev,
.eman-carousel-next{
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid rgba(15,23,42,.17)!important;
  color:#17365d!important;
}

.eman-carousel-play{
  width:34px!important;
  height:34px!important;
  margin-left:auto!important;
  border-radius:6px!important;
  background:#fff!important;
  border:1px solid rgba(15,23,42,.17)!important;
  color:#17365d!important;
}

.eman-carousel-arrow:hover,
.eman-carousel-prev:hover,
.eman-carousel-next:hover,
.eman-carousel-play:hover{
  transform:none!important;
  background:#f7f9fc!important;
  border-color:#17365d!important;
}

.eman-carousel-card:focus-within{
  border-color:#0b5fff!important;
  box-shadow:0 0 0 2px rgba(11,95,255,.16),0 14px 32px rgba(15,23,42,.08)!important;
}

@media (max-width:1199px) and (min-width:981px){
  .eman-carousel-section{
    --eg-themes-card-width:clamp(700px,72vw,820px);
    --eg-themes-card-height:390px;
  }

  .eman-carousel-inner{
    width:calc(100vw - 48px)!important;
  }
}

@media (max-width:980px) and (min-width:721px){
  .eman-carousel-section{
    --eg-themes-gap:16px;
    --eg-themes-card-width:84vw;
    --eg-themes-card-height:390px;
    padding:54px 0 38px!important;
  }

  .eman-carousel-inner{
    width:calc(100vw - 36px)!important;
  }

  .eman-carousel-card{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  }

  .eman-carousel-copy{
    padding:28px!important;
  }

  .eman-carousel-copy h2,
  .eman-carousel-copy h3{
    font-size:clamp(24px,3vw,30px)!important;
  }
}

@media (max-width:720px){
  .eman-carousel-section{
    --eg-themes-gap:0px;
    --eg-themes-card-width:100%;
    --eg-themes-card-height:auto;
    padding:48px 0 34px!important;
    overflow-x:clip!important;
  }

  .eman-carousel-inner{
    width:calc(100vw - 24px)!important;
  }

  .eman-carousel-head{
    margin-bottom:22px!important;
  }

  .eman-carousel-head h2{
    font-size:clamp(32px,9vw,44px)!important;
  }

  .eman-carousel-viewport{
    overflow:hidden!important;
    padding-bottom:10px!important;
  }

  .eman-carousel-track{
    width:100%!important;
    gap:0!important;
  }

  .eman-carousel-card{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    padding:7px!important;
    border-radius:14px!important;
  }

  .eman-carousel-media{
    order:1!important;
    height:240px!important;
    min-height:240px!important;
    max-height:240px!important;
    border-radius:8px!important;
  }

  .eman-carousel-media img{
    height:240px!important;
    min-height:240px!important;
    max-height:240px!important;
  }

  .eman-carousel-copy{
    order:2!important;
    padding:24px 18px 20px!important;
  }

  .eman-carousel-label,
  .eman-carousel-copy .kicker,
  .eman-carousel-copy .eyebrow{
    margin-bottom:22px!important;
  }

  .eman-carousel-copy h2,
  .eman-carousel-copy h3{
    font-size:clamp(25px,7.5vw,32px)!important;
  }

  .eman-carousel-copy p:not(.eman-carousel-label){
    font-size:14px!important;
  }

  .eman-carousel-copy .btn,
  .eman-carousel-copy a.btn,
  .eman-carousel-btn{
    width:100%!important;
    margin-top:26px!important;
    justify-content:center!important;
  }

  .eman-carousel-controls{
    width:100%!important;
    max-width:100%!important;
    margin-top:14px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .eman-carousel-track{
    transition:none!important;
  }
}

/* ==========================================================
   UI11 — carousel card scaled to the VELA feature card
   Keeps the adjacent-card preview while matching the same
   enterprise scale, height and page alignment.
   ========================================================== */
@media (min-width:1200px){
  .eman-carousel-section{
    --eg-themes-card-width:min(1368px,calc(100vw - 112px));
    --eg-themes-card-height:clamp(380px,30vw,470px);
    padding:clamp(60px,7vw,104px) 0 44px!important;
  }

  .eman-carousel-inner{
    width:min(1368px,calc(100vw - 72px))!important;
  }

  .eman-carousel-head{
    width:min(980px,100%)!important;
    margin-bottom:28px!important;
  }

  .eman-carousel-card{
    grid-template-columns:1fr 1fr!important;
    padding:10px!important;
    min-height:var(--eg-themes-card-height)!important;
  }

  .eman-carousel-copy{
    padding:clamp(38px,4vw,56px)!important;
  }

  .eman-carousel-label,
  .eman-carousel-copy .kicker,
  .eman-carousel-copy .eyebrow{
    margin-bottom:clamp(38px,4.5vw,64px)!important;
    font-size:13px!important;
  }

  .eman-carousel-copy h2,
  .eman-carousel-copy h3{
    max-width:620px!important;
    margin-bottom:18px!important;
    font-size:clamp(30px,2.55vw,42px)!important;
    line-height:1.14!important;
  }

  .eman-carousel-copy p:not(.eman-carousel-label){
    max-width:640px!important;
    font-size:15px!important;
    line-height:1.56!important;
  }

  .eman-carousel-copy .btn,
  .eman-carousel-copy a.btn,
  .eman-carousel-btn{
    min-height:44px!important;
    padding:0 18px!important;
  }

  .eman-carousel-media{
    border-radius:12px!important;
  }
}

@media (max-width:1199px) and (min-width:981px){
  .eman-carousel-section{
    --eg-themes-card-width:min(1040px,calc(100vw - 92px));
    --eg-themes-card-height:clamp(390px,38vw,440px);
  }

  .eman-carousel-inner{
    width:calc(100vw - 48px)!important;
  }

  .eman-carousel-card{
    grid-template-columns:1fr 1fr!important;
    padding:9px!important;
  }

  .eman-carousel-copy{
    padding:clamp(30px,4vw,46px)!important;
  }
}

@media (max-width:980px) and (min-width:721px){
  .eman-carousel-section{
    --eg-themes-card-width:calc(100vw - 78px);
    --eg-themes-card-height:400px;
  }

  .eman-carousel-inner{
    width:calc(100vw - 36px)!important;
  }
}

/* ==========================================================
   UI12 — desktop equal-height alignment
   The two carousel cards use exactly the same visual height as
   the VELA feature card above. Mobile and tablet remain unchanged.
   ========================================================== */
@media (min-width:1200px){
  .vela-feature-section,
  .eman-carousel-section{
    --eg-desktop-feature-height:clamp(520px,38vw,562px);
  }

  .vela-feature-card,
  .eman-carousel-card{
    height:var(--eg-desktop-feature-height)!important;
    min-height:var(--eg-desktop-feature-height)!important;
    max-height:var(--eg-desktop-feature-height)!important;
  }

  .vela-feature-copy,
  .vela-feature-media,
  .vela-feature-media--logo,
  .eman-carousel-copy,
  .eman-carousel-media{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
  }

  .vela-feature-media img,
  .vela-feature-media--logo img,
  .vela-feature-media--logo .vela-feature-logo,
  .eman-carousel-media img{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    object-fit:cover!important;
  }

  .eman-carousel-track{
    align-items:stretch!important;
  }
}