:root{
  --ink:#0B0708; --ink-2:#160B10; --panel:#1B0F14; --panel-2:#22141A;
  --line:#33222A;
  --pink:#FF4FA3; --pink-2:#E6609A; --pink-ink:#3a0f26;
  --cream:#F5ECE3; --muted:#A9958C; --muted-2:#7d6b64;
  --caramel:#D9A868; --cocoa:#8A5230;
  --maxw:1120px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
/* Turkish Lira ₺ (U+20BA) only: Archivo draws it like "Ł", so force this one
   codepoint to a system font. Digits keep using Archivo. */
@font-face{
  font-family:"LiraFix";
  src:local("Segoe UI"), local("Arial"), local("Helvetica Neue"), local("Helvetica");
  unicode-range:U+20BA;
}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ink); color:var(--cream);
  font-family:"Manrope",system-ui,-apple-system,sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* Waffle-grid signature texture, laid under everything */
body::before{
  content:""; position:fixed; inset:-2px; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(rgba(0,0,0,.35) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.35) 1px, transparent 1px);
  background-size:52px 52px,52px 52px,52px 52px,52px 52px;
  background-position:0 0,0 0,1px 1px,1px 1px;
  opacity:.5;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%, #000 40%, transparent 100%);
          mask-image:radial-gradient(120% 90% at 50% 0%, #000 40%, transparent 100%);
}
img{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px; position:relative; z-index:1}

