/* Global Styles & Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Harmonia Sans", sans-serif; /* Poppins yerine Harmonia Sans */
    line-height: 1.6;
    color: #333;
    overflow-x: hidden; /* Yatay kaydırmayı engelle */
    background-color: #fff; /* Sayfanın arka planı (Hero'nun altındaki boşluk burası) */
    /* Header ve Top Bar'ın yukarıda boşluklu durması için body'e üst padding verilir,
       ancak Top Bar ve Header'a margin vererek de bu sağlanabilir, mevcut kodda margin kullanılıyor,
       body paddingine şimdilik gerek yok */
    /* padding-top: 25px; */
}

.container {
    max-width: 1400px; /* Sitenin ana içerik genişliği */
    margin: 0 auto;
    padding: 0 30px; /* Kenarlardan iç boşluk (responsive için önemli) */
    display: flex; /* Flexbox ile düzen */
    align-items: center; /* Dikeyde ortalama */
}

.container-fluid { /* Bu sınıf mevcut HTML'de kullanılmıyor ama bırakalım */
    width: 100%;
    padding: 0 30px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

a {
    text-decoration: none;
    color: inherit; /* Bağlantı rengini parent'tan al */
}

/* Top Bar */
.top-bar {
    color: #333;
    padding:0 0;
    font-size: 14px;
    width: 95%;
    margin: 25px auto 25px auto;
    border-radius: 15px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03); /* Çok hafif gölge */
    border: 1px solid rgba(0, 0, 0, 0.03); /* Çok hafif kenarlık */
}

.top-bar-content {
    justify-content: space-between;
    width: 100%;
}

.social-icons a {
    margin-right: 18px;
    color: #333;
    transition: color 0.3s ease;
    font-size: 18px;
}

.social-icons a:last-child {
    margin-right: 0;
}

.social-icons a:hover {
    color: #c8a951; /* Hover durumunda altın tonu */
}

/* Nakliye Bilgisi Kaydırma (Görselde statik görünüyor, ancak kaydırma özelliği korundu) */
.shipping-nav-container {
    display: flex;
    align-items: center;
    justify-content: center; /* Merkezi içerik ortalaması için */
    flex-grow: 1; /* Orta alanda yer kaplaması için */
}

.shipping-info {
    font-weight: 600;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 16px;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    max-width: 300px;
    margin: 0 15px;
    color: #705e2e; /* Koyu altın tonu */
}

.shipping-info i {
    margin-right: 8px;
    color: #c8a951; /* Altın tonu */
}

.shipping-info span {
     /* Kaydırma animasyonlu text span'ine ek stil */
    display: inline-block;
    /* width: 100%; Eğer tam genişliği kaplasın isterseniz */
     /* Eğer sadece tek sefer kayıp dursun veya sürekli loop yapsın isterseniz animasyon ayarlanabilir */
     /* Örn: scrollText 15s linear infinite; */
     animation: scrollText 15s linear infinite; /* Animasyon korundu */
}
/* Animasyonu durdurmak isterseniz üstteki satırı yoruma alabilirsiniz */
@keyframes scrollText {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}


.top-nav-arrows {
    display: flex;
    align-items: center;
    /* margin-left: 15px; Nav-container flex grow olduğu için bu kaldırılabilir */
    color: #333; /* Ok renkleri */
}

.top-nav-arrows a {
     color: #333;
     margin: 0 5px; /* Oklar arasına boşluk */
     font-size: 12px;
     padding: 4px; /* Tıklama alanı için padding */
     border-radius: 4px;
     transition: background-color 0.3s ease;
}
.top-nav-arrows a:hover {
    background-color: rgba(0,0,0,0.05);
}


/* Header */
.main-header {
    background-color: #f5f5f5; /* Beyaz arka plan */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); /* Daha yumuşak gölge */
    position: relative;
    z-index: 100;
    transition: all 0.3s ease;
    width: 95%;
    margin: 0 auto 25px auto;
    border-radius: 15px;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.03); /* Çok hafif kenarlık */
}

/* Yapışkan (Sticky) Header - Görselde sticky hali yok, mevcut davranış korunuyor */
.main-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%; /* Sticky olunca tam genişlik */
    background-color: rgba(255, 255, 255, 0.95); /* Hafif transparan beyaz */
    backdrop-filter: blur(10px); /* Bulanıklık efekti ekler */
    -webkit-backdrop-filter: blur(10px); /* Safari için */
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
    animation: fadeDown 0.5s forwards;
    margin: 0; /* Sticky olunca marjinleri sıfırla */
    border-radius: 0; /* Sticky olunca köşeleri sıfırla */
}

.main-header.hide {
    transform: translateY(-100%);
}

@keyframes fadeDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.header-content {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 20px;
    display: flex;
    flex-wrap: nowrap;
    position: relative;
}

.logo img {
    height: 94px; /* Görseldeki boyut */
    display: block;
}

.main-nav {
    margin-left: 0;
    position: absolute;
    left: 450px;
    display: flex; /* nav etiketini flex container yap */
    align-items: center; /* nav içindeki ul'yi dikeyde ortala */
}

