/* ============================================================
   YURT ATLAS — MOBİL UYUM (300px → desktop)
   Bütün sayfalar için ortak override. atlas.css ve style.css'ten
   SONRA yüklenmeli (öncelikli kazansın).

   Kırılım noktaları:
     1280  → küçük masaüstü
     1024  → tablet yatay
      900  → tablet
      768  → tablet dik / büyük telefon
      540  → orta telefon
      420  → küçük telefon
      360  → çok küçük (eski Android)
      300  → minimum (Galaxy Fold dış ekran vb.)
   ============================================================ */

/* ────────────────────────────────────────────────
   0. KÜRESEL EMNİYET — TAŞMA YOK
   ──────────────────────────────────────────────── */
html, body {
  max-width: 100vw;
  overflow-x: hidden;
}
*, *::before, *::after { box-sizing: border-box; }
img, video, svg, iframe, canvas {
  max-width: 100%;
  height: auto;
}
img { display: block; }
table { max-width: 100%; }

/* Birçok yerde inline grid: 1fr 1fr 1fr 1fr kullanılıyor — taşmasını engelle */
[style*="grid-template-columns"] { max-width: 100%; }

/* Long URL / kelime kırma */
@media (max-width: 768px) {
  body, p, h1, h2, h3, h4, h5, h6, a, span, div, li {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  /* form alanları zoom yapmasın diye 16px minimum */
  input, textarea, select { font-size: 16px !important; }
}

/* ────────────────────────────────────────────────
   1. NAVBAR — Mobil iyileştirmeler
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  #navbar { padding: 0 12px !important; }
  #navbar .nav-inner {
    grid-template-columns: auto 1fr auto !important;
    height: 64px !important;
    gap: 8px !important;
  }
  #navbar .ya-logo-img { width: 32px; height: 32px; }
  #navbar .ya-logo-text { font-size: 14px; }

  .nav-actions { gap: 6px !important; }
  .nav-actions .ya-nav-action {
    padding: 8px 12px !important;
    font-size: 11px !important;
  }
  .nav-actions .ya-nav-action:not(.ya-nav-cta) { display: none !important; }

  .ya-menu-btn {
    padding: 6px 12px !important;
    font-size: 11px !important;
  }
  .ya-menu-btn-text { display: none !important; }
  .ya-menu-btn-bars { width: 16px !important; }
}
@media (max-width: 420px) {
  #navbar { padding: 0 10px !important; }
  #navbar .nav-inner { height: 60px !important; gap: 6px !important; }
  #navbar .ya-logo-img { width: 28px; height: 28px; }
  #navbar .ya-logo-text { font-size: 12px; letter-spacing: -.5px; }
  .nav-actions .ya-nav-cta { padding: 7px 10px !important; font-size: 10px !important; }
  .ya-menu-btn { padding: 5px 10px !important; }
}
@media (max-width: 340px) {
  #navbar .ya-logo-text { display: none; }
}

/* ────────────────────────────────────────────────
   2. MENÜ OVERLAY — Tam ekranda, taşma yok
   AGRESİF override: containing block + scrollbar gutter
   ──────────────────────────────────────────────── */
/* Menu açıkken sayfa scroll'unu + scrollbar'ı komple kilitle */
body.ya-menu-locked {
  overflow: hidden !important;
  position: fixed !important;
  width: 100% !important;
  top: 0;
  left: 0;
  right: 0;
}
html:has(body.ya-menu-locked),
html:has(body .ya-menu-overlay.open) {
  overflow: hidden !important;
  scrollbar-gutter: auto !important;
}
html:has(body.ya-menu-locked)::-webkit-scrollbar,
html:has(body .ya-menu-overlay.open)::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
}

