/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Montserrat:wght@300;400;500;600&display=swap');

:root {
    --primary-color: #8D6E63; /* Bronz/Kahve tonu */
    --secondary-color: #3E2723; /* Koyu Ah�ap tonu */
    --light-bg: #FDFBF7; /* K�r�k beyaz/Krem */
    --dark-text: #2C2C2C;
}

body {
    font-family: 'Montserrat', sans-serif;
    color: var(--dark-text);
    background-color: var(--light-bg);
    overflow-x: hidden;
    padding-top: 0; /* Navbar fixed oldu�u i�in */
}

h1, h2, h3, h4, h5, .navbar-brand, .cat-title {
    font-family: 'Playfair Display', serif;
}

/* --- YEN� �ST B�LG� �UBU�U (TOP BAR) --- */
.top-bar {
    background-color: var(--secondary-color);
    color: #fff;
    font-size: 0.75rem;
    padding: 8px 0;
    letter-spacing: 1px;
    z-index: 1040; /* Navbar'�n �zerinde kalmas� i�in */
    transition: all 0.3s ease;
    /* DEĞİŞTİ: Sabit kalmasın */
    position: static !important;
}

    .top-bar a {
        color: #fff;
        text-decoration: none;
        transition: 0.3s;
    }

        .top-bar a:hover {
            color: var(--primary-color);
        }

/* --- NAVBAR MODERN�ZASYONU --- */
#mainNav {
    transition: all 0.4s ease;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    top: 35px; /* Top bar y�ksekli�i kadar a�a��da ba�las�n */
    /* DEĞİŞTİ: Sabit kalmasın (Bootstrap fixed-top override) */
    position: static !important;
    top: auto !important;
}

    /* Sayfa a�a�� kay�nca men� de�i�imi */
    #mainNav.navbar-scrolled {
        background-color: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(10px);
        box-shadow: 0 4px 20px rgba(0,0,0,0.05);
        padding: 10px 0;
        top: 0; /* Kay�nca en �ste yap��s�n */
        /* DEĞİŞTİ: Yapışma yok */
        position: static !important;
        top: auto !important;
    }

        /* Kayd�rma yap�ld���nda TopBar'� gizlemek istersen JS ile top-bar'a 'hide-top' class� ekleyebiliriz.
   �imdilik sabit kals�n istiyorsan bu css yeterli. */

        #mainNav.navbar-scrolled .nav-link,
        #mainNav.navbar-scrolled .logo-text,
        #mainNav.navbar-scrolled .logo-text span,
        #mainNav.navbar-scrolled .logo-text i {
            color: var(--dark-text) !important;
        }

/* Logo Stil */
.logo-text {
    text-align: center;
    color: var(--secondary-color);
    transition: 0.3s;
    line-height: 1.2;
}

    .logo-text i {
        font-size: 1.8rem;
        color: var(--primary-color);
        margin-bottom: 5px;
    }

    .logo-text span {
        font-size: 1.5rem;
        font-weight: 700;
        letter-spacing: 3px;
        text-transform: uppercase;
        display: block;
    }

/* Men� Linkleri */
.navbar-nav .nav-link {
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1.5px;
    position: relative;
    padding: 10px 15px !important;
    color: var(--dark-text); /* Varsay�lan renk */
}

/* Linklerin alt�na ��k �izgi efekti (Sadece Desktop) */
@media (min-width: 992px) {
    .navbar-nav .nav-link::after {
        content: '';
        position: absolute;
        width: 0;
        height: 2px;
        bottom: 5px;
        left: 50%;
        background-color: var(--primary-color);
        transition: all 0.3s ease;
        transform: translateX(-50%);
    }

    .navbar-nav .nav-link:hover::after {
        width: 80%;
    }
}

/* --- MOB�L MEN� D�ZENLEMELER� --- */
.navbar-toggler {
    border: none;
    padding: 0;
    color: var(--primary-color);
}

    .navbar-toggler:focus {
        box-shadow: none;
    }