h1,h2,h3{font-family:"Archivo",sans-serif; margin:0; line-height:.98; letter-spacing:-.01em}
.display{font-weight:900; font-stretch:expanded; text-transform:uppercase}
.eyebrow{
  font-family:"Archivo",sans-serif; font-weight:700; text-transform:uppercase;
  letter-spacing:.28em; font-size:.72rem; color:var(--caramel);
  display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before{content:""; width:26px; height:2px; background:var(--caramel); opacity:.7}

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  backdrop-filter:blur(14px) saturate(1.1); -webkit-backdrop-filter:blur(14px) saturate(1.1);
  background:linear-gradient(180deg, rgba(11,7,8,.92), rgba(11,7,8,.66));
  border-bottom:1px solid rgba(255,79,163,.14);
}
.nav .wrap{display:flex; align-items:center; justify-content:space-between; height:64px}
.brand{display:flex; align-items:center; gap:11px; min-width:0}
.brand img{height:38px; width:auto; filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.brand .bn{font-family:"Archivo"; font-weight:900; font-size:.95rem; letter-spacing:.04em; line-height:1}
.brand .bn small{display:block; font-family:"Manrope"; font-weight:600; font-size:.6rem; letter-spacing:.24em; color:var(--pink-2); text-transform:uppercase; margin-top:3px}
.nav-links{display:flex; align-items:center; gap:26px}
.nav-links a.link{font-weight:600; font-size:.9rem; color:var(--muted); transition:color .2s}
.nav-links a.link:hover{color:var(--cream)}
.btn{
  display:inline-flex; align-items:center; gap:.5em; font-family:"Manrope"; font-weight:700;
  font-size:.9rem; padding:.66em 1.15em; border-radius:999px; cursor:pointer; border:0;
  transition:transform .18s var(--ease), box-shadow .25s, background .2s, color .2s;
}
.btn-pink{background:var(--pink); color:#1a0410; box-shadow:0 6px 22px -6px rgba(255,79,163,.7), inset 0 0 0 1px rgba(255,255,255,.15)}
.btn-pink:hover{transform:translateY(-2px); box-shadow:0 12px 30px -8px rgba(255,79,163,.85)}
.btn-ghost{background:rgba(255,255,255,.04); color:var(--cream); box-shadow:inset 0 0 0 1px var(--line)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1px var(--pink); color:#fff}
.nav .btn{padding:.55em 1em; flex-shrink:0}
.nav-links a.link{position:relative}
.nav-links a.link.active{color:var(--pink)}
.tab:focus-visible{outline:2px solid var(--pink); outline-offset:2px}

/* ---------- HERO ---------- */
.hero{position:relative; overflow:hidden; padding:56px 0 44px; isolation:isolate}
.hero::after{ /* pink neon grid glow — behind, centred */
  content:""; position:absolute; z-index:-1; width:680px; height:680px; left:50%; top:-6%;
  transform:translateX(-50%);
  background:radial-gradient(circle, rgba(255,79,163,.30), transparent 62%);
  filter:blur(12px); pointer-events:none;
  animation:glow 6s ease-in-out infinite alternate;
}
@keyframes glow{from{opacity:.5; transform:translateX(-50%) scale(.96)} to{opacity:1; transform:translateX(-50%) scale(1.04)}}
.hero .wrap{position:relative}
.hero-inner{display:grid; grid-template-columns:1fr; gap:32px; align-items:center}
.hero-copy{text-align:center}
.hero h1{
  font-size:clamp(2.9rem,8vw,5.6rem); font-weight:900; font-stretch:expanded;
  text-transform:uppercase; letter-spacing:-.02em; margin:0 0 4px;
  background:linear-gradient(180deg,#fff,#ffd9ec 60%,var(--pink)); -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 0 42px rgba(255,79,163,.25);
}
.hero .tag{font-family:"Archivo"; font-weight:700; font-style:italic; font-size:clamp(1.02rem,3vw,1.45rem); color:var(--pink-2); letter-spacing:.01em; margin-top:6px}
.hero .loc{margin-top:14px; color:var(--muted); font-weight:600; letter-spacing:.02em; font-size:.95rem}
.hero .loc b{color:var(--cream)}
.hero-cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:26px}
.hero-cta .btn{padding:.82em 1.5em; font-size:.98rem}
.hero-media{display:flex; justify-content:center}
.hero-video{
  width:100%; max-width:300px; aspect-ratio:9/16; max-height:440px; object-fit:cover;
  border-radius:20px; border:1px solid rgba(255,79,163,.4); background:#0d0709;
  box-shadow:0 0 0 1px rgba(255,79,163,.14), 0 22px 60px -22px var(--pink), 0 0 46px -10px rgba(255,79,163,.45);
}
@media(min-width:900px){
  .hero{padding:72px 0 56px}
  .hero-inner{grid-template-columns:1.05fr .95fr; gap:48px}
  .hero-copy{text-align:left}
  .hero-copy .hero-cta{justify-content:flex-start}
  .hero-video{max-width:340px; max-height:560px}
}

/* ---------- VALUES ---------- */
.values{position:relative; padding:38px 0 8px}
.seam{height:1px; background:linear-gradient(90deg,transparent,var(--cocoa),var(--caramel),var(--cocoa),transparent); opacity:.55; margin:0 auto; max-width:var(--maxw)}
.val-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:34px}
.val{padding:22px 20px; border-radius:16px; background:linear-gradient(180deg,var(--panel),var(--ink-2)); box-shadow:inset 0 0 0 1px var(--line)}
.val .mk{width:26px; height:26px; border-radius:7px; background:linear-gradient(rgba(255,79,163,.9) 1px,transparent 1px),linear-gradient(90deg,rgba(255,79,163,.9) 1px,transparent 1px),rgba(255,79,163,.12);background-size:9px 9px,9px 9px,100% 100%; box-shadow:inset 0 0 0 1px rgba(255,79,163,.4)}
.val h3{font-size:1.12rem; margin:12px 0 6px; color:var(--cream); font-weight:800; text-transform:none; font-stretch:normal; letter-spacing:0}
.val p{margin:0; color:var(--muted); font-size:.92rem}

/* ---------- SECTION HEAD ---------- */
.sec{padding:66px 0 8px}
.sec-head{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:8px}
.sec-head h2{font-size:clamp(2rem,6vw,3.4rem); font-weight:900; font-stretch:expanded; text-transform:uppercase; color:var(--cream)}
.sec-head h2 em{color:var(--pink); font-style:normal}
.sec-note{color:var(--muted-2); font-size:.82rem; font-weight:600}

/* ---------- MENU ---------- */
.tabs{display:flex; gap:8px; flex-wrap:wrap; margin:26px 0 22px}
.tab{
  font-family:"Archivo"; font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem;
  padding:.6em 1.05em; border-radius:999px; cursor:pointer; border:0; color:var(--muted);
  background:rgba(255,255,255,.03); box-shadow:inset 0 0 0 1px var(--line); transition:all .2s var(--ease);
}
.tab:hover{color:var(--cream)}
.tab.active{color:#1a0410; background:var(--pink); box-shadow:0 6px 20px -8px rgba(255,79,163,.8)}
.menu-panel{display:none; animation:fade .35s var(--ease)}
.menu-panel.active{display:block}
@keyframes fade{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
.menu-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.item{
  position:relative; padding:18px 20px; border-radius:14px;
  background:linear-gradient(180deg,var(--panel),var(--ink-2));
  box-shadow:inset 0 0 0 1px var(--line); transition:box-shadow .25s, transform .2s var(--ease);
}
.item:hover{box-shadow:inset 0 0 0 1px rgba(255,79,163,.5); transform:translateY(-2px)}
.item.feat{box-shadow:inset 0 0 0 1px rgba(255,79,163,.45); background:linear-gradient(180deg,#2a1119,var(--ink-2))}
.item-top{display:flex; align-items:baseline; justify-content:space-between; gap:12px}
.item-name{font-family:"Archivo"; font-weight:800; font-size:1.12rem; color:var(--cream); letter-spacing:.01em; position:relative; display:inline-block}
.item-name::after{content:""; position:absolute; left:0; right:100%; bottom:-3px; height:2px; background:var(--pink); border-radius:2px; transition:right .3s var(--ease); box-shadow:0 0 8px var(--pink)}
.item:hover .item-name::after{right:0}
.badge{font-family:"Manrope"; font-weight:800; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--pink); background:rgba(255,79,163,.12); padding:.28em .6em; border-radius:6px; vertical-align:middle; margin-left:8px}
.price{font-family:"LiraFix", "Archivo", system-ui, "Segoe UI", Arial, sans-serif; font-weight:800; font-size:1.08rem; color:var(--caramel); white-space:nowrap}
.item-desc{margin:8px 0 0; color:var(--muted); font-size:.86rem; line-height:1.5}
.menu-flag{margin-top:6px; color:var(--muted-2); font-size:.78rem; font-weight:600}

/* ---------- GALLERY ---------- */
.gal{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; gap:12px; margin-top:26px}
.gal figure{margin:0; border-radius:14px; overflow:hidden; position:relative; box-shadow:inset 0 0 0 1px var(--line)}
.gal img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease), filter .4s}
.gal figure:hover img{transform:scale(1.06); filter:saturate(1.1)}
.gal .big{grid-column:span 2; grid-row:span 2}
.gal .tall{grid-row:span 2}

/* ---------- LOCATION ---------- */
.loc-wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:26px; align-items:stretch; margin-top:30px}
.loc-photo{border-radius:18px; overflow:hidden; box-shadow:inset 0 0 0 1px var(--line); min-height:340px; background:#000 center/cover}
.loc-card{padding:30px; border-radius:18px; background:linear-gradient(180deg,var(--panel),var(--ink-2)); box-shadow:inset 0 0 0 1px var(--line); display:flex; flex-direction:column; gap:18px}
.loc-row{display:flex; gap:14px; align-items:flex-start}
.loc-ico{flex:none; width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:rgba(255,79,163,.1); box-shadow:inset 0 0 0 1px rgba(255,79,163,.3); color:var(--pink); font-size:1.1rem}
.loc-row .lab{font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted-2); font-weight:700}
.loc-row .val2{color:var(--cream); font-weight:600; font-size:.98rem; line-height:1.4}
.loc-row .val2 span{color:var(--muted); font-weight:500}
.platforms{display:flex; gap:10px; flex-wrap:wrap; margin-top:2px}
.pf{font-weight:700; font-size:.82rem; padding:.6em 1em; border-radius:10px; box-shadow:inset 0 0 0 1px var(--line); background:rgba(255,255,255,.03); transition:all .2s; display:inline-flex; gap:.5em; align-items:center}
.pf:hover{box-shadow:inset 0 0 0 1px var(--pink); transform:translateY(-2px)}
.pf .d{width:8px;height:8px;border-radius:50%}

/* ---------- FOOTER ---------- */
footer{margin-top:80px; border-top:1px solid var(--line); padding:40px 0 46px; position:relative}
.foot{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap}
.foot img{height:52px; filter:drop-shadow(0 4px 14px rgba(0,0,0,.5))}
.foot .fr{text-align:right; color:var(--muted-2); font-size:.82rem}
.foot .fr b{color:var(--pink-2); font-weight:800; letter-spacing:.02em}

/* reveal */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.in{opacity:1; transform:none}

/* ---------- RESPONSIVE ---------- */
@media(max-width:820px){
  .nav-links .link{display:none}
  .val-grid{grid-template-columns:1fr; gap:12px}
  .menu-grid{grid-template-columns:1fr}
  .gal{grid-template-columns:repeat(2,1fr); grid-auto-rows:150px}
  .gal .big{grid-column:span 2; grid-row:span 1}
  .loc-wrap{grid-template-columns:1fr}
}
@media(max-width:480px){
  .nav .wrap{padding:0 14px}
}
@media(max-width:420px){
  .brand .bn{display:none}
}
@media(max-width:360px){
  .nav .btn{font-size:.85rem; padding:.5em .85em}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important}
  .reveal{opacity:1; transform:none; transition:none}
  html{scroll-behavior:auto}
}

/* ---------- ABOUT (Hakkımızda) ---------- */
.about{display:grid; grid-template-columns:1fr; gap:20px; align-items:center; margin-top:44px}
.about+.about{margin-top:56px}
.about-media{border-radius:16px; overflow:hidden; box-shadow:inset 0 0 0 1px var(--line); aspect-ratio:4/3}
.about-media img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease), filter .4s}
.about-media:hover img{transform:scale(1.04); filter:saturate(1.08)}
.about-copy{text-align:left}
.about-copy h3{font-family:"Archivo"; font-size:clamp(1.5rem,4vw,2.1rem); font-weight:900; font-stretch:expanded; text-transform:uppercase; color:var(--cream); margin:10px 0 0; letter-spacing:-.01em; line-height:1.02}
.about-copy p{margin:14px 0 0; color:var(--muted); font-size:.98rem; line-height:1.65}
@media(min-width:900px){
  .about{grid-template-columns:1fr 1fr; gap:44px}
  .about-media{grid-column:1; grid-row:1}
  .about-copy{grid-column:2; grid-row:1}
  .about.rev .about-media{grid-column:2; grid-row:1}
  .about.rev .about-copy{grid-column:1; grid-row:1}
}