@media (max-width: 1024px) {
  html body .ya-menu-overlay {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    contain: none !important;
    z-index: 99999 !important;
    /* MENÜNÜN KENDİ SCROLLBAR'INI GİZLE — sağdaki strip buydu */
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
  html body .ya-menu-overlay::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
  }
  .ya-menu-grid {
    grid-template-columns: 1fr !important;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
  .ya-menu-photo { display: none !important; }
  .ya-menu-links {
    padding: 88px 28px 28px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .ya-menu-links li {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  .ya-menu-links a {
    font-size: clamp(20px, 5.8vw, 32px) !important;
    padding: 14px 4px !important;
    letter-spacing: -.8px !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  /* Hover/active'de padding-left ekleme — taşmaya neden oluyordu */
  .ya-menu-links a:hover,
  .ya-menu-links a.active {
    padding-left: 4px !important;
  }
  /* Ok ikonunu hep görünür yap (hover yok mobilde) */
  .ya-menu-links a i {
    opacity: .9 !important;
    transform: none !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
    width: 18px !important;
    height: 18px !important;
  }
  /* KAPAT butonu — sol/üst güvenli konum */
  html body .ya-menu-close {
    top: 14px !important;
    right: 14px !important;
    padding: 8px 14px !important;
    font-size: 11px !important;
    letter-spacing: 1px !important;
    z-index: 100 !important;
  }
  .ya-menu-close-text { display: inline !important; }
  .ya-menu-side {
    padding: 16px 24px 32px !important;
    gap: 10px !important;
  }
  .ya-menu-side-card {
    padding: 16px !important;
    border-radius: 12px !important;
  }
  .ya-menu-side-label { font-size: 10px !important; }
  .ya-menu-side-title { font-size: 14px !important; }
  .ya-menu-close {
    top: 16px !important;
    right: 16px !important;
    padding: 8px 14px !important;
    font-size: 12px !important;
  }
}
@media (max-width: 540px) {
  .ya-menu-links { padding: 80px 18px 18px !important; }
  .ya-menu-links a { font-size: clamp(20px, 6vw, 30px) !important; padding: 10px 0 !important; }
  .ya-menu-links a span { font-size: 10px !important; width: 18px !important; }
  .ya-menu-side { padding: 12px 18px 24px !important; }
  .ya-menu-side-card { padding: 14px !important; }
  html body .ya-menu-socials {
    display: flex !important;
    gap: 18px !important;
    justify-content: center !important;
    align-items: center !important;
    margin-top: 22px !important;
    padding: 6px 0 !important;
    width: 100% !important;
  }
  html body .ya-menu-socials a {
    width: 44px !important;
    height: 44px !important;
    border: 1.5px solid rgba(255,255,255,.22) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }
  html body .ya-menu-socials a svg {
    width: 20px !important;
    height: 20px !important;
  }
}
@media (max-width: 360px) {
  .ya-menu-links { padding: 76px 14px 14px !important; }
  .ya-menu-links a { font-size: 18px !important; gap: 8px !important; padding: 8px 0 !important; }
  html body .ya-menu-socials { gap: 14px !important; margin-top: 18px !important; }
  html body .ya-menu-socials a { width: 40px !important; height: 40px !important; }
  html body .ya-menu-socials a svg { width: 18px !important; height: 18px !important; }
}

/* ────────────────────────────────────────────────
   3. CONTAINER & SECTION padding
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .container { padding-left: 16px !important; padding-right: 16px !important; }
  .section { padding-top: 40px !important; padding-bottom: 40px !important; }
  section[style*="padding"] { padding-left: 16px !important; padding-right: 16px !important; }
}
@media (max-width: 420px) {
  .container { padding-left: 12px !important; padding-right: 12px !important; }
  .section { padding-top: 28px !important; padding-bottom: 28px !important; }
  section[style*="padding"] { padding-left: 12px !important; padding-right: 12px !important; }
}
@media (max-width: 340px) {
  .container { padding-left: 10px !important; padding-right: 10px !important; }
}

/* ────────────────────────────────────────────────
   4. HERO — index.html arama hero'su
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ya-hero-search {
    padding: 100px 16px 60px !important;
    min-height: auto !important;
  }
  .ya-hs-title { font-size: clamp(24px, 7.5vw, 40px) !important; letter-spacing: -1px !important; }
  .ya-hs-sub   { font-size: 13px !important; margin-bottom: 28px !important; }
  .ya-hs-card  {
    flex-direction: column !important;
    padding: 12px !important;
    gap: 4px !important;
  }
  .ya-hs-field {
    width: 100% !important;
    padding: 10px 14px !important;
  }
  .ya-hs-divider { display: none !important; }
  .ya-hs-btn {
    width: 100% !important;
    padding: 14px 24px !important;
    justify-content: center !important;
    margin-top: 6px !important;
  }
  .ya-hs-drop { left: 0 !important; right: 0 !important; }
  .ya-hs-orb1 { width: 400px !important; height: 400px !important; top: -120px !important; right: -100px !important; }
  .ya-hs-orb2 { width: 350px !important; height: 350px !important; bottom: -120px !important; left: -100px !important; }
  .ya-hs-quick { margin-top: 16px !important; }
  .ya-hs-chip { padding: 5px 12px !important; font-size: 11px !important; }
}
@media (max-width: 420px) {
  .ya-hero-search { padding: 96px 12px 40px !important; }
  .ya-hs-title { font-size: 22px !important; }
  .ya-hs-sub { font-size: 12px !important; }
  .ya-hs-field { padding: 9px 12px !important; }
  .ya-hs-field-label { font-size: 9px !important; }
  .ya-hs-field select, .ya-hs-field input[type="text"] { font-size: 13px !important; }
}

/* ────────────────────────────────────────────────
   5. GRID'LER — şehir/yurt/üniversite kartları
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ya-city-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  .ya-dorm-card { min-height: 240px !important; }
}
@media (max-width: 540px) {
  .ya-city-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .ya-city-card-content { padding: 12px !important; }
  .ya-city-card-name { font-size: 16px !important; }
  .ya-city-card-meta { font-size: 11px !important; gap: 6px !important; flex-wrap: wrap; }
}
@media (max-width: 360px) {
  .ya-city-grid { grid-template-columns: 1fr !important; }
}

/* Genel inline grid override — sayfalardaki style="grid-template-columns:repeat(N,1fr)" */
@media (max-width: 900px) {
  [style*="grid-template-columns:repeat(5"],
  [style*="grid-template-columns: repeat(5"],
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (max-width: 700px) {
  [style*="grid-template-columns:repeat(5"],
  [style*="grid-template-columns: repeat(5"],
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"],
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 480px) {
  [style*="grid-template-columns:repeat(5"],
  [style*="grid-template-columns: repeat(5"],
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"],
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns:repeat(2"],
  [style*="grid-template-columns: repeat(2"] {
    grid-template-columns: 1fr !important;
  }
  [style*="1.7fr 1fr"],
  [style*="1.4fr 1fr"],
  [style*="1fr 1.4fr"],
  [style*="1fr 1.7fr"],
  [style*="1fr 1.3fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ────────────────────────────────────────────────
   6. ŞEHİR DETAY (sehir.html) — hero + içerik
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .sehir-hero-img + div + .container,
  .container .sehir-hero-stats { font-size: 12px !important; }
  .sehir-hero-stats { gap: 8px 14px !important; grid-template-columns: repeat(2, auto) !important; }
  .sehir-hero-actions { grid-template-columns: 1fr !important; width: 100% !important; }
  .sehir-hero-actions .btn { justify-content: center !important; }
  .sehir-info-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .sehir-tag { font-size: 11px !important; padding: 5px 10px !important; }
}
@media (max-width: 540px) {
  .sehir-hero-img + div + .container > p,
  .sehir-hero-stats { font-size: 11.5px !important; }
}

/* ────────────────────────────────────────────────
   7. YURT KARTLARI — Mobilde 2 sütun + kompakt logo
   (Sponsor kartları gibi yan yana 2 adet)
   NOT: html body prefix ile in-page style'lardan specificity yüksek
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  html body #city-featured-grid,
  html body #sehirler-featured-grid,
  html body #yurtlar-grid,
  html body #featured-grid,
  html body #featured-dorms-grid,
  html body #featured-restaurants-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  /* Kart kendisi - küçült */
  .ya-dorm-card {
    min-height: 220px !important;
    aspect-ratio: 1/1.25 !important;
  }
  /* Üst logo alanı (badge'leri içeren) - küçük padding */
  .ya-dorm-card > div:first-child {
    padding: 12px !important;
    min-height: 55% !important;
  }
  /* Logo kutusu — kart neredeyse dolu (sponsor benzeri büyük) */
  .ya-dorm-card [style*="width:140px"][style*="height:140px"],
  .ya-dorm-card [style*="width: 140px"][style*="height: 140px"] {
    width: 90% !important;
    height: 90% !important;
    max-width: 170px !important;
    max-height: 170px !important;
    min-width: 110px !important;
    min-height: 110px !important;
  }
  /* Logo image kendisi tam dolduracak */
  .ya-dorm-card [style*="width:140px"][style*="height:140px"] img,
  .ya-dorm-card [style*="width: 140px"][style*="height: 140px"] img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  /* Üst alanın padding'ini düşür - logo'ya daha çok yer */
  .ya-dorm-card > div:first-child {
    padding: 8px !important;
    min-height: 65% !important;
  }
  /* Badge'ler küçült */
  .ya-dorm-card span[style*="position:absolute"][style*="top:12px"] {
    font-size: 9px !important;
    padding: 3px 8px !important;
    top: 8px !important;
  }
  .ya-dorm-card span[style*="left:12px"] { left: 8px !important; }
  .ya-dorm-card span[style*="right:12px"] { right: 8px !important; }
  /* Alt kısım (isim + lokasyon) */
  .ya-dorm-card > div:last-child {
    padding: 10px 12px 12px !important;
    gap: 5px !important;
  }
  .ya-dorm-card h3 {
    font-size: 12px !important;
    letter-spacing: 0 !important;
    line-height: 1.2 !important;
    min-height: 2.4em !important;
  }
  .ya-dorm-card > div:last-child > div {
    font-size: 10.5px !important;
  }
  .ya-dorm-card svg, .ya-dorm-card [data-lucide] {
    width: 10px !important;
    height: 10px !important;
  }
  /* index.html inline style override - aspect-ratio (html body ile yüksek specificity) */
  html body #featured-dorms-grid > * { aspect-ratio: 1/1.25 !important; min-height: 220px !important; }
  /* restoran grid */
  html body #featured-restaurants-grid > * { height: 220px !important; min-height: 220px !important; }
  html body #featured-restaurants-grid .ya-dorm-card { height: 220px !important; }
  html body #featured-restaurants-grid .ya-dorm-photo { height: 110px !important; }
}
@media (max-width: 540px) {
  html body #city-featured-grid,
  html body #sehirler-featured-grid,
  html body #yurtlar-grid,
  html body #featured-grid,
  html body #featured-dorms-grid,
  html body #featured-restaurants-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .ya-dorm-card {
    min-height: 200px !important;
  }
  .ya-dorm-card [style*="width:140px"][style*="height:140px"] {
    width: 90% !important;
    height: 90% !important;
    max-width: 140px !important;
    max-height: 140px !important;
    min-width: 90px !important;
    min-height: 90px !important;
  }
  .ya-dorm-card h3 { font-size: 11px !important; }
  html body #featured-dorms-grid > * { min-height: 200px !important; }
  html body #featured-restaurants-grid > * { height: 200px !important; min-height: 200px !important; }
  html body #featured-restaurants-grid .ya-dorm-card { height: 200px !important; }
  html body #featured-restaurants-grid .ya-dorm-photo { height: 100px !important; }
}
@media (max-width: 360px) {
  /* Çok dar - hala 2 sütun ama daha kompakt */
  .ya-dorm-card { min-height: 180px !important; }
  .ya-dorm-card [style*="width:140px"][style*="height:140px"] {
    width: 90% !important;
    height: 90% !important;
    max-width: 110px !important;
    max-height: 110px !important;
    min-width: 70px !important;
    min-height: 70px !important;
  }
  .ya-dorm-card > div:first-child { padding: 8px !important; }
  .ya-dorm-card > div:last-child { padding: 8px 10px 10px !important; }
  .ya-dorm-card h3 { font-size: 10.5px !important; min-height: 2.2em !important; }
  .ya-dorm-card > div:last-child > div { font-size: 9.5px !important; }
}

/* ────────────────────────────────────────────────
   8. AUTH SAYFALARI (giris.html, kayit.html)
   ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  .shell { grid-template-columns: 1fr !important; }
  .hero { display: none !important; }
  .panel {
    min-height: 100vh !important;
    padding: 24px 20px !important;
  }
}
@media (max-width: 540px) {
  .panel { padding: 20px 14px !important; }
  .card-inner { padding: 0 !important; }
  h1.h-display { font-size: 24px !important; letter-spacing: -.6px !important; }
  .sub { font-size: 13px !important; }
  .roles { gap: 10px !important; }
  .role-card {
    grid-template-columns: 40px 1fr !important;
    gap: 12px !important;
    padding: 14px !important;
  }
  .role-card .ic-w { width: 40px !important; height: 40px !important; }
  .role-card .ic-w svg { width: 18px !important; height: 18px !important; }
  .role-card .info .ttl { font-size: 14px !important; }
  .role-card .info .desc { font-size: 11.5px !important; }
  .role-card .pick { display: none !important; }
  .duo { grid-template-columns: 1fr !important; gap: 12px !important; }
}
@media (max-width: 360px) {
  .panel { padding: 16px 12px !important; }
  h1.h-display { font-size: 22px !important; }
  .submit { padding: 14px 18px !important; font-size: 12px !important; letter-spacing: .8px !important; }
}

/* ────────────────────────────────────────────────
   9. ADMIN PANEL (admin.html)
   ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  /* Admin sidebar layout — yan menüyü üste taşı */
  body[data-page="admin"] { padding: 0 !important; }
  .admin-shell,
  [class*="admin-grid"] {
    grid-template-columns: 1fr !important;
  }
  .admin-sidebar {
    position: static !important;
    width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid var(--ya-border) !important;
  }
  .admin-content { padding: 16px !important; }
}
@media (max-width: 768px) {
  /* Admin tablar yan yana sığmazsa scroll */
  .admin-tabs,
  [class*="tab-row"] {
    overflow-x: auto !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  /* Veri kartları/tablo */
  table { font-size: 12px !important; }
  table th, table td { padding: 8px !important; }
  .admin-stat-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
}
@media (max-width: 480px) {
  .admin-stat-grid { grid-template-columns: 1fr !important; }
}

/* ────────────────────────────────────────────────
   10. PANEL (panel.html — yurt sahibi / restoran / öğrenci)
   ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  /* Panel header */
  .panel-header,
  [class*="panel-top"] { flex-wrap: wrap !important; gap: 10px !important; }
  /* Form ızgaraları stack */
  .panel-form,
  [class*="form-grid"] { grid-template-columns: 1fr !important; }
}
@media (max-width: 768px) {
  /* Yurdumu / restoranımı düzenle - 2 sütun form'lar tek sütun */
  form > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  /* Amenity ızgaraları */
  #my-amenities-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }
  #my-amenities-grid label { font-size: 11px !important; padding: 6px 8px !important; }
}
@media (max-width: 420px) {
  #my-amenities-grid { grid-template-columns: 1fr !important; }
}

/* ────────────────────────────────────────────────
   11. İLETİŞİM (iletisim.html)
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ya-contact-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .ya-contact-item { padding: 12px !important; }
  .ya-contact-icon { width: 40px !important; height: 40px !important; }
  .ya-form-row { grid-template-columns: 1fr !important; }
}

/* ────────────────────────────────────────────────
   12. FOOTER
   ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  .ya-footer-inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    padding: 40px 20px !important;
  }
  .ya-footer-center { text-align: center; }
  .ya-footer-tagline { font-size: clamp(22px, 5vw, 32px) !important; }
}
@media (max-width: 480px) {
  .ya-footer-inner { padding: 32px 14px !important; gap: 24px !important; }
  .ya-footer-social-link { font-size: 13px !important; }
}

/* ────────────────────────────────────────────────
   13. BUTON/CTA boyutları
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  .btn, button[class*="btn"] {
    font-size: 13px !important;
  }
  .btn-lg { padding: 14px 20px !important; font-size: 13px !important; }
  .btn-sm { padding: 8px 14px !important; font-size: 11px !important; }
}

/* ────────────────────────────────────────────────
   14. MODAL / DIALOG — taşma yok, scroll
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  [class*="modal"],
  [class*="dialog"],
  [role="dialog"] {
    max-width: 100vw !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
  }
  [class*="modal"] > div,
  [class*="dialog"] > div {
    max-width: calc(100vw - 24px) !important;
    margin: 12px !important;
  }
}

/* ────────────────────────────────────────────────
   15. TYPOGRAPHY ölçek
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  h1, .display { font-size: clamp(24px, 6vw, 36px) !important; line-height: 1.1 !important; }
  h2 { font-size: clamp(20px, 5vw, 28px) !important; }
  h3 { font-size: clamp(17px, 4vw, 22px) !important; }
  .lead { font-size: 14px !important; }
  /* uzun rakamlar (209+, vs.) */
  .ya-hs-title .ya-gradient-text { word-break: keep-all; }
}

/* ────────────────────────────────────────────────
   16. UYUMLULUK — eski kodlar için kalkan
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  /* width:max-content olan inline'lar mobilde 100% olsun */
  [style*="width:max-content"],
  [style*="width: max-content"] {
    width: 100% !important;
    max-width: 100% !important;
  }
  /* margin-left:7% gibi sabit margin'ler */
  [style*="margin-left:7%"],
  [style*="margin-left: 7%"] {
    margin-left: 0 !important;
  }
  /* min-width tekrar */
  [style*="min-width:"] { min-width: 0 !important; }
}

/* ────────────────────────────────────────────────
   17. NAV CTA varsayılan — daima görünür (auth pages dışında)
   ──────────────────────────────────────────────── */
@media (max-width: 420px) {
  /* "Kayıt Ol" görünmesin, sadece Giriş Yap göster */
  .nav-actions .ya-nav-cta { display: none !important; }
  .nav-actions [data-auth="guest"]:not(.ya-nav-cta) { display: inline-flex !important; padding: 7px 12px !important; font-size: 11px !important; }
}

/* ────────────────────────────────────────────────
   18. YURT DETAY (yurt.html) — galeri, oda kartı, info bloklar
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .yd-gallery { grid-template-columns: 1fr !important; grid-template-rows: 240px !important; }
  .yd-gallery .gimg:not(.main) { display: none !important; }
  .yd-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
  .yd-room { padding: 14px !important; gap: 10px !important; }
  .yd-room-info { min-width: 0 !important; }
  .yd-features-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 6px !important; padding: 10px !important; }
  .yd-info-grid { grid-template-columns: 1fr !important; padding: 14px !important; }
  .yd-feat { font-size: 11px !important; padding: 6px 8px !important; }
  .yd-feat .yd-feat-text { font-size: 11px !important; white-space: normal !important; }
  .yd-banner { font-size: 12px !important; padding: 10px 14px !important; }
}
@media (max-width: 420px) {
  .yd-gallery { grid-template-rows: 200px !important; }
  .yd-features-grid { grid-template-columns: 1fr !important; }
  .yd-room-price { font-size: 17px !important; }
  .yd-room-title { font-size: 14px !important; }
}

/* ────────────────────────────────────────────────
   19. ÜNİVERSİTE DETAY (universite.html)
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .uni-feat-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
  .uni-hero { padding: 24px 16px !important; }
  .uni-hero h1 { font-size: 24px !important; }
}
@media (max-width: 480px) {
  .uni-feat-grid { grid-template-columns: 1fr !important; }
}

/* ────────────────────────────────────────────────
   20. KYK sayfa
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .kyk-info-bar {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 12px 14px !important;
    font-size: 12px !important;
  }
}

/* ────────────────────────────────────────────────
   21. CONTENT MOUNT padding (yurt/universite/restoran detail)
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  #content-mount { padding-top: 60px !important; }
  #content-mount .container { padding-left: 12px !important; padding-right: 12px !important; }
}

/* ────────────────────────────────────────────────
   22. FORM INPUTS — geniş ekranlardan inherit edenler
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
  input[type="number"], input[type="search"], select, textarea {
    max-width: 100% !important;
    width: 100%;
  }
  /* yan yana 2'li form satırları */
  form > [style*="display:grid"][style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

/* ────────────────────────────────────────────────
   23. INLINE STYLE width:max-content + sehir-hero margin-left
   ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  /* sehir.html hero — margin-left:7% mobilde sıfırla, padding ekle */
  .sehir-hero-img + div + .container[style*="margin-left:7%"] {
    margin-left: 0 !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    max-width: 100% !important;
  }
  /* sehir hero 440px yükseklik mobilde fazla */
  section[style*="height:440px"] { height: auto !important; min-height: 380px !important; }
}

/* ────────────────────────────────────────────────
   24. ADMIN sticky-only on desktop fixes
   ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .ad-side { position: fixed !important; }
  .ad-shell { grid-template-columns: 1fr !important; }
}

/* ────────────────────────────────────────────────
   25. SEARCH dropdown - mobile fixes
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ya-bigsearch {
    flex-direction: column !important;
    gap: 4px !important;
    padding: 10px !important;
  }
  .ya-bigsearch input {
    width: 100% !important;
    padding: 14px 16px !important;
    font-size: 14px !important;
  }
  .ya-bigsearch button {
    width: 100% !important;
    padding: 12px 16px !important;
    justify-content: center !important;
  }
  .ya-bigsearch-icon { display: none !important; }
  .ya-bigsearch-suggestions { left: 0 !important; right: 0 !important; }
}

/* ────────────────────────────────────────────────
   26. NAV HOVER PREVIEW images / pop-ups — mobilde gizle
   ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  [class*="hover-preview"],
  [class*="popup"]:not([class*="modal"]) {
    display: none !important;
  }
}

/* ────────────────────────────────────────────────
   27. UNIVERSAL container width = 100%
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  div[style*="max-width:1640px"],
  div[style*="max-width:1400px"],
  div[style*="max-width:1280px"],
  div[style*="max-width:1200px"],
  div[style*="max-width:1100px"],
  div[style*="max-width: 1640px"],
  div[style*="max-width: 1400px"],
  div[style*="max-width: 1280px"],
  div[style*="max-width: 1200px"],
  div[style*="max-width: 1100px"] {
    max-width: 100% !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ────────────────────────────────────────────────
   28. UNIVERSAL flex-wrap on mobile
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  [style*="display:flex"][style*="justify-content:space-between"]:not([style*="flex-wrap"]) {
    flex-wrap: wrap;
  }
}

/* ────────────────────────────────────────────────
   29. RESERVATION buton / iletişim bilgileri
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  .ya-contact-icon { width: 36px !important; height: 36px !important; }
  .ya-contact-value { font-size: 13px !important; word-break: break-all; }
  .ya-contact-label { font-size: 10px !important; }
}

/* ────────────────────────────────────────────────
   30. UNIVERSAL min-width emniyet (inline)
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  [style*="min-width:280"],
  [style*="min-width: 280"],
  [style*="min-width:240"],
  [style*="min-width: 240"],
  [style*="min-width:200"],
  [style*="min-width: 200"] {
    min-width: 0 !important;
  }
  /* flex:1 + min-width içeren satırlar */
  [style*="flex:1"][style*="min-width"] {
    min-width: 0 !important;
    flex-basis: 100% !important;
  }
}

/* ────────────────────────────────────────────────
   31. RESTORAN DETAY (restoran.html)
   ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .rd-grid { grid-template-columns: 1fr !important; gap: 18px !important; }
}
@media (max-width: 768px) {
  .rd-hero { height: 240px !important; }
  .rd-hero-overlay { padding: 18px 18px !important; }
  .rd-hero-name { font-size: 24px !important; }
  .rd-hero-loc { font-size: 13px !important; }
  .rd-hero-featured { top: 12px !important; right: 12px !important; padding: 6px 10px !important; font-size: 10px !important; }
  .rd-card { padding: 16px !important; }
  .rd-card-title { font-size: 16px !important; }
  .rd-info-grid { grid-template-columns: 1fr !important; }
  .rd-thumbs { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)) !important; gap: 6px !important; }
  .rd-thumbs img { height: 72px !important; }
  .rd-coupons { padding: 16px !important; }
  .rd-coupons-header h3 { font-size: 16px !important; }
  .rd-coupon {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 14px !important;
    gap: 10px !important;
  }
  .rd-coupon-discount {
    min-width: 0 !important;
    border-right: none !important;
    border-bottom: 2px dashed var(--ya-border) !important;
    padding-right: 0 !important;
    padding-bottom: 10px !important;
    width: 100% !important;
    text-align: left !important;
    font-size: 28px !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
  }
  .rd-coupon-action { width: 100% !important; }
  .rd-coupon-code, .rd-coupon-claimed, .rd-coupon-expired { width: 100% !important; justify-content: center !important; }
}

/* ────────────────────────────────────────────────
   32. RESTORANLAR LİSTESİ / KART
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  #restoranlar-grid,
  #restaurants-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
}
@media (max-width: 480px) {
  #restoranlar-grid,
  #restaurants-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ────────────────────────────────────────────────
   33. NAVBAR sticky padding-top fix (#content-mount)
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  [id="content-mount"][style*="padding-top:72"],
  [id="content-mount"][style*="padding-top: 72"] {
    padding-top: 60px !important;
  }
}

/* ────────────────────────────────────────────────
   34. KAYIT (kayit.html) çok dar mobil için adımlar
   ──────────────────────────────────────────────── */
@media (max-width: 360px) {
  .progress { gap: 4px !important; }
  .eyebrow { font-size: 9px !important; padding: 5px 10px !important; letter-spacing: 1px !important; }
  .field { margin-bottom: 12px !important; }
  .field-label { font-size: 9px !important; }
  .input, .select, textarea.input { padding: 12px 14px !important; font-size: 14px !important; }
}

/* ────────────────────────────────────────────────
   35. MANIFESTO + VALUE photos (index.html)
   ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .ya-manifesto-flex { padding: 50px 20px !important; }
  .ya-manifesto-flex-text { font-size: clamp(20px, 5vw, 32px) !important; line-height: 1.35 !important; }
  .ya-value-photos {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 40px 16px !important;
  }
  .ya-value-photo { min-height: 280px !important; }
  .ya-section-flex { padding: 50px 0 !important; }
  .ya-section-flex-title { font-size: clamp(22px, 5vw, 34px) !important; }
  .ya-cta-flex { padding: 60px 20px !important; }
  .ya-cta-flex-title { font-size: clamp(26px, 7vw, 42px) !important; }
  .ya-cta-flex-form {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .ya-cta-flex-form input,
  .ya-cta-flex-form button {
    width: 100% !important;
  }
}

/* ────────────────────────────────────────────────
   36. TRUST / SPONSOR strip (index.html)
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ya-trust { padding: 30px 14px !important; }
  .ya-trust-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
  .ya-trust-cell { padding: 16px !important; }
  .ya-trust-tag { font-size: 11px !important; padding: 8px 14px !important; letter-spacing: 1px !important; }
}

/* ────────────────────────────────────────────────
   37. ŞEHİR FİLTRE CHIP'LERİ (index, sehirler)
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  .ya-filter-chips {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px !important;
  }
  .ya-filter-chip {
    flex-shrink: 0 !important;
    font-size: 11px !important;
    padding: 7px 12px !important;
  }
  .ya-region-tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px !important;
  }
  .ya-region-tab {
    flex-shrink: 0 !important;
    font-size: 11px !important;
    padding: 7px 12px !important;
  }
}

/* ────────────────────────────────────────────────
   38. TR HARİTASI mobil — küçült
   ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  #tr-map-mount { min-height: 320px !important; }
  #tr-map-mount svg { width: 100% !important; height: auto !important; }
}

/* ────────────────────────────────────────────────
   39. TÜM DETAY SAYFALARI — paragraf, başlık
   ──────────────────────────────────────────────── */
@media (max-width: 540px) {
  /* uzun başlıklar 3 satıra inebilir */
  h1.display, .ya-hs-title { letter-spacing: -.8px !important; }
  /* "Tüm Şehirler" gibi geri linkleri */
  a[href$="sehirler.html"][style*="position:absolute"] {
    position: static !important;
    margin-bottom: 12px !important;
    display: inline-flex !important;
  }
}

/* ────────────────────────────────────────────────
   40. SCROLL EMNİYET — son kalkan
   ──────────────────────────────────────────────── */
html { scroll-behavior: smooth; }
@media (max-width: 768px) {
  /* Hiçbir öğe viewport'tan taşmasın */
  body, body > * {
    max-width: 100vw;
  }
  /* Leaflet/harita gibi 3rd party'de overflow ihtimali */
  .leaflet-container { max-width: 100% !important; }
}

/* ════════════════════════════════════════════════
   41. NAVBAR — Mobilde DAİMA ARKA PLAN
   Detay sayfalarındaki koyu hero'lar üzerinde
   "Yurt" yazısı kayboluyor — zorla beyaz/krem bg.
   ════════════════════════════════════════════════ */
@media (max-width: 980px) {
  #navbar {
    background: rgba(242, 242, 242, 0.97) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid var(--ya-border) !important;
  }
  #navbar .ya-logo-text {
    color: var(--ya-navy) !important;
  }
  #navbar .ya-logo-text span {
    color: var(--ya-orange) !important;
  }
  /* MENU butonu daima koyu */
  #navbar:not(.scrolled) .ya-menu-btn {
    color: var(--ya-navy) !important;
    background: rgba(14,61,89,.06) !important;
  }
  #navbar:not(.scrolled) .ya-menu-btn-bars span {
    background: var(--ya-navy) !important;
  }
  /* Nav action linklerinin görünür olmasını sağla */
  #navbar:not(.scrolled) .nav-actions .ya-nav-action:not(.ya-nav-cta) {
    color: var(--ya-navy) !important;
  }
}