/* Mobil Men� A��ld���nda */
@media (max-width: 991px) {
    /* Top Bar Mobilde G�r�n�m */
    .top-bar {
        display: block !important; /* Art�k mobilde g�r�necek */
        text-align: center;
    }

    .top-contact {
        display: none; /* Mobilde telefon/mail kalabal�k yapmas�n diye gizledik */
    }

    .top-social {
        justify-content: center !important; /* Bayraklar� ortala */
        width: 100%;
    }

    /* Navbar Mobilde */
    #mainNav {
        background-color: #fff; /* Mobilde arka plan beyaz olsun */
        top: 0; /* Mobilde top bar ile �ak��may� �nlemek i�in */
        margin-top: 40px; /* Topbar y�ksekli�i kadar bo�luk */
        /* DEĞİŞTİ: Sabit değil */
        position: relative !important;
        top: auto !important;
        z-index: 2000;
    }

    .navbar-brand {
        margin-left: 10px;
    }

    .navbar-collapse {
        background: #fff;
        padding: 20px;
        margin-top: 15px;
        border-top: 2px solid var(--primary-color); /* �st�ne ��k bir �izgi */
        box-shadow: 0 15px 30px rgba(0,0,0,0.1);
        max-height: 80vh; /* �ok uzun men�lerde scroll olsun */
        overflow-y: auto;
    }

    /* Mobil Men� Linkleri */
    .navbar-nav .nav-item {
        text-align: center;
        border-bottom: 1px solid rgba(0,0,0,0.05); /* Linkler aras� �izgi */
        margin-bottom: 5px;
    }

    .navbar-nav .nav-link {
        padding: 15px 0 !important;
        font-size: 0.9rem;
        color: var(--secondary-color) !important;
    }

    .navbar-nav .btn {
        width: 100%;
        margin-top: 10px;
    }

    /* Mobilde logo text ayar� */
    .logo-text span {
        font-size: 1.2rem;
    }

    .logo-text i {
        font-size: 1.4rem;
    }
}

/* --- D��ER CSSLER (Korunanlar) --- */
.floating-contact {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 1000;
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
}

.float-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--secondary-color);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-decoration: none;
}

    .float-btn.main-toggle {
        background-color: var(--primary-color);
        font-size: 1.5rem;
    }

    .float-btn:hover {
        transform: scale(1.1);
        color: #fff;
    }

.sub-icon {
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: all 0.3s ease;
}

.floating-contact:hover .sub-icon {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

footer {
    background-color: #1a1a1a !important;
    border-top: 5px solid var(--primary-color);
    color: #fff;
    padding: 40px 0;
}

    footer h5 {
        color: var(--primary-color);
        letter-spacing: 2px;
        font-size: 1.1rem;
        margin-bottom: 20px;
    }

    footer ul {
        list-style: none;
        padding-left: 0;
    }

        footer ul li {
            margin-bottom: 10px;
        }

            footer ul li a {
                color: #ccc;
                text-decoration: none;
                transition: 0.3s;
                font-weight: 300;
            }

                footer ul li a:hover {
                    color: var(--primary-color) !important;
                    padding-left: 5px;
                }

/* --- TOP BAR AYARLARI --- */
.top-bar {
    height: 40px; /* Sabit y�kseklik verdik ki hesaplama kolay olsun */
    z-index: 1050; /* En �stte bu olacak */
    display: flex;
    align-items: center;
    /* DEĞİŞTİ: sabit değil */
    position: static !important;
}

/* --- NAVBAR AYARLARI --- */
#mainNav {
    z-index: 1040; /* Topbar'�n bir alt�nda */
    top: 40px; /* Topbar y�kseklikli�i kadar a�a��dan ba�la */
    transition: all 0.3s ease;
    /* DEĞİŞTİ: sabit değil */
    position: static !important;
    top: auto !important;
}

    /* Sayfa a�a�� kay�nca navbar yukar� yap��s�n (Opsiyonel: �stersen top:0 yapabilirsin) */
    #mainNav.navbar-scrolled {
        top: 0;
        /* DEĞİŞTİ: yapışma yok */
        position: static !important;
        top: auto !important;
    }

/* --- MOB�L ���N �ZEL D�ZENLEMELER (Max-Width 991px) --- */
@media (max-width: 991px) {
    /* Navbar'� Topbar'�n hemen alt�na sabitle */
    #mainNav {
        top: 40px !important;
        background-color: #fff;
        padding: 10px 15px;
        margin-top: 0; /* Eski marginleri s�f�rla */
        /* DEĞİŞTİ: sabit değil */
        position: static !important;
        top: auto !important;
    }

    /* Men� a��ld���nda ekran� kaplamas�n, d�zg�n scroll olsun */
    .navbar-collapse {
        background: #fff;
        position: static !important;
        top: 100%; /* Navbar'�n bitti�i yerden ba�la */
        left: 0;
        right: 0;
        padding: 20px;
        border-top: 1px solid rgba(0,0,0,0.1);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
        max-height: 80vh; /* Ekran�n %80'i kadar a��l, ta�arsa kayd�r */
        overflow-y: auto;
        margin-top: 12px;
    }

    /* Topbar Mobilde D�zen */
    .top-bar .container {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Logo Yaz� Boyutu Mobilde */
    .logo-text span {
        font-size: 1.2rem;
        color: var(--secondary-color);
    }
}

