﻿/*
 * ══════════════════════════════════════════════════════════
 *  DEVICE-SPECIFIC CSS — En Çok Kullanılan 10 Telefon Modeli
 *  Content was rephrased for compliance with licensing restrictions
 *
 *  1.  iPhone SE 3 (375×667)
 *  2.  iPhone 16 / 15 / 14 (390×844)
 *  3.  iPhone 16 Pro Max / 15 Pro Max (430×932)
 *  4.  Samsung Galaxy S24 / S23 (360×780)
 *  5.  Samsung Galaxy A16 / A15 / Pixel 8 (412×915)
 *  6.  Samsung Galaxy A54 (412×892)
 *  7.  Xiaomi Redmi Note 13 / Huawei P60 (393×873)
 *  8.  OnePlus 12 (412×919)
 *  9.  iPad Mini (768×1024) — küçük tablet
 *  10. Genel küçük telefon (<360px)
 * ══════════════════════════════════════════════════════════
 */

/* ─────────────────────────────────────────
   0. ORTAK MOBİL TEMEL (tüm telefonlar)
   ───────────────────────────────────────── */
@media (hover:none) and (pointer:coarse){

  /* Slider caption */
  .slider .item .caption{
    top:clamp(60px,10svh,90px);
    bottom:clamp(70px,10svh,100px);
  }

  /* Scroll ok */
  .scroll{
    bottom:clamp(14px,3.5svh,30px) !important;
  }

  /* Yetkinlikler glassmorphism kutu kaydırma */
  .competencies .competenciesList{
    max-height:88vh !important;max-height:88svh !important;
    overflow-y:auto !important;
  }
}

/* ─────────────────────────────────────────
   1. iPhone SE 3 — 375×667
      Küçük ekran, kısa yükseklik
   ───────────────────────────────────────── */
@media only screen and (max-width:375px) and (max-height:667px){

  /* Header küçük */
  header .logo img{ max-width:135px !important; }
  header .menuLeft .menuBar{ width:26px !important; }
  header .menuLeft .menuBar span{ width:26px !important; }

  /* Caption daha yukarı */
  .slider .item .caption{
    top:clamp(55px,9svh,75px) !important;
    bottom:clamp(60px,10svh,80px) !important;
  }
  .slider .item .caption .title{
    font-size:clamp(11px,3.5vw,16px) !important;
    line-height:1.2 !important;
  }
  .slider .item .caption .title .subtitle-text{
    display:none !important;
  }
  .caption-certs img{ width:clamp(40px,16vw,56px) !important; }

  /* Sayılarla İstikamet — daha sıkışık */
  .numberPage .all{
    padding-top:clamp(52px,9svh,72px) !important;
    padding-bottom:clamp(8px,1.5svh,14px) !important;
  }
  .numberPage .centered h3{ font-size:clamp(14px,4.5vw,18px) !important; }
  .numberPage .lists{ min-height:clamp(60px,11svh,80px) !important; }
  .numberPage .lists i{ font-size:clamp(18px,5vw,24px) !important; }

  /* Yetkinlikler */
  .competencies .competenciesList{
    padding:clamp(12px,2.5svh,20px) clamp(10px,3vw,16px) !important;
  }
  .competencies .competenciesList ul li a{
    padding:clamp(7px,1.4svh,11px) clamp(8px,2.5vw,13px) !important;
    font-size:clamp(10px,2.8vw,13px) !important;
  }

  /* Hakkımızda */
  .aboutHome .bigTitle h3{ font-size:clamp(16px,4.5svh,24px) !important; }

  /* Scroll ok */
  .scroll i{ width:32px !important; height:32px !important; }
}

/* ─────────────────────────────────────────
   2. iPhone 16 / 15 / 14 — 390×844
      Standart iPhone boyutu
   ───────────────────────────────────────── */
@media only screen and (min-width:385px) and (max-width:395px) and (min-height:830px) and (max-height:860px){

  header .logo img{ max-width:158px !important; }

  .slider .item .caption .title{
    font-size:clamp(13px,4vw,19px) !important;
  }
  .caption-certs img{ width:clamp(52px,18vw,72px) !important; }

  .numberPage .all{
    padding-top:clamp(58px,10svh,82px) !important;
    padding-bottom:clamp(12px,2svh,20px) !important;
  }
  .numberPage .centered h3{ font-size:clamp(16px,4.5vw,22px) !important; }

  .competencies .competenciesList ul li a{
    padding:clamp(9px,1.7svh,13px) clamp(12px,3vw,17px) !important;
    font-size:clamp(12px,3.2vw,15px) !important;
  }
}

