/* Foodie 0.14.121 — spacing, contrast, slider, welcome and motion. */ #foodie { --fd-muted:#56614f; --fd-line:#dfe6d6; } #foodie .fd-main { min-width:0; } #foodie .fd-eyebrow { color:#536047; font-size:11px; line-height:1.5; } #foodie .fd-head { gap:16px; flex-wrap:wrap; align-items:center; margin-bottom:22px; } #foodie .fd-head h2 { line-height:1.25; } #foodie .fd-head__side { gap:12px; } #foodie .fd-home-intro { padding-block:32px 24px; } #foodie .fd-section { padding-block:36px 4px; } #foodie .fd-category-rail { padding-top:8px; padding-bottom:14px; gap:18px; } #foodie .fd-category { gap:9px; } #foodie .fd-category small { margin-top:0; color:#56614f; font-size:11px; } #foodie .fd-arrows { display:flex; } #foodie .fd-arrow { width:40px; height:40px; color:#33451f; } #foodie .fd-arrow:hover:not(:disabled) { background:#e8f0dc; } #foodie .fd-arrow:disabled { opacity:.45; } #foodie .fd-text-link { padding:6px 0; line-height:1.4; } #foodie .fd-text-link:hover { color:#293b17; } #foodie .fd-food-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } #foodie .fd-food { display:grid; grid-template-columns:96px minmax(0,1fr); align-items:start; padding:14px; gap:16px; border-radius:20px; } #foodie .fd-food__image { width:96px; height:112px; aspect-ratio:auto; } #foodie .fd-food__image img { padding:0; height:100%; object-fit:cover; mix-blend-mode:normal; } #foodie .fd-food__body { padding:0; min-width:0; min-height:112px; } #foodie .fd-food__body > strong { font-size:15px; line-height:1.4; } #foodie .fd-food__desc { font-size:12px; line-height:1.5; margin-top:7px; } #foodie .fd-food__foot { padding-top:12px; gap:10px; } #foodie .fd-food__go { width:36px; height:36px; flex:none; } #foodie .fd-food:hover { border-color:#9bb57a; box-shadow:0 12px 30px #253b1312; } #foodie .fd-food:hover .fd-food__go { background:#476222; color:#fff; } #foodie .fd-discover { padding-top:32px; gap:20px; } #foodie .fd-discover__card { padding:28px; gap:20px; } #foodie .fd-discover__copy { gap:12px; } #foodie .fd-discover__copy small { font-size:10px; } #foodie .fd-discover__copy > span { font-size:13px; line-height:1.5; } #foodie .fd-discover__card:hover { box-shadow:0 12px 30px #3b4b1714; } #foodie .fd-discover__card:hover .fd-discover__icon { rotate:-8deg; } #foodie .fd-visit { padding-block:40px; margin-top:36px; } #foodie .fd-week,#foodie .fd-week--light { color:#26341f; background:#fff; padding:14px 22px; } #foodie .fd-week__row { padding:13px 0; font-size:14px; line-height:1.5; gap:16px; color:#26341f; } #foodie .fd-week__row.is-today { background:#f0f6e6; color:#354d19; padding-inline:10px; } #foodie .fd-week__row em { display:inline-block; margin:0 0 0 8px; color:#36511d; } #foodie .fd-services { gap:10px; line-height:1.4; } #foodie .fd-services li { padding:8px 12px; font-size:13px; } #foodie .fd-visit__intro > .fd-status { color:#35482a; font-size:14px; line-height:1.5; } #foodie .fd-contact__grid { gap:36px 44px; } #foodie .fd-contact__block h2 { margin-bottom:20px; line-height:1.3; } #foodie .fd-rows a { padding:18px; gap:16px; } #foodie .fd-rows a:hover { background:#edf3e5; color:#26371d; } #foodie .fd-rows__copy strong { line-height:1.5; } #foodie .fd-banner__copy { padding:44px; color:#fff; } #foodie .fd-banner__copy h1 { color:#fff; line-height:1.2; } #foodie .fd-banner__copy p { color:#f1f7e8; line-height:1.6; } #foodie .fd-banner__actions { gap:14px; margin-top:24px; } #foodie .fd-banner__actions .fd-btn--light { background:#fff; color:#293a1e; } #foodie .fd-banner__actions .fd-btn--light:hover { background:#e8f3d5; color:#203214; } #foodie .fd-footer { padding-block:48px 28px; margin-top:0; } #foodie .fd-footer__grid { gap:32px; } #foodie .fd-footer__brand p,#foodie .fd-footer__today span,#foodie .fd-footer__bottom { color:#dce7d4; } #foodie .fd-footer__col h2 { margin-bottom:18px; } #foodie .fd-footer__list { gap:14px; } #foodie .fd-footer .fd-btn--accent { color:#263717; background:#c2e879; } #foodie .fd-footer .fd-btn--accent:hover { color:#1c2e0d; background:#d4f297; } #foodie .fd-btn--outline:hover,#foodie .fd-btn--ghost:hover { background:#edf3e5; color:#273c18; } #foodie .fd-header__account:hover { background:#e7efd9; color:#283c16; } #foodie .fd-nav__link:hover { background:#edf3e4; color:#354e19; } #foodie .fd-link--brand:hover { color:#293f13; } #foodie .fd-auth__pitch .fd-eyebrow { color:#ecf7df; } #foodie .fd-auth__pitch > p:last-child { line-height:1.7; } #foodie .fd-auth__panel { padding:12px 4px 24px; } #foodie .fd-auth__form h2 { line-height:1.25; } #foodie .fd-auth__form > .fd-muted { margin-top:10px; margin-bottom:24px; } #foodie .fd-segmented button { padding:10px 12px; min-height:46px; } #foodie .fd-form { gap:20px; } #foodie .fd-field { gap:8px; } #foodie .fd-field > span,#foodie .fd-field > label { font-size:13px; color:#34412b; } #foodie .fd-form__row { gap:14px; } #foodie .fd-check,#foodie .fd-form__row .fd-link { font-size:12px; } #foodie .fd-card { padding:26px; } #foodie .fd-card__head { flex-wrap:wrap; gap:12px; } #foodie .fd-toc a:hover { background:#eaf2dd; color:#30491b; } #foodie .fd-map__label:hover { background:#edf4e3; color:#293d19; } /* v0.14.246: not on elements focused by script only (tabindex=-1, WooCommerce notices) */ #foodie :focus-visible:not([tabindex="-1"]) { outline:3px solid #648437; outline-offset:4px; } /* The panels share a grid cell; height follows the longest actual content. */ .fd-slider { position:relative; } .fd-slider__track { display:grid; border-radius:28px; overflow:hidden; background:#3b5420; } #foodie .fd-slide { grid-area:1/1; width:100%; margin:0; min-height:360px; border-radius:0; opacity:0; visibility:hidden; translate:24px 0; pointer-events:none; transition:opacity .6s ease,translate .6s cubic-bezier(.2,.65,.3,1),visibility .6s; } #foodie .fd-slide.is-active { opacity:1; visibility:visible; translate:0; pointer-events:auto; } #foodie .fd-promo__copy { padding:44px 0 44px 44px; } #foodie .fd-promo__eyebrow { color:#eaf7d6; font-size:11px; line-height:1.5; } #foodie .fd-promo h2 { color:#fff; margin:16px 0; line-height:1.13; } #foodie .fd-promo__text { color:#edf5e3; font-size:15px; line-height:1.65; } #foodie .fd-promo__button { color:#263b19; background:#fff; } #foodie .fd-promo__button:hover { color:#223612; background:#e9f5d5; } #foodie .fd-slide--cream { background:linear-gradient(120deg,#f7f1e3,#e7efdc); } #foodie .fd-slide--cream :is(h2,.fd-promo__eyebrow) { color:#2c401d; } #foodie .fd-slide--cream .fd-promo__text { color:#48563d; } #foodie .fd-slide--cream .fd-btn { margin-top:22px; } #foodie .fd-slide--cream .fd-btn--brand { color:#fff; } #foodie .fd-slide--forest { background:linear-gradient(115deg,#263d20,#536f34); } .fd-slide__dish img { width:260px; height:260px; max-width:80%; object-fit:cover; border-radius:50%; border:10px solid #ffffff70; filter:drop-shadow(0 16px 24px #263a1829); } .fd-slide__dish > .ti { font-size:140px; color:#57753a; } .fd-slide__location > .ti { font-size:140px; color:#d0ed9a; filter:drop-shadow(0 12px 14px #10230b30); animation:fd-float 5s ease-in-out infinite; } .fd-slider__controls { display:flex; gap:16px; align-items:center; justify-content:space-between; padding:14px 4px 0; } .fd-slider__dots { display:flex; align-items:center; gap:4px; } .fd-slider__dots button { width:34px; height:34px; padding:0; border:0; border-radius:50%; background:transparent; display:grid; place-items:center; } .fd-slider__dots button::before { content:""; width:8px; height:8px; border-radius:999px; background:#a1ae91; transition:width .3s,background .3s; } .fd-slider__dots button[aria-current]::before { width:24px; background:#496626; } .fd-slider__buttons { display:flex; gap:8px; } .fd-slider__buttons button { display:grid; place-items:center; width:40px; height:40px; padding:0; background:#f2f6ea; color:#344e1b; border:1px solid #dfe7d4; border-radius:50%; } .fd-slider__buttons button:hover { background:#dcebc5; color:#263b15; } .fd-spark { position:absolute; z-index:2; font-size:25px; color:#e2f5bb; animation:fd-twinkle 4s ease-in-out infinite; } .fd-spark--one { top:22%; left:12%; }.fd-spark--two { bottom:18%; right:12%; animation-delay:1.4s; } .fd-orbit { position:absolute; border:1px solid #c7e8a74a; border-radius:50%; width:250px; height:250px; animation:fd-orbit 14s linear infinite; } .fd-orbit::before { content:""; position:absolute; top:20px; left:30px; width:14px; height:14px; border-radius:50%; background:#c5e9a1; } .fd-orbit--two { width:190px; height:190px; animation-direction:reverse; animation-duration:11s; } @keyframes fd-float { 0%,100% { translate:0 0; } 50% { translate:0 -12px; } } @keyframes fd-twinkle { 0%,100% { opacity:.5; scale:.8; rotate:0deg; } 50% { opacity:1; scale:1.15; rotate:25deg; } } @keyframes fd-orbit { to { rotate:360deg; } } #foodie .fd-slide.is-active .fd-promo__art > img { animation:fd-float 5s ease-in-out infinite; } #foodie .fd-auth__rider { animation:fd-float 6s ease-in-out infinite; } #foodie .fd-discover__icon { transition:rotate .5s ease; } #foodie .fd-status.is-open .fd-status__dot { animation:fd-dot 3s ease-in-out infinite; } @keyframes fd-dot { 50% { box-shadow:0 0 0 6px #39954d13; } } /* Progressive enhancement: static content stays visible if scripts fail. */ #foodie.fd-motion-ready [data-fd-reveal] { transition:opacity .65s ease,translate .65s cubic-bezier(.2,.7,.25,1); transition-delay:var(--fd-reveal-delay,0ms); } #foodie.fd-motion-ready [data-fd-reveal]:not(.fd-is-revealed) { opacity:0; translate:0 18px; } #foodie.fd-motion-ready [data-fd-reveal].fd-is-revealed { opacity:1; translate:0 0; } @media(hover:hover) { #foodie .fd-category:hover,#foodie .fd-discover__card:hover { translate:0 -3px; } #foodie .fd-btn:hover .ti,#foodie .fd-text-link:hover .ti { translate:3px 0; } } #foodie :is(.fd-btn .ti,.fd-text-link .ti,.fd-category,.fd-discover__card) { transition:translate .25s ease; } /* Welcome animation is session-scoped, skippable and never used at checkout. */ #foodie .fd-splash { position:fixed; z-index:2147483646; inset:0; display:grid; place-items:center; background:#f3f6ed; opacity:0; visibility:hidden; transition:opacity .3s,visibility .3s; } #foodie .fd-splash.is-visible { opacity:1; visibility:visible; animation:fd-splash-failsafe 2.3s forwards; } #foodie .fd-splash.is-leaving { opacity:0; visibility:hidden; pointer-events:none; } .fd-splash__scene { position:relative; display:flex; flex-direction:column; align-items:center; gap:18px; width:min(360px,85vw); } .fd-splash__rider { width:220px; height:185px; object-fit:contain; animation:fd-splash-arrive 1s cubic-bezier(.2,.7,.2,1) both; } .fd-splash__road { position:absolute; top:155px; width:160px; height:8px; border-radius:50%; background:#dbe6cc; } .fd-splash__name { display:flex; align-items:center; gap:7px; max-width:100%; text-align:center; font-size:32px; line-height:1.3; font-weight:750; letter-spacing:-1px; color:#354e21; } .fd-splash__name span { color:#779f37; font-size:18px; } .fd-splash__scene p { color:#526146; font-size:12px; line-height:1.6; text-align:center; } .fd-splash__progress { width:100px; height:3px; overflow:hidden; border-radius:999px; background:#dce6cd; } .fd-splash__progress::after { content:""; display:block; height:100%; background:#7f9f45; transform-origin:left; animation:fd-splash-progress 1.8s linear both; } .fd-splash__skip { position:absolute; bottom:max(30px,env(safe-area-inset-bottom)); right:24px; display:flex; align-items:center; gap:8px; padding:12px 18px; border:1px solid #cedabd; border-radius:999px; color:#334a22; background:#fff; font-size:12px; } .fd-splash__skip:hover { background:#e8f0dd; } @keyframes fd-splash-arrive { from { opacity:0; translate:-160px 0; rotate:-8deg; } to { opacity:1; translate:0; rotate:0deg; } } @keyframes fd-splash-progress { from { scale:0 1; } to { scale:1 1; } } @keyframes fd-splash-failsafe { 0%,85% { opacity:1; visibility:visible; } 100% { opacity:0; visibility:hidden; pointer-events:none; } } @media(max-width:768px) { #foodie { --fd-gutter:18px; } #foodie .fd-home-intro { padding-block:24px 20px; } #foodie .fd-section { padding-block:28px 4px; } #foodie .fd-head h2 { font-size:19px; } #foodie .fd-head .fd-eyebrow { font-size:9px; } #foodie .fd-head .fd-text-link { font-size:12px; } #foodie .fd-head__side { gap:10px; } #foodie .fd-category-rail { grid-auto-columns:78px; gap:14px; } #foodie .fd-category strong { font-size:11px; line-height:1.4; } #foodie .fd-category small { font-size:10px; } #foodie .fd-category__image { width:72px; height:68px; } #foodie .fd-arrow { width:36px; height:36px; } #foodie .fd-food-grid { gap:12px; } #foodie .fd-food { grid-template-columns:48px minmax(0,1fr); gap:8px; padding:10px; position:relative; padding-bottom:46px; } #foodie .fd-food__image { width:48px; height:66px; border-radius:10px; } #foodie .fd-food__body { min-height:66px; } #foodie .fd-food__body > strong { font-size:12px; line-height:1.4; } #foodie .fd-food__desc { font-size:10px; margin-top:5px; -webkit-line-clamp:2; } #foodie .fd-food__foot { position:absolute; bottom:10px; left:10px; right:10px; padding:0; } #foodie .fd-food .fd-price { font-size:12px; } #foodie .fd-food__go { width:30px; height:30px; } #foodie .fd-discover { grid-template-columns:1fr; gap:14px; } #foodie .fd-discover__card { min-height:166px; padding:24px; } #foodie .fd-discover__copy strong { font-size:22px; line-height:1.25; } #foodie .fd-discover__copy small { font-size:9px; } #foodie .fd-discover__copy > span { font-size:12px; } #foodie .fd-discover__icon { position:static; font-size:72px; opacity:.35; } #foodie .fd-visit { padding-block:32px; } #foodie .fd-week__row { font-size:13px; gap:12px; } #foodie .fd-week { padding:12px 16px; } #foodie .fd-banner__copy { padding:28px 22px; } #foodie .fd-banner__actions { gap:12px; } #foodie .fd-banner__actions .fd-btn { flex:1 1 120px; min-height:44px; } #foodie .fd-contact__grid { gap:30px; } #foodie .fd-footer { padding-bottom:32px; } #foodie .fd-footer__bottom { flex-direction:column; align-items:flex-start; gap:16px; margin-top:30px; } #foodie .fd-footer__legal { gap:20px; flex-wrap:wrap; } #foodie .fd-auth__pitch { padding:26px 0 26px 22px; } #foodie .fd-auth__pitch .fd-eyebrow { font-size:8px; } #foodie .fd-auth__pitch > p:last-child { font-size:11px; } #foodie .fd-auth__panel { padding-top:28px; } #foodie .fd-slide { min-height:278px; grid-template-columns:1.25fr .85fr; } #foodie .fd-promo__copy { padding:26px 0 26px 22px; } #foodie .fd-promo h2 { font-size:28px; letter-spacing:-1px; } #foodie .fd-promo__eyebrow { font-size:8px; } #foodie .fd-promo__text { font-size:12px; line-height:1.6; } #foodie .fd-promo__button { font-size:11px; min-height:40px; margin-top:18px; } #foodie .fd-slide--cream .fd-btn--brand { min-height:40px; padding:0 14px; font-size:11px; gap:6px; } .fd-slider__track { border-radius:22px; } .fd-slider__controls { padding-top:10px; } .fd-slide__dish img { width:130px; height:130px; max-width:95%; border-width:5px; } #foodie .fd-slide__dish img { margin-left:0; margin-top:0; } .fd-slide__location > .ti { font-size:82px; } .fd-orbit { width:140px; height:140px; }.fd-orbit--two { width:100px; height:100px; } .fd-spark { font-size:18px; } } @media(max-width:359px) { #foodie { --fd-gutter:12px; } #foodie .fd-food { grid-template-columns:36px minmax(0,1fr); gap:6px; padding:8px 8px 44px; } #foodie .fd-food__image { width:36px; height:58px; } #foodie .fd-food .fd-price { font-size:11px; } #foodie .fd-head__side { flex-wrap:wrap; } #foodie .fd-slide { grid-template-columns:1.35fr .65fr; min-height:290px; } #foodie .fd-promo__copy { padding-left:18px; } #foodie .fd-promo h2 { font-size:25px; } #foodie .fd-promo__art img { max-width:185%; } } @media(prefers-reduced-motion:reduce) { #foodie *,#foodie *::before,#foodie *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } #foodie.fd-motion-ready [data-fd-reveal] { opacity:1; translate:0; } } #foodie .fd-splash[hidden] { display:none; } /* Decorative art stays in its column; hidden controls never reserve space. */ #foodie [hidden] { display:none!important; } #foodie .fd-promo__art { min-width:0; overflow:hidden; } #foodie .fd-promo__art > img { max-width:100%; margin-left:0; } @media(max-width:768px) { #foodie .fd-promo__copy { padding-right:8px; } #foodie .fd-promo__art > img { width:100%; max-width:100%; margin-left:0; } } /* Quiet decorative motion carries the visual style into secondary pages. */ #foodie .fd-banner__frame { position:relative; isolation:isolate; } #foodie .fd-banner__copy { position:relative; z-index:1; } #foodie .fd-banner__frame::after { content:""; position:absolute; right:-80px; top:-80px; width:260px; height:260px; border:1px solid #e4f4c838; border-radius:50%; box-shadow:0 0 0 40px #dcf6b510,0 0 0 80px #dcf6b508; pointer-events:none; animation:fd-float 7s ease-in-out infinite; } #foodie .fd-footer { position:relative; overflow:hidden; } #foodie .fd-footer::before { content:""; position:absolute; right:-40px; top:40px; width:220px; height:290px; border-radius:85% 0 85% 0; background:#c2e87910; rotate:28deg; animation:fd-float 8s ease-in-out infinite; pointer-events:none; } #foodie .fd-footer > .fd-wrap { position:relative; z-index:1; } #foodie .fd-pagehead { position:relative; overflow:hidden; } #foodie .fd-pagehead::after { content:""; position:absolute; right:4%; top:-40px; width:120px; height:120px; border:1px solid #90ae6030; border-radius:50%; pointer-events:none; animation:fd-float 6s ease-in-out infinite; } /* White copy stays above a sufficiently dark green throughout its column. */ #foodie .fd-slide:not(.fd-slide--cream):not(.fd-slide--forest) { background:linear-gradient(112deg,#304719 0%,#496521 60%,#a0c951 100%); } #foodie .fd-auth__visual { background:linear-gradient(135deg,#354f1b 0%,#4d6d28 60%,#94ba4d 100%); } #foodie .fd-btn--brand { background:linear-gradient(110deg,#3d571e,#56742a); color:#fff; } #foodie .fd-btn--brand:hover { background:#304915; color:#fff; } .fd-slider__dots button::before { background:#859777; } @media(max-width:768px) { #foodie .fd-header { background:linear-gradient(110deg,#3d5922,#607f30); } } /* 0.14.122: keyboard visibility, paused artwork and archive navigation. */ #foodie.fd-motion-ready [data-fd-reveal]:focus-within { opacity:1; translate:0; transition:none; } #foodie .fd-slider-paused *,#foodie .fd-slider-paused *::before,#foodie .fd-slider-paused *::after { animation-play-state:paused!important; } #foodie .pagination .nav-links { display:flex; flex-wrap:wrap; gap:8px; margin-block:28px; } #foodie .pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px 14px; border:1px solid #cdd9c1; border-radius:12px; color:#354e21; background:#fff; } #foodie .pagination .current,#foodie .pagination a:hover { background:#3d571e; color:#fff; } @media(min-width:769px) and (max-width:782px) { body#foodie.admin-bar .fd-header { top:46px; } } @media print { #foodie .fd-header,#foodie .fd-footer,#foodie .fd-tabbar,#foodie .fd-splash { display:none!important; } #foodie.fd-motion-ready [data-fd-reveal] { opacity:1!important; translate:0!important; } #foodie { padding-bottom:0; } #foodie .fd-main { padding-top:0; } } /* 0.14.123: shared gutters, consistent inset spacing and quieter supporting content. */ #foodie { --fd-wrap:min(var(--fu-site-width,1140px),calc(100% - (var(--fd-gutter) * 2))); } #foodie .fd-home .fd-section { padding-block:48px 0; } #foodie .fd-category-rail { margin-inline:auto; padding:4px 0 12px; scroll-padding-inline:0; gap:20px; border-radius:0; } #foodie .fd-head { margin-bottom:24px; } #foodie .fd-category { flex:none; } #foodie .fd-favourites .fd-head h2 { max-width:580px; } #foodie .fd-food-grid { gap:20px; } #foodie .fd-food { padding:20px; gap:20px; border-radius:20px; } #foodie .fd-food__image { width:112px; height:120px; border-radius:12px; overflow:hidden; } #foodie .fd-food { grid-template-columns:112px minmax(0,1fr); } #foodie .fd-food__body { min-height:120px; } #foodie .fd-food__body > strong { font-size:17px; font-weight:650; } #foodie .fd-food__desc { font-size:13px; } #foodie .fd-how { margin-block:48px; padding:36px; display:grid; grid-template-columns:1fr 1.25fr; gap:48px; background:#f4f7ee; border:1px solid #e2e9d8; border-radius:24px; } #foodie .fd-how h2 { font-size:clamp(26px,3vw,36px); line-height:1.18; letter-spacing:-1px; margin:10px 0 18px; } #foodie .fd-how__steps { list-style:none; padding:0; margin:0; display:grid; gap:24px; } #foodie .fd-how__steps li { display:flex; gap:16px; align-items:flex-start; } #foodie .fd-how__number { display:grid; place-items:center; flex:0 0 40px; height:40px; border-radius:12px; color:#3d571e; background:#e4edd6; font-size:13px; font-weight:700; } #foodie .fd-how h3 { font-size:16px; line-height:1.4; margin:0 0 5px; } #foodie .fd-how p:not(.fd-eyebrow) { color:#56614f; font-size:14px; line-height:1.6; margin:0; } #foodie .fd-home .fd-visit { width:var(--fd-wrap); margin:0 auto 48px; padding:32px; background:#fff; border:1px solid var(--fd-line); border-radius:24px; } #foodie .fd-visit__grid { width:100%; gap:40px; align-items:start; } #foodie .fd-visit__intro { padding:12px 0; min-width:0; } #foodie .fd-visit__intro h2 { margin-top:10px; line-height:1.25; } #foodie .fd-week,#foodie .fd-week--light { padding:8px; border:1px solid var(--fd-line); border-radius:16px; background:#fff; overflow:hidden; } #foodie .fd-week__row,#foodie .fd-week__row.is-today { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); align-items:center; margin:0; padding:13px 14px; gap:12px; border-radius:0; border:0; min-height:48px; } #foodie .fd-week__row + .fd-week__row { border-top:1px solid #edf0e7; } #foodie .fd-week__row.is-today { border-radius:10px; background:#edf4e2; } #foodie .fd-week__row.is-today + .fd-week__row { border-top-color:transparent; } #foodie .fd-week__row > span { min-width:0; overflow-wrap:anywhere; } #foodie .fd-week__row > span:first-child { display:flex; flex-wrap:wrap; align-items:center; gap:6px; } #foodie .fd-week__row em { margin:0; padding:2px 6px; line-height:1.4; } #foodie .fd-contact__main { padding-block:40px; } #foodie .fd-contact__grid { gap:24px; align-items:stretch; } #foodie .fd-contact__block { padding:28px; border:1px solid var(--fd-line); border-radius:24px; background:#fff; min-width:0; } #foodie .fd-contact__block h2 { margin:0 0 24px; } #foodie .fd-contact__block .fd-rows { margin-bottom:24px; border:1px solid var(--fd-line); border-radius:16px; overflow:hidden; } #foodie .fd-contact__block .fd-rows a { padding:18px 16px; gap:12px; } #foodie .fd-contact__zones { padding-block:8px 40px; } #foodie .fd-contact__map { padding-bottom:32px; } #foodie .fd-footer--compact { padding:0; background:#f4f7ee; color:#435139; border-top:1px solid var(--fd-line); } #foodie .fd-footer--compact::before { display:none; } #foodie .fd-footer--compact .fd-footer__bottom { margin-top:0; padding-block:24px; border:0; color:#435139; } #foodie .fd-footer--compact a { color:#354e21; } @media(max-width:768px) { #foodie .fd-home .fd-section { padding-top:32px; } #foodie .fd-head { margin-bottom:20px; gap:12px; } #foodie .fd-how { margin-block:32px; padding:24px; grid-template-columns:1fr; gap:28px; border-radius:20px; } #foodie .fd-home .fd-visit { padding:20px; margin-bottom:32px; border-radius:20px; } #foodie .fd-visit__grid { gap:24px; } #foodie .fd-food-grid { gap:12px; } #foodie .fd-food { padding:12px; gap:10px; grid-template-columns:56px minmax(0,1fr); border-radius:16px; } #foodie .fd-food__image { width:56px; height:76px; } #foodie .fd-food__body { min-height:76px; } #foodie .fd-food__body > strong { font-size:13px; overflow-wrap:anywhere; } #foodie .fd-food__desc { font-size:11px; } #foodie .fd-contact__main { padding-block:28px; } #foodie .fd-contact__block { padding:20px; border-radius:20px; } #foodie .fd-contact__block h2 { margin-bottom:20px; font-size:21px; } #foodie .fd-week__row,#foodie .fd-week__row.is-today { padding:12px 10px; font-size:12px; gap:8px; } #foodie .fd-contact__grid { gap:20px; } } @media(max-width:768px) { #foodie .fd-food { padding-bottom:54px; } #foodie .fd-food__foot { left:12px; right:12px; bottom:12px; } } @media(max-width:768px) { #foodie .fd-food { grid-template-columns:48px minmax(0,1fr); grid-template-rows:auto 1fr auto; padding:12px; gap:10px; } #foodie .fd-food__body { display:contents; } #foodie .fd-food__body > strong { grid-column:1 / -1; grid-row:1; overflow-wrap:normal; font-size:13px; } #foodie .fd-food__image { grid-column:1; grid-row:2; width:48px; height:64px; } #foodie .fd-food__desc { grid-column:2; grid-row:2; margin:0; -webkit-line-clamp:3; } #foodie .fd-food__foot { position:static; grid-column:1 / -1; grid-row:3; margin:0; padding:0; } } /* 0.14.124 — photographic discovery cards and stable account composition. */ #foodie .fd-category-rail { grid-auto-columns:calc((100% - 48px)/3); gap:24px; padding-block:0 12px; scroll-snap-type:x proximity; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; } #foodie .fd-category { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; isolation:isolate; min-height:286px; padding:24px; gap:6px; overflow:hidden; border-radius:24px; text-align:left; background:#314124; color:#fff; translate:none; } #foodie .fd-category::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(10,19,8,0) 25%,rgba(10,19,8,.3) 50%,rgba(10,19,8,.88) 100%); pointer-events:none; } #foodie .fd-category__image { position:absolute; inset:0; width:100%; height:100%; z-index:-2; border:0; border-radius:0; transform:none; background:#314124; } #foodie .fd-category__image img { width:100%; height:100%; object-fit:cover; mix-blend-mode:normal; border-radius:0; transition:transform .45s ease; } #foodie .fd-category__image .ti { color:#adc38e; font-size:84px; } #foodie .fd-category strong { font-size:24px; font-weight:650; line-height:1.25; letter-spacing:-.5px; color:#fff; } #foodie .fd-category small { margin:0; color:#f0f3e9; font-size:13px; line-height:1.5; } #foodie .fd-category:hover { translate:none; } #foodie .fd-category:hover .fd-category__image { transform:none; } #foodie .fd-category:hover img { transform:scale(1.035); } #foodie .fd-category:focus-visible { outline:3px solid #486524; outline-offset:3px; } #foodie .fd-promo__art > img { filter:none; box-shadow:none; } #foodie .fd-slide__dish img { border:6px solid #fff; box-shadow:none; filter:none; } #foodie .fd-slide__dish .fd-promo__halo { opacity:.3; } #foodie .fd-auth { align-items:start; gap:40px; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); max-width:1140px; padding-block:40px 64px; } #foodie .fd-account-slider { display:block; position:sticky; top:112px; min-height:0; border-radius:28px; padding:0; overflow:hidden; } #foodie .fd-account-slider .fd-slider__track { min-height:520px; } #foodie .fd-account-slider .fd-slide { display:flex; flex-direction:column; justify-content:space-between; padding:0; min-width:0; } #foodie .fd-auth__pitch { padding:36px 32px 0; } #foodie .fd-auth__pitch :is(h1,h2) { font-size:clamp(28px,3vw,40px); font-weight:700; line-height:1.14; letter-spacing:-1.2px; color:#fff; margin:16px 0 0; } #foodie .fd-auth__pitch > p:last-child { margin-top:16px; font-size:14px; line-height:1.65; max-width:34ch; color:#f2f6ea; } #foodie .fd-account-slider .fd-auth__rider { height:290px; width:100%; object-fit:contain; margin:0; filter:none; animation:fd-float 6s ease-in-out infinite; } #foodie .fd-account-art { min-height:290px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; color:#e1f2c2; } #foodie .fd-account-art > .ti { font-size:120px; animation:fd-float 6s ease-in-out infinite; } #foodie .fd-account-art span { display:flex; align-items:center; gap:8px; background:#ffffff14; border:1px solid #ffffff35; color:#fff; padding:12px 18px; border-radius:14px; font-size:13px; } #foodie .fd-account-slider .fd-slider__controls { margin:0; padding:20px 28px; background:#20371330; } #foodie .fd-account-slider [data-fd-slide-to] { background:#ffffff66; } #foodie .fd-account-slider [data-fd-slide-to][aria-current] { background:#e2f5ba; } #foodie .fd-auth__panel { padding:28px; border:1px solid var(--fd-line); border-radius:24px; background:#fff; } #foodie .fd-auth-panels { display:grid; align-items:start; } #foodie .fd-auth-panels > .fd-auth__form { grid-area:1 / 1; min-width:0; transition:opacity .22s ease,translate .22s ease; opacity:1; translate:0; } #foodie .fd-auth-panels > .fd-auth__form[hidden] { display:block!important; visibility:hidden; pointer-events:none; opacity:0; translate:12px 0; } #foodie .fd-auth__panel .fd-segmented { position:relative; isolation:isolate; margin-bottom:28px; padding:5px; border-radius:14px; background:#f1f5eb; gap:0; } #foodie .fd-auth__panel .fd-segmented::before { content:""; position:absolute; z-index:-1; top:5px; bottom:5px; left:5px; width:calc((100% - 10px)/2); border-radius:10px; background:#fff; border:1px solid #dce5d2; transition:transform .25s ease; } #foodie .fd-auth__panel[data-active="register"] .fd-segmented::before { transform:translateX(100%); } #foodie .fd-auth__panel .fd-segmented button { min-height:44px; padding:10px 8px; background:transparent; box-shadow:none; color:#56614f; } #foodie .fd-auth__panel .fd-segmented button[aria-selected="true"] { background:transparent; box-shadow:none; color:#2d421b; } #foodie .fd-auth__panel .fd-form { gap:20px; } #foodie .fd-auth__panel .fd-form__grid { gap:16px; } #foodie .fd-auth__panel .fd-field__control input,#foodie .fd-auth__panel .fd-field > input { border-radius:12px; min-height:48px; } #foodie .fd-auth__panel .fd-form__row--between { flex-wrap:wrap; gap:12px; } @media(max-width:768px) { #foodie .fd-category-rail { grid-auto-columns:78%; gap:16px; } #foodie .fd-category { min-height:264px; padding:22px; border-radius:20px; } #foodie .fd-category strong { font-size:24px; } #foodie .fd-category small { font-size:13px; } #foodie .fd-auth { grid-template-columns:minmax(0,1fr); gap:24px; padding-block:24px 40px; } #foodie .fd-account-slider { position:relative; top:0; border-radius:22px; } #foodie .fd-account-slider .fd-slider__track { min-height:300px; } #foodie .fd-account-slider .fd-slide { display:grid; grid-template-columns:minmax(0,1fr) 38%; align-items:center; } #foodie .fd-auth__pitch { padding:24px 0 24px 24px; } #foodie .fd-auth__pitch :is(h1,h2) { font-size:28px; letter-spacing:-.7px; } #foodie .fd-auth__pitch .fd-eyebrow { font-size:10px; } #foodie .fd-auth__pitch > p:last-child { font-size:12px; } #foodie .fd-account-slider .fd-auth__rider { width:100%; max-width:100%; height:190px; margin:0; } #foodie .fd-account-art { min-height:0; padding:12px; } #foodie .fd-account-art > .ti { font-size:76px; } #foodie .fd-account-art span { display:none; } #foodie .fd-account-slider .fd-slider__controls { padding:14px 20px; } #foodie .fd-auth__panel { width:100%; padding:22px; border-radius:20px; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-category-rail { scroll-behavior:auto; } #foodie .fd-auth__panel .fd-segmented::before { transition:none; } } #foodie .fd-category-rail.is-dragging { scroll-behavior:auto; scroll-snap-type:none; cursor:grabbing; user-select:none; } #foodie .fd-category-rail.is-dragging a { cursor:grabbing; } @media(hover:hover) and (pointer:fine) { #foodie .fd-category-rail { cursor:grab; } } /* 0.14.125 — one document scroll surface and a larger, borderless hero. */ html:has(body#foodie) { overflow-y:scroll!important; overflow-x:clip!important; scrollbar-gutter:stable; scrollbar-width:thin!important; scrollbar-color:#82936f #f2f5ed!important; } body#foodie { overflow-x:clip!important; overflow-y:visible!important; } html:has(body#foodie)::-webkit-scrollbar { width:7px!important; display:block!important; } html:has(body#foodie)::-webkit-scrollbar-track { background:#f2f5ed; } html:has(body#foodie)::-webkit-scrollbar-thumb { background:#82936f; border-radius:999px; border:1px solid #f2f5ed; } #foodie .fd-main { overflow:visible; } #foodie .fd-home > .fd-slider .fd-slider__track { background:transparent; border:0; box-shadow:none; border-radius:32px; isolation:isolate; } #foodie .fd-home .fd-promo { border:0; box-shadow:none; outline:0; } #foodie .fd-home .fd-slide { min-height:480px; } #foodie .fd-home .fd-promo__copy { padding:60px 0 60px 52px; } #foodie .fd-home .fd-promo h2 { font-size:clamp(36px,4.4vw,62px); max-width:13ch; } #foodie .fd-home .fd-promo__text { font-size:17px; max-width:36ch; } #foodie .fd-home .fd-promo__art { padding:24px; } #foodie .fd-home .fd-slide__dish img { border:0; box-shadow:none; } #foodie .fd-story { display:grid; grid-template-columns:1fr 1fr; gap:0; margin-block:48px; border-radius:24px; background:#f4f0e6; overflow:hidden; } #foodie .fd-story__photo { min-height:380px; background:#e7eddf; display:grid; place-items:center; } #foodie .fd-story__photo img { width:100%; height:100%; object-fit:cover; } #foodie .fd-story__photo > .ti { font-size:120px; color:#71864d; } #foodie .fd-story__copy { padding:44px; align-self:center; } #foodie .fd-story h2,#foodie .fd-faq h2 { font-size:clamp(26px,3vw,38px); line-height:1.2; letter-spacing:-1px; margin:12px 0 20px; } #foodie .fd-story__copy > p:not(.fd-eyebrow),#foodie .fd-faq p { color:#536047; line-height:1.7; font-size:15px; } #foodie .fd-story .fd-btn { margin-top:24px; } #foodie .fd-service-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-block:48px; } #foodie .fd-service-cards > a { padding:28px; border:1px solid var(--fd-line); border-radius:20px; background:#fff; color:var(--fd-ink); transition:background .25s,border-color .25s; } #foodie .fd-service-cards > a:hover { background:#f4f7ee; border-color:#a4ba8d; } #foodie .fd-service-cards > a > .ti { display:inline-grid; place-items:center; width:52px; height:52px; background:#edf4e2; color:#486525; border-radius:16px; font-size:28px; } #foodie .fd-service-cards h3 { font-size:22px; margin:20px 0 12px; } #foodie .fd-service-cards p { font-size:14px; line-height:1.65; color:#56614f; } #foodie .fd-service-cards span { display:block; margin-top:24px; color:#486525; font-weight:600; font-size:14px; } #foodie .fd-faq { display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; margin-block:56px; } #foodie .fd-faq__item { border-bottom:1px solid var(--fd-line); } #foodie .fd-faq__item button { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; padding:22px 0; border:0; background:transparent; color:var(--fd-ink); text-align:left; font-size:16px; font-weight:600; } #foodie .fd-faq__item button .ti { transition:rotate .3s; flex:none; } #foodie .fd-faq__item button[aria-expanded="true"] .ti { rotate:45deg; } #foodie .fd-faq__answer { display:grid; grid-template-rows:1fr; opacity:1; transition:grid-template-rows .35s ease,opacity .35s ease; } #foodie .fd-faq__answer > div { overflow:hidden; min-height:0; } #foodie .fd-faq__answer p { margin:0; padding-bottom:22px; } #foodie [data-fd-faq][aria-expanded="false"] + .fd-faq__answer { grid-template-rows:0fr; opacity:0; } #foodie .fd-account-slider { background:#263e21; } #foodie .fd-account-slider .fd-slide { display:flex; flex-direction:column; background:transparent; } #foodie .fd-account-slider .fd-slider__track { background:transparent; border-radius:0; min-height:540px; } #foodie .fd-account-photo { margin:28px 28px 0; height:260px; border-radius:18px; overflow:hidden; background:#dbe7cc; display:grid; place-items:center; } #foodie .fd-account-photo img { width:100%; height:100%; object-fit:cover; } #foodie .fd-account-photo > .ti { font-size:100px; color:#607947; } #foodie .fd-account-slider .fd-slider__controls { padding:18px 24px; background:transparent; } #foodie .fd-account-slider .fd-slider__dots button { background:transparent; border:0; box-shadow:none; } #foodie .fd-account-slider .fd-slider__dots button::before { background:#ffffff60; width:6px; height:6px; } #foodie .fd-account-slider .fd-slider__dots button[aria-current]::before { background:#c2e879; width:20px; } #foodie .fd-account-slider .fd-slider__buttons button { border-radius:10px; border:1px solid #ffffff40; background:transparent; color:#fff; } #foodie .fd-account-slider .fd-slider__buttons button:hover { background:#ffffff18; } #foodie .fd-auth__panel input::placeholder { color:#66705e; opacity:1; font-size:14px; } #foodie .fd-auth__panel .fd-field { gap:0; } #foodie .fd-mobile-menu { transition:opacity .2s ease,translate .2s ease,display .2s allow-discrete; } @starting-style { #foodie .fd-mobile-menu:not([hidden]) { opacity:0; translate:0 -8px; } } @media(max-width:768px) { #foodie .fd-home .fd-slide { min-height:390px; } #foodie .fd-home .fd-promo__copy { padding:32px 0 32px 24px; } #foodie .fd-home .fd-promo h2 { font-size:32px; } #foodie .fd-home .fd-promo__text { font-size:13px; } #foodie .fd-home .fd-promo__art { padding:8px; } #foodie .fd-home > .fd-slider .fd-slider__track { border-radius:24px; } #foodie .fd-story { grid-template-columns:1fr; margin-block:32px; border-radius:20px; } #foodie .fd-story__photo { min-height:0; height:250px; position:relative; overflow:hidden; } #foodie .fd-story__photo img { position:absolute; inset:0; height:100%; } #foodie .fd-story__copy { padding:28px; } #foodie .fd-service-cards { margin-block:32px; grid-template-columns:1fr; gap:16px; } #foodie .fd-faq { grid-template-columns:1fr; gap:16px; margin-block:32px; } #foodie .fd-account-slider .fd-slider__track { min-height:460px; } #foodie .fd-account-slider .fd-auth__pitch { padding:28px 28px 0; } #foodie .fd-account-photo { height:200px; margin:24px 24px 0; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-faq__answer { transition:none; } } #foodie .fd-account-slider .fd-account-photo img { position:static; inset:auto; width:100%; height:100%; max-width:100%; z-index:auto; object-fit:cover; opacity:1; } #foodie .fd-account-slider .fd-slider__dots button[aria-current] { background:transparent; } /* 0.14.126 — quiet surfaces and continuous, interruptible motion. */ #foodie .fd-slide { translate:0; transition:opacity 1s cubic-bezier(.22,.61,.36,1),visibility 1s; } #foodie .fd-slide.is-active { z-index:1; } #foodie .fd-slider__controls button,#foodie .fd-segmented button { transition:background-color .25s,color .25s,box-shadow .25s,transform .25s; } #foodie .fd-slider__controls button:hover { transform:translateY(-2px); box-shadow:0 4px 12px #182b1814; } #foodie .fd-segmented button:hover { color:#304915; background:#4865250d; } #foodie .fd-account-slider { position:relative; border:0; border-radius:24px; overflow:hidden; background:#25391f; } #foodie .fd-account-slider .fd-slider__track { min-height:600px; height:100%; } #foodie .fd-account-slider .fd-slide { position:relative; display:block; min-height:600px; } #foodie .fd-account-slider .fd-account-photo { position:absolute; inset:0; width:100%; height:100%; margin:0; border:0; border-radius:0; } #foodie .fd-account-slider .fd-account-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#14200d05 25%,#14200ddd 100%); } #foodie .fd-account-slider .fd-account-photo img { border-radius:0; transition:transform 1.2s cubic-bezier(.22,.61,.36,1); } #foodie .fd-account-slider:hover .fd-account-photo img { transform:scale(1.035); } #foodie .fd-account-slider .fd-auth__pitch { position:absolute; z-index:2; inset:auto 32px 92px; padding:0; max-width:420px; } #foodie .fd-account-slider .fd-auth__pitch :is(h1,h2) { font-size:clamp(28px,3vw,40px); line-height:1.15; letter-spacing:-1px; color:#fff; margin:12px 0; } #foodie .fd-account-slider .fd-auth__pitch p { color:#ffffffdf; } #foodie .fd-account-slider .fd-slider__controls { position:absolute; inset:auto 28px 20px; z-index:3; padding:0; } #foodie .fd-account-slider .fd-slider__buttons button { border:0; border-radius:50%; background:#ffffff12; } #foodie .fd-contact__grid { gap:28px; align-items:stretch; } #foodie .fd-contact__block { padding:32px; border:1px solid #e1e7dc; border-radius:24px; background:#fff; box-shadow:none; } #foodie .fd-contact__block .fd-h3 { margin:0 0 24px; } #foodie .fd-contact__block :is(.fd-week,.fd-rows) { border:0; border-radius:0; padding:0; background:transparent; box-shadow:none; } #foodie .fd-contact__block .fd-week__row { padding:14px 12px; border:0; border-bottom:1px solid #edf0e8; border-radius:0; } #foodie .fd-contact__block .fd-week__row:last-child { border-bottom:0; } #foodie .fd-contact__block .fd-week__row.is-today { border-radius:12px; background:#eff5e7; } #foodie .fd-contact__block .fd-rows li { border:0; border-bottom:1px solid #edf0e8; } #foodie .fd-contact__block .fd-rows li:last-child { border:0; } #foodie .fd-contact__block .fd-rows a { padding:18px 8px; border-radius:12px; transition:background .25s,transform .25s; } #foodie .fd-contact__block .fd-rows a:hover { background:#f4f7ef; transform:translateX(3px); } #foodie .fd-contact__block > .fd-btn { margin-top:24px; } #foodie .fd-category-rail.fd-loop { scroll-behavior:auto; scroll-snap-type:none; } @media(max-width:768px) { #foodie .fd-account-slider .fd-slider__track,#foodie .fd-account-slider .fd-slide { min-height:420px; } #foodie .fd-account-slider .fd-auth__pitch { inset:auto 24px 76px; } #foodie .fd-contact__block { padding:24px 20px; border-radius:20px; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-slide,#foodie .fd-account-slider .fd-account-photo img { transition:none; } } /* 0.14.127 — compact forms, editorial discovery and restrained surfaces. */ #foodie .fd-header.is-scrolled { box-shadow:0 2px 12px #20341908; } #foodie :is(.fd-banner__frame,.fd-pagehead,.fd-orderhead) { box-shadow:none; } #foodie .fd-auth-panels.fd-sized { position:relative; display:block; overflow:hidden; transition:height .55s cubic-bezier(.22,.61,.36,1); } #foodie .fd-auth-panels.fd-sized > .fd-auth__form { position:absolute; inset:0 0 auto; width:100%; transition:opacity .3s ease,translate .45s cubic-bezier(.22,.61,.36,1); } #foodie .fd-auth-panels.fd-sized > .fd-auth__form[hidden] { translate:0 8px; } #foodie .fd-auth__panel { border:0; padding:32px; background:#f7f8f3; } #foodie .fd-account-slider .fd-slider__track,#foodie .fd-account-slider .fd-slide { min-height:490px; } #foodie .fd-orderhead { padding:20px 0; margin-top:0; background:linear-gradient(180deg,#f2f5ec,#ffffff00); } #foodie .fd-orderhead h1 { font-size:32px; line-height:1.15; } #foodie .fd-orderhead__inner { gap:14px 24px; align-items:center; } #foodie .fd-orderhead__status { border-radius:14px; } #foodie .fd-orderhead__inner.fd-order-fade { opacity:var(--fd-order-opacity,1); translate:0 var(--fd-order-shift,0px); transition:none; } #foodie .fd-btn { position:relative; overflow:hidden; isolation:isolate; transition:background-color .35s ease,color .35s ease,box-shadow .35s ease,transform .35s cubic-bezier(.22,.61,.36,1); } #foodie .fd-btn::after { content:""; position:absolute; inset:-100% -60%; pointer-events:none; background:linear-gradient(105deg,transparent 35%,#ffffff20 49%,transparent 63%); transform:translateX(-65%); transition:transform .75s cubic-bezier(.22,.61,.36,1); } #foodie .fd-btn--brand { background:#486525; color:#fff; } #foodie .fd-btn--brand:hover { background:#354e1c; color:#fff; } #foodie .fd-btn:hover::after { transform:translateX(65%); } #foodie .fd-btn .ti { transition:transform .35s cubic-bezier(.22,.61,.36,1),translate .35s; } @media(hover:hover) { #foodie .fd-btn:hover { transform:translateY(-2px); box-shadow:0 7px 18px #26381916; } #foodie .fd-btn:hover .ti { translate:2px 0; transform:rotate(-6deg); } #foodie .fd-slider__controls button:hover,#foodie .fd-arrow:hover { transform:translateY(-2px) scale(1.06); } } #foodie .fd-btn:active { transform:translateY(0) scale(.985); box-shadow:none; } #foodie .fd-categories { padding-block:44px; background:linear-gradient(180deg,#f7f8f2,#fff); } #foodie .fd-category-rail { grid-auto-columns:calc((100% - 40px)/3); gap:20px; padding-block:12px 20px; mask-image:linear-gradient(90deg,transparent,#000 12px,#000 calc(100% - 12px),transparent); } #foodie .fd-category { min-height:330px; border-radius:24px; padding:28px; transition:transform .65s cubic-bezier(.22,.61,.36,1),box-shadow .65s; } #foodie .fd-category:nth-child(even) { border-radius:64px 24px 24px 24px; } #foodie .fd-category::after { background:linear-gradient(180deg,#0d190500 30%,#0d190525 48%,#0d1905df 100%); } #foodie .fd-category__action { position:absolute; top:20px; right:20px; width:42px; height:42px; display:grid; place-items:center; border:1px solid #ffffff80; border-radius:50%; color:#fff; background:#ffffff14; backdrop-filter:blur(8px); transition:background .4s,color .4s,transform .4s; } #foodie .fd-category__image img { transition:transform 1s cubic-bezier(.22,.61,.36,1),filter .7s; } #foodie .fd-category strong { font-size:28px; padding-right:16px; transition:translate .5s; } #foodie .fd-category small { transition:translate .5s; } #foodie .fd-category:hover { transform:translateY(-5px); box-shadow:0 10px 20px #20341415; } #foodie .fd-category:hover img { transform:scale(1.09); } #foodie .fd-category:hover .fd-category__action { background:#def4b3; color:#253d18; transform:rotate(45deg); } #foodie .fd-category:hover :is(strong,small) { translate:0 -4px; } #foodie .fd-contact__main { background:#f7f8f3; padding-block:48px; } #foodie .fd-contact__block { padding:32px; border:0; background:#fff; border-radius:24px; } #foodie .fd-contact__heading { display:flex; gap:16px; align-items:center; margin-bottom:24px; } #foodie .fd-contact__heading .fd-h3 { margin:6px 0 0; font-size:25px; line-height:1.2; letter-spacing:-.6px; } #foodie .fd-contact__heading .fd-eyebrow { margin:0; font-size:9px; letter-spacing:1.1px; color:#61754d; } #foodie .fd-contact__symbol { display:grid; place-items:center; flex:0 0 48px; height:48px; border-radius:16px; background:#edf3e4; color:#486525; font-size:24px; } #foodie .fd-contact__block .fd-week__row { padding:13px 14px; font-size:14px; border:0; } #foodie .fd-contact__block .fd-week__row:not(.is-today):nth-child(even) { background:#fafbf7; border-radius:12px; } #foodie .fd-contact__block .fd-week__row.is-today { background:#e8f1dc; color:#2f471b; } #foodie .fd-contact__block .fd-rows { display:grid; gap:8px; } #foodie .fd-contact__block .fd-rows li { border:0; } #foodie .fd-contact__block .fd-rows a { background:#f7f9f2; padding:18px 16px; border-radius:16px; } #foodie .fd-contact__block .fd-rows a:hover { background:#edf3e3; transform:none; } #foodie .fd-contact__block .fd-rows__chev { transition:transform .35s; } #foodie .fd-contact__block .fd-rows a:hover .fd-rows__chev { transform:translateX(4px); } @media(max-width:768px) { #foodie .fd-account-slider { position:relative; top:auto; } #foodie .fd-account-slider .fd-slider__track,#foodie .fd-account-slider .fd-slide { min-height:300px; } #foodie .fd-account-slider .fd-auth__pitch { inset:auto 24px 68px; } #foodie .fd-account-slider .fd-auth__pitch :is(h1,h2) { font-size:27px; } #foodie .fd-account-slider .fd-auth__pitch > p:last-child { display:none; } #foodie .fd-auth__panel { padding:24px 20px; } #foodie .fd-auth { gap:20px; padding-top:24px; } #foodie .fd-orderhead { padding:16px 0; } #foodie .fd-orderhead h1 { font-size:27px; } #foodie .fd-orderhead__meta .fd-services { display:none; } #foodie .fd-category-rail { grid-auto-columns:82%; gap:16px; } #foodie .fd-category { min-height:300px; padding:24px; } #foodie .fd-contact__main { padding-block:28px; } #foodie .fd-contact__block { padding:24px 18px; } #foodie .fd-contact__heading { gap:12px; } #foodie .fd-contact__heading .fd-h3 { font-size:22px; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-auth-panels.fd-sized,#foodie .fd-btn,#foodie .fd-btn::after,#foodie .fd-category,#foodie .fd-category * { transition:none; } #foodie .fd-orderhead__inner.fd-order-fade { opacity:1; translate:none; } } /* The photo is a normal grid item, never offset into the footer. */ #foodie .fd-account-slider { position:relative; top:auto; align-self:start; } #foodie .fd-contact__block .fd-rows li + li { border:0; } #foodie .fd-contact .fd-banner__frame { min-height:320px; } @media(max-width:768px) { #foodie .fd-contact .fd-banner__frame { min-height:280px; } } /* ======================================================================== Foodie 0.14.128 — Editorial menu gallery and separated contact composition. Scoped exclusively to the Foodie theme. No plugin/checkout styles changed. ======================================================================== */ /* Restaurant menu: clean section rhythm instead of a tinted edge-to-edge band. */ #foodie .fd-home .fd-categories { position:relative; padding:clamp(46px,6.2vw,82px) 0 clamp(34px,4vw,58px); background:transparent; } #foodie .fd-gallery__header { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; } #foodie .fd-gallery__title .fd-eyebrow { margin:0 0 10px; color:#577339; font-size:10px; font-weight:750; letter-spacing:.16em; } #foodie .fd-gallery__header h2 { margin:0; line-height:1.13; font-size:clamp(28px,3.5vw,42px); letter-spacing:-.042em; font-weight:730; } #foodie .fd-gallery__subtitle { margin:10px 0 0; max-width:48ch; color:#687160; font-size:13px; line-height:1.6; } #foodie .fd-gallery__head-actions { align-self:center; display:flex; align-items:center; gap:24px; } #foodie .fd-gallery__head-actions .fd-text-link { font-size:13px; font-weight:680; white-space:nowrap; } #foodie .fd-gallery__arrows { display:flex; align-items:center; gap:8px; } #foodie .fd-gallery__arrows[hidden] { display:none; } #foodie .fd-gallery__arrows .fd-arrow { width:46px; height:46px; display:grid; place-items:center; border:1px solid #d9e1d2; border-radius:50%; background:#fff; color:#30481d; font-size:19px; box-shadow:none; transition:color .32s ease,background .32s ease,border-color .32s ease,transform .45s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery__arrows .fd-arrow .ti { transition:transform .4s cubic-bezier(.16,1,.3,1); } /* Without JavaScript, all categories remain browseable as a native swipe rail. */ #foodie .fd-gallery { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(270px,33%); gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; padding-block:6px 16px; box-sizing:border-box; } #foodie .fd-gallery::-webkit-scrollbar { display:none; } #foodie .fd-gallery .fd-category { scroll-snap-align:start; } #foodie .fd-gallery.fd-gallery-ready { grid-auto-flow:row; grid-template-columns:minmax(0,1.56fr) minmax(0,1fr) minmax(0,1fr); gap:18px; overflow:visible; scroll-snap-type:none; padding-block:0; min-height:394px; } #foodie .fd-gallery.fd-gallery-ready[data-fd-count="2"] { grid-template-columns:1.25fr 1fr; } #foodie .fd-gallery.fd-gallery-ready[data-fd-count="1"] { grid-template-columns:minmax(0,1fr); } #foodie .fd-gallery.fd-gallery-ready .fd-category:not([data-fd-slot]) { display:none; } #foodie .fd-gallery .fd-category { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; isolation:isolate; min-width:0; min-height:394px; padding:30px; gap:0; overflow:hidden; border:0; border-radius:23px; background:#354325; color:#fff; transform:none; translate:none; box-shadow:none; text-decoration:none; will-change:transform; transition:transform .65s cubic-bezier(.16,1,.3,1), box-shadow .65s ease; } #foodie .fd-gallery .fd-category:nth-child(even) { border-radius:23px; } #foodie .fd-gallery .fd-category::before { content:""; position:absolute; z-index:-1; inset:0; border:1px solid #ffffff18; border-radius:inherit; pointer-events:none; } #foodie .fd-gallery .fd-category::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(180deg,rgba(14,21,11,.32) 0%,transparent 26%,rgba(11,19,11,.25) 46%,rgba(10,19,8,.87) 100%); transition:background .5s ease,opacity .5s ease; } #foodie .fd-gallery .fd-category__image { position:absolute; inset:0; z-index:-2; width:100%; height:100%; border-radius:0; background:#38452a; } #foodie .fd-gallery .fd-category__image img { display:block; width:100%; height:100%; object-fit:cover; border:0; border-radius:0; mix-blend-mode:normal; transform:scale(1.015); filter:saturate(.91) brightness(.92); transition:transform 1.25s cubic-bezier(.16,1,.3,1),filter .85s ease; } #foodie .fd-gallery .fd-category__eyebrow { position:absolute; top:30px; left:30px; z-index:2; display:flex; align-items:center; gap:7px; color:#f4faeecf; font-size:10px; font-weight:700; letter-spacing:.14em; text-shadow:0 1px 8px #101c1199; } #foodie .fd-gallery .fd-category__eyebrow span { color:#d4efa8; } #foodie .fd-gallery .fd-category__action { position:absolute; top:22px; right:22px; width:48px; height:48px; display:grid; place-items:center; border-radius:50%; border:1px solid #ffffff79; background:#16230d24; color:#fff; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition:background .42s ease,color .42s ease,transform .55s cubic-bezier(.16,1,.3,1),border-color .4s; } #foodie .fd-gallery .fd-category__action .ti { font-size:20px; transition:transform .42s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery .fd-category__copy { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; min-width:0; max-width:100%; gap:5px; transform:translateY(0); transition:transform .62s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery .fd-category strong { margin:0; padding:0; color:#fff; font-size:clamp(23px,2.35vw,31px); line-height:1.1; letter-spacing:-.045em; font-weight:730; text-wrap:balance; overflow-wrap:anywhere; } #foodie .fd-gallery .fd-category small { margin:0; color:#f0f5eccc; font-size:12px; font-weight:550; letter-spacing:0; line-height:1.6; } #foodie .fd-gallery .fd-category__discover { position:absolute; bottom:25px; left:30px; z-index:2; display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:680; letter-spacing:.012em; color:#e0f0c5; opacity:0; transform:translateY(12px); transition:opacity .48s ease,transform .6s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery .fd-category__discover .ti { font-size:16px; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="featured"] { min-height:394px; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="secondary"], #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="tertiary"] { min-height:372px; margin-block:11px; padding:25px; } #foodie .fd-gallery .fd-category[data-fd-slot="secondary"] strong, #foodie .fd-gallery .fd-category[data-fd-slot="tertiary"] strong { font-size:clamp(20px,2vw,27px); } #foodie .fd-gallery .fd-category[data-fd-slot="secondary"] .fd-category__eyebrow, #foodie .fd-gallery .fd-category[data-fd-slot="tertiary"] .fd-category__eyebrow { left:25px; } #foodie .fd-gallery .fd-category[data-fd-slot="secondary"] .fd-category__discover, #foodie .fd-gallery .fd-category[data-fd-slot="tertiary"] .fd-category__discover { left:25px; } #foodie .fd-gallery .fd-category:focus-visible { outline:3px solid #68883c; outline-offset:5px; } #foodie .fd-gallery__footer { display:flex; align-items:center; gap:17px; padding-top:22px; } #foodie .fd-gallery__pagination { display:flex; align-items:baseline; gap:3px; flex:none; color:#738368; font-variant-numeric:tabular-nums; font-size:12px; font-weight:620; } #foodie .fd-gallery__pagination [data-fd-gallery-current] { font-size:15px; color:#354b25; font-weight:750; } #foodie .fd-gallery__progress { display:block; flex:0 1 290px; height:2px; background:#dce4d5; border-radius:20px; overflow:hidden; } #foodie .fd-gallery__progress span { display:block; height:100%; width:8%; background:#55782b; border-radius:20px; transition:width .75s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery__hint { font-size:11px; margin-left:auto; color:#7b8573; } /* Contact: a self-contained inset composition, NOT an edge-to-edge colored strip. */ #foodie .fd-contact .fd-contact__main { width:var(--fd-wrap); max-width:100%; margin:48px auto 42px; padding:clamp(20px,3.3vw,42px); border:1px solid #e8eddf; border-radius:30px; background:radial-gradient(circle at 7% 2%,#f6f9ee 0%,transparent 48%),linear-gradient(135deg,#f4f7ef,#f7f9f4 70%,#f3f6ec); box-shadow:none; } #foodie .fd-contact .fd-contact__main > .fd-wrap { width:100%; max-width:none; margin:0; } #foodie .fd-contact .fd-contact__grid { align-items:stretch; gap:clamp(14px,2vw,26px); } #foodie .fd-contact .fd-contact__block { min-width:0; display:flex; flex-direction:column; padding:clamp(22px,2.4vw,34px); border:1px solid #e4eade; border-radius:22px; background:#fff; box-shadow:0 3px 18px #19240e05; } #foodie .fd-contact .fd-contact__heading { gap:14px; align-items:center; margin:0 0 26px; } #foodie .fd-contact .fd-contact__heading .fd-h3 { margin:4px 0 0; font-size:clamp(21px,2.15vw,27px); letter-spacing:-.04em; line-height:1.2; } #foodie .fd-contact .fd-contact__heading .fd-eyebrow { margin:0; font-size:9px; letter-spacing:.13em; color:#68804d; } #foodie .fd-contact .fd-contact__symbol { width:46px; height:46px; flex:0 0 46px; border-radius:15px; background:#edf3e4; color:#45652a; font-size:22px; } #foodie .fd-contact .fd-contact__block .fd-week { border:0; background:transparent; padding:0; border-radius:0; overflow:visible; } #foodie .fd-contact .fd-contact__block .fd-week__row, #foodie .fd-contact .fd-contact__block .fd-week__row:not(.is-today):nth-child(even) { position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; padding:14px 13px; border:0; border-bottom:1px solid #ebefe5; border-radius:0; font-size:13px; background:transparent; color:#3c4735; transition:background-color .32s ease,color .32s ease,padding-left .32s ease; } #foodie .fd-contact .fd-contact__block .fd-week__row:last-child { border-bottom:0; } #foodie .fd-contact .fd-contact__block .fd-week__row.is-today { color:#33501e; background:#edf4e4; border:0; border-radius:12px; box-shadow:inset 3px 0 0 #799e4e; } #foodie .fd-contact .fd-contact__block .fd-week__row > span:last-child { font-size:13px; color:inherit; white-space:nowrap; } #foodie .fd-contact .fd-contact__block .fd-week__row em { padding:3px 8px; font-size:9px; background:#e0edce; color:#41602a; border-radius:20px; } #foodie .fd-contact .fd-rows { display:grid; gap:0; margin:0; padding:0; } #foodie .fd-contact .fd-contact__block .fd-rows li { margin:0; border:0; border-bottom:1px solid #e9eee5; } #foodie .fd-contact .fd-contact__block .fd-rows li:last-child { border-bottom:0; } #foodie .fd-contact .fd-contact__block .fd-rows a { display:flex; align-items:center; gap:14px; padding:17px 10px; border:0; border-radius:12px; background:transparent; color:#283621; transform:none; transition:background-color .36s ease,transform .36s cubic-bezier(.16,1,.3,1),color .3s ease; } #foodie .fd-contact .fd-contact__block .fd-rows__icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:13px; background:#f0f5e9; color:#4d692d; font-size:20px; transition:background .35s ease,transform .35s cubic-bezier(.16,1,.3,1); } #foodie .fd-contact .fd-contact__block .fd-rows__copy { min-width:0; } #foodie .fd-contact .fd-contact__block .fd-rows__copy small { font-size:11px; color:#737e69; } #foodie .fd-contact .fd-contact__block .fd-rows__copy strong { font-size:14px; overflow-wrap:anywhere; } #foodie .fd-contact .fd-contact__block .fd-rows__chev { color:#627d46; transition:transform .42s cubic-bezier(.16,1,.3,1); } #foodie .fd-contact .fd-contact__block > .fd-btn { margin-top:auto; min-height:48px; border-radius:14px; transform:translateY(10px); } #foodie .fd-contact .fd-contact__map { padding:0; margin:0 auto 26px; } #foodie .fd-contact .fd-map { border-radius:24px; border:1px solid #e0e8d7; overflow:hidden; } #foodie .fd-contact .fd-contact__zones { padding-top:16px; } /* Deliberate, visible hover/focus choreography — not just a colour swap. */ @media(hover:hover) and (pointer:fine) { #foodie .fd-gallery .fd-category:hover { transform:translateY(-6px); box-shadow:0 16px 36px #1e301a1c; } #foodie .fd-gallery .fd-category:hover .fd-category__image img { transform:scale(1.095); filter:saturate(1.05) brightness(1); } #foodie .fd-gallery .fd-category:hover .fd-category__copy { transform:translateY(-29px); } #foodie .fd-gallery .fd-category:hover .fd-category__discover { opacity:1; transform:translateY(0); } #foodie .fd-gallery .fd-category:hover .fd-category__action { background:#d3e9ad; border-color:#d3e9ad; color:#294116; transform:scale(1.07); } #foodie .fd-gallery .fd-category:hover .fd-category__action .ti { transform:translate(2px,-2px); } #foodie .fd-gallery__arrows .fd-arrow:hover:not(:disabled) { border-color:#506c2e; background:#4e6b2d; color:#fff; transform:translateY(-3px); box-shadow:0 6px 18px #2c3e1724; } #foodie .fd-gallery__arrows [data-fd-gallery-prev]:hover .ti { transform:translateX(-4px); } #foodie .fd-gallery__arrows [data-fd-gallery-next]:hover .ti { transform:translateX(4px); } #foodie .fd-gallery__head-actions .fd-text-link:hover .ti { transform:translate(3px,-3px); } #foodie .fd-contact .fd-contact__block .fd-week__row:not(.is-today):hover { background:#f6f9f2; padding-left:18px; border-radius:10px; color:#2e4a1a; } #foodie .fd-contact .fd-contact__block .fd-rows a:hover { background:#f2f7eb; transform:translateX(3px); color:#314d1b; } #foodie .fd-contact .fd-contact__block .fd-rows a:hover .fd-rows__icon { background:#e0edce; transform:rotate(-7deg) scale(1.055); } #foodie .fd-contact .fd-contact__block .fd-rows a:hover .fd-rows__chev { transform:translateX(5px); } #foodie .fd-contact .fd-contact__block > .fd-btn:hover { transform:translateY(7px); background:#334c1a; box-shadow:0 9px 22px #243f191f; } #foodie .fd-btn:hover .ti-arrow-up-right { transform:translate(2px,-2px); } #foodie .fd-text-link:hover .ti-arrow-up-right { transform:translate(3px,-3px); } #foodie .fd-nav__link:hover { background:#eff5e8; color:#33511c; } #foodie .fd-header__account:hover { background:#e3efd4; transform:translateY(-1px); } } #foodie .fd-gallery .fd-category:active { transform:translateY(-1px) scale(.995); } #foodie .fd-gallery__arrows .fd-arrow:active { transform:scale(.96); } #foodie .fd-gallery__arrows .fd-arrow:focus-visible, #foodie .fd-contact .fd-rows a:focus-visible { outline:3px solid #6d923e; outline-offset:3px; } /* Tablet/mobile: one intentionally featured card plus a preview, then single cards. */ @media(max-width:960px) { #foodie .fd-gallery.fd-gallery-ready { grid-template-columns:1.2fr 1fr; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="tertiary"] { display:none; } #foodie .fd-gallery.fd-gallery-ready[data-fd-count="1"] { grid-template-columns:minmax(0,1fr); } #foodie .fd-gallery.fd-gallery-ready .fd-category { min-height:344px; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="secondary"] { min-height:324px; } #foodie .fd-contact .fd-contact__main { margin-top:32px; margin-bottom:30px; } #foodie .fd-contact .fd-contact__block { padding:24px; } } @media(max-width:650px) { #foodie .fd-home .fd-categories { padding-block:42px 36px; } #foodie .fd-gallery__header { align-items:start; gap:16px; margin-bottom:20px; } #foodie .fd-gallery__header h2 { font-size:28px; } #foodie .fd-gallery__subtitle { font-size:12px; max-width:30ch; } #foodie .fd-gallery__head-actions { align-self:end; flex-direction:column; align-items:end; gap:10px; } #foodie .fd-gallery__head-actions .fd-text-link { font-size:12px; } #foodie .fd-gallery__arrows { gap:6px; } #foodie .fd-gallery__arrows .fd-arrow { width:39px; height:39px; } #foodie .fd-gallery.fd-gallery-ready, #foodie .fd-gallery.fd-gallery-ready[data-fd-count="2"] { grid-template-columns:minmax(0,1fr); min-height:350px; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="secondary"], #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="tertiary"] { display:none; } #foodie .fd-gallery.fd-gallery-ready .fd-category[data-fd-slot="featured"] { min-height:350px; padding:26px; } #foodie .fd-gallery .fd-category__eyebrow { top:26px; left:26px; } #foodie .fd-gallery .fd-category__action { top:19px; right:19px; } #foodie .fd-gallery .fd-category__discover { left:26px; } #foodie .fd-gallery__footer { padding-top:16px; } #foodie .fd-gallery__hint { display:none; } #foodie .fd-gallery__progress { flex:1; } #foodie .fd-contact .fd-contact__main { width:calc(100% - (var(--fd-gutter) * 2))); padding:12px; margin-block:26px 30px; border-radius:23px; } #foodie .fd-contact .fd-contact__grid { gap:12px; } #foodie .fd-contact .fd-contact__block { padding:21px 18px; border-radius:17px; } #foodie .fd-contact .fd-contact__heading { gap:10px; margin-bottom:18px; } #foodie .fd-contact .fd-contact__heading .fd-h3 { font-size:22px; } #foodie .fd-contact .fd-contact__symbol { flex-basis:40px; width:40px; height:40px; border-radius:12px; } #foodie .fd-contact .fd-contact__block .fd-week__row, #foodie .fd-contact .fd-contact__block .fd-week__row:not(.is-today):nth-child(even) { padding-inline:7px; gap:9px; font-size:12px; } #foodie .fd-contact .fd-contact__block .fd-week__row > span:last-child { font-size:12px; } #foodie .fd-contact .fd-contact__block .fd-rows a { padding:15px 7px; } #foodie .fd-contact .fd-contact__block > .fd-btn { transform:none; margin-top:18px; } #foodie .fd-contact .fd-contact__block > .fd-btn:hover { transform:translateY(-2px); } #foodie .fd-contact .fd-map { border-radius:18px; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-gallery *,#foodie .fd-gallery *::before,#foodie .fd-gallery *::after, #foodie .fd-gallery__progress span,#foodie .fd-gallery__arrows .fd-arrow, #foodie .fd-contact .fd-rows a,#foodie .fd-contact .fd-week__row { transition-duration:0s; animation:none; } } /* Foodie 0.14.129 — premium spotlight menu gallery */ #foodie .fd-gallery--premium { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(290px,.72fr); gap:22px; align-items:stretch; } #foodie .fd-gallery--premium .fd-gallery-premium__stage, #foodie .fd-gallery--premium .fd-gallery-premium__rail { position:relative; border-radius:30px; overflow:hidden; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height:540px; background:#162012; box-shadow:0 26px 60px rgba(29,41,20,.14); } #foodie .fd-gallery--premium .fd-spotlight { position:absolute; inset:0; display:block; color:#fff; opacity:0; pointer-events:none; transform:scale(1.02); transition:opacity .65s cubic-bezier(.16,1,.3,1), transform .75s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery--premium .fd-spotlight.is-active { opacity:1; pointer-events:auto; transform:none; z-index:2; } #foodie .fd-gallery--premium .fd-spotlight__image, #foodie .fd-gallery--premium .fd-spotlight__image img { position:absolute; inset:0; width:100%; height:100%; } #foodie .fd-gallery--premium .fd-spotlight__image img { object-fit:cover; transform:scale(1.01); transition:transform 1.1s cubic-bezier(.16,1,.3,1); } #foodie .fd-gallery--premium .fd-spotlight.is-active .fd-spotlight__image img { transform:scale(1.06); } #foodie .fd-gallery--premium .fd-spotlight__image .ti { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); font-size:46px; color:#fff; } #foodie .fd-gallery--premium .fd-spotlight__veil { position:absolute; inset:0; background: linear-gradient(180deg, rgba(16,18,13,.08) 0%, rgba(16,18,13,.2) 28%, rgba(13,16,10,.76) 100%), linear-gradient(90deg, rgba(15,19,12,.56) 0%, rgba(15,19,12,.18) 52%, rgba(15,19,12,.08) 100%); } #foodie .fd-gallery--premium .fd-spotlight__badge { position:absolute; top:28px; left:28px; z-index:2; display:inline-flex; align-items:center; gap:10px; padding:10px 14px; border-radius:999px; font-size:11px; letter-spacing:.22em; text-transform:uppercase; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(12px); } #foodie .fd-gallery--premium .fd-spotlight__content { position:absolute; inset:auto 34px 34px 34px; z-index:2; display:flex; flex-direction:column; gap:12px; align-items:flex-start; max-width:min(72%, 520px); } #foodie .fd-gallery--premium .fd-spotlight__kicker { display:inline-flex; align-items:center; gap:10px; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.74); } #foodie .fd-gallery--premium .fd-spotlight__kicker::before { content:''; width:38px; height:1px; background:rgba(255,255,255,.55); } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size:clamp(38px,4.2vw,64px); line-height:.96; letter-spacing:-.04em; color:#fff; } #foodie .fd-gallery--premium .fd-spotlight__content small { font-size:15px; font-weight:520; color:rgba(255,255,255,.86); } #foodie .fd-gallery--premium .fd-spotlight__cta { margin-top:6px; display:inline-flex; align-items:center; gap:10px; padding:13px 18px; border-radius:999px; color:#243519; background:#eef4e2; font-size:13px; font-weight:760; transition:transform .35s cubic-bezier(.16,1,.3,1), background .35s ease, box-shadow .35s ease; box-shadow:0 10px 24px rgba(9,10,8,.18); } #foodie .fd-gallery--premium .fd-gallery-premium__rail { background:linear-gradient(180deg, #f6f6f1 0%, #f0f2ea 100%); border:1px solid rgba(58,78,35,.09); padding:24px; display:flex; flex-direction:column; min-height:540px; } #foodie .fd-gallery--premium .fd-gallery-premium__rail::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at top right, rgba(93,121,51,.14), transparent 34%); pointer-events:none; } #foodie .fd-gallery-premium__rail-head { position:relative; z-index:1; display:flex; flex-direction:column; gap:6px; padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid rgba(58,78,35,.11); } #foodie .fd-gallery-premium__label { margin:0; font-size:11px; font-weight:720; letter-spacing:.2em; text-transform:uppercase; color:#70825a; } #foodie .fd-gallery-premium__rail-head strong { font-size:24px; line-height:1.08; letter-spacing:-.03em; color:#1b2712; } #foodie .fd-gallery-premium__list { position:relative; z-index:1; display:grid; gap:12px; margin-top:auto; } #foodie .fd-gallery-premium__list .fd-preview:not([data-fd-preview-slot]) { display:none; } #foodie .fd-preview { appearance:none; border:0; width:100%; display:grid; grid-template-columns:86px minmax(0,1fr) auto; gap:14px; align-items:center; padding:10px; border-radius:22px; text-align:left; color:#223018; background:rgba(255,255,255,.7); border:1px solid rgba(54,74,31,.08); box-shadow:0 10px 24px rgba(32,44,22,.06); transition:transform .42s cubic-bezier(.16,1,.3,1), background .35s ease, border-color .35s ease, box-shadow .35s ease; cursor:pointer; } #foodie .fd-preview__thumb { position:relative; display:block; width:86px; height:86px; border-radius:16px; overflow:hidden; background:#dfe8d0; } #foodie .fd-preview__thumb img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); } #foodie .fd-preview__thumb .ti { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); font-size:26px; color:#526743; } #foodie .fd-preview__copy { min-width:0; display:flex; flex-direction:column; gap:6px; } #foodie .fd-preview__copy strong { display:block; font-size:20px; line-height:1.05; letter-spacing:-.03em; color:#213017; } #foodie .fd-preview__copy small { display:block; font-size:13px; color:#6f7a63; } #foodie .fd-preview__go { display:grid; place-items:center; width:38px; height:38px; border-radius:999px; background:#edf3e4; color:#45612a; transition:transform .35s cubic-bezier(.16,1,.3,1), background .35s ease; } #foodie .fd-preview.is-current { background:#fff; border-color:rgba(76,105,40,.18); box-shadow:0 16px 32px rgba(32,44,22,.1); transform:translateX(-6px); } #foodie .fd-preview.is-current .fd-preview__copy strong { color:#17210f; } #foodie .fd-preview.is-current .fd-preview__go { background:#deeacb; } #foodie .fd-gallery__footer { align-items:center; gap:16px; } #foodie .fd-gallery__progress { height:2px; background:#d3dbca; } #foodie .fd-gallery__progress span { background:#516e2f; } @media (hover:hover) and (pointer:fine) { #foodie .fd-gallery--premium .fd-spotlight.is-active:hover .fd-spotlight__cta { transform:translateY(-2px); background:#fff; box-shadow:0 14px 28px rgba(9,10,8,.22); } #foodie .fd-gallery--premium .fd-spotlight.is-active:hover .fd-spotlight__cta .ti { transform:translate(3px,-3px); } #foodie .fd-preview:hover { transform:translateX(-4px); background:#fff; border-color:rgba(76,105,40,.18); box-shadow:0 14px 28px rgba(32,44,22,.1); } #foodie .fd-preview:hover .fd-preview__thumb img { transform:scale(1.08); } #foodie .fd-preview:hover .fd-preview__go { transform:translateX(3px); background:#deeacb; } } #foodie .fd-preview:focus-visible, #foodie .fd-gallery--premium .fd-spotlight:focus-visible { outline:3px solid #6a8d3f; outline-offset:4px; } #foodie .fd-preview:active { transform:translateX(-2px) scale(.99); } @media (max-width: 1080px) { #foodie .fd-gallery--premium { grid-template-columns:minmax(0,1fr); } #foodie .fd-gallery--premium .fd-gallery-premium__stage, #foodie .fd-gallery--premium .fd-gallery-premium__rail { min-height:auto; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height:480px; } #foodie .fd-gallery--premium .fd-gallery-premium__rail { padding:18px; } #foodie .fd-gallery-premium__list { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:0; } #foodie .fd-gallery-premium__list .fd-preview[data-fd-preview-slot="slot-3"] { display:none; } } @media (max-width: 720px) { #foodie .fd-gallery--premium { gap:16px; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height:420px; border-radius:24px; } #foodie .fd-gallery--premium .fd-gallery-premium__rail { border-radius:24px; } #foodie .fd-gallery--premium .fd-spotlight__badge { top:20px; left:20px; } #foodie .fd-gallery--premium .fd-spotlight__content { inset:auto 22px 22px 22px; max-width:none; } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size:34px; } #foodie .fd-gallery-premium__list { grid-template-columns:minmax(0,1fr); } #foodie .fd-gallery-premium__list .fd-preview[data-fd-preview-slot="slot-2"], #foodie .fd-gallery-premium__list .fd-preview[data-fd-preview-slot="slot-3"] { display:none; } #foodie .fd-preview { grid-template-columns:76px minmax(0,1fr) auto; gap:12px; padding:9px; border-radius:18px; } #foodie .fd-preview__thumb { width:76px; height:76px; border-radius:14px; } #foodie .fd-preview__copy strong { font-size:17px; } #foodie .fd-gallery__footer { padding-top:14px; } } /* Foodie 0.14.130 — flatten nested tinted sections and unify radius language */ #foodie { --fd-ui-shell-radius: 24px; --fd-ui-card-radius: 20px; --fd-ui-control-radius: 16px; --fd-ui-soft-radius: 14px; } /* CONTACT PAGE: remove the boxed colored wrapper around white cards */ #foodie .fd-contact .fd-contact__main { width: var(--fd-wrap); max-width: 100%; margin: 42px auto 36px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } #foodie .fd-contact .fd-contact__grid { align-items: stretch; gap: 22px; } #foodie .fd-contact .fd-contact__block { padding: 28px; border: 1px solid #e2e8da; border-radius: var(--fd-ui-shell-radius); background: #fff; box-shadow: 0 10px 30px rgba(24,34,13,.04); } #foodie .fd-contact .fd-contact__symbol { border-radius: var(--fd-ui-soft-radius); } #foodie .fd-contact .fd-contact__block .fd-week__row.is-today { border-radius: var(--fd-ui-control-radius); box-shadow: inset 3px 0 0 #799e4e; } #foodie .fd-contact .fd-contact__block .fd-rows a { border-radius: var(--fd-ui-control-radius); } #foodie .fd-contact .fd-contact__block .fd-rows__icon { border-radius: var(--fd-ui-soft-radius); } #foodie .fd-contact .fd-contact__block > .fd-btn { margin-top: 20px; min-height: 50px; border-radius: var(--fd-ui-control-radius); transform: none; } #foodie .fd-contact .fd-contact__block > .fd-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(36,63,25,.12); } #foodie .fd-contact .fd-map { border-radius: var(--fd-ui-shell-radius); } /* ACCOUNT: one clean shell language, not pill-inside-rounded-card chaos */ #foodie .fd-auth { gap: 40px; } #foodie .fd-account-slider { position: relative; top: auto; align-self: start; border: 1px solid #dfe6d5; border-radius: var(--fd-ui-shell-radius); overflow: hidden; background: #25391f; box-shadow: 0 12px 32px rgba(20,31,10,.06); } #foodie .fd-account-slider .fd-slider__track, #foodie .fd-account-slider .fd-slide { min-height: 600px; } #foodie .fd-account-slider .fd-slider__controls { inset: auto 24px 18px; } #foodie .fd-account-slider .fd-slider__buttons button { width: 40px; height: 40px; border-radius: var(--fd-ui-soft-radius); border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.08); } #foodie .fd-auth__panel { padding: 0; border: 1px solid #e2e8da; border-radius: var(--fd-ui-shell-radius); background: #fff; box-shadow: 0 10px 30px rgba(24,34,13,.04); overflow: hidden; } #foodie .fd-auth__form { padding: 28px 28px 30px; } #foodie .fd-segmented { gap: 6px; margin: 0; padding: 10px; border-radius: var(--fd-ui-card-radius); background: #f6f8f2; border-bottom: 1px solid #e7ecdf; } #foodie .fd-segmented button { min-height: 44px; border-radius: var(--fd-ui-control-radius); font-size: 14px; font-weight: 700; } #foodie .fd-segmented button[aria-selected="true"] { background: #fff; color: #243218; box-shadow: 0 1px 2px rgba(22,29,25,.06), 0 8px 18px -10px rgba(22,29,25,.18); } #foodie .fd-field input, #foodie .fd-field__control input { min-height: 52px; border-radius: var(--fd-ui-control-radius); background: #fff; } #foodie .fd-field__toggle { border-radius: 12px; } #foodie .fd-btn.fd-btn--lg, #foodie .fd-btn.fd-btn--block { border-radius: var(--fd-ui-control-radius); } /* clean hover behavior: match the actual radius system */ @media (hover:hover) and (pointer:fine) { #foodie .fd-contact .fd-contact__block .fd-week__row:not(.is-today):hover { border-radius: var(--fd-ui-control-radius); padding-left: 18px; } #foodie .fd-contact .fd-contact__block .fd-rows a:hover { border-radius: var(--fd-ui-control-radius); } #foodie .fd-segmented button:hover:not([aria-selected="true"]) { background: #eef3e6; color: #31471d; } } @media (max-width: 960px) { #foodie .fd-auth { gap: 24px; } #foodie .fd-contact .fd-contact__block { padding: 24px; } } @media (max-width: 650px) { #foodie .fd-contact .fd-contact__main { width: var(--fd-wrap); margin: 24px auto 28px; } #foodie .fd-contact .fd-contact__grid { gap: 14px; } #foodie .fd-contact .fd-contact__block, #foodie .fd-auth__panel, #foodie .fd-account-slider { border-radius: 20px; } #foodie .fd-contact .fd-contact__block { padding: 20px 18px; } #foodie .fd-segmented { padding: 8px; border-radius: 18px; } #foodie .fd-segmented button, #foodie .fd-field input, #foodie .fd-field__control input, #foodie .fd-btn.fd-btn--lg, #foodie .fd-btn.fd-btn--block, #foodie .fd-contact .fd-contact__block .fd-rows a, #foodie .fd-contact .fd-contact__block .fd-week__row.is-today { border-radius: 14px; } #foodie .fd-auth__form { padding: 22px 18px 24px; } #foodie .fd-account-slider .fd-slider__track, #foodie .fd-account-slider .fd-slide { min-height: 320px; } #foodie .fd-account-slider .fd-auth__pitch { inset: auto 20px 66px; } } /* Foodie 0.14.131 — Speisekarte editorial minimal redesign */ #foodie .fd-gallery--premium { grid-template-columns: minmax(0, 1.55fr) minmax(300px, .68fr); gap: 28px; align-items: stretch; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 580px; border-radius: 32px; overflow: hidden; border: 1px solid rgba(38, 55, 26, .10); box-shadow: 0 20px 48px rgba(24, 34, 13, .08); background: #172014; } #foodie .fd-gallery--premium .fd-spotlight__veil { background: linear-gradient(180deg, rgba(10, 14, 9, .10) 0%, rgba(10, 14, 9, .22) 36%, rgba(9, 12, 8, .82) 100%), linear-gradient(90deg, rgba(9, 12, 8, .58) 0%, rgba(9, 12, 8, .20) 42%, rgba(9, 12, 8, .06) 100%); } #foodie .fd-gallery--premium .fd-spotlight__badge { top: 24px; left: 24px; padding: 9px 13px; border-radius: 999px; font-size: 10px; letter-spacing: .2em; background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.14); } #foodie .fd-gallery--premium .fd-spotlight__content { inset: auto 34px 32px 34px; gap: 10px; max-width: min(64%, 460px); } #foodie .fd-gallery--premium .fd-spotlight__kicker { font-size: 10.5px; letter-spacing: .22em; color: rgba(255,255,255,.72); } #foodie .fd-gallery--premium .fd-spotlight__kicker::before { width: 34px; } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size: clamp(42px, 4.8vw, 68px); line-height: .92; letter-spacing: -.05em; } #foodie .fd-gallery--premium .fd-spotlight__content small { font-size: 14px; color: rgba(255,255,255,.82); } #foodie .fd-gallery--premium .fd-spotlight__cta { margin-top: 8px; padding: 0; border-radius: 0; color: #eef5e1; background: transparent; font-size: 13px; font-weight: 720; box-shadow: none; position: relative; } #foodie .fd-gallery--premium .fd-spotlight__cta::after { content: ''; position: absolute; left: 0; right: 0; bottom: -8px; height: 1px; background: rgba(255,255,255,.26); } /* remove widget look from the right column */ #foodie .fd-gallery--premium .fd-gallery-premium__rail { min-height: 580px; padding: 6px 0 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; } #foodie .fd-gallery--premium .fd-gallery-premium__rail::before { display: none; } #foodie .fd-gallery-premium__rail-head { padding: 8px 0 18px; margin-bottom: 2px; border-bottom: 1px solid #e1e7d8; } #foodie .fd-gallery-premium__label { font-size: 10px; letter-spacing: .24em; color: #758468; } #foodie .fd-gallery-premium__rail-head strong { font-size: clamp(30px, 3vw, 48px); line-height: .96; letter-spacing: -.05em; color: #1e2a14; max-width: 7ch; } #foodie .fd-gallery-premium__list { gap: 0; margin-top: 6px; } #foodie .fd-gallery-premium__list .fd-preview:not([data-fd-preview-slot]) { display: none; } #foodie .fd-preview { grid-template-columns: 96px minmax(0,1fr) 44px; gap: 14px; padding: 18px 0; border: 0; border-bottom: 1px solid #e6ebdf; border-radius: 0; background: transparent; box-shadow: none; position: relative; } #foodie .fd-preview:last-child { border-bottom: 0; } #foodie .fd-preview::before { content: ''; position: absolute; left: -14px; top: 18px; bottom: 18px; width: 3px; border-radius: 999px; background: transparent; transition: background-color .3s ease, opacity .3s ease; opacity: 0; } #foodie .fd-preview__thumb { width: 96px; height: 78px; border-radius: 18px; box-shadow: 0 8px 18px rgba(22,31,14,.06); } #foodie .fd-preview__copy { gap: 4px; } #foodie .fd-preview__copy strong { font-size: 18px; line-height: 1.02; letter-spacing: -.03em; max-width: 11ch; } #foodie .fd-preview__copy small { font-size: 12px; color: #6d7861; } #foodie .fd-preview__go { width: 36px; height: 36px; border-radius: 999px; background: #eef3e6; color: #4a6828; } #foodie .fd-preview.is-current { transform: none; background: transparent; border-color: #d8e0cf; box-shadow: none; } #foodie .fd-preview.is-current::before { background: #6f9440; opacity: 1; } #foodie .fd-preview.is-current .fd-preview__copy strong { color: #17220f; } #foodie .fd-preview.is-current .fd-preview__go { background: #dce9c7; } #foodie .fd-gallery__footer { padding-top: 18px; gap: 18px; } #foodie .fd-gallery__progress { flex: 0 1 320px; height: 1px; background: #dbe2d2; } #foodie .fd-gallery__progress span { background: #5d7f33; } #foodie .fd-gallery__hint { font-size: 11px; color: #7a8471; } @media (hover:hover) and (pointer:fine) { #foodie .fd-gallery--premium .fd-spotlight.is-active:hover .fd-spotlight__cta { color: #fff; transform: translateX(3px); } #foodie .fd-gallery--premium .fd-spotlight.is-active:hover .fd-spotlight__cta::after { background: rgba(255,255,255,.48); } #foodie .fd-preview:hover { transform: translateX(6px); background: transparent; border-color: #dce3d3; box-shadow: none; } #foodie .fd-preview:hover::before { background: #c5d7a7; opacity: 1; } #foodie .fd-preview:hover .fd-preview__thumb img { transform: scale(1.06); } #foodie .fd-preview:hover .fd-preview__go { transform: translateX(3px); background: #dfeacc; } } @media (max-width: 1100px) { #foodie .fd-gallery--premium { grid-template-columns: minmax(0, 1fr); gap: 20px; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 500px; } #foodie .fd-gallery--premium .fd-gallery-premium__rail { min-height: auto; padding-top: 0; } #foodie .fd-gallery-premium__rail-head strong { max-width: none; } #foodie .fd-gallery-premium__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; } #foodie .fd-preview { padding: 16px 0; } } @media (max-width: 720px) { #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 420px; border-radius: 24px; } #foodie .fd-gallery--premium .fd-spotlight__badge { top: 18px; left: 18px; } #foodie .fd-gallery--premium .fd-spotlight__content { inset: auto 22px 22px 22px; max-width: 82%; } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size: 36px; } #foodie .fd-gallery-premium__rail-head { padding-top: 0; } #foodie .fd-gallery-premium__rail-head strong { font-size: 28px; } #foodie .fd-gallery-premium__list { grid-template-columns: minmax(0,1fr); } #foodie .fd-preview { grid-template-columns: 82px minmax(0,1fr) 40px; gap: 12px; padding: 14px 0; } #foodie .fd-preview__thumb { width: 82px; height: 70px; border-radius: 15px; } #foodie .fd-preview__copy strong { font-size: 17px; } #foodie .fd-gallery__footer { padding-top: 14px; } #foodie .fd-gallery__hint { display: none; } } /* Foodie 0.14.133 — complete Speisekarte category-section redesign, mobile-first */ #foodie .fd-categories { padding-block: 42px 10px; } #foodie .fd-gallery__header { margin-bottom: 22px; } #foodie .fd-gallery__title h2 { line-height: .98; letter-spacing: -.05em; } #foodie .fd-gallery__subtitle { max-width: 560px; font-size: 16px; line-height: 1.55; color: #65715b; } #foodie .fd-gallery__head-actions { align-self: flex-start; gap: 14px; } #foodie .fd-gallery--premium { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(320px, .78fr); gap: 24px; align-items: stretch; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 590px; border-radius: 34px; overflow: hidden; border: 1px solid rgba(39, 53, 26, .10); background: #172014; box-shadow: 0 22px 52px rgba(21, 30, 12, .10); } #foodie .fd-gallery--premium .fd-spotlight__image img { transition: transform 1s cubic-bezier(.16,1,.3,1), filter .6s ease; } #foodie .fd-gallery--premium .fd-spotlight.is-active .fd-spotlight__image img { transform: scale(1.05); filter: saturate(1.02); } #foodie .fd-gallery--premium .fd-spotlight__veil { background: linear-gradient(180deg, rgba(10,14,9,.06) 0%, rgba(10,14,9,.18) 32%, rgba(9,12,8,.82) 100%), linear-gradient(90deg, rgba(10,14,9,.48) 0%, rgba(10,14,9,.18) 46%, rgba(10,14,9,.08) 100%); } #foodie .fd-gallery--premium .fd-spotlight__badge { top: 24px; left: 24px; padding: 10px 14px; border-radius: 999px; background: rgba(18, 23, 14, .42); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(12px); } #foodie .fd-gallery--premium .fd-spotlight__content { inset: auto 24px 24px 24px; max-width: min(76%, 520px); gap: 10px; padding: 22px 22px 20px; border-radius: 26px; background: linear-gradient(180deg, rgba(15,19,12,.36), rgba(15,19,12,.64)); border: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(16px); box-shadow: 0 18px 40px rgba(10, 12, 8, .18); } #foodie .fd-gallery--premium .fd-spotlight__kicker { display: inline-flex; align-items: center; gap: 10px; font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: rgba(255,255,255,.74); } #foodie .fd-gallery--premium .fd-spotlight__kicker::before { content: ''; width: 30px; height: 1px; background: rgba(255,255,255,.42); } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size: clamp(38px, 4.5vw, 64px); line-height: .92; letter-spacing: -.05em; color: #fff; } #foodie .fd-gallery--premium .fd-spotlight__content small { font-size: 14px; font-weight: 560; color: rgba(255,255,255,.86); } #foodie .fd-gallery--premium .fd-spotlight__cta { margin-top: 10px; display: inline-flex; align-items: center; gap: 10px; padding: 13px 16px; border-radius: 16px; background: rgba(255,255,255,.12); color: #f5f9ee; font-size: 13px; font-weight: 720; box-shadow: none; } #foodie .fd-gallery--premium .fd-spotlight__cta::after { display: none; } #foodie .fd-gallery--premium .fd-gallery-premium__rail { min-height: 590px; padding: 18px; border-radius: 30px; background: linear-gradient(180deg, #f7f8f3 0%, #f0f3ea 100%); border: 1px solid rgba(43, 59, 28, .08); box-shadow: 0 18px 40px rgba(24, 34, 13, .06); overflow: hidden; } #foodie .fd-gallery-premium__rail-head { display: flex; flex-direction: column; gap: 8px; padding: 6px 4px 18px; margin-bottom: 8px; border-bottom: 1px solid #e0e6d7; } #foodie .fd-gallery-premium__label { margin: 0; font-size: 10px; font-weight: 750; letter-spacing: .22em; text-transform: uppercase; color: #6f7f61; } #foodie .fd-gallery-premium__rail-head > strong { font-size: 28px; line-height: .98; letter-spacing: -.04em; color: #1b2811; } #foodie .fd-gallery-premium__summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 2px; } #foodie .fd-gallery-premium__current { min-width: 0; font-size: 14px; font-weight: 700; color: #405430; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #foodie .fd-gallery-premium__count { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; background: #e8eedf; color: #5c6d4a; font-size: 11px; font-weight: 700; } #foodie .fd-gallery-premium__list { display: grid; gap: 12px; margin-top: 0; align-content: start; } #foodie .fd-gallery-premium__list .fd-preview:not([data-fd-preview-slot]) { display: none; } #foodie .fd-preview { display: grid; grid-template-columns: 92px minmax(0,1fr) 40px; gap: 12px; align-items: center; padding: 10px; border: 1px solid transparent; border-radius: 20px; background: rgba(255,255,255,.75); box-shadow: 0 8px 18px rgba(26, 36, 15, .04); transition: transform .35s cubic-bezier(.16,1,.3,1), border-color .35s ease, background .35s ease, box-shadow .35s ease; } #foodie .fd-preview::before { display: none; } #foodie .fd-preview__thumb { width: 92px; height: 76px; border-radius: 16px; overflow: hidden; box-shadow: none; } #foodie .fd-preview__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.16,1,.3,1); } #foodie .fd-preview__copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; } #foodie .fd-preview__copy strong { font-size: 18px; line-height: 1.02; letter-spacing: -.03em; color: #233117; } #foodie .fd-preview__copy small { font-size: 12px; color: #6f7c63; } #foodie .fd-preview__go { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 14px; background: #edf3e4; color: #4a672b; } #foodie .fd-preview.is-current { transform: translateX(-3px); border-color: rgba(92, 123, 54, .22); background: #fff; box-shadow: 0 14px 28px rgba(26, 36, 15, .08); } #foodie .fd-preview.is-current .fd-preview__go { background: #dde9ca; } #foodie .fd-gallery__footer { align-items: center; gap: 18px; padding-top: 18px; } #foodie .fd-gallery__pagination { font-size: 13px; font-weight: 750; color: #425436; } #foodie .fd-gallery__progress { flex: 0 1 340px; height: 2px; border-radius: 999px; background: #dde4d5; } #foodie .fd-gallery__progress span { background: #617f39; } #foodie .fd-gallery__hint { font-size: 11px; color: #77816f; } @media (hover:hover) and (pointer:fine) { #foodie .fd-gallery--premium .fd-spotlight.is-active:hover .fd-spotlight__cta { transform: translateY(-2px); background: rgba(255,255,255,.16); } #foodie .fd-preview:hover { transform: translateX(-2px); border-color: rgba(92, 123, 54, .16); background: #fff; box-shadow: 0 12px 24px rgba(26, 36, 15, .07); } #foodie .fd-preview:hover .fd-preview__thumb img { transform: scale(1.06); } #foodie .fd-preview:hover .fd-preview__go { background: #dde9ca; transform: translateX(2px); } } @media (max-width: 1120px) { #foodie .fd-gallery--premium { grid-template-columns: minmax(0, 1fr); gap: 18px; } #foodie .fd-gallery--premium .fd-gallery-premium__stage, #foodie .fd-gallery--premium .fd-gallery-premium__rail { min-height: auto; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 520px; } #foodie .fd-gallery--premium .fd-gallery-premium__rail { padding: 16px; } #foodie .fd-gallery-premium__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } } @media (max-width: 720px) { #foodie .fd-categories { padding-block: 28px 6px; } #foodie .fd-gallery__header { gap: 16px; margin-bottom: 16px; } #foodie .fd-gallery__title h2 { font-size: 46px; } #foodie .fd-gallery__subtitle { font-size: 14px; max-width: none; } #foodie .fd-gallery__head-actions { width: 100%; justify-content: space-between; align-items: center; } #foodie .fd-gallery__head-actions .fd-text-link { font-size: 14px; } #foodie .fd-gallery__arrows { gap: 8px; } #foodie .fd-gallery__arrows .fd-arrow { width: 42px; height: 42px; border-radius: 14px; } #foodie .fd-gallery--premium { gap: 14px; } #foodie .fd-gallery--premium .fd-gallery-premium__stage { min-height: 460px; border-radius: 26px; } #foodie .fd-gallery--premium .fd-spotlight__badge { top: 16px; left: 16px; padding: 8px 12px; } #foodie .fd-gallery--premium .fd-spotlight__content { inset: auto 14px 14px 14px; max-width: none; padding: 18px 16px 16px; border-radius: 22px; gap: 8px; } #foodie .fd-gallery--premium .fd-spotlight__content strong { font-size: 34px; line-height: .96; } #foodie .fd-gallery--premium .fd-spotlight__content small { font-size: 13px; } #foodie .fd-gallery--premium .fd-spotlight__cta { padding: 12px 14px; border-radius: 14px; font-size: 12.5px; } /* Mobile redesign: horizontal preview rail, not a bad stacked desktop list */ #foodie .fd-gallery--premium .fd-gallery-premium__rail { padding: 14px 0 4px; border-radius: 0; border: 0; background: transparent; box-shadow: none; overflow: visible; } #foodie .fd-gallery-premium__rail-head { gap: 6px; padding: 0 2px 12px; margin-bottom: 0; } #foodie .fd-gallery-premium__rail-head > strong { font-size: 22px; } #foodie .fd-gallery-premium__summary { gap: 10px; align-items: flex-start; flex-direction: column; } #foodie .fd-gallery-premium__current { white-space: normal; font-size: 13px; } #foodie .fd-gallery-premium__list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(228px, 76vw); grid-template-columns: none; gap: 12px; overflow-x: auto; padding: 4px 2px 8px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: none; } #foodie .fd-gallery-premium__list::-webkit-scrollbar { display: none; } #foodie .fd-gallery-premium__list .fd-preview:not([data-fd-preview-slot]) { display: grid; } #foodie .fd-preview { grid-template-columns: 1fr; gap: 12px; min-height: 184px; padding: 10px; border-radius: 20px; scroll-snap-align: start; align-content: start; } #foodie .fd-preview.is-current { transform: none; } #foodie .fd-preview__thumb { width: 100%; height: 112px; border-radius: 16px; } #foodie .fd-preview__copy strong { font-size: 17px; } #foodie .fd-preview__go { justify-self: end; margin-top: auto; } #foodie .fd-gallery__footer { flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 10px; } #foodie .fd-gallery__progress { flex: 1 1 100%; order: 3; } #foodie .fd-gallery__hint { display: none; } } /* Foodie 0.14.134 — homepage Speisekarte rebuilt as a single products loop */ #foodie .fd-menu-showcase { padding-block: 42px 10px; } #foodie .fd-showcase__header { margin-bottom: 22px; align-items: end; } #foodie .fd-showcase__title h2 { line-height: .98; letter-spacing: -.05em; } #foodie .fd-showcase__subtitle { max-width: 560px; font-size: 16px; line-height: 1.55; color: #65715b; } #foodie .fd-showcase-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 18px; } #foodie .fd-showcase-card { grid-column: span 4; position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 100%; overflow: hidden; border: 1px solid rgba(39,53,26,.10); border-radius: 28px; background: #fff; box-shadow: 0 12px 32px rgba(24,34,13,.05); transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .35s ease, border-color .35s ease; } #foodie .fd-showcase-card.is-featured { grid-column: span 6; grid-row: span 2; min-height: 100%; background: #172014; border-color: rgba(24,32,18,.16); box-shadow: 0 22px 52px rgba(18,27,10,.14); } #foodie .fd-showcase-card__media { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #eef2e7; } #foodie .fd-showcase-card.is-featured .fd-showcase-card__media { aspect-ratio: auto; flex: 1 1 auto; min-height: 420px; } #foodie .fd-showcase-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .75s cubic-bezier(.16,1,.3,1), filter .45s ease; } #foodie .fd-showcase-card__media .ti { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); font-size: 34px; color: #5b6b4b; } #foodie .fd-showcase-card__body { display: flex; flex-direction: column; gap: 10px; padding: 18px 18px 20px; min-width: 0; } #foodie .fd-showcase-card.is-featured .fd-showcase-card__body { position: absolute; inset: auto 18px 18px 18px; z-index: 2; padding: 24px; border-radius: 24px; background: linear-gradient(180deg, rgba(14,18,11,.18), rgba(14,18,11,.78)); border: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(16px); box-shadow: 0 18px 36px rgba(10,12,8,.20); } #foodie .fd-showcase-card.is-featured::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,12,8,.02) 0%, rgba(10,12,8,.12) 36%, rgba(10,12,8,.72) 100%); pointer-events: none; } #foodie .fd-showcase-card__badge { display: inline-flex; align-items: center; align-self: flex-start; padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.12); color: rgba(255,255,255,.92); font-size: 10px; font-weight: 760; letter-spacing: .22em; text-transform: uppercase; } #foodie .fd-showcase-card strong { display: block; font-size: 22px; line-height: 1.02; letter-spacing: -.04em; color: #1f2b15; } #foodie .fd-showcase-card.is-featured strong { font-size: clamp(40px, 4.8vw, 64px); line-height: .92; color: #fff; } #foodie .fd-showcase-card__desc { display: block; font-size: 13px; line-height: 1.55; color: #6a7660; } #foodie .fd-showcase-card.is-featured .fd-showcase-card__desc { max-width: 34ch; color: rgba(255,255,255,.78); } #foodie .fd-showcase-card__foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; } #foodie .fd-showcase-card .fd-price { font-size: 20px; font-weight: 760; letter-spacing: -.03em; color: #243218; } #foodie .fd-showcase-card.is-featured .fd-price { color: #f5f9ee; } #foodie .fd-showcase-card__cta { display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; border-radius: 14px; background: #eef3e5; color: #36501f; font-size: 12px; font-weight: 720; white-space: nowrap; } #foodie .fd-showcase-card.is-featured .fd-showcase-card__cta { background: rgba(255,255,255,.12); color: #f5f9ee; } @media (hover:hover) and (pointer:fine) { #foodie .fd-showcase-card:hover { transform: translateY(-4px); border-color: rgba(82,108,49,.22); box-shadow: 0 18px 38px rgba(24,34,13,.08); } #foodie .fd-showcase-card:hover .fd-showcase-card__media img { transform: scale(1.06); } #foodie .fd-showcase-card:hover .fd-showcase-card__cta .ti { transform: translate(2px,-2px); } } #foodie .fd-showcase-card__cta .ti { transition: transform .25s ease; } @media (max-width: 1120px) { #foodie .fd-showcase-card { grid-column: span 6; } #foodie .fd-showcase-card.is-featured { grid-column: span 12; grid-row: auto; } #foodie .fd-showcase-card.is-featured .fd-showcase-card__media { min-height: 360px; } } @media (max-width: 720px) { #foodie .fd-menu-showcase { padding-block: 28px 8px; } #foodie .fd-showcase__header { margin-bottom: 16px; gap: 14px; align-items: start; } #foodie .fd-showcase__title h2 { font-size: 46px; } #foodie .fd-showcase__subtitle { font-size: 14px; max-width: none; } #foodie .fd-showcase-grid { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 84vw); grid-template-columns: none; gap: 14px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: none; } #foodie .fd-showcase-grid::-webkit-scrollbar { display: none; } #foodie .fd-showcase-card, #foodie .fd-showcase-card.is-featured { grid-column: auto; grid-row: auto; min-height: 0; scroll-snap-align: start; border-radius: 24px; } #foodie .fd-showcase-card.is-featured { min-height: auto; } #foodie .fd-showcase-card__media, #foodie .fd-showcase-card.is-featured .fd-showcase-card__media { aspect-ratio: 4 / 3; min-height: 0; } #foodie .fd-showcase-card__body, #foodie .fd-showcase-card.is-featured .fd-showcase-card__body { position: relative; inset: auto; padding: 16px; border: 0; border-radius: 0; background: transparent; backdrop-filter: none; box-shadow: none; } #foodie .fd-showcase-card.is-featured::after { display: none; } #foodie .fd-showcase-card__badge { background: #eef3e4; color: #48622a; } #foodie .fd-showcase-card strong, #foodie .fd-showcase-card.is-featured strong { font-size: 26px; line-height: .98; color: #1f2b15; } #foodie .fd-showcase-card__desc, #foodie .fd-showcase-card.is-featured .fd-showcase-card__desc { color: #6a7660; max-width: none; } #foodie .fd-showcase-card .fd-price, #foodie .fd-showcase-card.is-featured .fd-price { color: #243218; font-size: 18px; } #foodie .fd-showcase-card__cta, #foodie .fd-showcase-card.is-featured .fd-showcase-card__cta { background: #eef3e5; color: #36501f; } } /* 0.14.135 — page entrance and repeatable, low-cost scroll motion. */ @keyframes fd-enter-lift { from { opacity:0; translate:0 13px; } to { opacity:1; translate:0 0; } } /* Only headings/links inside page chrome: do not translate sticky header shells, form inputs, cart controls or ordering actions. */ #foodie.fd-page-enter .fd-header__inner > :is(.fd-logo,.fd-header__location,.fd-nav,.fd-header__account,.fd-mobile-menu-toggle) { animation:fd-enter-lift .55s cubic-bezier(.16,1,.3,1) both; } #foodie.fd-page-enter .fd-header__inner > .fd-nav { animation-delay:75ms; } #foodie.fd-page-enter .fd-header__inner > .fd-header__account, #foodie.fd-page-enter .fd-header__inner > .fd-mobile-menu-toggle { animation-delay:115ms; } #foodie.fd-page-enter .fd-home-intro > :first-child, #foodie.fd-page-enter .fd-orderhead__copy, #foodie.fd-page-enter .fd-pagehead h1, #foodie.fd-page-enter .fd-banner__copy h1, #foodie.fd-page-enter .fd-auth__pitch h1 { animation:fd-enter-lift .75s cubic-bezier(.16,1,.3,1) both; animation-delay:75ms; } #foodie.fd-page-enter .fd-home-intro > .fd-menu-link, #foodie.fd-page-enter .fd-pagehead p, #foodie.fd-page-enter .fd-banner__copy > p { animation:fd-enter-lift .75s cubic-bezier(.16,1,.3,1) both; animation-delay:160ms; } /* These classes are only applied with JS/IO available. Without JS all text, links, imagery and products are visible by default. */ #foodie.fd-motion-ready [data-fd-reveal] { transition:opacity .74s cubic-bezier(.16,1,.3,1), translate .84s cubic-bezier(.16,1,.3,1); transition-delay:var(--fd-reveal-delay,0ms); } #foodie.fd-motion-ready [data-fd-reveal]:not(.fd-is-revealed) { opacity:0; translate:0 24px; } #foodie.fd-motion-ready [data-fd-reveal].fd-is-revealed { opacity:1; translate:0 0; } /* Slightly offset editorial pairs from alternate sides for a designed flow. */ #foodie.fd-motion-ready .fd-story__photo[data-fd-reveal]:not(.fd-is-revealed) { translate:-22px 12px; } #foodie.fd-motion-ready .fd-story__copy[data-fd-reveal]:not(.fd-is-revealed) { translate:22px 12px; } #foodie.fd-motion-ready [data-fd-reveal]:focus-within { opacity:1; translate:0 0; transition:none; } /* Product image settles subtly as each card is revealed. */ #foodie.fd-motion-ready .fd-showcase-card[data-fd-reveal] .fd-showcase-card__media img { scale:1.045; transition:scale .95s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1); } #foodie.fd-motion-ready .fd-showcase-card.fd-is-revealed .fd-showcase-card__media img { scale:1; } @media (max-width:720px) { #foodie.fd-motion-ready [data-fd-reveal]:not(.fd-is-revealed) { translate:0 16px; } #foodie.fd-motion-ready .fd-story__photo[data-fd-reveal]:not(.fd-is-revealed), #foodie.fd-motion-ready .fd-story__copy[data-fd-reveal]:not(.fd-is-revealed) { translate:0 16px; } } @media (prefers-reduced-motion: reduce) { #foodie.fd-page-enter .fd-header__inner > *, #foodie.fd-page-enter .fd-home-intro > *, #foodie.fd-page-enter :is(.fd-orderhead__copy,.fd-pagehead h1,.fd-banner__copy h1,.fd-auth__pitch h1,.fd-pagehead p,.fd-banner__copy > p) { animation:none; opacity:1; translate:0 0; } #foodie.fd-motion-ready [data-fd-reveal] { transition:none; opacity:1; translate:0 0; } } @media print { #foodie.fd-page-enter *, #foodie.fd-motion-ready [data-fd-reveal] { animation:none; opacity:1; translate:0 0; transition:none; } } /* Foodie 0.14.136 — clean single-category showcase with auto-sliding groups of 4 */ #foodie .fd-category-showcase { padding-block: 42px 10px; } #foodie .fd-category-showcase__header { align-items: flex-end; margin-bottom: 22px; } #foodie .fd-category-showcase__title h2 { line-height: .98; letter-spacing: -.05em; } #foodie .fd-category-showcase__subtitle { max-width: 560px; font-size: 16px; line-height: 1.55; color: #66725d; } #foodie .fd-category-showcase__actions { display:flex; align-items:center; gap:16px; } #foodie .fd-category-showcase__arrows { display:flex; align-items:center; gap:10px; } #foodie .fd-category-showcase__layout { display:grid; grid-template-columns:minmax(0,1.28fr) minmax(320px,.72fr); gap:24px; align-items:stretch; } #foodie .fd-category-stage { position:relative; min-height:600px; border-radius:34px; overflow:hidden; background:#162012; border:1px solid rgba(35,48,23,.10); box-shadow:0 22px 52px rgba(23,32,14,.10); } #foodie .fd-category-stage__panel { position:absolute; inset:0; display:block; color:#fff; opacity:0; pointer-events:none; transform:translateX(36px) scale(1.015); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); } #foodie .fd-category-stage__panel.is-active { opacity:1; pointer-events:auto; transform:none; z-index:2; } #foodie .fd-category-stage__media, #foodie .fd-category-stage__media img { position:absolute; inset:0; width:100%; height:100%; } #foodie .fd-category-stage__media img { object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1), filter .55s ease; } #foodie .fd-category-stage__panel.is-active .fd-category-stage__media img { transform:scale(1.05); } #foodie .fd-category-stage__media .ti { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); font-size:42px; color:#fff; } #foodie .fd-category-stage__veil { position:absolute; inset:0; background: linear-gradient(180deg, rgba(9,12,8,.08) 0%, rgba(9,12,8,.16) 34%, rgba(9,12,8,.84) 100%), linear-gradient(90deg, rgba(9,12,8,.50) 0%, rgba(9,12,8,.18) 48%, rgba(9,12,8,.08) 100%); } #foodie .fd-category-stage__badge { position:absolute; top:22px; left:22px; z-index:2; padding:10px 14px; border-radius:999px; background:rgba(18,24,14,.42); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(12px); font-size:11px; font-weight:740; letter-spacing:.18em; text-transform:uppercase; } #foodie .fd-category-stage__body { position:absolute; inset:auto 22px 22px 22px; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:10px; max-width:min(72%, 520px); padding:22px; border-radius:26px; background:linear-gradient(180deg, rgba(14,18,11,.18), rgba(14,18,11,.72)); border:1px solid rgba(255,255,255,.10); backdrop-filter:blur(14px); box-shadow:0 18px 40px rgba(10,12,8,.18); } #foodie .fd-category-stage__kicker { display:inline-flex; align-items:center; gap:10px; font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.74); } #foodie .fd-category-stage__kicker::before { content:''; width:28px; height:1px; background:rgba(255,255,255,.44); } #foodie .fd-category-stage__body strong { font-size:clamp(42px,4.7vw,66px); line-height:.92; letter-spacing:-.05em; color:#fff; } #foodie .fd-category-stage__body small { font-size:14px; font-weight:560; color:rgba(255,255,255,.86); } #foodie .fd-category-stage__cta { margin-top:8px; display:inline-flex; align-items:center; gap:8px; padding:12px 15px; border-radius:16px; background:rgba(255,255,255,.12); color:#f4f8ee; font-size:13px; font-weight:720; } #foodie .fd-category-rail { min-height:600px; padding:18px; border-radius:30px; background:linear-gradient(180deg, #f7f8f3 0%, #f1f3ec 100%); border:1px solid rgba(43,59,28,.08); box-shadow:0 18px 40px rgba(24,34,13,.06); overflow:hidden; } #foodie .fd-category-rail__head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:6px 4px 18px; margin-bottom:10px; border-bottom:1px solid #dfe5d7; } #foodie .fd-category-rail__eyebrow { margin:0 0 8px; font-size:10px; font-weight:760; letter-spacing:.22em; text-transform:uppercase; color:#70805f; } #foodie .fd-category-rail__head strong { font-size:30px; line-height:.96; letter-spacing:-.05em; color:#1e2a14; } #foodie .fd-category-rail__count { flex:0 0 auto; padding:8px 12px; border-radius:999px; background:#e8eedf; color:#5a6c48; font-size:11px; font-weight:740; } #foodie .fd-category-rail__viewport { overflow:hidden; } #foodie .fd-category-rail__track { display:flex; width:100%; transition:transform .78s cubic-bezier(.16,1,.3,1); will-change:transform; } #foodie .fd-category-rail__page { flex:0 0 100%; min-width:100%; display:grid; gap:12px; } #foodie .fd-category-rail__item { appearance:none; width:100%; display:grid; grid-template-columns:92px minmax(0,1fr) 38px; gap:12px; align-items:center; padding:10px; border:1px solid transparent; border-radius:20px; background:rgba(255,255,255,.78); box-shadow:0 8px 18px rgba(25,35,15,.04); color:#243117; text-align:left; cursor:pointer; transition:transform .35s cubic-bezier(.16,1,.3,1), border-color .35s ease, background .35s ease, box-shadow .35s ease; } #foodie .fd-category-rail__thumb { width:92px; height:76px; border-radius:16px; overflow:hidden; background:#e9efe0; } #foodie .fd-category-rail__thumb img { width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.16,1,.3,1); } #foodie .fd-category-rail__thumb .ti { position:relative; inset:auto; display:grid; place-items:center; width:100%; height:100%; font-size:26px; color:#5c6b4c; } #foodie .fd-category-rail__copy { display:flex; flex-direction:column; gap:5px; min-width:0; } #foodie .fd-category-rail__copy strong { display:block; font-size:18px; line-height:1.02; letter-spacing:-.03em; color:#223017; word-break:break-word; } #foodie .fd-category-rail__copy small { font-size:12px; color:#6d7962; } #foodie .fd-category-rail__go { display:grid; place-items:center; width:36px; height:36px; border-radius:14px; background:#edf3e4; color:#496728; } #foodie .fd-category-rail__item.is-current { transform:translateX(-3px); border-color:rgba(92,123,54,.22); background:#fff; box-shadow:0 14px 28px rgba(26,36,15,.08); } #foodie .fd-category-rail__item.is-current .fd-category-rail__go { background:#dce8c8; } #foodie .fd-category-rail__item:focus-visible, #foodie .fd-category-stage__panel:focus-visible, #foodie .fd-category-showcase__actions .fd-arrow:focus-visible { outline:3px solid #6d9240; outline-offset:4px; } @media (hover:hover) and (pointer:fine) { #foodie .fd-category-stage__panel.is-active:hover .fd-category-stage__cta { transform:translateY(-2px); background:rgba(255,255,255,.16); } #foodie .fd-category-rail__item:hover { transform:translateX(-2px); border-color:rgba(92,123,54,.16); background:#fff; box-shadow:0 12px 24px rgba(26,36,15,.07); } #foodie .fd-category-rail__item:hover .fd-category-rail__thumb img { transform:scale(1.06); } #foodie .fd-category-rail__item:hover .fd-category-rail__go { background:#dde8ca; transform:translateX(2px); } } @media (max-width: 1120px) { #foodie .fd-category-showcase__layout { grid-template-columns:minmax(0,1fr); gap:18px; } #foodie .fd-category-stage, #foodie .fd-category-rail { min-height:auto; } #foodie .fd-category-stage { min-height:520px; } } @media (max-width: 720px) { #foodie .fd-category-showcase { padding-block:28px 8px; } #foodie .fd-category-showcase__header { align-items:flex-start; gap:14px; margin-bottom:16px; } #foodie .fd-category-showcase__title h2 { font-size:46px; } #foodie .fd-category-showcase__subtitle { max-width:none; font-size:14px; } #foodie .fd-category-showcase__actions { width:100%; justify-content:space-between; } #foodie .fd-category-showcase__arrows .fd-arrow { width:42px; height:42px; border-radius:14px; } #foodie .fd-category-stage { min-height:420px; border-radius:26px; } #foodie .fd-category-stage__badge { top:16px; left:16px; padding:8px 12px; } #foodie .fd-category-stage__body { inset:auto 14px 14px 14px; max-width:none; padding:18px 16px 16px; border-radius:22px; gap:8px; } #foodie .fd-category-stage__body strong { font-size:36px; } #foodie .fd-category-stage__cta { padding:12px 14px; border-radius:14px; font-size:12.5px; } #foodie .fd-category-rail { padding:14px; border-radius:22px; } #foodie .fd-category-rail__head { padding:2px 2px 14px; margin-bottom:8px; } #foodie .fd-category-rail__head strong { font-size:24px; } #foodie .fd-category-rail__page { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } #foodie .fd-category-rail__item { grid-template-columns:1fr; gap:10px; padding:10px; align-content:start; min-height:190px; } #foodie .fd-category-rail__thumb { width:100%; height:94px; border-radius:14px; } #foodie .fd-category-rail__copy strong { font-size:16px; } #foodie .fd-category-rail__go { justify-self:end; margin-top:auto; } } /* Foodie 0.14.138 — category showcase grid of 4 + heute row cleanup */ #foodie .fd-category-showcase__layout { grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr); gap: 22px; } #foodie .fd-category-stage { min-height: 600px; } #foodie .fd-category-rail { min-height: 600px; padding: 18px; border-radius: 30px; } #foodie .fd-category-rail__head { padding: 4px 4px 16px; margin-bottom: 12px; } #foodie .fd-category-rail__head strong { font-size: 26px; } #foodie .fd-category-rail__page { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } #foodie .fd-category-rail__item { grid-template-columns: 1fr; align-content: start; align-items: start; gap: 10px; min-height: 210px; padding: 12px; border-radius: 22px; } #foodie .fd-category-rail__thumb { width: 100%; height: 112px; border-radius: 16px; } #foodie .fd-category-rail__copy { gap: 6px; } #foodie .fd-category-rail__copy strong { font-size: 17px; line-height: 1.02; } #foodie .fd-category-rail__copy small { font-size: 12px; } #foodie .fd-category-rail__go { justify-self: end; align-self: end; margin-top: auto; } #foodie .fd-category-rail__item.is-current { transform: translateY(-3px); } @media (hover:hover) and (pointer:fine) { #foodie .fd-category-rail__item:hover { transform: translateY(-2px); } } /* Keep the clean 4-card concept on tablet/mobile too */ @media (max-width: 1120px) { #foodie .fd-category-stage { min-height: 500px; } #foodie .fd-category-rail { min-height: auto; } } @media (max-width: 720px) { #foodie .fd-category-showcase__layout { gap: 14px; } #foodie .fd-category-stage { min-height: 400px; } #foodie .fd-category-rail { padding: 14px; border-radius: 22px; } #foodie .fd-category-rail__page { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } #foodie .fd-category-rail__item { min-height: 176px; padding: 10px; border-radius: 18px; } #foodie .fd-category-rail__thumb { height: 88px; border-radius: 14px; } #foodie .fd-category-rail__copy strong { font-size: 15px; } #foodie .fd-category-rail__go { width: 34px; height: 34px; border-radius: 12px; } } /* Öffnungszeiten: remove the inset line that conflicts with the rounded Heute highlight */ #foodie .fd-contact .fd-contact__block .fd-week__row.is-today { background: #edf4e4; color: #33501e; border: 1px solid #d4e2bf; border-radius: 14px; box-shadow: none; } #foodie .fd-contact .fd-contact__block .fd-week__row.is-today em { background: #dbeac5; color: #3f5d28; } #foodie .fd-contact .fd-contact__block .fd-week__row.is-today + .fd-week__row { border-top-color: transparent; } /* 0.14.140 — signed-in last order */ #foodie .fd-last-order{margin-top:30px;margin-bottom:34px;padding:26px 30px;border:1px solid #e2e8d9;border-radius:28px;background:#f7f9f3} #foodie .fd-last-order__top,#foodie .fd-last-order__content{display:flex;justify-content:space-between;gap:24px} #foodie .fd-last-order__top{align-items:start;padding-bottom:18px;border-bottom:1px solid #dfe6d6} #foodie .fd-last-order__top h2{font-size:clamp(26px,3vw,38px);letter-spacing:-.04em;margin:4px 0 8px} #foodie .fd-last-order__top p:last-child{color:#66725d;margin:0} #foodie .fd-last-order__number{font-size:12px;font-weight:700;color:#52693c;background:#e9efdf;padding:9px 12px;border-radius:12px;white-space:nowrap} #foodie .fd-last-order__content{align-items:center;padding-top:20px} #foodie .fd-last-order__items{display:grid;gap:10px;flex:1;min-width:0} #foodie .fd-last-order__item{display:flex;gap:12px;align-items:start;font-size:15px;font-weight:600;color:#243019} #foodie .fd-last-order__qty{flex:none;color:#577337} #foodie .fd-last-order__summary{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:flex-end} #foodie .fd-last-order__summary>span{font-size:13px;color:#69765f} #foodie .fd-last-order__summary>strong{font-size:19px;color:#243019} #foodie .fd-last-order__button{border-radius:16px;white-space:nowrap} @media(max-width:720px){#foodie .fd-last-order{padding:20px;border-radius:22px;margin-top:20px}#foodie .fd-last-order__top,#foodie .fd-last-order__content{flex-direction:column;gap:14px}#foodie .fd-last-order__summary{width:100%;justify-content:space-between}#foodie .fd-last-order__button{width:100%;justify-content:center}} /* Foodie 0.14.142 — compact mobile footer, padded header and minimal active tabs */ @media (max-width: 767px) { #foodie .fd-footer { padding: 22px 0 calc(84px + env(safe-area-inset-bottom, 0px)); } #foodie .fd-footer__grid { gap: 15px 20px; grid-template-columns: repeat(2,minmax(0,1fr)); } #foodie .fd-footer__brand { grid-column: 1/-1; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; } #foodie .fd-footer__brand p { display:none; } #foodie .fd-footer__brand .fd-btn { margin:0; } #foodie .fd-footer__col { min-width:0; } #foodie .fd-footer__col h2 { margin-bottom:8px; } #foodie .fd-footer__list { gap:7px; } #foodie .fd-footer__bottom { margin-top:16px; padding-top:12px; padding-bottom:0; gap:8px; flex-direction:row; align-items:center; justify-content:space-between; flex-wrap:wrap; } #foodie .fd-footer__legal { gap:12px; } #foodie .fd-footer--compact { padding-top:0; } #foodie .fd-tabbar { transition: transform .32s cubic-bezier(.2,.8,.2,1), opacity .28s ease, visibility .28s ease; will-change:transform,opacity; } #foodie .fd-tabbar.is-scroll-hidden { transform:translate3d(0,110%,0); opacity:0; visibility:hidden; pointer-events:none; } #foodie .fd-tabbar__item.is-active { color:var(--fd-brand,#496b29); font-weight:750; } #foodie .fd-tabbar__item.is-active span { font-weight:750; } #foodie .fd-tabbar__item.is-active .ti { background:none!important; box-shadow:none!important; border-radius:0!important; color:var(--fd-brand,#496b29)!important; } #foodie .fd-tabbar__item .ti { transition:color .25s ease, transform .25s ease; } } @media (prefers-reduced-motion:reduce) { #foodie .fd-tabbar { transition:none!important; } } /* Foodie v0.14.144 — 4 across. One horizontal, group-sliding category carousel. */ #foodie .fd-category-loop { padding:46px 0 12px; overflow:hidden; } #foodie .fd-category-loop__header { align-items:end; margin-bottom:22px; } #foodie .fd-category-loop__title h2 { letter-spacing:-.042em; line-height:1.05; } #foodie .fd-category-loop__subtitle { margin-top:7px; color:#677360; font-size:15px; line-height:1.5; } #foodie .fd-category-loop__nav { display:flex; align-items:center; gap:24px; } #foodie .fd-category-loop__arrows { display:flex; gap:8px; } #foodie .fd-category-loop__arrows .fd-arrow { border-radius:50%; } #foodie .fd-category-loop__shell { min-width:0; } #foodie .fd-category-loop__viewport { overflow:hidden; border-radius:24px; outline-offset:4px; touch-action:pan-y; } #foodie .fd-category-loop__track { --fd-loop-gap:18px; display:flex; gap:var(--fd-loop-gap); align-items:stretch; will-change:transform; } #foodie .fd-category-loop__card { position:relative; flex:0 0 calc((100% - 3 * var(--fd-loop-gap)) / 4); height:340px; min-width:0; display:block; overflow:hidden; border-radius:22px; background:#253119; color:#fff; isolation:isolate; border:1px solid rgba(26,35,17,.08); transition:box-shadow .35s ease; text-decoration:none; } #foodie .fd-category-loop__image { position:absolute; inset:0; display:block; background:#dce7cf; } #foodie .fd-category-loop__image img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1); } #foodie .fd-category-loop__image .ti { display:grid; place-items:center; width:100%; height:100%; color:#3b5127; font-size:46px; } #foodie .fd-category-loop__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,10,5,.03) 25%,rgba(7,13,6,.20) 47%,rgba(8,13,5,.85) 100%); } #foodie .fd-category-loop__content { position:absolute; left:22px; bottom:25px; right:50px; display:flex; flex-direction:column; gap:7px; } #foodie .fd-category-loop__content strong { font-size:clamp(20px,2vw,28px); line-height:1.04; letter-spacing:-.04em; font-weight:800; color:#fff; overflow-wrap:normal; } #foodie .fd-category-loop__content small { color:rgba(255,255,255,.82); font-size:12.5px; } #foodie .fd-category-loop__go { position:absolute; right:17px; top:17px; display:grid; place-items:center; width:41px; height:41px; border-radius:14px; border:1px solid rgba(255,255,255,.35); color:#fff; background:rgba(255,255,255,.11); backdrop-filter:blur(8px); transition:background .25s ease, transform .35s ease; } #foodie .fd-category-loop__go .ti { font-size:17px; } #foodie .fd-category-loop__bottom { display:flex; align-items:center; gap:14px; padding:18px 2px 0; color:#547039; font-size:12px; font-weight:750; font-variant-numeric:tabular-nums; } #foodie .fd-category-loop__meter { flex:0 1 220px; height:2px; background:#dce5d2; border-radius:5px; overflow:hidden; } #foodie .fd-category-loop__meter > span { display:block; width:33.3%; height:100%; background:#5c7e38; transition:width .7s cubic-bezier(.16,1,.3,1); } @media (hover:hover) and (pointer:fine) { #foodie .fd-category-loop__card:hover { box-shadow:0 17px 34px rgba(30,45,20,.18); } #foodie .fd-category-loop__card:hover img { transform:scale(1.065); } #foodie .fd-category-loop__card:hover .fd-category-loop__go { transform:translate(2px,-2px); background:rgba(255,255,255,.26); } } @media(max-width:1050px) { #foodie .fd-category-loop__card { flex-basis:calc((100% - var(--fd-loop-gap)) / 2); height:330px; } } @media(max-width:680px) { #foodie .fd-category-loop { padding:27px 0 8px; } #foodie .fd-category-loop__header { align-items:start; gap:15px; margin-bottom:16px; } #foodie .fd-category-loop__title h2 { font-size:clamp(29px,8vw,38px); } #foodie .fd-category-loop__subtitle { font-size:13px; } #foodie .fd-category-loop__nav { width:100%; justify-content:space-between; } #foodie .fd-category-loop__arrows .fd-arrow { width:40px; height:40px; } #foodie .fd-category-loop__viewport { border-radius:20px; } #foodie .fd-category-loop__track { --fd-loop-gap:12px; } #foodie .fd-category-loop__card { flex-basis:min(72vw,310px); height:310px; border-radius:20px; } #foodie .fd-category-loop__content { left:19px; bottom:22px; right:47px; } #foodie .fd-category-loop__content strong { font-size:25px; } #foodie .fd-category-loop__go { width:36px; height:36px; right:14px; top:14px; border-radius:12px; } } @media(prefers-reduced-motion:reduce) { #foodie .fd-category-loop__track, #foodie .fd-category-loop__card img, #foodie .fd-category-loop__meter > span { transition:none; animation:none; } } /* Bestseller cards: real top-products supplied by FoodUp Analytics. */ #foodie .fd-bestsellers { padding:48px 0 20px; } #foodie .fd-bestsellers__head { margin-bottom:20px; } #foodie .fd-bestsellers__head p:not(.fd-eyebrow) { margin-top:8px; font-size:14px; color:#667360; } #foodie .fd-bestsellers__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; } #foodie .fd-bestsellers__card { min-width:0; display:flex; flex-direction:column; background:#fff; border:1px solid #e0e8d7; border-radius:22px; overflow:hidden; color:#223119; transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease; } #foodie .fd-bestsellers__image { display:block; position:relative; aspect-ratio:1.3; overflow:hidden; background:#eff3e9; } #foodie .fd-bestsellers__image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; } #foodie .fd-bestsellers__image > .ti { width:100%; height:100%; display:grid; place-items:center; color:#799166; font-size:35px; } #foodie .fd-bestsellers__rank { position:absolute; left:13px; top:13px; padding:8px 11px; border-radius:11px; color:#29451b; background:rgba(255,255,255,.93); font-weight:850; font-size:12px; } #foodie .fd-bestsellers__copy { padding:17px; display:flex; flex:1; flex-direction:column; gap:7px; } #foodie .fd-bestsellers__copy > strong { font-size:18px; letter-spacing:-.03em; line-height:1.13; color:#263419; } #foodie .fd-bestsellers__copy > small { font-size:12px; color:#6b795d; } #foodie .fd-bestsellers__foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:12px; font-size:14px; font-weight:750; color:#3e5d21; } #foodie .fd-bestsellers__foot > .ti { display:grid; place-items:center; width:33px; height:33px; border-radius:11px; background:#edf3e5; } @media(hover:hover) and (pointer:fine) { #foodie .fd-bestsellers__card:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(24,43,15,.08); } #foodie .fd-bestsellers__card:hover img { transform:scale(1.065); } } @media(max-width:1050px) { #foodie .fd-bestsellers__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:680px) { #foodie .fd-bestsellers { padding:28px 0 12px; } #foodie .fd-bestsellers__grid { grid-auto-flow:column; grid-auto-columns:min(75vw,290px); grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; padding-bottom:8px; scrollbar-width:none; } #foodie .fd-bestsellers__grid::-webkit-scrollbar { display:none; } #foodie .fd-bestsellers__card { scroll-snap-align:start; } } /* Foodie 0.14.145 — restore route-specific mobile headers and top-only safe area. Never paint the whole body green: that also colours Safari bottom chrome. The top safe inset belongs only to the actual visible page header/photo. */ @media (max-width: 768px) { /* Keep the document/safe-area bottom neutral. The bottom dock handles its own inset. */ html:has(body#foodie), body#foodie { background-color:#fff; } /* Ordinary pages: neutral header, its own background extends behind the notch. The landing page alone retains the original green header design. */ #foodie .fd-header { display:block; position:relative; height:auto; min-height:0; padding-top:env(safe-area-inset-top, 0px); border:0; border-bottom:1px solid #e7ecdf; border-radius:0 0 20px 20px; background:#fff; color:#243019; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; } #foodie .fd-header__inner { width:100%; max-width:none; min-height:78px; height:auto; margin-inline:0; padding:12px max(20px, calc(env(safe-area-inset-right, 0px) + 16px)) 12px max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); gap:12px; box-sizing:border-box; } #foodie .fd-header__location > span {color:#243019;} #foodie .fd-header__location > a, #foodie .fd-header__location .fd-status {color:#607056;} #foodie .fd-mobile-menu-toggle { background:#f2f5ec; color:#354e22; border-color:#dfe7d5; } #foodie .fd-mobile-menu { left:max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); right:max(20px, calc(env(safe-area-inset-right, 0px) + 16px)); } #foodie.fd-route-home .fd-header { background:linear-gradient(110deg,#3d5922,#607f30); color:#fff; border:0; border-radius:0 0 22px 22px; } #foodie.fd-route-home .fd-header__location > span {color:#fff;} #foodie.fd-route-home .fd-header__location > a, #foodie.fd-route-home .fd-header__location .fd-status {color:#f0f5e7;} #foodie.fd-route-home .fd-mobile-menu-toggle { border-color:#ffffff38; background:#ffffff0d; color:#fff; } /* Kontakt and Speisekarte already have purpose-built photographic topbars. Restore those instead of stacking another identical header above them. */ #foodie.fd-route-contact .fd-header, #foodie.fd-route-order .fd-header {display:none;} /* Kontakt: the cover image / green fallback extends to viewport top. */ #foodie.fd-route-contact .fd-banner {padding:0;margin:0;} #foodie.fd-route-contact .fd-banner__frame { width:100%; margin:0; min-height:calc(340px + env(safe-area-inset-top, 0px)); border-radius:0 0 24px 24px; overflow:hidden; background:linear-gradient(110deg,#3d5922,#607f30); } #foodie.fd-route-contact .fd-banner__topbar { display:flex; z-index:5; top:calc(env(safe-area-inset-top, 0px) + 14px); left:max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); right:max(20px, calc(env(safe-area-inset-right, 0px) + 16px)); } #foodie.fd-route-contact .fd-banner__copy { position:relative; z-index:2; padding:calc(env(safe-area-inset-top, 0px) + 88px) max(20px, calc(env(safe-area-inset-right, 0px) + 16px)) 26px max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); } /* Speisekarte: restore its photo strip and floating status/logo topbar. */ #foodie.fd-route-order .fd-orderhead { padding:0 0 18px; margin:0; background:transparent; } #foodie.fd-route-order .fd-orderhead__photo { display:block; position:relative; width:100%; height:calc(186px + env(safe-area-inset-top, 0px)); overflow:hidden; background:linear-gradient(110deg,#3d5922,#607f30); } #foodie.fd-route-order .fd-orderhead__photo img { width:100%;height:100%;display:block;object-fit:cover; } #foodie.fd-route-order .fd-orderhead__topbar { display:flex; z-index:3; top:calc(env(safe-area-inset-top, 0px) + 14px); left:max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); right:max(20px, calc(env(safe-area-inset-right, 0px) + 16px)); } #foodie.fd-route-order .fd-orderhead__inner { position:relative; z-index:2; width:100%; max-width:none; margin:-24px 0 0; padding:22px max(20px, calc(env(safe-area-inset-right, 0px) + 16px)) 0 max(20px, calc(env(safe-area-inset-left, 0px) + 16px)); border-radius:24px 24px 0 0; background:#fff; } #foodie.fd-route-order .fd-orderhead__inner.fd-order-fade { opacity:1; translate:none; } } @media (max-width: 380px) { #foodie.fd-route-contact .fd-banner__copy {padding-top:calc(env(safe-area-inset-top, 0px) + 74px);} } /* Foodie 0.14.146 — phone fixes * 1. Photo topbars (Kontakt, Speisekarte): the open-status pill could not shrink * (flex item, min-width:auto, nowrap) and ran past the right screen edge. * It now takes the space left next to the logo and ends with "…". * 2. The decorative ring of the page heading sat over long titles (AGB) on the * white phone header; it is hidden on phones (up to 768 px) only. */ @media (max-width: 899px) { #foodie .fd-banner__topbar > .fd-status, #foodie .fd-orderhead__topbar > .fd-status { min-width:0; flex:0 1 auto; overflow:hidden; } #foodie .fd-banner__topbar > .fd-status > span:last-child, #foodie .fd-orderhead__topbar > .fd-status > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } #foodie .fd-banner__topbar > :first-child, #foodie .fd-orderhead__topbar > :first-child { flex:0 0 auto; } } @media (max-width: 768px) { #foodie .fd-pagehead::after { display:none; } } /* Foodie 0.14.149 — bestseller prices: space between "CHF" and the amount like everywhere else */ #foodie .fd-bestsellers__foot .woocommerce-Price-currencySymbol{margin-right:.25em} /* Foodie 0.14.151 — horizontal rows on phones: the first item starts at the page edge (--fd-gutter), the row itself runs to the right edge of the screen. */ @media (max-width: 680px) { #foodie .fd-category-loop__viewport { margin-right: calc(var(--fd-gutter) * -1); border-radius: 20px 0 0 20px; } #foodie .fd-bestsellers__grid { width: 100%; max-width: none; margin-inline: 0; padding-inline: var(--fd-gutter); scroll-padding-inline: var(--fd-gutter); } } /* Foodie 0.14.152 — "Unsere Speisekarte" cards: no dark ring (the dark card background showed through the translucent border); on phones a native swipe row from screen edge to screen edge, without arrow buttons. */ #foodie .fd-category-loop__card { border:0 !important; background-clip:padding-box; } @media (max-width: 680px) { #foodie .fd-category-loop.is-native .fd-category-loop__viewport { margin-left: calc(var(--fd-gutter) * -1) !important; margin-right: calc(var(--fd-gutter) * -1) !important; padding-inline: var(--fd-gutter); border-radius: 0 !important; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--fd-gutter); touch-action: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; } #foodie .fd-category-loop.is-native .fd-category-loop__viewport::-webkit-scrollbar { display: none; } #foodie .fd-category-loop.is-native .fd-category-loop__track { width: max-content; transform: none !important; transition: none !important; } #foodie .fd-category-loop.is-native .fd-category-loop__card { flex: 0 0 min(76vw, 310px); scroll-snap-align: start; } #foodie .fd-category-loop__arrows { display: none !important; } } /* Foodie 0.14.153 — no divider line directly above (or below) the highlighted "Heute" row. */ #foodie .fd-week__row:has(+ .fd-week__row.is-today) { border-bottom-color:transparent !important; } #foodie .fd-week__row:has(+ .fd-week__row.is-today)::before, #foodie .fd-week__row.is-today::before, #foodie .fd-week__row.is-today + .fd-week__row::before { background:transparent !important; } #foodie .fd-week__row.is-today + .fd-week__row { border-top-color:transparent !important; } /* Foodie 0.14.153 — Lieferung / Abholung / Vor Ort: one row of three on phones (icon, title, arrow; the description is kept for screen readers). */ @media (max-width: 680px) { #foodie .fd-service-cards { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:10px !important; margin-block:28px !important; } #foodie .fd-service-cards > a { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:10px; min-width:0; padding:16px 8px 14px !important; border-radius:18px; text-align:center; } #foodie .fd-service-cards > a > .ti { width:48px; height:48px; border-radius:14px; font-size:24px; } #foodie .fd-service-cards h3 { margin:0 !important; font-size:15px !important; line-height:1.2; letter-spacing:-.01em; overflow-wrap:anywhere; } #foodie .fd-service-cards p { position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; } #foodie .fd-service-cards span { display:inline-grid !important; place-items:center; width:28px; height:28px; margin:auto 0 0 !important; border-radius:50%; background:#edf4e2; font-size:0 !important; } #foodie .fd-service-cards span .ti { font-size:15px; } } /* Foodie 0.14.155 — Speisekarte on phones: the shop status shows once (on the photo), not a second time next to the title. Services row: arrow centred in its circle. */ @media (max-width: 768px) { #foodie .fd-orderhead__meta .fd-orderhead__status, #foodie .fd-orderhead .fd-orderhead__status { display:none !important; } } @media (max-width: 680px) { #foodie .fd-service-cards span { line-height:0 !important; padding:0 !important; } #foodie .fd-service-cards span .ti { display:block; margin:0 !important; font-size:15px !important; line-height:1 !important; } } @media (max-width: 680px) { #foodie .fd-service-cards span { display:inline-flex !important; align-items:center; justify-content:center; } }