/*Anasayfa*/
/* Slider Animasyonlar� */
.carousel-item .slide-title {
    animation: fadeInUp 1s ease-out;
}

.carousel-item .slide-desc {
    animation: fadeInUp 1.2s ease-out;
}

/* KATEGOR� KART TASARIMI */
.category-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: none; /* Kenarl�k varsa kald�r�yoruz, daha temiz g�r�n�r */
    background: #fff;
    padding-bottom: 15px; /* Alt bo�luk */
}

    /* Kart�n �zerine gelince hafif yukar� ��ks�n */
    .category-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    }

/* RES�M �ER�EVES� (SAB�T Y�KSEKL�K) */
.card-img-wrap {
    width: 100%;
    height: 400px; /* T�M RES�MLER BURADA E��TLEN�R! �stersen 350px yapabilirsin */
    overflow: hidden; /* Ta�an� gizle */
    position: relative;
}

    /* RES�M AYARLARI */
    .card-img-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* S�H�RL� KOD: Resmi kutuya s�nd�rmeden doldurur */
        object-position: center; /* Resmi ortalar */
        transition: transform 0.6s ease;
    }

/* Hoverda resim hafif yak�nla�s�n */
.category-card:hover .card-img-wrap img {
    transform: scale(1.1);
}

/* YAZI T�POGRAF�S� */
.cat-title {
    font-family: 'Playfair Display', serif;
    letter-spacing: 1px;
    font-size: 1.5rem;
}

.category-card .text-primary {
    color: #8D6E63 !important; /* Senin tema rengin (Bronz/Kahve) */
    transition: 0.3s;
}

.category-card:hover .text-primary {
    letter-spacing: 1px; /* Hoverda yaz� a��ls�n */
    color: #3E2723 !important; /* Daha koyu kahve */
}

/* --- REFERANS LOGO SLIDER (YEN�) --- */
.logo-slider {
    background: transparent; /* Arka plan �effaf */
    height: 100px; /* Slider y�ksekli�i */
    margin: auto;
    overflow: hidden; /* Ta�an� gizle */
    position: relative;
    width: 100%;
}

/* --- EREZ REFERANS KAYDIRMA (�AKI�MA �NLEY�C� �S�MLEND�RME) --- */
.erez-ref-wrapper {
    width: 100%;
    overflow: hidden; /* Ta�anlar� gizle */
    position: relative;
    padding: 20px 0;
    background: transparent;
}

.erez-ref-track {
    display: flex;
    gap: 40px; /* Logolar aras� bo�luk */
    width: max-content; /* ��erik kadar uza */
    /* Kayd�rma animasyonu */
    animation: erezRefScroll 30s linear infinite;
}

/* Her bir referans kutusu */
.erez-ref-item {
    flex-shrink: 0; /* Asla s�k��ma */
    width: 100px; /* Her bir logonun geni�li�i */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Yuvarlak Logo Alan� */
.erez-ref-circle {
    width: 80px;
    height: 80px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08); /* Hafif g�lge */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
    padding: 10px;
}

    /* Resim ayarlar� */
    .erez-ref-circle img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
        filter: grayscale(100%); /* Siyah beyaz olsun */
        transition: 0.3s;
    }

    /* Hover Efektleri */
    .erez-ref-circle:hover {
        transform: scale(1.1); /* B�y�me */
        box-shadow: 0 6px 15px rgba(0,0,0,0.15);
    }

        .erez-ref-circle:hover img {
            filter: grayscale(0%); /* Renklen */
        }

/* Animasyon Tan�m� */
@keyframes erezRefScroll {
    0% {
        transform: translateX(0);
    }

    100% {
        /* 3 set oldu�u i�in %33.33 kay�nca ba�a d�ner */
        transform: translateX(-33.33%);
    }
}

