diff --git a/README.md b/README.md new file mode 100644 index 0000000..8b951f3 --- /dev/null +++ b/README.md @@ -0,0 +1,33 @@ +# Chickago Boys – Website + +Statische Website für **Chickago Boys Fried Chicken & Burger**, Merkurstraße 13, 67663 Kaiserslautern. +Preview: https://chickago-boys.project.webklar.com (Deploy über den Org-Webhook bei jedem Push auf `main`). + +## Aufbau + +| Datei | Inhalt | +|---|---| +| `index.html` | Startseite: Hero „Knockout“, Favoriten, Wings, Buckets, Take away, Besuch/Öffnungszeiten, CTA | +| `speisekarte.html` | Komplette Karte mit Preisen (Kategorien-Navigation, Karten mit freigestellten Fotos) | +| `impressum.html`, `datenschutz.html` | **Entwürfe** mit gelb markierten Platzhaltern | +| `assets/css/style.css` | Design-System (Farben, Typo, Komponenten) | +| `assets/js/main.js` | Öffnungsstatus, Menü, Animationen (GSAP + ScrollTrigger, Lenis) | +| `assets/img/` | Logo als Vektor (`rooster.svg`, `wordmark.svg`), Food-Freisteller `cut-*.webp`, Fotos `foto-*.webp` | +| `assets/fonts/` | Anton, Titan One, Archivo – lokal eingebunden (keine Google-Verbindung) | + +Kein Build-Schritt, keine Cookies, keine Tracker, keine externen Einbindungen. Karten, Instagram und Lieferando sind nur verlinkt. + +## Design + +Inspiration: cravburgers.shop (Konzeptseite der Agentur Anyflow). Übernommen wurden nur die Prinzipien: riesige umrandete Headlines, Farbflächen mit Wellen, Sticker, Freisteller, Wort-Pop-Animationen. Farben, Schriften und Maskottchen sind eigene: der Boxer-Hahn aus dem Chickago-Boys-Logo, Konzept „Fight Night“. + +## Offen vor dem Livegang (vom Kunden bestätigen) + +- Inhaber bzw. Rechtsform, E-Mail und USt-IdNr. für Impressum und Datenschutz +- Öffnungszeiten: aktuell „täglich 12–22 Uhr“ laut Google; ältere Einträge nennen einen Ruhetag am Montag +- Preise: übernommen aus der Lieferando-Karte vom 30.09.2026, im Restaurant eventuell abweichend +- Rechte an den Speisenfotos und Logo als Originaldatei (die Fotos stammen aus dem Lieferando-Eintrag) +- Allergen- und Zusatzstoffliste +- Domain: `chickagoboys.de` leitet heute auf Lieferando weiter +- `og:image` auf eine absolute URL umstellen, sobald die Domain feststeht +- Optional: englische Version für die US-Community (KMC) diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100644 index 0000000..202ed70 --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1,796 @@ +@font-face { + font-family: 'Anton'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url(../fonts/anton-latin.woff2) format('woff2'); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} +@font-face { + font-family: 'Archivo'; + font-style: normal; + font-weight: 400 800; + font-stretch: 100%; + font-display: swap; + src: url(../fonts/archivo-latin.woff2) format('woff2'); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} +@font-face { + font-family: 'Titan One'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url(../fonts/titan-one-latin.woff2) format('woff2'); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} + +/* ============ Tokens ============ */ +:root { + --cream: #f7ebd9; + --cream-2: #efdcc0; + --red: #e0140e; + --red-deep: #b30d0a; + --comb: #8e0a0c; + --yellow: #ffd21f; + --yellow-2: #f5b400; + --skin: #f7d7b7; + --ink: #150d0c; + --ink-2: #2a1d1b; + --white: #fff; + + --f-display: "Anton", "Impact", "Arial Narrow", sans-serif; + --f-sticker: "Titan One", "Arial Black", sans-serif; + --f-body: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif; + + --gutter: clamp(1rem, 3.2vw, 3rem); + --radius: clamp(18px, 2vw, 30px); + --shadow: 0 18px 40px rgba(21, 13, 12, .18); + --ease-pop: cubic-bezier(.34, 1.56, .64, 1); + --nav-h: 76px; +} + +/* ============ Base ============ */ +*, *::before, *::after { box-sizing: border-box; } +html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--nav-h) + 12px); } +html.lenis, html.lenis body { height: auto; } +.lenis.lenis-smooth { scroll-behavior: auto !important; } +html, body { overflow-x: clip; } +body { + margin: 0; + background: var(--cream); + color: var(--ink); + font-family: var(--f-body); + font-size: clamp(1rem, .95rem + .3vw, 1.15rem); + line-height: 1.55; + overflow-x: hidden; + -webkit-font-smoothing: antialiased; +} +img, svg { display: block; max-width: 100%; height: auto; } +a { color: inherit; } +button { font: inherit; color: inherit; } +p { margin: 0 0 1em; } +p:last-child { margin-bottom: 0; } +::selection { background: var(--yellow); color: var(--ink); } + +:focus-visible { + outline: 3px solid var(--ink); + outline-offset: 3px; + box-shadow: 0 0 0 6px var(--white); + border-radius: 6px; +} +.on-dark :focus-visible, .on-red :focus-visible { outline-color: var(--yellow); box-shadow: 0 0 0 6px var(--ink); } + +.sr-only { + position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; + overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; +} +.skip-link { + position: fixed; left: 1rem; top: -100px; z-index: 2000; + background: var(--ink); color: var(--cream); padding: .75rem 1.1rem; border-radius: 999px; + font-weight: 700; text-decoration: none; transition: top .2s; +} +.skip-link:focus { top: 1rem; } + +/* ============ Typography ============ */ +.display { + font-family: var(--f-display); + font-weight: 400; + text-transform: uppercase; + line-height: .86; + letter-spacing: .004em; + margin: 0; +} +.stroke { -webkit-text-stroke: var(--sw, .075em) var(--stroke-c, var(--white)); paint-order: stroke fill; } +.stroke--ink { --stroke-c: var(--ink); } +.stroke--red { --stroke-c: var(--red); } + +.h2 { font-size: clamp(3.4rem, 11.5vw, 11rem); color: var(--red); } +.display.h2 { margin-bottom: .22em; } +.h2--sm { font-size: clamp(3rem, 8.5vw, 8rem); } +.lead { font-size: clamp(1.08rem, 1rem + .45vw, 1.35rem); max-width: 36ch; } +.lead strong { font-weight: 800; } + +.kicker { + display: inline-block; + font-family: var(--f-sticker); + font-size: clamp(1rem, .8rem + 1vw, 1.7rem); + text-transform: uppercase; + line-height: 1; + color: var(--red); + -webkit-text-stroke: .22em var(--white); + paint-order: stroke fill; + transform: rotate(-5deg); + margin-bottom: .55em; + letter-spacing: .01em; +} +.kicker--yellow { color: var(--yellow); -webkit-text-stroke-color: var(--ink); } +.kicker--ink { color: var(--ink); -webkit-text-stroke-color: var(--yellow); } + +/* ============ Buttons ============ */ +.btn { + --bg: var(--red); --fg: var(--white); --bd: var(--white); + position: relative; + display: inline-flex; align-items: center; justify-content: center; gap: .55em; + font-family: var(--f-sticker); + text-transform: uppercase; + font-size: clamp(1rem, .9rem + .5vw, 1.35rem); + line-height: 1; + letter-spacing: .02em; + color: var(--fg); + background: var(--bg); + border: 4px solid var(--bd); + padding: 1em 1.7em 1.05em; + border-radius: 58% 42% 55% 45% / 55% 48% 52% 45%; + text-decoration: none; + cursor: pointer; + box-shadow: 0 10px 22px rgba(21, 13, 12, .22); + transition: border-radius .5s var(--ease-pop), transform .35s var(--ease-pop), background-color .2s, color .2s; + white-space: nowrap; +} +.btn:hover { border-radius: 42% 58% 45% 55% / 48% 55% 45% 52%; transform: rotate(-2deg) scale(1.05); } +.btn:active { transform: scale(.97); } +.btn svg { width: 1.1em; height: 1.1em; flex: none; } +.btn--yellow { --bg: var(--yellow); --fg: var(--ink); --bd: var(--ink); } +.btn--ink { --bg: var(--ink); --fg: var(--cream); --bd: var(--cream); } +.btn--ghost { --bg: transparent; --fg: var(--ink); --bd: var(--ink); box-shadow: none; } +.on-dark .btn--ghost, .on-red .btn--ghost { --fg: var(--cream); --bd: var(--cream); } + +.pill { + display: inline-flex; align-items: center; gap: .5em; + height: 46px; padding: 0 1.15em; + border-radius: 999px; + font-family: var(--f-sticker); + font-size: 1rem; text-transform: uppercase; letter-spacing: .02em; + text-decoration: none; cursor: pointer; + border: 2px solid transparent; + transition: transform .3s var(--ease-pop), background-color .2s, color .2s, border-color .2s; + overflow: hidden; +} +.pill:hover { transform: scale(1.05); } +.pill--red { background: var(--red); color: var(--white); } +.pill--red:hover { background: var(--ink); } +.pill--outline { background: rgba(247, 235, 217, .7); border-color: rgba(21, 13, 12, .25); color: var(--ink); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } +.pill--outline:hover { border-color: var(--ink); } +.roll { display: inline-grid; height: 1.1em; overflow: hidden; line-height: 1.1; } +.roll > span { grid-area: 1 / 1; transition: transform .3s cubic-bezier(.5, 0, .2, 1); } +.roll > span + span { transform: translateY(110%); } +.pill:hover .roll > span:first-child, .btn:hover .roll > span:first-child { transform: translateY(-110%); } +.pill:hover .roll > span + span, .btn:hover .roll > span + span { transform: translateY(0); } + +/* ============ Stickers ============ */ +.sticker { + display: inline-block; + font-family: var(--f-sticker); + text-transform: uppercase; + line-height: .95; + text-align: center; + padding: .55em .8em .6em; + border-radius: 999px; + background: var(--yellow); + color: var(--ink); + border: 4px solid var(--white); + box-shadow: 0 8px 18px rgba(21, 13, 12, .25); + font-size: clamp(.85rem, .7rem + .8vw, 1.45rem); + transform: rotate(var(--r, -8deg)); +} +.sticker--red { background: var(--red); color: var(--white); } +.sticker--ink { background: var(--ink); color: var(--yellow); } +.die-cut { + filter: + drop-shadow(3px 0 0 var(--white)) drop-shadow(-3px 0 0 var(--white)) + drop-shadow(0 3px 0 var(--white)) drop-shadow(0 -3px 0 var(--white)) + drop-shadow(0 12px 14px rgba(21, 13, 12, .28)); +} +.burst { + display: grid; place-items: center; + width: clamp(92px, 11vw, 160px); aspect-ratio: 1; + font-family: var(--f-sticker); text-transform: uppercase; text-align: center; line-height: .95; + font-size: clamp(1rem, .8rem + 1vw, 1.7rem); + color: var(--ink); + background: var(--yellow); + clip-path: polygon(50% 0, 61% 14%, 79% 7%, 80% 25%, 98% 28%, 88% 44%, 100% 58%, 83% 66%, 88% 85%, 69% 83%, 59% 100%, 47% 87%, 30% 97%, 26% 79%, 7% 77%, 14% 60%, 0 46%, 15% 36%, 9% 18%, 28% 17%, 36% 1%); + transform: rotate(var(--r, 10deg)); +} +.burst span { transform: translateY(2%); padding: 0 12%; } + +/* ============ Layout helpers ============ */ +.wrap { width: 100%; max-width: 1480px; margin: 0 auto; padding: 0 var(--gutter); } +.section { position: relative; padding: clamp(5rem, 11vw, 10rem) 0; } +.bg-cream { background: var(--cream); } +.bg-red { background: var(--red); color: var(--cream); } +.bg-yellow { background: var(--yellow); color: var(--ink); } +.bg-ink { background: var(--ink); color: var(--cream); } + +.wave { + position: absolute; left: 0; right: 0; height: clamp(40px, 7vw, 110px); + pointer-events: none; z-index: 3; color: inherit; +} +.wave svg { width: 100%; height: 100%; } +.wave--top { top: 1px; transform: translateY(-100%); } +.wave--bottom { bottom: 1px; transform: translateY(100%) scaleY(-1); } +.bg-red .wave { color: var(--red); } +.bg-yellow .wave { color: var(--yellow); } +.bg-ink .wave { color: var(--ink); } +.bg-cream .wave { color: var(--cream); } + +/* ============ Header / Nav ============ */ +.nav { + position: fixed; inset: 0 0 auto 0; z-index: 900; + height: var(--nav-h); + display: flex; align-items: center; justify-content: space-between; + padding: 0 var(--gutter); + transition: transform .35s cubic-bezier(.2, .8, .2, 1); +} +.nav.is-hidden { transform: translateY(calc(-100% - 12px)); } +.nav__brand { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--ink); } +.nav__brand img { height: 58px; width: auto; } +.nav__brand .wm { width: 150px; height: auto; color: var(--ink); } +.nav__actions { display: flex; align-items: center; gap: .6rem; } +.nav.is-dark .nav__brand .wm { color: var(--cream); } +.nav.is-dark .pill--outline { background: rgba(21, 13, 12, .55); border-color: rgba(247, 235, 217, .35); color: var(--cream); } +.nav.is-dark .pill--outline:hover { border-color: var(--cream); } +.nav__brand .wm { transition: color .3s; } +.nav__burger { display: inline-grid; gap: 4px; width: 18px; } +.nav__burger i { display: block; height: 2px; background: currentColor; border-radius: 2px; transition: transform .35s, opacity .2s; } +.nav__burger i:nth-child(2) { width: 70%; margin-left: auto; } +.nav.is-open .nav__burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); } +.nav.is-open .nav__burger i:nth-child(2) { opacity: 0; } +.nav.is-open .nav__burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); } + +.menu-overlay { + position: fixed; inset: 0; z-index: 880; + background: rgba(224, 20, 14, .28); + backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); + opacity: 0; visibility: hidden; transition: opacity .28s, visibility .28s; +} +.menu-panel { + position: fixed; z-index: 890; + top: calc(var(--nav-h) + 4px); right: var(--gutter); + width: min(360px, calc(100vw - 2 * var(--gutter))); + background: var(--red); color: var(--cream); + border-radius: 26px; border: 4px solid var(--white); + padding: 1.4rem 1.6rem 1.5rem; + box-shadow: 0 24px 60px rgba(21, 13, 12, .35); + transform-origin: top right; + transform: scale(.3); opacity: 0; visibility: hidden; + transition: transform .5s var(--ease-pop), opacity .25s, visibility .5s; +} +body.menu-open .menu-overlay { opacity: 1; visibility: visible; } +body.menu-open .menu-panel { transform: scale(1); opacity: 1; visibility: visible; } +.menu-panel ul { list-style: none; margin: 0; padding: 0; } +.menu-panel li a { + display: block; padding: .18em 0; + font-family: var(--f-sticker); font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.3rem); line-height: 1.1; + text-transform: uppercase; text-decoration: none; color: var(--cream); + transition: color .2s, transform .3s var(--ease-pop); + transform-origin: left center; +} +.menu-panel li a:hover { color: var(--yellow); transform: scale(1.05) rotate(-2deg); } +.menu-panel .menu-panel__meta { margin-top: 1rem; padding-top: 1rem; border-top: 2px solid rgba(247, 235, 217, .3); font-size: .95rem; line-height: 1.45; } +.menu-panel__meta a { color: var(--yellow); font-weight: 700; text-decoration: none; } + +/* ============ Hero ============ */ +.hero { + position: relative; + min-height: 100svh; + padding: calc(var(--nav-h) + 1rem) var(--gutter) clamp(1.5rem, 3vw, 2.5rem); + display: grid; + grid-template-rows: 1fr auto; + overflow: hidden; +} +.hero__stage { position: relative; display: grid; place-items: center; } +.hero__title { position: relative; z-index: 1; text-align: left; margin: 0; } +.hero__eyebrow { + display: block; + font-family: var(--f-sticker); text-transform: uppercase; line-height: 1.1; + font-size: clamp(.95rem, .7rem + 1.1vw, 1.7rem); + color: var(--ink); letter-spacing: .02em; + margin: 0 0 1.1em .35em; +} +.hero__eyebrow > span { display: block; } +.hero__big { + display: block; + font-family: var(--f-display); text-transform: uppercase; + font-size: clamp(6rem, 22.5vw, 26rem); + line-height: .82; color: var(--red); + -webkit-text-stroke: .055em var(--white); paint-order: stroke fill; + white-space: nowrap; +} +.hero__big .part { display: inline-block; letter-spacing: .02em; } +.hero__burger { + position: absolute; z-index: 2; + left: 50%; top: 57%; + width: clamp(250px, 33vw, 600px); + transform: translate(-50%, -50%); + pointer-events: none; +} +.hero__burger img { width: 100%; height: auto; filter: drop-shadow(0 30px 30px rgba(21, 13, 12, .3)); } +.hero__wm { + position: absolute; z-index: 3; + left: 50%; top: 82%; + width: clamp(240px, 34vw, 600px); + transform: translate(-50%, -50%) rotate(-6deg); + color: var(--red); +} +.hero__wm svg, .hero__wm img { width: 100%; height: auto; } +.hero__wm .wm-fill { filter: drop-shadow(4px 0 0 var(--white)) drop-shadow(-4px 0 0 var(--white)) drop-shadow(0 4px 0 var(--white)) drop-shadow(0 -4px 0 var(--white)) drop-shadow(0 10px 12px rgba(21, 13, 12, .25)); } +.hero__st1 { position: absolute; z-index: 4; left: 3%; top: 70%; --r: -12deg; } +.hero__st2 { position: absolute; z-index: 4; right: 4%; top: 68%; --r: 9deg; } +.hero__rooster { position: absolute; z-index: 4; right: 9%; top: 2%; width: clamp(80px, 9vw, 150px); transform: rotate(12deg); } +.hero__bottom { + position: relative; z-index: 5; + display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 1.5rem 3rem; + margin-top: clamp(1rem, 2vw, 2rem); +} +.hero__bottom .lead { max-width: 34ch; font-weight: 500; } +.hero__cta { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: flex-end; align-items: center; } + +.open-badge { + display: inline-flex; align-items: center; gap: .55em; + font-weight: 700; font-size: .95rem; + padding: .45em .9em; border-radius: 999px; + background: var(--white); color: var(--ink); + box-shadow: 0 4px 12px rgba(21, 13, 12, .12); +} +.open-badge::before { + content: ""; width: .7em; height: .7em; border-radius: 50%; + background: #9c9c9c; +} +.open-badge.is-open::before { background: #1fa83a; box-shadow: 0 0 0 0 rgba(31, 168, 58, .6); animation: ping 1.8s infinite; } +.open-badge.is-closed::before { background: var(--red); } +@keyframes ping { 70% { box-shadow: 0 0 0 10px rgba(31, 168, 58, 0); } 100% { box-shadow: 0 0 0 0 rgba(31, 168, 58, 0); } } + +/* ============ Ticker ============ */ +.ticker-clip { position: relative; z-index: 6; overflow: clip; padding: 1.6rem 0; margin: -1.6rem 0; } +.ticker { + position: relative; z-index: 6; + background: var(--ink); color: var(--yellow); + overflow: hidden; white-space: nowrap; + transform: rotate(-2deg); margin: -1.2rem -2vw 0; padding: .9rem 0; + border-block: 4px solid var(--white); +} +.ticker__track { display: inline-flex; gap: 2.2rem; animation: ticker 32s linear infinite; } +.ticker__track span { font-family: var(--f-display); font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.8rem); text-transform: uppercase; line-height: 1; display: inline-flex; align-items: center; gap: 2.2rem; } +.ticker__track span::after { content: "✦"; color: var(--red); font-size: .7em; } +@keyframes ticker { to { transform: translateX(-50%); } } + +/* ============ Champions ============ */ +.champs { text-align: center; overflow-x: clip; } +.champs .h2 { max-width: 12ch; margin: 0 auto .3em; } +.champs .lead { margin: 0 auto 2.2rem; } +.champs__cards { + display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 3vw, 3rem); + margin-top: clamp(3rem, 6vw, 5rem); + perspective: 1200px; +} +.photo-card { + position: relative; display: block; text-decoration: none; color: var(--ink); + transform: rotate(var(--r, 0deg)); + transition: transform .6s var(--ease-pop); +} +.photo-card:nth-child(1) { --r: -5deg; } +.photo-card:nth-child(2) { --r: 3deg; margin-top: 3rem; } +.photo-card:nth-child(3) { --r: -3deg; } +.photo-card:hover { transform: rotate(0deg) translateY(-8px) scale(1.02); } +.photo-card__img { border-radius: var(--radius); overflow: hidden; border: 6px solid var(--white); box-shadow: var(--shadow); aspect-ratio: 4 / 5; background: #ececec; } +.photo-card__img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform .8s cubic-bezier(.2, .8, .2, 1); } +.photo-card:hover .photo-card__img img { transform: scale(1.14); } +.photo-card__label { position: absolute; left: 50%; bottom: -1.2rem; transform: translateX(-50%) rotate(-3deg); width: max-content; max-width: 92%; } +.photo-card__label .sticker { transform: none; font-size: clamp(.95rem, .8rem + .6vw, 1.3rem); } +.photo-card__price { position: absolute; top: -1rem; right: -0.6rem; } + +/* ============ Wings ============ */ +.wings { overflow-x: clip; } +.wings__head { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: end; } +.wings .h2 { color: var(--cream); --stroke-c: var(--comb); } +.wings__hero { position: relative; } +.wings__hero img { width: 100%; max-width: 640px; margin-left: auto; } +.wings__hero .burst { position: absolute; left: 0; top: 4%; --r: -12deg; } +.wings__hero .rooster-st { position: absolute; right: 2%; bottom: -4%; width: clamp(90px, 10vw, 150px); transform: rotate(10deg); } +.wings__lead { color: var(--cream); margin-top: 1.4rem; } +.wings__lead em { font-family: var(--f-sticker); font-style: normal; color: var(--yellow); text-transform: uppercase; font-size: 1.1em; } + +.sauce-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1rem, 2vw, 1.8rem); margin-top: clamp(2.5rem, 5vw, 4rem); } +.sauce { + position: relative; + background: var(--cream); color: var(--ink); + border-radius: var(--radius); border: 4px solid var(--white); + padding: 1.1rem 1.1rem 1.3rem; + text-align: center; + box-shadow: 0 14px 30px rgba(80, 0, 0, .3); + transition: transform .45s var(--ease-pop); +} +.sauce:nth-child(odd) { transform: rotate(-2deg); } +.sauce:nth-child(even) { transform: rotate(2deg); } +.sauce:hover { transform: rotate(0) translateY(-6px); } +.sauce__img { aspect-ratio: 1; display: grid; place-items: center; margin: -2.6rem auto .4rem; width: 88%; } +.sauce__img { position: relative; } +.sauce__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: transform .6s var(--ease-pop); } +.sauce:hover .sauce__img img { transform: scale(1.07) rotate(-4deg); } +.sauce h3 { font-family: var(--f-display); text-transform: uppercase; font-weight: 400; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.3rem); line-height: .95; margin: 0 0 .35rem; color: var(--red-deep); } +.sauce p { font-size: .95rem; margin: 0; } +.sauce .price { display: inline-block; margin-top: .7rem; } + +.price { + font-family: var(--f-sticker); font-size: 1.05rem; line-height: 1; + background: var(--ink); color: var(--yellow); + padding: .5em .8em .55em; border-radius: 999px; white-space: nowrap; +} +.price--light { background: var(--yellow); color: var(--ink); } + +.classic-wings { + margin-top: clamp(2.5rem, 5vw, 4rem); + display: grid; grid-template-columns: auto 1fr auto; gap: 1.5rem 2rem; align-items: center; + background: var(--ink); color: var(--cream); + border: 4px solid var(--white); border-radius: calc(var(--radius) + 6px); + padding: clamp(1.2rem, 2.5vw, 2rem) clamp(1.2rem, 3vw, 2.6rem); +} +.classic-wings h3 { margin: 0; font-family: var(--f-display); font-weight: 400; text-transform: uppercase; font-size: clamp(2rem, 1.4rem + 2vw, 3.4rem); line-height: .9; color: var(--yellow); } +.classic-wings p { margin: 0; opacity: .9; } +.classic-wings__prices { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; } +.classic-wings__prices .price { background: var(--red); color: var(--white); } +.classic-wings__prices .price small { font-family: var(--f-body); font-weight: 700; font-size: .8em; opacity: .9; margin-right: .3em; } + +/* ============ Photo band ============ */ +.band { position: relative; height: clamp(360px, 70vw, 900px); overflow: hidden; background: #d9c8b2; } +.band img { position: absolute; inset: -10% 0; width: 100%; height: 120%; object-fit: cover; } +.band .wave { color: var(--red); } +.band .wave--top { top: -1px; transform: none; } +.band .wave--bottom { bottom: -1px; transform: scaleY(-1); } +.band .wave--bottom { color: var(--ink); } +.band__tag { position: absolute; z-index: 4; right: 6%; bottom: 16%; --r: 7deg; font-size: clamp(1rem, .7rem + 1.4vw, 2rem); } + +/* ============ Buckets ============ */ +.buckets { overflow-x: clip; } +.buckets .h2 { color: var(--yellow); --stroke-c: var(--red); font-size: clamp(3.4rem, 9.5vw, 9.5rem); } +.buckets__head { display: grid; grid-template-columns: 1.4fr .6fr; gap: 2rem; align-items: end; } +.buckets__head .lead { color: var(--cream); opacity: .92; } +.fight-card-row { display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(1rem, 3vw, 2.5rem); align-items: center; margin-top: clamp(3rem, 6vw, 5rem); } +.vs { font-family: var(--f-display); font-size: clamp(3rem, 7vw, 7rem); color: var(--red); -webkit-text-stroke: .05em var(--cream); paint-order: stroke fill; line-height: 1; transform: rotate(-8deg); } +.fight-card { + position: relative; + background: var(--cream); color: var(--ink); + border: 5px solid var(--yellow); + border-radius: calc(var(--radius) + 4px); + padding: clamp(1.4rem, 3vw, 2.4rem); + overflow: hidden; + box-shadow: 0 0 0 5px var(--ink), 0 0 0 9px var(--red), 0 30px 60px rgba(0, 0, 0, .45); +} +.fight-card::before { + content: ""; position: absolute; inset: auto 0 0 0; height: 64px; + background-color: #fff; + background-image: linear-gradient(90deg, rgba(224, 20, 14, .55) 50%, transparent 50%), linear-gradient(rgba(224, 20, 14, .55) 50%, transparent 50%); + background-size: 32px 32px; + opacity: .9; +} +.fight-card__class { font-family: var(--f-sticker); text-transform: uppercase; color: var(--red-deep); font-size: 1rem; letter-spacing: .08em; } +.fight-card h3 { font-family: var(--f-display); font-weight: 400; text-transform: uppercase; margin: .15em 0 .3em; font-size: clamp(2.8rem, 2rem + 3vw, 5rem); line-height: .86; color: var(--red); -webkit-text-stroke: .06em var(--white); paint-order: stroke fill; } +.fight-card ul { list-style: none; margin: 0 0 1.2rem; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; } +.fight-card li { background: var(--white); border: 2px solid var(--ink); border-radius: 999px; padding: .25em .7em; font-weight: 700; font-size: .92rem; } +.fight-card__foot { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: end; gap: 1rem; padding-bottom: 38px; } +.fight-card__foot .price { font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); } +.fight-card__foot img { width: clamp(120px, 13vw, 200px); margin: -4rem -1rem -2.4rem 0; } +.buckets__note { margin-top: 2.5rem; text-align: center; opacity: .8; font-size: .95rem; } + +/* ============ Take away (route) ============ */ +.takeaway { overflow-x: clip; } +.takeaway .h2 { color: var(--white); --stroke-c: var(--ink); --sw: .045em; max-width: 13ch; } +.takeaway__lead { max-width: 40ch; margin-top: 1.4rem; font-weight: 500; } +.route { position: relative; margin-top: clamp(6rem, 10vw, 9rem); } +.route__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; } +.route__svg path { fill: none; stroke: var(--ink); stroke-width: 3; stroke-dasharray: 10 12; stroke-linecap: round; opacity: .55; } +.route__rider { position: absolute; left: 0; top: 0; width: clamp(64px, 7vw, 100px); z-index: 3; will-change: transform; pointer-events: none; } +.stops { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.2rem, 3vw, 3rem); } +.stop { + background: var(--white); border: 4px solid var(--ink); border-radius: var(--radius); + padding: clamp(1.3rem, 2.4vw, 2rem); + box-shadow: 8px 8px 0 var(--ink); + transition: transform .45s var(--ease-pop), box-shadow .3s; +} +.stop:nth-child(2) { margin-top: clamp(2rem, 6vw, 6rem); } +.stop:nth-child(3) { margin-top: clamp(4rem, 12vw, 12rem); } +.stop:hover { transform: translate(-3px, -3px) rotate(-1deg); box-shadow: 12px 12px 0 var(--red); } +.stop__num { font-family: var(--f-display); font-size: 3.6rem; line-height: .8; color: var(--red); -webkit-text-stroke: .05em var(--ink); paint-order: stroke fill; } +.stop h3 { font-family: var(--f-sticker); text-transform: uppercase; font-weight: 400; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); line-height: 1; margin: .5rem 0 .6rem; } +.stop p { font-size: 1rem; } +.stop__links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; } +.stop__links a { + display: inline-flex; align-items: center; gap: .4em; + font-weight: 800; font-size: .95rem; text-decoration: none; + padding: .55em .95em; border-radius: 999px; border: 2px solid var(--ink); + transition: background-color .2s, color .2s; +} +.stop__links a:hover { background: var(--ink); color: var(--yellow); } +.stop__links a.is-primary { background: var(--red); border-color: var(--red); color: var(--white); } +.stop__links a.is-primary:hover { background: var(--ink); border-color: var(--ink); } +.stop__links svg { width: 1em; height: 1em; } + +/* ============ Visit ============ */ +.visit__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; } +.visit .h2 { max-width: 10ch; } +.info-card { + background: var(--white); border-radius: calc(var(--radius) + 6px); + border: 4px solid var(--ink); + padding: clamp(1.4rem, 3vw, 2.4rem); + box-shadow: 10px 10px 0 var(--red); +} +.info-card h3 { font-family: var(--f-sticker); text-transform: uppercase; font-weight: 400; margin: 0 0 .6rem; font-size: 1.25rem; color: var(--red-deep); } +.info-card + .info-card { margin-top: 1.6rem; } +.info-card address { font-style: normal; font-size: 1.2rem; font-weight: 600; line-height: 1.4; } +.hours { width: 100%; border-collapse: collapse; font-size: 1.02rem; } +.hours th, .hours td { padding: .42rem 0; border-bottom: 2px dashed rgba(21, 13, 12, .15); text-align: left; } +.hours td { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; } +.hours tr.is-today th, .hours tr.is-today td { color: var(--red-deep); } +.hours tr.is-today th::after { content: " · heute"; font-weight: 700; } +.info-card .row { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.2rem; } +.note { font-size: .88rem; opacity: .75; margin-top: .9rem; } +.rating { display: flex; align-items: center; gap: 1rem; margin-top: 2rem; flex-wrap: wrap; } +.rating__score { font-family: var(--f-display); font-size: clamp(3.4rem, 2.6rem + 3vw, 5.6rem); line-height: .8; color: var(--red); -webkit-text-stroke: .05em var(--white); paint-order: stroke fill; } +.rating__stars { color: var(--yellow-2); font-size: 1.4rem; letter-spacing: .1em; line-height: 1; -webkit-text-stroke: 1px var(--ink); } +.rating__meta { font-size: .95rem; line-height: 1.35; } +.rating__meta a { font-weight: 700; } +.visit__deco { position: relative; margin-top: 2.2rem; } +.visit__deco img { width: min(460px, 90%); } +.visit__deco .sticker { position: absolute; right: 6%; top: 8%; --r: 8deg; } + +/* ============ Final CTA ============ */ +.cta { text-align: center; overflow-x: clip; } +.cta .h2 { font-size: clamp(5rem, 20vw, 20rem); color: var(--yellow); --stroke-c: var(--ink); --sw: .045em; } +.cta__rooster { width: clamp(160px, 22vw, 340px); margin: -2rem auto 0; transform: rotate(-8deg); } +.cta .lead { margin: 1.2rem auto 2rem; color: var(--white); max-width: 30ch; } +.cta__buttons { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; } + +/* ============ Footer ============ */ +.footer { position: relative; background: var(--ink); color: var(--cream); padding: clamp(4rem, 8vw, 6rem) 0 0; overflow: hidden; } +.footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 2rem; } +.footer h2 { font-family: var(--f-sticker); font-weight: 400; text-transform: uppercase; font-size: 1.05rem; color: var(--yellow); margin: 0 0 .9rem; letter-spacing: .04em; } +.footer ul { list-style: none; margin: 0; padding: 0; } +.footer li { margin: .35rem 0; } +.footer a { text-decoration: none; transition: color .2s; } +.footer a:hover { color: var(--yellow); } +.footer__brand p { max-width: 30ch; opacity: .85; } +.footer__brand img { width: 84px; margin-bottom: 1rem; } +.footer__links a { font-family: var(--f-display); text-transform: uppercase; font-size: 1.45rem; letter-spacing: .02em; } +.footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-top: 3rem; padding-top: 1.2rem; border-top: 2px solid rgba(247, 235, 217, .18); font-size: .9rem; opacity: .85; } +.footer__bottom a { text-decoration: underline; text-underline-offset: 3px; } +.footer__giant { position: relative; margin-top: clamp(2.5rem, 6vw, 5rem); height: calc(94vw / 4.714 + 3vw); } +.footer__giant .wm-giant { position: absolute; left: 50%; bottom: 2vw; width: 94vw; transform: translateX(-50%); color: var(--red); } +.footer__giant .wm-giant svg { width: 100%; height: auto; filter: drop-shadow(0 0 0 var(--cream)); } +.juggle { position: absolute; bottom: 12%; width: clamp(48px, 6vw, 92px); z-index: 2; will-change: transform; } +.juggle svg { width: 100%; height: auto; } + +/* ============ Mobile order bar ============ */ +.orderbar { + position: fixed; left: .75rem; right: .75rem; bottom: .75rem; z-index: 850; + display: none; gap: .6rem; + transform: translateY(140%); transition: transform .45s var(--ease-pop); +} +.orderbar.is-visible { transform: translateY(0); } +.orderbar a { + flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; + height: 56px; border-radius: 999px; text-decoration: none; + font-family: var(--f-sticker); text-transform: uppercase; font-size: 1rem; + border: 3px solid var(--white); box-shadow: 0 10px 24px rgba(21, 13, 12, .3); +} +.orderbar svg { width: 1.2em; height: 1.2em; } +.orderbar .call { background: var(--ink); color: var(--cream); flex: .8; } +.orderbar .order { background: var(--red); color: var(--white); } + +/* ============ Speisekarte ============ */ +.page-hero { position: relative; padding: calc(var(--nav-h) + clamp(3rem, 7vw, 6rem)) 0 clamp(5rem, 9vw, 8rem); overflow: hidden; } +.page-hero .display { font-size: clamp(5rem, 16vw, 16rem); color: var(--red); --stroke-c: var(--cream); --sw: .05em; } +.page-hero .lead { color: var(--cream); margin-top: 1.4rem; } +.page-hero__img { position: absolute; right: -3%; bottom: 6%; width: clamp(220px, 33vw, 560px); z-index: 1; } +.page-hero__st { position: absolute; right: 30%; top: 26%; z-index: 2; --r: -10deg; } + +.cat-nav { + position: sticky; top: 0; z-index: 800; + background: rgba(247, 235, 217, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); + border-bottom: 2px solid rgba(21, 13, 12, .1); + transition: top .35s cubic-bezier(.2, .8, .2, 1); +} +body.nav-visible .cat-nav { top: var(--nav-h); } +.cat-nav ul { display: flex; gap: .5rem; overflow-x: auto; list-style: none; margin: 0; padding: .75rem var(--gutter); scrollbar-width: none; } +.cat-nav ul::-webkit-scrollbar { display: none; } +.cat-nav a { + display: inline-block; white-space: nowrap; + padding: .5em 1em; border-radius: 999px; border: 2px solid var(--ink); + font-family: var(--f-sticker); text-transform: uppercase; font-size: .92rem; text-decoration: none; + transition: background-color .2s, color .2s, transform .3s var(--ease-pop); +} +.cat-nav a:hover { transform: scale(1.05); } +.cat-nav a.is-active { background: var(--red); border-color: var(--red); color: var(--white); } + +.menu-cat { padding: clamp(3.5rem, 7vw, 6rem) 0 0; scroll-margin-top: calc(var(--nav-h) + 70px); } +.menu-cat__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: clamp(1.8rem, 4vw, 3rem); } +.menu-cat__head .display { font-size: clamp(3.4rem, 9vw, 8rem); color: var(--red); } +.menu-cat__head p { max-width: 46ch; margin: 0; font-weight: 500; } + +.dish-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.8rem); margin-bottom: clamp(1.5rem, 3vw, 2.5rem); } +.dish { + position: relative; display: flex; flex-direction: column; + background: var(--white); border-radius: var(--radius); + overflow: hidden; + box-shadow: 0 10px 26px rgba(21, 13, 12, .08); + transition: transform .45s var(--ease-pop), box-shadow .3s; +} +.dish:hover { transform: translateY(-6px); box-shadow: 0 22px 40px rgba(21, 13, 12, .16); } +.dish__media { position: relative; height: clamp(220px, 22vw, 300px); display: grid; place-items: center; } +.dish__media::before { + content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 88px; transform: translateY(-20%); + background-color: #fff; + background-image: linear-gradient(90deg, rgba(224, 20, 14, .6) 50%, transparent 50%), linear-gradient(rgba(224, 20, 14, .6) 50%, transparent 50%); + background-size: 44px 44px; + transition: background-position .6s cubic-bezier(.4, 1.6, .7, .95); +} +.dish:hover .dish__media::before { background-position: 22px 0; } +.dish__media img { position: absolute; z-index: 1; left: 11%; top: 6%; width: 78%; height: 88%; object-fit: contain; filter: drop-shadow(0 16px 16px rgba(21, 13, 12, .25)); transition: transform .7s var(--ease-pop); } +.dish:hover .dish__media img { transform: scale(1.06) rotate(-2deg); } +.dish__badge { position: absolute; z-index: 2; left: 1rem; top: 1rem; font-size: .85rem; --r: -6deg; border-width: 3px; } +.dish__body { padding: 1rem 1.3rem 1.4rem; display: flex; flex-direction: column; gap: .4rem; flex: 1; } +.dish__row { display: flex; justify-content: space-between; align-items: start; gap: 1rem; } +.dish h3 { font-family: var(--f-display); font-weight: 400; text-transform: uppercase; font-size: clamp(1.6rem, 1.2rem + 1vw, 2.2rem); line-height: .95; margin: 0; color: var(--red-deep); } +.dish p { font-size: .95rem; margin: 0; opacity: .85; } +.dish .variants { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: auto; padding-top: .6rem; } +.dish .variants span { font-weight: 700; font-size: .88rem; border: 2px solid var(--ink); border-radius: 999px; padding: .15em .6em; } + +.dish-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(2rem, 5vw, 4.5rem); } +.item { padding: 1.05rem 0; border-bottom: 2px dashed rgba(21, 13, 12, .18); } +.item__row { display: flex; align-items: baseline; gap: .6rem; } +.item h3 { font-family: var(--f-body); font-weight: 800; font-size: 1.12rem; margin: 0; } +.item__dots { flex: 1; border-bottom: 3px dotted rgba(21, 13, 12, .35); transform: translateY(-4px); min-width: 1rem; } +.item__price { font-family: var(--f-sticker); font-size: 1.05rem; white-space: nowrap; color: var(--red-deep); } +.item p { margin: .25rem 0 0; font-size: .95rem; opacity: .8; } +.item .tag { display: inline-block; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; background: var(--yellow); border-radius: 999px; padding: .15em .55em; margin-left: .4rem; vertical-align: .15em; } + +.menu-extra { + margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; + font-size: .95rem; font-weight: 600; +} +.menu-extra span { background: var(--cream-2); border-radius: 999px; padding: .35em .85em; } + +.only-here { + margin: clamp(4rem, 8vw, 7rem) 0 0; + display: grid; grid-template-columns: auto 1fr; gap: 2rem; align-items: center; + background: var(--ink); color: var(--cream); border-radius: calc(var(--radius) + 8px); + padding: clamp(1.6rem, 4vw, 3rem); + border: 4px solid var(--yellow); +} +.only-here img { width: clamp(100px, 12vw, 170px); transform: rotate(-8deg); } +.only-here h2 { font-family: var(--f-display); font-weight: 400; text-transform: uppercase; font-size: clamp(2.4rem, 1.6rem + 3vw, 4.4rem); line-height: .9; margin: 0 0 .5rem; color: var(--yellow); } + +.legal-note { margin-top: clamp(3rem, 6vw, 5rem); padding: 1.4rem 1.6rem; border-radius: 20px; background: var(--cream-2); font-size: .95rem; } +.legal-note h2 { font-family: var(--f-sticker); font-weight: 400; text-transform: uppercase; font-size: 1.1rem; margin: 0 0 .5rem; } + +/* ============ Legal pages ============ */ +.legal { padding: calc(var(--nav-h) + clamp(2.5rem, 6vw, 5rem)) 0 clamp(4rem, 8vw, 7rem); } +.legal .display { font-size: clamp(3.6rem, 11vw, 9rem); color: var(--red); margin-bottom: 2rem; } +.legal__body { max-width: 760px; } +.legal__body h2 { font-family: var(--f-sticker); font-weight: 400; text-transform: uppercase; font-size: clamp(1.2rem, 1rem + .6vw, 1.5rem); margin: 2.4rem 0 .7rem; color: var(--red-deep); } +.legal__body h3 { font-size: 1.1rem; margin: 1.6rem 0 .4rem; } +.legal__body ul { padding-left: 1.2rem; } +.draft-box { + background: var(--yellow); border: 3px solid var(--ink); border-radius: 18px; + padding: 1rem 1.2rem; font-weight: 600; margin-bottom: 2rem; box-shadow: 6px 6px 0 var(--ink); +} +.fill { background: #fff3b0; border-bottom: 2px solid var(--yellow-2); padding: 0 .2em; font-weight: 700; } + +/* ============ Wortmarke (Maske, beliebig einfärbbar) ============ */ +.wm-mask { + display: inline-block; + background: currentColor; + -webkit-mask: url(../img/wordmark.svg) center / contain no-repeat; + mask: url(../img/wordmark.svg) center / contain no-repeat; + aspect-ratio: 374.8 / 79.5; +} +.wm-mask--block { display: block; width: 100%; } +.footer__giant .wm-giant { filter: drop-shadow(0 -4px 0 var(--cream)) drop-shadow(0 4px 0 var(--cream)) drop-shadow(4px 0 0 var(--cream)) drop-shadow(-4px 0 0 var(--cream)); } + +/* ============ Speisekarte: Varianten ============ */ +.dish-grid--4 { grid-template-columns: repeat(4, 1fr); } +.dish-grid--2 { grid-template-columns: repeat(2, 1fr); } +.cat-split { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; } +.cat-split .dish-list { grid-template-columns: 1fr; } +.dish--promo { background: var(--ink); color: var(--cream); border: 4px solid var(--yellow); justify-content: center; padding: clamp(1.4rem, 2.5vw, 2rem); gap: 1rem; } +.dish--promo h3 { color: var(--yellow); font-size: clamp(2.2rem, 1.6rem + 2vw, 3.2rem); } +.dish--promo p { opacity: .9; } +.dish--promo .promo-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .7rem 0; border-bottom: 2px dashed rgba(247, 235, 217, .25); } +.dish--promo .promo-row strong { font-family: var(--f-display); font-weight: 400; text-transform: uppercase; font-size: 1.7rem; line-height: 1; } +.dish--promo .price { background: var(--red); color: var(--white); } +.sauce-chips { display: flex; flex-wrap: wrap; gap: .6rem; } +.sauce-chips span { display: inline-flex; gap: .6em; align-items: center; background: var(--white); border: 2px solid var(--ink); border-radius: 999px; padding: .45em .95em; font-weight: 700; } +.sauce-chips b { font-family: var(--f-sticker); font-weight: 400; color: var(--red-deep); } + +/* ============ Motion setup ============ */ +html.js [data-pop] .pw { display: inline-block; will-change: transform; } +html.js.anim [data-pop] .pw { opacity: 0; } +html.js.anim [data-reveal] { opacity: 0; translate: 0 var(--ry, 40px); } +[data-sticker] { scale: var(--s, 1); } +html.js.anim [data-sticker] { --s: 0; } +html.js.anim .hero [data-intro] { opacity: 0; } +.hero__big .pl, .page-hero .pl { will-change: transform; } + +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } + html.js.anim [data-pop] .pw, html.js.anim [data-reveal], html.js.anim .hero [data-intro] { opacity: 1 !important; translate: none !important; } + html.js.anim [data-sticker] { --s: 1 !important; } + .ticker__track { animation: none; } +} + +/* ============ Responsive ============ */ +@media (max-width: 1100px) { + .sauce-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 3.5rem; } + .footer__grid { grid-template-columns: 1fr 1fr; } + .dish-grid, .dish-grid--4 { grid-template-columns: repeat(2, 1fr); } +} + +@media (max-width: 820px) { + :root { --nav-h: 66px; } + .nav__brand img { height: 48px; } + .nav__brand .wm { width: 118px; } + .nav .pill--red { display: none; } + .hero { min-height: auto; padding-top: calc(var(--nav-h) + 1.5rem); } + .hero__stage { padding-bottom: 60vw; place-items: start center; } + .hero__eyebrow { margin: 0 0 .9em .2em; font-size: .9rem; } + .hero__eyebrow > span { display: inline; } + .hero__big { font-size: 30vw; line-height: .8; } + .hero__big .part { display: block; } + .hero__burger { top: auto; bottom: 8vw; transform: translateX(-50%); width: 56vw; } + .hero__wm { top: auto; bottom: 0; width: 72vw; transform: translate(-50%, 0) rotate(-6deg); } + .hero__st1 { left: 0; top: auto; bottom: 38vw; } + .hero__st2 { right: 0; top: auto; bottom: 26vw; } + .hero__rooster { right: 6vw; top: 30vw; width: 24vw; } + .hero__bottom { grid-template-columns: 1fr; margin-top: 2.2rem; } + .hero__cta { justify-content: flex-start; } + .champs__cards { grid-template-columns: 1fr; gap: 3.2rem; max-width: 420px; margin-inline: auto; } + .photo-card:nth-child(2) { margin-top: 0; } + .wings__head, .buckets__head, .visit__grid { grid-template-columns: 1fr; } + .wings__hero img { margin: 0 auto; } + .classic-wings { grid-template-columns: 1fr; text-align: left; } + .classic-wings__prices { justify-content: flex-start; } + .fight-card-row { grid-template-columns: 1fr; } + .vs { justify-self: center; margin: -.5rem 0; } + .stops { grid-template-columns: 1fr; } + .stop:nth-child(2), .stop:nth-child(3) { margin-top: 0; } + .route__svg, .route__rider { display: none; } + .orderbar { display: flex; } + .cta__rooster { width: 46vw; margin-top: -.5rem; } + .footer { padding-bottom: 5.5rem; } + .dish-list { grid-template-columns: 1fr; } + .cat-split { grid-template-columns: 1fr; } + .only-here { grid-template-columns: 1fr; } + .page-hero__img { position: relative; right: auto; bottom: auto; width: 80vw; margin: 1.5rem auto -3rem; } + .page-hero__st { right: 8%; top: auto; bottom: 30%; } +} + +@media (max-width: 560px) { + .sauce-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem .8rem; } + .sauce { padding: .8rem .6rem 1rem; } + .sauce p { display: none; } + .sauce h3 { font-size: 1.45rem; overflow-wrap: anywhere; } + .sauce .price { font-size: .82rem; white-space: normal; } + .dish-grid, .dish-grid--4, .dish-grid--2 { grid-template-columns: 1fr; } + .footer__grid { grid-template-columns: 1fr; } + .btn { font-size: 1rem; padding: .95em 1.4em 1em; } + .hero__cta .btn { flex: 1 1 auto; } +} diff --git a/assets/fonts/anton-latin.woff2 b/assets/fonts/anton-latin.woff2 new file mode 100644 index 0000000..69d48b9 Binary files /dev/null and b/assets/fonts/anton-latin.woff2 differ diff --git a/assets/fonts/archivo-latin.woff2 b/assets/fonts/archivo-latin.woff2 new file mode 100644 index 0000000..716d4ab Binary files /dev/null and b/assets/fonts/archivo-latin.woff2 differ diff --git a/assets/fonts/titan-one-latin.woff2 b/assets/fonts/titan-one-latin.woff2 new file mode 100644 index 0000000..2d20b79 Binary files /dev/null and b/assets/fonts/titan-one-latin.woff2 differ diff --git a/assets/img/apple-touch-icon.png b/assets/img/apple-touch-icon.png new file mode 100644 index 0000000..5aa260b Binary files /dev/null and b/assets/img/apple-touch-icon.png differ diff --git a/assets/img/cut-bbq-wings.webp b/assets/img/cut-bbq-wings.webp new file mode 100644 index 0000000..617438c Binary files /dev/null and b/assets/img/cut-bbq-wings.webp differ diff --git a/assets/img/cut-buffalo-wings.webp b/assets/img/cut-buffalo-wings.webp new file mode 100644 index 0000000..ae92a35 Binary files /dev/null and b/assets/img/cut-buffalo-wings.webp differ diff --git a/assets/img/cut-cheese-burger.webp b/assets/img/cut-cheese-burger.webp new file mode 100644 index 0000000..a7cf1b2 Binary files /dev/null and b/assets/img/cut-cheese-burger.webp differ diff --git a/assets/img/cut-cheesy-bacon-fries.webp b/assets/img/cut-cheesy-bacon-fries.webp new file mode 100644 index 0000000..d99a9b1 Binary files /dev/null and b/assets/img/cut-cheesy-bacon-fries.webp differ diff --git a/assets/img/cut-chicken-honey-mustard.webp b/assets/img/cut-chicken-honey-mustard.webp new file mode 100644 index 0000000..13d5e28 Binary files /dev/null and b/assets/img/cut-chicken-honey-mustard.webp differ diff --git a/assets/img/cut-chicken-wings.webp b/assets/img/cut-chicken-wings.webp new file mode 100644 index 0000000..18574f8 Binary files /dev/null and b/assets/img/cut-chicken-wings.webp differ diff --git a/assets/img/cut-chicken-wrap.webp b/assets/img/cut-chicken-wrap.webp new file mode 100644 index 0000000..b2af7da Binary files /dev/null and b/assets/img/cut-chicken-wrap.webp differ diff --git a/assets/img/cut-chili-cheese-fries.webp b/assets/img/cut-chili-cheese-fries.webp new file mode 100644 index 0000000..63b8d36 Binary files /dev/null and b/assets/img/cut-chili-cheese-fries.webp differ diff --git a/assets/img/cut-hamburger.webp b/assets/img/cut-hamburger.webp new file mode 100644 index 0000000..2402548 Binary files /dev/null and b/assets/img/cut-hamburger.webp differ diff --git a/assets/img/cut-steakhouse-burger.webp b/assets/img/cut-steakhouse-burger.webp new file mode 100644 index 0000000..7651326 Binary files /dev/null and b/assets/img/cut-steakhouse-burger.webp differ diff --git a/assets/img/cut-sweet-chili-wings.webp b/assets/img/cut-sweet-chili-wings.webp new file mode 100644 index 0000000..4d4230c Binary files /dev/null and b/assets/img/cut-sweet-chili-wings.webp differ diff --git a/assets/img/cut-teriyaki-wings.webp b/assets/img/cut-teriyaki-wings.webp new file mode 100644 index 0000000..4587eeb Binary files /dev/null and b/assets/img/cut-teriyaki-wings.webp differ diff --git a/assets/img/cut-us-burger.webp b/assets/img/cut-us-burger.webp new file mode 100644 index 0000000..25a1907 Binary files /dev/null and b/assets/img/cut-us-burger.webp differ diff --git a/assets/img/favicon-32.png b/assets/img/favicon-32.png new file mode 100644 index 0000000..b446b38 Binary files /dev/null and b/assets/img/favicon-32.png differ diff --git a/assets/img/foto-bbq-wings.webp b/assets/img/foto-bbq-wings.webp new file mode 100644 index 0000000..463e2f8 Binary files /dev/null and b/assets/img/foto-bbq-wings.webp differ diff --git a/assets/img/foto-cheesy-bacon-fries.webp b/assets/img/foto-cheesy-bacon-fries.webp new file mode 100644 index 0000000..04f1583 Binary files /dev/null and b/assets/img/foto-cheesy-bacon-fries.webp differ diff --git a/assets/img/foto-chicken-honey-mustard.webp b/assets/img/foto-chicken-honey-mustard.webp new file mode 100644 index 0000000..efacfbb Binary files /dev/null and b/assets/img/foto-chicken-honey-mustard.webp differ diff --git a/assets/img/foto-chicken-wrap.webp b/assets/img/foto-chicken-wrap.webp new file mode 100644 index 0000000..77afcea Binary files /dev/null and b/assets/img/foto-chicken-wrap.webp differ diff --git a/assets/img/foto-chili-cheese-fries.webp b/assets/img/foto-chili-cheese-fries.webp new file mode 100644 index 0000000..da72c89 Binary files /dev/null and b/assets/img/foto-chili-cheese-fries.webp differ diff --git a/assets/img/foto-menu-tenders.webp b/assets/img/foto-menu-tenders.webp new file mode 100644 index 0000000..cd27618 Binary files /dev/null and b/assets/img/foto-menu-tenders.webp differ diff --git a/assets/img/foto-menu-wings.webp b/assets/img/foto-menu-wings.webp new file mode 100644 index 0000000..8f5420f Binary files /dev/null and b/assets/img/foto-menu-wings.webp differ diff --git a/assets/img/foto-us-burger.webp b/assets/img/foto-us-burger.webp new file mode 100644 index 0000000..149689f Binary files /dev/null and b/assets/img/foto-us-burger.webp differ diff --git a/assets/img/icon-192.png b/assets/img/icon-192.png new file mode 100644 index 0000000..9257b63 Binary files /dev/null and b/assets/img/icon-192.png differ diff --git a/assets/img/og-image.jpg b/assets/img/og-image.jpg new file mode 100644 index 0000000..941c9a8 Binary files /dev/null and b/assets/img/og-image.jpg differ diff --git a/assets/img/rooster.svg b/assets/img/rooster.svg new file mode 100644 index 0000000..882b449 --- /dev/null +++ b/assets/img/rooster.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/img/wordmark.svg b/assets/img/wordmark.svg new file mode 100644 index 0000000..3a5a989 --- /dev/null +++ b/assets/img/wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/js/ScrollTrigger.min.js b/assets/js/ScrollTrigger.min.js new file mode 100644 index 0000000..ac73396 --- /dev/null +++ b/assets/js/ScrollTrigger.min.js @@ -0,0 +1,11 @@ +/*! + * ScrollTrigger 3.13.0 + * https://gsap.com + * + * @license Copyright 2025, GreenSock. All rights reserved. + * Subject to the terms at https://gsap.com/standard-license. + * @author: Jack Doyle, jack@greensock.com + */ + +!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function _defineProperties(e,t){for(var r=0;r=Math.abs(r)?t:r}function P(){(Ae=Se.core.globals().ScrollTrigger)&&Ae.core&&function _integrate(){var e=Ae.core,r=e.bridge||{},t=e._scrollers,n=e._proxies;t.push.apply(t,ze),n.push.apply(n,Ye),ze=t,Ye=n,o=function _bridge(e,t){return r[e](t)}}()}function Q(e){return Se=e||r(),!ke&&Se&&"undefined"!=typeof document&&document.body&&(Te=window,Me=(Ce=document).documentElement,Ee=Ce.body,t=[Te,Ce,Me,Ee],Se.utils.clamp,Be=Se.core.context||function(){},Oe="onpointerenter"in Ee?"pointer":"mouse",Pe=E.isTouch=Te.matchMedia&&Te.matchMedia("(hover: none), (pointer: coarse)").matches?1:"ontouchstart"in Te||0=i,n=Math.abs(t)>=i;k&&(r||n)&&k(se,e,t,me,ye),r&&(m&&0Math.abs(t)?"x":"y",oe=!0),"y"!==ae&&(me[2]+=e,se._vx.update(e,!0)),"x"!==ae&&(ye[2]+=t,se._vy.update(t,!0)),n?ee=ee||requestAnimationFrame(kf):kf()}function nf(e){if(!hf(e,1)){var t=(e=N(e,s)).clientX,r=e.clientY,n=t-se.x,i=r-se.y,o=se.isDragging;se.x=t,se.y=r,(o||(n||i)&&(Math.abs(se.startX-t)>=a||Math.abs(se.startY-r)>=a))&&(re=o?2:1,o||(se.isDragging=!0),mf(n,i))}}function qf(e){return e.touches&&1=e)return a[n];return a[n-1]}for(n=a.length,e+=r;n--;)if(a[n]<=e)return a[n];return a[0]}:function(e,t,r){void 0===r&&(r=.001);var n=o(e);return!t||Math.abs(n-e)r&&(n*=t/100),e=e.substr(0,r-1)),e=n+(e in q?q[e]*t:~e.indexOf("%")?parseFloat(e)*t/100:parseFloat(e)||0)}return e}function Eb(e,t,r,n,i,o,a,s){var l=i.startColor,c=i.endColor,u=i.fontSize,f=i.indent,d=i.fontWeight,p=Fe.createElement("div"),g=Ma(r)||"fixed"===z(r,"pinType"),h=-1!==e.indexOf("scroller"),v=g?We:r,b=-1!==e.indexOf("start"),m=b?l:c,y="border-color:"+m+";font-size:"+u+";color:"+m+";font-weight:"+d+";pointer-events:none;white-space:nowrap;font-family:sans-serif,Arial;z-index:1000;padding:4px 8px;border-width:0;border-style:solid;";return y+="position:"+((h||s)&&g?"fixed;":"absolute;"),!h&&!s&&g||(y+=(n===qe?I:Y)+":"+(o+parseFloat(f))+"px;"),a&&(y+="box-sizing:border-box;text-align:left;width:"+a.offsetWidth+"px;"),p._isStart=b,p.setAttribute("class","gsap-marker-"+e+(t?" marker-"+t:"")),p.style.cssText=y,p.innerText=t||0===t?e+"-"+t:e,v.children[0]?v.insertBefore(p,v.children[0]):v.appendChild(p),p._offset=p["offset"+n.op.d2],X(p,0,n,b),p}function Jb(){return 34We.clientWidth)||(ze.cache++,v?T=T||requestAnimationFrame(Z):Z(),st||V("scrollStart"),st=at())}function Lb(){y=Xe.innerWidth,m=Xe.innerHeight}function Mb(e){ze.cache++,!0!==e&&(Ke||h||Fe.fullscreenElement||Fe.webkitFullscreenElement||b&&y===Xe.innerWidth&&!(Math.abs(Xe.innerHeight-m)>.25*Xe.innerHeight))||c.restart(!0)}function Pb(){return yb(ne,"scrollEnd",Pb)||Mt(!0)}function Sb(e){for(var t=0;tt,n=e._startClamp&&e.start>=t;(r||n)&&e.setPositions(n?t-1:e.start,r?Math.max(n?t:e.start+1,t):e.end,!0)}),$b(!1),et=0,r.forEach(function(e){return e&&e.render&&e.render(-1)}),ze.forEach(function(e){Ua(e)&&(e.smooth&&requestAnimationFrame(function(){return e.target.style.scrollBehavior="smooth"}),e.rec&&e(e.rec))}),Ub(_,1),c.pause(),Ct++,Z(rt=2),kt.forEach(function(e){return Ua(e.vars.onRefresh)&&e.vars.onRefresh(e)}),rt=ne.isRefreshing=!1,V("refresh")}else xb(ne,"scrollEnd",Pb)},j=0,Et=1,Z=function _updateAll(e){if(2===e||!rt&&!k){ne.isUpdating=!0,it&&it.update(0);var t=kt.length,r=at(),n=50<=r-D,i=t&&kt[0].scroll();if(Et=i=Ra(be,he)){if(oe&&Ae()&&!de)for(o=oe.parentNode;o&&o!==We;)o._pinOffset&&(B-=o._pinOffset,I-=o._pinOffset),o=o.parentNode}else i=nb(ae),s=he===qe,a=Ae(),Q=parseFloat(K(he.a))+w,!y&&1=I})},ke.update=function(e,t,r){if(!de||r||e){var n,i,o,a,s,l,c,u=!0===rt?re:ke.scroll(),f=e?0:(u-B)/F,d=f<0?0:1u+(u-D)/(at()-Ve)*E&&(d=.9999)),d!==p&&ke.enabled){if(a=(s=(n=ke.isActive=!!d&&d<1)!=(!!p&&p<1))||!!d!=!!p,ke.direction=p=Ra(be,he),fe)if(e||!n&&!l)pc(ae,V);else{var g=_t(ae,!0),h=u-B;pc(ae,We,g.top+(he===qe?h:0)+xt,g.left+(he===qe?0:h)+xt)}Pt(n||l?W:G),$&&d<1&&n||b(Q+(1!==d||l?0:j))}}else b(Ja(Q+j*d));!ue||A.tween||Ke||ot||te.restart(!0),T&&(s||ce&&d&&(d<1||!tt))&&Je(T.targets).forEach(function(e){return e.classList[n||ce?"add":"remove"](T.className)}),!k||ve||e||k(ke),a&&!Ke?(ve&&(c&&("complete"===o?O.pause().totalProgress(1):"reset"===o?O.restart(!0).pause():"restart"===o?O.restart(!0):O[o]()),k&&k(ke)),!s&&tt||(C&&s&&Ya(ke,C),xe[i]&&Ya(ke,xe[i]),ce&&(1===d?ke.kill(!1,1):xe[i]=0),s||xe[i=1===d?1:3]&&Ya(ke,xe[i])),pe&&!n&&Math.abs(ke.getVelocity())>(Va(pe)?pe:2500)&&(Xa(ke.callbackAnimation),ee?ee.progress(1):Xa(O,"reverse"===o?1:!d,1))):ve&&k&&!Ke&&k(ke)}if(x){var v=de?u/de.duration()*(de._caScrollDist||0):u;y(v+(q._isFlipped?1:0)),x(v)}S&&S(-u/de.duration()*(de._caScrollDist||0))}},ke.enable=function(e,t){ke.enabled||(ke.enabled=!0,xb(be,"resize",Mb),me||xb(be,"scroll",Kb),Te&&xb(ScrollTrigger,"refreshInit",Te),!1!==e&&(ke.progress=Oe=0,R=D=Ee=Ae()),!1!==t&&ke.refresh())},ke.getTween=function(e){return e&&A?A.tween:ee},ke.setPositions=function(e,t,r,n){if(de){var i=de.scrollTrigger,o=de.duration(),a=i.end-i.start;e=i.start+a*e/o,t=i.start+a*t/o}ke.refresh(!1,!1,{start:Ea(e,r&&!!ke._startClamp),end:Ea(t,r&&!!ke._endClamp)},n),ke.update()},ke.adjustPinSpacing=function(e){if(Z&&e){var t=Z.indexOf(he.d)+1;Z[t]=parseFloat(Z[t])+e+xt,Z[1]=parseFloat(Z[1])+e+xt,Pt(Z)}},ke.disable=function(e,t){if(ke.enabled&&(!1!==e&&ke.revert(!0,!0),ke.enabled=ke.isActive=!1,t||ee&&ee.pause(),re=0,n&&(n.uncache=1),Te&&yb(ScrollTrigger,"refreshInit",Te),te&&(te.pause(),A.tween&&A.tween.kill()&&(A.tween=0)),!me)){for(var r=kt.length;r--;)if(kt[r].scroller===be&&kt[r]!==ke)return;yb(be,"resize",Mb),me||yb(be,"scroll",Kb)}},ke.kill=function(e,t){ke.disable(e,t),ee&&!t&&ee.kill(),a&&delete Tt[a];var r=kt.indexOf(ke);0<=r&&kt.splice(r,1),r===je&&0o&&(b()>o?a.progress(1)&&b(o):a.resetTo("scrollY",o))}Wa(e)||(e={}),e.preventDefault=e.isNormalizer=e.allowClicks=!0,e.type||(e.type="wheel,touch"),e.debounce=!!e.debounce,e.id=e.id||"normalizer";var n,o,l,i,a,c,u,s,f=e.normalizeScrollX,t=e.momentum,r=e.allowNestedScroll,d=e.onRelease,p=J(e.target)||Ue,g=Ne.core.globals().ScrollSmoother,h=g&&g.get(),v=R&&(e.content&&J(e.content)||h&&!1!==e.content&&!h.smooth()&&h.content()),b=L(p,qe),m=L(p,He),y=1,x=(E.isTouch&&Xe.visualViewport?Xe.visualViewport.scale*Xe.visualViewport.width:Xe.outerWidth)/Xe.innerWidth,_=0,w=Ua(t)?function(){return t(n)}:function(){return t||2.8},S=yc(p,e.type,!0,r),k=Ia,T=Ia;return v&&Ne.set(v,{y:"+=0"}),e.ignoreCheck=function(e){return R&&"touchmove"===e.type&&function ignoreDrag(){if(i){requestAnimationFrame(Gq);var e=Ja(n.deltaY/2),t=T(b.v-e);if(v&&t!==b.v+b.offset){b.offset=t-b.v;var r=Ja((parseFloat(v&&v._gsap.y)||0)-b.offset);v.style.transform="matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, "+r+", 0, 1)",v._gsap.y=r+"px",b.cacheID=ze.cache,Z()}return!0}b.offset&&Kq(),i=!0}()||1.05=o||o-1<=r)&&Ne.to({},{onUpdate:Qq,duration:i})}else s.restart(!0);d&&d(e)},e.onWheel=function(){a._ts&&a.pause(),1e3a;)s=s._prev;return s?(e._next=s._next,s._next=e):(e._next=t[r],t[r]=e),e._next?e._next._prev=e:t[i]=e,e._prev=s,e.parent=e._dp=t,e}function za(t,e,r,i){void 0===r&&(r="_first"),void 0===i&&(i="_last");var n=e._prev,a=e._next;n?n._next=a:t[r]===e&&(t[r]=a),a?a._prev=n:t[i]===e&&(t[i]=n),e._next=e._prev=e.parent=null}function Aa(t,e){t.parent&&(!e||t.parent.autoRemoveChildren)&&t.parent.remove&&t.parent.remove(t),t._act=0}function Ba(t,e){if(t&&(!e||e._end>t._dur||e._start<0))for(var r=t;r;)r._dirty=1,r=r.parent;return t}function Da(t,e,r,i){return t._startAt&&(L?t._startAt.revert(ht):t.vars.immediateRender&&!t.vars.autoRevert||t._startAt.render(e,!0,i))}function Fa(t){return t._repeat?Tt(t._tTime,t=t.duration()+t._rDelay)*t:0}function Ha(t,e){return(t-e._start)*e._ts+(0<=e._ts?0:e._dirty?e.totalDuration():e._tDur)}function Ia(t){return t._end=ja(t._start+(t._tDur/Math.abs(t._ts||t._rts||U)||0))}function Ja(t,e){var r=t._dp;return r&&r.smoothChildTiming&&t._ts&&(t._start=ja(r._time-(0U)&&e.render(r,!0)),Ba(t,e)._dp&&t._initted&&t._time>=t._dur&&t._ts){if(t._dur(n=Math.abs(n))&&(a=i,o=n);return a}function ub(t){return Aa(t),t.scrollTrigger&&t.scrollTrigger.kill(!!L),t.progress()<1&&Pt(t,"onInterrupt"),t}function xb(t){if(t)if(t=!t.name&&t.default||t,x()||t.headless){var e=t.name,r=s(t),i=e&&!r&&t.init?function(){this._props=[]}:t,n={init:T,render:ue,add:Vt,kill:de,modifier:he,rawVars:0},a={targetTest:0,get:0,getSetter:ie,aliases:{},register:0};if(Ft(),t!==i){if(pt[e])return;ra(i,ra(va(t,n),a)),yt(i.prototype,yt(n,va(t,a))),pt[i.prop=e]=i,t.targetTest&&(gt.push(i),ft[e]=1),e=("css"===e?"CSS":e.charAt(0).toUpperCase()+e.substr(1))+"Plugin"}S(e,i),t.register&&t.register(ze,i,ge)}else Ct.push(t)}function Ab(t,e,r){return(6*(t+=t<0?1:1>16,e>>8&St,e&St]:0:Dt.black;if(!p){if(","===e.substr(-1)&&(e=e.substr(0,e.length-1)),Dt[e])p=Dt[e];else if("#"===e.charAt(0)){if(e.length<6&&(e="#"+(n=e.charAt(1))+n+(a=e.charAt(2))+a+(s=e.charAt(3))+s+(5===e.length?e.charAt(4)+e.charAt(4):"")),9===e.length)return[(p=parseInt(e.substr(1,6),16))>>16,p>>8&St,p&St,parseInt(e.substr(7),16)/255];p=[(e=parseInt(e.substr(1),16))>>16,e>>8&St,e&St]}else if("hsl"===e.substr(0,3))if(p=c=e.match(tt),r){if(~e.indexOf("="))return p=e.match(et),i&&p.length<4&&(p[3]=1),p}else o=+p[0]%360/360,u=p[1]/100,n=2*(h=p[2]/100)-(a=h<=.5?h*(u+1):h+u-h*u),3=N?u.endTime(!1):t._dur;return r(e)&&(isNaN(e)||e in o)?(a=e.charAt(0),s="%"===e.substr(-1),n=e.indexOf("="),"<"===a||">"===a?(0<=n&&(e=e.replace(/=/,"")),("<"===a?u._start:u.endTime(0<=u._repeat))+(parseFloat(e.substr(1))||0)*(s?(n<0?u:i).totalDuration()/100:1)):n<0?(e in o||(o[e]=h),o[e]):(a=parseFloat(e.charAt(n-1)+e.substr(n+1)),s&&i&&(a=a/100*($(i)?i[0]:i).totalDuration()),1=r&&te)return i;i=i._next}else for(i=t._last;i&&i._start>=r;){if("isPause"===i.data&&i._start=n._start)&&n._ts&&h!==n){if(n.parent!==this)return this.render(t,e,r);if(n.render(0=this.totalDuration()||!v&&_)&&(f!==this._start&&Math.abs(l)===Math.abs(this._ts)||this._lock||(!t&&g||!(v===m&&0=i&&(a instanceof Jt?e&&n.push(a):(r&&n.push(a),t&&n.push.apply(n,a.getChildren(!0,e,r)))),a=a._next;return n},e.getById=function getById(t){for(var e=this.getChildren(1,1,1),r=e.length;r--;)if(e[r].vars.id===t)return e[r]},e.remove=function remove(t){return r(t)?this.removeLabel(t):s(t)?this.killTweensOf(t):(t.parent===this&&za(this,t),t===this._recent&&(this._recent=this._last),Ba(this))},e.totalTime=function totalTime(t,e){return arguments.length?(this._forcing=1,!this._dp&&this._ts&&(this._start=ja(Rt.time-(0r:!r||s.isActive())&&n.push(s):(i=s.getTweensOf(a,r)).length&&n.push.apply(n,i),s=s._next;return n},e.tweenTo=function tweenTo(t,e){e=e||{};var r,i=this,n=xt(i,t),a=e.startAt,s=e.onStart,o=e.onStartParams,u=e.immediateRender,h=Jt.to(i,ra({ease:e.ease||"none",lazy:!1,immediateRender:!1,time:n,overwrite:"auto",duration:e.duration||Math.abs((n-(a&&"time"in a?a.time:i._time))/i.timeScale())||U,onStart:function onStart(){if(i.pause(),!r){var t=e.duration||Math.abs((n-(a&&"time"in a?a.time:i._time))/i.timeScale());h._dur!==t&&Sa(h,t,0,1).render(h._time,!0,!0),r=1}s&&s.apply(h,o||[])}},e));return u?h.render(0):h},e.tweenFromTo=function tweenFromTo(t,e,r){return this.tweenTo(e,ra({startAt:{time:xt(this,t)}},r))},e.recent=function recent(){return this._recent},e.nextLabel=function nextLabel(t){return void 0===t&&(t=this._time),sb(this,xt(this,t))},e.previousLabel=function previousLabel(t){return void 0===t&&(t=this._time),sb(this,xt(this,t),1)},e.currentLabel=function currentLabel(t){return arguments.length?this.seek(t,!0):this.previousLabel(this._time+U)},e.shiftChildren=function shiftChildren(t,e,r){void 0===r&&(r=0);for(var i,n=this._first,a=this.labels;n;)n._start>=r&&(n._start+=t,n._end+=t),n=n._next;if(e)for(i in a)a[i]>=r&&(a[i]+=t);return Ba(this)},e.invalidate=function invalidate(t){var e=this._first;for(this._lock=0;e;)e.invalidate(t),e=e._next;return i.prototype.invalidate.call(this,t)},e.clear=function clear(t){void 0===t&&(t=!0);for(var e,r=this._first;r;)e=r._next,this.remove(r),r=e;return this._dp&&(this._time=this._tTime=this._pTime=0),t&&(this.labels={}),Ba(this)},e.totalDuration=function totalDuration(t){var e,r,i,n=0,a=this,s=a._last,o=N;if(arguments.length)return a.timeScale((a._repeat<0?a.duration():a.totalDuration())/(a.reversed()?-t:t));if(a._dirty){for(i=a.parent;s;)e=s._prev,s._dirty&&s.totalDuration(),o<(r=s._start)&&a._sort&&s._ts&&!a._lock?(a._lock=1,La(a,s,r-s._delay,1)._lock=0):o=r,r<0&&s._ts&&(n-=r,(!i&&!a._dp||i&&i.smoothChildTiming)&&(a._start+=r/a._ts,a._time-=r,a._tTime-=r),a.shiftChildren(-r,!1,-Infinity),o=0),s._end>n&&s._ts&&(n=s._end),s=e;Sa(a,a===I&&a._time>n?a._time:n,1,1),a._dirty=0}return a._tDur},Timeline.updateRoot=function updateRoot(t){if(I._ts&&(oa(I,Ha(t,I)),f=Rt.frame),Rt.frame>=mt){mt+=X.autoSleep||120;var e=I._first;if((!e||!e._ts)&&X.autoSleep&&Rt._listeners.length<2){for(;e&&!e._ts;)e=e._next;e||Rt.sleep()}}},Timeline}(Nt);ra(Qt.prototype,{_lock:0,_hasPause:0,_forcing:0});function bc(t,e,i,n,a,o){var u,h,l,f;if(pt[t]&&!1!==(u=new pt[t]).init(a,u.rawVars?e[t]:function _processVars(t,e,i,n,a){if(s(t)&&(t=Gt(t,a,e,i,n)),!v(t)||t.style&&t.nodeType||$(t)||J(t))return r(t)?Gt(t,a,e,i,n):t;var o,u={};for(o in t)u[o]=Gt(t[o],a,e,i,n);return u}(e[t],n,a,o,i),i,n,o)&&(i._pt=h=new ge(i._pt,a,t,0,1,u.render,u,0,u.priority),i!==d))for(l=i._ptLookup[i._targets.indexOf(a)],f=u._props.length;f--;)l[u._props[f]]=h;return u}function hc(t,r,e,i){var n,a,s=r.ease||i||"power1.inOut";if($(r))a=e[t]||(e[t]=[]),r.forEach(function(t,e){return a.push({t:e/(r.length-1)*100,v:t,e:s})});else for(n in r)a=e[n]||(e[n]=[]),"ease"===n||a.push({t:parseFloat(t),v:r[n],e:s})}var Ut,qt,Vt=function _addPropTween(t,e,i,n,a,o,u,h,l,f){s(n)&&(n=n(a||0,t,o));var d,c=t[e],p="get"!==i?i:s(c)?l?t[e.indexOf("set")||!s(t["get"+e.substr(3)])?e:"get"+e.substr(3)](l):t[e]():c,_=s(c)?l?re:te:$t;if(r(n)&&(~n.indexOf("random(")&&(n=pb(n)),"="===n.charAt(1)&&(!(d=ka(p,n)+(Za(p)||0))&&0!==d||(n=d))),!f||p!==n||qt)return isNaN(p*n)||""===n?(c||e in t||Q(e,n),function _addComplexStringPropTween(t,e,r,i,n,a,s){var o,u,h,l,f,d,c,p,_=new ge(this._pt,t,e,0,1,oe,null,n),m=0,g=0;for(_.b=r,_.e=i,r+="",(c=~(i+="").indexOf("random("))&&(i=pb(i)),a&&(a(p=[r,i],t,e),r=p[0],i=p[1]),u=r.match(it)||[];o=it.exec(i);)l=o[0],f=i.substring(m,o.index),h?h=(h+1)%5:"rgba("===f.substr(-5)&&(h=1),l!==u[g++]&&(d=parseFloat(u[g-1])||0,_._pt={_next:_._pt,p:f||1===g?f:",",s:d,c:"="===l.charAt(1)?ka(d,l)-d:parseFloat(l)-d,m:h&&h<4?Math.round:0},m=it.lastIndex);return _.c=m")}),s.duration();else{for(l in u={},x)"ease"===l||"easeEach"===l||hc(l,x[l],u,x.easeEach);for(l in u)for(C=u[l].sort(function(t,e){return t.t-e.t}),o=z=0;o=t._tDur||e<0)&&t.ratio===u&&(u&&Aa(t,1),r||L||(Pt(t,u?"onComplete":"onReverseComplete",!0),t._prom&&t._prom()))}else t._zTime||(t._zTime=e)}(this,t,e,r);return this},e.targets=function targets(){return this._targets},e.invalidate=function invalidate(t){return t&&this.vars.runBackwards||(this._startAt=0),this._pt=this._op=this._onUpdate=this._lazy=this.ratio=0,this._ptLookup=[],this.timeline&&this.timeline.invalidate(t),E.prototype.invalidate.call(this,t)},e.resetTo=function resetTo(t,e,r,i,n){c||Rt.wake(),this._ts||this.play();var a,s=Math.min(this._dur,(this._dp._time-this._start)*this._ts);return this._initted||Wt(this,s),a=this._ease(s/this._dur),function _updatePropTweens(t,e,r,i,n,a,s,o){var u,h,l,f,d=(t._pt&&t._ptCache||(t._ptCache={}))[e];if(!d)for(d=t._ptCache[e]=[],l=t._ptLookup,f=t._targets.length;f--;){if((u=l[f][e])&&u.d&&u.d._pt)for(u=u.d._pt;u&&u.p!==e&&u.fp!==e;)u=u._next;if(!u)return qt=1,t.vars[e]="+=0",Wt(t,s),qt=0,o?R(e+" not eligible for reset"):1;d.push(u)}for(f=d.length;f--;)(u=(h=d[f])._pt||h).s=!i&&0!==i||n?u.s+(i||0)+a*u.c:i,u.c=r-u.s,h.e&&(h.e=ia(r)+Za(h.e)),h.b&&(h.b=u.s+Za(h.b))}(this,t,e,r,i,a,s,n)?this.resetTo(t,e,r,i,1):(Ja(this,0),this.parent||ya(this._dp,this,"_first","_last",this._dp._sort?"_start":0),this.render(0))},e.kill=function kill(t,e){if(void 0===e&&(e="all"),!(t||e&&"all"!==e))return this._lazy=this._pt=0,this.parent?ub(this):this.scrollTrigger&&this.scrollTrigger.kill(!!L),this;if(this.timeline){var i=this.timeline.totalDuration();return this.timeline.killTweensOf(t,e,Ut&&!0!==Ut.vars.overwrite)._first||ub(this),this.parent&&i!==this.timeline.totalDuration()&&Sa(this,this._dur*this.timeline._tDur/i,0,1),this}var n,a,s,o,u,h,l,f=this._targets,d=t?Ot(t):f,c=this._ptLookup,p=this._pt;if((!e||"all"===e)&&function _arraysMatch(t,e){for(var r=t.length,i=r===e.length;i&&r--&&t[r]===e[r];);return r<0}(f,d))return"all"===e&&(this._pt=0),ub(this);for(n=this._op=this._op||[],"all"!==e&&(r(e)&&(u={},ha(e,function(t){return u[t]=1}),e=u),e=function _addAliasesToVars(t,e){var r,i,n,a,s=t[0]?fa(t[0]).harness:0,o=s&&s.aliases;if(!o)return e;for(i in r=yt({},e),o)if(i in r)for(n=(a=o[i].split(",")).length;n--;)r[a[n]]=r[i];return r}(f,e)),l=f.length;l--;)if(~d.indexOf(f[l]))for(u in a=c[l],"all"===e?(n[l]=e,o=a,s={}):(s=n[l]=n[l]||{},o=e),o)(h=a&&a[u])&&("kill"in h.d&&!0!==h.d.kill(u)||za(this,h,"_pt"),delete a[u]),"all"!==s&&(s[u]=1);return this._initted&&!this._pt&&p&&ub(this),this},Tween.to=function to(t,e,r){return new Tween(t,e,r)},Tween.from=function from(t,e){return Wa(1,arguments)},Tween.delayedCall=function delayedCall(t,e,r,i){return new Tween(e,0,{immediateRender:!1,lazy:!1,overwrite:!1,delay:t,onComplete:e,onReverseComplete:e,onCompleteParams:r,onReverseCompleteParams:r,callbackScope:i})},Tween.fromTo=function fromTo(t,e,r){return Wa(2,arguments)},Tween.set=function set(t,e){return e.duration=0,e.repeatDelay||(e.repeat=0),new Tween(t,e)},Tween.killTweensOf=function killTweensOf(t,e,r){return I.killTweensOf(t,e,r)},Tween}(Nt);ra(Jt.prototype,{_targets:[],_lazy:0,_startAt:0,_op:0,_onInit:0}),ha("staggerTo,staggerFrom,staggerFromTo",function(r){Jt[r]=function(){var t=new Qt,e=kt.call(arguments,0);return e.splice("staggerFromTo"===r?5:4,0,0),t[r].apply(t,e)}});function pc(t,e,r){return t.setAttribute(e,r)}function xc(t,e,r,i){i.mSet(t,e,i.m.call(i.tween,r,i.mt),i)}var $t=function _setterPlain(t,e,r){return t[e]=r},te=function _setterFunc(t,e,r){return t[e](r)},re=function _setterFuncWithParam(t,e,r,i){return t[e](i.fp,r)},ie=function _getSetter(t,e){return s(t[e])?te:u(t[e])&&t.setAttribute?pc:$t},ne=function _renderPlain(t,e){return e.set(e.t,e.p,Math.round(1e6*(e.s+e.c*t))/1e6,e)},se=function _renderBoolean(t,e){return e.set(e.t,e.p,!!(e.s+e.c*t),e)},oe=function _renderComplexString(t,e){var r=e._pt,i="";if(!t&&e.b)i=e.b;else if(1===t&&e.e)i=e.e;else{for(;r;)i=r.p+(r.m?r.m(r.s+r.c*t):Math.round(1e4*(r.s+r.c*t))/1e4)+i,r=r._next;i+=e.c}e.set(e.t,e.p,i,e)},ue=function _renderPropTweens(t,e){for(var r=e._pt;r;)r.r(t,r.d),r=r._next},he=function _addPluginModifier(t,e,r,i){for(var n,a=this._pt;a;)n=a._next,a.p===i&&a.modifier(t,e,r),a=n},de=function _killPropTweensOf(t){for(var e,r,i=this._pt;i;)r=i._next,i.p===t&&!i.op||i.op===t?za(this,i,"_pt"):i.dep||(e=1),i=r;return!e},_e=function _sortPropTweensByPriority(t){for(var e,r,i,n,a=t._pt;a;){for(e=a._next,r=i;r&&r.pr>a.pr;)r=r._next;(a._prev=r?r._prev:n)?a._prev._next=a:i=a,(a._next=r)?r._prev=a:n=a,a=e}t._pt=i},ge=(PropTween.prototype.modifier=function modifier(t,e,r){this.mSet=this.mSet||this.set,this.set=xc,this.m=t,this.mt=r,this.tween=e},PropTween);function PropTween(t,e,r,i,n,a,s,o,u){this.t=e,this.s=i,this.c=n,this.p=r,this.r=a||ne,this.d=s||this,this.set=o||$t,this.pr=u||0,(this._next=t)&&(t._prev=this)}ha(vt+"parent,duration,ease,delay,overwrite,runBackwards,startAt,yoyo,immediateRender,repeat,repeatDelay,data,paused,reversed,lazy,callbackScope,stringFilter,id,yoyoEase,stagger,inherit,repeatRefresh,keyframes,autoRevert,scrollTrigger",function(t){return ft[t]=1}),ot.TweenMax=ot.TweenLite=Jt,ot.TimelineLite=ot.TimelineMax=Qt,I=new Qt({sortChildren:!1,defaults:Z,autoRemoveChildren:!0,id:"root",smoothChildTiming:!0}),X.stringFilter=Gb;function Fc(t){return(be[t]||Me).map(function(t){return t()})}function Gc(){var t=Date.now(),o=[];2= OPEN && now.minutes < CLOSE; + var text = isOpen ? 'Jetzt geöffnet · bis 22 Uhr' + : now.minutes < OPEN ? 'Geschlossen · öffnet heute um 12 Uhr' + : 'Geschlossen · öffnet morgen um 12 Uhr'; + $$('[data-open-badge]').forEach(function (el) { + el.textContent = text; + el.classList.toggle('is-open', isOpen); + el.classList.toggle('is-closed', !isOpen); + }); + $$('[data-hours] tr').forEach(function (tr) { + tr.classList.toggle('is-today', parseInt(tr.getAttribute('data-day'), 10) === now.day); + }); + } + updateOpenState(); + setInterval(updateOpenState, 60000); + + /* ---------- Smooth Scroll (Lenis) ---------- */ + var lenis = null; + if (!reduce && window.Lenis) { + lenis = new window.Lenis({ duration: 1.1, smoothWheel: true }); + if (hasGsap) { + lenis.on('scroll', window.ScrollTrigger.update); + window.gsap.ticker.add(function (t) { lenis.raf(t * 1000); }); + window.gsap.ticker.lagSmoothing(0); + } else { + var raf = function (t) { lenis.raf(t); requestAnimationFrame(raf); }; + requestAnimationFrame(raf); + } + } + function navOffset() { return -(($('#nav') || {}).offsetHeight || 0) - 12; } + function scrollToTarget(target) { + if (lenis) lenis.scrollTo(target, { offset: navOffset(), duration: 1.1 }); + else target.scrollIntoView({ behavior: reduce ? 'auto' : 'smooth', block: 'start' }); + } + document.addEventListener('click', function (e) { + var a = e.target.closest && e.target.closest('a[href*="#"]'); + if (!a) return; + var url = new URL(a.href, location.href); + if (url.pathname !== location.pathname || !url.hash) return; + var target = url.hash === '#top' ? document.body : document.getElementById(decodeURIComponent(url.hash.slice(1))); + if (!target) return; + e.preventDefault(); + closeMenu(false); + if (url.hash === '#top') { lenis ? lenis.scrollTo(0) : window.scrollTo({ top: 0, behavior: reduce ? 'auto' : 'smooth' }); } + else scrollToTarget(target); + history.replaceState(null, '', url.hash); + }); + + /* ---------- Navigation ein-/ausblenden ---------- */ + var nav = $('#nav'); + var lastY = window.scrollY; + function onScroll() { + var y = window.scrollY; + if (!nav) return; + if (document.body.classList.contains('menu-open')) { lastY = y; return; } + if (y > 140 && y - lastY > 6) nav.classList.add('is-hidden'); + else if (lastY - y > 6 || y < 140) nav.classList.remove('is-hidden'); + document.body.classList.toggle('nav-visible', !nav.classList.contains('is-hidden') && y > 10); + lastY = y; + } + window.addEventListener('scroll', onScroll, { passive: true }); + + /* ---------- Menü ---------- */ + var btn = $('#menu-btn'), panel = $('#menu-panel'), overlay = $('#menu-overlay'); + function setLabel(txt) { $$('.menu-label', btn).forEach(function (s) { s.textContent = txt; }); } + function openMenu() { + document.body.classList.add('menu-open'); + nav.classList.add('is-open'); + btn.setAttribute('aria-expanded', 'true'); + setLabel('Schließen'); + if (lenis) lenis.stop(); + if (hasGsap && !reduce) { + window.gsap.fromTo($$('li', panel), { y: 18, opacity: 0 }, { y: 0, opacity: 1, duration: .38, stagger: .06, ease: 'power3.out', delay: .14 }); + } + var first = $('a', panel); + if (first) setTimeout(function () { first.focus({ preventScroll: true }); }, 60); + } + function closeMenu(returnFocus) { + if (!document.body.classList.contains('menu-open')) return; + document.body.classList.remove('menu-open'); + nav.classList.remove('is-open'); + btn.setAttribute('aria-expanded', 'false'); + setLabel('Menü'); + if (lenis) lenis.start(); + if (returnFocus !== false) btn.focus({ preventScroll: true }); + } + if (btn && panel) { + btn.addEventListener('click', function () { + document.body.classList.contains('menu-open') ? closeMenu() : openMenu(); + }); + overlay && overlay.addEventListener('click', function () { closeMenu(); }); + document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeMenu(); }); + $$('a', panel).forEach(function (a) { a.addEventListener('click', function () { closeMenu(false); }); }); + } + + /* ---------- Navigation auf dunklen Flächen hell einfärben ---------- */ + var darkEls = $$('[data-nav-dark]'); + if (nav && darkEls.length) { + var checkDark = function () { + var probe = (nav.offsetHeight || 70) / 2; + nav.classList.toggle('is-dark', darkEls.some(function (el) { + var r = el.getBoundingClientRect(); return r.top <= probe && r.bottom >= probe; + })); + }; + window.addEventListener('scroll', checkDark, { passive: true }); + window.addEventListener('resize', checkDark); + checkDark(); + } + + /* ---------- Mobile Bestell-Leiste ---------- */ + var orderbar = $('#orderbar'); + var heroEl = $('.hero') || $('.page-hero'); + if (orderbar && heroEl && 'IntersectionObserver' in window) { + new IntersectionObserver(function (entries) { + orderbar.classList.toggle('is-visible', !entries[0].isIntersecting); + }, { threshold: 0 }).observe(heroEl); + } + + /* ---------- Speisekarte: aktive Kategorie ---------- */ + var catNav = $('.cat-nav'); + if (catNav && 'IntersectionObserver' in window) { + var links = $$('a', catNav); + var list = $('ul', catNav); + var setActive = function (id) { + links.forEach(function (l) { + var on = l.getAttribute('href') === '#' + id; + l.classList.toggle('is-active', on); + if (on) { + l.setAttribute('aria-current', 'true'); + list.scrollTo({ left: l.offsetLeft - list.clientWidth / 2 + l.offsetWidth / 2, behavior: reduce ? 'auto' : 'smooth' }); + } else l.removeAttribute('aria-current'); + }); + }; + var io = new IntersectionObserver(function (entries) { + entries.forEach(function (en) { if (en.isIntersecting) setActive(en.target.id); }); + }, { rootMargin: '-35% 0px -60% 0px' }); + var cats = $$('.menu-cat'); + cats.forEach(function (s) { io.observe(s); }); + window.addEventListener('scroll', function () { + if (cats[0] && cats[0].getBoundingClientRect().top > window.innerHeight * .4) { + links.forEach(function (l) { l.classList.remove('is-active'); l.removeAttribute('aria-current'); }); + } + }, { passive: true }); + } + + /* ---------- Route (Take away) ---------- */ + var route = $('[data-route]'); + var routeState = null; + function buildRoute() { + if (!route) return null; + var svg = $('.route__svg', route), path = $('path', svg), stops = $$('.stop', route); + if (!stops.length || window.getComputedStyle(svg).display === 'none') return null; + var box = route.getBoundingClientRect(); + var pts = stops.map(function (s) { + var r = s.getBoundingClientRect(); + return { x: r.left - box.left + r.width * .5, y: r.top - box.top - 34 }; + }); + var start = { x: Math.max(40, pts[0].x - box.width * .2), y: pts[0].y + 6 }; + var d = 'M' + start.x + ' ' + start.y; + var prev = start; + pts.forEach(function (p, i) { + var dx = p.x - prev.x; + var lift = i % 2 ? 90 : -70; + d += ' C' + (prev.x + dx * .45) + ' ' + (prev.y + lift) + ' ' + (p.x - dx * .45) + ' ' + (p.y - lift) + ' ' + p.x + ' ' + p.y; + prev = p; + }); + path.setAttribute('d', d); + return { path: path, len: path.getTotalLength(), rider: $('.route__rider', route) }; + } + function placeRider(progress) { + if (!routeState) return; + var pt = routeState.path.getPointAtLength(routeState.len * progress); + var ahead = routeState.path.getPointAtLength(Math.min(routeState.len, routeState.len * progress + 4)); + var angle = Math.atan2(ahead.y - pt.y, ahead.x - pt.x) * 180 / Math.PI; + var w = routeState.rider.offsetWidth, h = routeState.rider.offsetHeight; + routeState.rider.style.transform = 'translate(' + (pt.x - w / 2) + 'px,' + (pt.y - h / 2) + 'px) rotate(' + (angle * .25) + 'deg)'; + } + + /* ---------- Ohne GSAP: fertig ---------- */ + if (!hasGsap) { + routeState = buildRoute(); + placeRider(1); + return; + } + + var gsap = window.gsap, ST = window.ScrollTrigger; + gsap.registerPlugin(ST); + var rand = gsap.utils.random; + + function splitWords(el) { + (function walk(node) { + Array.prototype.slice.call(node.childNodes).forEach(function (ch) { + if (ch.nodeType === 3) { + var frag = document.createDocumentFragment(); + ch.textContent.split(/(\s+)/).forEach(function (p) { + if (!p) return; + if (/^\s+$/.test(p)) frag.appendChild(document.createTextNode(p)); + else { var s = document.createElement('span'); s.className = 'pw'; s.textContent = p; frag.appendChild(s); } + }); + ch.parentNode.replaceChild(frag, ch); + } else if (ch.nodeType === 1 && ch.tagName !== 'BR') walk(ch); + }); + })(el); + return $$('.pw', el); + } + function splitChars(el) { + var txt = el.textContent; el.textContent = ''; + var sr = document.createElement('span'); sr.className = 'sr-only'; sr.textContent = txt; el.appendChild(sr); + return txt.split('').map(function (c) { + var s = document.createElement('span'); s.className = 'pl'; s.textContent = c === ' ' ? '\u00a0' : c; + s.setAttribute('aria-hidden', 'true'); s.style.display = 'inline-block'; + el.appendChild(s); return s; + }); + } + + if (reduce) { + routeState = buildRoute(); + placeRider(1); + return; + } + + /* ---- Hero-Intro ---- */ + var hero = $('.hero'); + if (hero) { + var chars = []; + $$('[data-hero-big] .part', hero).forEach(function (p) { chars = chars.concat(splitChars(p)); }); + var burgerImg = $('.hero__burger img', hero); + var tl = gsap.timeline({ delay: .05 }); + tl.set($$('[data-intro]', hero), { opacity: 1 }) + .fromTo('.hero__eyebrow', { y: 24, opacity: 0 }, { y: 0, opacity: 1, duration: .5, ease: 'power3.out' }, 0) + .fromTo(chars, { scale: 0, opacity: 0, y: function () { return rand(40, 100); }, rotation: function () { return rand(-18, 18); }, transformOrigin: '50% 90%' }, + { scale: 1, opacity: 1, y: 0, rotation: 0, duration: .75, stagger: .045, ease: 'back.out(2.2)' }, .05) + .fromTo(burgerImg, { scale: .45, y: 140, rotation: -12, opacity: 0 }, { scale: 1, y: 0, rotation: 0, opacity: 1, duration: 1.1, ease: 'back.out(1.5)' }, .3) + .fromTo('.hero__wm .wm-fill', { xPercent: -30, opacity: 0, rotation: -8 }, { xPercent: 0, opacity: 1, rotation: 0, duration: .8, ease: 'back.out(1.8)' }, .75) + .fromTo($$('[data-sticker]', hero), { '--s': 0 }, { '--s': 1, duration: .6, stagger: .12, ease: 'back.out(3)' }, .9) + .fromTo(['.hero__bottom .lead', '.hero__cta'], { y: 30, opacity: 0 }, { y: 0, opacity: 1, duration: .7, stagger: .1, ease: 'power3.out' }, .8) + .add(function () { + gsap.to(burgerImg, { y: -14, duration: 2.4, yoyo: true, repeat: -1, ease: 'sine.inOut' }); + }); + + if (window.matchMedia('(pointer: fine)').matches) { + var qx = gsap.quickTo(burgerImg, 'x', { duration: .8, ease: 'power3.out' }); + var qr = gsap.quickTo(burgerImg, 'rotation', { duration: .8, ease: 'power3.out' }); + hero.addEventListener('mousemove', function (e) { + var r = hero.getBoundingClientRect(); + var nx = (e.clientX - r.left) / r.width - .5; + qx(nx * 40); qr(nx * 6); + }); + } + + var mm = gsap.matchMedia(); + mm.add('(min-width: 821px)', function () { + var parts = $$('[data-hero-big] .part', hero); + gsap.to(parts[0], { xPercent: -10, ease: 'none', scrollTrigger: { trigger: hero, start: 'top top', end: 'bottom top', scrub: true } }); + gsap.to(parts[1], { xPercent: 12, ease: 'none', scrollTrigger: { trigger: hero, start: 'top top', end: 'bottom top', scrub: true } }); + gsap.to('.hero__burger', { yPercent: -12, ease: 'none', scrollTrigger: { trigger: hero, start: 'top top', end: 'bottom top', scrub: true } }); + }); + } + + /* ---- Seiten-Hero (Unterseiten) ---- */ + var pageHero = $('.page-hero'); + if (pageHero) { + var ph = $('[data-hero-big]', pageHero); + if (ph) { + var pchars = splitChars(ph); + gsap.fromTo(pchars, { scale: 0, opacity: 0, y: function () { return rand(40, 90); }, rotation: function () { return rand(-16, 16); }, transformOrigin: '50% 90%' }, + { scale: 1, opacity: 1, y: 0, rotation: 0, duration: .75, stagger: .05, ease: 'back.out(2.2)', delay: .05 }); + } + var phImg = $('.page-hero__img img', pageHero); + if (phImg) { + gsap.fromTo(phImg, { scale: .5, y: 120, rotation: 10, opacity: 0 }, { scale: 1, y: 0, rotation: 0, opacity: 1, duration: 1.1, ease: 'back.out(1.5)', delay: .25 }); + gsap.to(phImg, { y: -12, duration: 2.4, yoyo: true, repeat: -1, ease: 'sine.inOut', delay: 1.4 }); + } + } + + /* ---- Wort-Pop für Headlines ---- */ + $$('[data-pop]').forEach(function (el) { + var words = splitWords(el); + gsap.fromTo(words, + { opacity: 0, scale: 0, y: function () { return rand(18, 40); }, rotation: function () { return rand(-14, 14); }, transformOrigin: '50% 90%' }, + { opacity: 1, scale: 1, y: 0, rotation: 0, duration: .72, stagger: .06, ease: 'back.out(2.35)', + scrollTrigger: { trigger: el, start: 'top 88%', once: true } }); + }); + + /* ---- Reveal (nutzt translate/opacity, damit CSS-Rotationen bleiben) ---- */ + var reveals = $$('[data-reveal]').filter(function (el) { return !el.closest('.hero'); }); + ST.batch(reveals, { + start: 'top 90%', once: true, + onEnter: function (batch) { + gsap.fromTo(batch, { opacity: 0, '--ry': '40px' }, { opacity: 1, '--ry': '0px', duration: .9, stagger: .1, ease: 'power3.out' }); + } + }); + + /* ---- Sticker "aufkleben" ---- */ + $$('[data-sticker]').filter(function (el) { return !el.closest('.hero'); }).forEach(function (el) { + gsap.fromTo(el, { '--s': 0 }, { '--s': 1, duration: .7, ease: 'back.out(3)', scrollTrigger: { trigger: el, start: 'top 88%', once: true } }); + }); + + /* ---- Parallax Fotoband ---- */ + $$('[data-parallax]').forEach(function (img) { + gsap.fromTo(img, { yPercent: -7 }, { yPercent: 7, ease: 'none', scrollTrigger: { trigger: img.parentNode, start: 'top bottom', end: 'bottom top', scrub: true } }); + }); + + /* ---- Route ---- */ + if (route) { + routeState = buildRoute(); + ST.create({ + trigger: route, start: 'top 75%', end: 'bottom 55%', scrub: .6, + onUpdate: function (self) { placeRider(self.progress); }, + onRefresh: function (self) { routeState = buildRoute(); placeRider(self.progress); } + }); + placeRider(0); + } + + /* ---- Footer: jonglierende Zutaten ---- */ + var jug = $('[data-juggle]'); + if (jug) { + var spots = [9, 33, 60, 84]; + var tls = $$('.juggle', jug).map(function (el, i) { + el.style.left = spots[i % spots.length] + '%'; + var apex = function () { return -Math.min(320, window.innerWidth * rand(.12, .22)); }; + var t = gsap.timeline({ repeat: -1, repeatRefresh: true, delay: i * .35, paused: true }); + t.to(el, { y: apex, rotation: function () { return '+=' + rand(180, 520); }, x: function () { return rand(-30, 30); }, duration: function () { return rand(.8, 1.1); }, ease: 'power2.out' }) + .to(el, { y: 0, duration: function () { return rand(.7, .95); }, ease: 'power2.in' }) + .to(el, { duration: function () { return rand(.15, .7); } }); + return t; + }); + ST.create({ + trigger: jug, start: 'top bottom', end: 'bottom top', + onToggle: function (self) { tls.forEach(function (t) { self.isActive ? t.play() : t.pause(); }); } + }); + document.addEventListener('visibilitychange', function () { + tls.forEach(function (t) { document.hidden ? t.pause() : (ST.isInViewport(jug) && t.play()); }); + }); + } + + window.addEventListener('load', function () { ST.refresh(); }); +})(); diff --git a/datenschutz.html b/datenschutz.html new file mode 100644 index 0000000..2bf7333 --- /dev/null +++ b/datenschutz.html @@ -0,0 +1,167 @@ + + + + + + + Datenschutz – Chickago Boys + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ Rechtliches +

