/* MXonnowell v0.3.17 — İlk sayfa video alanları için cihaz + kaynak oranı bazlı güvenli medya geometrisi
   ve Katılım / Mentor Desteği kart ölçek düzeltmesi. */
:root{
  --mx317-video-web:1120px;
  --mx317-video-laptop:1040px;
  --mx317-video-tablet:920px;
  --mx317-video-bg:#07182b;
}

/* İlk ana video: kaynak ne olursa olsun crop yok. Varsayılan yatay video standardı 16:9. */
.mx302-video-first{padding-block:12px 18px!important;overflow:visible!important}
.mx302-video-first>.mx-wrap{margin-inline:auto!important}
.mx302-video-first__frame{
  width:100%!important;
  aspect-ratio:16/9!important;
  min-height:0!important;
  max-height:none!important;
  margin-inline:auto!important;
  background:var(--mx317-video-bg)!important;
  border-radius:18px!important;
  overflow:hidden!important;
}
.mx302-video-first__frame .mx302-video-el,
.mx302-video-first__frame .mx302-video-poster{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  inset:0!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center center!important;
}

/* Kaynak dikey veya kare olduğunda videoyu geniş yatay kasada küçücük bırakma. */
.mx302-video-first__frame.is-mx317-portrait,
.mx302-video-first__frame.is-mx317-square{margin-inline:auto!important}

/* Geniş web: sinematik ama ekrana taşmayan ölçü. */
@media (min-width:1440px){
  .mx302-video-first>.mx-wrap{width:min(var(--mx317-video-web),calc(100% - 56px))!important}
  .mx302-video-first__frame.is-mx317-landscape{aspect-ratio:16/9!important}
  .mx302-video-first__frame.is-mx317-square{width:min(760px,70vw)!important;aspect-ratio:1/1!important}
  .mx302-video-first__frame.is-mx317-portrait{width:min(650px,58vw)!important;aspect-ratio:4/5!important;max-height:760px!important}
}

/* Laptop / standart web. */
@media (min-width:1101px) and (max-width:1439px){
  .mx302-video-first>.mx-wrap{width:min(var(--mx317-video-laptop),calc(100% - 44px))!important}
  .mx302-video-first__frame.is-mx317-landscape{aspect-ratio:16/9!important}
  .mx302-video-first__frame.is-mx317-square{width:min(700px,72vw)!important;aspect-ratio:1/1!important}
  .mx302-video-first__frame.is-mx317-portrait{width:min(590px,60vw)!important;aspect-ratio:4/5!important;max-height:700px!important}
}

/* Tablet yatay/dikey: genişliği sıkıştırma, videoyu tam göster. */
@media (min-width:768px) and (max-width:1100px){
  .mx302-video-first{padding-block:10px 15px!important}
  .mx302-video-first>.mx-wrap{width:min(var(--mx317-video-tablet),calc(100% - 28px))!important}
  .mx302-video-first__frame{border-radius:16px!important}
  .mx302-video-first__frame.is-mx317-landscape{aspect-ratio:16/9!important}
  .mx302-video-first__frame.is-mx317-square{width:min(680px,86vw)!important;aspect-ratio:1/1!important}
  .mx302-video-first__frame.is-mx317-portrait{width:min(540px,72vw)!important;aspect-ratio:4/5!important;max-height:70svh!important}
}

/* Mobil: yatay video tam ekran genişliğine yakın; dikey video gerçekten büyük görünür. */
@media (max-width:767px){
  .mx302-video-first{padding-block:4px 10px!important}
  .mx302-video-first>.mx-wrap{width:calc(100% - 8px)!important;max-width:none!important}
  .mx302-video-first__frame{border-radius:13px!important}
  .mx302-video-first__frame.is-mx317-landscape,
  .mx302-video-first__frame:not(.is-mx317-portrait):not(.is-mx317-square){
    width:100%!important;
    aspect-ratio:16/9!important;
  }
  .mx302-video-first__frame.is-mx317-square{
    width:min(94vw,560px)!important;
    aspect-ratio:1/1!important;
  }
  .mx302-video-first__frame.is-mx317-portrait{
    width:min(88vw,470px)!important;
    aspect-ratio:4/5!important;
    max-height:74svh!important;
  }

  /* İlk videodan sonraki genel görsel kartları daha kompakt, içerik yine tam görünür. */
  .mx302-media-card{flex-basis:min(64vw,246px)!important}
  .mx302-media-card figure{aspect-ratio:16/9!important}
  .mx302-media-card figure img{object-fit:contain!important}

  /* Kullanıcının beğendiği Keşfet mobil video ölçüsünü aynen koru. */
  [data-mx-builder-key="explore-videos"] .mx302-video-card{flex-basis:min(76vw,295px)!important}
  [data-mx-builder-key="explore-videos"] .mx302-video-card__frame{aspect-ratio:16/9!important}
}