/* Mouse ile �zerine gelince dursun */
.erez-ref-track:hover {
    animation-play-state: paused;
}

/* --- HAKKIMIZDA SAYFASI �ZEL (MODERN) --- */

/* 1. Hero Alan�: Sabit Arka Plan (Parallax Etkisi) */
.about-hero {
    position: relative;
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('https://images.unsplash.com/photo-1611486212557-88be5ff6f941?q=80&w=1920&auto=format&fit=crop'); /* At�lye/Ah�ap g�rseli */
    background-attachment: fixed; /* Resmi arkaya �iviler, sayfa kayarken resim sabit kal�r */
    background-position: center;
    background-size: cover;
    color: #fff;
}

/* Resmin �zerine siyah perde */
.about-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.about-content-wrapper {
    position: relative;
    z-index: 2;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.3); /* �nce �er�eve */
    padding: 40px 60px;
    backdrop-filter: blur(5px); /* Hafif buzlu cam */
}

/* 2. Hikaye Metni (Dergi Stili) */
.story-container {
    max-width: 800px;
    margin: 0 auto;
}

.story-text {
    font-size: 1.1rem;
    line-height: 1.9;
    color: #555;
    font-weight: 300;
}

    /* �lk harfi b�y�tme (Drop Cap) - ��kl�k katar */
    .story-text p:first-of-type::first-letter {
        font-family: 'Playfair Display', serif;
        font-size: 3.5rem;
        float: left;
        margin-right: 10px;
        line-height: 0.8;
        color: var(--primary-color); /* Senin bronz rengin */
        font-weight: bold;
    }

/* 3. �statistikler (Modern Saya�) */
.stats-section {
    background-color: #212529;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23333333' fill-opacity='0.4'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.stat-item h3 {
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--primary-color); /* Alt�n/Bronz Rakamlar */
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 0;
}

.stat-item span {
    font-size: 0.9rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #aaa;
    border-top: 1px solid #444;
    padding-top: 10px;
    display: inline-block;
    margin-top: 10px;
}

/* 4. �zellikler (Zig-Zag Tasar�m) */
.feature-row {
    margin-bottom: 80px;
}

.feature-img-box {
    position: relative;
    overflow: hidden;
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}

    .feature-img-box img {
        transition: transform 0.7s ease;
    }

.feature-row:hover .feature-img-box img {
    transform: scale(1.1); /* Yava��a zoom yapar */
}

/* --- �LET���M SAYFASI �ZEL --- */

/* Harita Alan� */
.map-container {
    background: #eee;
    margin-top: -20px; /* Navbar bo�lu�unu dengelemek i�in gerekirse ayarla */
}

    /* Harita iframe mobilde de d�zg�n g�r�ns�n */
    .map-container iframe {
        width: 100%;
        min-height: 300px;
    }

/* Form Elemanlar� */
.form-control:focus {
    box-shadow: none; /* Mavi �er�eveyi kald�r */
    border-color: #000; /* Odaklan�nca siyah �er�eve olsun */
    background-color: #fff !important;
}

/* Form kutular�n�n arka plan� g�rseldeki gibi hafif gri olsun */
.bg-light {
    background-color: #f9f9f9 !important;
}

/* G�nder Butonu */
.btn-dark {
    letter-spacing: 1px;
    transition: all 0.3s;
}

    .btn-dark:hover {
        background-color: #333;
        transform: translateY(-2px); /* Hafif yukar� kalkma efekti */
    }

/* �kon Kutular� */
.icon-box {
    width: 40px;
    text-align: center;
}

/* --- �LET���M SAYFASI (LUXURY STYLE) --- */

/* 1. Harita Stili (Mimari G�r�n�m) */
.map-frame {
    width: 100%;
    height: 500px;
    filter: grayscale(100%); /* Haritay� siyah beyaz yapar */
    transition: filter 0.5s ease;
    border-bottom: 5px solid var(--primary-color); /* Alt�na marka rengi �izgi */
}

    /* Mouse gelince hafif renk gelsin */
    .map-frame:hover {
        filter: grayscale(0%);
    }