Datenschutz

+
+

Entwurf: Die gelb markierten Angaben ergänzen wir vor der Veröffentlichung. Der Text wird vor dem Livegang rechtlich geprüft.

+ +

1. Verantwortlicher

+

[Vor- und Nachname des Inhabers bzw. Name der Gesellschaft]
+ Chickago Boys Fried Chicken & Burger
+ Merkurstraße 13, 67663 Kaiserslautern
+ Telefon: 0631 3107985 · E-Mail: [E-Mail-Adresse]

+ +

2. Das Wichtigste in Kürze

+

Diese Website setzt keine Cookies, nutzt keine Analyse- oder Tracking-Werkzeuge und lädt keine Inhalte von Drittanbietern nach. Schriften, Bilder und Skripte liegen auf unserem eigenen Webspace. Ein Cookie-Banner ist deshalb nicht nötig.

+ +

3. Hosting und Server-Logfiles

+

Beim Aufruf der Website erfasst der Server unseres Hosters automatisch technische Daten, die dein Browser übermittelt: IP-Adresse, Datum und Uhrzeit des Abrufs, aufgerufene Seite, Referrer-URL, Browsertyp und Betriebssystem. Diese Daten brauchen wir, um die Website auszuliefern und ihre Sicherheit und Stabilität zu gewährleisten. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO. Die Logfiles werden nach [Anzahl] Tagen gelöscht.

