/* =====================================================================
   Kahve Çekirdeği · QR menü
   Telefon için: koyu kavrum zemin, pirinç çizgiler, altta sabit çubuk.
   ===================================================================== */
:root{
  --kavrum:#1E1510;
  --panel:#2A1D15;
  --panel-2:#33241A;
  --krem:#F6EFE3;
  --krem-2:#D9CCBA;
  --pirinc:#D4A359;
  --accent:#62720B;
  --accent-2:#7C9010;
  --cizgi:rgba(212,163,89,.22);
  --display:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif;
  --govde:"Hanken Grotesk","Segoe UI",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--kavrum);color:var(--krem);font-family:var(--govde);line-height:1.5;
  -webkit-font-smoothing:antialiased;padding-bottom:calc(74px + env(safe-area-inset-bottom,0px))}
img{max-width:100%}
a{color:inherit;text-decoration:none}
.sr-yazi{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- üst çubuk (alt çubukla aynı koyu yeşil #203318: logodaki zeytin yeşilinin koyusu) ---- */
.qr-ust{position:sticky;top:0;z-index:20;background:rgba(32,51,24,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--cizgi)}
.qr-ust-ic{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px clamp(14px,4vw,24px)}
/* şube şeridi: hangi şubenin menüsü, dokununca şube seçimi */
.qr-sube-serit{display:flex;align-items:center;gap:8px;min-height:36px;padding:6px clamp(14px,4vw,24px);
  border-top:1px solid rgba(212,163,89,.14);font-size:.88rem;color:var(--krem-2)}
.qr-sube-serit svg{flex:none;width:16px;height:16px;color:var(--pirinc)}
.qr-sube-serit span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qr-sube-serit b{font-weight:500;color:var(--krem)}
.qr-sube-serit em{flex:none;margin-left:auto;font-style:normal;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--pirinc)}
.qr-sube-serit:hover em{text-decoration:underline}
.qr-marka{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;letter-spacing:-.01em;font-size:1.02rem}
.qr-marka img{width:36px;height:36px;border-radius:50%;background:var(--krem);padding:3px}
.qr-ust-site{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--pirinc);
  border:1px solid var(--cizgi);border-radius:999px;padding:7px 12px}
.qr-ust-site:hover{border-color:var(--pirinc)}

/* ---- kapak ---- */
.qr-kapak{position:relative;min-height:clamp(200px,38vh,320px);display:flex;align-items:flex-end;
  background:var(--panel) center/cover no-repeat}
.qr-kapak::after{content:"";position:absolute;inset:0;
  background:linear-gradient(rgba(20,14,10,.3) 0%,rgba(20,14,10,.55) 45%,rgba(20,14,10,.96) 100%)}
.qr-kapak-ic{position:relative;z-index:1;padding:clamp(18px,5vw,30px)}
.qr-etiket{display:block;font-family:var(--mono);font-weight:500;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--pirinc)}
.qr-kapak h1{margin:8px 0 0;font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.05;
  font-size:clamp(1.9rem,8vw,2.6rem)}
.qr-kapak p{margin:6px 0 0;color:var(--krem-2)}
.qr-instagram{display:inline-flex;margin-top:12px;padding:8px 14px;border:1px solid var(--cizgi);border-radius:999px;
  font-size:.92rem;color:var(--krem-2)}
.qr-instagram:hover{border-color:var(--pirinc);color:var(--krem)}

/* ---- bölüm ---- */
.qr-bolum{padding:clamp(20px,5vw,30px) clamp(14px,4vw,24px) 30px;max-width:720px;margin:0 auto}
.qr-bolum > h2{margin:6px 0 0;font-family:var(--display);font-weight:700;letter-spacing:-.02em;font-size:clamp(1.4rem,5.4vw,1.9rem)}
.qr-bas{display:flex;align-items:flex-start;gap:12px}
.qr-bas h1{margin:4px 0 0;font-family:var(--display);font-weight:700;letter-spacing:-.02em;font-size:clamp(1.5rem,6vw,2.1rem);line-height:1.1}
.qr-bas-not{margin:6px 0 0;color:var(--krem-2);font-size:.95rem}
.qr-geri{flex:none;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--cizgi);border-radius:50%;color:var(--pirinc)}
.qr-geri:hover{border-color:var(--pirinc);background:rgba(212,163,89,.08)}
.qr-geri svg{width:20px;height:20px}

/* ---- arama ---- */
.qr-ara{position:relative;display:flex;align-items:center;margin-top:16px}
.qr-ara svg{position:absolute;left:14px;width:20px;height:20px;color:var(--krem-2);pointer-events:none}
.qr-ara input{width:100%;min-height:50px;padding:12px 16px 12px 44px;border-radius:14px;border:1px solid var(--cizgi);
  background:var(--panel);color:var(--krem);font:1rem var(--govde)}
