/* PratikVision tanıtım sitesi: masaüstü düzeni.
   ortak-2.css'ten sonra yüklenir. Referans genişlik 1440; 1280, 1920 ve %200 yakınlaştırma
   (720 px) için de çalışır. Sayfaya özel kurallar sayfanın kendi dosyasındadır. */

:root {
  --kenar: clamp(24px, 4.5vw, 64px);
  --kap: 1312px;
  --bolum-dolgu: 96px;
  --ust-yukseklik: 76px;

  --boy-slogan: 72px;
  --boy-baslik: 40px;
  --boy-ara: 22px;
  --boy-govde: 18px;
  --boy-kucuk: 15px;
}

/* 12 sütunlu ızgara, 24 px oluk */
.izgara {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 24px;
}

/* Bölüm başlığı yan yana: başlık solda (5 sütun), giriş metni sağda (6 sütun).
   Ardışık iki bölümde aynı yerleşim kullanılmaz; bir bölümde yan yana, ötekinde alt alta. */
.bolum-bas--yan {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 24px;
  align-items: baseline;
  max-width: none;
}

.bolum-bas--yan > .zaman {
  grid-column: 1 / -1;
}

.bolum-bas--yan > h2 {
  grid-column: 1 / span 5;
}

.bolum-bas--yan > .on-metin {
  grid-column: 7 / span 6;
  max-width: none;
  margin-top: 0;
}

/* Menü düğmesi sağda dursun (dar pencerede görünür) */
.menu-dugme {
  margin-right: -12px;
}

/* Alt bilgi */
.alt {
  padding: 52px 0 40px;
}

.alt__ic {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 32px;
}

.alt__marka {
  grid-column: 1 / span 4;
}

.alt__iletisim {
  grid-column: 6 / span 4;
}

.alt__baglar {
  grid-column: 10 / span 3;
}

.alt__liste li + li {
  margin-top: 4px;
}

/* Bağlantılar dokunmatikte de en az 24 px yükseklikte */
.alt__liste a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

.alt__telif {
  grid-column: 1 / -1;
  margin-top: 8px;
  padding-top: 20px;
}

/* Dar sayfa, yanında görsel: metin solda, fotoğraf ya da ekran sağda */
.dar-sayfa--iki .dar-sayfa__izgara {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 24px;
  align-items: center;
}

.dar-sayfa--iki .dar-sayfa__ic {
  grid-column: 1 / span 6;
}

.dar-sayfa--iki .dar-sayfa__gorsel {
  grid-column: 8 / span 5;
}

/* Dar pencere ve %200 yakınlaştırma: menü düğmeye, yan yana bloklar alt alta */
@media (max-width: 1100px) {
  :root {
    --boy-slogan: clamp(44px, 6.6vw, 72px);
    --boy-baslik: clamp(32px, 3.8vw, 40px);
  }

  .ust__menu {
    display: none;
  }

  .ust__eylem {
    margin-left: auto;
    padding-left: 0;
    border-left: 0;
  }

  .menu-dugme {
    display: inline-flex;
  }

  .bolum-bas--yan {
    display: block;
  }

  .bolum-bas--yan > .on-metin {
    margin-top: var(--b-4);
  }

  .alt__marka,
  .alt__iletisim,
  .alt__baglar {
    grid-column: 1 / -1;
  }

  .dar-sayfa--iki .dar-sayfa__ic,
  .dar-sayfa--iki .dar-sayfa__gorsel {
    grid-column: 1 / -1;
  }

  .dar-sayfa--iki .dar-sayfa__gorsel {
    margin-top: var(--b-7);
  }
}

/* Geniş ekranda açılır menü hiç görünmez */
@media (min-width: 1101px) {
  .menu {
    display: none;
  }
}

/* Çok dar pencere (%250 ve üstü yakınlaştırma): üst çubukta yalnız logo ve menü düğmesi */
@media (max-width: 600px) {
  :root {
    --kenar: 20px;
    --bolum-dolgu: 64px;
    --boy-slogan: clamp(30px, 9vw, 44px);
    --boy-baslik: 28px;
    --boy-ara: 20px;
    --boy-govde: 17px;
  }

  .ust__eylem {
    display: none;
  }

  .ust__logo img {
    height: 30px;
  }

  /* 12 sütunun 11 oluğu dar pencerede yer kaplamasın */
  .izgara {
    column-gap: 12px;
  }

  .alt__ic {
    display: block;
  }

  .alt__ic > * + * {
    margin-top: 24px;
  }

  .menu-dugme {
    margin-left: auto;
  }

  .alt {
    padding: 40px 0 32px;
  }
}