+

Hoster: [Name und Anschrift des Hosters]. Mit dem Hoster besteht ein Vertrag zur Auftragsverarbeitung nach Art. 28 DSGVO.

+ +

4. Kontakt per Telefon oder E-Mail

+

Wenn du uns anrufst oder schreibst, verarbeiten wir deine Angaben, um deine Anfrage zu beantworten, etwa eine Reservierung oder eine Frage zu Allergenen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, sofern es um eine Bestellung oder Reservierung geht, sonst Art. 6 Abs. 1 lit. f DSGVO. Wir löschen die Daten, sobald die Anfrage erledigt ist und keine gesetzlichen Aufbewahrungspflichten entgegenstehen.

+ +

5. Bestellungen über Lieferando und Uber Eats

+

Online-Bestellungen laufen über die Plattformen Lieferando und Uber Eats. Für die Bestellung gelten deren Datenschutzhinweise. Von der Plattform erhalten wir nur die Daten, die wir für Zubereitung, Abholung oder Lieferung brauchen, zum Beispiel Name, Lieferadresse, Telefonnummer und Bestellinhalt. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO.

+ +

6. Links zu anderen Anbietern

+

Auf dieser Website verlinken wir auf Lieferando, Uber Eats, Google Maps, Instagram und Facebook. Das sind einfache Links: Erst wenn du darauf klickst, verlässt du unsere Website und der jeweilige Anbieter erhält Daten von dir. Dafür gelten die Datenschutzhinweise des Anbieters.