/* ---------- MENU FILTER BAR (menu.html) ---------- */
.filterbar{position:sticky; top:64px; z-index:40; padding:12px 0;
  background:linear-gradient(180deg, rgba(11,7,8,.96), rgba(11,7,8,.82));
  backdrop-filter:blur(12px) saturate(1.1); -webkit-backdrop-filter:blur(12px) saturate(1.1);
  border-bottom:1px solid rgba(255,79,163,.12)}
.filterbar .wrap{display:flex; gap:8px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none}
.filterbar .wrap::-webkit-scrollbar{display:none}
.filterbar .tab{flex:none}

/* ---------- MENU CATEGORIES (menu.html) ---------- */
.cat{margin-top:46px}
.cat:first-of-type{margin-top:34px}
.cat h3{font-family:"Archivo"; font-weight:900; font-stretch:expanded; text-transform:uppercase; font-size:clamp(1.3rem,3.5vw,1.85rem); color:var(--cream); margin:0 0 18px; letter-spacing:.01em}
.cat h3 em{color:var(--pink); font-style:normal}
.hidden{display:none !important}

/* dual price (Küçük / Büyük) */
.price2{display:flex;gap:16px;flex:none;text-align:center}
.price2 span{display:flex;flex-direction:column;line-height:1.05}
.price2 b{font-family:"LiraFix", "Archivo", system-ui, "Segoe UI", Arial, sans-serif;font-weight:800;font-size:1.02rem;color:var(--caramel)}
.price2 i{font-style:normal;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin-top:3px}
@media(max-width:480px){.item-top{flex-wrap:wrap}.price2{margin-top:6px;gap:20px}}
