/* ─────── RESPONSIVE ───────
   Breakpoint sistemi (CLAUDE.md "Responsive Kuralları"):
   masaüstü öncelikli, SADECE max-width, SADECE bu üç kırılım:
   1340px = laptop   (ince ayar: büyük tipografi/boşluk daralır; menü hamburger'a geçer)
   980px  = tablet   (menü hamburger'a döner, çok kolonlu yapılar tek kolona iner)
   640px  = telefon  (tipografi ve iç boşluklar küçülür)
   Blok sırası genelden özele: 1200 → 980 → 640. Yeni kırılım EKLENMEZ. */

/* ── 1340px: laptop (menü 1328px altında sığmıyor; 1340px güvenli marj) ── */
@media(max-width:1340px){
  /* masaüstü menüsü bu genişliğin altına sığmıyor — hamburger'a geç (CTA header'da kalır) */
  .menu{display:none}
  .nav-toggle{display:block}
  .mobile-nav{display:block}
  /* 1340px'de header desktop stilinde kalıyor (top:32px + ~80px yükseklik = 112px alt kenar) */
  .mobile-nav-inner{padding-top:136px}
  .hero h2{font-size:64px}
  .sec-h2{font-size:52px}
  .page-hero .sec-h2{font-size:64px}
  .svc-list-grid--quad{grid-template-columns:repeat(2,1fr)} /* 4 kolon laptopta sıkışıyor — 2'ye iner (980'de 1) */
  .blog-list-grid{grid-template-columns:repeat(2,1fr)}
  .footer-col-split ul{grid-template-columns:1fr} /* Sektörler tek sütuna iner ki İletişim satıra düşmesin */
  /* ceo mesajı */
  .ceo-body{gap:60px}
  /* portfolio contact */
  .pf-contact-body{gap:60px}
}

