/* MXonnowell v0.3.05 — Referans sadakati + ilgili medya + daha kontrollü kurumsal hiyerarşi.
   v0.3.04 katmanını bozmadan, onaylanan 8 sayfanın başlık düzeni, bölüm yoğunluğu,
   görsel kadrajları ve video eşleşmelerini daha deterministik hale getirir. */

:root{
  --mx305-navy:#0b2f69;
  --mx305-green:#43a313;
  --mx305-blue:#0872d8;
  --mx305-muted:#627286;
  --mx305-line:#e2eaf2;
  --mx305-soft:#f7fafc;
}

/* Referanslarda ana başlık + kısa alt mesaj ayrımı belirgin. */
.mx305-hero-subheadline{
  display:block;
  margin-top:14px;
  color:var(--mx305-navy);
  font-size:clamp(18px,1.65vw,25px);
  line-height:1.2;
  letter-spacing:-.022em;
  font-weight:680;
}
.mx302-hero__copy>.mx305-hero-subheadline + p{margin-top:10px}
.mx302-hero__copy>p{max-width:590px}

/* Başlıkların ekran görüntüsündeki gibi güçlü fakat kartların önüne geçmeyecek ölçekte kalması. */
.mx302-split__copy h2{font-size:clamp(29px,2.9vw,39px);line-height:1.08;letter-spacing:-.035em}
.mx302-split__copy>p{font-size:13.5px;line-height:1.62;max-width:570px}
.mx302-check-list{gap:9px;margin-top:18px}
.mx302-check-list li{font-size:12.5px}

/* Görsellerde ana kişi/ürün kadrajı korunur; gereksiz yakınlaştırma yapılmaz. */
.mx302-hero__media .mx302-device-image,
.mx302-split__media .mx302-device-image,
.mx305-join-mentor__media .mx302-device-image{object-position:center center}
[data-mx-builder-key="join-hero"] .mx302-hero__media img{object-position:center 58%}
[data-mx-builder-key="academy-hero"] .mx302-hero__media img{object-position:center 48%}
[data-mx-builder-key="stories-hero"] .mx302-hero__media img{object-position:center 42%}
[data-mx-builder-key="explore-hero"] .mx302-hero__media img{object-position:center 52%}

/* Sayfa-özel hero hiyerarşisi: referanslardaki marka başlıkları tek satırda nefes alır. */
[data-mx-builder-key="apex-hero"] h1,
[data-mx-builder-key="academy-hero"] h1,
[data-mx-builder-key="products-hero"] h1,
[data-mx-builder-key="stories-hero"] h1,
[data-mx-builder-key="explore-hero"] h1,
[data-mx-builder-key="join-hero"] h1{font-size:clamp(42px,4vw,58px)}
[data-mx-builder-key="apex-hero"] .mx302-hero__copy,
[data-mx-builder-key="academy-hero"] .mx302-hero__copy,
[data-mx-builder-key="products-hero"] .mx302-hero__copy,
[data-mx-builder-key="stories-hero"] .mx302-hero__copy,
[data-mx-builder-key="explore-hero"] .mx302-hero__copy,
[data-mx-builder-key="join-hero"] .mx302-hero__copy{padding-top:38px;padding-bottom:38px}

/* APEX Life Team referansında temel alanlar kısa, mentor bölümü ise ana görsel bloğudur. */
[data-mx-builder-key="apex-pillars"] .mx302-feature-card{min-height:190px}
[data-mx-builder-key="apex-mentoring"] .mx302-split__copy{padding-top:30px;padding-bottom:30px}
[data-mx-builder-key="apex-mentoring"] .mx302-split__media{min-height:305px}
[data-mx-builder-key="apex-culture"] .mx302-feature-card p{max-width:155px;margin-left:auto;margin-right:auto}

/* Nasıl Çalışır: 6 aşama referanstaki yatay süreç hissini korusun. */
[data-mx-builder-key="how-six-steps"] .mx302-heading{margin-bottom:18px}
[data-mx-builder-key="how-six-steps"] .mx302-steps article{min-height:205px}
[data-mx-builder-key="how-six-steps"] .mx302-step-no{top:12px;left:12px}
[data-mx-builder-key="how-plan"] .mx302-split__copy{padding-top:28px;padding-bottom:28px}
[data-mx-builder-key="how-plan"] .mx302-split__media{min-height:300px}
[data-mx-builder-key="how-power"] .mx302-media-card p{min-height:48px}

/* Akademi: kategori kartlarının yüksekliği ve video kartları referans oranına daha yakın. */
[data-mx-builder-key="academy-categories"] .mx302-feature-card{min-height:188px;padding-top:20px;padding-bottom:18px}
[data-mx-builder-key="academy-featured"] .mx302-media-card h3{font-size:14px}
[data-mx-builder-key="academy-featured"] .mx302-media-card p{font-size:10.8px;line-height:1.48}
[data-mx-builder-key="academy-mentors"] .mx302-split__grid{min-height:300px}
[data-mx-builder-key="academy-mentors"] .mx302-split__copy{padding-top:28px;padding-bottom:28px}

