:root{--accent:#c2410c;--on-accent:#fff;--green:#1f3b2d;--terra:#c2410c;--cream:#fbf5ea;--ink:#21180f;--muted:#6f6355;--gold:#d9a441}
body{font-family:Karla,system-ui,sans-serif;color:var(--ink);background:#fff}
h1,h2,.logo,.price{font-family:"DM Serif Display",serif;font-weight:400;line-height:1.02}
h1{font-size:clamp(50px,7vw,104px);margin:8px 0 18px}h1 em,h2 em,.logo em{color:var(--terra)}
h2{font-size:clamp(34px,4.4vw,58px);margin-bottom:24px}
.script,.sign{font-family:Caveat,cursive;font-size:32px;color:var(--terra)}
.kick{font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:12px;color:var(--terra);margin-bottom:10px}
.muted{color:var(--muted);font-size:18px}
.btn{display:inline-block;background:var(--terra);color:#fff;padding:16px 30px;border-radius:4px;text-decoration:none;font-weight:700;letter-spacing:.04em;border:2px solid var(--terra);transition:.2s}
.btn:hover{background:var(--ink);border-color:var(--ink)}.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}.btn-full{width:100%;margin-top:14px}
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid #eee}
.top-in{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{font-size:34px;text-decoration:none;display:flex;flex-direction:column;line-height:.9}.logo small{font:700 9px Karla;letter-spacing:.3em;color:var(--muted);margin-top:4px}
nav{display:flex;gap:30px}nav a{text-decoration:none;font-weight:500}nav a:hover{color:var(--terra)}
.top-r{display:flex;gap:10px;align-items:center}.burger{display:none;background:none;border:0;font-size:24px}
.hero{position:relative;overflow:hidden;background:var(--cream);padding:80px 0 0}
.hero-in{position:relative;z-index:2;padding-bottom:110px;max-width:1160px}.hero-in>*{max-width:620px}
.lead{font-size:20px;color:var(--muted)}.btns{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.hero-bg{position:absolute;right:-120px;top:40px;width:640px;height:640px}
.plate{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#fff 0 56%,#f0e6d6 57% 62%,#fff 63%);box-shadow:0 40px 80px rgba(33,24,15,.18);animation:spin 60s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pasta{position:absolute;inset:22%;border-radius:50%;background:repeating-radial-gradient(circle at 50% 50%,#f3c86b 0 6px,#e8b14e 6px 9px,#f7d58a 9px 13px);box-shadow:inset 0 0 40px rgba(194,65,12,.5)}
.pasta::after{content:"";position:absolute;inset:25%;border-radius:50%;background:radial-gradient(circle,#c2410c,#a3330a 60%,transparent 70%);opacity:.85}
.basil{position:absolute;width:70px;height:40px;background:#3f7d3a;border-radius:0 100% 0 100%}.b1{left:38%;top:30%;transform:rotate(-20deg)}.b2{left:52%;top:52%;transform:rotate(40deg);background:#2f6b2c}
.tom{position:absolute;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff7a59,#c81e1e)}.t1{left:30%;top:56%}.t2{left:60%;top:34%}.t3{left:46%;top:66%}
.ticker{position:relative;z-index:2;background:var(--green);color:var(--cream);overflow:hidden;white-space:nowrap;padding:14px 0}
.tk{display:inline-block;padding-left:100%;animation:tick 28s linear infinite;font-weight:700;letter-spacing:.08em}@keyframes tick{to{transform:translateX(-100%)}}
.sec{padding:100px 0}.sec-cream{background:var(--cream)}.sec-green{background:var(--green);color:var(--cream)}.sec-green .kick{color:var(--gold)}.sec-dark{background:var(--ink);color:var(--cream)}.sec-dark .kick{color:var(--gold)}
.today{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.chalk{background:#2b2b2b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Crect width='1' height='1' fill='%23ffffff10'/%3E%3C/svg%3E");color:#f6f1e7;padding:46px;border-radius:10px;border:14px solid #8b5e34;box-shadow:0 30px 60px rgba(0,0,0,.25);transform:rotate(-1.5deg)}
.chalk .script{color:#ffd27a}.chalk h2{font-size:44px;margin:6px 0 12px}.chalk p{opacity:.85;font-size:18px}.chalk .price{font-size:48px;color:#ffd27a;margin-top:14px}
.menu-bar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:30px;position:sticky;top:78px;background:var(--cream);padding:12px 0;z-index:5}
.cats,.filters{display:flex;gap:8px;flex-wrap:wrap}
.cats button,.filters button{border:1px solid #d8ccb9;background:#fff;padding:10px 18px;border-radius:999px;font-weight:700;color:var(--ink)}
.cats button.on{background:var(--ink);color:#fff;border-color:var(--ink)}.filters button.on{background:var(--green);color:#fff;border-color:var(--green)}
.menu{display:grid;grid-template-columns:1fr 1fr;gap:6px 50px}
.dish{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:start;padding:20px 0;border-bottom:1px dashed #d8ccb9;transition:opacity .3s}
.dish h3{font:400 24px "DM Serif Display"}.dish p{color:var(--muted);font-size:15px}.dish .tags{font-size:14px;margin-left:6px}
.dish .pr{font:400 24px "DM Serif Display";color:var(--terra)}
.dish .add{width:36px;height:36px;border-radius:50%;border:2px solid var(--terra);background:#fff;color:var(--terra);font-size:20px;font-weight:700;line-height:1}
.dish .add:hover{background:var(--terra);color:#fff}
.cart{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(140px);background:var(--ink);color:#fff;padding:14px 18px 14px 24px;border-radius:999px;display:flex;gap:18px;align-items:center;z-index:60;transition:.4s;box-shadow:0 20px 40px rgba(0,0,0,.3)}
.cart.show{transform:translateX(-50%)}.cart button{background:#ffffff22;border:0;color:#fff;padding:8px 14px;border-radius:999px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}.sec-green p{font-size:18px;opacity:.85}
.occ{margin-top:34px;background:#ffffff10;border-radius:16px;padding:20px}.occ span{font-size:14px;opacity:.8}
.occ-bars{display:flex;align-items:flex-end;gap:6px;height:110px;margin-top:12px}
.occ-bars div{flex:1;background:#ffffff30;border-radius:6px 6px 0 0;position:relative}.occ-bars div.hi{background:var(--gold)}.occ-bars div.now{background:#ff7a59}
.occ-bars small{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:11px;opacity:.7}
.res{background:var(--cream);color:var(--ink);padding:34px;border-radius:8px;display:flex;flex-direction:column;gap:10px;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.res label{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:8px;display:block;margin-bottom:6px}
.res input,.res select{width:100%;padding:14px;border:1px solid #d8ccb9;border-radius:4px;font:inherit;background:#fff}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ppl,.zones{display:flex;gap:6px;flex-wrap:wrap}.ppl button,.zones button{border:1px solid #d8ccb9;background:#fff;min-width:46px;padding:11px 12px;border-radius:4px;font-weight:700}
.ppl button.on,.zones button.on{background:var(--terra);color:#fff;border-color:var(--terra)}
.story{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.frame{aspect-ratio:4/5;background:linear-gradient(160deg,#d9b38c,#8b5e34 60%,#3b2a1a);border:14px solid #fff;box-shadow:0 30px 60px rgba(33,24,15,.25);transform:rotate(2deg);position:relative;filter:sepia(.4)}
.frame span{position:absolute;bottom:-50px;left:0;font-family:Caveat;font-size:26px;color:var(--muted)}
.sign{font-size:52px;margin-top:20px}
.extras{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.extras span{background:#ffffff14;padding:8px 14px;border-radius:999px;font-size:14px}
.hours{width:100%;border-collapse:collapse;font-size:17px}.hours td{padding:12px 0;border-bottom:1px solid #ffffff20}.hours td:last-child{text-align:right}.hours tr.today td{color:var(--gold);font-weight:700}
.foot{padding:26px 0;color:var(--muted);font-size:14px}
@media(max-width:900px){nav{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;flex-direction:column;padding:20px;gap:14px}nav.open{display:flex}.burger{display:block}
.hero-bg{width:380px;height:380px;right:-160px;top:10px;opacity:.5}.today,.two,.story,.menu{grid-template-columns:1fr}.sec{padding:70px 0}.menu-bar{position:static}}

/* v10: echte Bilder */
.hero{min-height:640px}
.hero-photo{position:absolute;top:0;right:0;bottom:0;width:58%;z-index:1;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
.hero-photo picture,.hero-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.frame{filter:none;background:#3b2a1a}
.frame picture,.frame img{display:block;width:100%;height:100%;object-fit:cover}
.frame span{bottom:-46px}
.gal-sec{background:#fff}
.tgal{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:290px 290px;gap:16px}
.tg{position:relative;margin:0;overflow:hidden;border-radius:6px;background:var(--ink)}
.tg1{grid-row:span 2}.tg4{grid-column:span 2}
.tg picture,.tg img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s}
.tg:hover img{transform:scale(1.04)}
.tg figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 14px;background:linear-gradient(transparent,rgba(33,24,15,.78));color:#fff;font-family:Caveat,cursive;font-size:30px;line-height:1}
@media(max-width:900px){.hero{padding-top:0;min-height:0}.hero-photo{position:relative;width:100%;height:280px;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);mask-image:linear-gradient(180deg,#000 60%,transparent)}.hero-in{padding-top:4px}
.tgal{grid-template-columns:1fr 1fr;grid-template-rows:280px 170px 200px}.tg1{grid-row:auto;grid-column:span 2}.tg4{grid-column:span 2}.tg figcaption{font-size:24px}}
@media(min-width:901px){.hero-photo{width:54%}}