.main-nav > ul { /* Sadece ana seviye ul */
    list-style: none;
    display: flex;
    gap: 35px;
    padding: 0; /* Görseldeki gibi ana menünün iç paddingi olmamalı */
    margin: 0; /* Görseldeki gibi ana menünün marjini olmamalı */
    align-items: center; /* Ana menü linklerini dikeyde ortala */
}

.main-nav a {
    color: #333;
    font-weight: bolder;
    font-size: 18px;
    transition: color 0.3s ease;
    position: relative;
    text-decoration: none;
    text-transform: none; /* Uppercase kaldırıldı */
    padding: 5px 0;
    letter-spacing: 0.5px; /* Harfler arası boşluk ekleyerek premium görünüm */
    font-family: "Harmonia Sans", sans-serif; /* Yazı tipi değiştirildi */
}

.main-nav a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 0;
    height: 2px;
    background-color: #c8a951; /* Altın tonu */
    transition: width 0.3s ease;
}

.main-nav > ul > li:hover > a {
    color: #c8a951; /* Hover durumunda altın tonu */
}

.main-nav > ul > li:hover > a::after,
.main-nav > ul > li.active > a::after {
    width: 100%;
}


/* Header dropdown menu */
.main-nav > ul > li {
    position: relative;
    white-space: nowrap;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #f5f5f5; /* Beyaz arka plan */
    width: auto;
    min-width: 280px; /* Genişletildi */
    max-width: 320px; /* Genişletildi */
    max-height: none; /* Scrollbar'ı kaldırmak için sınırsız yükseklik */
    overflow-y: visible; /* Scrollbar'ı kaldır */
    padding: 12px 0; /* Padding artırıldı */
    border-radius: 15px; /* Daha yuvarlak köşeler */
    box-shadow: 3px 8px 20px rgba(0, 0, 0, 0.08); /* Daha yumuşak gölge */
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.03); /* Çok hafif kenarlık */
    z-index: 1000;
}

/* Dropdown konumu özel ayarlamalar (gerekirse) */
/* Visual inspection suggests dropdowns mostly open left aligned under the parent item.
   Only adjust if a specific dropdown causes overflow issue.
li:nth-child(2) .dropdown-menu { left: 0; } /* İş Ayakkabıları */
/* li:nth-child(6) .dropdown-menu { left: auto; right: 0; } /* Kişisel Koruyucu Donanımlar - Sağa yasla örneği */


.main-nav > ul > li:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-menu li {
    margin-bottom: 0; /* Liste elemanları arasında margin olmamalı */
    width: 100%;
    margin-right: 0;
    border-bottom: none; /* Çizgiyi kaldır */
    list-style: none; /* Li'lerin başında bullet olmaması için */
    padding: 2px 0; /* Li elemanlarına hafif padding */
}