@media (max-width:390px){
  .mx302-video-first>.mx-wrap{width:calc(100% - 4px)!important}
  .mx302-video-first__frame.is-mx317-portrait{width:min(92vw,430px)!important;max-height:72svh!important}
  .mx302-media-card{flex-basis:min(66vw,232px)!important}
}

/* Kısa yatay ekran: video viewport dışına taşmaz. */
@media (max-height:560px) and (orientation:landscape){
  .mx302-video-first__frame{max-height:72svh!important}
  .mx302-video-first__frame.is-mx317-portrait{width:auto!important;height:72svh!important;aspect-ratio:4/5!important}
}

/* Katılım / Mentor Desteği — giant SVG problemini kesin olarak sınırla. */
.mx305-join-mentor{padding-top:34px!important;padding-bottom:40px!important}
.mx305-join-mentor .mx302-heading{margin-bottom:20px!important}
.mx305-join-mentor__grid{
  grid-template-columns:minmax(0,47%) minmax(0,53%)!important;
  align-items:stretch!important;
  min-height:0!important;
}
.mx305-join-mentor__cards{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-auto-rows:1fr!important;
  gap:12px!important;
  align-content:stretch!important;
  padding:20px!important;
}
.mx305-join-mentor__cards article{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:132px!important;
  padding:15px 12px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.mx305-join-mentor__cards .mx302-icon{
  display:grid!important;
  place-items:center!important;
  flex:0 0 48px!important;
  width:48px!important;
  height:48px!important;
  max-width:48px!important;
  max-height:48px!important;
  margin:0 auto 9px!important;
  padding:10px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:1px solid #dfe8f2!important;
  border-radius:50%!important;
  background:#f8fbff!important;
  color:#0b65c8!important;
  line-height:1!important;
}
.mx305-join-mentor__cards article:nth-child(even) .mx302-icon{background:#f6faef!important;color:#3f941a!important}
.mx305-join-mentor__cards .mx302-icon svg{
  display:block!important;
  flex:none!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
  stroke-width:1.8!important;
}
.mx305-join-mentor__cards h3{margin:0!important;font-size:14px!important;line-height:1.28!important;text-align:center!important}
.mx305-join-mentor__cards p{margin:6px 0 0!important;max-width:190px!important;font-size:11px!important;line-height:1.45!important;text-align:center!important}
.mx305-join-mentor__media{min-height:330px!important;max-height:390px!important;overflow:hidden!important}
.mx305-join-mentor__media img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}

@media (min-width:768px) and (max-width:1100px){
  .mx305-join-mentor__grid{grid-template-columns:minmax(0,50%) minmax(0,50%)!important}
  .mx305-join-mentor__cards{padding:14px!important;gap:10px!important}
  .mx305-join-mentor__cards article{min-height:122px!important;padding:12px 9px!important}
  .mx305-join-mentor__cards .mx302-icon{width:44px!important;height:44px!important;max-width:44px!important;max-height:44px!important;flex-basis:44px!important;padding:9px!important}
  .mx305-join-mentor__cards .mx302-icon svg{width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;max-width:22px!important;max-height:22px!important}
  .mx305-join-mentor__media{min-height:300px!important;max-height:360px!important}
}

@media (max-width:767px){
  .mx305-join-mentor{padding-top:28px!important;padding-bottom:34px!important}
  .mx305-join-mentor__grid{grid-template-columns:1fr!important;border-radius:15px!important}
  .mx305-join-mentor__media{order:1!important;min-height:210px!important;max-height:250px!important}
  .mx305-join-mentor__cards{order:2!important;padding:12px!important;gap:9px!important}
  .mx305-join-mentor__cards article{min-height:116px!important;padding:11px 8px!important;border-radius:12px!important}
  .mx305-join-mentor__cards .mx302-icon{width:42px!important;height:42px!important;max-width:42px!important;max-height:42px!important;flex-basis:42px!important;padding:9px!important;margin-bottom:7px!important}
  .mx305-join-mentor__cards .mx302-icon svg{width:21px!important;height:21px!important;min-width:21px!important;min-height:21px!important;max-width:21px!important;max-height:21px!important}
  .mx305-join-mentor__cards h3{font-size:12.5px!important}
  .mx305-join-mentor__cards p{font-size:10.2px!important;line-height:1.38!important}
}

@media (max-width:350px){
  .mx305-join-mentor__cards{grid-template-columns:1fr!important}
  .mx305-join-mentor__cards article{min-height:104px!important}
}