:root {
    --color-bg:        #FFFFFF;
    --color-text:      #333333;
    --color-primary:   #0C5A57;
    --color-secondary: #D4A06E;
    --color-accent:    #6BA34E;
    --color-walnut:    #A67A4A;
    --color-card-bg:   #F4F9F7;
    --color-hover:     rgba(107,163,78,0.1);
    --header-height:   92px;
  }
  
  /* Reset & Base */
  * { margin:0; padding:0; box-sizing:border-box }
  body {
    font-family: 'Montserrat', sans-serif;
    background: var(--color-bg);
    color: var(--color-text);
    line-height:1.5;
  }
  
  /* Header */
  header {
    background: var(--color-bg);
    padding:16px 0;
    border-bottom:1px solid #e0e0e0;
    position:sticky; top:0; z-index:1000;
    box-shadow:0 1px 4px rgba(0,0,0,0.05);
  }
  .header-container {
    max-width:1000px;
    margin:0 auto;
    text-align:center;
  }
  .logo { height:70px; object-fit:contain }
  
  /* Banner */
  .banner {
    background: var(--color-card-bg) url('../images/arkaplan.png') center/cover no-repeat;
    text-align:center; padding:50px 0;
  }
  .banner h1 { font-size:2.8rem; color:var(--color-primary) }
  .banner p { margin-top:8px; color:var(--color-text) }
  
  /* Kategori Listesi */
  .menu-list {
    max-width:800px; margin:30px auto; padding:0 12px;
  }
  .category-block + .category-block { margin-top:14px }
  
  /* Sticky kategori başlığı */
  .menu-item {
    background:var(--color-bg);
    padding:14px 18px;
    border-radius:8px;
    display:flex; justify-content:space-between; align-items:center;
    cursor:pointer;
    transition:background .2s, box-shadow .2s;
    box-shadow:0 2px 6px rgba(0,0,0,0.02);
  
    position:sticky;
    top:calc(var(--header-height));
    z-index:10;
  }
  .menu-item:hover { background:var(--color-card-bg) }
  .menu-item.active {
    background:var(--color-hover);
    box-shadow:0 4px 12px rgba(0,0,0,0.04);
  }
  .arrow {
    font-size:0.9em;
    color:var(--color-primary);
    transition:transform .3s;
  }
  .menu-item.active .arrow {
    transform:rotate(180deg);
  }
  
  /* Ürün Paneli */
  .products-row {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    gap:16px;
    padding:16px 0;
    margin-top:12px;
    transform-origin:top;
    transform:scaleY(0);
    opacity:0;
    transition:transform .35s ease, opacity .35s ease;
  }
  .products-row.open {
    transform:scaleY(1);
    opacity:1;
  }
  
  /* — Mobilde 2 sütunlu düzen — */
  @media (max-width: 600px) {
    .products-row {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  /* Kart Stilleri */
  .product-card {
    background:var(--color-card-bg);
    border-radius:8px; overflow:hidden;
    box-shadow:0 4px 16px rgba(0,0,0,0.05);
    transition:transform .2s, box-shadow .2s;
    display:flex; flex-direction:column;
  }
  .product-card:hover {
    transform:translateY(-4px);
    box-shadow:0 8px 24px rgba(0,0,0,0.08);
  }
  .product-card img {
    width:100%; height:auto; object-fit:cover; background:#f0f0f0;
  }
  .card-content {
    padding:12px 16px; flex-grow:1; display:flex; flex-direction:column;
  }
  .card-title {
    font-size:1.15rem; font-weight:600; margin-bottom:6px;
    color:var(--color-secondary);
  }
  .card-price {
    font-size:1rem; font-weight:600; margin-bottom:8px;
    color:var(--color-walnut);
  }
  .card-desc {
    font-size:0.9rem; color:var(--color-text);
    flex-grow:1; line-height:1.4;
  }
  
  /* Boş kategori mesajı */
  .no-products {
    grid-column:1 / -1;
    text-align:center; color:#888; font-style:italic;
    padding:20px 0;
  }
  
  /* Footer */
  footer {
    background:var(--color-bg);
    padding:20px; margin-top:40px;
    border-top:1px solid #e0e0e0;
    text-align:center;
  }
  footer p {
    color:#666; font-size:0.9rem;
  }
  