/* ─────────────────────────────────────────
   3. iPhone 16 Pro Max / 15 Pro Max — 430×932
      Büyük iPhone, geniş ekran
   ───────────────────────────────────────── */
@media only screen and (min-width:425px) and (max-width:435px) and (min-height:920px) and (max-height:945px){

  header .logo img{ max-width:175px !important; }
  header .menuLeft .menuBar{ width:34px !important; }

  .slider .item .caption .title{
    font-size:clamp(15px,4.5vw,22px) !important;
  }
  .slider .item .caption .title .subtitle-text{
    font-size:clamp(11px,2.8vw,14px) !important;
  }
  .caption-certs img{ width:clamp(58px,19vw,80px) !important; }

  .numberPage .centered h3{ font-size:clamp(17px,4.5vw,24px) !important; }
  .numberPage .lists i{ font-size:clamp(24px,6.5vw,32px) !important; }

  .competencies .competenciesList ul li a{
    padding:clamp(11px,2svh,16px) clamp(14px,3.5vw,20px) !important;
    font-size:clamp(13px,3.5vw,16px) !important;
  }
  .competencies .competenciesList .title_mobLeft h2{
    font-size:clamp(16px,4.5vw,22px) !important;
  }

  .aboutHome .bigTitle h3{ font-size:clamp(20px,5.5svh,32px) !important; }
}

/* ─────────────────────────────────────────
   4. Samsung Galaxy S24 / S23 — 360×780
      Dar Samsung ekranı
   ───────────────────────────────────────── */
@media only screen and (max-width:365px) and (min-height:770px){

  header .logo img{ max-width:140px !important; }
  header .menuLeft .menuBar{ width:27px !important; }
  header .menuLeft .menuBar span{ width:27px !important; }

  .slider .item .caption .title{
    font-size:clamp(12px,3.8vw,17px) !important;
  }
  .slider .item .caption .title .subtitle-text{
    font-size:clamp(9px,2.5vw,12px) !important;
  }
  .caption-certs img{ width:clamp(44px,17vw,62px) !important; }

  .numberPage .all{
    padding-top:clamp(52px,9svh,75px) !important;
    padding-bottom:clamp(10px,1.8svh,16px) !important;
  }
  .numberPage .lists span{ font-size:clamp(8px,2.2vw,10px) !important; }
  .numberPage .lists span img{ width:12px !important; height:12px !important; }
  .numberPage .lists i{ font-size:clamp(16px,4.5vw,20px) !important; }

  .competencies .competenciesList{
    width:calc(100% - 20px) !important;
    padding:clamp(12px,2.5svh,20px) clamp(10px,3vw,15px) !important;
  }
  .competencies .competenciesList ul li a{
    font-size:clamp(10px,3vw,13px) !important;
    padding:clamp(8px,1.5svh,12px) clamp(9px,2.5vw,13px) !important;
  }
  .competencies .competenciesList ul li a .comp-icon{
    width:clamp(14px,4vw,18px) !important;
    height:clamp(14px,4vw,18px) !important;
  }
}

/* ─────────────────────────────────────────
   5. Samsung A16 / A15 / Google Pixel 8 — 412×915
      Uzun Android ekranı (referans model)
   ───────────────────────────────────────── */
@media only screen and (min-width:408px) and (max-width:416px) and (min-height:905px) and (max-height:925px){

  header .logo img{ max-width:190px !important; }

  .slider .item .caption{
    top:clamp(62px,10svh,88px) !important;
    bottom:clamp(72px,11svh,100px) !important;
  }
  .slider .item .caption .title{
    font-size:clamp(13px,4vw,19px) !important;
  }
  .caption-certs img{ width:clamp(52px,18vw,74px) !important; }

  .numberPage .all{
    padding-top:clamp(55px,9svh,78px) !important;
    padding-bottom:clamp(10px,1.8svh,18px) !important;
  }
  .numberPage .centered h3{ font-size:clamp(15px,4.2vw,20px) !important; }
  .numberPage .lists span{ font-size:clamp(8px,2.2vw,11px) !important; }
  .numberPage .lists i{ font-size:clamp(20px,5.5vw,26px) !important; }

  .competencies .competenciesList ul li a{
    padding:clamp(9px,1.7svh,13px) clamp(11px,3vw,16px) !important;
    font-size:clamp(11px,3.2vw,14px) !important;
  }

  .aboutHome .bigTitle h3{ font-size:clamp(18px,5svh,28px) !important; }
}

