/* /restoran-otomasyonu sayfası (urunlerimiz_kategori.php, IS-261). Düzen ortak kalıptan (css/nx/landing.css); burada
   görsel konumları ve ürün ızgarası var. Ürün kartı ana sayfanınki (nx.css .product-card, koyu .products-section);
   ana sayfada kaydırmalı şerittir, burada bütün ürünler bir bakışta görünsün ve her biri bağlantı olarak dursun diye
   ızgaradır. */
.nx.product-landing{
  --ld-hero-position:62% 50%;
  --ld-hero-position-narrow:15% 50%;
  --ld-hero-position-tablet:50% 38%;
  --ld-closing-position:50% 45%;
}

/* "Restoran otomasyonu," 560px'lik metin sütununa 72px'te de 59px'te de sığmıyor, başlık üç satıra iniyordu (ölçüldü,
   1440). Geniş ekranda başlık bir kademe küçülür ve satırlar (<br> ile ayrılı) kırılmaz; satır sütunu ~60px aşar ama
   görselin konusu (telefon, ~%35'ten sonra) açık kalır. ≤900'de sütun tam genişlik, dokunulmaz. */
@media(min-width:901px){
  .nx.product-landing .ld-hero-copy .nx-title{max-width:none;font-size:clamp(44px,4.1vw,60px);white-space:nowrap}
}

.nx .ro-products-side{display:grid;gap:12px}
.nx .ro-products-count{font-size:14px;font-weight:500;color:#fff}

/* Geniş ekranda 5 sütun: on ürün iki dolu sıra olur. Ürün görselleri dikey (~3:4) çekildiği için kart da dikey. */
.nx .ro-product-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none}
.nx .ro-product-grid li{display:flex;min-width:0}
/* nx.css'te kart kaydırmalı şeridin üyesidir (flex-basis sütun payı); ızgarada hücreyi doldurur */
.nx .ro-product-grid .product-card{display:flex;flex-direction:column;flex:1 1 auto;color:inherit}
.nx .ro-product-grid .product-image{height:auto;aspect-ratio:4/5}
.nx .ro-product-grid .product-body{flex:1;padding:18px 18px 20px}
.nx .ro-product-grid .product-body h3{font-size:18px;align-items:baseline}
.nx .ro-product-grid .product-body h3 span{flex:none;font-size:17px}
.nx .ro-product-grid .product-body p{margin-top:8px;font-size:13px;line-height:1.6}
/* Kalıbın odak çizgisi koyu (#141516); koyu bölümde görünmez */
.nx.ld .ro-products a:focus-visible{outline-color:#fff}

/* 1179 ve altı: 5 sütun dar kalır (kart ~190px); kart yatay satıra döner, görsel solda */
@media(max-width:1179px){
  .nx .ro-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .nx .ro-product-grid .product-card{flex-direction:row;align-items:stretch}
  .nx .ro-product-grid .product-image{flex:0 0 128px;aspect-ratio:auto;min-height:156px}
  .nx .ro-product-grid .product-body{display:flex;flex-direction:column;justify-content:center;padding:16px 18px}
}
@media(max-width:600px){
  .nx .ro-product-grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .nx .ro-product-grid .product-image{flex-basis:104px;min-height:128px}
  .nx .ro-product-grid .product-body{padding:14px 16px}
  .nx .ro-product-grid .product-body h3{font-size:17px}
}