/* 2. Form Tasar�m� (Alt� �izgili Input) */
.luxury-input {
    border: none;
    border-bottom: 1px solid #ddd; /* Sadece alt �izgi */
    background: transparent;
    border-radius: 0;
    padding: 15px 0;
    font-size: 1rem;
    color: #333;
    transition: all 0.3s ease;
}

    .luxury-input:focus {
        box-shadow: none;
        background: transparent;
        border-bottom: 1px solid var(--secondary-color); /* Odaklan�nca �izgi koyula�s�n */
    }

    .luxury-input::placeholder {
        color: #aaa;
        font-size: 0.9rem;
        font-style: italic;
    }

/* 3. �leti�im Bilgi Kart� */
.contact-info-card {
    background-color: #FDFBF7; /* �ok a��k krem/bej */
    padding: 40px;
    height: 100%;
    border: 1px solid #f0f0f0;
}

.icon-circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color); /* Bronz renk ikon */
    transition: 0.3s;
}

.contact-row:hover .icon-circle {
    background-color: var(--primary-color);
    color: #fff;
    transform: rotate(360deg); /* Hoverda ikon d�ns�n */
}

/* Ba�l�k Tipi */
.contact-header {
    font-family: 'Playfair Display', serif;
    letter-spacing: 2px;
}

/* --- REFERANSLAR SAYFASI �ZEL --- */

/* Ba�l�k */
.display-4 {
    font-weight: 300;
}

/* Yuvarlak Logo Kutusu */
.ref-circle {
    width: 150px;
    height: 150px;
    background: #fff;
    border-radius: 50%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    border: 1px solid #f0f0f0;
    transition: all 0.3s ease;
    cursor: pointer;
    overflow: hidden;
}

    .ref-circle:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        border-color: #ddd;
    }

    .ref-circle img {
        max-width: 70%;
        max-height: 70%;
        object-fit: contain;
        filter: grayscale(100%);
        transition: 0.3s;
        opacity: 0.8;
    }

    .ref-circle:hover img {
        filter: grayscale(0%);
        opacity: 1;
    }

@media (max-width: 768px) {
    .ref-circle {
        width: 120px;
        height: 120px;
    }
}

/* --- �R�NLER SAYFASI �ZEL --- */

/* Kategori Filtre Men�s� */
.cat-filter {
    text-decoration: none;
    color: #666;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 10px 15px;
    transition: all 0.3s;
    min-width: 80px;
}

    .cat-filter:hover,
    .cat-filter.active {
        color: #000;
    }

    .cat-filter i {
        font-size: 1.2rem;
        margin-bottom: 5px;
    }

/* Mobilde men�n�n yana kaymas� i�in ayar */
.sub-menu-scroll {
    overflow-x: auto;
    padding-bottom: 10px;
}

    .sub-menu-scroll::-webkit-scrollbar {
        height: 3px;
    }

    .sub-menu-scroll::-webkit-scrollbar-thumb {
        background: #ccc;
    }

/* --- �R�NLER SAYFASI (PREMIUM KATALOG) --- */

/* 1. Kategori Filtre Men�s� (Sticky Bar) */
.filter-bar {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #eee;
    padding: 15px 0;
}

.cat-filter-btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    margin-right: 10px;
    border: 1px solid #eee;
    border-radius: 50px;
    color: #666;
    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    background: #fff;
    min-width: 100px;
}

    .cat-filter-btn i {
        font-size: 1.2rem;
        margin-bottom: 5px;
        color: #ccc;
        transition: 0.3s;
    }

    .cat-filter-btn:hover,
    .cat-filter-btn.active {
        background-color: var(--secondary-color);
        border-color: var(--secondary-color);
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(62, 39, 35, 0.2);
    }

        .cat-filter-btn:hover i,
        .cat-filter-btn.active i {
            color: #fff;
        }

/* 2. �r�n Kart� Tasar�m� */
.product-card {
    transition: all 0.3s ease;
    cursor: pointer;
    background: #fff;
    height: 100%;
}

    .product-card:hover .product-title {
        color: var(--primary-color);
    }

/* RES�M KUTUSU */
.product-img-box {
    position: relative;
    width: 100%;
    padding-top: 125%;
    background-color: #f9f9f9;
    overflow: hidden;
    margin-bottom: 15px;
}

    .product-img-box img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 20px;
        transition: transform 0.6s ease;
        mix-blend-mode: multiply;
    }

.product-card:hover .product-img-box img {
    transform: scale(1.1);
}

.product-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    color: #333;
    transition: 0.3s;
    letter-spacing: 0.5px;
}

.overlay-btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    background: rgba(255,255,255,0.9);
    text-align: center;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.product-card:hover .overlay-btn {
    transform: translateY(0);
}