.dropdown-menu li:first-child a {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.dropdown-menu li:last-child {
    border-bottom: none; /* Son itemin altında çizgi olmamalı */
}

.dropdown-menu li:last-child a {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* Dropdown içindeki linkler (menü öğeleri) */
.dropdown-menu a {
    display: flex; /* Use flexbox to align text and icon */
    align-items: center; /* Vertically center text and icon */
    justify-content: space-between; /* Push text to left, icon to right */
    color: #333;
    font-size: 15px; /* Font büyütüldü */
    font-weight: 800;
    transition: color 0.3s ease, background-color 0.3s ease; /* Smooth transitions */
    padding: 14px 25px; /* Padding artırıldı */
    text-transform: none; /* Büyük harf kaldırıldı */
    border-bottom: none; /* border is on the li */
    font-family: "Harmonia Sans", sans-serif; /* Harmonia Sans yazı tipi */
    line-height: 1.4;
    border-radius: 10px; /* Link'e yuvarlaklık eklendi */
    margin: 0 5px; /* Kenarlardan marjin eklendi */
}

/* Remove the ::before pseudo-element style from dropdown links (was '>' before) */
.dropdown-menu a::before {
    content: none !important;
}

/* Style the chevron icon inside the link (on the right) */
.dropdown-menu a i.fa-chevron-right {
    font-size: 10px; /* Icon size */
    color: #999; /* Gri renk tonu - görsel tahmini */
    margin-left: 15px; /* Space between text and icon */
    flex-shrink: 0; /* Prevent icon from shrinking if text is long */
     transition: color 0.3s ease; /* İkon rengi transition */
}

/* Hover style for links */
.dropdown-menu a:hover {
    background-color: #ffffff; /* Çok hafif gri */
}

/* Hover style for icon within a hovered link */
.dropdown-menu a:hover i.fa-chevron-right {
    color: #c8a951; /* Hover icon color - altın tonu */
}


/* Scrollbar özelleştirmeyi kaldır */
.main-nav .dropdown-menu::-webkit-scrollbar {
  display: none; /* Webkit scrollbar'ı tamamen gizle */
}

/* Firefox için scrollbar'ı gizle */
.main-nav .dropdown-menu {
  scrollbar-width: none; /* Firefox scrollbar'ı gizle */
  scrollbar-color: transparent transparent; /* Firefox için scrollbar rengi şeffaf */
}


/* Hero Section / Carousel */
.hero-section {
    position: relative;
    width: 95%;
    height: 1080px;
    overflow: hidden;
    margin: 25px auto 70px auto;
    border-radius: 15px;
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    z-index: 1;
}

.carousel-slides {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.carousel-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    z-index: 1;
}

.carousel-slide::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
    z-index: 2;
}

.carousel-slide.active {
    opacity: 1;
    z-index: 3;
}

.hero-overlay {
    color: #fff;
    z-index: 10;
    pointer-events: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hero-overlay-container {
    width: 100%;
    max-width: 1200px;
    padding: 0 30px; /* Container ile aynı padding */
    pointer-events: auto;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    height: 100%;
    padding-bottom: 80px;
}

.hero-overlay h1 {
    font-size: 3.5em;
    margin-bottom: 10px;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
    display: inline-block;
    background-color: transparent;
    color: #fff;
    padding: 5px 0;
    pointer-events: auto;
}

.hero-small-title {
    color: #fff;
    font-size: 1em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 5px;
}

.hero-subtitle {
    color: #fff;
    margin-bottom: 20px;
    font-size: 1.1em;
}

.btn-discover {
    display: inline-block;
    background-color: #c8a951; /* Altın tonu */
    color: #fff; /* Beyaz metin */
    padding: 12px 30px;
    border-radius: 3px;
    font-weight: bold;
    font-size: 0.9em;
    letter-spacing: 1px;
    transition: background-color 0.3s ease;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    pointer-events: auto;
}

.btn-discover:hover {
    background-color: #ab9141; /* Koyu altın tonu */
}

/* Carousel Controls (Dots and Play/Pause) */
.carousel-controls {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    z-index: 10;
}

.play-pause {
    width: 30px;
    height: 30px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-right: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    color: #333;
}

.play-pause:hover {
    background-color: #fff;
}

.carousel-dots {
    display: flex;
    gap: 10px;
}

.dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.dot.active {
    background-color: #fff;
}

.dot:hover {
    background-color: #fff;
    transform: scale(1.1);
}

/* Carousel Arrows */
.carousel-arrows {
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: flex;
    z-index: 10;
    gap: 10px;
}

.carousel-arrows button {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    color: #333;
}

.carousel-arrows button:hover {
    background-color: #fff;
    transform: scale(1.05);
}

/* Play/Pause ikonu (sol alt köşede) */
.play-icon-corner {
    position: absolute;
    left: 20px;
    bottom: 20px;
    width: 45px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    z-index: 15;
    color: #333;
}

.play-icon-corner:hover {
    background-color: #fff;
    transform: scale(1.05);
}


/* Section Styles (Common) */
section {
     padding: 60px 0;
     background-color: #fff; /* Varsayılan olarak bölümler beyaz */
}
.about-section {
     background-color: #f9f9f9;
}
.contact-section {
     background-color: #f9f9f9;
}
/* Hero ve Header/TopBar arasına eklenen 25px marginleri göz önünde bulundurarak padding ayarları control edilebilir. */


.section-title {
    font-size: 30px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 40px;
    text-transform: uppercase;
    position: relative;
    color: #333;
}

.section-title::after {
    content: '';
    position: absolute;
    width: 60px;
    height: 3px;
    background-color: #ffda2d;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
}


/* Categories Section */
.categories-section {
    position: relative;
    z-index: 2;
    padding: 0;
    margin: -50px auto 0;
    width: 95%;
}

.categories-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.category-card {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.category-card:hover {
    transform: translateY(-10px);
}

.category-card img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
    transition: transform 0.5s ease;
}

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

.category-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 1.5rem;
}

.category-overlay a {
    color: #facc15;
    text-decoration: none;
    margin-top: 0.5rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

.category-overlay a:hover {
    color: #fff;
}

.h-350 {
    height: 350px;
}

.h-170 {
    height: 170px;
}

.category-content {
    width: 100%;
}

.category-content p:first-child {
    font-size: 14px;
    opacity: 0.8;
    margin-bottom: 5px;
}

.category-content h3 {
    font-size: 24px;
    font-weight: 600;
    margin: 10px 0;
}

.category-content p:nth-child(3) {
    font-size: 16px;
    opacity: 0.9;
    margin-bottom: 20px;
}

.btn-category {
    display: inline-block;
    background-color: #f4dc2a;
    color: #333;
    padding: 12px 30px;
    border-radius: 25px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    text-transform: uppercase;
}

.btn-category:hover {
    background-color: #fff;
    color: #333;
}

/* About Section */
.about-section {
    /* background-color: #f9f9f9; */ /* Already set by base section style */
}

.about-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 50px;
}

.about-image {
    flex: 1;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.about-image img {
    width: 100%;
    height: auto;
    display: block;
}

.about-content {
    flex: 1;
}

.about-content .section-title {
    text-align: left;
    margin-bottom: 25px;
}

.about-content .section-title::after {
    left: 0;
    transform: none;
}

.about-content p {
    margin-bottom: 20px;
    color: #666;
    line-height: 1.7;
}

.btn-more {
    display: inline-block;
    background-color: #ffda2d;
    color: #333;
    padding: 12px 30px;
    border-radius: 5px;
    font-weight: 600;
    transition: all 0.3s ease;
    text-transform: uppercase;
    font-size: 14px;
    margin-top: 10px;
}

.btn-more:hover {
    background-color: #333;
    color: #fff;
}

/* Featured Products Section */
.featured-section {
    /* background-color: #fff; */ /* Already set by base section style */
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.product-item {
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.product-image {
    position: relative;
    height: 250px;
    overflow: hidden;
}

.product-image img {
    width: 100%;
    height: 100%;
    background-color: #f6f6f6;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.product-item:hover .product-image img {
    transform: scale(1.1);
}

.product-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background-color: #ffda2d;
    color: #333;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    z-index: 1; /* Resmin üzerinde görünmeli */
}

.product-info {
    padding: 20px;
}

.product-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
}

.product-price {
    font-size: 18px;
    font-weight: 700;
    color: #ffda2d;
    margin-bottom: 15px;
}

.btn-add-cart {
    display: block;
    width: 100%;
    background-color: #f0f0f0;
    color: #333;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    font-weight: 600;
    transition: all 0.3s ease;
    text-transform: uppercase;
    font-size: 14px;
}

.btn-add-cart:hover {
    background-color: #ffda2d;
    color: #333;
}

/* Contact Section */
.contact-section {
     /* background-color: #f9f9f9; */ /* Already set by base section style */
}

.contact-container {
    display: flex;
    flex-direction: row;
    gap: 40px;
}

.contact-map {
    flex: 1;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}
/* Harita iframe'ine boyutları ve display block ekleyelim */
.contact-map iframe {
    width: 100%;
    height: 450px; /* veya ihtiyaca göre ayarla */
    display: block;
}

.contact-form-container {
    flex: 1;
}

.contact-form {
    margin-bottom: 30px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    transition: border-color 0.3s ease;
}

.form-group input:focus,
.form-group textarea:focus {
    border-color: #ffda2d;
    outline: none;
}

.btn-submit {
    background-color: #ffda2d;
    color: #333;
    border: none;
    padding: 12px 30px;
    border-radius: 5px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    font-size: 15px;
}

.btn-submit:hover {
    background-color: #333;
    color: #fff;
}

.contact-info {
    margin-top: 40px;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.contact-item i {
    font-size: 18px;
    color: #ffda2d;
    margin-right: 15px;
    margin-top: 5px; /* İkonun metinle hizalanması için */
}

.contact-item p {
    color: #666;
    flex-grow: 1; /* Metnin kalan alanı doldurmasını sağlar */
}

/* Footer */
.footer {
    background-color: #222;
    color: #fff;
    padding: 60px 0 0;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 40px;
}

.footer-column {
    flex: 1;
    min-width: 250px; /* Belirli bir minimum genişlik */
    margin-bottom: 30px; /* Mobile alt alta gelince boşluk */
    padding: 0 15px; /* Kenarlardan hafif boşluk (footer container'ın paddingine ek) */
}

.footer-column:first-child { padding-left: 0; } /* İlk sütunda solda boşluk olmasın */
.footer-column:last-child { padding-right: 0; } /* Son sütunda sağda boşluk olmasın */


.footer-column h3 {
    font-size: 18px;
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 10px;
    color: black;

}

.footer-column h3::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background-color: #ffda2d;
}

.footer-column p {
    color: #aaa;
    line-height: 1.7;
    margin-bottom: 20px;
    font-size: 15px;
}

.footer-social {
    display: flex;
    gap: 15px;
}

.footer-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transition: all 0.3s ease;
    color: #fff; /* İkon rengi */
    font-size: 18px;
}

.footer-social a:hover {
    background-color: #ffda2d;
    color: #333;
}

.footer-links {
    list-style: none;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links a {
    color: #aaa;
    transition: color 0.3s ease;
    position: relative;
    padding-left: 20px; /* Ok simgesi için solda boşluk */
    font-size: 15px;
}

.footer-links a::before {
    content: '›';
    position: absolute;
    left: 0;
    color: #ffda2d;
    font-weight: bold;
    font-size: 18px;
}

.footer-links a:hover {
    color: #ffda2d;
}

.footer-contact p {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    color: #aaa; /* İletişim metinleri */
    font-size: 15px;
}

.footer-contact i {
    margin-right: 10px;
    color: #ffda2d;
    margin-top: 4px; /* İkonu metinle hizala */
}

.footer-bottom {
    background-color: #1a1a1a;
    padding: 20px 0;
    text-align: center;
}

.footer-bottom p {
    color: #aaa;
    font-size: 14px;
    margin-bottom: 0;
}

/* Mobile Menu */
.mobile-menu-btn {
    display: none;
    cursor: pointer;
    font-size: 24px;
    color: #333; /* İkon rengi */
}

.mobile-menu {
    position: fixed;
    top: 0;
    right: -300px;
    width: 300px;
    height: 100vh;
    background-color: #fff;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    transition: right 0.3s ease;
    overflow-y: auto; /* Mobile menü uzun olursa kaydırma */
}

.mobile-menu.active {
    right: 0;
}

.mobile-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 20px; /* Padding ayarı */
    border-bottom: 1px solid #eee;
}

.mobile-logo img {
    height: 60px; /* Logo boyutu küçültüldü */
    width: auto; /* En boy oranını koru */
}

.mobile-close {
    font-size: 28px; /* Kapatma ikonu boyutu */
    cursor: pointer;
    color: #333; /* Kapatma ikonu rengi */
    transition: color 0.3s ease;
}
.mobile-close:hover {
    color: #ffda2d;
}


.mobile-nav ul {
    list-style: none;
    padding: 0 20px; /* Kenar paddingleri */
}

.mobile-nav li {
    margin-bottom: 0; /* Listeleme öğeleri arasında varsayılan marjin olmasın */
}

.mobile-nav a {
    display: block;
    padding: 15px 0; /* Üst/alt padding ile tıklanabilir alan yarat */
    color: #333;
    font-weight: 600;
    transition: color 0.3s ease;
    border-bottom: 1px solid #eee; /* Her linkin altında çizgi */
    font-size: 16px;
}



.mobile-contact {
    padding: 20px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.mobile-contact p {
    display: flex;
    align-items: center;
    color: #666;
    margin-bottom: 12px; /* İletişim satırları arası boşluk */
    font-size: 15px;
}
.mobile-contact p:last-child {
     margin-bottom: 0;
}

.mobile-contact i {
    color: #ffda2d;
    margin-right: 10px;
    font-size: 18px;
}

.mobile-social {
    display: flex;
    padding: 20px;
    gap: 15px;
    justify-content: center; /* İkonları ortala */
}

.mobile-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: #f5f5f5;
    border-radius: 50%;
    transition: all 0.3s ease;
    color: #333; /* İkon rengi */
    font-size: 18px;
}

.mobile-social a:hover {
    background-color: #ffda2d;
}


/* Responsive Ayarlar */

@media (max-width: 1200px) {
    .header-icons{display: none;}
    .container {
        padding: 0 20px; /* Tabletlerde ve küçük ekranlarda iç boşluğu azalt */
    }
    .hero-overlay-container {
        padding-left: 20px;
    }
    .carousel-arrows {
        right: 20px;
    }
     .play-icon-corner {
        left: 20px;
     }

    .hero-section {
        height: 550px;
    }

    .main-nav {
        position: relative;
        left: 0;
        margin-left: 0;
    }

    .main-header {
        padding: 15px 0;
    }

    .categories-grid,
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
    }

     .top-bar, .main-header, .hero-section {
         width: calc(100% - 40px); /* Sol ve sağda 20px boşluk */
         margin-left: 20px;
         margin-right: 20px;
     }
}