/* ─────────────────────────────────────────
   6. Samsung Galaxy A54 — 412×892
      Orta boy Android
   ───────────────────────────────────────── */
@media only screen and (min-width:408px) and (max-width:416px) and (min-height:882px) and (max-height:902px){

  .slider .item .caption{
    top:clamp(60px,9.5svh,85px) !important;
    bottom:clamp(68px,10.5svh,95px) !important;
  }
  .numberPage .all{
    padding-top:clamp(54px,8.8svh,76px) !important;
    padding-bottom:clamp(10px,1.8svh,17px) !important;
  }
  .competencies .competenciesList ul li a{
    padding:clamp(9px,1.6svh,13px) clamp(11px,3vw,16px) !important;
  }
}

/* ─────────────────────────────────────────
   7. Xiaomi Redmi Note 13 / Huawei P60 — 393×873
      Orta boy, yaygın Çin markası boyutu
   ───────────────────────────────────────── */
@media only screen and (min-width:388px) and (max-width:398px) and (min-height:860px) and (max-height:885px){

  header .logo img{ max-width:155px !important; }

  .slider .item .caption .title{
    font-size:clamp(13px,3.8vw,18px) !important;
  }
  .caption-certs img{ width:clamp(50px,17.5vw,70px) !important; }

  .numberPage .centered h3{ font-size:clamp(15px,4.2vw,21px) !important; }
  .numberPage .lists span{ font-size:clamp(8px,2.2vw,11px) !important; }
  .numberPage .lists i{ font-size:clamp(20px,5.5vw,26px) !important; }

  .competencies .competenciesList ul li a{
    font-size:clamp(11px,3.2vw,14px) !important;
  }
}

/* ─────────────────────────────────────────
   8. OnePlus 12 — 412×919
      Uzun Android, OnePlus
   ───────────────────────────────────────── */
@media only screen and (min-width:408px) and (max-width:416px) and (min-height:909px) and (max-height:929px){

  .slider .item .caption{
    top:clamp(63px,10svh,90px) !important;
    bottom:clamp(73px,11svh,102px) !important;
  }
  .numberPage .all{
    padding-top:clamp(56px,9svh,80px) !important;
    padding-bottom:clamp(10px,1.8svh,18px) !important;
  }
  .competencies .competenciesList ul li a{
    padding:clamp(10px,1.8svh,14px) clamp(12px,3vw,17px) !important;
  }
}

/* ─────────────────────────────────────────
   9. iPad Mini — 768×1024
      Küçük tablet, masaüstü layout'a geçiş
   ───────────────────────────────────────── */
@media only screen and (min-width:768px) and (max-width:820px) and (max-height:1180px){

  /* Header masaüstü moduna geçiş */
  header .allHeader{
    padding-left:24px !important;
    padding-right:24px !important;
  }
  header .logo img{ max-width:190px !important; }

  /* Caption tablet için */
  .slider .item .caption .title{
    font-size:clamp(22px,4vw,32px) !important;
  }
  .slider .item .caption .title .subtitle-text{
    font-size:clamp(13px,2vw,16px) !important;
  }
  .caption-certs img{ width:clamp(70px,12vw,100px) !important; }

  /* Sayılarla İstikamet */
  .numberPage .centered h3{ font-size:clamp(22px,4vw,30px) !important; }
  .numberPage .lists i{ font-size:clamp(24px,5vw,32px) !important; }
  .numberPage .lists span{ font-size:clamp(12px,2vw,15px) !important; }

  /* Yetkinlikler */
  .competencies .competenciesList ul li a{
    font-size:clamp(14px,2.5vw,18px) !important;
    padding:clamp(12px,2svh,18px) clamp(16px,3vw,24px) !important;
  }
  .competencies .competenciesList .title_mobLeft h2{
    font-size:clamp(18px,3vw,26px) !important;
  }
}

/* ─────────────────────────────────────────
   10. Çok küçük telefonlar — <360px genişlik
       Eski/bütçe modeller
   ───────────────────────────────────────── */
