/* =========================================================
   RADYE GRUP — ÜRÜNLER MODÜLÜ
   Ayrı dosya. style.css'teki değişkenleri (--steel-900, --accent-600,
   --radius, --font-display, --ease, --shadow-*) kullanır.
   header.php bu dosyayı style.css'ten SONRA yükler.
   ========================================================= */

/* ---- Liste: kategori bölümleri ---- */
.products-cat{padding:56px 0}
.products-cat + .products-cat{padding-top:0}
.products-cat .cat-desc{color:var(--muted);max-width:62ch;margin:10px 0 30px}
.page-hero .lead{color:var(--steel-300)}   /* koyu hero üstünde okunur açık gri */

/* ---- Ürün kartı (kapak görselli) ---- */
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.product-card{
  display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;color:inherit;box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s;
}
.product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.product-card .p-cover{min-height:220px;position:relative;background-size:cover;background-position:center}
.product-card .p-cover::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 14px,transparent 14px 28px)}
.product-card .p-cover[style*="background-image"]::after{display:none}  /* gerçek görselde desen kapanır */
.product-card .p-tag{
  position:absolute;left:14px;bottom:14px;z-index:2;
  background:var(--accent-600);color:#fff;font-family:var(--font-display);
  text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;padding:5px 11px;border-radius:2px;
}
.product-card .p-body{padding:22px 22px 24px}
.product-card .p-body h3{font-size:1.3rem;margin-bottom:8px}
.product-card .p-body p{color:var(--muted);font-size:.95rem;margin-bottom:14px}
.product-card .p-link{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;color:var(--accent-600);font-weight:600;font-size:.9rem}

/* ---- Detay: görsel + galeri ---- */
.pd-cover{min-height:360px;border-radius:var(--radius);position:relative;overflow:hidden;background-size:cover;background-position:center;background-color:var(--steel-800)}
.pd-cover::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 16px,transparent 16px 32px)}
.pd-cover[style*="background-image"]::after{display:none}
.pd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.pd-thumbs a{border-radius:var(--radius);overflow:hidden;aspect-ratio:1;display:block}
.pd-thumbs img{width:100%;height:100%;object-fit:cover}

/* ---- Detay: sağ sütun ---- */
.pd-cat{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.12em;color:var(--accent-600);font-size:.8rem;margin-bottom:8px}
.pd-info .lead{margin-bottom:20px}
.pd-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.pd-body{max-width:760px;margin-top:44px}
.pd-body p{color:var(--muted);margin-bottom:16px}
.pd-body h2,.pd-body h3{margin:8px 0 12px}

/* Teknik özellikler → senin .detail-meta .row desenini kullanır, ekstra CSS yok */