+ +

7. Deine Rechte

+

Du hast das Recht auf Auskunft (Art. 15 DSGVO), Berichtigung (Art. 16), Löschung (Art. 17), Einschränkung der Verarbeitung (Art. 18), Datenübertragbarkeit (Art. 20) und Widerspruch gegen Verarbeitungen auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO (Art. 21). Wende dich dafür einfach an die oben genannten Kontaktdaten.

+

Außerdem kannst du dich bei einer Datenschutz-Aufsichtsbehörde beschweren, zum Beispiel beim Landesbeauftragten für den Datenschutz und die Informationsfreiheit Rheinland-Pfalz, Hintere Bleiche 34, 55116 Mainz, www.datenschutz.rlp.de.

+ +

Stand: [Datum der Veröffentlichung]

+
+
+
+ + + + + + diff --git a/impressum.html b/impressum.html new file mode 100644 index 0000000..0546a46 --- /dev/null +++ b/impressum.html @@ -0,0 +1,165 @@ + + + + + + + Impressum – Chickago Boys + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ Rechtliches +

Impressum

+
+

Entwurf: Die gelb markierten Angaben ergänzen wir vor der Veröffentlichung mit den Daten des Betreibers.

+ +

Angaben gemäß § 5 DDG

+

[Vor- und Nachname des Inhabers bzw. Name der Gesellschaft mit Rechtsform]
+ Chickago Boys Fried Chicken & Burger
+ Merkurstraße 13
+ 67663 Kaiserslautern