@media only screen and (max-width:359px){

  header .logo img{ max-width:125px !important; }
  header .menuLeft .menuBar{ width:24px !important; }
  header .menuLeft .menuBar span{ width:24px !important; }
  header .menuRight span{ font-size:11px !important; }
  header .search img{ width:15px !important; height:15px !important; }

  .slider .item .caption .title{
    font-size:clamp(10px,3.5vw,15px) !important;
    line-height:1.2 !important;
  }
  .slider .item .caption .title .subtitle-text{ display:none !important; }
  .caption-certs img{ width:clamp(36px,15vw,52px) !important; }
  .caption-btns .caption-btn-primary,
  .caption-btns .caption-btn-ghost{
    font-size:10px !important;
    padding:7px 12px !important;
  }

  .numberPage .all{
    padding-top:clamp(48px,9svh,68px) !important;
    padding-bottom:clamp(8px,1.5svh,12px) !important;
  }
  .numberPage .centered h3{ font-size:clamp(13px,4vw,17px) !important; }
  .numberPage .lists span{
    font-size:clamp(7px,1.9vw,9px) !important;
    padding-left:0 !important;
  }
  .numberPage .lists span img{ width:12px !important; height:12px !important; }
  .numberPage .lists i{ font-size:clamp(17px,4.5vw,22px) !important; }

  .competencies .competenciesList{
    width:calc(100% - 16px) !important;
    padding:clamp(10px,2svh,16px) clamp(8px,2.5vw,12px) !important;
  }
  .competencies .competenciesList ul li a{
    font-size:clamp(9px,2.8vw,12px) !important;
    padding:clamp(7px,1.3svh,10px) clamp(8px,2.5vw,12px) !important;
  }
  .competencies .competenciesList ul li a .comp-icon{
    width:14px !important;
    height:14px !important;
  }

  .aboutHome .bigTitle h3{ font-size:clamp(14px,4svh,20px) !important; }
}


/* ══════════════════════════════════════════════════════════
   ARA ÇÖZÜNÜRLÜK BREAKPOINT'LERİ
   390×844 (mobil) ile 1920×1080 (masaüstü) arası tüm boyutlar
   ══════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────
   A. Küçük Tablet / Büyük Telefon Yatay
      480px – 767px
   ───────────────────────────────────────── */
@media only screen and (min-width:480px) and (max-width:767px){

  /* certificateList min-width override */
  .certificateList{ min-width:100% !important; }

  /* Sayılarla İstikamet: 2 sütunlu grid */
  .numberPage .row .col-3{
    -ms-flex:0 0 50%;
    flex:0 0 50%;
    max-width:50%;
  }

  /* Haberler grid: 2 sütun */
  .news-grid{ grid-template-columns:repeat(2,1fr) !important; }

  /* Haber detay başlık */
  .newsDetail h1{ font-size:clamp(18px,4.5vw,26px) !important; }

  /* Üretim kartları: 2 sütun */
  .uretim-dept-grid{ grid-template-columns:repeat(2,1fr) !important; }
  .uretim-stat-grid{ grid-template-columns:repeat(2,1fr) !important; }
}

/* ─────────────────────────────────────────
   B. Tablet
      768px – 1023px
   ───────────────────────────────────────── */
@media only screen and (min-width:768px) and (max-width:1023px){

  /* Page layout — tam genişlik, sütunlar gizli */
  .page{ display:block !important; float:left !important; width:100% !important; padding:0 6vw !important; }
  .leftSide{ display:none !important; }
  .rightSide{ display:none !important; }
  .centerPage{ max-width:100% !important; padding:0 !important; width:100% !important; }

  /* Haber grid: 2 sütun */
  .news-grid{ grid-template-columns:repeat(2,1fr) !important; }

  /* Sayılarla İstikamet: 3 sütunlu */
  .numberPage .row .col-3{
    -ms-flex:0 0 33.333%;
    flex:0 0 33.333%;
    max-width:33.333%;
  }

  /* Üretim kartları */
  .uretim-dept-grid{ grid-template-columns:repeat(2,1fr) !important; }
  .uretim-stat-grid{ grid-template-columns:repeat(3,1fr) !important; }

  /* Tablo */
  .certificateList{ min-width:100% !important; }

  /* Section margin */
  section{ margin:clamp(60px,10vw,80px) 0 0 0 !important; }
}

/* ─────────────────────────────────────────
   C. Küçük Laptop / Büyük Tablet
      1024px – 1199px
   ───────────────────────────────────────── */