/* ════════════════════════════════════════════════
   42. NAVBAR — Logo yazısı taşma/clip fix
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  #navbar .nav-logo {
    flex-shrink: 0 !important;
    min-width: 0 !important;
  }
  #navbar .ya-logo-text {
    white-space: nowrap !important;
    overflow: visible !important;
    flex-shrink: 0 !important;
  }
  #navbar .ya-logo-img {
    flex-shrink: 0 !important;
  }
}

/* ════════════════════════════════════════════════
   43. FİLTRE CHIP'LERİ - WRAP YOK, TEK SATIRDA SCROLL
   ════════════════════════════════════════════════ */
.ya-filter-chip,
.ya-region-tab,
.ya-quick-city {
  white-space: nowrap !important;
}

/* sehirler.html sort butonları inline div içinde — yine de scrollable yapalım */
@media (max-width: 540px) {
  /* sort row */
  div[style*="display:flex;gap:8px"]:has(.ya-filter-chip),
  div[style*="display:flex; gap:8px"]:has(.ya-filter-chip) {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    padding-bottom: 4px;
  }
}

/* ════════════════════════════════════════════════
   44. SECTION FLEX HEAD (Tümünü Gör linkleri)
   Mobilde başlık + link satır arası kayıyor
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ya-section-flex-head {
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .ya-section-flex-head > div:first-child {
    width: 100% !important;
  }
  .ya-link-arrow {
    font-size: 12px !important;
    padding: 8px 14px !important;
    white-space: nowrap !important;
  }
}

/* ════════════════════════════════════════════════
   45. UNIVERSITE DETAY HERO - resim/başlık taşma
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Universite hero — başlık tek satırda taşmasın */
  [class*="uni-hero"] h1,
  [class*="uni-name"] {
    font-size: clamp(18px, 5vw, 28px) !important;
    line-height: 1.15 !important;
    word-break: break-word !important;
  }
  /* Universite badges (DEVLET ÜNİVERSİTESİ, EN İYİ 30) */
  [class*="uni-badge"] {
    font-size: 10px !important;
    padding: 5px 10px !important;
  }
  /* Map + Civar Yurtlar tab buttons */
  [class*="tab-btn"], [class*="uni-tab"] {
    font-size: 11px !important;
    padding: 8px 12px !important;
  }
  /* Kampüs/fakülte tab içeriği */
  [class*="campus-list"], [class*="faculty-list"] {
    overflow-x: auto !important;
    max-width: 100% !important;
  }
}