+

[Nur bei Gesellschaften: Vertreten durch …]

+ +

Kontakt

+

Telefon: 0631 3107985
+ E-Mail: [E-Mail-Adresse]

+ +

Umsatzsteuer-ID

+

Umsatzsteuer-Identifikationsnummer gemäß § 27a Umsatzsteuergesetz: [falls vorhanden]

+ +

Registereintrag

+

[Nur falls vorhanden: Registergericht und Registernummer]

+ +

Verbraucherstreitbeilegung

+

Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.

+ +

Bildnachweis

+

Speisenfotos und Logo: Chickago Boys. [Rechte bestätigen]

+ +

Website

+

Konzept, Gestaltung und Umsetzung: WEBklar

+
+
+
+ + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..717e724 --- /dev/null +++ b/index.html @@ -0,0 +1,438 @@ + + + + + + Chickago Boys – Fried Chicken & Burger in Kaiserslautern + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+

+ Fried Chicken & Burger in Kaiserslautern + Knockout +

+
+ US Burger von Chickago Boys mit Cheddar, Spiegelei und Bacon +
+ + Knusprig
paniert + Mild oder
scharf? + +
+
+

Crispy Tenders, Wings mit Punch und Burger, die dich umhauen. Frisch aus der Küche in der Merkurstraße 13 – vor Ort, zum Abholen oder geliefert.