@media only screen and (min-width:1024px) and (max-width:1199px){

  /* Page: mobil gibi davranıyor ama biraz daha geniş padding */
  .page{ display:block !important; float:left !important; width:100% !important; padding:0 5vw !important; }
  .leftSide{ display:none !important; }
  .rightSide{ display:none !important; }
  .centerPage{
    max-width:100% !important;
    padding:0 !important;
    width:100% !important;
  }

  /* Header — mobil stili */
  header .allHeader{
    height:clamp(60px,8vw,75px);
    min-height:unset;
  }

  /* Haber grid: 3 sütun */
  .news-grid{ grid-template-columns:repeat(3,1fr) !important; }

  /* Üretim */
  .uretim-dept-grid{ grid-template-columns:repeat(3,1fr) !important; }
  .uretim-stat-grid{ grid-template-columns:repeat(4,1fr) !important; }

  /* Sayılarla İstikamet */
  .numberPage .row .col-3{
    -ms-flex:0 0 25%;
    flex:0 0 25%;
    max-width:25%;
  }

  /* Section margin */
  section{ margin:clamp(70px,8vw,80px) 0 0 0 !important; }
}

/* ─────────────────────────────────────────
   D. Orta Laptop
      1200px – 1439px
   ───────────────────────────────────────── */
@media only screen and (min-width:1200px) and (max-width:1439px){

  /* centerPage daha küçük */
  .centerPage{ max-width:clamp(600px,52vw,780px) !important; }

  /* rightSide küçült */
  .rightSide{ width:clamp(200px,22vw,340px) !important; }

  /* Haber grid */
  .news-grid{ grid-template-columns:repeat(3,1fr) !important; }

  /* Üretim */
  .uretim-dept-grid{ grid-template-columns:repeat(4,1fr) !important; }
  .uretim-stat-grid{ grid-template-columns:repeat(4,1fr) !important; }

  /* Lab slider yükseklik */
  .productionSlider .slick-slide img{
    height:clamp(320px,35vw,480px) !important;
  }
}

/* ─────────────────────────────────────────
   E. Büyük Laptop / Küçük Masaüstü
      1440px – 1679px
   ───────────────────────────────────────── */
@media only screen and (min-width:1440px) and (max-width:1679px){

  .centerPage{ max-width:clamp(700px,50vw,860px) !important; }

  .news-grid{ grid-template-columns:repeat(3,1fr) !important; }

  .uretim-dept-grid{ grid-template-columns:repeat(4,1fr) !important; }

  .productionSlider .slick-slide img{
    height:clamp(400px,33vw,520px) !important;
  }
}

/* ─────────────────────────────────────────
   F. Geniş Masaüstü
      1680px – 1919px
   ───────────────────────────────────────── */
@media only screen and (min-width:1680px) and (max-width:1919px){

  .centerPage{ max-width:clamp(800px,48vw,900px) !important; }

  .rightSide{ width:clamp(300px,20vw,380px) !important; }

  .productionSlider .slick-slide img{
    height:clamp(480px,32vw,560px) !important;
  }
}

/* ─────────────────────────────────────────
   G. Ultra Geniş / 4K
      2560px+
   ───────────────────────────────────────── */
@media only screen and (min-width:2560px){

  .centerPage{ max-width:1200px !important; }
  .container-fluid{ padding:0 6vw !important; }
  .page{ padding:0 6vw !important; }

  .news-grid{ grid-template-columns:repeat(4,1fr) !important; }

  .productionSlider .slick-slide img{
    height:700px !important;
  }
}

/* ─────────────────────────────────────────
   H. Genel yatay (landscape) telefon
      max-height: 500px, min-width: 480px
   ───────────────────────────────────────── */
@media only screen and (max-height:500px) and (min-width:480px) and (orientation:landscape){

  /* Header kompakt */
  header .allHeader{
    height:48px !important;
    min-height:unset !important;
  }
  header .logo img{ max-width:120px !important; }

  /* Section margin küçük */
  section{ margin:50px 0 0 0 !important; }

  /* Yetkinlikler listesi kaydırılabilir */
  .competencies .competenciesList{
    max-height:80vh !important;
    overflow-y:auto !important;
  }

  /* Caption basitleştir */
  .slider .item .caption .title .subtitle-text{
    display:none !important;
  }
}

/* ─────────────────────────────────────────
   I. overflow-x genel önlem
   ───────────────────────────────────────── */
@media only screen and (max-width:1199px){

  html, body{
    overflow-x:hidden !important;
    max-width:100vw !important;
  }

  /* CNC tablo wrapper: scroll için body override */
  .cnc-table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Tablo overflow */
  .certificateList{
    min-width:unset !important;
    width:100% !important;
    overflow-x:auto !important;
  }

  /* Tablolar yatay kaydırılabilir */
  .uretim-furnace-table{
    display:block !important;
    overflow-x:auto !important;
    white-space:nowrap !important;
  }
}