/* ════════════════════════════════════════════════
   46. SEHİR HERO — yazılar düzgün konumda
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .sehir-hero-img + div + .container {
    padding-bottom: 24px !important;
  }
  .sehir-hero-stats {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px 18px !important;
    width: 100% !important;
  }
  .sehir-hero-stats span {
    font-size: 12px !important;
  }
}

/* ════════════════════════════════════════════════
   47. YURT DETAY — adres / başlık taşma
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Yurt detay başlık kartı */
  [class*="yd-header"] {
    flex-direction: column !important;
    gap: 12px !important;
    align-items: flex-start !important;
  }
  /* Yurt adı + adres */
  [class*="dorm-title"], [class*="yd-title"] {
    font-size: clamp(20px, 5vw, 28px) !important;
    line-height: 1.15 !important;
    word-break: break-word !important;
  }
  /* Adres satırı */
  [class*="dorm-addr"], [class*="yd-addr"] {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
}

/* ════════════════════════════════════════════════
   48. UNIVERSAL — "Tümünü Gör" butonları nowrap
   ════════════════════════════════════════════════ */
.ya-link-arrow,
a[class*="link-arrow"] {
  white-space: nowrap;
}

/* ════════════════════════════════════════════════
   49. RESPONSIVE TABLE / sticky header fix
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Sticky header'lar mobile'da bottom border ile ayrıl */
  [class*="sticky"][class*="top"] {
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    background: inherit !important;
  }
}

