/* --- tailwind.build.css --- */
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:JetBrains Mono,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.pointer-events-none{pointer-events:none}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.-bottom-12{bottom:-3rem}.-left-6{left:-1.5rem}.-right-6{right:-1.5rem}.-top-10{top:-2.5rem}.-top-6{top:-1.5rem}.bottom-12{bottom:3rem}.bottom-6{bottom:1.5rem}.bottom-8{bottom:2rem}.left-0{left:0}.left-1\/2{left:50%}.left-6{left:1.5rem}.right-0{right:0}.right-12{right:3rem}.right-6{right:1.5rem}.top-0{top:0}.z-50{z-index:50}.z-\[60\]{z-index:60}.z-\[70\]{z-index:70}.col-span-2{grid-column:span 2/span 2}.row-span-2{grid-row:span 2/span 2}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-7{margin-bottom:1.75rem}.mb-8{margin-bottom:2rem}.ml-2{margin-left:.5rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.table{display:table}.grid{display:grid}.hidden{display:none}.aspect-\[4\/5\]{aspect-ratio:4/5}.aspect-square{aspect-ratio:1/1}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-12{height:3rem}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.min-h-\[640px\]{min-height:640px}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-12{width:3rem}.w-2\/5{width:40%}.w-8{width:2rem}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-\[1400px\]{max-width:1400px}.max-w-md{max-width:28rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.scale-110{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-baseline{align-items:baseline}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-9{gap:2.25rem}.gap-x-12{-moz-column-gap:3rem;column-gap:3rem}.gap-y-10{row-gap:2.5rem}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem*var(--tw-space-y-reverse))}.space-y-7>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.75rem*var(--tw-space-y-reverse))}.self-center{align-self:center}.overflow-hidden{overflow:hidden}.scroll-smooth{scroll-behavior:smooth}.whitespace-nowrap{white-space:nowrap}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-t{border-top-width:1px}.border-cognac\/10{border-color:rgba(200,127,58,.1)}.border-cognac\/15{border-color:rgba(200,127,58,.15)}.border-cognac\/20{border-color:rgba(200,127,58,.2)}.border-cognac\/30{border-color:rgba(200,127,58,.3)}.bg-cognac{--tw-bg-opacity:1;background-color:rgb(200 127 58/var(--tw-bg-opacity,1))}.bg-ink{--tw-bg-opacity:1;background-color:rgb(10 8 7/var(--tw-bg-opacity,1))}.bg-ink\/60{background-color:rgba(10,8,7,.6)}.bg-ink2{--tw-bg-opacity:1;background-color:rgb(20 17 16/var(--tw-bg-opacity,1))}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.from-cream\/40{--tw-gradient-from:hsla(37,51%,92%,.4) var(--tw-gradient-from-position);--tw-gradient-to:hsla(37,51%,92%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-ink\/60{--tw-gradient-from:rgba(10,8,7,.6) var(--tw-gradient-from-position);--tw-gradient-to:rgba(10,8,7,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-ink\/70{--tw-gradient-from:rgba(10,8,7,.7) var(--tw-gradient-from-position);--tw-gradient-to:rgba(10,8,7,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-ink2{--tw-gradient-from:#141110 var(--tw-gradient-from-position);--tw-gradient-to:rgba(20,17,16,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-ink\/50{--tw-gradient-to:rgba(10,8,7,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(10,8,7,.5) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-ink2\/85{--tw-gradient-to:rgba(20,17,16,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(20,17,16,.85) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}.to-ink{--tw-gradient-to:#0a0807 var(--tw-gradient-to-position)}.to-ink\/40{--tw-gradient-to:rgba(10,8,7,.4) var(--tw-gradient-to-position)}.to-ink2{--tw-gradient-to:#141110 var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position)}.object-cover{-o-object-fit:cover;object-fit:cover}.p-5{padding:1.25rem}.p-8{padding:2rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-24{padding-top:6rem;padding-bottom:6rem}.py-28{padding-top:7rem;padding-bottom:7rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-8{padding-top:2rem}.pb-8,.py-8{padding-bottom:2rem}.pt-1{padding-top:.25rem}.pt-10{padding-top:2.5rem}.pt-16{padding-top:4rem}.pt-24{padding-top:6rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-display{font-family:Cormorant Garamond,Georgia,serif}.font-mono{font-family:JetBrains Mono,monospace}.font-sans{font-family:Inter,system-ui,sans-serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.text-\[140px\]{font-size:140px}.text-\[15px\]{font-size:15px}.text-\[17px\]{font-size:17px}.text-\[200px\]{font-size:200px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-light{font-weight:300}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-\[0\.95\]{line-height:.95}.leading-\[1\.05\]{line-height:1.05}.leading-\[1\.2\]{line-height:1.2}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-\[0\.18em\]{letter-spacing:.18em}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest-2{letter-spacing:.3em}.text-cognac{--tw-text-opacity:1;color:rgb(200 127 58/var(--tw-text-opacity,1))}.text-cognac\/10{color:rgba(200,127,58,.1)}.text-cognac\/40{color:rgba(200,127,58,.4)}.text-cognac\/80{color:rgba(200,127,58,.8)}.text-cognac\/\[0\.04\]{color:rgba(200,127,58,.04)}.text-cognac2{--tw-text-opacity:1;color:rgb(232 152 84/var(--tw-text-opacity,1))}.text-cream{--tw-text-opacity:1;color:rgb(245 237 224/var(--tw-text-opacity,1))}.text-cream\/30{color:hsla(37,51%,92%,.3)}.text-cream\/40{color:hsla(37,51%,92%,.4)}.text-cream\/50{color:hsla(37,51%,92%,.5)}.text-cream\/60{color:hsla(37,51%,92%,.6)}.text-cream\/65{color:hsla(37,51%,92%,.65)}.text-cream\/70{color:hsla(37,51%,92%,.7)}.text-cream\/75{color:hsla(37,51%,92%,.75)}.text-cream\/80{color:hsla(37,51%,92%,.8)}.text-cream\/85{color:hsla(37,51%,92%,.85)}.underline{text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.accent-cognac{accent-color:#c87f3a}.opacity-30{opacity:.3}.opacity-\[0\.07\]{opacity:.07}.mix-blend-overlay{mix-blend-mode:overlay}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-cognac\/20{--tw-ring-color:rgba(200,127,58,.2)}.ring-cognac\/30{--tw-ring-color:rgba(200,127,58,.3)}.ring-cognac\/40{--tw-ring-color:rgba(200,127,58,.4)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-500{transition-duration:.5s}.placeholder\:text-cream\/40::-moz-placeholder{color:hsla(37,51%,92%,.4)}.placeholder\:text-cream\/40::placeholder{color:hsla(37,51%,92%,.4)}.hover\:text-cognac:hover{--tw-text-opacity:1;color:rgb(200 127 58/var(--tw-text-opacity,1))}.hover\:text-cream:hover{--tw-text-opacity:1;color:rgb(245 237 224/var(--tw-text-opacity,1))}.focus\:border-cognac:focus{--tw-border-opacity:1;border-color:rgb(200 127 58/var(--tw-border-opacity,1))}.group:hover .group-hover\:translate-x-1{--tw-translate-x:0.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:text-cream{--tw-text-opacity:1;color:rgb(245 237 224/var(--tw-text-opacity,1))}.group:hover .group-hover\:ring-cognac{--tw-ring-opacity:1;--tw-ring-color:rgb(200 127 58/var(--tw-ring-opacity,1))}@media (min-width:640px){.sm\:left-auto{left:auto}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:flex{display:flex}.sm\:w-auto{width:auto}.sm\:max-w-md{max-width:28rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:gap-3{gap:.75rem}.sm\:gap-4{gap:1rem}.sm\:p-10{padding:2.5rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-5xl{font-size:3rem;line-height:1}.sm\:text-7xl{font-size:4.5rem;line-height:1}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:768px){.md\:col-span-2{grid-column:span 2/span 2}.md\:auto-rows-\[200px\]{grid-auto-rows:200px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width:1024px){.lg\:-right-12{right:-3rem}.lg\:col-span-5{grid-column:span 5/span 5}.lg\:col-span-6{grid-column:span 6/span 6}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:max-w-sm{max-width:24rem}.lg\:auto-rows-\[260px\]{grid-auto-rows:260px}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:items-end{align-items:flex-end}.lg\:gap-20{gap:5rem}.lg\:px-12{padding-left:3rem;padding-right:3rem}.lg\:py-32{padding-top:8rem;padding-bottom:8rem}.lg\:py-40{padding-top:10rem;padding-bottom:10rem}.lg\:text-5xl{font-size:3rem;line-height:1}.lg\:text-6xl{font-size:3.75rem;line-height:1}.lg\:text-8xl{font-size:6rem;line-height:1}.lg\:text-\[320px\]{font-size:320px}}
/* --- styles.css --- */
/* ============================================================ */
/* 100 Gramm Vino — Custom Styles */
/* ============================================================ */
/* Filmkorn-Textur (statt großer PNGs einfacher SVG-Noise) */
.grain {
background-image: url("data:image/svg+xml;utf8,");
background-size: 220px 220px;
}
/* Smooth Selection */
::selection {
background: #c87f3a;
color: #0a0807;
}
/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0a0807; }
::-webkit-scrollbar-thumb { background: #3a3431; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #c87f3a; }
/* ============================================================ */
/* FIXED NAV — Abstand für Unterseiten (unabhängig von Tailwind-Build) */
/* ============================================================ */
:root {
--nav-height: 5.75rem;
}
html {
scroll-padding-top: calc(var(--nav-height) + 0.25rem);
}
/* Home-Anker Events & Galerie: weniger Leerraum unter fixer Nav */
.home-modern #events,
.home-modern #galerie {
padding-top: 4.5rem;
}
@media (min-width: 1024px) {
.home-modern #events,
.home-modern #galerie {
padding-top: 6rem;
}
}
.home-brand #events,
.home-brand #galerie {
padding-top: 3.5rem;
}
@media (min-width: 1024px) {
.home-brand #events,
.home-brand #galerie {
padding-top: 4.75rem;
}
}
html.smooth-scroll-enabled {
scroll-behavior: smooth;
}
.page-sub {
padding-top: calc(var(--nav-height) + 2rem);
padding-bottom: 7rem;
}
@media (min-width: 1024px) {
.page-sub {
padding-top: calc(var(--nav-height) + 2.75rem);
padding-bottom: 10rem;
}
}
.page-sub--center {
min-height: calc(100vh - var(--nav-height));
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
/* CMS-Seiten (/seite/…) */
.page-sub .page-sub-title {
font-family: 'Eburts', cursive;
font-weight: 400;
font-style: normal;
text-transform: uppercase;
letter-spacing: 0.02em;
line-height: 1.05;
}
.page-sub .prose-vino :is(h2, h3, h4) {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
letter-spacing: 0;
color: #f5ede0;
}
.page-sub--banner {
padding-top: var(--nav-height);
}
.page-sub-banner {
width: 100%;
max-height: min(48vh, 520px);
aspect-ratio: 2.2 / 1;
overflow: hidden;
margin-bottom: 2.5rem;
background: #141110;
}
.page-sub-banner__img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
filter: brightness(0.92) saturate(0.95);
}
@media (min-width: 1024px) {
.page-sub--banner {
padding-top: var(--nav-height);
}
.page-sub-banner {
margin-bottom: 3rem;
max-height: min(52vh, 560px);
}
}
.prose-vino h2 { font-size: 1.75rem; margin: 2rem 0 0.75rem; }
.prose-vino h3 { font-size: 1.15rem; margin: 1.5rem 0 0.5rem; }
.prose-vino h4 { font-size: 1rem; margin: 1.25rem 0 0.5rem; }
.prose-vino p {
color: rgba(245, 237, 224, 0.72);
font-weight: 300;
line-height: 1.8;
margin-bottom: 1rem;
}
.prose-vino a {
color: #FA4303;
text-decoration: underline;
transition: color 0.2s ease;
}
.prose-vino a:hover {
color: #ff6a28;
}
body.home-modern .prose-vino a {
color: var(--modern-sign, #FA4303);
}
body.home-modern .prose-vino a:hover {
color: color-mix(in srgb, var(--modern-sign, #FA4303) 82%, white);
}
.prose-vino ul,
.prose-vino ol {
padding-left: 1.5rem;
color: rgba(245, 237, 224, 0.72);
margin-bottom: 1rem;
line-height: 1.8;
}
.prose-vino ul { list-style: disc; }
.prose-vino ol { list-style: decimal; }
.prose-vino strong {
color: #f5ede0;
font-weight: 500;
}
.prose-vino table {
width: 100%;
border-collapse: collapse;
margin-bottom: 1rem;
font-size: 0.9rem;
}
.prose-vino th,
.prose-vino td {
border: 1px solid rgba(250, 67, 3, 0.25);
padding: 0.5rem 0.75rem;
text-align: left;
}
.prose-vino th {
color: #f5ede0;
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
}
.footer-tagline {
font-family: 'Eburts', cursive;
font-weight: 400;
font-style: normal;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.home-section-quote .quote-mark,
.home-section-quote .quote-mark::before {
color: color-mix(in srgb, #c87f3a 40%, transparent);
}
.footer-love-hugs {
position: absolute;
right: clamp(0.5rem, 2vw, 2rem);
top: 42%;
transform: translateY(-50%);
pointer-events: none;
z-index: 0;
}
.footer-love-hugs__img {
display: block;
width: calc(clamp(140px, 18vw, 220px) * var(--footer-love-hugs-scale, 1));
max-width: none;
height: auto;
transform: rotate(var(--footer-love-hugs-rotate, -6deg));
transform-origin: bottom right;
mix-blend-mode: screen;
}
@media (max-width: 639px) {
.site-footer {
display: flex;
flex-direction: column;
}
.site-footer > :not(.footer-love-hugs) {
order: 1;
}
.footer-love-hugs {
order: 2;
position: static;
align-self: flex-end;
margin: 0.25rem 0.25rem 0;
transform: none;
opacity: 0.9;
}
.footer-love-hugs__img {
width: calc(clamp(90px, 28vw, 130px) * var(--footer-love-hugs-scale, 1));
}
}
a.glossary-badge {
text-decoration: none;
cursor: pointer;
}
a.glossary-badge:hover {
filter: brightness(1.08);
}
/* ============================================================ */
/* NAV */
/* ============================================================ */
#nav.scrolled {
background: rgba(10, 8, 7, 0.88);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border-bottom: 1px solid rgba(200, 127, 58, 0.12);
}
#menu-toggle {
position: relative;
z-index: 2;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.75rem;
min-height: 2.75rem;
margin: -0.35rem -0.35rem -0.35rem 0;
padding: 0.35rem;
flex-shrink: 0;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
#menu-toggle .fa-solid {
font-size: 1.25rem;
line-height: 1;
}
#mobile-menu {
position: relative;
z-index: 1;
}
.nav-link {
position: relative;
transition: color .3s ease;
}
.nav-link:hover { color: #f5ede0; }
.nav-link::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: -6px;
height: 1px;
background: #c87f3a;
transform: scaleX(0);
transform-origin: left;
transition: transform .35s cubic-bezier(.5, 0, .2, 1);
}
.nav-link:hover::after { transform: scaleX(1); }
/* ============================================================ */
/* BUTTONS */
/* ============================================================ */
.btn-primary {
display: inline-flex;
align-items: center;
background: #c87f3a;
color: #0a0807;
padding: 0.9rem 1.6rem;
font-size: 0.78rem;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
border: 1px solid #c87f3a;
transition: all .35s cubic-bezier(.5, 0, .2, 1);
cursor: pointer;
position: relative;
overflow: hidden;
}
.btn-primary:hover {
background: #e89854;
border-color: #e89854;
transform: translateY(-1px);
box-shadow: 0 12px 28px -10px rgba(232, 152, 84, 0.4);
}
.btn-primary:active { transform: translateY(0); }
.btn-ghost {
display: inline-flex;
align-items: center;
background: transparent;
color: #f5ede0;
padding: 0.9rem 1.6rem;
font-size: 0.78rem;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
border: 1px solid rgba(245, 237, 224, 0.25);
transition: all .35s ease;
cursor: pointer;
}
.btn-ghost:hover {
border-color: #c87f3a;
color: #c87f3a;
}
/* ============================================================ */
/* MENU / FILTER */
/* ============================================================ */
.filter-btn {
padding: 0.6rem 1.2rem;
font-size: 0.72rem;
font-weight: 500;
letter-spacing: 0.16em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.55);
border: 1px solid rgba(200, 127, 58, 0.2);
background: transparent;
cursor: pointer;
transition: all .3s ease;
}
.filter-btn:hover {
color: #f5ede0;
border-color: rgba(200, 127, 58, 0.5);
}
.filter-btn.active {
background: #c87f3a;
color: #0a0807;
border-color: #c87f3a;
}
/* Menu Items */
.menu-item {
padding-bottom: 1.5rem;
border-bottom: 1px dashed rgba(200, 127, 58, 0.15);
transition: opacity .4s ease, transform .4s ease;
}
.menu-item.hide {
display: none;
}
.badge {
display: inline-block;
padding: 0.2rem 0.6rem;
font-size: 0.65rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.6);
border: 1px solid rgba(245, 237, 224, 0.18);
border-radius: 999px;
}
.badge-cognac {
color: #c87f3a;
border-color: rgba(200, 127, 58, 0.45);
}
/* ============================================================ */
/* EVENT CARDS */
/* ============================================================ */
.event-card {
background: #141110;
border: 1px solid rgba(200, 127, 58, 0.12);
overflow: hidden;
transition: all .4s ease;
}
.event-card:hover {
border-color: rgba(200, 127, 58, 0.4);
transform: translateY(-4px);
}
.event-image {
position: relative;
aspect-ratio: 16 / 11;
overflow: hidden;
}
.event-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 1s ease;
}
.event-card:hover .event-image img {
transform: scale(1.06);
}
.event-date {
position: absolute;
top: 1rem;
left: 1rem;
background: rgba(10, 8, 7, 0.85);
backdrop-filter: blur(8px);
padding: 0.6rem 0.9rem;
text-align: center;
border: 1px solid rgba(200, 127, 58, 0.3);
}
.event-date .day {
display: block;
font-family: 'Cormorant Garamond', serif;
font-size: 1.6rem;
line-height: 1;
color: #f5ede0;
font-weight: 500;
}
.event-date .month {
display: block;
font-size: 0.65rem;
letter-spacing: 0.15em;
text-transform: uppercase;
color: #c87f3a;
margin-top: 2px;
}
.event-body {
padding: 1.5rem 1.6rem 1.8rem;
}
.event-meta {
font-family: 'JetBrains Mono', monospace;
font-size: 0.7rem;
color: #c87f3a;
letter-spacing: 0.08em;
margin-bottom: 0.6rem;
}
.event-link {
display: inline-flex;
align-items: center;
margin-top: 1.1rem;
font-size: 0.72rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #f5ede0;
border-bottom: 1px solid #c87f3a;
padding-bottom: 3px;
transition: all .3s ease;
}
.event-link:hover {
color: #c87f3a;
}
.event-description {
color: rgba(245, 237, 224, 0.6);
font-size: 0.875rem;
font-weight: 300;
line-height: 1.65;
}
.event-description p {
margin: 0 0 0.65rem;
}
.event-description p:last-child {
margin-bottom: 0;
}
.event-description ul,
.event-description ol {
margin: 0 0 0.65rem;
padding-left: 1.25rem;
}
.event-description ul { list-style: disc; }
.event-description ol { list-style: decimal; }
.event-description li + li {
margin-top: 0.2rem;
}
.event-description strong,
.event-description b {
color: rgba(245, 237, 224, 0.85);
font-weight: 600;
}
.event-description a {
color: #c87f3a;
text-decoration: underline;
text-underline-offset: 2px;
}
.event-description a:hover {
color: #f5ede0;
}
/* ============================================================ */
/* COMING SOON COUNTDOWN */
/* ============================================================ */
.coming-countdown-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.75rem;
max-width: 36rem;
margin: 0 auto;
}
@media (max-width: 480px) {
.coming-countdown-grid { gap: 0.5rem; }
}
.coming-countdown-unit {
background: rgba(20, 17, 16, 0.85);
border: 1px solid rgba(200, 127, 58, 0.25);
padding: 1rem 0.5rem;
text-align: center;
}
.coming-countdown-val {
display: block;
font-family: 'Cormorant Garamond', serif;
font-size: 2.25rem;
line-height: 1;
color: #f5ede0;
font-weight: 500;
}
@media (min-width: 640px) {
.coming-countdown-val { font-size: 2.75rem; }
}
.coming-countdown-label {
display: block;
margin-top: 0.5rem;
font-size: 0.65rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: rgba(200, 127, 58, 0.85);
}
/* ============================================================ */
/* JOBS LISTING */
/* ============================================================ */
.jobs-list {
display: flex;
flex-direction: column;
gap: 2.5rem;
}
@media (min-width: 640px) {
.jobs-list { gap: 3rem; }
}
.job-card {
display: grid;
grid-template-columns: 1fr;
background: #141110;
border: 1px solid rgba(200, 127, 58, 0.14);
transition: border-color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease;
}
@media (min-width: 640px) {
.job-card {
grid-template-columns: 5.5rem 1fr;
}
}
.job-card:hover {
border-color: rgba(200, 127, 58, 0.38);
transform: translateY(-3px);
box-shadow: 0 20px 48px rgba(0, 0, 0, 0.35);
}
.job-card-accent {
display: flex;
align-items: center;
justify-content: center;
padding: 1.75rem 1.5rem;
background: rgba(200, 127, 58, 0.06);
border-bottom: 1px solid rgba(200, 127, 58, 0.12);
}
@media (min-width: 640px) {
.job-card-accent {
flex-direction: column;
justify-content: flex-start;
padding-top: 2.25rem;
border-bottom: none;
border-right: 1px solid rgba(200, 127, 58, 0.12);
}
}
.job-card-icon {
display: flex;
align-items: center;
justify-content: center;
width: 3.25rem;
height: 3.25rem;
border-radius: 9999px;
border: 1px solid rgba(200, 127, 58, 0.35);
color: #c87f3a;
font-size: 1.15rem;
background: rgba(10, 8, 7, 0.6);
}
.job-card-body {
padding: 1.75rem 1.5rem 1.85rem;
}
@media (min-width: 640px) {
.job-card-body {
padding: 2rem 2.25rem 2.1rem;
}
}
.job-card-head {
margin-bottom: 1.25rem;
}
.job-card-title {
font-family: 'Cormorant Garamond', serif;
font-size: 1.75rem;
line-height: 1.2;
color: #f5ede0;
margin-bottom: 0.85rem;
}
@media (min-width: 640px) {
.job-card-title { font-size: 2rem; }
}
.job-card-tags {
display: flex;
flex-wrap: wrap;
gap: 0.5rem 0.65rem;
list-style: none;
padding: 0;
margin: 0;
}
.job-card-tag {
font-size: 0.68rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: rgba(200, 127, 58, 0.95);
padding: 0.35rem 0.65rem;
border: 1px solid rgba(200, 127, 58, 0.25);
background: rgba(200, 127, 58, 0.06);
}
.job-card-teaser {
color: rgba(245, 237, 224, 0.68);
font-weight: 300;
font-size: 0.95rem;
line-height: 1.75;
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
@media (min-width: 640px) {
.job-card-teaser {
font-size: 1rem;
-webkit-line-clamp: 3;
}
}
.job-card-footer {
margin-top: 1.75rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(200, 127, 58, 0.12);
}
.job-card-link {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-size: 0.72rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #f5ede0;
border-bottom: 1px solid #c87f3a;
padding-bottom: 3px;
transition: color 0.3s ease, border-color 0.3s ease;
}
.job-card-link:hover {
color: #c87f3a;
}
.job-card-link i {
font-size: 0.65rem;
transition: transform 0.3s ease;
}
.job-card:hover .job-card-link i {
transform: translateX(4px);
}
/* ============================================================ */
/* GALLERY */
/* ============================================================ */
.gallery-tile {
display: block;
position: relative;
overflow: hidden;
background: #141110;
aspect-ratio: 1 / 1;
border: none;
padding: 0;
cursor: zoom-in;
width: 100%;
font: inherit;
color: inherit;
text-align: inherit;
}
@media (min-width: 768px) {
.gallery-tile {
aspect-ratio: auto;
height: 100%;
}
}
.gallery-tile img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 1.2s cubic-bezier(.3, 0, .2, 1), filter .4s ease;
filter: brightness(0.85) saturate(0.9);
}
.gallery-tile:hover img {
transform: scale(1.08);
filter: brightness(1) saturate(1);
}
/* ============================================================ */
/* LIGHTBOX */
/* ============================================================ */
.lightbox {
position: fixed;
inset: 0;
z-index: 80;
display: flex;
align-items: center;
justify-content: center;
padding: 3rem 4rem;
}
.lightbox[hidden] {
display: none !important;
}
.lightbox-backdrop {
position: absolute;
inset: 0;
background: rgba(10, 8, 7, 0.92);
backdrop-filter: blur(8px);
}
.lightbox-stage {
position: relative;
z-index: 2;
margin: 0;
max-width: min(1200px, 92vw);
max-height: 85vh;
}
.lightbox-img {
display: block;
max-width: 100%;
max-height: 85vh;
width: auto;
height: auto;
margin: 0 auto;
object-fit: contain;
border-radius: 4px;
box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
animation: lightbox-in 0.35s cubic-bezier(.3, 0, .2, 1);
}
@keyframes lightbox-in {
from { opacity: 0; transform: scale(0.96); }
to { opacity: 1; transform: scale(1); }
}
.lightbox-close,
.lightbox-nav {
position: absolute;
z-index: 3;
border: none;
background: rgba(20, 17, 16, 0.75);
color: #f5ede0;
cursor: pointer;
transition: background 0.2s, color 0.2s;
}
.lightbox-close:hover,
.lightbox-nav:hover {
background: #c87f3a;
color: #0a0807;
}
.lightbox-close {
top: 1.25rem;
right: 1.25rem;
width: 2.75rem;
height: 2.75rem;
border-radius: 9999px;
font-size: 1.75rem;
line-height: 1;
}
.lightbox-nav {
top: 50%;
transform: translateY(-50%);
width: 3rem;
height: 3rem;
border-radius: 9999px;
font-size: 1.1rem;
}
.lightbox-prev { left: 1rem; }
.lightbox-next { right: 1rem; }
.lightbox-counter {
position: absolute;
bottom: 1.25rem;
left: 50%;
transform: translateX(-50%);
z-index: 3;
font-size: 0.75rem;
letter-spacing: 0.2em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.5);
}
@media (max-width: 640px) {
.lightbox { padding: 2.5rem 0.5rem; }
.lightbox-prev { left: 0.35rem; }
.lightbox-next { right: 0.35rem; }
}
/* ============================================================ */
/* KARTE — Hinweise-Popup */
/* ============================================================ */
.menu-info-wrap {
display: flex;
justify-content: center;
margin-top: 1.25rem;
}
.menu-info-trigger {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.55rem 1rem;
border-radius: 999px;
border: 1px solid rgba(250, 67, 3, 0.28);
background: rgba(250, 67, 3, 0.07);
color: rgba(245, 239, 230, 0.82);
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 0.82rem;
letter-spacing: 0.04em;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.menu-info-trigger:hover {
color: var(--cream, #f5efe6);
border-color: rgba(250, 67, 3, 0.5);
background: rgba(250, 67, 3, 0.12);
}
.menu-info-dialog {
margin: auto;
padding: 0;
border: none;
max-width: min(34rem, calc(100vw - 2rem));
width: 100%;
background: transparent;
color: var(--cream, #f5efe6);
}
.menu-info-dialog::backdrop {
background: rgba(10, 8, 7, 0.78);
backdrop-filter: blur(6px);
}
.menu-info-dialog__panel {
border-radius: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
background: linear-gradient(165deg, rgba(28, 22, 19, 0.98), rgba(12, 10, 9, 0.98));
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
overflow: hidden;
}
.menu-info-dialog__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 1.1rem 1.15rem 0.85rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.menu-info-dialog__title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: 1.35rem;
line-height: 1.2;
letter-spacing: 0.06em;
color: var(--cream, #f5efe6);
}
.menu-info-dialog__close {
flex-shrink: 0;
width: 2rem;
height: 2rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.12);
color: rgba(245, 239, 230, 0.7);
display: inline-flex;
align-items: center;
justify-content: center;
transition: color 0.2s ease, border-color 0.2s ease;
}
.menu-info-dialog__close:hover {
color: var(--cream, #f5efe6);
border-color: rgba(250, 67, 3, 0.45);
}
.menu-info-dialog__list {
list-style: none;
margin: 0;
padding: 0.65rem 0 0.85rem;
}
.menu-info-dialog__item {
display: flex;
gap: 0.85rem;
padding: 0.85rem 1.15rem;
}
.menu-info-dialog__item + .menu-info-dialog__item {
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.menu-info-dialog__item.is-highlight {
margin: 0.35rem 0.65rem 0.5rem;
padding: 0.9rem 0.85rem;
border: 1px solid rgba(250, 67, 3, 0.22);
border-radius: 0.75rem;
background: rgba(250, 67, 3, 0.07);
}
.menu-info-dialog__item.is-highlight + .menu-info-dialog__item {
border-top: none;
}
.menu-info-dialog__icon {
flex-shrink: 0;
width: 2rem;
height: 2rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.05);
color: var(--cognac, #fa4303);
font-size: 0.85rem;
}
.menu-info-dialog__item-title {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 1.25rem;
font-weight: 600;
letter-spacing: 0.18em;
text-transform: uppercase;
color: rgba(245, 239, 230, 0.92);
margin-bottom: 0.3rem;
}
.menu-info-dialog__item-text {
font-size: 0.92rem;
line-height: 1.55;
font-weight: 300;
color: rgba(245, 239, 230, 0.68);
}
.home-modern .menu-page-content .menu-info-wrap {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
/* ============================================================ */
/* KARTE — Flaschen-Dekoration (Hintergrund) */
/* ============================================================ */
.menu-with-deco {
position: relative;
isolation: isolate;
}
.menu-with-deco > * {
position: relative;
z-index: 1;
}
.menu-with-deco::before {
content: '';
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background-image: url('/assets/images/weinflasche.webp');
background-repeat: no-repeat;
background-position: right -4% center;
background-size: min(52vw, 580px);
opacity: 0.2;
-webkit-mask-image: linear-gradient(
to left,
rgba(0, 0, 0, 0.95) 0%,
rgba(0, 0, 0, 0.55) 42%,
transparent 72%
);
mask-image: linear-gradient(
to left,
rgba(0, 0, 0, 0.95) 0%,
rgba(0, 0, 0, 0.55) 42%,
transparent 72%
);
}
.menu-with-deco::after {
content: '';
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background:
radial-gradient(ellipse 70% 55% at 78% 50%, rgba(250, 67, 3, 0.05), transparent 62%),
linear-gradient(90deg, rgba(10, 8, 7, 0.94) 0%, rgba(10, 8, 7, 0.72) 48%, rgba(10, 8, 7, 0.35) 100%);
}
.home-modern.is-menu-page .menu-with-deco::before {
position: fixed;
background-attachment: fixed;
opacity: 0.24;
}
.home-modern.is-menu-page .menu-with-deco::after {
position: fixed;
background:
radial-gradient(ellipse 70% 55% at 78% 50%, rgba(250, 67, 3, 0.06), transparent 62%),
linear-gradient(90deg, rgba(10, 8, 7, 0.45) 0%, rgba(10, 8, 7, 0.15) 42%, transparent 68%);
}
@media (max-width: 767px) {
.menu-with-deco::before {
background-position: right -18% 58%;
background-size: min(78vw, 420px);
opacity: 0.14;
}
.home-modern.is-menu-page .menu-with-deco::before {
opacity: 0.16;
}
}
@media (prefers-reduced-motion: reduce) {
.home-modern.is-menu-page .menu-with-deco::before,
.home-modern.is-menu-page .menu-with-deco::after {
position: absolute;
}
}
/* ============================================================ */
/* PROTECTED FORMS (JS + Anti-Spam) */
/* ============================================================ */
.form-guard-honeypot {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
overflow: hidden;
opacity: 0;
pointer-events: none;
}
.protected-form:not(.is-ready) {
pointer-events: none;
opacity: 0.55;
filter: grayscale(0.2);
}
.protected-form:not(.is-ready) .form-guard-noscript {
opacity: 1;
}
.protected-form.is-ready .form-guard-noscript {
display: none;
}
noscript .protected-form {
pointer-events: none;
opacity: 0.5;
}
/* ============================================================ */
/* FORM */
/* ============================================================ */
.form-label {
display: block;
font-size: 0.7rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.6);
margin-bottom: 0.5rem;
}
.form-input {
width: 100%;
background: rgba(10, 8, 7, 0.6);
border: 1px solid rgba(200, 127, 58, 0.2);
color: #f5ede0;
padding: 0.85rem 1rem;
font-size: 0.9rem;
outline: none;
transition: border-color .25s ease;
font-family: inherit;
}
.form-input:focus {
border-color: #c87f3a;
}
.form-input::placeholder {
color: rgba(245, 237, 224, 0.35);
}
select.form-input {
appearance: none;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-position: right 1rem center;
padding-right: 2.5rem;
}
/* ============================================================ */
/* ANIMATIONS */
/* ============================================================ */
/* Hero Fade-in mit Stagger */
.hero-fade {
opacity: 0;
transform: translateY(24px);
animation: heroIn 1s cubic-bezier(.3, 0, .2, 1) forwards;
}
.hero-fade:nth-child(1) { animation-delay: .2s; }
.hero-fade:nth-child(2) { animation-delay: .35s; }
.hero-fade:nth-child(3) { animation-delay: .5s; }
.hero-fade:nth-child(4) { animation-delay: .65s; }
.hero-fade:nth-child(5) { animation-delay: .8s; }
.hero-fade:nth-child(6) { animation-delay: .95s; }
@keyframes heroIn {
to {
opacity: 1;
transform: translateY(0);
}
}
/* Slow Hero Zoom */
.hero-img {
animation: heroZoom 14s ease-out forwards;
}
@keyframes heroZoom {
from { transform: scale(1.15); }
to { transform: scale(1.0); }
}
/* Scroll Line Animation */
.scroll-line {
animation: scrollPulse 2.2s ease-in-out infinite;
}
@keyframes scrollPulse {
0%, 100% { transform: scaleY(1); opacity: 0.5; }
50% { transform: scaleY(0.4); opacity: 1; }
}
/* Reveal-on-Scroll */
.reveal {
opacity: 0;
transform: translateY(28px);
transition: opacity .9s cubic-bezier(.3, 0, .2, 1), transform .9s cubic-bezier(.3, 0, .2, 1);
}
.reveal.in {
opacity: 1;
transform: translateY(0);
}
/* ============================================================ */
/* RESPONSIVE Feinheiten */
/* ============================================================ */
@media (max-width: 640px) {
.filter-btn {
padding: 0.5rem 0.85rem;
font-size: 0.68rem;
}
}
/* ============================================================ */
/* SITE LOGO (rund / eckig — Einstellung im Admin) */
/* ============================================================ */
.site-logo {
object-fit: cover;
}
.site-logo[src$=".svg"] {
object-fit: contain;
}
.site-logo--round {
border-radius: 9999px;
}
.site-logo--square {
border-radius: 0.125rem;
}
.site-logo-wrap {
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
overflow: hidden;
background: #000;
}
.site-logo-wrap--round {
border-radius: 9999px;
}
.site-logo-wrap--square {
border-radius: 0.125rem;
}
/* ============================================================ */
/* GATE LAYOUT (Coming Soon, Jobs, rechtliche Seiten) */
/* Unabhängig vom Tailwind-Build — fehlende Utilities hier */
/* ============================================================ */
body.layout-gate {
min-height: 100vh;
display: flex;
flex-direction: column;
}
body.layout-gate main {
flex: 1 1 auto;
}
.gate-header-inner {
max-width: 1400px;
margin-left: auto;
margin-right: auto;
padding: 1.25rem 1.5rem;
display: flex;
align-items: center;
justify-content: space-between;
}
@media (min-width: 1024px) {
.gate-header-inner { padding-left: 3rem; padding-right: 3rem; }
}
.gate-brand span {
display: none;
font-size: 0.875rem;
letter-spacing: 0.14em;
color: rgba(245, 237, 224, 0.8);
}
@media (min-width: 640px) {
.gate-brand span { display: block; }
}
.gate-brand .site-logo {
width: 2.75rem;
height: 2.75rem;
}
.gate-nav {
display: flex;
align-items: center;
gap: 1.5rem;
font-size: 0.8125rem;
letter-spacing: 0.18em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.7);
}
@media (min-width: 1024px) {
.gate-nav { gap: 2.25rem; }
}
.gate-lang {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.75rem;
letter-spacing: 0.3em;
text-transform: uppercase;
}
.gate-lang a.is-active { color: #c87f3a; }
.gate-lang a:not(.is-active) { color: rgba(245, 237, 224, 0.6); }
.gate-lang a:not(.is-active):hover { color: #f5ede0; }
.gate-lang .sep { color: rgba(245, 237, 224, 0.3); }
.gate-footer {
margin-top: auto;
background: #141110;
border-top: 1px solid rgba(200, 127, 58, 0.1);
}
.gate-footer-inner {
max-width: 1400px;
margin: 0 auto;
padding: 2rem 1.5rem 1.75rem;
}
@media (min-width: 1024px) {
.gate-footer-inner { padding-left: 3rem; padding-right: 3rem; }
}
.gate-footer-top {
display: flex;
flex-direction: column;
gap: 1.5rem;
margin-bottom: 0.25rem;
}
@media (min-width: 640px) {
.gate-footer-top {
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
gap: 2rem;
}
}
.gate-footer-nav {
flex-shrink: 0;
}
.gate-footer-nav-col {
min-width: 0;
}
.gate-footer-brand {
display: flex;
align-items: center;
gap: 0.75rem;
}
.gate-footer-brand .site-logo {
width: 2.5rem;
height: 2.5rem;
}
.gate-footer-brand .title {
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: 1.125rem;
color: #f5ede0;
line-height: 1.2;
}
.gate-footer-brand .sub {
font-size: 10px;
color: rgba(245, 237, 224, 0.45);
letter-spacing: 0.3em;
text-transform: uppercase;
}
.gate-footer-links {
list-style: none;
margin: 0;
padding: 0;
}
.gate-footer-copy {
font-size: 0.75rem;
color: rgba(245, 237, 224, 0.35);
margin: 0;
padding-top: 1.25rem;
border-top: 1px solid rgba(200, 127, 58, 0.1);
}
/* Footer — gemeinsam (Haupt- & Gate-Layout) */
.footer-col-title,
.footer-discover-title,
.gate-footer-nav-title {
font-size: 10px;
letter-spacing: 0.28em;
text-transform: uppercase;
color: #c87f3a;
margin: 0 0 0.65rem;
}
.footer-link-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.footer-link,
.footer-discover-link {
font-size: 0.8125rem;
font-weight: 300;
line-height: 1.35;
color: rgba(245, 237, 224, 0.62);
text-decoration: none;
transition: color 0.2s ease;
}
.footer-link:hover,
.footer-discover-link:hover,
.gate-footer-links a:hover {
color: #c87f3a;
}
.footer-discover {
margin-top: 1.25rem;
padding-top: 1.25rem;
border-top: 1px solid rgba(200, 127, 58, 0.1);
}
.site-footer .footer-discover {
margin-bottom: 1.25rem;
}
.footer-discover-links {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.3rem 1.25rem;
}
@media (min-width: 640px) {
.footer-discover-links {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.35rem 1.5rem;
}
}
@media (min-width: 1024px) {
.footer-discover-links {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
@media (min-width: 1280px) {
.footer-discover-links {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
}
.footer-discover-link {
display: block;
padding: 0.1rem 0;
}
.site-footer-bar {
margin-top: 0;
}
/* Coming Soon Seite */
.coming-soon-section {
min-height: 85vh;
display: flex;
align-items: center;
}
.coming-soon-inner {
position: relative;
width: 100%;
max-width: 56rem;
margin: 0 auto;
padding: 2rem 1.5rem;
}
@media (min-width: 1024px) {
.coming-soon-inner { padding-left: 3rem; padding-right: 3rem; }
}
.coming-soon-bg {
position: absolute;
inset: 0;
z-index: 0;
opacity: 0.25;
pointer-events: none;
overflow: hidden;
border-radius: 2px;
}
.coming-soon-bg img {
width: 100%;
height: 100%;
object-fit: cover;
}
.coming-soon-bg-overlay {
position: absolute;
inset: 0;
background: linear-gradient(to bottom, #0a0807, rgba(10, 8, 7, 0.9), #0a0807);
}
.coming-soon-content {
position: relative;
z-index: 1;
}
.coming-soon-eyebrow {
color: #c87f3a;
font-size: 0.75rem;
letter-spacing: 0.3em;
text-transform: uppercase;
margin-bottom: 1.5rem;
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
}
.coming-soon-eyebrow .line {
display: inline-block;
width: 2.5rem;
height: 1px;
background: #c87f3a;
}
.coming-soon-title {
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: clamp(2.25rem, 6vw, 3.75rem);
color: #f5ede0;
text-align: center;
line-height: 1.1;
margin-bottom: 1.5rem;
}
.coming-soon-title .accent {
font-style: italic;
color: #e89854;
}
.coming-soon-headline {
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: clamp(1.5rem, 4vw, 1.875rem);
color: rgba(245, 237, 224, 0.9);
text-align: center;
margin-bottom: 1rem;
}
.coming-soon-lead {
color: rgba(245, 237, 224, 0.7);
font-weight: 300;
font-size: 1.125rem;
text-align: center;
max-width: 42rem;
margin: 0 auto 3rem;
line-height: 1.65;
}
.coming-soon-panel {
max-width: 32rem;
margin: 0 auto;
background: rgba(20, 17, 16, 0.92);
border: 1px solid rgba(200, 127, 58, 0.2);
padding: 2rem;
}
@media (min-width: 640px) {
.coming-soon-panel { padding: 2.5rem; }
}
.coming-soon-panel h2 {
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: 1.5rem;
color: #f5ede0;
text-align: center;
margin-bottom: 0.75rem;
}
.coming-soon-perks {
list-style: none;
margin: 0 0 2rem;
padding: 0;
text-align: center;
font-size: 0.875rem;
font-weight: 300;
color: rgba(245, 237, 224, 0.7);
}
.coming-soon-perks li + li { margin-top: 0.5rem; }
.coming-soon-perks i {
color: #c87f3a;
margin-right: 0.5rem;
}
.coming-soon-panel .protected-form input[type="email"] {
width: 100%;
background: rgba(10, 8, 7, 0.6);
border: 1px solid rgba(200, 127, 58, 0.3);
color: #f5ede0;
padding: 0.875rem 1.25rem;
font-size: 0.875rem;
outline: none;
transition: border-color 0.2s ease;
}
.coming-soon-panel .protected-form input[type="email"]:focus {
border-color: #c87f3a;
}
.coming-soon-panel .protected-form input[type="email"]::placeholder {
color: rgba(245, 237, 224, 0.4);
}
.coming-soon-panel .protected-form.flex-col {
display: flex;
flex-direction: column;
gap: 1rem;
}
.coming-soon-panel .protected-form .btn-primary {
width: 100%;
justify-content: center;
}
.coming-soon-consent {
display: flex;
align-items: flex-start;
gap: 0.5rem;
font-size: 0.75rem;
color: rgba(245, 237, 224, 0.5);
margin-top: 1rem;
max-width: 32rem;
margin-left: auto;
margin-right: auto;
cursor: pointer;
}
.coming-soon-consent input { margin-top: 0.125rem; accent-color: #c87f3a; }
.coming-soon-consent a { text-decoration: underline; }
.coming-soon-consent a:hover { color: #c87f3a; }
.coming-countdown.mb-14 {
margin-bottom: 3.5rem;
}
/* Reduce motion respect */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
}
.hero-fade { opacity: 1; transform: none; }
.reveal { opacity: 1; transform: none; }
}
/* ============================================================ */
/* Startseiten-Templates */
/* ============================================================ */
[data-home-template="minimal"] .home-deco-carta,
[data-home-template="minimal"] .home-deco-100,
[data-home-template="editorial"] .home-deco-carta,
[data-home-template="editorial"] .home-deco-100,
[data-home-template="showcase"] .home-deco-carta,
[data-home-template="showcase"] .home-deco-100 {
display: none;
}
[data-home-template="minimal"] #karte {
background: transparent;
}
.gallery-tile--grid {
min-height: 0;
}
.gallery-tile--featured:first-child {
min-height: 12rem;
}
@media (min-width: 768px) {
.gallery-tile--featured:first-child {
min-height: 100%;
}
}
.home-hero--editorial {
background: #0a0807;
}
/* Hero Mobile: Text näher unter fixer Nav (nicht viewport-zentriert) */
@media (max-width: 1023px) {
.home-hero:not(.home-hero--showcase):not(.home-hero--minimal) > .relative.h-full.flex.flex-col {
justify-content: flex-start;
padding-top: calc(var(--nav-height) + 0.35rem);
padding-bottom: 4.5rem;
}
.home-hero--editorial {
padding-top: calc(var(--nav-height) + 0.35rem);
}
.home-hero--editorial .grid.min-h-\[70vh\] {
min-height: 0;
align-items: flex-start;
}
.home-brand .brand-hero > .relative.h-full.flex.flex-col {
justify-content: flex-start;
padding-top: calc(var(--brand-nav-height, var(--nav-height)) + 0.35rem);
padding-bottom: 4.5rem;
}
}
.home-hero--minimal .btn-primary,
.home-hero--minimal .btn-ghost {
min-width: 10rem;
justify-content: center;
}
/* SevenRooms Reservierungs-CTA */
.reservation-sevenrooms-panel {
text-align: center;
padding: 0.5rem 0 0.25rem;
}
.reservation-sevenrooms-panel .sevenrooms-trigger,
.reservation-sevenrooms-panel .sevenrooms-trigger--page {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: min(100%, 16rem);
padding: 1rem 2.25rem;
font-size: 0.95rem;
letter-spacing: 0.14em;
}
button.sevenrooms-trigger,
button.sevenrooms-trigger--page {
cursor: pointer;
border: none;
font: inherit;
}
button.btn-ghost.sevenrooms-trigger {
background: transparent;
}
/* SevenRooms Overlay: Schließen-Button (von embed.js injiziert, nicht im iframe) */
#xb-close-modal {
/* Original: top: -44px — sitzt im dunklen Rand oberhalb des iframes (margin-top: 40px) */
top: -44px !important;
right: 0 !important;
left: auto !important;
text-align: right !important;
line-height: 44px !important;
z-index: 2;
}
#xb-close-modal:focus:not(:focus-visible) {
outline: none;
box-shadow: none;
}
#xb-close-modal:focus-visible {
outline: 2px solid rgba(250, 67, 3, 0.6);
outline-offset: 2px;
}
/* --- gallery-embed.css --- */
/**
* Eingebettete Galerien (Shortcode [gallery key="…"])
*/
@property --gallery-cols {
syntax: '';
inherits: true;
initial-value: 2;
}
@property --gallery-cols-md {
syntax: '';
inherits: true;
initial-value: 3;
}
@property --gallery-cols-lg {
syntax: '';
inherits: true;
initial-value: 4;
}
.gallery-embed {
width: 100%;
max-width: 100%;
}
.gallery-embed__grid {
display: grid;
grid-template-columns: repeat(var(--gallery-cols, 2), minmax(0, 1fr));
gap: var(--gallery-gap, 12px);
width: 100%;
}
@media (min-width: 640px) {
.gallery-embed__grid {
grid-template-columns: repeat(var(--gallery-cols-md, 3), minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
.gallery-embed__grid {
grid-template-columns: repeat(var(--gallery-cols-lg, 4), minmax(0, 1fr));
}
}
.gallery-embed__tile {
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
border: none;
background: #141110;
display: flex;
flex-direction: column;
font: inherit;
color: inherit;
text-align: left;
width: 100%;
}
.gallery-embed__tile--zoom {
cursor: zoom-in;
}
.gallery-embed__tile img {
display: block;
width: 100%;
object-fit: cover;
transition: transform 0.8s cubic-bezier(0.3, 0, 0.2, 1), filter 0.35s ease;
filter: brightness(0.9) saturate(0.92);
}
.gallery-embed--aspect-original .gallery-embed__tile img {
width: 100%;
height: auto;
aspect-ratio: auto;
object-fit: unset;
max-height: none;
}
.gallery-embed:not(.gallery-embed--aspect-original) .gallery-embed__tile img {
aspect-ratio: var(--gallery-aspect, 1 / 1);
height: 100%;
max-height: none;
}
.gallery-embed__tile--zoom:hover img {
transform: scale(1.06);
filter: brightness(1) saturate(1);
}
.gallery-embed__caption {
padding: 0.5rem 0.65rem;
font-size: 0.75rem;
line-height: 1.35;
letter-spacing: 0.04em;
color: rgba(245, 237, 224, 0.75);
background: rgba(10, 8, 7, 0.55);
}
.prose-vino .gallery-embed,
.landing-prose .gallery-embed {
margin-top: 2rem;
margin-bottom: 2rem;
width: 100%;
max-width: none;
}
.prose-vino .gallery-embed__grid,
.landing-prose .gallery-embed__grid {
width: 100%;
}
.lightbox-caption {
position: relative;
z-index: 3;
margin: 0.75rem auto 0;
max-width: min(var(--lightbox-max, 1200px), 92vw);
text-align: center;
font-size: 0.875rem;
letter-spacing: 0.06em;
color: rgba(245, 237, 224, 0.85);
}
.lightbox-caption[hidden] {
display: none !important;
}
.lightbox-stage {
max-width: min(var(--lightbox-max, 1200px), 92vw);
}
/* --- home-modern.css --- */
/**
* Modern — Classic-Layout mit Marken-Typo & Orange #FA4303
* Manuka (Überschriften) · Montserrat (Fließtext) · Eburts (Eyecatcher)
*/
[data-home-template="modern"] {
--modern-sign: #FA4303;
--modern-sign-light: color-mix(in srgb, var(--modern-sign) 72%, white);
--modern-sign-rgb: 250, 67, 3;
}
.home-modern {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 400;
}
/* ── Typografie ── */
/* Fließtext & UI */
.home-modern .font-light,
.home-modern .font-serif,
.home-modern .form-input,
.home-modern .form-label,
.home-modern .btn-primary,
.home-modern .btn-ghost,
.home-modern .filter-btn,
.home-modern .badge {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
}
.home-modern .font-light {
font-weight: 400;
}
/* Display-Klasse außerhalb von Überschriften */
.home-modern .font-display {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
letter-spacing: 0;
}
/* Überschriften: Manuka Bold */
.home-modern :is(h1, h2, h3, h4, h5, h6),
.home-modern :is(h1, h2, h3, h4, h5, h6) .font-display {
font-family: 'Manuka', system-ui, sans-serif;
font-weight: 700;
letter-spacing: -0.01em;
}
/* Markenname im Footer */
.home-modern footer p.font-display.text-xl {
font-family: 'Manuka', system-ui, sans-serif;
font-weight: 700;
letter-spacing: -0.01em;
}
/* Dekor (keine Überschriften) */
.home-modern .home-deco-100,
.home-modern .home-deco-carta {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
}
.home-modern .modern-hand,
.home-modern .modern-scroll-hint > span:first-child,
.home-modern footer .footer-tagline {
font-family: 'Eburts', cursive;
font-weight: 400;
font-style: normal;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--modern-sign);
}
.home-modern .footer-col-title,
.home-modern .footer-discover-title,
.home-modern .gate-footer-nav-title {
color: var(--modern-sign) !important;
}
.home-modern .modern-hero-moment {
font-family: 'Eburts', cursive !important;
font-weight: 400 !important;
font-style: normal !important;
letter-spacing: 0.02em;
text-transform: uppercase;
line-height: 0.95;
}
.home-modern .modern-hand {
display: inline-block;
transform: rotate(-3deg);
line-height: 1.05;
}
.home-modern .modern-hero-moment.modern-hand {
transform: rotate(-3deg);
}
.home-modern .modern-scroll-hint > span:first-child {
display: inline-block;
transform: rotate(-2deg);
letter-spacing: 0.12em;
}
.home-modern .home-section-newsletter h2 .italic,
.home-modern .home-section-contact .contact-reservation-title .italic {
font-family: 'Eburts', cursive !important;
font-weight: 400 !important;
font-style: normal !important;
text-transform: uppercase;
letter-spacing: 0.02em;
color: var(--modern-sign) !important;
display: inline-block;
transform: rotate(-2deg);
}
.home-modern .contact-page-title .italic,
.home-modern .reservation-page-title .italic {
font-family: 'Eburts', cursive !important;
font-weight: 400 !important;
font-style: normal !important;
text-transform: uppercase;
letter-spacing: 0.02em;
color: var(--modern-sign) !important;
display: inline-block;
transform: rotate(-2deg);
}
/* ── Akzentfarbe #FA4303 (statt Cognac) ── */
.home-modern .text-cognac { color: var(--modern-sign) !important; }
.home-modern .text-cognac2 { color: var(--modern-sign) !important; }
.home-modern .bg-cognac { background-color: var(--modern-sign) !important; }
.home-modern .text-cognac\/10 { color: color-mix(in srgb, var(--modern-sign, #FA4303) 10%, transparent) !important; }
.home-modern .text-cognac\/40 { color: color-mix(in srgb, var(--modern-sign, #FA4303) 40%, transparent) !important; }
.home-modern .text-cognac\/80 { color: color-mix(in srgb, var(--modern-sign, #FA4303) 80%, transparent) !important; }
.home-modern .home-section-quote .quote-mark,
.home-modern .home-section-quote .quote-mark::before {
color: var(--modern-sign, #FA4303) !important;
opacity: 1;
}
.home-modern .bg-cognac\/10 { background-color: rgba(var(--modern-sign-rgb), 0.1) !important; }
.home-modern .bg-cognac\/25 { background-color: rgba(var(--modern-sign-rgb), 0.25) !important; }
.home-modern .border-cognac\/10 { border-color: rgba(var(--modern-sign-rgb), 0.1) !important; }
.home-modern .border-cognac\/15 { border-color: rgba(var(--modern-sign-rgb), 0.15) !important; }
.home-modern .border-cognac\/20 { border-color: rgba(var(--modern-sign-rgb), 0.2) !important; }
.home-modern .border-cognac\/30 { border-color: rgba(var(--modern-sign-rgb), 0.3) !important; }
.home-modern .border-cognac\/40 { border-color: rgba(var(--modern-sign-rgb), 0.4) !important; }
.home-modern .ring-cognac\/20 { --tw-ring-color: rgba(var(--modern-sign-rgb), 0.2) !important; }
.home-modern .ring-cognac\/25 { --tw-ring-color: rgba(var(--modern-sign-rgb), 0.25) !important; }
.home-modern .ring-cognac\/30 { --tw-ring-color: rgba(var(--modern-sign-rgb), 0.3) !important; }
.home-modern .bg-cognac,
.home-modern span.bg-cognac,
.home-modern .inline-block.bg-cognac {
background-color: var(--modern-sign) !important;
}
.home-modern .hover\:text-cognac:hover { color: var(--modern-sign) !important; }
.home-modern .group-hover\:ring-cognac:hover { --tw-ring-color: var(--modern-sign) !important; }
.home-modern ::selection {
background: var(--modern-sign);
color: #0a0807;
}
.home-modern ::-webkit-scrollbar-thumb:hover {
background: var(--modern-sign);
}
/* ── Nav ── */
.home-modern #nav.scrolled {
border-bottom-color: rgba(var(--modern-sign-rgb), 0.12);
}
.home-modern .nav-link::after {
background: var(--modern-sign);
}
/* ── Buttons & Filter ── */
.home-modern .btn-primary {
background: var(--modern-sign);
border-color: var(--modern-sign);
color: #0a0807;
font-weight: 600;
}
.home-modern .btn-primary:hover {
background: #fff;
border-color: #fff;
box-shadow: 0 12px 28px -10px rgba(var(--modern-sign-rgb), 0.45);
}
.home-modern .btn-ghost:hover {
border-color: var(--modern-sign);
color: var(--modern-sign);
}
.home-modern .filter-btn {
border-color: rgba(var(--modern-sign-rgb), 0.2);
}
.home-modern .filter-btn:hover {
border-color: rgba(var(--modern-sign-rgb), 0.5);
}
.home-modern .filter-btn.active {
background: var(--modern-sign);
border-color: var(--modern-sign);
color: #0a0807;
}
.home-modern .badge-cognac {
color: var(--modern-sign);
border-color: rgba(var(--modern-sign-rgb), 0.45);
}
/* ── Menu / Events ── */
.home-modern .menu-item {
border-bottom-color: rgba(var(--modern-sign-rgb), 0.15);
}
.home-modern .event-card {
border-color: rgba(var(--modern-sign-rgb), 0.12);
}
.home-modern .event-card:hover {
border-color: rgba(var(--modern-sign-rgb), 0.4);
}
.home-modern .event-date {
border-color: rgba(var(--modern-sign-rgb), 0.3);
}
.home-modern .event-date .month,
.home-modern .event-meta {
color: var(--modern-sign);
}
.home-modern .event-date .day {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
}
.home-modern .event-link {
border-bottom-color: var(--modern-sign);
}
.home-modern .event-link:hover {
color: var(--modern-sign);
}
/* ── Formulare ── */
.home-modern .accent-cognac {
accent-color: var(--modern-sign);
}
.home-modern .form-input {
border-color: rgba(var(--modern-sign-rgb), 0.2);
}
.home-modern .form-input:focus {
border-color: var(--modern-sign);
}
.home-modern select.form-input {
background-image: url("data:image/svg+xml;utf8,");
}
.home-modern .text-cognac\/\[0\.04\] {
color: rgba(var(--modern-sign-rgb), 0.04) !important;
}
/* ── Bild-Effekte (Admin: Design → Modern) ── */
.home-modern.modern-img-saturated :is(
.home-hero img,
.home-section-bar img,
.gallery-tile img,
.home-section-newsletter img,
.event-image img
) {
filter: saturate(1.35) contrast(1.06) brightness(0.96);
}
.home-modern.modern-img-saturated .gallery-tile img {
filter: saturate(1.3) contrast(1.06) brightness(0.92) !important;
}
.home-modern.modern-img-saturated .gallery-tile:hover img {
filter: saturate(1.45) contrast(1.08) brightness(1) !important;
}
.home-modern.modern-img-raster :is(
.home-hero > .absolute,
.home-section-bar .overflow-hidden,
.gallery-tile,
.home-section-newsletter > .absolute,
.event-image
) {
isolation: isolate;
}
.home-modern.modern-img-raster :is(
.home-hero > .absolute,
.home-section-bar .overflow-hidden,
.gallery-tile,
.home-section-newsletter > .absolute,
.event-image
)::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0.11;
mix-blend-mode: multiply;
background-image: radial-gradient(rgba(0, 0, 0, 0.88) 0.5px, transparent 0.6px);
background-size: 3px 3px;
z-index: 2;
}
.home-modern.modern-img-raster .event-date {
z-index: 4;
}
/* CMS-Unterseiten (/seite/…) — nicht von Theme-Überschriften-Defaults überschreiben */
.home-modern .page-sub .page-sub-title {
font-family: 'Eburts', cursive;
font-weight: 400;
font-style: normal;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.home-modern .page-sub .prose-vino :is(h2, h3, h4) {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 600;
letter-spacing: 0;
}
/* ── Claim-Laufband (unter Hero) ── */
.home-modern .modern-marquee {
overflow: hidden;
user-select: none;
border-top: 1px solid rgba(var(--modern-sign-rgb), 0.15);
border-bottom: 1px solid rgba(var(--modern-sign-rgb), 0.15);
padding: 1rem 0;
background: #000;
}
.home-modern .modern-marquee__inner {
display: flex;
width: max-content;
animation: modern-scroll 26s linear infinite;
}
.home-modern .modern-marquee:hover .modern-marquee__inner {
animation-play-state: paused;
}
.home-modern .modern-marquee__track {
display: flex;
flex-shrink: 0;
}
@keyframes modern-scroll {
to { transform: translateX(-50%); }
}
.home-modern .modern-ticker-item {
font-family: 'Manuka', 'Cormorant Garamond', serif;
text-transform: uppercase;
letter-spacing: 0.02em;
font-size: clamp(1.4rem, 3.2vw, 2.4rem);
padding: 0 1.2rem;
white-space: nowrap;
color: #fff;
}
.home-modern .modern-marquee--eburts .modern-ticker-item {
font-family: 'Eburts', cursive;
text-transform: uppercase;
letter-spacing: 0.02em;
font-size: clamp(1.55rem, 3.5vw, 2.65rem);
font-weight: 400;
}
.home-modern .modern-ticker-dot {
color: var(--modern-sign);
padding: 0 0.2rem;
}
@media (prefers-reduced-motion: reduce) {
.home-modern .modern-marquee__inner {
animation: none;
}
}
/* ── Promo-Banner (unter Laufband) ── */
.home-modern .modern-promo-banner {
position: relative;
width: 100%;
background: #000;
border-bottom: 1px solid rgba(var(--modern-sign-rgb), 0.18);
}
.home-modern .modern-promo-banner__frame {
display: block;
position: relative;
width: 100%;
line-height: 0;
background:
radial-gradient(ellipse 80% 60% at 70% 40%, rgba(var(--modern-sign-rgb), 0.12), transparent 55%),
#0a0908;
}
.home-modern .modern-promo-banner__frame--link {
cursor: pointer;
}
.home-modern .modern-promo-banner__frame--link:focus-visible {
outline: 2px solid var(--modern-sign);
outline-offset: -2px;
}
.home-modern .modern-promo-banner__frame--raster {
isolation: isolate;
}
.home-modern .modern-promo-banner__frame--raster::before {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0.11;
mix-blend-mode: multiply;
background-image: radial-gradient(rgba(0, 0, 0, 0.88) 0.5px, transparent 0.6px);
background-size: 3px 3px;
z-index: 2;
}
.home-modern .modern-promo-banner__frame picture {
display: block;
width: 100%;
}
.home-modern .modern-promo-banner__frame img,
.home-modern .modern-promo-banner__img {
display: block;
width: 100%;
height: auto;
vertical-align: top;
}
.home-modern .modern-promo-banner__frame img {
transition: filter 0.55s ease;
}
.home-modern .modern-promo-banner__frame--link:hover img,
.home-modern .modern-promo-banner__frame--link:focus-visible img {
filter: saturate(1.05) brightness(1.03);
}
.home-modern .modern-promo-banner__frame::after {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
background: linear-gradient(
180deg,
rgba(0, 0, 0, 0.05) 0%,
transparent 22%,
transparent 78%,
rgba(0, 0, 0, 0.1) 100%
);
}
@media (prefers-reduced-motion: reduce) {
.home-modern .modern-promo-banner__frame img {
transition: none;
}
.home-modern .modern-promo-banner__frame--link:hover img,
.home-modern .modern-promo-banner__frame--link:focus-visible img {
filter: none;
}
}
/* ── Splash-Dekoration ── */
.home-modern .modern-splash {
position: absolute;
pointer-events: none;
z-index: 0;
overflow: hidden;
}
.home-modern .modern-splash--top {
top: -2rem;
right: -4%;
width: min(58vw, 560px);
height: clamp(220px, 32vw, 420px);
}
.home-modern .modern-splash--contact {
bottom: -2.5rem;
left: -8%;
width: min(64vw, 640px);
height: clamp(260px, 38vw, 480px);
}
.home-modern .modern-splash__img {
display: block;
width: 155%;
max-width: none;
height: auto;
opacity: var(--modern-splash-opacity, 0.3);
mix-blend-mode: screen;
filter: contrast(1.05);
}
.home-modern .modern-splash--top .modern-splash__img {
transform: rotate(14deg) translate(8%, -6%);
transform-origin: top right;
}
.home-modern .modern-splash--contact .modern-splash__img {
width: 185%;
transform: rotate(-22deg) translate(-6%, 6%);
transform-origin: bottom left;
}
/* Kontakt — Reservierungs-Kasten */
.home-modern .contact-reservation-panel {
background: linear-gradient(
148deg,
color-mix(in srgb, var(--ink2, #141210) 88%, var(--modern-sign)) 0%,
var(--ink2, #141210) 52%
);
border-color: rgba(var(--modern-sign-rgb), 0.22);
box-shadow:
0 1px 0 rgba(255, 255, 255, 0.04) inset,
0 28px 56px rgba(0, 0, 0, 0.32);
}
.home-modern .contact-reservation-panel__glow {
position: absolute;
top: -45%;
right: -18%;
width: 58%;
height: 85%;
background: radial-gradient(
ellipse at center,
rgba(var(--modern-sign-rgb), 0.14) 0%,
transparent 68%
);
pointer-events: none;
}
.home-modern .contact-reservation-panel .btn-primary {
min-width: min(100%, 15rem);
justify-content: center;
}
/* Über uns — Highlights (Weine / Signatures / Hideaway) auf schmalen Screens */
@media (max-width: 639px) {
.home-modern .home-section-bar .grid.grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
/* --- landing-modern.css --- */
/**
* Landingpages — Modern-Theme (Manuka, Montserrat, Orange #FA4303)
*/
.home-modern .landing-page {
overflow-x: clip;
}
/* Dekorative SVG-Ausschnitte & Splashes — Hero-Wellenlinie (.landing-hero-doodle) bleibt */
.home-modern.is-landing-page .landing-vector,
.home-modern.is-landing-page .landing-deco,
.home-modern.is-landing-page .landing-wave {
display: none !important;
}
/* Hero: Abstand unter fixem Header, dunkles Top-Overlay wie Startseite */
.home-modern.is-landing-page #nav,
.home-modern.is-events-page #nav {
background: linear-gradient(180deg, rgba(10, 8, 7, 0.92) 0%, rgba(10, 8, 7, 0.55) 70%, transparent 100%);
}
.home-modern.is-landing-page #nav.scrolled,
.home-modern.is-events-page #nav.scrolled {
background: rgba(10, 8, 7, 0.88);
}
.home-modern .landing-hero .hero-img {
transform: scale(1.1);
}
.home-modern .landing-hero-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
letter-spacing: 0.01em;
}
.home-modern .landing-eyebrow {
font-family: 'Eburts', cursive;
text-transform: uppercase;
letter-spacing: 0.06em;
}
.home-modern .landing-section-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
letter-spacing: 0.01em;
}
.home-modern .landing-prose p {
margin: 0;
}
.home-modern .landing-prose p + p {
margin-top: 1.15em;
}
.home-modern .landing-figure img {
display: block;
width: 100%;
}
.home-modern .landing-section--family {
position: relative;
}
.home-modern .landing-family-card--highlight {
background: rgba(var(--modern-sign-rgb), 0.08);
}
.home-modern .landing-family-card--highlight .text-xs {
color: var(--modern-sign) !important;
}
.home-modern .landing-faq summary::-webkit-details-marker {
display: none;
}
.home-modern .landing-faq[open] .landing-faq-icon {
transform: rotate(180deg);
}
.home-modern .landing-section:nth-child(even):not(.landing-section--family):not(.landing-section--faq) {
background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.015), transparent);
}
/* ── Dekorationen (Splash + Illustration) ── */
.home-modern .landing-deco {
position: absolute;
pointer-events: none;
z-index: 0;
overflow: hidden;
}
.home-modern .landing-deco__img {
display: block;
width: 155%;
max-width: none;
height: auto;
mix-blend-mode: screen;
filter: contrast(1.05);
opacity: var(--landing-deco-opacity, 0.32);
}
.home-modern .landing-deco--splash .landing-deco__img {
filter: contrast(1.08);
}
.home-modern .landing-deco--illus {
overflow: visible;
}
.home-modern .landing-deco--illus .landing-deco__img {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.22;
}
/* Hero — dezenter Splash, Elemente an den Ecken */
.home-modern .landing-deco--hero-tr {
top: 2.5rem;
right: -10%;
width: min(42vw, 380px);
height: clamp(160px, 26vw, 300px);
--landing-deco-opacity: 0.28;
}
.home-modern .landing-deco--hero-tr .landing-deco__img {
transform: rotate(10deg) translate(10%, -8%);
transform-origin: top right;
}
.home-modern .landing-hero-title-wrap {
position: relative;
padding-bottom: 0.35em;
}
.home-modern .landing-hero-title {
position: relative;
z-index: 1;
}
.home-modern .landing-hero-doodle {
position: absolute;
left: -2%;
right: -3%;
top: auto;
bottom: -0.28em;
height: clamp(14px, 0.48em, 30px);
z-index: 0;
overflow: visible;
pointer-events: none;
transform: rotate(-1.5deg);
transform-origin: 8% 50%;
}
.home-modern .landing-hero-doodle__reveal {
width: 100%;
height: 100%;
clip-path: inset(0 100% 0 0);
animation: landing-hero-line-draw 2s 0.5s cubic-bezier(0.33, 1, 0.38, 1) forwards;
will-change: clip-path;
}
.home-modern .landing-hero-doodle__svg {
display: block;
width: 100%;
height: 100%;
overflow: visible;
}
.home-modern .landing-hero-doodle__path {
fill: var(--modern-sign, #fa4303);
fill-rule: nonzero;
}
@keyframes landing-hero-line-draw {
to { clip-path: inset(0 0 0 0); }
}
/* Hero — einzelne SVG-Akzente (infos/svgs) */
.home-modern .landing-vector--hero-corner-tr {
top: 10%;
right: 4%;
width: clamp(56px, 7vw, 84px);
height: clamp(36px, 5vw, 56px);
--landing-scale: 5.5;
--landing-rot: 6deg;
}
.home-modern .landing-vector--hero-corner-tr .landing-vector__img {
object-position: 77% 47%;
}
.home-modern .landing-vector--hero-corner-tl {
top: 22%;
left: 3%;
width: clamp(52px, 6.5vw, 78px);
height: clamp(52px, 6.5vw, 78px);
--landing-scale: 4.8;
--landing-rot: -8deg;
}
.home-modern .landing-vector--hero-corner-tl .landing-vector__img {
object-position: 78% 86%;
}
.home-modern .landing-vector--hero-swoosh {
bottom: 14%;
right: 0;
left: auto;
width: min(50vw, 440px);
height: clamp(64px, 9vw, 104px);
--landing-scale: 3.4;
--landing-rot: -2deg;
overflow: visible;
}
.home-modern .landing-vector--hero-swoosh .landing-vector__img {
object-fit: cover;
object-position: 28% 63%;
transform: rotate(var(--landing-rot, -2deg)) scale(var(--landing-scale, 3.4));
transform-origin: center right;
opacity: 0.88;
}
.home-modern .landing-vector--hero-corner-tr.reveal,
.home-modern .landing-vector--hero-corner-tl.reveal,
.home-modern .landing-vector--hero-swoosh.reveal {
opacity: 1;
clip-path: none;
transform: none;
animation: landing-hero-vector-in 1s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.home-modern .landing-vector--hero-corner-tl.reveal {
animation-delay: 0.15s;
}
.home-modern .landing-vector--hero-swoosh.reveal {
animation-delay: 0.45s;
}
.home-modern .landing-vector--hero-swoosh.reveal .landing-vector__img {
animation: landing-hero-swoosh-draw 1.5s 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes landing-hero-swoosh-draw {
from {
opacity: 0;
clip-path: inset(0 100% 0 0);
transform: rotate(var(--landing-rot, -2deg)) scale(calc(var(--landing-scale, 3.4) * 0.94));
}
to {
opacity: 0.88;
clip-path: inset(0 0 0 0);
transform: rotate(var(--landing-rot, -2deg)) scale(var(--landing-scale, 3.4));
}
}
@keyframes landing-hero-vector-in {
from {
opacity: 0;
transform: translateY(12px) scale(0.94);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
/* Abschnitte — Splash */
.home-modern .landing-deco--section-br {
bottom: -2rem;
right: -8%;
width: min(46vw, 400px);
height: clamp(160px, 24vw, 300px);
opacity: 0.28;
}
.home-modern .landing-deco--section-br .landing-deco__img {
transform: rotate(10deg);
transform-origin: bottom right;
}
.home-modern .landing-deco--section-tl {
top: -1rem;
left: -10%;
width: min(40vw, 360px);
height: clamp(150px, 22vw, 280px);
opacity: 0.24;
}
.home-modern .landing-deco--section-tl .landing-deco__img {
transform: rotate(-14deg);
transform-origin: top left;
}
.home-modern .landing-deco--section-tr {
top: 0;
right: -6%;
width: min(38vw, 340px);
height: clamp(140px, 20vw, 260px);
opacity: 0.22;
}
.home-modern .landing-deco--section-bl {
bottom: 0;
left: -8%;
width: min(42vw, 380px);
height: clamp(150px, 22vw, 280px);
opacity: 0.26;
}
.home-modern .landing-deco--section-bl .landing-deco__img {
transform: rotate(-10deg);
}
/* Abschnitte — Illustration (Ausschnitte aus 100GRAMM_ILLUS) */
.home-modern .landing-deco--section-tr.landing-deco--illus .landing-deco__img {
object-position: 18% 22%;
transform: scale(2.8);
opacity: 0.45;
}
.home-modern .landing-deco--section-tl.landing-deco--illus .landing-deco__img {
object-position: 55% 78%;
transform: scale(3.2) rotate(-6deg);
opacity: 0.4;
}
.home-modern .landing-deco--section-br.landing-deco--illus .landing-deco__img {
object-position: 82% 18%;
transform: scale(2.6);
opacity: 0.42;
}
.home-modern .landing-deco--section-bl.landing-deco--illus .landing-deco__img {
object-position: 35% 45%;
transform: scale(3) rotate(8deg);
opacity: 0.38;
}
/* Events */
.home-modern .landing-deco--events-tr {
top: 0;
right: -4%;
width: min(36vw, 320px);
height: clamp(130px, 18vw, 240px);
opacity: 0.22;
}
/* Familie — große „100“-Andeutung */
.home-modern .landing-deco--family-center {
top: 50%;
left: 50%;
width: min(70vw, 560px);
height: clamp(200px, 35vw, 400px);
transform: translate(-50%, -50%);
opacity: 0.12;
}
.home-modern .landing-deco--family-center .landing-deco__img {
object-position: 68% 82%;
transform: scale(4.5);
opacity: 0.7;
}
/* FAQ */
.home-modern .landing-deco--faq-bl {
bottom: -1rem;
left: -10%;
width: min(34vw, 300px);
height: clamp(120px, 16vw, 220px);
opacity: 0.2;
}
.home-modern .landing-deco--faq-bl .landing-deco__img {
transform: rotate(-12deg);
}
@media (max-width: 767px) {
.home-modern .landing-deco--hero-tr,
.home-modern .landing-deco--section-br,
.home-modern .landing-deco--section-tr,
.home-modern .landing-deco--events-tr {
opacity: 0.18;
width: min(60vw, 280px);
}
.home-modern .landing-deco--hero-bl,
.home-modern .landing-deco--family-center {
display: none;
}
}
/* ── Vektor-Akzente (infos/svgs) ── */
.home-modern .landing-vector {
position: absolute;
pointer-events: none;
z-index: 1;
overflow: hidden;
}
.home-modern .landing-vector__img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.9;
transform: rotate(var(--landing-rot, 0deg)) scale(var(--landing-scale, 2.8));
transform-origin: center center;
}
.home-modern .landing-vector.reveal {
opacity: 0;
clip-path: inset(0 100% 0 0);
transform: translateY(10px);
}
.home-modern .landing-vector.reveal.in {
opacity: 1;
clip-path: inset(0 0 0 0);
transform: translateY(0);
transition:
opacity 0.75s ease,
clip-path 1.15s cubic-bezier(0.22, 1, 0.36, 1),
transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.home-modern .landing-vector--float.in {
animation: landing-vector-drift 8s ease-in-out infinite;
}
.home-modern .landing-vector--float.in .landing-vector__img {
animation: landing-vector-sway 6s ease-in-out infinite;
}
@keyframes landing-vector-drift {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
@keyframes landing-vector-sway {
0%, 100% { transform: rotate(var(--landing-rot, 0deg)) scale(var(--landing-scale, 2.8)); }
50% { transform: rotate(calc(var(--landing-rot, 0deg) + 3deg)) scale(calc(var(--landing-scale, 2.8) * 1.04)); }
}
/* Abschnitt-Akzente */
.home-modern .landing-vector--accent-tr {
top: 8%;
right: 4%;
width: clamp(80px, 11vw, 130px);
height: clamp(52px, 7vw, 84px);
--landing-scale: 3;
--landing-rot: 5deg;
}
.home-modern .landing-vector--accent-bl {
bottom: 10%;
left: 2%;
width: clamp(88px, 12vw, 140px);
height: clamp(56px, 8vw, 90px);
--landing-scale: 2.8;
--landing-rot: -8deg;
}
.home-modern .landing-vector--accent-tl {
top: 6%;
left: 3%;
width: clamp(76px, 10vw, 120px);
height: clamp(50px, 7vw, 80px);
--landing-scale: 3.2;
--landing-rot: -4deg;
}
.home-modern .landing-vector--accent-br {
bottom: 8%;
right: 5%;
width: clamp(84px, 11vw, 136px);
height: clamp(54px, 7vw, 86px);
--landing-scale: 2.6;
--landing-rot: 10deg;
}
.home-modern .landing-vector--accent-mid-r {
top: 42%;
right: -2%;
width: clamp(70px, 9vw, 110px);
height: clamp(46px, 6vw, 72px);
opacity: 0.7;
--landing-scale: 3.4;
}
.home-modern .landing-vector--accent-mid-l {
top: 38%;
left: -1%;
width: clamp(74px, 10vw, 116px);
height: clamp(48px, 6vw, 76px);
opacity: 0.65;
--landing-scale: 3;
--landing-rot: -12deg;
}
/* SVG-Ausschnitte */
.home-modern .landing-vector--horns .landing-vector__img { object-position: 77% 47%; }
.home-modern .landing-vector--kringel .landing-vector__img { object-position: 28% 64%; }
.home-modern .landing-vector--mark .landing-vector__img { object-position: 78% 86%; }
.home-modern .landing-vector--swirl_eyes .landing-vector__img { object-position: 50% 72%; }
.home-modern .landing-vector--smile .landing-vector__img { object-position: 42% 84%; }
.home-modern .landing-vector--spring.landing-vector--accent-br .landing-vector__img,
.home-modern .landing-vector--spring.landing-vector--accent-tr .landing-vector__img {
object-position: 68% 92%;
}
/* Wellenlinie unter Überschriften */
.home-modern .landing-title-block {
isolation: isolate;
}
.home-modern .landing-vector--title-under {
position: absolute;
left: 0;
bottom: -0.2em;
width: 108%;
height: 0.55em;
z-index: -1;
}
.home-modern .landing-vector--title-under .landing-vector__img {
object-fit: cover;
object-position: 55% 94%;
transform: scale(4.5);
transform-origin: left center;
opacity: 0.95;
}
.home-modern .landing-vector--title-under.reveal.in .landing-vector__img {
animation: landing-title-wave 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes landing-title-wave {
from {
clip-path: inset(0 100% 0 0);
opacity: 0;
}
to {
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
/* Wellen-Trenner zwischen Abschnitten */
.home-modern .landing-wave {
position: relative;
width: 100%;
height: clamp(52px, 9vw, 104px);
margin: -0.5rem 0;
pointer-events: none;
z-index: 2;
overflow: hidden;
}
.home-modern .landing-wave.reveal {
opacity: 0;
clip-path: inset(0 100% 0 0);
}
.home-modern .landing-wave.reveal.in {
opacity: 1;
clip-path: inset(0 0 0 0);
transition:
opacity 0.85s ease,
clip-path 1.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.home-modern .landing-wave__img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.88;
}
.home-modern .landing-wave--spring .landing-wave__img {
object-position: 62% 96%;
transform: scale(1.15);
}
.home-modern .landing-wave--kringel .landing-wave__img {
object-position: 32% 68%;
transform: scale(1.1);
}
.home-modern .landing-wave--flip .landing-wave__img {
transform: scaleX(-1) scale(1.12);
}
.home-modern .landing-wave--flip.landing-wave--kringel .landing-wave__img {
transform: scaleX(-1) scale(1.08);
}
@media (max-width: 767px) {
.home-modern .landing-vector--hero-corner-tl,
.home-modern .landing-vector--hero-swoosh,
.home-modern .landing-vector--accent-mid-r,
.home-modern .landing-vector--accent-mid-l {
display: none;
}
.home-modern .landing-vector--hero-corner-tr {
opacity: 0.65;
width: 48px;
height: 32px;
top: 8%;
right: 2%;
}
.home-modern .landing-wave {
height: clamp(40px, 12vw, 72px);
}
}
@media (prefers-reduced-motion: reduce) {
.home-modern .landing-vector.reveal,
.home-modern .landing-wave.reveal {
opacity: 1;
clip-path: none;
transform: none;
transition: none;
}
.home-modern .landing-vector--float.in,
.home-modern .landing-vector--float.in .landing-vector__img,
.home-modern .landing-vector--title-under.reveal.in .landing-vector__img,
.home-modern .landing-hero-doodle__reveal,
.home-modern .landing-hero-doodle__path,
.home-modern .landing-vector--hero-swoosh.reveal .landing-vector__img {
animation: none;
clip-path: inset(0 0 0 0);
stroke-dashoffset: 0;
}
}
/* --- glossary-modern.css --- */
/* Glossar — Übersicht & Detail (Modern-Theme) */
.is-glossary-page .glossary-page {
padding-top: calc(var(--nav-height, 5.75rem) + 1.5rem);
padding-bottom: 5rem;
}
@media (min-width: 1024px) {
.is-glossary-page .glossary-page {
padding-top: calc(var(--nav-height, 5.75rem) + 2rem);
padding-bottom: 7rem;
}
}
/* Hero */
.glossary-hero {
position: relative;
padding: 2.5rem 1.5rem 2rem;
border-bottom: 1px solid rgba(200, 127, 58, 0.12);
background:
radial-gradient(ellipse 80% 60% at 100% 0%, rgba(200, 127, 58, 0.08), transparent 55%),
linear-gradient(180deg, rgba(20, 17, 16, 0.4), transparent);
}
@media (min-width: 1024px) {
.glossary-hero {
padding: 3rem 3rem 2.5rem;
}
}
.glossary-hero-inner {
max-width: 1400px;
margin: 0 auto;
}
.glossary-eyebrow {
display: flex;
align-items: center;
gap: 0.75rem;
margin: 0 0 1rem;
font-size: 0.6875rem;
letter-spacing: 0.28em;
text-transform: uppercase;
color: #c87f3a;
}
.glossary-eyebrow-line {
display: inline-block;
width: 2.5rem;
height: 1px;
background: #c87f3a;
}
.glossary-hero-title {
margin: 0 0 1rem;
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: clamp(2.75rem, 7vw, 4.5rem);
line-height: 0.95;
letter-spacing: -0.02em;
color: #f5ede0;
}
.glossary-hero-lead {
max-width: 38rem;
margin: 0 0 1.25rem;
font-size: 1.05rem;
font-weight: 300;
line-height: 1.65;
color: rgba(245, 237, 224, 0.72);
}
.glossary-hero-meta {
margin: 0;
font-size: 0.75rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.38);
}
/* Toolbar */
.glossary-toolbar-wrap {
position: sticky;
top: var(--nav-height, 5.75rem);
z-index: 30;
background: rgba(10, 8, 7, 0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(200, 127, 58, 0.1);
}
.glossary-toolbar {
max-width: 1400px;
margin: 0 auto;
padding: 1rem 1.5rem;
display: flex;
flex-direction: column;
gap: 0.85rem;
}
@media (min-width: 768px) {
.glossary-toolbar {
flex-direction: row;
align-items: center;
gap: 1.25rem;
padding: 1rem 3rem;
}
}
.glossary-search {
position: relative;
flex: 0 0 auto;
width: 100%;
}
@media (min-width: 768px) {
.glossary-search {
width: min(18rem, 100%);
}
}
.glossary-search-icon {
position: absolute;
left: 0.9rem;
top: 50%;
transform: translateY(-50%);
font-size: 0.8rem;
color: rgba(245, 237, 224, 0.35);
pointer-events: none;
}
.glossary-search-input {
width: 100%;
padding: 0.65rem 0.9rem 0.65rem 2.35rem;
border: 1px solid rgba(200, 127, 58, 0.22);
border-radius: 999px;
background: rgba(245, 237, 224, 0.04);
color: #f5ede0;
font-size: 0.875rem;
font-weight: 300;
outline: none;
transition: border-color 0.2s ease, background 0.2s ease;
}
.glossary-search-input::placeholder {
color: rgba(245, 237, 224, 0.35);
}
.glossary-search-input:focus {
border-color: rgba(200, 127, 58, 0.55);
background: rgba(245, 237, 224, 0.06);
}
.glossary-filters {
display: flex;
flex-wrap: wrap;
gap: 0.45rem;
min-width: 0;
}
.glossary-filter {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0.45rem 0.8rem;
border: 1px solid rgba(200, 127, 58, 0.18);
border-radius: 999px;
background: transparent;
color: rgba(245, 237, 224, 0.62);
font-size: 0.75rem;
font-weight: 400;
letter-spacing: 0.04em;
cursor: pointer;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.glossary-filter:hover {
color: #f5ede0;
border-color: rgba(200, 127, 58, 0.4);
}
.glossary-filter.is-active {
color: #0a0807;
background: #c87f3a;
border-color: #c87f3a;
}
.glossary-filter-count {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 1.15rem;
height: 1.15rem;
padding: 0 0.25rem;
border-radius: 999px;
font-size: 0.625rem;
line-height: 1;
background: rgba(10, 8, 7, 0.18);
color: inherit;
}
.glossary-filter.is-active .glossary-filter-count {
background: rgba(10, 8, 7, 0.2);
}
/* Content */
.glossary-content {
max-width: 1400px;
margin: 0 auto;
padding: 2rem 1.5rem 0;
}
@media (min-width: 1024px) {
.glossary-content {
padding: 2.5rem 3rem 0;
}
}
.glossary-section {
margin-bottom: 2.75rem;
}
.glossary-section-head {
display: flex;
align-items: baseline;
gap: 0.75rem;
margin-bottom: 1.25rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid rgba(200, 127, 58, 0.12);
}
.glossary-section-title {
margin: 0;
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: 1.75rem;
color: #f5ede0;
line-height: 1.1;
}
.glossary-section-count {
font-size: 0.7rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.35);
}
.glossary-grid {
display: grid;
grid-template-columns: 1fr;
gap: 1.25rem;
}
@media (min-width: 640px) {
.glossary-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
.glossary-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1.5rem;
}
}
/* Cards */
.glossary-card {
min-width: 0;
}
.glossary-card-link {
display: flex;
flex-direction: column;
height: 100%;
text-decoration: none;
color: inherit;
border: 1px solid rgba(200, 127, 58, 0.14);
border-radius: 0.2rem;
overflow: hidden;
background: rgba(20, 17, 16, 0.55);
transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.glossary-card-link:hover {
border-color: rgba(200, 127, 58, 0.45);
transform: translateY(-2px);
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}
.glossary-card-media {
position: relative;
aspect-ratio: 16 / 10;
overflow: hidden;
background: #141110;
}
.glossary-card-img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.glossary-card-link:hover .glossary-card-img {
transform: scale(1.04);
}
.glossary-card-type {
position: absolute;
left: 0.75rem;
bottom: 0.75rem;
padding: 0.28rem 0.55rem;
border-radius: 999px;
background: rgba(10, 8, 7, 0.72);
backdrop-filter: blur(6px);
font-size: 0.625rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #c87f3a;
}
.glossary-card-body {
display: flex;
flex-direction: column;
flex: 1;
gap: 0.45rem;
padding: 1rem 1rem 1.1rem;
}
.glossary-card-title {
margin: 0;
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: 1.35rem;
line-height: 1.15;
color: #f5ede0;
}
.glossary-card-region {
margin: 0;
font-size: 0.75rem;
letter-spacing: 0.06em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.45);
}
.glossary-card-teaser {
margin: 0;
font-size: 0.8125rem;
font-weight: 300;
line-height: 1.55;
color: rgba(245, 237, 224, 0.58);
}
.glossary-card-cta {
display: inline-flex;
align-items: center;
gap: 0.45rem;
margin-top: auto;
padding-top: 0.35rem;
font-size: 0.75rem;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #c87f3a;
}
.glossary-card-cta i {
font-size: 0.65rem;
transition: transform 0.2s ease;
}
.glossary-card-link:hover .glossary-card-cta i {
transform: translateX(3px);
}
.glossary-empty {
margin: 3rem auto;
text-align: center;
font-size: 0.95rem;
color: rgba(245, 237, 224, 0.5);
}
.glossary-empty.is-visible {
display: block;
}
/* Detail */
.glossary-article-hero {
position: relative;
min-height: 22rem;
display: grid;
align-items: end;
}
@media (min-width: 768px) {
.glossary-article-hero {
min-height: 26rem;
}
}
.glossary-article-hero-media {
position: absolute;
inset: 0;
}
.glossary-article-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.glossary-article-hero-overlay {
position: absolute;
inset: 0;
background:
linear-gradient(180deg, rgba(10, 8, 7, 0.35) 0%, rgba(10, 8, 7, 0.55) 45%, rgba(10, 8, 7, 0.94) 100%),
linear-gradient(90deg, rgba(10, 8, 7, 0.65), transparent 55%);
}
.glossary-article-hero-content {
position: relative;
z-index: 1;
max-width: 1400px;
margin: 0 auto;
width: 100%;
padding: 2rem 1.5rem 2.25rem;
}
@media (min-width: 1024px) {
.glossary-article-hero-content {
padding: 2.5rem 3rem 2.75rem;
}
}
.glossary-breadcrumb {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.45rem;
margin-bottom: 1rem;
font-size: 0.75rem;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.45);
}
.glossary-breadcrumb a {
color: #c87f3a;
text-decoration: none;
}
.glossary-breadcrumb a:hover {
color: #f5ede0;
}
.glossary-article-type {
margin: 0 0 0.65rem;
font-size: 0.6875rem;
letter-spacing: 0.24em;
text-transform: uppercase;
color: #c87f3a;
}
.glossary-article-title {
max-width: 16ch;
margin: 0 0 0.75rem;
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: clamp(2.25rem, 6vw, 4rem);
line-height: 0.95;
color: #f5ede0;
}
.glossary-article-region {
margin: 0 0 0.75rem;
font-size: 0.8rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(245, 237, 224, 0.55);
}
.glossary-article-excerpt {
max-width: 40rem;
margin: 0;
font-size: 1.05rem;
font-weight: 300;
line-height: 1.6;
color: rgba(245, 237, 224, 0.72);
}
.glossary-article-body {
max-width: 48rem;
margin: 0 auto;
padding: 2rem 1.5rem 0;
}
@media (min-width: 1024px) {
.glossary-article-body {
padding: 2.5rem 3rem 0;
}
}
.glossary-article-actions {
display: flex;
flex-wrap: wrap;
gap: 0.75rem 1.25rem;
margin-bottom: 2rem;
}
.glossary-back-link {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-size: 0.8rem;
letter-spacing: 0.08em;
text-transform: uppercase;
text-decoration: none;
color: #c87f3a;
transition: color 0.2s ease;
}
.glossary-back-link:hover {
color: #f5ede0;
}
.glossary-back-link--muted {
color: rgba(245, 237, 224, 0.45);
}
.glossary-back-link--muted:hover {
color: #c87f3a;
}
.glossary-prose {
padding-bottom: 1rem;
}
.home-modern .glossary-prose :is(h2, h3, h4) {
font-family: 'Cormorant Garamond', Georgia, serif;
color: #f5ede0;
}
.layout-gate.is-glossary-page .glossary-page {
padding-top: calc(var(--nav-height, 5.75rem) + 1rem);
}
/* --- menu-page.css --- */
/**
* Karten-Seite /karte — mobile-first, QR-tauglich
*/
.home-modern.is-menu-page #nav {
background: rgba(10, 8, 7, 0.92);
backdrop-filter: blur(10px);
}
.home-modern .menu-page {
overflow-x: clip;
}
.home-modern .menu-page-hero {
padding: 7.5rem 1.5rem 2.5rem;
background:
radial-gradient(ellipse 80% 60% at 20% 0%, rgba(250, 67, 3, 0.08), transparent 55%),
linear-gradient(180deg, rgba(10, 8, 7, 0.35), transparent);
}
@media (min-width: 1024px) {
.home-modern .menu-page-hero {
padding: 8.5rem 3rem 3rem;
}
}
.home-modern .menu-page-hero__inner {
max-width: 42rem;
margin: 0 auto;
text-align: center;
}
.home-modern .menu-page-eyebrow {
display: inline-flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1.25rem;
font-family: 'Eburts', cursive;
font-size: 0.75rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--modern-sign, #fa4303);
}
.home-modern .menu-page-eyebrow__line {
display: inline-block;
width: 2rem;
height: 1px;
background: currentColor;
}
.home-modern .menu-page-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: clamp(2.25rem, 7vw, 3.75rem);
line-height: 0.98;
letter-spacing: 0.01em;
color: var(--cream, #f5efe6);
}
.home-modern .menu-page-title__accent {
font-style: italic;
color: #FA4303;
color: var(--modern-sign, #FA4303);
}
.home-modern .menu-page-lead {
margin-top: 1.25rem;
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 1.05rem;
line-height: 1.65;
font-weight: 300;
color: rgba(245, 239, 230, 0.72);
}
.home-modern .menu-page-toolbar-wrap {
z-index: 20;
padding: 0 1rem 0.75rem;
background: transparent;
border-bottom: none;
}
.home-modern .menu-page-toolbar {
max-width: 56rem;
margin: 0 auto;
}
.home-modern .menu-page-filters {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5rem;
padding-bottom: 0.25rem;
}
.home-modern .menu-page-filters .filter-btn {
flex: 0 0 auto;
white-space: nowrap;
}
.home-modern .menu-page-content {
max-width: 56rem;
margin: 0 auto;
padding: 1.5rem 1.5rem 4rem;
background: transparent;
}
@media (min-width: 1024px) {
.home-modern .menu-page-content {
padding: 2rem 3rem 5rem;
}
}
.home-modern .menu-page-food-hint {
margin-bottom: 1.5rem;
padding: 0.9rem 1rem;
border-radius: 0.75rem;
border: 1px solid rgba(250, 67, 3, 0.18);
background: rgba(250, 67, 3, 0.06);
color: rgba(245, 239, 230, 0.78);
font-size: 0.92rem;
line-height: 1.55;
}
.home-modern .menu-page-grid {
display: grid;
gap: 1.35rem;
}
@media (min-width: 768px) {
.home-modern .menu-page-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1.5rem 2rem;
}
}
.home-modern .menu-page-item {
padding: 1.1rem 1.15rem;
border-radius: 1rem;
border: 1px solid rgba(255, 255, 255, 0.07);
background: rgba(255, 255, 255, 0.025);
}
.home-modern .menu-page-item__name {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: 1.45rem;
line-height: 1.15;
color: var(--cream, #f5efe6);
}
.home-modern .menu-page-item__price {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 0.88rem;
color: var(--modern-sign, #fa4303);
white-space: nowrap;
}
.home-modern .menu-page-item__desc {
font-size: 0.94rem;
line-height: 1.6;
font-weight: 300;
color: rgba(245, 239, 230, 0.62);
}
/* Produktbilder (global aktivierbar) */
.home-modern .menu-item__layout {
display: flex;
flex-direction: column;
gap: 0.85rem;
}
.home-modern .menu-item__media {
overflow: hidden;
border-radius: 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.03);
}
.home-modern .menu-item__img {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
}
.home-modern .menu-page-item.menu-item--has-image {
padding: 0.75rem 0.75rem 1.1rem;
}
.home-modern .menu-page-item.menu-item--has-image .menu-item__media {
border-radius: 0.65rem;
}
.home-modern #karte .menu-item--has-image .menu-item__layout {
flex-direction: row;
align-items: flex-start;
gap: 1rem;
}
.home-modern #karte .menu-item--has-image .menu-item__media {
flex: 0 0 5.5rem;
width: 5.5rem;
border-radius: 0.65rem;
}
.home-modern #karte .menu-item--has-image .menu-item__img {
aspect-ratio: 1;
}
@media (min-width: 640px) {
.home-modern #karte .menu-item--has-image .menu-item__media {
flex-basis: 6.5rem;
width: 6.5rem;
}
}
.home-modern .menu-page-footnote {
margin-top: 2.5rem;
text-align: center;
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 0.875rem;
line-height: 1.6;
font-weight: 300;
font-style: normal;
color: rgba(245, 239, 230, 0.5);
}
.home-modern .menu-page-back {
margin-top: 2rem;
text-align: center;
}
.home-modern .menu-page-back__link {
display: inline-flex;
align-items: center;
gap: 0.55rem;
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 0.875rem;
font-weight: 400;
color: rgba(245, 239, 230, 0.72);
transition: color 0.2s ease;
}
.home-modern .menu-page-back__link:hover {
color: var(--cream, #f5efe6);
}
.home-modern .menu-page-back__link i {
font-size: 0.75rem;
transition: transform 0.2s ease;
}
.home-modern .menu-page-back__link:hover i {
transform: translateX(3px);
}
/* --- jobs-modern.css --- */
/**
* Karriere /jobs — Modern Theme
*/
.home-modern.is-jobs-page #nav {
background: rgba(10, 8, 7, 0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(var(--modern-sign-rgb), 0.12);
}
.home-modern.is-jobs-page .page-sub {
padding-top: 7rem;
padding-bottom: 4rem;
background:
radial-gradient(ellipse 80% 55% at 50% 0%, rgba(var(--modern-sign-rgb), 0.07), transparent 58%),
transparent;
}
@media (min-width: 1024px) {
.home-modern.is-jobs-page .page-sub {
padding-top: 8.5rem;
padding-bottom: 5rem;
}
}
.home-modern.is-jobs-page .jobs-page-eyebrow {
font-family: 'Eburts', cursive;
color: var(--modern-sign);
}
.home-modern.is-jobs-page .jobs-page-eyebrow .line {
background: currentColor;
}
.home-modern.is-jobs-page .jobs-page-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
letter-spacing: 0.01em;
}
.home-modern.is-jobs-page .jobs-page-title .italic {
font-family: 'Eburts', cursive !important;
font-style: normal !important;
font-weight: 400 !important;
text-transform: uppercase;
letter-spacing: 0.02em;
color: var(--modern-sign) !important;
display: inline-block;
transform: rotate(-2deg);
}
.home-modern.is-jobs-page .jobs-page-lead {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 300;
color: rgba(245, 239, 230, 0.72);
}
.home-modern.is-jobs-page .job-card {
border-radius: 1rem;
border-color: rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.025);
}
.home-modern.is-jobs-page .job-card:hover {
border-color: rgba(var(--modern-sign-rgb), 0.4);
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
}
.home-modern.is-jobs-page .job-card-accent {
background: rgba(var(--modern-sign-rgb), 0.06);
border-color: rgba(var(--modern-sign-rgb), 0.12);
}
.home-modern.is-jobs-page .job-card-icon {
border-color: rgba(var(--modern-sign-rgb), 0.35);
color: var(--modern-sign);
}
.home-modern.is-jobs-page .job-card-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
color: var(--cream, #f5efe6);
}
.home-modern.is-jobs-page .job-card-tag {
color: rgba(var(--modern-sign-rgb), 0.95);
border-color: rgba(var(--modern-sign-rgb), 0.25);
background: rgba(var(--modern-sign-rgb), 0.06);
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
}
.home-modern.is-jobs-page .job-card-teaser {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
color: rgba(245, 239, 230, 0.68);
}
.home-modern.is-jobs-page .job-card-footer {
border-top-color: rgba(255, 255, 255, 0.08);
}
.home-modern.is-jobs-page .job-card-link {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
color: var(--cream, #f5efe6);
border-bottom-color: var(--modern-sign);
}
.home-modern.is-jobs-page .job-card-link:hover {
color: var(--modern-sign);
}
.home-modern.is-jobs-page .job-detail-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
}
.home-modern.is-jobs-page .job-detail-meta {
color: rgba(var(--modern-sign-rgb), 0.85);
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
}
.home-modern.is-jobs-page .job-apply-panel {
border-radius: 1rem;
border-color: rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.025);
}
.home-modern.is-jobs-page .job-apply-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
}
.home-modern.is-jobs-page .prose-vino h2 {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: 1.75rem;
color: var(--cream, #f5efe6);
margin: 2rem 0 0.75rem;
}
.home-modern.is-jobs-page .prose-vino h3 {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 1.15rem;
font-weight: 600;
color: var(--cream, #f5efe6);
margin: 1.5rem 0 0.5rem;
}
.home-modern.is-jobs-page .prose-vino p,
.home-modern.is-jobs-page .prose-vino ul {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-weight: 300;
line-height: 1.8;
color: rgba(245, 239, 230, 0.72);
margin-bottom: 1rem;
}
.home-modern.is-jobs-page .prose-vino ul {
list-style: disc;
padding-left: 1.5rem;
}
.home-modern.is-jobs-page .prose-vino a {
color: var(--modern-sign);
text-decoration: underline;
}
.home-modern.is-jobs-page .prose-vino strong {
color: var(--cream, #f5efe6);
font-weight: 500;
}
.home-modern.is-jobs-page .gate-lang a.is-active {
color: var(--modern-sign) !important;
}
/* --- events-page.css --- */
/**
* Events-Übersicht (/events) — Landing-Style
*/
.home-modern.is-events-page .events-page {
overflow-x: clip;
}
.home-modern.is-events-page .events-page-hero {
min-height: max(72vh, 640px);
}
.home-modern.is-events-page .events-page-hero__inner {
min-height: max(72vh, 640px);
}
.home-modern.is-events-page .events-page-hero .hero-img {
filter: brightness(0.75) saturate(0.9);
transform: scale(1.05);
}
.home-modern.is-events-page .landing-deco--events-tr {
top: 5.5rem;
}
.home-modern.is-events-page .events-page-list {
margin-top: -2rem;
}
@media (min-width: 1024px) {
.home-modern.is-events-page .events-page-list {
margin-top: -3rem;
}
}
/* --- coming-soon-modern.css --- */
/**
* Coming Soon — Modern Theme (Gate-Layout)
*/
.home-modern.is-coming-soon-page #nav {
background: rgba(10, 8, 7, 0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(var(--modern-sign-rgb), 0.12);
}
.home-modern.is-coming-soon-page .gate-lang a.is-active {
color: var(--modern-sign) !important;
}
.home-modern.is-coming-soon-page .gate-nav .nav-link:hover {
color: var(--modern-sign);
}
.home-modern.is-coming-soon-page .coming-soon-section {
min-height: auto;
display: block;
padding: 7rem 0 4.5rem;
overflow-x: clip;
}
@media (min-width: 1024px) {
.home-modern.is-coming-soon-page .coming-soon-section {
padding: 8.5rem 0 5.5rem;
}
}
.home-modern.is-coming-soon-page .coming-soon-inner {
max-width: 42rem;
padding: 0 1.5rem;
}
@media (min-width: 1024px) {
.home-modern.is-coming-soon-page .coming-soon-inner {
padding: 0 3rem;
}
}
.home-modern.is-coming-soon-page .coming-soon-bg {
opacity: 0.18;
border-radius: 0;
inset: 0;
position: fixed;
height: 100vh;
}
.home-modern.is-coming-soon-page .coming-soon-bg-overlay {
background:
radial-gradient(ellipse 90% 70% at 50% -10%, rgba(var(--modern-sign-rgb), 0.1), transparent 55%),
linear-gradient(180deg, rgba(10, 8, 7, 0.55), rgba(10, 8, 7, 0.94) 45%, #0a0807);
}
.home-modern.is-coming-soon-page .coming-soon-content {
text-align: center;
}
.home-modern.is-coming-soon-page .coming-soon-eyebrow {
display: inline-flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1.25rem;
font-family: 'Eburts', cursive;
font-size: 0.75rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--modern-sign);
justify-content: center;
}
.home-modern.is-coming-soon-page .coming-soon-eyebrow .line {
width: 2rem;
background: currentColor;
}
.home-modern.is-coming-soon-page .coming-soon-title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: clamp(2.5rem, 8vw, 4.25rem);
line-height: 0.98;
letter-spacing: 0.01em;
color: var(--cream, #f5efe6);
margin-bottom: 1.25rem;
}
.home-modern.is-coming-soon-page .coming-soon-title .accent {
font-family: 'Eburts', cursive;
font-style: normal;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.02em;
color: var(--modern-sign);
display: inline-block;
transform: rotate(-2deg);
}
.home-modern.is-coming-soon-page .coming-soon-headline {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: clamp(1.35rem, 4vw, 1.75rem);
line-height: 1.25;
letter-spacing: 0.018em;
color: rgba(245, 239, 230, 0.92);
margin-bottom: 1rem;
max-width: 36rem;
margin-left: auto;
margin-right: auto;
}
.home-modern.is-coming-soon-page .coming-soon-lead {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 1.05rem;
line-height: 1.65;
font-weight: 300;
color: rgba(245, 239, 230, 0.72);
max-width: 36rem;
margin-bottom: 2.5rem;
}
.home-modern.is-coming-soon-page .coming-countdown-grid {
gap: 0.65rem;
max-width: 32rem;
}
.home-modern.is-coming-soon-page .coming-countdown-unit {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 0.75rem;
padding: 1rem 0.5rem;
}
.home-modern.is-coming-soon-page .coming-countdown-val {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-weight: 400;
color: var(--cream, #f5efe6);
}
.home-modern.is-coming-soon-page .coming-countdown-label {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 0.625rem;
letter-spacing: 0.16em;
color: rgba(var(--modern-sign-rgb), 0.85);
}
.home-modern.is-coming-soon-page .coming-countdown-done {
font-family: 'Manuka', 'Cormorant Garamond', serif;
color: var(--modern-sign) !important;
}
.home-modern.is-coming-soon-page .coming-soon-panel {
max-width: 36rem;
margin-top: 0.5rem;
padding: 1.75rem 1.5rem;
border-radius: 1rem;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.025);
text-align: left;
}
@media (min-width: 640px) {
.home-modern.is-coming-soon-page .coming-soon-panel {
padding: 2rem 2.25rem;
}
}
.home-modern.is-coming-soon-page .coming-soon-panel__title {
font-family: 'Manuka', 'Cormorant Garamond', serif;
font-size: 1.65rem;
line-height: 1.15;
color: var(--cream, #f5efe6);
text-align: center;
margin-bottom: 1.25rem;
}
.home-modern.is-coming-soon-page .coming-soon-panel__title .italic {
font-family: 'Eburts', cursive !important;
font-style: normal !important;
font-weight: 400 !important;
text-transform: uppercase;
letter-spacing: 0.02em;
color: var(--modern-sign) !important;
display: inline-block;
transform: rotate(-2deg);
}
.home-modern.is-coming-soon-page .coming-soon-perks {
text-align: left;
margin-bottom: 1.75rem;
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
font-size: 0.9rem;
color: rgba(245, 239, 230, 0.78);
}
.home-modern.is-coming-soon-page .coming-soon-perks li {
display: flex;
align-items: flex-start;
gap: 0.75rem;
padding: 0.65rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.home-modern.is-coming-soon-page .coming-soon-perks li:last-child {
border-bottom: none;
}
.home-modern.is-coming-soon-page .coming-soon-perks li + li {
margin-top: 0;
}
.home-modern.is-coming-soon-page .coming-soon-perks i {
color: var(--modern-sign);
margin-right: 0;
margin-top: 0.15rem;
flex-shrink: 0;
width: 1.1rem;
text-align: center;
}
.home-modern.is-coming-soon-page .coming-soon-panel .protected-form input[type="email"] {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
background: rgba(10, 8, 7, 0.55);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.5rem;
color: var(--cream, #f5efe6);
}
.home-modern.is-coming-soon-page .coming-soon-panel .protected-form input[type="email"]:focus {
border-color: rgba(var(--modern-sign-rgb), 0.55);
outline: none;
}
.home-modern.is-coming-soon-page .coming-soon-panel .protected-form .btn-primary {
border-radius: 0.5rem;
}
.home-modern.is-coming-soon-page .coming-soon-consent {
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
color: rgba(245, 239, 230, 0.5);
}
.home-modern.is-coming-soon-page .coming-soon-consent input {
accent-color: var(--modern-sign);
}
.home-modern.is-coming-soon-page .coming-soon-consent a:hover {
color: var(--modern-sign);
}
.home-modern.is-coming-soon-page .site-footer {
margin-top: 0;
}
/* --- fonts-modern.css --- */
/**
* Schriften Modern-Theme: Montserrat · Manuka · Eburts (latin, lokal gehostet).
*/
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/assets/fonts/montserrat/montserrat-latin-400-normal.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('/assets/fonts/montserrat/montserrat-latin-500-normal.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('/assets/fonts/montserrat/montserrat-latin-600-normal.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Manuka';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('/assets/fonts/manuka/manuka-light.woff2') format('woff2'),
url('/assets/fonts/manuka/Manuka-Light.otf') format('opentype');
}
@font-face {
font-family: 'Manuka';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('/assets/fonts/manuka/manuka-bold.woff2') format('woff2'),
url('/assets/fonts/manuka/Manuka-Bold.otf') format('opentype');
}
@font-face {
font-family: 'Eburts';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/assets/fonts/eburts/EBURTS_SWING.otf') format('opentype');
}
/* --- fontawesome/public.min.css --- */
/*!
* Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
* Copyright 2024 Fonticons, Inc.
*/
.fa{font-family:var(--fa-style-family,"Font Awesome 6 Free");font-weight:var(--fa-style,900)}.fa,.fa-brands,.fa-classic,.fa-regular,.fa-sharp,.fa-solid,.fab,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:var(--fa-display,inline-block);font-style:normal;font-variant:normal;line-height:1;text-rendering:auto}.fa-classic,.fa-regular,.fa-solid,.far,.fas{font-family:"Font Awesome 6 Free"}.fa-brands,.fab{font-family:"Font Awesome 6 Brands"}.fa-solid,.fas{font-weight:900}.fa-regular,.far{font-weight:400}.fa-brands,.fab{font-weight:400}.fa-arrow-right-from-bracket:before,.fa-sign-out:before{content:"\f08b"}.fa-arrow-right-to-bracket:before,.fa-sign-in:before{content:"\f090"}.fa-arrow-right-to-file:before,.fa-file-import:before{content:"\f56f"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-right-rotate:before,.fa-arrow-rotate-forward:before,.fa-arrow-rotate-right:before,.fa-redo:before{content:"\f01e"}.fa-arrow-right-to-city:before{content:"\e4b3"}.fa-arrow-right-arrow-left:before,.fa-exchange:before{content:"\f0ec"}.fa-arrow-right-long:before,.fa-long-arrow-right:before{content:"\f178"}.fa-arrow-right-from-file:before,.fa-file-export:before{content:"\f56e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-left-rotate:before,.fa-arrow-rotate-back:before,.fa-arrow-rotate-backward:before,.fa-arrow-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-arrow-left-long:before,.fa-long-arrow-left:before{content:"\f177"}.fa-bars:before,.fa-navicon:before{content:"\f0c9"}.fa-bars-progress:before,.fa-tasks-alt:before{content:"\f828"}.fa-bars-staggered:before,.fa-reorder:before,.fa-stream:before{content:"\f550"}.fa-briefcase-clock:before,.fa-business-time:before{content:"\f64a"}.fa-briefcase-medical:before{content:"\f469"}.fa-briefcase:before{content:"\f0b1"}.fa-calendar-check:before{content:"\f274"}.fa-camera-rotate:before{content:"\e0d8"}.fa-camera-retro:before{content:"\f083"}.fa-camera-alt:before,.fa-camera:before{content:"\f030"}.fa-champagne-glasses:before,.fa-glass-cheers:before{content:"\f79f"}.fa-cheese:before{content:"\f7ef"}.fa-chevron-down:before{content:"\f078"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-circle-question:before,.fa-question-circle:before{content:"\f059"}.fa-clock-four:before,.fa-clock:before{content:"\f017"}.fa-clock-rotate-left:before,.fa-history:before{content:"\f1da"}.fa-bell-concierge:before,.fa-concierge-bell:before{content:"\f562"}.fa-envelopes-bulk:before,.fa-mail-bulk:before{content:"\f674"}.fa-envelope-open:before{content:"\f2b6"}.fa-envelope-circle-check:before{content:"\e4e8"}.fa-envelope:before{content:"\f0e0"}.fa-envelope-open-text:before{content:"\f658"}.fa-envelope-square:before,.fa-square-envelope:before{content:"\f199"}.fa-leaf:before{content:"\f06c"}.fa-location-dot:before,.fa-map-marker-alt:before{content:"\f3c5"}.fa-magnifying-glass-location:before,.fa-search-location:before{content:"\f689"}.fa-magnifying-glass-arrow-right:before{content:"\e521"}.fa-magnifying-glass-chart:before{content:"\e522"}.fa-magnifying-glass:before,.fa-search:before{content:"\f002"}.fa-magnifying-glass-plus:before,.fa-search-plus:before{content:"\f00e"}.fa-magnifying-glass-minus:before,.fa-search-minus:before{content:"\f010"}.fa-magnifying-glass-dollar:before,.fa-search-dollar:before{content:"\f688"}.fa-glass-martini-alt:before,.fa-martini-glass:before{content:"\f57b"}.fa-glass-martini:before,.fa-martini-glass-empty:before{content:"\f000"}.fa-cocktail:before,.fa-martini-glass-citrus:before{content:"\f561"}.fa-paper-plane:before{content:"\f1d8"}.fa-percent:before,.fa-percentage:before{content:"\25"}.fa-quote-left-alt:before,.fa-quote-left:before{content:"\f10d"}.fa-exclamation-triangle:before,.fa-triangle-exclamation:before,.fa-warning:before{content:"\f071"}.fa-wine-glass:before{content:"\f4e3"}.fa-wine-glass-alt:before,.fa-wine-glass-empty:before{content:"\f5ce"}.fa-xmarks-lines:before{content:"\e59a"}.fa-close:before,.fa-multiply:before,.fa-remove:before,.fa-times:before,.fa-xmark:before{content:"\f00d"}.fa-square-xmark:before,.fa-times-square:before,.fa-xmark-square:before{content:"\f2d3"}.fa-circle-xmark:before,.fa-times-circle:before,.fa-xmark-circle:before{content:"\f057"}.fa-facebook-f:before{content:"\f39e"}.fa-facebook-messenger:before{content:"\f39f"}.fa-facebook-square:before,.fa-square-facebook:before{content:"\f082"}.fa-facebook:before{content:"\f09a"}.fa-google-plus-g:before{content:"\f0d5"}.fa-google-plus:before{content:"\f2b3"}.fa-google:before{content:"\f1a0"}.fa-google-scholar:before{content:"\e63b"}.fa-google-plus-square:before,.fa-square-google-plus:before{content:"\f0d4"}.fa-google-wallet:before{content:"\f1ee"}.fa-google-play:before{content:"\f3ab"}.fa-google-drive:before{content:"\f3aa"}.fa-google-pay:before{content:"\e079"}.fa-instagram-square:before,.fa-square-instagram:before{content:"\e055"}.fa-instagram:before{content:"\f16d"}.fa-sr-only,.fa-sr-only-focusable:not(:focus),.sr-only,.sr-only-focusable:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:host,:root{--fa-style-family-brands:"Font Awesome 6 Brands";--fa-font-brands:normal 400 1em/1 "Font Awesome 6 Brands"}@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:block;src:url(/assets/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(/assets/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-regular-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(/assets/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Brands";font-display:block;font-weight:400;src:url(/assets/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:900;src:url(/assets/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:400;src:url(/assets/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-regular-400.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/assets/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/assets/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/assets/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(/assets/fontawesome/webfonts/fa-regular-400.ttf) format("truetype");unicode-range:u+f003,u+f006,u+f014,u+f016-f017,u+f01a-f01b,u+f01d,u+f022,u+f03e,u+f044,u+f046,u+f05c-f05d,u+f06e,u+f070,u+f087-f088,u+f08a,u+f094,u+f096-f097,u+f09d,u+f0a0,u+f0a2,u+f0a4-f0a7,u+f0c5,u+f0c7,u+f0e5-f0e6,u+f0eb,u+f0f6-f0f8,u+f10c,u+f114-f115,u+f118-f11a,u+f11c-f11d,u+f133,u+f147,u+f14e,u+f150-f152,u+f185-f186,u+f18e,u+f190-f192,u+f196,u+f1c1-f1c9,u+f1d9,u+f1db,u+f1e3,u+f1ea,u+f1f7,u+f1f9,u+f20a,u+f247-f248,u+f24a,u+f24d,u+f255-f25b,u+f25d,u+f271-f274,u+f278,u+f27b,u+f28c,u+f28e,u+f29c,u+f2b5,u+f2b7,u+f2ba,u+f2bc,u+f2be,u+f2c0-f2c1,u+f2c3,u+f2d0,u+f2d2,u+f2d4,u+f2dc}