/* K���k Resimler (Thumbnails) */
.thumbnail-img {
    cursor: pointer;
    opacity: 0.6;
    transition: all 0.3s;
    width: 100%;
    height: auto;
    object-fit: contain;
    border: 1px solid transparent;
}

    .thumbnail-img:hover,
    .thumbnail-img.active {
        opacity: 1;
        border-color: #333 !important;
    }

.product-detail-img {
    max-height: 500px;
    width: 100%;
    object-fit: contain;
    transition: transform 0.3s;
}

.product-card .img-wrapper img {
    height: 250px;
    object-fit: contain;
    mix-blend-mode: multiply;
}

.cursor-pointer {
    cursor: pointer;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "/";
    color: #ccc;
}

/* --- �R�N DETAY SAYFASI (SHOWROOM MOOD) --- */

/* 1. Galeri Alan� */
.detail-gallery-wrapper {
    position: relative;
    background-color: #fff;
    padding: 20px;
    border: 1px solid #f0f0f0;
}

/* Ana Resim Kutusu */
.main-img-box {
    width: 100%;
    height: 550px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fcfcfc;
    position: relative;
    cursor: zoom-in;
}

    .main-img-box img {
        max-height: 100%;
        max-width: 100%;
        object-fit: contain;
        transition: transform 0.5s ease;
    }

    .main-img-box:hover img {
        transform: scale(1.2);
    }

/* K���k Resimler */
.thumb-btn {
    width: 80px;
    height: 80px;
    border: 1px solid #eee;
    padding: 5px;
    cursor: pointer;
    background: #fff;
    opacity: 0.6;
    transition: 0.3s;
}

    .thumb-btn:hover,
    .thumb-btn.active {
        opacity: 1;
        border-color: var(--primary-color);
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    .thumb-btn img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

/* 2. �r�n Bilgi Alan� */
.product-info-title {
    font-family: 'Playfair Display', serif;
    letter-spacing: 1px;
    color: #222;
}

.product-price-tag {
    font-size: 1.5rem;
    color: var(--primary-color);
    font-weight: bold;
    font-family: 'Montserrat', sans-serif;
}

/* Sosyal Medya Butonlar� */
.share-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    transition: 0.3s;
    text-decoration: none;
}

    .share-btn:hover {
        background-color: var(--secondary-color);
        color: #fff;
        border-color: var(--secondary-color);
    }

/* 3. �zellikler Tablosu */
.specs-table tr {
    border-bottom: 1px solid #eee;
}

.specs-table td {
    padding: 15px 0;
    vertical-align: middle;
}

.specs-label {
    font-weight: 600;
    color: #333;
    width: 40%;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
}

.specs-value {
    color: #666;
    font-weight: 300;
}

/* --- �LG�L� �R�NLER (HORIZONTAL SCROLL / SLIDER) --- */
.horizontal-scroll-wrapper {
    display: flex;
    overflow-x: auto;
    gap: 20px;
    padding: 10px 5px 20px 5px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .horizontal-scroll-wrapper::-webkit-scrollbar {
        display: none;
    }

.related-item {
    flex: 0 0 auto;
    width: 280px;
    scroll-snap-align: start;
}

@media (max-width: 768px) {
    .related-item {
        width: 220px;
    }
}

.scroll-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s;
    color: #333;
}

    .scroll-nav-btn:hover {
        background-color: var(--primary-color);
        color: #fff;
        border-color: var(--primary-color);
    }

.scroll-left {
    left: -20px;
}

.scroll-right {
    right: -20px;
}

@media (max-width: 768px) {
    .scroll-nav-btn {
        display: none;
    }

    .scroll-left {
        left: 0;
    }

    .scroll-right {
        right: 0;
    }
}

.related-item .product-card {
    border: 1px solid #f9f9f9 !important;
}

/* FONTLAR */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Montserrat:wght@300;400;500;600&display=swap');

/* --- ANA WRAPPER --- */
.catalog-container-wrapper {
    width: 100%;
    min-height: calc(100vh - 80px);
    background: radial-gradient(circle, #f4f1ea 0%, #e0d8cc 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 20px;
    padding-bottom: 80px;
    position: relative;
    font-family: 'Montserrat', sans-serif;
}

/* --- K�TAP (FLIP BOOK) --- */
.flip-book {
    box-shadow: 0 20px 50px rgba(0,0,0,0.25);
    margin-top: 10px;
}

/* --- ALTAK� KONTROLLER --- */
.catalog-toolbar-bottom {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    width: auto;
}

.controls {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.9);
    padding: 10px 25px;
    border-radius: 50px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    border: 1px solid rgba(141, 110, 99, 0.2);
}