/* ════════════════════════════════════════════════
   49B. TÜM YURT KART GRİDLERİ — küçük + sığ kart (desktop)
   ════════════════════════════════════════════════ */
@media (min-width: 1400px) {
  /* Geniş ekran: 5 sütun her yerde */
  html body #dorms-list.dorm-grid {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 12px !important;
  }
  html body #featured-grid,
  html body #featured-dorms-grid,
  html body #featured-restaurants-grid,
  html body #city-featured-grid,
  html body #sehirler-featured-grid {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 12px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1399px) {
  /* Orta masaüstü: hepsi 5 sütun */
  html body #dorms-list.dorm-grid,
  html body #featured-grid,
  html body #featured-dorms-grid,
  html body #featured-restaurants-grid,
  html body #city-featured-grid,
  html body #sehirler-featured-grid {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 10px !important;
  }
}
@media (min-width: 900px) and (max-width: 1099px) {
  /* Küçük masaüstü/tablet: 4 sütun */
  html body #dorms-list.dorm-grid,
  html body #featured-grid,
  html body #featured-dorms-grid,
  html body #featured-restaurants-grid,
  html body #city-featured-grid,
  html body #sehirler-featured-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
  }
}
@media (min-width: 1100px) {
  /* Tüm kartlar — sabit yükseklik, grid hücresine sığar */
  html body .ya-dorm-card {
    aspect-ratio: auto !important;
    width: 100% !important;
    height: 280px !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
  }
  html body .ya-dorm-card [style*="width:140px"][style*="height:140px"] {
    width: 95px !important;
    height: 95px !important;
  }
  html body .ya-dorm-card > div:first-child {
    padding: 10px !important;
    min-height: 0 !important;
    flex: 1 !important;
  }
  html body .ya-dorm-card > div:last-child {
    padding: 8px 12px 10px !important;
    gap: 4px !important;
    flex-shrink: 0 !important;
  }
  html body .ya-dorm-card h3 {
    font-size: 12px !important;
    line-height: 1.2 !important;
    min-height: calc(1.2em * 2) !important;
  }
  html body .ya-dorm-card > div:last-child > div {
    font-size: 10.5px !important;
  }
  html body .ya-dorm-card span[style*="top:12px"] {
    font-size: 9px !important;
    padding: 3px 8px !important;
    top: 8px !important;
  }
  html body .ya-dorm-card span[style*="left:12px"] { left: 8px !important; }
  html body .ya-dorm-card span[style*="right:12px"] { right: 8px !important; }
}

