 /* ================================
     QR Menü – Inline Modern Katman
     (Mevcut CSS'i !important ile override)
     ================================ */

  :root{
    --qr-primary:#ddae71;
    --qr-primary-50:#fcf7f1;
    --qr-dark:#1c1e20;
    --qr-darker:#121316;
    --qr-text:#222426;
    --qr-muted:#7e8287;
    --qr-light:#f5f6f7;
    --qr-white:#fff;

    --qr-radius-sm:.5rem;
    --qr-radius-md:.75rem;
    --qr-radius-lg:1rem;

    --qr-shadow-sm:0 6px 18px rgba(0,0,0,.08);
    --qr-shadow-md:0 10px 30px rgba(0,0,0,.12);
    --qr-shadow-lg:0 16px 48px rgba(0,0,0,.16);

    --qr-spacing-xs:.5rem;
    --qr-spacing-sm:.75rem;
    --qr-spacing:1rem;
    --qr-spacing-lg:1.5rem;
    --qr-spacing-xl:2rem;
  }

  /* Sayfa arkaplan görseli üzeri hafif karartma */
  body{ position:relative !important; color:var(--qr-text) !important; }
  body::before{
    content:"" !important;
    position:fixed !important; inset:0 !important;
    background:rgba(0,0,0,.25) !important;
    pointer-events:none !important; z-index:-1 !important;
  }
  body, html{
  font-family: 'Inter', sans-serif !important;
}
h1, h2, h3, h4, h5, h6{
  font-weight: 600 !important; /* kurumsal görünsün */
}

  /* Tipografi */
  h1,h2,h3,h4,h5,h6{ letter-spacing:.2px !important; color:var(--qr-text) !important; }
  .title{ font-weight:700 !important; color:var(--qr-text) !important; }
  .text-sm{ color:#2B3A55 !important; font-style:italic !important; font-size:16px !important; }
  .mb-0{ font-weight:700 !important; font-size:20px !important; color:#FF6E31 !important; }
  .mb-1{ font-weight:700 !important; }

/* ======================
   Header – Logo Paneli
   ====================== */

/* Masaüstü ve mobil ayrımı */
@media (min-width: 768px){
  #header{ display:block !important; }
  #header-mobile{ display:none !important; }
}
@media (max-width: 767.98px){
  #header{ display:none !important; }
  #header-mobile{ display:flex !important; }
}

/* Ortak header alanı */
#header.light,
#header-mobile.light{
  position: relative !important;
  background: linear-gradient(180deg, #3a3d40, #2a2c2e) !important; /* gri degrade */
  border: 0 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.25) !important;
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 50 !important;
}

/* Header'da logo paneli (her cihazda tek yapı) */
.module-logo{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(28,30,32,0.85) !important;  /* koyu füme yarı saydam panel */
  padding: .75rem 1.25rem !important;
  border-radius: .75rem !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.25) !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
}

/* Logo görseli */
.module-logo img{
  max-height: 150px !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.5)) !important; /* beyaz logoyu öne çıkarır */
}

/* Mobilde küçült */
@media (max-width: 767.98px){
  .module-logo img{
    max-height: 90px !important;
  }
}

/* Çift header sorunu fix: desktop sadece #header, mobil sadece #header-mobile */
@media (min-width: 768px){
  #header{ display:block !important; }
  #header-mobile{ display:none !important; }
}
@media (max-width: 767.98px){
  #header{ display:none !important; }
  #header-mobile{ display:flex !important; justify-content:center !important; }
}