/* Hikâyeler: kartlar portre odaklı, kişi bilgisi doğrulanana kadar nötr içerik alanı. */
[data-mx-builder-key="stories-list"] .mx302-story-card{overflow:hidden}
[data-mx-builder-key="stories-list"] .mx302-story-card figure{aspect-ratio:4/2.8}
[data-mx-builder-key="stories-list"] .mx302-story-card figure img{object-position:center 28%}
[data-mx-builder-key="stories-list"] .mx302-story-card>div{padding-top:15px}

/* Keşfet: 4x2 kartlar referanstaki navigasyon vitrini gibi daha kompakt. */
[data-mx-builder-key="explore-grid"] .mx302-explore-card{min-height:205px}
[data-mx-builder-key="explore-grid"] .mx302-explore-card h3{margin-top:13px}
[data-mx-builder-key="explore-grid"] .mx302-explore-card>a{padding-top:11px}

/* Katılım: referanstaki Mentor Desteği bandını gerçek web bileşeni olarak yeniden kurar. */
.mx305-join-mentor{background:#f4f9fd;padding-top:36px;padding-bottom:40px}
.mx305-join-mentor .mx302-heading{margin-bottom:22px}
.mx305-join-mentor .mx302-heading h2{font-size:clamp(25px,2.25vw,33px)}
.mx305-join-mentor .mx302-heading p{max-width:760px}
.mx305-join-mentor__grid{
  display:grid;
  grid-template-columns:minmax(0,52%) minmax(0,48%);
  overflow:hidden;
  border:1px solid var(--mx305-line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(28,58,92,.045);
}
.mx305-join-mentor__cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-content:center;
  padding:26px;
}
.mx305-join-mentor__cards article{
  min-width:0;
  padding:16px 13px;
  text-align:center;
  border:1px solid #e4ebf2;
  border-radius:14px;
  background:#fff;
}
.mx305-join-mentor__cards .mx302-icon{width:46px;height:46px;margin:0 auto 10px;padding:12px}
.mx305-join-mentor__cards h3{margin:0;color:var(--mx305-navy);font-size:13px;line-height:1.3}
.mx305-join-mentor__cards p{margin:6px 0 0;color:var(--mx305-muted);font-size:10.6px;line-height:1.45}
.mx305-join-mentor__media{position:relative;min-height:300px;margin:0;background:#edf7ef}
.mx305-join-mentor__media .mx302-device-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Katılım karşılaştırma kutularının referanstaki daha sakin ölçüsü. */
[data-mx-builder-key="join-fit"] .mx302-fit-grid h2{font-size:24px}
[data-mx-builder-key="join-fit"] .mx302-fit-grid article{padding:24px 26px}
[data-mx-builder-key="join-fit"] .mx302-fit-grid li{font-size:12px}
[data-mx-builder-key="join-learn"] .mx302-join-info-grid>article{padding:20px}

/* Video uygun değilse yanlış içerik göstermek yerine referans görsel/poster kalır. */
.mx304-video-placeholder{background:rgba(255,255,255,.94);box-shadow:0 8px 20px rgba(11,47,105,.12)}

/* Footer öncesi CTA'lar referanslardaki yatay bant oranında kalır. */
.mx302-cta{padding:25px 0}
.mx302-cta h2{font-size:clamp(23px,2.35vw,32px)}
.mx302-cta p{font-size:12px}

@media (max-width:900px){
  .mx305-join-mentor__grid{grid-template-columns:1fr}
  .mx305-join-mentor__media{min-height:330px;order:-1}
  .mx305-join-mentor__cards{padding:20px}
}

@media (max-width:767px){
  .mx305-hero-subheadline{font-size:19px;margin-top:10px}
  .mx302-split__copy h2{font-size:29px}
  [data-mx-builder-key="apex-hero"] h1,
  [data-mx-builder-key="academy-hero"] h1,
  [data-mx-builder-key="products-hero"] h1,
  [data-mx-builder-key="stories-hero"] h1,
  [data-mx-builder-key="explore-hero"] h1,
  [data-mx-builder-key="join-hero"] h1{font-size:clamp(38px,11vw,50px)}
  .mx305-join-mentor{padding-top:30px;padding-bottom:32px}
  .mx305-join-mentor__media{min-height:280px}
  .mx305-join-mentor__cards{grid-template-columns:1fr 1fr;gap:9px;padding:14px}
  .mx305-join-mentor__cards article{padding:14px 9px}
  .mx305-join-mentor__cards h3{font-size:12px}
  .mx305-join-mentor__cards p{font-size:10px}
  [data-mx-builder-key="join-fit"] .mx302-fit-grid article{padding:21px 18px}
}

@media (max-width:420px){
  .mx305-join-mentor__cards{grid-template-columns:1fr}
}