+
+ Öffnungszeiten: täglich 12–22 Uhr + Jetzt bestellen + Speisekarte +
+
+
+ + + + +
+
+ Die Favoriten +

Champions der Karte

+

Knusprig, saftig, ordentlich belegt: drei Gerichte, mit denen du nichts falsch machst.

+ Ganze Karte ansehen + +
+ +
US Burger mit Cheddar, Ei, Bacon und BBQ-Soße auf einem Holzbrett
+ 13,50 € + US Burger + + +
Chicken Burger Home Style mit Honey-Mustard-Soße und Bacon
+ 12,50 € + Honey Mustard Bacon + + +
Chicken Wrap Chickago-Boys mit zwei Crispy-Filets, aufgeschnitten
+ 9,50 € + Chickago Wrap + +
+
+
+ + +
+ +
+
+
+ Round 1 +

Wings mit Punch

+

How many Wings can you handle?
Knusprig frittiert und in einer von vier Saucen geschwenkt – oder klassisch mit Sauce nach Wahl. Jede Portion gibt’s mild oder scharf.

+
+
+ Ein Berg knuspriger Chicken Wings + K.O.
Crunch + +
+
+ +
+
+
Buffalo Red Hot Wings mit Dip
+

Buffalo Red Hot

+

Der Klassiker mit Feuer.