/* ════════════════════════════════════════════════
   50. PANEL HAMBURGER — mobile bar gizli/görünür
   ════════════════════════════════════════════════ */
.pn-mobile-bar { display: none; }
@media (max-width: 900px) {
  .pn-mobile-bar { display: flex !important; }
}

/* ════════════════════════════════════════════════
   51. INLINE GRID — tüm 1fr+px varyasyonları stack
   universite.html "1fr 340px", panel.html "260px 1fr" vb.
   ════════════════════════════════════════════════ */
@media (max-width: 900px) {
  [style*="grid-template-columns:1fr 340px"],
  [style*="grid-template-columns: 1fr 340px"],
  [style*="grid-template-columns:1fr 320px"],
  [style*="grid-template-columns: 1fr 320px"],
  [style*="grid-template-columns:1fr 300px"],
  [style*="grid-template-columns: 1fr 300px"],
  [style*="grid-template-columns:1fr 280px"],
  [style*="grid-template-columns: 1fr 280px"],
  [style*="grid-template-columns:1fr 260px"],
  [style*="grid-template-columns: 1fr 260px"],
  [style*="grid-template-columns:1fr 240px"],
  [style*="grid-template-columns: 1fr 240px"],
  [style*="grid-template-columns:340px 1fr"],
  [style*="grid-template-columns: 340px 1fr"],
  [style*="grid-template-columns:320px 1fr"],
  [style*="grid-template-columns: 320px 1fr"],
  [style*="grid-template-columns:300px 1fr"],
  [style*="grid-template-columns: 300px 1fr"],
  [style*="grid-template-columns:280px 1fr"],
  [style*="grid-template-columns: 280px 1fr"],
  [style*="grid-template-columns:260px 1fr"],
  [style*="grid-template-columns: 260px 1fr"],
  [style*="grid-template-columns:240px 1fr"],
  [style*="grid-template-columns: 240px 1fr"],
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr"],
  [style*="grid-template-columns:1.6fr 1fr"],
  [style*="grid-template-columns: 1.6fr 1fr"],
  [style*="grid-template-columns:1.5fr 1fr 1fr"],
  [style*="grid-template-columns: 1.5fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* ════════════════════════════════════════════════
   52. NAVBAR LOGO — küçük ekranda logo image küçült
   "Yurt" text görünürlük garantisi
   ════════════════════════════════════════════════ */
@media (max-width: 420px) {
  #navbar .ya-logo-img {
    width: 26px !important;
    height: 26px !important;
  }
  #navbar .ya-logo-text {
    font-size: 13px !important;
    letter-spacing: -.4px !important;
  }
}
@media (max-width: 360px) {
  #navbar .ya-logo-img {
    width: 24px !important;
    height: 24px !important;
  }
  #navbar .ya-logo-text {
    font-size: 12px !important;
  }
}

