/* ══════════════════════════════════════════════════════
   KIRIK OKLAVA — QR menü
   Anadolu kilimi: nar kırmızısı, çini laciverdi, safran, krem
   ══════════════════════════════════════════════════════ */

:root{
  --paper:  #F3E9D2;
  --paper-2:#EBDDBE;
  --red:    #A3281D;
  --indigo: #22406B;
  --saffron:#D9982B;
  --ink:    #2A1A12;
  --muted:  rgba(42,26,18,.62);
  --line:   rgba(42,26,18,.16);

  --f-disp: "Fraunces", Georgia, serif;
  --f-body: "Karla", "Helvetica Neue", sans-serif;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100%; }
body{
  margin:0; color:var(--ink); font-family:var(--f-body);
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
  background-color:var(--paper);
  /* kâğıt dokusu */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .22 0 0 0 0 .12 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  padding-bottom:env(safe-area-inset-bottom);
}
img{ max-width:100%; display:block; }
a{ color:inherit; }

/* ── kilim bandı ── */
.kilim{
  height:44px; background:url("kilim.svg") repeat-x left center / auto 44px;
  box-shadow:0 2px 0 rgba(42,26,18,.12);
}

/* ── başlık ── */
.top{ text-align:center; padding:2rem 1.25rem 1.4rem; }
.top__logo{ width:92px; height:92px; margin:0 auto .3rem; }
.top__eyebrow{
  margin:0; font-size:.68rem; font-weight:700; letter-spacing:.3em; text-transform:uppercase;
  color:var(--red);
}
.top__title{
  margin:.35rem 0 0; font-family:var(--f-disp); font-weight:600;
  font-size:clamp(2.6rem, 13vw, 4rem); line-height:1; letter-spacing:-.03em;
  font-variation-settings:"SOFT" 60,"WONK" 1;
}
.top__tag{
  margin:.45rem 0 0; font-family:var(--f-disp); font-style:italic; font-weight:400;
  font-size:1.2rem; color:var(--indigo);
  font-variation-settings:"SOFT" 100,"WONK" 1;
}
.top__lede{ margin:1rem auto 0; max-width:34ch; color:var(--muted); font-size:.95rem; }

/* küçük basamaklı baklava dizisi (bölüm ayracı) */
.top__rule, .sec__mark{ display:flex; justify-content:center; gap:.5rem; margin-top:1.2rem; }
.top__rule i, .sec__mark i{
  width:10px; height:10px; background:var(--red); transform:rotate(45deg);
  box-shadow:0 0 0 2px var(--paper), 0 0 0 3px var(--red);
}
.top__rule i:nth-child(2), .sec__mark i:nth-child(2){ background:var(--indigo); box-shadow:0 0 0 2px var(--paper), 0 0 0 3px var(--indigo); }
.top__rule i:nth-child(3), .sec__mark i:nth-child(3){ background:var(--saffron); box-shadow:0 0 0 2px var(--paper), 0 0 0 3px var(--saffron); }
.top__rule{ gap:.9rem; }

/* ── giriş: menü / site seçimi ── */
.list{ display:none; }
body.is-list .list{ display:block; }
body.is-list .gate{ display:none; }

.gate{ min-height:100vh; min-height:100svh; display:flex; flex-direction:column; }
.gate__in{
  flex:1; display:flex; flex-direction:column; align-items:center; text-align:center;
  width:100%; max-width:460px; margin:0 auto; padding:2rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom));
}
.gate__logo{ width:84px; height:84px; margin-bottom:.3rem; }
.gate__title{
  margin:.35rem 0 0; font-family:var(--f-disp); font-weight:600;
  font-size:clamp(2.5rem, 12vw, 3.4rem); line-height:1; letter-spacing:-.03em;
  font-variation-settings:"SOFT" 60,"WONK" 1;
}
.doors{ display:grid; gap:.9rem; width:100%; margin:2rem 0 1.5rem; }
.door{
  position:relative; display:flex; align-items:flex-end; gap:1rem; overflow:hidden;
  padding:1.2rem 1.25rem; text-align:left; text-decoration:none; color:var(--paper);
  background:var(--indigo); border:2px solid var(--ink);
  box-shadow:5px 5px 0 var(--ink);
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.door:active{ transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink); }
.door--menu{ min-height:210px; background:var(--red); }
.door--menu img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.door--menu::before{ /* fotoğrafın üstünde yazının okunması için */
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(42,26,18,0) 30%, rgba(42,26,18,.85) 100%);
}
.door--site{ background:var(--paper-2); color:var(--ink); }
.door__txt, .door__go{ position:relative; z-index:2; }
.door__txt{ flex:1; }
.door__txt b{
  display:block; font-family:var(--f-disp); font-weight:600; font-size:2rem; line-height:1.05;
  letter-spacing:-.02em; font-variation-settings:"SOFT" 50,"WONK" 1;
}
.door--site .door__txt b{ font-size:1.5rem; }
.door__txt small{ display:block; margin-top:.25rem; font-size:.8rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; opacity:.85; }
.door__go{
  flex:none; display:grid; place-items:center; width:44px; height:44px;
  font-size:1.3rem; background:var(--saffron); color:var(--ink); border:2px solid var(--ink);
}
.gate__tel{
  margin-top:auto; font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--red); text-decoration:none;
}

