/* ── ÜRÜNLER ────────────────────────── */
.fm-urunler-section { padding: 100px 0; background: var(--fm-gri); }

/* GRID */
.fm-urun-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 28px;
}

/* KART */
.fm-urun-kart {
    background: #fff; border-radius: var(--fm-radius);
    overflow: hidden; box-shadow: var(--fm-golge);
    transition: var(--fm-gecis); display: block;
    border: 1px solid rgba(0,0,0,.06);
}
.fm-urun-kart:hover {
    transform: translateY(-6px);
    box-shadow: var(--fm-golge-b);
    border-color: rgba(61,170,42,.2);
}

/* Görsel */
.fm-urun-gorsel {
    position: relative; overflow: hidden;
    aspect-ratio: 4 / 3; background: linear-gradient(135deg, #2D2D2D, #1C1C1C);
}
.fm-urun-gorsel img {
    width: 100%; height: 100%;
    object-fit: contain; object-position: center;
    display: block;
    background: #fff;
    transition: transform .45s ease;
}
.fm-urun-kart:hover .fm-urun-gorsel img { transform: scale(1.07); }
.fm-urun-gorsel-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    font-size: 3.5rem; color: rgba(61,170,42,.4);
}

/* Overlay */
.fm-urun-overlay {
    position: absolute; inset: 0;
    background: rgba(28,28,28,.7);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .3s ease;
}
.fm-urun-kart:hover .fm-urun-overlay { opacity: 1; }
.fm-urun-overlay span {
    color: #fff; font-weight: 700; font-size: .9rem; letter-spacing: .06em;
    border: 2px solid rgba(255,255,255,.6); padding: 10px 22px; border-radius: 40px;
    display: flex; align-items: center; gap: 8px;
    transform: translateY(10px); transition: transform .3s ease;
}
.fm-urun-kart:hover .fm-urun-overlay span { transform: translateY(0); }

/* Bilgi Alanı */
.fm-urun-bilgi { padding: 22px 24px; }
.fm-urun-kat {
    display: inline-block; font-size: .72rem; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase;
    color: var(--fm-yesil); background: rgba(61,170,42,.08);
    padding: 3px 10px; border-radius: 20px; margin-bottom: 10px;
}
.fm-urun-bilgi h3 {
    font-family: 'Oswald', sans-serif; font-size: 1.2rem; font-weight: 700;
    color: var(--fm-koyu); margin-bottom: 8px;
}
.fm-urun-bilgi p { font-size: .88rem; color: var(--fm-yazi-ac); line-height: 1.6; margin-bottom: 16px; }
.fm-urun-link {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: .85rem; font-weight: 700; color: var(--fm-yesil);
}
.fm-urun-kart:hover .fm-urun-link { gap: 10px; }