.c-btn {
    background: #3E2723;
    color: #fff;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

    .c-btn:hover {
        background: #8D6E63;
        transform: scale(1.1);
    }

    .c-btn.small {
        width: 30px;
        height: 30px;
        font-size: 0.8rem;
        background: #8D6E63;
    }

.divider {
    width: 1px;
    height: 20px;
    background: #ccc;
    margin: 0 5px;
}

#pageInfo {
    font-weight: 600;
    color: #3E2723;
    font-family: 'Playfair Display', serif;
    font-size: 1rem;
    min-width: 60px;
    text-align: center;
}

/* --- SAYFA YAPISI --- */
.page {
    background-color: #fff;
    background-image: url("https://www.transparenttextures.com/patterns/cream-paper.png");
    border-right: 1px solid rgba(0,0,0,0.08);
    overflow: hidden;
}

.page-content {
    height: 100%;
    width: 100%;
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.p-0 {
    padding: 0 !important;
}

/* Kapak */
.cover-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Hakk�m�zda D�zeltmeleri */
.simple-page {
    padding: 40px;
}

.about-header {
    text-align: center;
    margin-bottom: 20px;
}

.about-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 20px;
}

.about-header h2 {
    font-family: 'Playfair Display', serif;
    color: #8d6e63;
    margin: 0;
}

.about-body {
    font-size: 0.95rem;
    line-height: 1.8;
    color: #444;
    text-align: justify;
    overflow-y: auto;
    padding-right: 5px;
}

    .about-body p {
        margin-bottom: 10px;
    }

/* Kategori Sayfas� (%70 Resim / %30 Yaz�) */
.cat-intro-layout {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.cat-image-area {
    height: 70%;
    position: relative;
}

    .cat-image-area img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.cat-name-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(62, 39, 35, 0.9);
    color: #fff;
    padding: 15px 30px;
    font-family: 'Playfair Display';
    font-size: 1.5rem;
    text-transform: uppercase;
    border-top-right-radius: 15px;
}

.cat-desc-area {
    height: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    text-align: center;
    background: #fff;
}

.desc-inner h3 {
    color: #8d6e63;
    margin: 0 0 10px 0;
    font-family: 'Playfair Display';
}

.desc-inner p {
    color: #666;
    font-size: 0.9rem;
    margin: 0;
    font-style: italic;
}

/* �r�n Grid (3x3) */
.product-grid-9 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 15px;
    height: 100%;
    padding: 25px 25px 40px 25px;
    box-sizing: border-box;
}

.p-card {
    border: 1px solid rgba(0,0,0,0.05);
    border-radius: 6px;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: 0.3s;
}

    .p-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }

.p-img {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

    .p-img img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
        mix-blend-mode: multiply;
    }

.p-info {
    padding: 8px;
    text-align: center;
    border-top: 1px solid #eee;
}

.p-name {
    font-size: 0.75rem;
    font-weight: 700;
    color: #3e2723;
    text-transform: uppercase;
    margin-bottom: 2px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.p-price {
    color: #8d6e63;
    font-size: 0.85rem;
    font-weight: 700;
}

.page-num {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
    font-size: 0.7rem;
    color: #aaa;
}

/* GOOGLE BAR - TAM G�ZLEME */
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
iframe.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
}