/* Cafe adı alt yazı (h1 veya alt satırdaki text) */
#header .module-logo + .text,
#header-mobile .module-logo + .text{
  margin-top: .35rem !important;
  font-weight: 600 !important;
  color: #222 !important;
  font-size: 1rem !important;
  text-align: center !important;
}


  /* Page title şeridi */
  .page-title.bg-dark{
    background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.35)) !important;
    border:0 !important;
    padding: clamp(1.25rem, 4vw, 2.25rem) 0 !important;
    box-shadow: var(--qr-shadow-sm) !important;
  }
  .page-title .text-light{ 
    color:var(--qr-white) !important; 
    text-shadow:0 2px 10px rgba(0,0,0,.35) !important;
    font-weight:700 !important;
  }

  /* Kategori kartları */
  .menu-category{
    background:var(--qr-white) !important;
    border-radius:var(--qr-radius-lg) !important;
    box-shadow:var(--qr-shadow-md) !important;
    overflow:hidden !important;
    border:1px solid rgba(0,0,0,.06) !important;
    margin-bottom:var(--qr-spacing-xl) !important;
  }

  .menu-category-title{
    position:relative !important;
    min-height:160px !important;
    display:flex !important;
    align-items:flex-end !important;
    padding:var(--qr-spacing) var(--qr-spacing-xl) !important;
    cursor:pointer !important;
    background:var(--qr-dark) !important;
  }
  .menu-category-title .bg-image{
    position:absolute !important; inset:0 !important;
    opacity:.35 !important;
    filter:saturate(1) contrast(1.05) !important;
  }
  .menu-category-title .title{
    position:relative !important;
    color:#fff !important;
    z-index:2 !important;
    font-size:clamp(1.25rem, 2.2vw, 1.75rem) !important;
    text-shadow:0 4px 18px rgba(0,0,0,.35) !important;
  }
  .menu-category-title.collapse-toggle[aria-expanded="true"]{
    background:linear-gradient(180deg, var(--qr-dark), #000000) !important;
  }

  /* Kategori içerik alanı */
  .menu-category-content{
    padding:var(--qr-spacing-lg) var(--qr-spacing-xl) !important;
    background:var(--qr-white) !important;
  }

  /* Menü item satırı */
  .menu-item.menu-list-item{
    padding:var(--qr-spacing) 0 !important;
    border-bottom:1px dashed rgba(0,0,0,.08) !important;
  }
  .menu-item.menu-list-item:last-child{ border-bottom:0 !important; }

  .menu-item h6{
    font-weight:700 !important;
    letter-spacing:.2px !important;
    font-size:1rem !important;
    color:var(--qr-text) !important;
  }
  .menu-item .text-sm{
    color:var(--qr-muted) !important;
    font-style:normal !important;
    font-size:.95rem !important;
  }

/* --------- Fiyat Rozeti (büyütülmüş) --------- */
  .fiyat{
    display:inline-block !important;
    color:#e54b4b !important;
    font-size:clamp(1.05rem, 1.4vw, 1.25rem) !important; /* Daha büyük ve responsive */
    font-weight:800 !important;
    padding:.35rem .65rem !important;
    background:linear-gradient(180deg,#fff,#fff1f1) !important;
    border:1px solid rgba(229,75,75,.25) !important;
    border-radius:.6rem !important;
    line-height:1 !important;
    letter-spacing:.1px !important;
  }

  /* Mobilde fiyat alta iner ve hizalar */
  @media (max-width:575.98px){
    .menu-item.menu-list-item .row{ align-items:flex-start !important; }
    .menu-item .col-sm-3{
      width:100% !important; min-width:0 !important;
      justify-content:flex-start !important;
      margin-top:.35rem !important;
    }
    .menu-item .text-md{ white-space:normal !important; }
  }

  /* Footer */
  #footer.bg-dark.dark{
    background: linear-gradient(180deg, var(--qr-darker), var(--qr-dark)) !important;
    color: rgba(255,255,255,.9) !important;
    padding-top:var(--qr-spacing-xl) !important;
  }
  #footer .text-muted{ color: rgba(255,255,255,.75) !important; }
  #footer a{ color:#fff !important; opacity:.9 !important; }
  #footer a:hover{ opacity:1 !important; }

  /* Sosyal ikonlar yuvarlak ve yumuşak gölge */
  .icon.icon-social.icon-circle.icon-sm{
    width:38px !important; height:38px !important; line-height:38px !important;
    text-align:center !important; border-radius:999px !important;
    background:rgba(255,255,255,.08) !important;
    box-shadow:var(--qr-shadow-sm) !important;
    margin-right:.35rem !important;
  }

  /* Container daraltma: içerik daha odaklı */
  .page-content .container{ max-width:1050px !important; }

  /* Mobil iyileştirmeler */
  @media (max-width:767px){
    .menu-category-title{
      min-height:120px !important;
      padding:var(--qr-spacing-lg) var(--qr-spacing) !important;
    }
    .menu-category-content{
      padding:var(--qr-spacing) var(--qr-spacing) !important;
    }
    .menu-item .col-sm-3{text-align:right !important;}
    .page-title .text-light{ font-size:1.35rem !important; }
  }

  /* Buton/odak erişilebilirliği (genel) */
  a:focus-visible, button:focus-visible, [role="tab"]:focus-visible{
    outline:3px solid rgba(221,174,113,.55) !important;
    outline-offset:2px !important;
    border-radius:.35rem !important;
  }
  
  /* ==========================
   Page Title – Kurumsal Mini Hero
   ========================== */
.page-title--brand{
  position: relative !important;
  background: linear-gradient(180deg, rgba(28,30,32,.85), rgba(28,30,32,.65)) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
  border: 0 !important;
  padding: clamp(1rem, 3.5vw, 2rem) 0 !important;
  margin: 0 0 1rem 0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.18) !important;
}