@media (max-width: 1024px) {
    .header-icons{display: none;}
    .main-nav {
        /* flex-grow: 1; /* Menüyü merkeze doğru itebilir */
        margin-left: auto; /* Tablet görünümünde menüyü sağa doğru hizala veya merkeze al */
        position: relative;
        left: 0;
    }
    .main-nav ul {
        gap: 20px; /* Tablet görünümünde menü itemleri arasını daralt */
    }
    .header-icons {
        margin-left: 20px; /* Menü ile ikonlar arasına boşluk */
    }
    .hero-overlay h1 {
        font-size: 2.8em;
    }
    .carousel-arrows {
        right: 15px;
        bottom: 15px;
        gap: 8px;
    }
    .carousel-arrows button {
        width: 40px;
        height: 40px;
    }
    .play-icon-corner {
        width: 40px;
        height: 40px;
        left: 15px;
        bottom: 15px;
    }
    .hero-section {
        height: 500px;
        /* Tablette yan boşluklu duruş korunur */
        /* width: 100%; border-radius: 0; *//* Tam ekran yapmak istenirse */
    }

    .about-container, .contact-container {
        flex-direction: column;
    }
    .about-image,
    .about-content,
    .contact-map,
    .contact-form-container {
        width: 100%;
    }
    .about-content .section-title {
        text-align: center;
    }
    .about-content .section-title::after {
        left: 50%;
        transform: translateX(-50%);
    }
     .contact-map {
         margin-bottom: 30px; /* Harita ile form arasına boşluk */
     }
     .contact-map iframe {
         height: 350px; /* Tablette harita yüksekliğini azalt */
     }


    .footer-container {
        flex-direction: column;
        align-items: center; /* Sütunları ortala */
    }
    .footer-column {
        width: 80%; /* Sütun genişliği */
        min-width: auto;
        text-align: center; /* Sütun içeriğini ortala */
        margin-bottom: 40px;
        padding: 0; /* Footer column padding kaldırılır */
    }
    .footer-column:last-child { margin-bottom: 0; }
    .footer-column h3::after {
        left: 50%;
        transform: translateX(-50%); /* Başlık alt çizgisini ortala */
    }
     .footer-social {
        justify-content: center; /* Sosyal ikonları ortala */
     }
     .footer-links {
         text-align: center; /* Linkleri ortala */
     }
     .footer-links a {
         padding-left: 0; /* Ok simgesini kaldır */
     }
     .footer-links a::before {
         display: none; /* Ok simgesini gizle */
     }
      .footer-contact p {
          justify-content: center; /* İletişim bilgilerini ortala */
      }
}