/* ── ÜRÜN TEKİL SAYFA ────────────────── */
.fm-urun-detay {
    padding: 48px 0 100px;
    background: var(--fm-gri);
    position: relative;
}
/* Dekoratif üst şerit */
.fm-urun-detay::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--fm-yesil), var(--fm-yesil2), #1a5e10);
}
.fm-urun-detay-grid {
    display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: start;
    margin-top: 24px;
}
/* Sol kolon sticky */
.fm-urun-detay-gorsel-bolum {
    position: sticky; top: 24px;
}
/* Sağ panel — hafif kart */
.fm-urun-detay-bilgi {
    background: #fff;
    border-radius: var(--fm-radius);
    padding: 36px 32px 32px;
    box-shadow: var(--fm-golge);
    border-top: 3px solid var(--fm-yesil);
}
.fm-urun-detay-bilgi .fm-urun-kat {
    margin-bottom: 14px;
    font-size: .75rem;
}
.fm-urun-detay-bilgi h1 {
    font-family: 'Oswald', sans-serif;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 700;
    color: var(--fm-koyu);
    line-height: 1.15;
    margin-bottom: 6px;
}
/* Dekoratif ayraç altı */
.fm-urun-detay-bilgi h1::after {
    content: '';
    display: block;
    width: 48px; height: 3px;
    background: var(--fm-yesil);
    border-radius: 2px;
    margin-top: 12px;
}
.fm-urun-detay-acik {
    font-size: .95rem;
    color: var(--fm-yazi-ac);
    line-height: 1.8;
    margin: 20px 0 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(0,0,0,.07);
}
.fm-urun-detay-acik p { margin-bottom: 12px; }
.fm-urun-detay-acik strong { color: var(--fm-koyu); font-weight: 700; }
.fm-urun-detay-acik em { color: var(--fm-yesil2); font-style: italic; }
/* Özellik kutuları */
.fm-urun-ozellikler {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
    margin-bottom: 28px;
}
.fm-urun-ozellik-item {
    display: flex; align-items: center; gap: 8px;
    background: rgba(61,170,42,.06);
    border: 1px solid rgba(61,170,42,.15);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: .82rem; font-weight: 600; color: var(--fm-koyu);
}
.fm-urun-ozellik-item i { color: var(--fm-yesil); font-size: .85rem; flex-shrink: 0; }
/* CTA butonları */
.fm-urun-detay-cta {
    display: flex; gap: 12px; flex-wrap: wrap;
}
.fm-btn-whatsapp {
    display: inline-flex; align-items: center; gap: 8px;
    background: linear-gradient(135deg, #25D366, #1da851);
    color: #fff !important; padding: 14px 24px; border-radius: 50px;
    font-weight: 700; font-size: .9rem;
    box-shadow: 0 4px 20px rgba(37,211,102,.35);
    transition: var(--fm-gecis);
}
.fm-btn-whatsapp:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(37,211,102,.45);
}
/* Geri butonu */
.fm-geri-btn {
    display: inline-flex; align-items: center; gap: 8px;
    color: var(--fm-yazi-ac); font-size: .88rem; font-weight: 600;
    margin-top: 32px; transition: var(--fm-gecis);
}
.fm-geri-btn:hover { color: var(--fm-yesil); gap: 12px; }
/* Eski selektörler uyum için */
.fm-urun-detay-gorsel { background: #fff; border-radius: var(--fm-radius); overflow: hidden; box-shadow: var(--fm-golge); }
.fm-urun-detay-gorsel img { width: 100%; height: auto; display: block; }
.fm-urun-detay-gorsel-placeholder {
    aspect-ratio: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 12px;
    background: linear-gradient(135deg, #2D2D2D, #1C1C1C);
    font-size: 4rem; color: rgba(61,170,42,.5);
}
.fm-urun-butonlar { display: flex; gap: 14px; flex-wrap: wrap; }

/* ── FİLTRE ──────────────────────────── */
.fm-urun-filtre {
    display: flex; gap: 8px; flex-wrap: wrap; justify-content: center;
    margin-bottom: 44px;
}
.fm-filtre-btn {
    padding: 9px 22px; border-radius: 40px;
    border: 2px solid rgba(28,28,28,.12); background: transparent;
    font-size: .82rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    color: var(--fm-yazi-ac); cursor: pointer; font-family: inherit;
    transition: var(--fm-gecis);
}
.fm-filtre-btn.aktif, .fm-filtre-btn:hover {
    background: var(--fm-yesil); border-color: var(--fm-yesil); color: #fff;
}

/* ── TAM ÜRÜNLER SAYFA ──────────────── */
.fm-urunler-tam { padding: 70px 0 100px; background: var(--fm-gri); }

/* Responsive */
@media (max-width: 768px) {
    .fm-urun-detay-grid { grid-template-columns: 1fr; gap: 32px; }
    .fm-urun-detay-gorsel-bolum { position: static; }
    .fm-urun-detay-bilgi { padding: 24px 20px; }
    .fm-urun-ozellikler { grid-template-columns: 1fr 1fr; }
    .fm-urun-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .fm-urun-grid { gap: 18px; }
}

/* ── ÜRÜN GALERİSİ & VİDEO (birleşik viewer) ────────────── */

/* Büyük görüntüleyici kutusu */
.fm-viewer-wrap {
    background: #fff;
    border-radius: var(--fm-radius);
    overflow: hidden;
    box-shadow: var(--fm-golge);
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fm-viewer-gorsel,
.fm-viewer-video { width: 100%; height: 100%; }
.fm-viewer-gorsel { display: flex; align-items: center; justify-content: center; }
.fm-viewer-gorsel img {
    width: 100%; height: 100%; object-fit: contain; display: block;
    transition: opacity .25s ease;
}
.fm-video-player {
    width: 100%; height: 100%; display: block;
    background: #000; border-radius: 0;
}

/* Thumbnail şeridi */
.fm-galeri-serit {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.fm-serit-thumb {
    position: relative;
    width: 72px; height: 72px;
    border: 2px solid transparent;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background: #eee;
    padding: 0;
    transition: border-color .2s ease, transform .2s ease;
    flex-shrink: 0;
}
.fm-serit-thumb img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.fm-serit-thumb:hover {
    border-color: rgba(61,170,42,.5);
    transform: scale(1.06);
}
.fm-serit-thumb.aktif {
    border-color: var(--fm-yesil);
    box-shadow: 0 0 0 2px rgba(61,170,42,.2);
}

/* Video thumb */
.fm-video-thumb-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #2D2D2D, #1C1C1C);
    font-size: 1.6rem; color: rgba(61,170,42,.7);
}
.fm-play-badge {
    position: absolute;
    inset: 0;
    display: flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.38);
    font-size: .85rem;
    color: #fff;
    pointer-events: none;
}
.fm-serit-thumb.aktif .fm-play-badge { background: rgba(61,170,42,.45); }

@media (max-width: 768px) {
    .fm-viewer-wrap { aspect-ratio: 3 / 2; }
    .fm-serit-thumb { width: 60px; height: 60px; }
}

/* ── KATEGORİ KARTLARI (Ana Sayfa) ────── */
.fm-kat-section { padding: 50px 0; background: var(--fm-beyaz); }
.fm-kat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 64px;
}
.fm-kat-kart {
    display: block;
    border-radius: var(--fm-radius);
    overflow: hidden;
    box-shadow: var(--fm-golge);
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    transition: var(--fm-gecis);
    position: relative;
}
.fm-kat-kart:hover {
    transform: translateY(-6px);
    box-shadow: var(--fm-golge-b);
    border-color: rgba(61,170,42,.25);
}
/* Görsel alanı */
.fm-kat-gorsel {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: linear-gradient(135deg, #1C1C1C, #2D2D2D);
}
.fm-kat-gorsel img {
    width: 100%; height: 100%;
    object-fit: contain;
    display: block;
    transition: transform .45s ease;
}
.fm-kat-kart:hover .fm-kat-gorsel img { transform: scale(1.06); }
.fm-kat-gorsel-ikon {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    font-size: 3.5rem;
    color: rgba(61,170,42,.45);
}
.fm-kat-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(28,28,28,.55) 0%, transparent 55%);
    pointer-events: none;
}
/* Bilgi alanı */
.fm-kat-bilgi {
    padding: 18px 20px 20px;
    display: flex; align-items: center; gap: 10px;
}
.fm-kat-ikon {
    font-size: 1.1rem;
    color: var(--fm-yesil);
    flex-shrink: 0;
}
.fm-kat-bilgi h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 1.05rem; font-weight: 700;
    color: var(--fm-koyu);
    flex: 1;
    line-height: 1.2;
}
.fm-kat-sayi {
    font-size: .75rem; font-weight: 700;
    color: var(--fm-yesil);
    background: rgba(61,170,42,.08);
    border: 1px solid rgba(61,170,42,.18);
    border-radius: 20px;
    padding: 3px 10px;
    white-space: nowrap;
}
.fm-kat-arrow {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: rgba(61,170,42,.1);
    display: flex; align-items: center; justify-content: center;
    color: var(--fm-yesil); font-size: .75rem;
    transition: var(--fm-gecis);
    flex-shrink: 0;
}
.fm-kat-kart:hover .fm-kat-arrow {
    background: var(--fm-yesil);
    color: #fff;
    transform: translateX(3px);
}
/* Alt başlık ayracı */
.fm-urunler-alt-baslik {
    display: flex; align-items: center; gap: 16px;
    margin-bottom: 32px;
}
.fm-urunler-alt-baslik h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 1.1rem; font-weight: 700;
    color: var(--fm-koyu);
    white-space: nowrap;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.fm-cizgi {
    flex: 1; height: 1px;
    background: linear-gradient(to right, rgba(0,0,0,.12), transparent);
}
/* ── Breadcrumb (taxonomy sayfaları) ───────────────── */
.fm-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .85rem;
    color: rgba(255,255,255,.7);
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.fm-breadcrumb a {
    color: rgba(255,255,255,.85);
    text-decoration: none;
    transition: color .2s;
}
.fm-breadcrumb a:hover { color: var(--fm-yesil, #3daa2a); }
.fm-breadcrumb span[aria-current] { color: #fff; font-weight: 600; }

/* ── Boş durum ─────────────────────────────────────── */
.fm-bos-durum {
    text-align: center;
    padding: 80px 24px;
    color: var(--fm-gri, #666);
}
.fm-bos-durum i {
    font-size: 3rem;
    color: var(--fm-yesil, #3daa2a);
    margin-bottom: 16px;
    display: block;
}
.fm-bos-durum h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 1.4rem;
    color: var(--fm-koyu, #1a1a1a);
    margin-bottom: 8px;
}

/* Responsive */
@media (max-width: 900px) {
    .fm-kat-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .fm-kat-grid { grid-template-columns: 1fr; gap: 16px; }
}
