/* ══ MOBİL — max-width: 768px ══ */

/* ══════════════════════════════════════════════════════════════════════
   MOBİL — max-width: 768px (tablet + mobil)
══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* NOT: body{cursor:auto} kuralı buradan kaldırıldı — bu kural genişlik
     bazlıydı (max-width:768px), dokunmatik olmayan ama dar pencereli
     masaüstü tarayıcılarda (küçük ekran/zoom) özel imlecin üzerine klasik
     imleci bindiriyordu. Dokunmatik-only cihazlarda imleç zaten main.js
     içindeki (hover:none)+(pointer:coarse) kontrolüyle doğru şekilde
     auto'ya çevriliyor — bkz. js/main.js fixTouchCursor(). */

  /* Yatay scroll engeli — sadece body'de (html'e eklemek iOS scroll'u kilitler) */
  body {
    overflow-x: hidden;
  }

  /* ── INDEX — HERO ── */
  .video-hero-wrap {
    height: 100svh;
    min-height: 100svh;
  }

  /* ── INDEX — QUOTE / SAKURA BÖLÜMÜ ── */
  .quote-wrap {
    padding: 60px 5vw;
  }

  .quote-body {
    font-size: clamp(1.2rem, 5vw, 1.6rem);
    line-height: 1.6;
  }

  /* ── INDEX — SHORTS (SCROLL-VIDEO) ── */
  .shorts-section {
    padding: 60px 0 80px;
  }

  .shorts-intro {
    padding: 0 5vw 60px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .shorts-intro h2 {
    font-size: clamp(2rem, 7vw, 3rem);
  }

  .shorts-intro p {
    max-width: 100%;
    font-size: 0.95rem;
  }

  .videos-stack {
    padding: 0 5vw;
    gap: 60px;
  }

  /* ── INDEX — SERVİS KARTLARI ── */
  .services-links-section {
    padding: 60px 4vw;
  }

  /* ── INDEX — TEAM ── */
  .team-section {
    padding: 80px 5vw;
  }

  .sec-title {
    font-size: clamp(2rem, 7vw, 3rem);
    margin-bottom: 40px;
  }

  /* team-grid: 2 kolon 992px'de zaten uygulanıyor, 576px'de 1 kolona geçiyor */

  /* ── INDEX — NOTES (YORUMLAR) ── */
  .notes-section {
    padding: 60px 0;
  }

  /* ── NOTES — KARANLK/AÇIK GEÇİŞ ── */
  /* notes.css'te overflow:hidden var; ::after top:-10% haleyi keser.
     Mobilde hale çok şeffaf (rgba 0.07) — görsel bozukluk yok.
     Geçiş keskinliği ::before (1px gradient çizgi) ile sağlanıyor. */

  /* ── HİZMETLER — HERO ── */
  .srv-hero {
    height: 100svh;
    min-height: 100svh;
  }

  /* ── HİZMETLER — NAV BÖLÜMÜ ── */
  .srv-nav-section {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .srv-path-container {
    overflow-x: auto;
    justify-content: flex-start;
    padding: 0 4vw;
    gap: 0;
  }

  .srv-path-btn {
    flex-shrink: 0;
    padding: 12px 10px;
    min-width: 64px;
  }

  .srv-path-connector {
    min-width: 10px;
    width: 10px;
  }

  /* ── HİZMETLER — SECTION İÇ PADDING ── */
  .srv-section-inner {
    padding: 60px 5vw;
  }

  .srv-section-header {
    margin-bottom: 40px;
  }

  /* ── HİZMETLER — KART DUO ── */
  .srv-card-duo,
  .srv-card-duo--reverse {
    flex-direction: column;
    gap: 28px;
  }

  .srv-card-visual {
    width: 100%;
    height: 260px;
  }

  /* ── HİZMETLER — VIDEO ŞERİT ── */
  .srv-video-strip {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 10px;
  }

  .srv-video-strip video {
    width: 100%;
    height: 280px;
    border-radius: 12px;
  }

  /* ── HİZMETLER — LANG ÇIFTI ── */
  .srv-langs {
    flex-wrap: wrap;
    gap: 8px;
  }

  .srv-lang-arrow {
    display: none;
  }

  /* ── HİZMETLER — CTA ── */
  .srv-cta-section {
    padding: 80px 5vw;
  }

  /* ── OKUL-İŞ — HERO ── */
  .oi-hero {
    height: 100svh;
    min-height: 100svh;
  }

  .oi-hero-content {
    margin-top: 0;
    padding: 0 5vw;
  }

  /* ── OKUL-İŞ — BÖLÜM PADDING ── */
  .oi-section {
    padding: 60px 0;
  }

  .oi-section-inner {
    padding: 0 5vw;
  }

  /* ── OKUL-İŞ — KART DUO ── */
  .oi-card-duo,
  .oi-card-duo--reverse {
    flex-direction: column;
    gap: 28px;
  }

  .oi-card-visual {
    width: 100%;
    height: 260px;
  }

  /* ── OKUL-İŞ — BELGE GRID ── */
  .oi-doc-grid {
    grid-template-columns: 1fr;
  }

  /* ── OKUL-İŞ — BELGE CTA ── */
  .oi-doc-cta {
    flex-direction: column;
    text-align: center;
    padding: 36px 5vw;
    gap: 20px;
  }

  .oi-doc-cta::before {
    display: none;
  }

  .oi-doc-cta-btn {
    white-space: normal;
    text-align: center;
  }

  /* ── OKUL-İŞ — FINAL CTA ── */
  .oi-final-cta {
    padding: 80px 5vw;
  }

  /* ── HAKKIMIZDA — HERO ── */
  .about-hero-sticky {
    height: 100svh;
  }

  /* ── HAKKIMIZDA — PIN WRAP ── */
  /* 250vh masaüstüne özgü sticky scroll derinliği — mobilde gereksiz ve sorunlu */
  .about-hero-pin-wrap {
    height: auto;
    min-height: 100svh;
  }

  /* ── OKUL-İŞ — PATH NAV YAY SCROLL ── */
  /* okul-nav.css'te overflow: hidden var — mobilde tab'lar kesilebilir */
  .oi-path-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start;
  }

  /* ── HAKKIMIZDA — ASYM ROW ── */
  .asym-row,
  .asym-row.inverse {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-bottom: 60px;
    max-width: 100%;
  }

  .asym-img-frame {
    height: 280px;
  }

  /* ── HAKKIMIZDA — INFO BÖLÜMÜ ── */
  .about-info-section {
    padding: 60px 5vw;
  }

  .about-partners-stat {
    flex-wrap: wrap;
    gap: 20px;
  }

  .aps-item {
    min-width: 30%;
  }

  .aps-divider {
    display: none;
  }

  /* ── KURSLAR — HERO ── */
  .kurs-hero-wrap {
    height: 100svh;
    min-height: 100svh;
  }

  .hero-title {
    font-size: clamp(2rem, 6.5vw, 3.2rem);
  }

  /* ── KURSLAR — EKİP BÖLÜMÜ ── */
  .k-team-section {
    padding: 80px 5vw;
  }

  .k-sec-title {
    font-size: clamp(2rem, 7vw, 3rem);
    margin-bottom: 40px;
  }

  /* ── KURSLAR — HOVER VİDEO ── */
  .hover-videos-section {
    padding: 50px 5vw;
  }

  /* ── KURSLAR — ENROLL SECTION ── */
  .enroll-section {
    padding: 60px 0 40px;
  }

  /* ── CONTACT — HERO ── */
  .contact-hero-sec {
    padding: 140px 5vw 50px;
  }

  .contact-hero-container h1 {
    font-size: clamp(2rem, 7vw, 3rem);
  }

  /* ── CONTACT — FORM ── */
  .contact-form-card {
    padding: 28px 20px;
  }

  /* ── CONTACT — SOCIAL TİCKER ── */
  .social-ticker-section {
    margin-bottom: 50px;
  }

  /* ── GALERİ (FSO) ── */
  .fso-gallery-sec {
    padding: 60px 5vw;
  }

  /* ── SPLIT SCROLL ── */
  .split-pin-wrap {
    height: auto;
  }

  .split-sticky {
    position: relative;
    height: auto;
    flex-direction: column;
    padding: 60px 5vw;
    gap: 32px;
  }

  .split-left {
    width: 100%;
    margin-top: 0;
    justify-content: center;
  }

  .split-frame {
    max-width: 90%;
    margin: 0 auto;
    aspect-ratio: 1/1;
  }

  .split-right {
    height: auto;
    width: 100%;
    text-align: center;
  }

  .split-text {
    position: relative;
    opacity: 1;
    transform: none;
    left: auto;
    width: 100%;
    pointer-events: auto;
  }

  .split-text.active {
    transform: none;
  }

  /* ── FOOTER ── */
  footer {
    padding: 60px 5vw;
    /* safe-area-inset-bottom korunuyor — main.css'teki max() ile zaten yönetiliyor */
    padding-bottom: max(40px, calc(24px + env(safe-area-inset-bottom, 0px)));
  }

}