/* Üstte header ile yumuşak birleşme efekti */
.page-title--brand::before{
  content:"" !important;
  position:absolute !important; left:0; right:0; top:-14px !important; height:14px !important;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0)) !important;
  pointer-events:none !important;
}

/* Altta kurumsal ayırıcı çizgi */
.page-title--brand::after{
  content:"" !important;
  position:absolute !important; left:0; right:0; bottom:0; height:2px !important;
  background: linear-gradient(90deg, transparent, rgba(221,174,113,.75), transparent) !important;
}

/* İçerik hizası ve kutu */
.page-title__inner{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  text-align:center !important;
  gap:.35rem !important;
}

/* Başlık tipografisi */
.page-title__heading{
  margin:0 !important;
  color:#fff !important;
  font-weight:800 !important;
  font-size: clamp(1.2rem, 2.2vw, 1.75rem) !important;
  letter-spacing:.2px !important;
  text-shadow: 0 3px 12px rgba(0,0,0,.35) !important;
}

/* (Opsiyonel) Alt satır/slogan */
.page-title__sub{
  margin:0 !important;
  color: rgba(255,255,255,.85) !important;
  font-size: clamp(.9rem, 1.4vw, 1rem) !important;
}

/* Eski .page-title.bg-dark davranışını tamamen ezelim */
.page-title.bg-dark{ background: transparent !important; border:0 !important; padding:0 !important; box-shadow:none !important; }


/* ==== Kısa İletişim Şeridi – Temiz ve Tutarlı ==== */
.contact-strip{
  margin: 1rem 0 1.25rem !important;
}
.contact-strip .container{ max-width: 1050px !important; }

/* Kart: açık koyu cam görünümlü, sade */
.cs-card{
  background: rgba(28,30,32,.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 16px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
}
@media (max-width: 991.98px){
  .cs-card{ grid-template-columns: 1fr; }
}

.cs-left{ 
  color: #fff !important; 
  text-align: center !important; /* içindeki tüm metinleri ortalar */
}

.cs-title{
  margin: 0 0 10px 0 !important;
  font-weight: 800 !important;
  font-size: clamp(1.1rem, 1.8vw, 1.35rem) !important;
  letter-spacing: .2px !important;
  color: #fff !important;          /* yazı rengi beyaz kesin */
  text-align: center !important;   /* başlığı ortala */
}



/* --- Eşit ve hizalı butonlar --- */
.cs-actions{
  display: grid;
  grid-template-columns: repeat( auto-fit, minmax(180px, 1fr) );
  gap: 10px;
}

/* Her buton aynı yükseklikte ve içerik ortalı */
.cs-btn{
  height: 48px;
  border-radius: 999px;
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  text-decoration: none;
  color: #fff;
  font-weight: 800;
  letter-spacing: .2px;
  border: 0;
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
  will-change: transform;
}
.cs-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 10px 22px rgba(0,0,0,.3);
}
.cs-ico-wrap{
  width: 28px; height: 28px;
  display: grid; place-items: center;
}
.cs-ico{ width: 20px; height: 20px; }

/* Renk paleti (markalara yakın) */
.cs-btn-phone{ background: linear-gradient(180deg,#e84d4d,#c63c3c); }
.cs-btn-wa   { background: linear-gradient(180deg,#25d366,#128c7e); }
.cs-btn-ys   { background: #ea1d2c; }
.cs-btn-ty   { background: #f27a1a; }

/* --- Harita --- */
.cs-right{ width: 100%; }
.cs-map{
  width: 100%;
  height: 220px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,.3);
  border: 1px solid rgba(255,255,255,.06);
}
.cs-map iframe{ width: 100%; height: 100%; border: 0; display: block; }

/* Küçük ekranlarda butonlar tam genişlik */
@media (max-width: 575.98px){
  .cs-actions{ grid-template-columns: 1fr; }
}