.qr-ara input::placeholder{color:#9C8B78}
.qr-ara input:focus{outline:none;border-color:var(--pirinc);box-shadow:0 0 0 3px rgba(212,163,89,.18)}

/* ---- kategori kartları ---- */
/* dikey kartlar (bölüm fotoğrafları 3:4): telefonda ikişer, tek kalan ortada; genişte üçer */
.qr-kategoriler{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:520px){.qr-kategoriler{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:519.98px){.qr-kategoriler > li:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;width:calc((100% - 12px) / 2)}}
.qr-kart{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:3/4;padding:clamp(12px,3.4vw,16px);overflow:hidden;
  border:1px solid var(--cizgi);border-radius:16px;background:var(--panel) center/cover no-repeat;
  transition:transform .25s var(--ease),border-color .25s}
.qr-kart.gorselsiz{background:radial-gradient(circle at 50% 36%,#3B2A1E,var(--panel) 70%)}
.qr-kart:hover,.qr-kart:focus-visible{transform:translateY(-2px);border-color:var(--pirinc)}
.qr-kart-bos{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:30%}
.qr-kart-bos img{width:clamp(44px,14vw,64px);height:auto;border-radius:50%;background:var(--krem);padding:3px;opacity:.5}
.qr-kart-ad{position:relative;font-family:var(--display);font-weight:700;font-size:clamp(1.05rem,4.6vw,1.3rem);line-height:1.15;
  text-shadow:0 1px 10px rgba(0,0,0,.6)}
.qr-kart-alt{position:relative;margin-top:4px;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--pirinc)}

/* ---- şube seçimi ---- */
.qr-uyari{margin:14px 0 0;padding:11px 14px;border-radius:12px;border:1px solid rgba(212,163,89,.4);background:rgba(212,163,89,.1);color:var(--krem)}
.qr-subeler{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.qr-sube-kart{display:flex;align-items:center;gap:14px;min-height:72px;padding:14px 16px;border:1px solid var(--cizgi);border-radius:16px;
  background:var(--panel);transition:border-color .2s,background-color .2s}
.qr-sube-kart:hover,.qr-sube-kart:focus-visible{border-color:var(--pirinc);background:var(--panel-2)}
.qr-sube-kart[aria-current="true"]{border-color:var(--pirinc);box-shadow:inset 0 0 0 1px var(--pirinc)}
.qr-sube-kart > svg:first-child{flex:none;width:26px;height:26px;color:var(--pirinc)}
.qr-sube-yazi{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.qr-sube-yazi b{font-family:var(--display);font-weight:700;font-size:1.08rem;line-height:1.2}
.qr-sube-yazi small{color:var(--krem-2);font-size:.85rem;line-height:1.35}
.qr-sube-ok{flex:none;width:20px;height:20px;color:var(--krem-2)}

/* ---- ürün ızgarası: görselin üstünde ad ve fiyat, üçerli ---- */
.qr-izgara{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2.4vw,14px)}
.qr-karo{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;border-radius:14px;border:1px solid var(--cizgi);
  background:var(--panel-2);transition:transform .25s var(--ease),border-color .25s}
.qr-karo:hover{transform:translateY(-2px);border-color:var(--pirinc)}
.qr-karo:focus-visible{outline:2px solid var(--pirinc);outline-offset:2px}
.qr-karo > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.qr-karo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,rgba(20,14,10,0) 40%,rgba(20,14,10,.6) 66%,rgba(20,14,10,.95) 100%)}
.qr-karo-bos{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:30%;
  background:radial-gradient(circle at 50% 36%,#3B2A1E,var(--panel) 70%)}
.qr-karo-bos img{width:clamp(34px,11vw,54px);height:auto;border-radius:50%;background:var(--krem);padding:3px;opacity:.5}
.qr-karo-yazi{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:3px;
  padding:clamp(7px,2vw,12px);text-shadow:0 1px 10px rgba(0,0,0,.6)}
.qr-karo-yazi b{font-family:var(--display);font-weight:700;letter-spacing:-.01em;line-height:1.15;color:var(--krem);
  font-size:clamp(.8rem,3.4vw,1.04rem);overflow-wrap:break-word;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.qr-karo-fiyat{font-family:var(--display);font-weight:700;font-size:clamp(.78rem,3vw,.96rem);color:var(--pirinc);line-height:1.2}
.qr-karo-fiyat small{font-family:var(--mono);font-weight:500;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--krem-2)}
.qr-sonuc-yok,.qr-bos-not{margin:18px 0 0;color:var(--krem-2)}

/* ---- ürün sayfası ---- */
.qr-detay .qr-bas{align-items:center}
.qr-detay-bolum{padding:6px 0}
.qr-detay-bolum:hover{color:var(--krem)}
.qr-detay-gorsel{margin:16px 0 0;display:flex;justify-content:center;overflow:hidden;border-radius:18px;
  border:1px solid var(--cizgi);background:var(--panel)}
.qr-detay-gorsel img{display:block;width:100%;height:auto;max-height:min(74vh,780px);object-fit:contain}
.qr-detay-bas{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;margin-top:18px}
.qr-detay-bas h1{margin:0;font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.08;font-size:clamp(1.7rem,7.2vw,2.5rem)}
.qr-detay-fiyat{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(1.35rem,5.6vw,1.75rem);color:var(--pirinc);white-space:nowrap}
.qr-detay-fiyat small{font-family:var(--mono);font-weight:500;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--krem-2)}
.qr-detay-kutu{margin-top:14px;padding:16px 18px;border:1px solid var(--cizgi);border-radius:16px;background:var(--panel)}
.qr-detay-kutu h2{margin:0 0 8px;font-family:var(--mono);font-weight:500;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--pirinc)}
.qr-detay-kutu p{margin:0;line-height:1.6}
.qr-detay-kutu .qr-detay-not{margin-top:10px;color:var(--krem-2);font-size:.88rem}
.qr-alerjen-liste{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.qr-alerjen-liste li{padding:6px 13px;border-radius:999px;border:1px solid rgba(212,163,89,.5);background:rgba(212,163,89,.1);font-size:.93rem}
.qr-detay-kalori p{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px}
.qr-detay-kalori b{font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1}
.qr-detay-kalori span{color:var(--krem-2);font-size:.9rem}
.qr-detay-diger{margin-top:28px;padding-top:20px;border-top:1px solid var(--cizgi)}
.qr-detay-diger h2{margin:0;font-family:var(--display);font-weight:700;letter-spacing:-.01em;font-size:clamp(1.15rem,4.6vw,1.4rem)}
.qr-detay-tumu{margin:16px 0 0}
.qr-detay-tumu a{color:var(--pirinc);border-bottom:1px solid rgba(212,163,89,.4)}
@media (min-width:900px){
  .qr-detay.gorselli{max-width:1080px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;align-items:start}
  .qr-detay.gorselli > .qr-bas,.qr-detay.gorselli > .qr-detay-diger{grid-column:1 / -1}
  .qr-detay.gorselli > .qr-detay-gorsel{grid-column:1;grid-row:2 / span 6;align-self:start;position:sticky;top:76px}
  .qr-detay.gorselli > .qr-detay-gorsel img{max-height:calc(100vh - 180px)}
  .qr-detay.gorselli > .qr-detay-bas,.qr-detay.gorselli > .qr-detay-kutu{grid-column:2}
  .qr-detay.gorselli > .qr-detay-bas{margin-top:16px}
  .qr-detay.gorselli .qr-detay-diger .qr-izgara{grid-template-columns:repeat(6,minmax(0,1fr))}
}

/* ---- diğer bölümler ---- */
.qr-diger{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;padding-top:18px;border-top:1px solid var(--cizgi)}
.qr-diger a{padding:9px 14px;border:1px solid var(--cizgi);border-radius:999px;font-size:.92rem;color:var(--krem-2)}
.qr-diger a:hover{border-color:var(--pirinc);color:var(--krem)}

/* ---- boş menü ---- */
.qr-bos{padding:clamp(28px,8vw,56px) clamp(14px,4vw,24px);max-width:720px;margin:0 auto}
.qr-bos h2{margin:0;font-family:var(--display);font-weight:700;font-size:1.5rem}
.qr-bos p{color:var(--krem-2)}
.qr-bos a{color:var(--pirinc)}

/* ---- alt çubuk ---- */
.qr-yapimci{margin:26px 0 0;padding:0 18px;text-align:center;font-size:.76rem;letter-spacing:.04em;opacity:.55}
.qr-yapimci a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.qr-alt{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(32,51,24,.97);backdrop-filter:blur(10px);border-top:1px solid var(--cizgi);
  padding-bottom:env(safe-area-inset-bottom,0px)}
.qr-alt a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:66px;
  color:var(--krem-2);font-size:.76rem}
.qr-alt svg{width:22px;height:22px}
.qr-alt a:hover{color:var(--krem)}
.qr-alt a[aria-current="page"]{color:var(--pirinc)}
.qr-alt a[aria-current="page"]::before{content:"";position:absolute;top:0;left:50%;width:28px;height:3px;margin-left:-14px;
  border-radius:0 0 3px 3px;background:var(--pirinc)}

@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important}}