+ 10 Stück · 14,00 € +
+
+
Chipotle Honey BBQ Wings mit Dip
+

Chipotle Honey BBQ

+

Rauchig, süß, klebrig gut.

+ 10 Stück · 14,00 € +
+
+
Teriyaki Wings mit Dip
+

Teriyaki

+

Glasiert mit Teriyaki-Sauce.

+ 10 Stück · 14,00 € +
+
+
Sweet Chili Wings mit Dip
+

Sweet Chili

+

Süß-scharf geschwenkt.

+ 10 Stück · 14,00 € +
+
+ +
+

Chicken Wings
Classic

+

Knusprig, mit Sauce nach Wahl – mild oder scharf.

+
+ 6 Stück8,50 € + 10 Stück11,00 € + 20 Stück22,00 € +
+
+
+
+ + + + + +
+
+
+
+ Main Event +

Fight Night? Bucket Time.

+
+

Für Zocker-Nacht, Betze-Abend oder die ganze Crew: Wings, Filets, Pommes und Cola in einem Bucket. Wings und Filets jeweils mild oder scharf.

+
+ +
+
+ Mittelgewicht +

Bucket

+
    +
  • 20 Wings
  • 5 Filets
  • 2× Pommes
  • 1× Coleslaw
  • Cola 1,0 l
    • +