/* ── menü başlığı (ince) ── */
.top--slim{ position:relative; padding-top:1.4rem; }
.top--slim .top__logo{ width:64px; height:64px; }
.top__back{
  position:absolute; left:1rem; top:1.2rem; display:grid; place-items:center;
  width:42px; height:42px; font-size:1.2rem; text-decoration:none;
  border:1.5px solid var(--ink); background:var(--paper);
}

/* ── kategori şeridi ── */
.chips{
  position:sticky; top:0; z-index:20;
  display:flex; gap:.5rem; overflow-x:auto; scrollbar-width:none;
  padding:.75rem 1rem; padding-left:max(1rem, env(safe-area-inset-left));
  background:rgba(243,233,210,.94); backdrop-filter:blur(10px);
  border-top:1px solid var(--line); border-bottom:2px solid var(--red);
}
.chips::-webkit-scrollbar{ display:none; }
.chip{
  flex:0 0 auto; text-decoration:none; white-space:nowrap;
  font-size:.78rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  padding:.55rem .95rem; border:1.5px solid var(--ink); color:var(--ink);
  transition:background .25s, color .25s, border-color .25s;
}
.chip.is-on{ background:var(--red); border-color:var(--red); color:var(--paper); }

/* ── bölümler ── */
.wrap{ max-width:720px; margin:0 auto; padding:0 1.25rem 2rem; }
.sec{ padding-top:2.6rem; }
.sec__head{ text-align:center; }
.sec__head h2{
  margin:0; font-family:var(--f-disp); font-weight:600;
  font-size:clamp(1.9rem, 8vw, 2.6rem); line-height:1.05; letter-spacing:-.025em;
  font-variation-settings:"SOFT" 50,"WONK" 1;
}
.sec__kicker{
  margin:.4rem 0 0; font-family:var(--f-disp); font-style:italic; font-size:1.02rem; color:var(--red);
  font-variation-settings:"SOFT" 100,"WONK" 1;
}
.sec__note{
  margin:1.3rem 0 0; padding:.85rem 1rem; font-size:.88rem; color:var(--muted);
  background:rgba(34,64,107,.07); border-left:3px solid var(--indigo);
}
.sec__ask{
  margin:1.3rem 0 0; text-align:center; font-size:.8rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--indigo);
}

.items{ list-style:none; margin:1.2rem 0 0; padding:0; }
.item{ padding:.8rem 0; border-bottom:1px dashed var(--line); }
.item:last-child{ border-bottom:0; }
.item__row{ display:flex; align-items:baseline; gap:.6rem; }
.item__name{
  font-family:var(--f-disp); font-weight:600; font-size:1.13rem; line-height:1.25; letter-spacing:-.01em;
  font-variation-settings:"SOFT" 40,"WONK" 1;
}
.item__row::after{ /* isim — fiyat arası noktalı çizgi */
  content:""; order:1; flex:1; min-width:.8rem; align-self:end; margin-bottom:.3em;
  border-bottom:2px dotted rgba(42,26,18,.28);
}
.item__price, .item__ask{ order:2; white-space:nowrap; }
.item__price{
  font-family:var(--f-disp); font-weight:700; font-size:1.15rem; color:var(--red);
  font-variant-numeric:lining-nums tabular-nums;
}
.item__ask{ font-size:.76rem; font-style:italic; color:var(--muted); }
.item__row:not(:has(.item__price, .item__ask))::after{ display:none; }
.item__desc{ margin:.2rem 0 0; font-size:.9rem; color:var(--muted); line-height:1.45; max-width:52ch; }
.item--long .item__desc{ font-size:.88rem; }