/* ── 980px: tablet ── */
@media(max-width:980px){
  /* header */
  /* masaüstündeki translateX(-50%) + calc genişlik mobilde header'ı ekran dışına itiyor — left/right ile konumla */
  .site-header{padding:9px 9px 9px 20px;top:12px;left:12px;right:12px;transform:none;width:auto}
  .site-header.is-scrolled{top:8px}
  .brand img{height:40px}
  .nav-right{gap:12px}
  .nav-right>.ykc-btn{display:none} /* Teklif Alın CTA'sı mobilde panelin içinde */
  /* hero */
  .hero-content{padding:120px 0 100px}
  .hero h2{font-size:44px}
  .hero-sub{font-size:17px}
  .hero-h1-row{margin-bottom:40px}
  .hero-play-circle{width:64px;height:64px}
  .hero-bottom{flex-direction:column;align-items:flex-start;gap:28px}
  /* page hero (iç sayfa) */
  .page-hero .sec-h2{font-size:44px}
  .page-hero{min-height:min(46vh, 400px)}
  /* radius'lu beyaz şerit mobilde inceltilir; ardından gelen section'ın üst boşluğu kısılır
     (şerit 48 + section 80 = ~130px boşluk çok geliyordu; yeni toplam ~80px) */
  .page-hero::after{height:32px;border-radius:32px 32px 0 0}
  .page-hero:not(.page-hero--min)+section{padding-top:48px}
  .page-hero-content{padding:130px 0 84px}
  .page-hero-sub{font-size:17px}
  .page-hero--light .page-hero-content{padding:140px 0 84px}
  .page-hero--min .page-hero-content{padding:150px 0 72px}
  /* v4 plain: tek kolona iner, alt metin sola döner (section-head'in mobil davranışıyla aynı) */
  .page-hero--plain{min-height:0} /* base'in 46vh kuralını ezer — yükseklik içerikten */
  .page-hero--plain .page-hero-content{padding:140px 0 72px}
  .page-hero--plain .page-hero-content .wrap{grid-template-columns:1fr;row-gap:14px}
  .page-hero--plain .page-hero-sub{text-align:left;justify-self:start}
  .svc-list-grid{grid-template-columns:1fr;gap:14px}
  /* blog grid tablet: 2 kolon kalır, featured tam genişlik */
  .blog-list-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .blog-list-grid .svc-list-card--featured{grid-column:span 2}
  /* mobilde hover yok: açıklama + ikon hep açık, gradient güçlenir (ana sayfa svc-item davranışı) */
  .svc-list-card{aspect-ratio:6/5} /* açık içerik sığsın diye kart uzar */
  .svc-list-inner{padding:20px}
  .svc-list-reveal{opacity:1;max-height:240px;padding-top:10px;transform:none;flex-direction:column;align-items:flex-start;gap:14px} /* ikon açıklamanın altına iner */
  .svc-list-card .ykc-btn-icon{width:40px;height:40px;align-self:flex-start} /* buttons.css'teki align-self:center'ı ez — sola yapışır */
  .svc-list-card::before{background:linear-gradient(180deg,rgba(18,18,18,0.12) 0%,rgba(18,18,18,0.55) 100%)}
  .page-hero-grid{grid-template-columns:1fr;gap:36px}
  .page-hero-media{min-height:56vw;border-radius:24px 24px 0 0;margin-bottom:-84px}
  /* ortak section ritmi */
  section{padding:80px 0}
  .services{padding-top:90px} /* hero sonrası istisnanın mobil karşılığı */
  section[data-pt="small"]{padding-top:40px}
  section[data-pt="ara"]  {padding-top:60px}
  section[data-pt="large"]{padding-top:120px}
  section[data-pb="small"]{padding-bottom:40px}
  section[data-pb="ara"]  {padding-bottom:60px}
  section[data-pb="large"]{padding-bottom:120px}
  .sec-h2{font-size:36px}
  .sec-h3{font-size:26px}
  .section-head{grid-template-columns:1fr;gap:32px;margin-bottom:40px}
  .section-head .section-head-desc{text-align:left}
  .section-head--center{justify-items:start;text-align:left} /* mobilde ortalama kalkar, sola yaslanır */
  /* services */
  .svc-bento{grid-template-columns:1fr;grid-template-rows:auto;gap:14px}
  .svc-item:nth-child(1),
  .svc-item:nth-child(2),
  .svc-item:nth-child(3),
  .svc-item:nth-child(4){grid-column:1;grid-row:auto;min-height:260px}
  .svc-item p,.svc-cta{opacity:1;transform:translateY(0)}
  .svc-item::before{background:linear-gradient(180deg,rgba(18,18,18,0.2) 0%,rgba(18,18,18,0.65) 100%)}
  /* about + kurumsal */
  .about-split{grid-template-columns:1fr;gap:44px}
  .manifesto-inner .sec-h2{margin-bottom:24px}
  .manifesto-inner h2{font-size:36px}
  .feature-split,.feature-split--reverse{grid-template-columns:1fr;gap:36px}
  *+.feature-split{margin-top:72px}
  .feature-split--reverse .feature-media{order:0}
  .feature-media{min-height:56vw}
  .stats-row{margin-top:64px;grid-template-columns:repeat(2,1fr);gap:14px}
  .stat{min-height:180px;padding:28px 24px 24px;gap:28px}
  .stat-num{font-size:52px}
  .vm-row{flex-direction:column}
  .vm-media{order:-1;min-height:56vw} /* mobilde görsel her zaman üstte */
  .vm-card{padding:36px 28px}
  /* politika kartları (global bileşen: kurumsal + eğitim & denetim) */
  .policy-grid{grid-template-columns:1fr}
  .policy-card{padding:36px 28px}
  /* panel varyantı (standalone blok) */
  section.policy--panel{clip-path:inset(0 8px round 14px)}
  .policy--panel .policy-card{padding:0}
  /* eğitim & denetim */
  .manifesto .policy-grid{margin-top:64px}
  /* hizmet detay */
  .cta-band-grid{grid-template-columns:1fr}
  .cta-band-card{padding:40px 28px;gap:22px}
  .cta-band-card .ykc-btn{margin-top:8px}
  .cta-band-media{min-height:56vw}
  .process{clip-path:inset(0 8px round 14px)}
  .process::before{left:8px;right:8px;border-radius:14px}
  .process-layout{grid-template-columns:1fr;gap:44px}
  .process-head{position:static}
  .process-items{grid-template-columns:1fr;gap:22px}
  /* media trio (global bileşen: faaliyet detay + hizmet detay) */
  .media-trio{grid-template-columns:1fr;gap:40px}
  .media-trio-media{aspect-ratio:auto;min-height:56vw}
  /* faaliyet detay */
  .fa-trio{clip-path:inset(0 8px round 14px)}
  .fa-trio::before{left:8px;right:8px;border-radius:14px}
  /* insan kaynakları */
  section.trio-panel{clip-path:inset(0 8px round 14px)}
  .ik-trio{clip-path:inset(0 8px round 14px)}
  .ik-trio::before{left:8px;right:8px;border-radius:14px}
  .ik-extra-wrap{margin-top:40px}
  .about-photo-wrap{min-height:56vw;border-radius:18px}
  .about-cards{gap:12px}
  /* eğitim & denetim */
  .edu-cycle{clip-path:inset(0 8px round 14px)}
  .edu-cycle::before{left:8px;right:8px;border-radius:14px}
  /* sectors */
  .sectors{clip-path:inset(0 8px round 14px)}
  .sectors::before{left:8px;right:8px;border-radius:14px}
  .sec-head-right{align-items:flex-start}
  .sec-card{flex:0 0 85vw;aspect-ratio:5/3}
  .sec-rail{gap:16px;padding:0 20px}
  .sec-title h3{font-size:28px}
  .sec-title .sub{font-size:14px}
  /* risk */
  .risk-steps{grid-template-columns:1fr}
  .risk-step{padding:36px 28px 40px}
  .risk-num{margin-bottom:48px}
  /* portfolio */
  .portfolio{padding:80px 0 96px}
  .pf-inner{grid-template-columns:1fr;gap:48px}
  /* iş başvuru */
  .qf-row{grid-template-columns:1fr;gap:18px}
  /* iletişim */
  .contact{padding:80px 0} /* global mobil section ritmine döner */
  .contact-map{height:320px;margin-top:40px}
  .contact-panel{padding:44px 32px;gap:40px}
  .cp-value{font-size:22px}
  /* quote */
  .quote-grid{grid-template-columns:1fr;row-gap:56px}
  .quote-split .quote-grid{padding-top:44px;padding-bottom:80px} /* section alt boşluğunun mobil karşılığı (grid içine taşınmış istisna) */
  .quote-split .quote-grid::before{display:none}
  /* tek kolonda absolute görsel sıfır yükseklikte kalır — normal akışa dön */
  .quote-media{position:static}
  .quote-media img{aspect-ratio:4/3}
  /* footer */
  .footer .wrap{padding-top:56px}
  .footer-top{flex-direction:column;align-items:flex-start;gap:28px;padding-bottom:30px}
  .footer-headline{max-width:100%}
  .footer-main{gap:36px 32px;padding:44px 0}
  .footer-col-split{flex-basis:100%}
  .footer-contact{margin-left:0;flex-basis:100%}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:16px}
  .footer-legal{flex-wrap:wrap;gap:18px}
  /* referans-detay */
  .ref-layout{grid-template-columns:1fr;gap:40px}
  .ref-logo-box{position:static;max-width:260px}
  /* portfolio contact */
  .pf-contact-body{grid-template-columns:1fr;gap:44px}
  .pf-action-card{padding:22px 24px}
  /* ceo mesajı: tek kolona iner, görsel öne geçer */
  .ceo-body{grid-template-columns:1fr;gap:44px}
  .ceo-visual{position:static;order:-1}
  .ceo-img-frame{padding:0}
  .ceo-img-wrap{aspect-ratio:16/9}
}