+
+ 42,00 € + +
+
+ +
+ Schwergewicht +

Party Bucket

+
    +
  • 20 Wings
  • 20 Filets
  • 4× Pommes
  • Cola 1,0 l
    • +
+
+ 68,00 € + +
+
+
+

Lieber einzeln? Tenders gibt’s ab 5 Stück, Menüs mit Pommes und Coleslaw – alles auf der Karte.

+
+
+ + +
+ +
+ Take away +

Hol’s dir. Oder lass kommen.

+

Drei Wege zu deinem Chicken – alle starten in der Merkurstraße 13.

+ +
+ + +
+
+
01
+

Vor Ort essen

+

Restaurant & Bar mit Plätzen drinnen und draußen. Einfach vorbeikommen – mit größerer Gruppe am besten vorher anrufen.

+
+ Route planen + Anrufen +
+
+
+
02
+

Abholen

+

Telefonisch bestellen oder bei Lieferando „Abholung“ wählen – und heiß mitnehmen.

+
+ 0631 3107985 + Lieferando +
+
+
+
03
+

Liefern lassen

+

Keine Lust rauszugehen? Bestell bequem über Lieferando oder Uber Eats und lass es dir bringen.

+
+ Lieferando + Uber Eats +
+
+
+
+
+
+ + +
+ +
+
+ Ring frei +

Komm vorbei

+

Bar & Restaurant mitten in Kaiserslautern: Wings, Burger und kalte Drinks – drinnen oder draußen.

+
+ 4,4 +
+ +
aus 1.620 Bewertungen auf Lieferando
Stand: 30.09.2026 · Bewertungen erhebt und prüft Lieferando.
+
+
+
+ Cheese Burger mit Cheddar und karamellisierten Zwiebeln + Bar &
Restaurant +
+
+
+
+

Adresse

+
Chickago Boys
Merkurstraße 13
67663 Kaiserslautern
+
+ Route + 0631 3107985 +
+
+
+

Öffnungszeiten

+ täglich 12–22 Uhr + + + + + + + + + + + +
Öffnungszeiten
Montag12:00 – 22:00
Dienstag12:00 – 22:00
Mittwoch12:00 – 22:00
Donnerstag12:00 – 22:00
Freitag12:00 – 22:00
Samstag12:00 – 22:00
Sonntag12:00 – 22:00
+

An Feiertagen können die Zeiten abweichen. Liefer- und Abholzeiten siehst du direkt bei Lieferando.

+
+
+
+
+ + +
+ +
+

Hunger?

+ +

Dann ab in den Ring: jetzt online bestellen oder direkt bei uns anrufen.

+
+ Jetzt bestellen + 0631 3107985 +
+
+
+
+ + + + + + diff --git a/speisekarte.html b/speisekarte.html new file mode 100644 index 0000000..10262b9 --- /dev/null +++ b/speisekarte.html @@ -0,0 +1,399 @@ + + + + + + Speisekarte – Chickago Boys Kaiserslautern + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ Speisekarte +

Die Karte

+

Wings, Tenders, Burger, Wraps und Sides – alles mild oder scharf, zum Mitnehmen, geliefert oder direkt bei uns.

+
+
Steakhouse Burger mit Pepper-Jack-Käse und Bacon
+ Mild oder
scharf? +
+ + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Allergene & Zusatzstoffe

+

Informationen zu Allergenen und kennzeichnungspflichtigen Zusatzstoffen bekommst du jederzeit bei uns im Restaurant oder telefonisch unter 0631 3107985. Alle Preise in Euro inklusive gesetzlicher Mehrwertsteuer. Stand: 09/2026.

+
+
+
+ + + + + +