/* kategori fotoğrafı */
.sec__hero{
  margin:0 0 1.4rem; aspect-ratio:16/9; overflow:hidden;
  border:2px solid var(--ink); box-shadow:6px 6px 0 var(--red);
}
.sec__hero img{ width:100%; height:100%; object-fit:cover; }

/* fotoğraflı ürün */
.item--pic{ display:flex; gap:.95rem; align-items:center; }
.item__pic{
  flex:none; width:84px; height:84px; padding:0; cursor:zoom-in; overflow:hidden;
  border:2px solid var(--ink); background:var(--paper-2); box-shadow:3px 3px 0 var(--saffron);
}
.item__pic img{ width:100%; height:100%; object-fit:cover; }
.item__body{ flex:1; min-width:0; }

/* fotoğraf büyütme */
.zoom{
  width:min(92vw, 560px); padding:0; border:2px solid var(--ink); background:var(--paper);
  box-shadow:8px 8px 0 var(--red);
}
.zoom::backdrop{ background:rgba(42,26,18,.72); }
.zoom img{ width:100%; aspect-ratio:1; object-fit:cover; }
.zoom p{ margin:0; padding:.8rem 1rem; font-family:var(--f-disp); font-weight:600; font-size:1.2rem; }
.zoom form{ position:absolute; top:.5rem; right:.5rem; }
.zoom__x{
  width:40px; height:40px; font-size:1.5rem; line-height:1; cursor:pointer;
  border:2px solid var(--ink); background:var(--paper); color:var(--ink);
}

/* fiyatsız bölümlerde liste iki sütun (kısa adlar) */
.sec--ask .items{ display:grid; grid-template-columns:1fr; column-gap:2rem; }
@media (min-width:560px){
  .sec--ask .items{ grid-template-columns:1fr 1fr; }
}

/* ── alt bilgi ── */
.foot{ margin-top:2.5rem; background:var(--ink); color:var(--paper); }
.kilim--foot{ box-shadow:none; }
.foot__in{ max-width:720px; margin:0 auto; padding:2.2rem 1.25rem calc(2.4rem + env(safe-area-inset-bottom)); text-align:center; }
.foot__hello{
  margin:0; font-family:var(--f-disp); font-style:italic; font-weight:400; font-size:2rem;
  color:var(--saffron); font-variation-settings:"SOFT" 100,"WONK" 1;
}
.foot__note{ margin:.3rem 0 2rem; font-size:.82rem; color:rgba(243,233,210,.6); }
.foot__cols{ display:grid; gap:1.6rem; text-align:center; }
@media (min-width:640px){ .foot__cols{ grid-template-columns:repeat(3,1fr); text-align:left; } }
.foot__cols b{
  display:block; margin-bottom:.4rem; font-size:.66rem; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--saffron);
}
.foot__cols a{ display:block; text-decoration:none; font-size:.95rem; line-height:1.5; padding:.15rem 0; }
.foot__cols a:hover{ color:var(--saffron); }
.foot__site{
  display:inline-block; margin-top:2rem; font-size:.74rem; letter-spacing:.16em;
  text-transform:uppercase; font-weight:700; color:var(--saffron); text-decoration:none;
  border-bottom:1px solid currentColor; padding-bottom:2px;
}

/* ── açılış ── */
@media (prefers-reduced-motion:no-preference){
  .gate__in > *, .top > *{ opacity:0; transform:translateY(12px); animation:in .8s var(--ease) forwards; }
  .gate__in > *:nth-child(2){ animation-delay:.06s } .gate__in > *:nth-child(3){ animation-delay:.12s }
  .gate__in > *:nth-child(4){ animation-delay:.18s } .gate__in > *:nth-child(5){ animation-delay:.26s }
  .gate__in > *:nth-child(6){ animation-delay:.34s }
  .top > *:nth-child(2){ animation-delay:.08s } .top > *:nth-child(3){ animation-delay:.14s }
  .top > *:nth-child(4){ animation-delay:.2s }  .top > *:nth-child(5){ animation-delay:.26s }
  .top > *:nth-child(6){ animation-delay:.32s } .top > *:nth-child(7){ animation-delay:.38s }
  @keyframes in{ to{ opacity:1; transform:none; } }
}
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

@media print{
  .chips{ display:none; }
  .sec{ break-inside:avoid; }
}