/* ════════════════════════════════════════════════
   53. HOMEPAGE HERO — Türkiye Haritası bölümü
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ya-tr-map-section {
    padding: 50px 14px 40px !important;
  }
  .ya-tr-map-section h2 {
    font-size: clamp(22px, 5.5vw, 32px) !important;
  }
  .ya-tr-map-section p {
    font-size: 14px !important;
  }
}

/* ════════════════════════════════════════════════
   54. POPÜLER chip strip - mobilde WRAP olsun (scrollbar yok)
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  html body .ya-hs-quick {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    gap: 6px !important;
    justify-content: center !important;
    margin-top: 14px !important;
    padding: 0 !important;
  }
  html body .ya-hs-chip {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding: 6px 12px !important;
    font-size: 11px !important;
  }
  html body .ya-hs-quick-label {
    flex-shrink: 0 !important;
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 4px !important;
    font-size: 11px !important;
  }
}

/* ════════════════════════════════════════════════
   54B. SCROLLBAR GİZLE — yatay scroll alanlarında
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ya-filter-chips,
  .ya-region-tabs,
  .ad-tabs,
  [class*="tab-row"],
  div[style*="display:flex;gap:8px"]:has(.ya-filter-chip) {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
  .ya-filter-chips::-webkit-scrollbar,
  .ya-region-tabs::-webkit-scrollbar,
  .ad-tabs::-webkit-scrollbar,
  [class*="tab-row"]::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
}

/* ════════════════════════════════════════════════
   55. UNIVERSITE STATS - 3 sütun emniyet
   ════════════════════════════════════════════════ */