/* Body d�zeltme */
body {
    top: 0 !important;
    position: static !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

html {
    margin-top: 0 !important;
}

.skiptranslate {
    display: none !important;
}

.goog-te-gadget-simple {
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.goog-logo-link,
.goog-te-gadget img {
    display: none !important;
}

.goog-text-highlight {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* --- RES�M KORUMA & F�L�GRAN ST�LLER� --- */
.protected-img {
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    pointer-events: auto;
}

.watermark-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    font-family: 'Playfair Display', serif;
    font-size: 4rem;
    font-weight: 700;
    color: rgba(200, 200, 200, 0.35);
    text-transform: uppercase;
    letter-spacing: 10px;
    white-space: nowrap;
    z-index: 10;
    pointer-events: none;
    user-select: none;
}

@media (max-width: 768px) {
    .watermark-overlay {
        font-size: 2rem;
        letter-spacing: 5px;
    }
}

/* --- L�STELEME KARTLARI ���N F�L�GRAN AYARI --- */
.watermark-overlay.card-size {
    font-size: 1.8rem;
    letter-spacing: 3px;
    opacity: 0.5;
    z-index: 5;
}

@media (max-width: 768px) {
    .watermark-overlay.card-size {
        font-size: 1.2rem;
        letter-spacing: 2px;
    }
}





/* --- CATEGORY FILTER NAV (Navbar Style) --- */
.filter-nav {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    padding: 14px 0;
}

.filter-nav__wrap {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: none; /* Firefox */
}

    .filter-nav__wrap::-webkit-scrollbar {
        display: none; /* Chrome/Safari */
    }

.filter-nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 6px;
    text-decoration: none;
    white-space: nowrap;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.82rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #666;
    transition: color 0.25s ease;
}

    /* Alt çizgi animasyonu */
    .filter-nav__link::after {
        content: '';
        position: absolute;
        left: 50%;
        bottom: -2px;
        height: 2px;
        width: 0;
        transform: translateX(-50%);
        background: var(--primary-color);
        transition: width 0.25s ease;
        border-radius: 2px;
    }

    /* Hover */
    .filter-nav__link:hover {
        color: var(--secondary-color);
    }

        .filter-nav__link:hover::after {
            width: 85%;
        }

    /* Aktif kategori */
    .filter-nav__link.is-active {
        color: var(--secondary-color);
    }

        .filter-nav__link.is-active::after {
            width: 85%;
        }

/* Mobilde dokunmatik alanı biraz büyütelim */
@media (max-width: 768px) {
    .filter-nav__link {
        font-size: 0.85rem;
        padding: 10px 8px;
        letter-spacing: 1.2px;
    }
}
.erez-watermark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Playfair Display', serif;
    font-size: 4rem;
    font-weight: 700;
    letter-spacing: 0.6rem;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.08);
    transform: rotate(-45deg);
    pointer-events: none;
    user-select: none;
    z-index: 2;
}
.erez-watermark {
    font-size: clamp(2.5rem, 6vw, 4.5rem);
}
.category-card:hover .erez-watermark {
    color: rgba(0, 0, 0, 0.15);
}

/* --- ÜRÜN DETAY GALERİ (SHOWROOM MOOD) --- */

/* Galeri dış kutu */
.detail-gallery-wrapper {
    position: relative;
    background-color: #fff;
    padding: 20px;
    border: 1px solid #f0f0f0;
}

/* Ana resim kutusu */
.main-img-box {
    width: 100%;
    height: 550px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fcfcfc;
    position: relative;
    cursor: zoom-in;
}

    /* Ana resim */
    .main-img-box img {
        max-height: 100%;
        max-width: 100%;
        object-fit: contain;
        transition: transform 0.5s ease;
    }

    /* Hover zoom */
    .main-img-box:hover img {
        transform: scale(1.2);
    }

/* Thumbnail butonları */
.thumb-btn {
    width: 80px;
    height: 80px;
    border: 1px solid #eee;
    padding: 5px;
    cursor: pointer;
    background: #fff;
    opacity: 0.6;
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

    /* Thumbnail görseller */
    .thumb-btn img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    /* Aktif / hover durumu */
    .thumb-btn:hover,
    .thumb-btn.active {
        opacity: 1;
        border-color: var(--primary-color);
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

/* Mobil iyileştirme */
@media (max-width: 768px) {
    .main-img-box {
        height: 420px;
    }

    .thumb-btn {
        width: 70px;
        height: 70px;
    }
}




/* İlgili Ürünler: Görsel alanı (frame) */
.related-img-box {
    width: 100%;
    height: 320px; /* İsterseniz 280/340 yapabiliriz */
    background: #f7f7f7;
    overflow: hidden;
    position: relative;
}

/* Görsel: kartı tamamen doldursun */
.related-img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* KRİTİK: küçük kalmasın, alanı doldursun */
    object-position: center;
    display: block;
    transition: transform 0.6s ease;
}

/* Hover zoom (premium hissiyat) */
.product-card:hover .related-img {
    transform: scale(1.06);
}

/* Mobilde biraz daha kompakt */
@media (max-width: 768px) {
    .related-img-box {
        height: 260px;
    }
}