/* ── 640px: telefon ── */
@media(max-width:640px){
  /* blog-detay */
  .blog-post{padding-top:40px}
  /* blog listeleme — tek kolon */
  .blog-list-grid{grid-template-columns:1fr}
  .blog-list-grid .svc-list-card--featured{grid-column:span 1}
  .wrap{padding:0 20px}
  .mobile-nav-inner{padding:96px 20px 40px;}
  .hero h2{font-size:38px}
  .sec-h2{font-size:32px}
  .page-hero .sec-h2{font-size:38px}
  .svc-item-inner{padding:28px 24px}
  .pf-logo-grid{grid-template-columns:repeat(2,1fr)}
  .pf-action-card{gap:16px;padding:20px}
  .sec-title{left:24px;right:24px;bottom:24px}
  .sec-title h3{font-size:24px}
  .manifesto-inner h2{font-size:32px}
  .footer-col-split ul{grid-template-columns:1fr}
  /* ceo mesajı telefon */
  .ceo-text .sec-h2{margin-bottom:28px}
  .ceo-text .sec-p+.sec-p,.ceo-text p+p{margin-top:18px}
  .ceo-attribution{margin-top:36px}
  /* sectors – tek kart görünümü, dot navigasyon */
  .sec-card{flex:0 0 calc(100vw - 40px)}
  .sec-nav-btn{display:none}
  .sec-dots{display:flex}
}