@media (max-width: 540px) {
  .ya-uni-stats {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
  }
  .ya-uni-stat { padding: 10px 6px !important; }
  .ya-uni-stat-num { font-size: 16px !important; }
  .ya-uni-stat-lbl { font-size: 9px !important; letter-spacing: .2px !important; }
}

/* ════════════════════════════════════════════════
   56. UNIVERSITE detail grid (1fr 340px → 1fr)
   ════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .ya-detail-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
}

/* ════════════════════════════════════════════════
   57. INDEX hero search card - Şehir/Üniv/Tip stack
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ya-hs-card { gap: 6px !important; }
  .ya-hs-field { padding: 11px 14px !important; }
  .ya-hs-field select,
  .ya-hs-field input[type="text"] { font-size: 14px !important; }
  .ya-hs-divider { display: none !important; }
  .ya-hs-btn { margin-top: 4px !important; padding: 14px !important; font-size: 13px !important; }
}

/* ════════════════════════════════════════════════
   58. GENERAL — h2 word-break ve clamp tekrarı
   ════════════════════════════════════════════════ */
@media (max-width: 768px) {
  h1, h2, h3, h4 {
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  /* Tek kelime taşan inline başlıklar */
  [style*="font-size:clamp"] {
    word-break: break-word;
  }
}