/* ---- WhatsApp butonu (yeşil) ---- */
.btn-wa{background:#25d366;color:#fff}
.btn-wa:hover{background:#1eb457;transform:translateY(-2px)}

/* ---- Mobil ---- */
@media(max-width:1000px){.product-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.product-grid{grid-template-columns:1fr}}

/* =========================================================
   MENÜ: "Ürünler" altında açılır kategori listesi
   ========================================================= */
.menu .has-sub{position:relative;display:flex;align-items:center}
.menu .has-sub > a::after{content:"▾";font-size:.7em;margin-left:6px;opacity:.75;transition:transform .2s}
.menu .has-sub:hover > a::after{transform:rotate(180deg)}
.menu .submenu{
  position:absolute;top:100%;left:0;min-width:230px;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-md);padding:8px;
  display:flex;flex-direction:column;gap:2px;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
  z-index:200;
}
.menu .has-sub:hover .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.menu .submenu a{
  padding:10px 13px;border-radius:3px;
  font-family:var(--font-body);font-weight:500;font-size:.95rem;
  text-transform:none;letter-spacing:0;color:var(--steel-800);white-space:nowrap;
}
.menu .submenu a:hover{background:var(--steel-100);color:var(--accent-600)}

/* Mobil: alt menü daima açık, girintili liste olarak */
@media(max-width:760px){
  .menu .has-sub{flex-direction:column;align-items:stretch}
  .menu .submenu{
    position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:0;border-radius:0;padding:0 0 0 16px;min-width:0;
  }
  .menu .submenu a{border-bottom:1px solid var(--line)}
  .menu .has-sub > a::after{display:none}
}

/* =========================================================
   KATEGORİ BANNER (kapak görseli varsa)
   ========================================================= */
.cat-banner{
  position:relative;border-radius:var(--radius);overflow:hidden;
  min-height:240px;display:flex;align-items:flex-end;
  background-size:cover;background-position:center;background-color:var(--steel-800);
  margin-bottom:30px;
}
.cat-banner::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(4,33,75,.88) 0%,rgba(4,33,75,.35) 55%,rgba(4,33,75,.10) 100%)}
.cat-banner .cat-banner-in{position:relative;z-index:2;padding:26px 30px}
.cat-banner h2{color:#fff;margin:12px 0 6px}
.cat-banner .cat-desc{color:rgba(255,255,255,.92);margin:0;max-width:62ch}
@media(max-width:760px){.cat-banner{min-height:190px}.cat-banner .cat-banner-in{padding:20px 22px}}


/* ===== Ana sayfa ürün şeridi ===== */
.home-products{
  background:linear-gradient(180deg, #fbfcfe 0%, #eff4fa 100%);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.home-products .hp-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:24px; margin-bottom:30px;
}
.home-products .hp-head-text{ flex:1 1 auto; }
.home-products .hp-lead{ color:var(--muted); margin:14px 0 0; max-width:60ch; }

.hp-nav{ display:flex; gap:8px; flex:0 0 auto; }
.hp-arrow{
  width:44px; height:44px; border:1px solid var(--line); background:#fff;
  color:var(--steel-900); border-radius:var(--radius); font-size:22px; line-height:1;
  cursor:pointer; transition:background .2s, color .2s, border-color .2s;
}
.hp-arrow:hover:not([disabled]){ background:var(--steel-900); color:#fff; border-color:var(--steel-900); }
.hp-arrow[disabled]{ opacity:.3; cursor:default; }

.hp-scroller{
  overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth;
  scroll-snap-type:x mandatory; padding-bottom:8px;
  scrollbar-width:none; -ms-overflow-style:none;
}
.hp-scroller::-webkit-scrollbar{ display:none; }
.hp-scroller:focus-visible{ outline:2px solid var(--accent-600); outline-offset:4px; }
.hp-track{ display:flex; gap:20px; }

.hp-card{
  position:relative; flex:0 0 300px; scroll-snap-align:start;
  display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  text-decoration:none; color:inherit;
  transition:transform .25s, box-shadow .25s;
}
/* imza motifi: sandviç panel kesiti, hover'da soldan açılır */
.hp-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:6px; z-index:2;
  transform:scaleX(0); transform-origin:left; transition:transform .3s;
  background:linear-gradient(to bottom,
    var(--steel-900) 0 32%, var(--accent-600) 32% 68%, var(--steel-900) 68% 100%);
}
.hp-card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(4,33,75,.13); }
.hp-card:hover::before{ transform:scaleX(1); }

.hp-thumb{ height:200px; background-position:center; }
.hp-body{ padding:16px 18px 20px; }
.hp-cat{
  font-size:.72rem; letter-spacing:1px; text-transform:uppercase;
  color:var(--accent-600); font-weight:600;
}
.hp-card h3{
  font-family:var(--font-display); font-size:1.3rem; color:var(--steel-900);
  margin:6px 0 8px; line-height:1.2;
}
.hp-card p{ font-size:.9rem; color:var(--muted); line-height:1.55; margin:0; }
.hp-more{ display:inline-block; margin-top:12px; font-size:.85rem; font-weight:600; color:var(--steel-900); }

.hp-card--all{
  flex:0 0 200px; align-items:center; justify-content:center; text-align:center;
  background:var(--steel-900); color:#fff; border-color:var(--steel-900);
  font-family:var(--font-display); font-size:1.35rem; letter-spacing:.5px; line-height:1.25;
}
.hp-card--all:hover{ background:var(--steel-800); }

@media (max-width:768px){
  .home-products .hp-head{ display:block; }
  .hp-nav{ display:none; }          /* mobilde parmakla kaydırılır */
  .hp-card{ flex-basis:78vw; }
  .hp-thumb{ height:170px; }
}
@media (prefers-reduced-motion:reduce){
  .hp-scroller{ scroll-behavior:auto; }
  .hp-card, .hp-card::before{ transition:none; }
}