:root{
  --bg:#0a1a24; --bg2:#0f2531; --ink:#f1ebe0; --mute:#9fb0b8; --gold:#c9a96a; --line:rgba(201,169,106,.28);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif; --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){--bg:#f6f1e7;--bg2:#ece4d3;--ink:#13262f;--mute:#5d6e75;--gold:#9a7a38;--line:rgba(154,122,56,.35)}
}
:root[data-theme="dark"]{--bg:#0a1a24;--bg2:#0f2531;--ink:#f1ebe0;--mute:#9fb0b8;--gold:#c9a96a;--line:rgba(201,169,106,.28)}
*{box-sizing:border-box;margin:0}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
body{min-height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:60}

/* Açılış */
#intro{position:fixed;inset:0;z-index:100;background:radial-gradient(120% 90% at 50% 100%,var(--bg2),var(--bg));display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:transform 1.1s cubic-bezier(.77,0,.18,1),opacity .6s .6s}
#intro.out{transform:translateY(-100%);opacity:0;pointer-events:none}
.waves{position:absolute;left:0;right:0;bottom:0;height:42%;overflow:hidden;opacity:.55}
.waves svg{position:absolute;bottom:0;width:200%;height:100%;animation:drift 12s linear infinite}
.waves svg:nth-child(2){animation-duration:18s;animation-direction:reverse;opacity:.6;bottom:-8%}
@keyframes drift{to{transform:translateX(-50%)}}
.mark{width:54px;height:54px;color:var(--gold);opacity:0;animation:rise 1.2s .2s forwards}
.brand{font-family:var(--serif);font-weight:500;font-size:clamp(34px,10vw,64px);letter-spacing:.32em;margin:22px -0.32em 0 0;display:flex}
.brand span{opacity:0;transform:translateY(18px);filter:blur(6px);animation:letter .9s forwards;animation-delay:calc(.5s + var(--i)*.08s)}
.sub{font-size:12px;letter-spacing:.6em;color:var(--gold);margin:14px -.6em 0 0;opacity:0;animation:rise 1s 1.5s forwards;text-transform:uppercase}
.rule{width:0;height:1px;background:var(--gold);margin-top:26px;animation:grow 1.2s 1.7s forwards}
.hint{position:absolute;bottom:calc(14% + env(safe-area-inset-bottom,0px));font-size:11px;letter-spacing:.3em;color:var(--mute);opacity:0;animation:rise 1s 2.4s forwards,pulse 2.4s 3.4s infinite}
@keyframes letter{to{opacity:1;transform:none;filter:none}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes grow{to{width:min(180px,40vw)}}
@keyframes pulse{50%{opacity:.35}}

/* Menü */
header{text-align:center;padding:56px 20px 22px}
header .mark{opacity:1;animation:none;width:34px;height:34px;margin:0 auto}
header h1{font-family:var(--serif);font-weight:500;font-size:30px;letter-spacing:.26em;margin-top:14px;padding-left:.26em}
header p{font-family:var(--serif);font-style:italic;color:var(--mute);font-size:17px;margin-top:6px}
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:6px;overflow-x:auto;padding:0 14px;scrollbar-width:none;position:relative;max-width:760px;margin:0 auto}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;background:none;border:0;color:var(--mute);font:400 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:18px 12px;cursor:pointer;position:relative;transition:color .3s}
.tab::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.tab.on{color:var(--gold)}
.tab.on::after{transform:scaleX(1)}
main{max-width:640px;margin:0 auto;padding:34px 22px 80px;min-height:70vh}
.cat-title{font-family:var(--serif);font-size:34px;font-weight:500;text-align:center}
.cat-note{text-align:center;color:var(--mute);font-family:var(--serif);font-style:italic;font-size:16px;margin:4px 0 34px}
.item{padding:18px 0;opacity:0;transform:translateY(14px);animation:rise .7s forwards;animation-delay:calc(var(--i)*.08s)}
.row{display:flex;align-items:baseline;gap:10px}
.name{font-family:var(--serif);font-size:22px;font-weight:500}
.dots{flex:1;border-bottom:1px dotted var(--line);transform:translateY(-4px)}
.price{font-family:var(--serif);font-size:21px;color:var(--gold);font-weight:500;white-space:nowrap}
.desc{color:var(--mute);font-size:14px;line-height:1.6;margin-top:4px;max-width:90%}
.tag{display:inline-block;font-size:10px;letter-spacing:.2em;color:var(--gold);border:1px solid var(--line);padding:2px 8px;margin-left:8px;text-transform:uppercase;vertical-align:middle}
footer{text-align:center;padding:30px 20px 50px;color:var(--mute);font-size:12px;letter-spacing:.2em;border-top:1px solid var(--line)}
footer b{color:var(--gold);font-weight:400}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01s!important;animation-delay:0s!important;transition-duration:.01s!important}}