@media (max-width: 992px) {
    .header-icons{display: none;}
    .main-nav {
        left: 160px;
    }
}

@media (max-width: 768px) {
    .header-icons{display: none;}
    .container {
        padding: 0 15px; /* Mobil ekranlarda iç boşluğu daha da azalt */
    }
    /* Top bar ve Header yan boşluklarını ayarlama */
    .top-bar, .main-header, .hero-section {
        width: calc(100% - 30px); /* Sol ve sağda 15px boşluk */
        margin-left: 15px;
        margin-right: 15px;
    }

    .top-bar-content {
        flex-direction: column;
        padding: 10px 0;
    }

    .social-icons {
display: none;        
    }
    /* Mobil cihazda shipping info animasyonunu kapat veya hızlandır */
    .shipping-info span {
        animation: none; /* Mobil görünümde kaydırmayı kapat */
        white-space: normal; /* Kaydırma kapalıyken metnin sığmasını sağla */
        text-align: center; /* Metni ortala */
    }
     .shipping-info {
         max-width: none; /* Kısıtlamayı kaldır */
         margin: 10px 0; /* Üst ve alt boşluk ver */
         justify-content: center; /* Metni ortala */
     }
    .shipping-nav-container {
        flex-direction: column;
    }
    .top-nav-arrows {
        margin-left: 0; /* İkonları ortalamak için */
        justify-content: center;
    }

    .header-content {
        flex-wrap: wrap;
         /* justify-content: center; *//* Menü kapalıyken öğeleri ortala */
    }
     .logo {
        width: 100%;
        text-align: center;
        margin-bottom: 15px; /* Logonun altına boşluk */
     }
     .logo img {
        height: 75px;
        
     }

    .main-nav {
        display: none; /* Mobil görünümde menü gizlenir */
    }

    .mobile-menu-btn {
        display: block; /* Mobil menü butonu gösterilir */
        /* Header'da ikonların yanında veya logonun yanında konumlandırılabilir */
        margin-left: auto; /* Sağa yasla */
        margin-bottom: 15px; /* Logoyla aynı satıra gelmesi için (eğer logo ortadaysa ayarla) */
     }

     .header-icons {
        /* Eğer logo ortalandıysa ikonları da ortala */
        /* width: 100%; justify-content: center; */
        margin-left: auto; /* Sağa yaslama devam eder */
         order: 2; /* Sırayı ayarla, logo 1, ikonlar 2, menü butonu 3 gibi */
         margin-bottom: 15px; /* Alta boşluk */
     }
    /* Header içeriği tek satıra sığmazsa flex-wrap çalışır */


    .hero-section {
        width: 100%;
        height: 100vh;
        margin: 0;
        padding: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .carousel-slide {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    .carousel-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hero-overlay {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    .hero-overlay-container {
        padding: 0 20px;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding-bottom: 120px;
    }
    
    .hero-small-title {
        font-size: 1.1em;
        text-align: left;
        width: 100%;
        font-weight: 600;
        color: #fff;
        margin-bottom: 10px;
    }
    
    .hero-subtitle {
        text-align: left;
        width: 100%;
        font-size: 1.1em;
        margin-bottom: 25px;
    }
    
    .hero-overlay h1 {
        font-size: 2.5em;
        text-align: left;
        margin: 10px 0;
    }
    
    .btn-discover {
        padding: 12px 30px;
        width: auto;
        max-width: none;
        margin: 0;
        display: inline-block;
        background-color: #f4dc2a;
        color: #333;
        border-radius: 30px;
        font-weight: bold;
        text-transform: uppercase;
        text-align: center;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    }
    
    .carousel-dots {
        position: absolute;
        left: 30px;
        transform: none;
        display: flex;
        justify-content: flex-start;
    }

    .categories-grid,
    .products-grid {
        grid-template-columns: repeat(2, 1fr); /* Mobil cihazlarda 2 sütun */
         gap: 15px;
    }
     .category-image {
         height: 220px; /* Kategori görsel yüksekliği */
     }
     .product-image {
         height: 200px; /* Ürün görsel yüksekliği */
     }


    .section-title {
        font-size: 26px;
        margin-bottom: 30px;
    }

    section {
        padding: 40px 0;
    }

    .about-content p, .contact-item p, .footer-column p, .footer-links a, .footer-contact p {
        font-size: 14px; /* Genel metin boyutunu küçült */
    }
     .footer-column h3 {
         font-size: 17px;
     }
     .footer-bottom p {
         font-size: 13px;
     }
}

@media (max-width: 480px) {
    .header-icons{display: none;}
    /* Çok küçük cihazlarda tek sütuna düşür */
    .categories-grid,
    .products-grid {
        grid-template-columns: 1fr;
    }

     .category-image {
         height: 200px;
     }
    .product-image {
        height: 180px;
    }


    .hero-section {
        height: 300px;
    }
     .hero-overlay h1 {
         font-size: 1.6em;
     }
     .hero-small-title { font-size: 0.7em; }
     .hero-subtitle { font-size: 0.8em; }
     .hero-overlay-container { padding-bottom: 30px;}
     .btn-discover { padding: 8px 18px; font-size: 12px; }

    .carousel-arrows button,
    .play-icon-corner {
        width: 30px; height: 30px;
        bottom: 5px;
    }
    .carousel-arrows { right: 5px;}
    .play-icon-corner { left: 5px;}
     .carousel-controls { bottom: 5px; gap: 5px;}
     .play-pause { width: 25px; height: 25px; }
     .dot { width: 8px; height: 8px;}

     /* Footer sütunları zaten 1024px altında tek sütuna düşüyor */
     /* Burada text align center korundu */
     .footer-column {
         width: 90%;
     }

     .section-title {
         font-size: 22px;
     }

     .contact-map iframe {
         height: 300px;
     }
}

/* Header ikonları için stil */
.header-icons {
    display: flex;
    align-items: center;
}

.header-icons a {
    color: #333;
    font-size: 18px;
    margin-left: 15px;
    transition: color 0.3s ease, transform 0.3s ease;
}

.header-icons a:hover {
    color: #c8a951; /* Hover durumunda altın tonu */
    transform: scale(1.1);
}

/* Sosyal medya ikonları için özel renkler */
.header-icons a .fab.fa-instagram:hover {
    color: #e1306c;
}

.header-icons a .fab.fa-facebook-f:hover {
    color: #3b5998;
}

.header-icons a .fab.fa-youtube:hover {
    color: #ff0000;
}

.header-icons a .fab.fa-linkedin-in:hover {
    color: #0077b5;
}

.container.header-content {
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
}

/* Kategori Swiper Kontrol Butonları */
.kategori-swiper-controls {
    position: absolute;
    bottom: 0;
    right: 10px;
    z-index: 10;
}

.kategori-swiper-playpause {
    width: 30px;
    height: 30px;
    background-color: rgba(244, 220, 42, 0.8);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border: none;
    color: #333;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.kategori-swiper-playpause:hover {
    background-color: #f4dc2a;
}

.kategori-swiper-playpause i {
    font-size: 12px;
}

@media (max-width: 767px) {
    .header-icons{display: none;}
    .kategoriSwiper .swiper-slide:first-child {
        margin-left: 10px;
    }
}

.swiper-button-prev.prev_product {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    color: #333;
}

/* 820px ve altı tüm cihazlar için mobil görünüm */
@media (max-width: 820px) {
    .main-nav {
        display: none; /* Ana menü gizlensin */
    }
    
    .header-icons {
        display: none; /* 820px altında ikonlar gizlensin */
    }
    
    .mobile-menu-btn {
        display: block; /* Mobil menü butonu görünür olsun */
        margin-left: auto;
        order: 3;
        margin-bottom: 0;
    }
    
    .logo {
        order: 1;
    }
    
    .container.header-content {
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
    }
}

/* iPad Air için özel ayarları kaldırıyorum, yeni düzenleme yeterli olacak */
@media (min-width: 768px) and (max-width: 834px) {
    /* Eski ayarları siliyorum */
}
footer.footer.bg-\[\#f5f5f5\].py-16 {
    width: 95%;
    /* height: 1080px; */
    overflow: hidden;
    border-radius: 29px;
    margin: 25px auto 70px auto;
}
.samedya_hmtl{
    width: 95%;
    margin: 25px auto 70px auto;
    border-radius: 29px;
    display: block;
      height: auto;

}

section.about-section.py-24.bg-\[\#f5f5f5\] {
    border-radius: 21px;
}
@font-face {
    font-family: 'Harmonia Sans';
    src: url('fonts/HarmoniaSansProCyr-Regular.woff2') format('woff2'),
         url('fonts/HarmoniaSansProCyr-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Harmonia Sans';
    src: url('fonts/HarmoniaSansProCyr-SemiBd.woff2') format('woff2'),
         url('fonts/HarmoniaSansProCyr-SemiBd.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Harmonia Sans';
    src: url('fonts/HarmoniaSansProCyr-Bold.woff2') format('woff2'),
         url('fonts/HarmoniaSansProCyr-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Google Fonts ile Open Sans fontunu ekleyelim (Harmonia Sans yerine) */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');

body {
    font-family: 'Open Sans', 'Harmonia Sans', sans-serif; /* Open Sans'ı birincil yazı tipi olarak ekleyelim */
}

/* Ürün slider ok butonları */
.next_product, .prev_product {
    width: 45px !important;
    height: 45px !important;
    border-radius: 50% !important;
    background-color: rgba(255, 255, 255, 0.8) !important;
    border: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    color: #333 !important;
}

.next_product:hover, .prev_product:hover {
    background-color: rgba(255, 255, 255, 1) !important;
    transform: scale(1.1) !important;
}

.next_product::after, .prev_product::after {
    font-size: 18px !important;
    font-weight: bold !important;
}

/* Progress bar stili */
.product-progress-bar {
    position: relative !important;
    height: 4px !important;
    width: 100% !important;
    top: 10px !important;
    left: 0 !important;
    background-color: #eee !important;
    border-radius: 2px !important;
}

.product-progress-bar .swiper-pagination-progressbar-fill {
    background-color: #333 !important;
    border-radius: 2px !important;
}

/* Mobil dropdown stili */
.mobile-dropdown {
    display: none;
    padding-left: 20px;
    margin-top: 5px;
    margin-bottom: 10px;
}

.mobile-dropdown li {
    margin-bottom: 8px;
}

.mobile-dropdown li a {
    font-size: 14px;
    color: #666;
}

.mobile-nav > ul > li {
    position: relative;
}

.mobile-nav > ul > li > a {
    font-size: 16px;
    font-weight: bolder;
    color: #333;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.mobile-nav > ul > li.has-dropdown > a:after {
    content: '\f054'; /* Font Awesome chevron-right ikonu */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 12px;
    color: #666;
    display: block;
    margin-right: 5px;
}

.mobile-nav > ul > li.active > a:after {
    content: '\f078'; /* Font Awesome chevron-down ikonu */
}

.mobile-nav > ul > li.active .mobile-dropdown {
    display: block;
}

/* Mobil Menu Stili */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 400px;
    height: 100%;
    background-color: #f5f5f5;
    z-index: 1000;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
    transition: right 0.3s ease;
    display: flex;
    flex-direction: column;
}

.mobile-menu.active {
    right: 0;
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background-color: #ffffff;
}

.mobile-logo img {
    max-height: 135px;
}

.mobile-close {
    cursor: pointer;
    font-size: 24px;
    color: #666;
}

.mobile-menu-content {
    flex: 1;
    overflow-y: auto;
}

.mobile-nav {
    padding: 0;
}

.mobile-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-nav > ul > li {
    border-bottom: none;
    margin: 0;
    padding: 0;
}

.mobile-nav > ul > li > a {
    font-size: 16px;
    font-weight: 500;
    color: #333;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
}

.mobile-dropdown {
    display: none;
    padding: 5px 0;
}

.mobile-dropdown li {
    margin: 0;
    padding: 0;
}

.mobile-dropdown li a {
    padding: 12px 20px 12px 35px;
    display: block;
    font-weight: bolder;
    font-size: 14px;
    color: #666;
}

.mobile-menu-footer {
    background-color: #f5f5f5;
}

.mobile-contact {
    padding: 20px;
}

.mobile-contact p {
    margin-bottom: 10px;
    color: #666;
    display: flex;
    align-items: center;
}

.mobile-contact p i {
    width: 20px;
    margin-right: 10px;
    color: #333;
}

.mobile-social {
    display: flex;
    justify-content: center;
    padding: 0 20px 20px;
}

.mobile-social a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #f0f0f0;
    margin: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    transition: all 0.3s ease;
}

.mobile-social a:hover {
    background-color: #333;
    color: white;
}

/* Main Navigation Dropdown Styles */
.main-nav .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: white;
    box-shadow: 0 10px 15px rgba(0,0,0,0.1);
    border-radius: 0 0 4px 4px;
    padding: 10px 0;
    z-index: 100;
}

.main-nav li {
    position: relative;
}

.main-nav li:hover .dropdown-menu {
    display: block;
}

.main-nav .dropdown-menu li {
    margin: 0;
    padding: 0;
}

.main-nav .dropdown-menu a {
    padding: 8px 20px;
    display: block;
    color: #333;
    font-size: 14px;
    border-bottom: 1px solid #f5f5f5;
}

.main-nav .dropdown-menu a:hover {
    background: #f9f9f9;
}

/* Masaüstü menüde artı işaretini kaldır */
.main-nav li.has-dropdown > a:after {
    display: none;
}
section.contact-section.py-16.md\:py-24.bg-white.relative {
    width: 95%;
    /* height: 1080px; */
    overflow: hidden;
    border-radius: 29px;
    margin: 25px auto 70px auto;
}
/* Bu kuralı mevcut @media (max-width: 820px) bloğunun içine ekleyin */
@media (max-width: 820px) {
    /* ... (diğer mobil kurallarınız) ... */

    /* Mobil menüdeki linklerin içindeki <i> ikonlarını tamamen gizle */
    .mobile-nav a i {
        display: none !important;
    }

    /* Mobil menüdeki li elementlerinin içindeki <i> ikonlarını da gizle (eğer linkin dışında ise) */
    .mobile-nav li i {
        display: none !important;
    }

    /* ... (diğer mobil kurallarınız) ... */
}

/* Ayrıca, mobil menüdeki ::after ikon kuralınızı kontrol edelim */
/* Muhtemelen zaten var ama emin olmak için buraya ekliyorum */
/* mobile-nav > ul > li.has-dropdown > a:after { ... } */
/* Bu kural, mobil menüdeki açılır menüsü olan linklere CSS ile ikon ekler. */
/* Bu kuralın display: block; yerine display: inline-block; kullanması genellikle daha güvenlidir. */
.mobile-nav > ul > li.has-dropdown > a:after {
    content: '\f054'; /* Font Awesome chevron-right ikonu */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 12px;
    color: #666;
    display: inline-block; /* block yerine inline-block yapalım */
    margin-left: auto; /* İkonu sağa yaslamak için */
    margin-right: 0; /* Sağdan boşluk varsa kaldır */
}

.mobile-nav > ul > li.active > a:after {
    content: '\f078'; /* Font Awesome chevron-down ikonu */
}

a.group.mt-2.inline-flex.items-center.px-4.py-2.text-sm.font-medium.transition-all.duration-300.transform.hover\:scale-105.bg-yellow-400.hover\:bg-yellow-500.text-gray-900.rounded-lg.shadow-md.hover\:shadow-lg {
    background: #2b3779;
    color: white;
}
a.mt-2.text-yellow-400.hover\:underline.text-lg {
    background: #2b3779;
    color: wheat;
    text-decoration: none;
    border-radius: 33px;
    width: 40%;
    height: 10%;
}