/* === SAYFA: hizmet-detay ================================ */
#page-hizmet-detay .media-area{padding:56px 0 0;overflow:hidden}
#page-hizmet-detay .media-area .in{max-width:var(--wrap);margin:0 auto;padding:0 0 0 var(--gut);display:flex;gap:16px;align-items:stretch}
#page-hizmet-detay .media-area .stat{
  position:relative;z-index:1;flex:none;width:340px;height:420px;border-radius:var(--radius);background:var(--brand);color:#fff;
  padding:32px;display:flex;flex-direction:column;justify-content:space-between;
}
#page-hizmet-detay .media-area .stat .d{font-size:14px;color:var(--dark-muted)}
#page-hizmet-detay .media-area .stat .t{font-size:56px;line-height:1;font-weight:300;letter-spacing:-0.03em;white-space:nowrap}
#page-hizmet-detay .media-area .stat .note{margin-top:14px;font-size:13px;line-height:1.6;color:var(--dark-muted-2)}
/* görseller scroll ile sola kayıyor (blade'deki script), değer kutusunun arkasına giriyor */
#page-hizmet-detay .media-area .imgs{display:flex;gap:16px;will-change:transform}
#page-hizmet-detay .media-area .img{
  flex:none;width:620px;height:420px;border-radius:var(--radius);background:var(--bg-soft);
  border:1px solid var(--line);overflow:hidden;
}
#page-hizmet-detay .media-area .img img{width:100%;height:100%;object-fit:cover}

#page-hizmet-detay .cap-area{max-width:var(--wrap);margin:0 auto;padding:48px var(--gut) 130px;display:grid;grid-template-columns:minmax(0,420px) minmax(0,560px);gap:64px;align-items:start}
#page-hizmet-detay .cap-area h2{margin:0;font-size:30px;line-height:1.22;font-weight:400;letter-spacing:-0.02em;text-wrap:balance}
#page-hizmet-detay .cap-area .texts{font-size:15px;line-height:1.75}

#page-hizmet-detay .specs-area{border-top:1px solid var(--line)}
/* sütunlar üstteki .cap-area ile birebir aynı: .left h2 ile, .right .texts ile hizalı */
#page-hizmet-detay .specs-area .in{max-width:var(--wrap);margin:0 auto;padding:110px var(--gut) 140px;display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:64px;align-items:start}
#page-hizmet-detay .specs-area .right{max-width:620px}
#page-hizmet-detay .specs-area .left{position:sticky;top:120px;container-type:inline-size}
/* kısa ad sütuna sığsın: --len (blade'den gelen karakter sayısı) ile
   sütun genişliğine göre punto düşürülüyor, 96px tavan */
#page-hizmet-detay .specs-area .left .short{font-size:min(96px,calc(100cqw / (var(--len,8) * 0.62)));line-height:0.94;font-weight:300;letter-spacing:-0.05em}
#page-hizmet-detay .specs-area .left .d{margin-top:28px;max-width:280px;font-size:16px;line-height:1.6;color:var(--muted)}
#page-hizmet-detay .specs-area .left .link{margin-top:36px}
#page-hizmet-detay .specs-area .right .kicker{display:block;padding-bottom:12px}
#page-hizmet-detay .specs-area .item{padding:32px 0;border-bottom:1px solid var(--line)}
#page-hizmet-detay .specs-area .item .top{display:flex;align-items:baseline;gap:16px;margin-bottom:12px}
#page-hizmet-detay .specs-area .item .n{font-size:12px;color:var(--line-3)}
#page-hizmet-detay .specs-area .item .t{font-size:17px;font-weight:500}
#page-hizmet-detay .specs-area .item .d{margin:0 0 0 28px;font-size:15px;line-height:1.75;color:var(--muted);text-wrap:pretty}

#page-hizmet-detay .nav-area{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut) 130px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#page-hizmet-detay .nav-area .item{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:36px 40px;transition:background-color .3s ease}
#page-hizmet-detay .nav-area .item:hover{background:var(--bg-soft)}
#page-hizmet-detay .nav-area .item.v2{text-align:right}
#page-hizmet-detay .nav-area .kicker{display:flex;align-items:center;gap:12px;margin-bottom:18px}
#page-hizmet-detay .nav-area .item.v2 .kicker{justify-content:flex-end}
#page-hizmet-detay .nav-area .kicker .i{display:block;width:24px;height:1px;background:var(--line-3)}
#page-hizmet-detay .nav-area .t{font-size:28px;font-weight:300;letter-spacing:-0.02em}
#page-hizmet-detay .nav-area .d{margin-top:10px;font-size:14px;color:var(--muted-2)}

@media (max-width:1024px){
  #page-hizmet-detay .media-area .stat{width:260px;height:320px;padding:24px}
  #page-hizmet-detay .media-area .stat .t{font-size:42px}
  #page-hizmet-detay .media-area .img{width:440px;height:320px}
  #page-hizmet-detay .cap-area{grid-template-columns:minmax(0,1fr);gap:24px;padding-bottom:80px}
  #page-hizmet-detay .specs-area .in{grid-template-columns:minmax(0,1fr);gap:40px;padding:70px var(--gut) 90px}
  #page-hizmet-detay .specs-area .left{position:static}
  #page-hizmet-detay .specs-area .left .short{font-size:min(64px,calc(100cqw / (var(--len,8) * 0.62)))}
  #page-hizmet-detay .nav-area{grid-template-columns:minmax(0,1fr);padding-bottom:90px}
  #page-hizmet-detay .nav-area .item.v2{text-align:left}
  #page-hizmet-detay .nav-area .item.v2 .kicker{justify-content:flex-start}
}
@media (max-width:560px){
  #page-hizmet-detay .media-area .img{width:280px;height:240px}
  #page-hizmet-detay .media-area .stat{width:220px;height:240px}
  #page-hizmet-detay .specs-area .item .d{margin-left:0}
}