@font-face {
font-family: 'Fraunces';
font-style: italic;
font-weight: 500;
font-display: swap;
src: url(fonts/font-0.cae2725321.woff2) format('woff2');
}
@font-face {
font-family: 'Fraunces';
font-style: italic;
font-weight: 600;
font-display: swap;
src: url(fonts/font-1.7af280f047.woff2) format('woff2');
}
@font-face {
font-family: 'Fraunces';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(fonts/font-2.fd4d91c618.woff2) format('woff2');
}
@font-face {
font-family: 'Fraunces';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(fonts/font-3.575e3b6cf3.woff2) format('woff2');
}
@font-face {
font-family: 'Fraunces';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(fonts/font-4.cd38142b21.woff2) format('woff2');
}
@font-face {
font-family: 'Fraunces';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(fonts/font-5.b803147eab.woff2) format('woff2');
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(fonts/font-6.4f93136d0f.woff2) format('woff2');
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(fonts/font-7.2b348587a4.woff2) format('woff2');
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(fonts/font-8.8db248ba10.woff2) format('woff2');
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(fonts/font-9.08e9d965dc.woff2) format('woff2');
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(fonts/font-10.cfc58c8c17.woff2) format('woff2');
}
:root{
--bg: #0b0b0c;
--surface: #18140f;
--surface-2: #221d15;
--text: #f7f1e0;
--text-muted: #c7a55c;
--accent: #d4af37;
--accent-soft: #f0cf7c;
--ember: #a8481f;
--border: rgba(212,175,55,0.18);
--shadow: rgba(0,0,0,0.65);
}
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
html{ scroll-behavior: auto; }
*{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}
body{
margin: 0;
background: var(--bg);
color: var(--text);
font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
font-size: 16px;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
h1,h2,h3{
font-family: 'Fraunces', ui-serif, Georgia, serif;
font-weight: 600;
text-wrap: balance;
margin: 0;
color: var(--text);
}
a{ color: inherit; }
.container{
max-width: 1120px;
margin: 0 auto;
padding: 0 clamp(1.25rem, 4vw, 2.5rem);
}
.eyebrow{
font-family: 'Manrope', sans-serif;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--accent-soft);
display: inline-flex;
align-items: center;
gap: 0.6em;
}
.eyebrow::before{
content: "";
width: 1.6em;
height: 1px;
background: var(--accent);
display: inline-block;
}
header{
position: sticky;
top: 0;
z-index: 50;
background: rgba(11,11,12,0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--border);
}
.nav-row{
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
row-gap: 0.6rem;
padding: 1.05rem 0;
gap: 1rem 1.5rem;
}
.brand{
font-family: 'Fraunces', serif;
font-style: italic;
font-weight: 600;
font-size: 1.35rem;
letter-spacing: 0.01em;
text-decoration: none;
white-space: nowrap;
}
.brand span{ color: var(--accent-soft); }
.brand-logo{
display: flex;
align-items: center;
}
.brand-logo img{
height: 52px;
width: auto;
display: block;
}
.nav-right{
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: flex-end;
gap: 0.9rem 1.4rem;
flex: 1 1 auto;
min-width: 0;
}
.site-nav{
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 0.7rem 1.3rem;
}
.site-nav a{
text-decoration: none;
color: var(--text-muted);
font-size: 0.88rem;
font-weight: 600;
white-space: nowrap;
transition: color 0.2s ease;
}
.site-nav a:hover, .site-nav a:focus-visible{ color: var(--accent-soft); }
.nav-cta{
display: inline-flex;
align-items: center;
gap: 0.5rem;
border: 1px solid var(--accent);
text-decoration: none;
color: var(--accent-soft);
padding: 0.5rem 1rem;
border-radius: 999px;
font-size: 0.85rem;
font-weight: 700;
white-space: nowrap;
transition: background 0.2s ease;
}
.nav-cta:hover{ background: rgba(212,175,55,0.14); }
.hero{
position: relative;
overflow: hidden;
background:
linear-gradient(100deg, rgba(6,6,7,0.93) 0%, rgba(6,6,7,0.74) 32%, rgba(6,6,7,0.4) 60%, rgba(6,6,7,0.66) 100%),
url("hero_hintergrund.2e9d7ac532.webp") center 58% / cover no-repeat;
}
#ember-canvas{
position: absolute;
inset: 0;
width: 100%;
height: 100%;
opacity: 0.8;
pointer-events: none;
}
.hero-inner{
position: relative;
z-index: 2;
padding: clamp(3.5rem, 9vw, 6.5rem) 0 clamp(3rem, 7vw, 5rem);
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 1.4rem;
max-width: 720px;
}
.hero h1{
font-style: italic;
font-size: clamp(2.8rem, 7vw, 5.2rem);
line-height: 0.98;
letter-spacing: -0.01em;
}
.hero-tagline{
font-family: 'Fraunces', serif;
font-weight: 500;
font-style: normal;
font-size: clamp(1.15rem, 2.3vw, 1.5rem);
color: var(--accent-soft);
max-width: 30ch;
}
.hero-sub{
color: var(--text-muted);
max-width: 52ch;
font-size: 1.02rem;
}
.hero-actions{
display: flex;
flex-wrap: wrap;
gap: 0.9rem;
margin-top: 0.4rem;
}
.btn{
display: inline-flex;
align-items: center;
gap: 0.55rem;
padding: 0.85rem 1.5rem;
border-radius: 999px;
font-weight: 700;
font-size: 0.94rem;
text-decoration: none;
border: 1px solid transparent;
transition: transform 0.15s ease, background 0.2s ease, border-color 0.2s ease;
}
.btn:hover{ transform: translateY(-1px); }
.btn-primary{
background: linear-gradient(135deg, var(--accent-soft), var(--accent));
color: #17130a;
}
.btn-primary:hover{ filter: brightness(1.06); }
.btn-ghost{
border-color: var(--border);
color: var(--text) !important;
}
.btn-ghost:hover{ border-color: var(--accent); background: rgba(212,175,55,0.1); }
.content-section{ padding: clamp(3rem, 7vw, 4.5rem) 0 clamp(3.5rem, 8vw, 5.5rem); border-top: 1px solid var(--border); }
.section-head{
display: flex;
flex-direction: column;
gap: 0.9rem;
margin-bottom: clamp(2rem, 5vw, 3rem);
max-width: 62ch;
}
.section-head h2{ font-size: clamp(1.9rem, 4vw, 2.6rem); }
.section-head p{ color: var(--text-muted); font-size: 1.02rem; }
.about-grid{
display: grid;
grid-template-columns: 1.1fr 0.9fr;
gap: clamp(2rem, 5vw, 4rem);
align-items: center;
}
@media (max-width: 820px){ .about-grid{ grid-template-columns: 1fr; } }
.about-copy p{ margin: 0 0 1rem; color: var(--text-muted); max-width: 58ch; }
.about-copy p:last-child{ margin-bottom: 0; }
.about-copy strong{ color: var(--text); }
.quote-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 20px;
padding: clamp(1.6rem, 4vw, 2.4rem);
position: relative;
}
.quote-card svg{ width: 34px; height: 34px; color: var(--accent); margin-bottom: 1rem; }
.quote-card p{
font-family: 'Fraunces', serif;
font-size: 1.35rem;
font-style: italic;
color: var(--text);
margin: 0 0 1rem;
text-wrap: balance;
}
.quote-card span{ color: var(--text-muted); font-size: 0.9rem; }
.offer-grid{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 1.4rem;
}
.offer-grid.offer-grid--single{ grid-template-columns: minmax(260px, 420px); }
.offer-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 18px;
padding: 1.8rem;
display: flex;
flex-direction: column;
gap: 0.9rem;
}
.offer-card .tag{
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--bg);
background: var(--accent-soft);
padding: 0.3rem 0.7rem;
border-radius: 999px;
width: fit-content;
}
.offer-card.dark .tag{ background: var(--ember); color: #fbe9e2; }
.offer-card.soon .tag{ background: var(--surface-2); color: var(--text-muted); border: 1px solid var(--border); }
.offer-card h3{ font-size: 1.35rem; }
.offer-card p{ color: var(--text-muted); margin: 0; font-size: 0.96rem; }
.menu-groups{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: clamp(2rem, 5vw, 3.5rem);
margin-bottom: clamp(1.8rem, 4vw, 2.4rem);
}
.menu-group h3{
font-family: 'Manrope', sans-serif;
font-size: 0.8rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--accent-soft);
margin-bottom: 0.9rem;
padding-bottom: 0.7rem;
border-bottom: 1px solid var(--border);
}
.menu-list{ list-style: none; margin: 0; padding: 0; }
.menu-list li{
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 1.2rem;
padding: 0.85rem 0;
border-bottom: 1px dashed var(--border);
}
.menu-list li:last-child{ border-bottom: none; }
.menu-item-name{
font-family: 'Fraunces', serif;
font-weight: 600;
font-size: 1.05rem;
color: var(--text);
}
.menu-item-desc{
display: block;
margin-top: 0.2rem;
font-family: 'Manrope', sans-serif;
font-weight: 400;
font-size: 0.85rem;
color: var(--text-muted);
}
.menu-item-price{
font-variant-numeric: tabular-nums;
font-weight: 700;
font-size: 1rem;
color: var(--accent-soft);
white-space: nowrap;
}
.menu-note{
display: inline-block;
font-size: 0.86rem;
color: var(--text-muted);
border: 1px dashed var(--border);
border-radius: 10px;
padding: 0.65rem 1rem;
margin-bottom: clamp(1.8rem, 4vw, 2.4rem);
}
.darkblend-card{
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 1.2rem;
background: linear-gradient(135deg, var(--surface-2), var(--surface));
border: 1px solid var(--ember);
border-radius: 18px;
padding: 1.7rem 2rem;
}
.darkblend-card .tag{
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #fbe9e2;
background: var(--ember);
padding: 0.3rem 0.7rem;
border-radius: 999px;
width: fit-content;
margin-bottom: 0.7rem;
}
.darkblend-card h3{ font-size: 1.25rem; margin-bottom: 0.4rem; }
.darkblend-card p{ color: var(--text-muted); margin: 0; font-size: 0.92rem; max-width: 46ch; }
.darkblend-price{
font-family: 'Fraunces', serif;
font-weight: 600;
font-size: 2rem;
color: var(--accent-soft);
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.menu-block{ margin-bottom: clamp(2.4rem, 5vw, 3.4rem); }
.menu-block:last-child{ margin-bottom: 0; }
.menu-ornate-head{
position: relative;
text-align: center;
max-width: 640px;
margin: 0 auto clamp(2.6rem, 6vw, 3.6rem);
padding: clamp(1.8rem, 4vw, 2.4rem) clamp(1.2rem, 4vw, 2rem);
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
}
.menu-ornate-head .eyebrow{ justify-content: center; margin: 0 auto; }
.ornate-corner{
position: absolute;
top: 9px;
width: 9px;
height: 9px;
background: var(--accent);
transform: rotate(45deg);
}
.ornate-corner-tl{ left: 9px; }
.ornate-corner-tr{ right: 9px; }
.ornate-corner-bl{ left: 9px; bottom: 9px; top: auto; }
.ornate-corner-br{ right: 9px; bottom: 9px; top: auto; }
.ornate-title{
font-family: 'Fraunces', serif;
font-style: italic;
font-weight: 600;
font-size: clamp(2.6rem, 7vw, 4.2rem);
color: var(--text);
margin: 0.5rem 0 1.1rem;
line-height: 1;
}
.ornate-divider{
display: flex;
align-items: center;
justify-content: center;
gap: 0.9rem;
margin: 0 auto 1.1rem;
max-width: 300px;
}
.ornate-divider span{ flex: 1 1 auto; height: 1px; background: var(--border); }
.ornate-divider svg{ width: 20px; height: 20px; color: var(--accent); flex-shrink: 0; }
.menu-ornate-head p{ color: var(--text-muted); margin: 0 auto; max-width: 48ch; }
.menu-brandmark{
display: flex;
align-items: center;
justify-content: center;
gap: 1.1rem;
margin-top: clamp(2.6rem, 6vw, 3.6rem);
}
.menu-brandmark-line{ flex: 1 1 auto; max-width: 130px; height: 1px; background: var(--border); }
.menu-brandmark-text{
font-family: 'Fraunces', serif;
font-style: italic;
font-weight: 600;
font-size: 1.05rem;
letter-spacing: 0.03em;
color: var(--accent-soft);
white-space: nowrap;
}
.subhead{
font-family: 'Fraunces', serif;
font-size: 1.3rem;
margin-bottom: 1.1rem;
}
.subhead-row{
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1.1rem;
}
.subhead-row .subhead{ margin-bottom: 0; }
.subnote{ color: var(--text-muted); font-size: 0.9rem; margin: 0 0 1.1rem; }
.feature-grid{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1.4rem;
}
.feature-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 18px;
padding: 1.6rem;
display: flex;
flex-direction: column;
gap: 0.7rem;
transition: border-color 0.2s ease, transform 0.2s ease;
}
.feature-card:hover{ border-color: var(--accent); transform: translateY(-3px); }
.feature-icon{
width: 46px; height: 46px;
border-radius: 12px;
background: rgba(212,175,55,0.16);
display: flex; align-items: center; justify-content: center;
color: var(--accent-soft);
}
.feature-icon svg{ width: 24px; height: 24px; }
.feature-icon.photo{
width: 54px;
height: 54px;
background: rgba(212,175,55,0.12);
overflow: hidden;
}
.feature-icon.photo img{
width: 100%;
height: 100%;
object-fit: contain;
}
.feature-top{ display: flex; align-items: flex-start; justify-content: space-between; gap: 0.8rem; }
.feature-card h3{ font-size: 1.08rem; }
.feature-desc{ color: var(--text-muted); font-size: 0.88rem; margin: 0; }
.feature-price{
font-variant-numeric: tabular-nums;
font-weight: 700;
color: var(--accent-soft);
font-size: 0.98rem;
text-align: right;
flex: 1 1 auto;
min-width: 0;
}
.visual-grid{
display: grid;
grid-template-columns: 1.15fr 0.85fr;
gap: clamp(2rem, 5vw, 3.5rem);
align-items: center;
margin-bottom: clamp(2.4rem, 5vw, 3.4rem);
}
@media (max-width: 820px){ .visual-grid{ grid-template-columns: 1fr; } }
.visual-grid .section-head{ margin-bottom: 0; }
.visual-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 22px;
padding: clamp(1.6rem, 4vw, 2.2rem);
display: flex;
align-items: center;
justify-content: center;
min-height: 200px;
}
.visual-card svg{
width: 100%;
max-width: 170px;
height: auto;
color: var(--accent-soft);
}
.visual-card.photo{
padding: 0;
overflow: hidden;
min-height: 0;
}
.visual-card.photo img{
display: block;
width: 100%;
height: 100%;
aspect-ratio: 5 / 4;
object-fit: cover;
border-radius: 22px;
}
.visual-card.photo.compact{
max-width: 320px;
margin: 0 auto;
}
.chip-row{ display: flex; flex-wrap: wrap; gap: 0.6rem; }
.chip{
font-size: 0.85rem;
color: var(--text-muted);
background: var(--surface);
border: 1px solid var(--border);
border-radius: 999px;
padding: 0.4rem 0.9rem;
}
.heiss-block{
display: grid;
grid-template-columns: 280px 1fr;
gap: clamp(1.8rem, 4vw, 3rem);
align-items: center;
}
.heiss-photos{
position: relative;
height: 460px;
}
.heiss-photo{
position: absolute;
object-fit: cover;
border-radius: 18px;
border: 1px solid var(--border);
box-shadow: 0 16px 34px rgba(0,0,0,0.5);
}
.heiss-photo.coffee{
top: 30px;
left: 50%;
transform: translateX(-50%);
width: 165px;
height: 165px;
z-index: 2;
}
.heiss-photo.tea{
bottom: 0;
left: 0;
width: 195px;
height: 230px;
z-index: 1;
}
@media (max-width: 720px){
.heiss-block{ grid-template-columns: 1fr; }
.heiss-photos{
width: 100%;
max-width: 320px;
height: 400px;
margin: 0 auto 1.6rem;
}
.heiss-photo.coffee{ width: 140px; height: 140px; }
.heiss-photo.tea{ width: 170px; height: 200px; }
}
.drinks-photo-block{
position: relative;
overflow: hidden;
border-radius: 22px;
padding: clamp(1.8rem, 4vw, 2.6rem) clamp(1.6rem, 4vw, 2.4rem);
background:
linear-gradient(100deg, rgba(6,6,7,0.9) 0%, rgba(6,6,7,0.6) 38%, rgba(6,6,7,0.28) 65%, rgba(6,6,7,0.5) 100%),
url("cocktail_hintergrund_drinks.03274ce58e.webp") right center / auto 108% no-repeat;
}
.drinks-photo-block .menu-block{ margin-bottom: clamp(2.4rem, 5vw, 3.4rem); }
.drinks-photo-block .menu-block:last-child{ margin-bottom: 0; }
.drinks-photo-block .menu-item-name,
.drinks-photo-block .menu-item-price,
.drinks-photo-block .subhead{ text-shadow: 0 2px 10px rgba(0,0,0,0.75); }
.flaschen-photo-block{
position: relative;
overflow: hidden;
border-radius: 22px;
padding: clamp(1.8rem, 4vw, 2.6rem) clamp(1.6rem, 4vw, 2.4rem);
background:
linear-gradient(160deg, rgba(6,6,7,0.9) 0%, rgba(6,6,7,0.84) 50%, rgba(6,6,7,0.92) 100%),
url("flaschen_hintergrund.9365397265.webp") center / cover no-repeat;
}
.flaschen-photo-block .menu-item-name,
.flaschen-photo-block .menu-item-price,
.flaschen-photo-block .subhead,
.flaschen-photo-block .subnote{ text-shadow: 0 2px 10px rgba(0,0,0,0.7); }
.event-grid{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1.4rem;
}
.event-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 18px;
padding: 1.7rem;
display: flex;
flex-direction: column;
gap: 0.9rem;
transition: border-color 0.2s ease, transform 0.2s ease;
}
.event-card:hover{ border-color: var(--accent); transform: translateY(-3px); }
.event-icon{
width: 44px; height: 44px;
border-radius: 12px;
background: rgba(212,175,55,0.16);
display: flex; align-items: center; justify-content: center;
color: var(--accent-soft);
}
.event-icon svg{ width: 22px; height: 22px; }
.event-card h3{ font-size: 1.15rem; }
.event-card p{ color: var(--text-muted); margin: 0; font-size: 0.94rem; }
.event-card.clickable{ cursor: pointer; position: relative; overflow: hidden; }
.event-card.clickable:hover{ border-color: var(--accent); }
.event-card-hint{
margin-top: 0.2rem;
font-size: 0.78rem;
font-weight: 700;
letter-spacing: 0.03em;
color: var(--accent-soft);
}
.event-card-photo-reveal{
position: absolute;
inset: 0;
border-radius: 18px;
overflow: hidden;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease;
z-index: 5;
}
.event-card-photo-reveal::after{
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(5,4,3,0) 55%, rgba(5,4,3,0.75) 100%);
}
.event-card-photo-reveal img{
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.event-card.clickable:hover .event-card-photo-reveal,
.event-card.clickable.show .event-card-photo-reveal{
opacity: 1;
pointer-events: auto;
}
.hours-wrap{
display: grid;
grid-template-columns: 1fr 1fr;
gap: clamp(1.5rem, 4vw, 3rem);
align-items: start;
}
@media (max-width: 760px){ .hours-wrap{ grid-template-columns: 1fr; } }
table.hours{
width: 100%;
border-collapse: collapse;
font-variant-numeric: tabular-nums;
}
table.hours td{
padding: 1.05rem 0;
border-top: 1px solid var(--border);
font-size: 1.02rem;
}
table.hours tr:first-child td{ border-top: none; }
table.hours td:first-child{ color: var(--text-muted); font-weight: 600; }
table.hours td:last-child{ text-align: right; color: var(--accent-soft); font-weight: 700; }
.hours-note{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 18px;
padding: 1.6rem 1.8rem;
}
.hours-note h3{ font-size: 1.1rem; margin-bottom: 0.6rem; }
.hours-note p{ color: var(--text-muted); margin: 0; font-size: 0.95rem; }
.contact-grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.4rem;
}
@media (max-width: 760px){ .contact-grid{ grid-template-columns: 1fr; } }
.contact-card{
background: var(--surface);
border: 1px solid var(--border);
border-radius: 18px;
padding: 1.8rem;
display: flex;
flex-direction: column;
gap: 0.8rem;
}
.contact-card h3{
font-size: 0.78rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--accent-soft);
font-family: 'Manrope', sans-serif;
font-weight: 800;
}
.contact-card .big{ font-size: 1.15rem; font-weight: 700; }
.contact-card p{ margin: 0; color: var(--text-muted); }
.contact-card a.inline-link{
color: var(--accent-soft);
text-decoration: none;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 0.4rem;
}
.contact-card a.inline-link:hover{ text-decoration: underline; }
.pending{
font-size: 0.85rem;
color: var(--text-muted);
border: 1px dashed var(--border);
border-radius: 10px;
padding: 0.55rem 0.8rem;
width: fit-content;
}
.legal-prose{
max-width: 68ch;
display: flex;
flex-direction: column;
gap: 1.8rem;
margin-top: clamp(2rem, 5vw, 3rem);
}
.legal-prose h3{
font-family: 'Manrope', sans-serif;
font-size: 0.85rem;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--accent-soft);
margin-bottom: 0.6rem;
}
.legal-prose p{ margin: 0 0 0.6rem; color: var(--text-muted); font-size: 0.96rem; }
.legal-prose p:last-child{ margin-bottom: 0; }
.legal-prose a{ color: var(--accent-soft); text-decoration: underline; }
footer{
border-top: 1px solid var(--border);
padding: 2.2rem 0;
}
.footer-row{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
gap: 1rem;
color: var(--text-muted);
font-size: 0.88rem;
}
.footer-row .brand{ font-size: 1.05rem; }
.footer-links{ display: flex; gap: 1.2rem; }
.footer-links a{ color: var(--text-muted); text-decoration: none; }
.footer-links a:hover{ color: var(--accent-soft); }
:focus-visible{ outline: 2px solid var(--accent-soft); outline-offset: 2px; }
[hidden]{display:none !important}
button{font:inherit;cursor:pointer}
img{max-width:100%}
section[id],main[id]{scroll-margin-top:var(--header-height,130px)}
.menu-groups{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.feature-grid,.event-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.footer-links{flex-wrap:wrap;align-items:center}
.footer-button{border:0;padding:0;background:none;color:var(--text-muted);font-size:inherit;text-align:left}
.footer-button:hover{color:var(--accent-soft)}
.highlights .section-head{margin-bottom:1.6rem}
.highlight-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.highlight-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;overflow:hidden}
.highlight-card>img{display:block;width:100%;height:155px;object-fit:cover}
.highlight-copy{padding:1.3rem 1.4rem}
.highlight-copy .eyebrow{font-size:.65rem;letter-spacing:.12em}
.highlight-title{display:flex;justify-content:space-between;gap:.8rem;align-items:baseline;margin:.5rem 0}
.highlight-title h3{font-size:1.15rem}
.highlight-title .menu-item-price{font-size:.9rem}
.highlight-copy p{margin:0;color:var(--text-muted);font-size:.86rem}
.highlights-action{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;margin-top:1.7rem}
.highlights-action p{margin:0;color:var(--text-muted);font-size:.9rem}
.subpage-intro{padding:clamp(2.5rem,6vw,4.5rem) 0 2.5rem;background:linear-gradient(130deg,var(--surface),var(--bg));border-bottom:1px solid var(--border)}
.subpage-intro h1{font-size:clamp(2.5rem,6vw,4rem);font-style:italic;line-height:1.12;margin:.8rem 0 1rem;overflow-wrap:anywhere}
.subpage-intro p{max-width:58ch;color:var(--text-muted)}
.back-link{display:inline-block;color:var(--accent-soft);font-size:.85rem;text-decoration:none;margin-bottom:1.7rem}
.back-link:hover{text-decoration:underline}
.menu-jump{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem}
.menu-jump a{text-decoration:none;color:var(--accent-soft);border-color:var(--border)}
.menu-jump a:hover{border-color:var(--accent)}
.site-nav a[aria-current=page]{color:var(--accent-soft)}
.legal-page .legal-prose{max-width:78ch;margin-top:0}
.legal-page .contact-grid+.legal-prose{margin-top:2.5rem}
.legal-page .legal-prose h2{font-family:'Manrope',sans-serif;font-size:1rem;color:var(--accent-soft);margin-bottom:.6rem}
.legal-page{overflow-wrap:anywhere}
.legal-page .pending{display:block;margin-top:.6rem}
.cookie-panel{position:fixed;z-index:100;bottom:1.2rem;right:1.2rem;width:min(480px,calc(100% - 2.4rem));background:rgba(24,20,15,.98);border:1px solid rgba(212,175,55,.42);border-radius:18px;padding:1.4rem;box-shadow:0 18px 65px rgba(0,0,0,.6);max-height:calc(100dvh - 2.4rem);overflow:auto}
.cookie-panel h2{font-size:1.4rem;margin:.4rem 0 .7rem}
.cookie-panel p{font-size:.85rem;color:var(--text-muted);margin:.6rem 0}
.cookie-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin:1rem 0}
.cookie-actions .btn{justify-content:center;padding:.65rem 1rem;font-size:.83rem;flex:1}
.cookie-links{display:flex;flex-wrap:wrap;gap:1rem;font-size:.78rem;color:var(--text-muted)}
.cookie-details{padding-top:.6rem;border-top:1px solid var(--border);margin-top:1rem}
.cookie-details .footer-button{text-decoration:underline;font-size:.8rem;color:var(--accent-soft)}
@media(max-width:720px){
.container.nav-row{padding: .8rem 1.25rem;gap:.7rem}
.brand-logo img{height:44px}
.nav-right{gap:.7rem;justify-content:flex-start}
.site-nav{justify-content:flex-start;gap:.45rem .85rem}
.site-nav a{font-size:.78rem}
.nav-cta{font-size:.75rem;padding:.35rem .7rem}
.hero-inner{padding-left:1.25rem;padding-right:1.25rem}
.highlight-grid{grid-template-columns:1fr;gap:.9rem}
.highlight-card{display:grid;grid-template-columns:105px minmax(0,1fr);align-items:stretch}
.highlight-card>img{height:100%;min-height:145px}
.highlight-copy{padding:1rem}
.highlight-title{flex-wrap:wrap;gap:.15rem .6rem}
.highlights-action{align-items:stretch;flex-direction:column}
.highlights-action .btn{justify-content:center}
.menu-list li{gap:.7rem}
.menu-item-name{font-size:1rem}
.drinks-photo-block,.flaschen-photo-block{padding:1.2rem}
.subhead-row{flex-wrap:wrap;gap:.5rem}
.cookie-panel{bottom:.75rem;right:.75rem;width:calc(100% - 1.5rem);padding:1.1rem}
table.hours td{font-size:.9rem}
.contact-card{padding:1.3rem}
}
@media(prefers-reduced-motion:reduce){.btn:hover,.feature-card:hover,.event-card:hover{transform:none}}
:root{--text-muted:#d0b987;--border:rgba(212,175,55,.25)}
body{line-height:1.7}
p{max-width:70ch}
button,input{font-family:inherit}
.site-nav a,.nav-cta,.chip{font-size:.9rem}
.section-head p{margin:.1rem 0 0}
.about-copy p{line-height:1.8}
.btn,.nav-cta{min-height:44px;justify-content:center}
.brand-logo img{width:auto;height:52px;object-fit:contain;max-width:none}
.container.nav-row{padding-left:clamp(1.25rem,4vw,2.5rem);padding-right:clamp(1.25rem,4vw,2.5rem)}
.nav-toggle{display:none;align-items:center;gap:.6rem;background:var(--surface);border:1px solid var(--border);color:var(--accent-soft);border-radius:999px;min-height:44px;padding:.4rem 1rem}
.nav-toggle span{font-family:system-ui,sans-serif}
.skip-link{position:fixed;left:1rem;top:-8rem;z-index:200;background:var(--accent-soft);color:var(--bg);padding:.65rem 1rem;border-radius:8px;font-weight:700}
.skip-link:focus{top:1rem}
.hero-inner{padding-left:clamp(1.25rem,4vw,2.5rem);padding-right:clamp(1.25rem,4vw,2.5rem)}
.hero h1{line-height:1.08}
.hero-sub{font-size:1.05rem;color:#e2d6bc}
.hero-tagline{margin:.2rem 0}
.feature-desc,.menu-item-desc{font-size:.94rem;line-height:1.65}
.menu-item-name{font-size:1.08rem;line-height:1.5}
.menu-item-price{font-size:1.02rem;flex-shrink:0}
.menu-list li{padding:1rem 0}
.menu-note{line-height:1.7}
.menu-groups>*,.visual-grid>*,.about-grid>*,.heiss-block>*,.contact-grid>*{min-width:0}
.feature-card .feature-price{font-size:1rem}
.menu-block,.flaschen-photo-block,.drinks-photo-block{margin-bottom:2.2rem}
.legal-prose p{color:#ded2bb;line-height:1.8;font-size:1rem}
.legal-prose h2{scroll-margin-top:calc(var(--header-height,100px) + 20px)}
.legal-prose code{overflow-wrap:anywhere}
.legal-prose .footer-button{text-decoration:underline;min-height:44px}
.footer-links a,.footer-links button{display:inline-flex;align-items:center;min-height:44px}
.footer-links{gap:.4rem 1.2rem}
.highlight-copy p{font-size:.93rem}
.highlight-card>img{height:155px}
.text-link{display:inline-flex;min-height:44px;align-items:center;gap:.4rem;color:var(--accent-soft);font-size:.9rem;text-underline-offset:4px;margin-top:.8rem}
table.hours th{font-weight:600;color:var(--text-muted);text-align:left;font-size:1.02rem;border-top:1px solid var(--border);padding:1.05rem 1rem 1.05rem 0}
table.hours tr:first-child th{border-top:0}
table.hours td:last-child{white-space:nowrap}
.hours-note p{line-height:1.7}
.event-photo-button{border:1px solid var(--border);background:var(--bg);color:var(--accent-soft);border-radius:999px;padding:.5rem .85rem;min-height:44px;align-self:flex-start;margin-top:auto;position:relative;z-index:6}
.event-card.clickable{cursor:default}
.event-card.clickable:hover .event-card-photo-reveal{opacity:0;pointer-events:none}
.event-card.clickable.show .event-card-photo-reveal{opacity:1;pointer-events:auto}
.event-card-photo-reveal img{object-fit:contain;background:var(--bg)}
.menu-tools{background:rgba(11,11,12,.97);border-bottom:1px solid var(--border);padding:1.1rem 0;position:sticky;top:calc(var(--header-height,100px) - 18px);z-index:40;backdrop-filter:blur(10px)}
.menu-tools-row{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.menu-filters{display:flex;flex-wrap:wrap;gap:.5rem}
.menu-filters button{min-height:44px;cursor:pointer;color:var(--accent-soft)}
.menu-filters button[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent-soft);color:var(--bg);font-weight:800}
.menu-search{flex:0 1 345px;min-width:0}
.menu-search label{display:block;font-size:.78rem;color:var(--text-muted);margin-bottom:.3rem}
.menu-search-field{display:flex;align-items:center;position:relative}
.menu-search input{width:100%;min-height:44px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:.65rem 2.8rem .65rem .9rem;font-size:1rem}
.menu-search input::placeholder{color:#bfae90;font-size:.86rem;opacity:1}
.menu-search input::-webkit-search-cancel-button{display:none}
#menu-clear{position:absolute;right:0;top:0;height:100%;width:44px;border:0;background:none;color:var(--accent-soft);font-size:1.4rem}
#menu-results{font-size:.8rem;color:var(--text-muted);margin:.5rem 0 0;line-height:1.5}
#menu-empty{margin:1rem 0;color:var(--text)}
.js-menu .menu-jump{display:none}
.drink-jump{display:flex;flex-wrap:wrap;gap:.55rem;margin:-.5rem 0 2rem}
.drink-jump a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none;color:var(--accent-soft)}
.drink-jump a:hover{border-color:var(--accent)}
[data-menu-section],.subhead[id]{scroll-margin-top:calc(var(--header-height,100px) + var(--menu-tools-height,130px) + 15px)}
.menu-is-searching .visual-grid{grid-template-columns:1fr;margin-bottom:1.6rem}
.menu-is-searching .visual-card,.menu-is-searching .heiss-photos,.menu-is-searching .menu-brandmark,.menu-is-searching .drink-jump{display:none}
.menu-is-searching .heiss-block{grid-template-columns:1fr}
.cookie-panel p{font-size:.9rem;line-height:1.65}
.cookie-links a{min-height:36px;display:inline-flex;align-items:center}
.cookie-details .footer-button{min-height:44px}
@media(max-width:820px){
.menu-search{flex:1 1 100%}
}
@media(max-width:760px){
.container.nav-row{gap:.5rem;padding:.65rem 1.25rem}
.js .nav-toggle{display:inline-flex;margin-left:auto}
.js .nav-right{display:none;flex-basis:100%;padding:.5rem 0}
.js .nav-toggle[aria-expanded=true]+.nav-right{display:flex}
.site-nav{width:100%;gap:.2rem .6rem;justify-content:flex-start}
.site-nav a{padding:.45rem .25rem;min-height:44px;display:inline-flex;align-items:center;font-size:.9rem}
.brand-logo img{height:48px}
.nav-cta{padding:.4rem .8rem;font-size:.85rem}
.hero-inner{padding-left:1.25rem;padding-right:1.25rem}
.highlight-card>img{height:100%}
.highlights .section-head{margin-bottom:1.35rem}
.highlight-copy .eyebrow{font-size:.68rem}
.highlight-title .menu-item-price{font-size:.95rem}
.highlight-copy p{font-size:.9rem}
.menu-tools{padding:.8rem 0}
.menu-tools-row{gap:.65rem}
.menu-filters{width:100%;gap:.4rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.menu-filters .chip{padding:.45rem .3rem;font-size:.84rem;text-align:center}
.menu-search{flex-basis:100%}
.subpage-intro{padding-top:2rem;padding-bottom:1.8rem}
.back-link{margin-bottom:1rem;min-height:36px}
.content-section{padding-top:2.5rem;padding-bottom:2.8rem}
.menu-ornate-head{margin-bottom:1.8rem}
.visual-card.photo:not(.compact) img{aspect-ratio:16/9;height:auto;max-height:260px}
.visual-card.photo.compact{max-width:240px}
.heiss-photos{height:180px;max-width:330px;margin:0 auto}
.heiss-photo.coffee{top:0;left:0;transform:none;width:135px;height:135px}
.heiss-photo.tea{right:0;left:auto;bottom:0;width:150px;height:155px}
.heiss-block{gap:1.4rem}
.feature-card{padding:1.25rem}
.menu-list li{gap:.7rem;align-items:flex-start}
.menu-item-name{font-size:1.04rem}
.menu-item-desc{font-size:.92rem}
.drinks-photo-block{background-size:cover;background-position:center}
.flaschen-photo-block,.drinks-photo-block{padding:1.2rem}
.cookie-actions .btn{flex:1 1 auto}
table.hours th,table.hours td{font-size:.91rem}
}

/* Reservierung */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.reservation-section{position:relative;overflow:hidden;background:linear-gradient(145deg,#121213,#1e1913)}
.reservation-section:before{content:"";position:absolute;inset:-25%;background:radial-gradient(circle at 80% 35%,rgba(215,183,103,.16),transparent 32%);pointer-events:none}
.reservation-layout{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.reservation-copy{position:sticky;top:calc(var(--header-height,90px) + 2rem)}
.reservation-copy h2{font-size:clamp(2.3rem,5vw,4.8rem);line-height:1;margin:.6rem 0 1.2rem}
.reservation-copy>p{color:var(--text-muted);font-size:1.04rem;line-height:1.75;max-width:38rem}
.reservation-steps{display:grid;gap:1rem;margin:2rem 0 0;padding:0;list-style:none;counter-reset:steps}
.reservation-steps li{display:grid;grid-template-columns:2.3rem 1fr;gap:.8rem;align-items:start;color:var(--text-muted);line-height:1.45}
.reservation-steps li:before{counter-increment:steps;content:counter(steps);display:grid;place-items:center;width:2.2rem;height:2.2rem;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font-size:.75rem;font-weight:800}
.reservation-form{display:grid;gap:1.2rem;padding:clamp(1.25rem,4vw,2.4rem);border:1px solid rgba(215,183,103,.3);border-radius:22px;background:rgba(10,10,11,.82);box-shadow:0 30px 80px rgba(0,0,0,.32)}
.reservation-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.reservation-form label{display:grid;gap:.45rem;color:#ded8ce;font-size:.86rem;font-weight:650}
.reservation-form input,.reservation-form select,.reservation-form textarea{width:100%;min-height:50px;border:1px solid #4c4437;border-radius:9px;background:#111112;color:var(--text);padding:.78rem .85rem;font:inherit;outline:none}
.reservation-form textarea{min-height:105px;resize:vertical}
.reservation-form input:focus,.reservation-form select:focus,.reservation-form textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(215,183,103,.14)}
.reservation-form .check-label{display:grid;grid-template-columns:1.2rem 1fr;gap:.7rem;align-items:start;font-weight:400;color:var(--text-muted);line-height:1.5}
.reservation-form .check-label input{width:1.1rem;min-height:0;height:1.1rem;margin:.16rem 0 0;accent-color:var(--accent)}
.reservation-form .check-label a{color:var(--accent-soft)}
.reservation-submit{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.reservation-submit .btn{border:0;cursor:pointer}
.reservation-note{font-size:.78rem;color:var(--text-muted);line-height:1.45;flex:1}
.form-status{padding:.9rem 1rem;border-radius:9px;background:#173b24;border:1px solid #347149;line-height:1.5}
.form-status.error{background:#4d2020;border-color:#985147}
.honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.result-page{min-height:100vh;display:grid;place-items:center;padding:2rem;background:radial-gradient(circle at top,#2b2115,var(--bg) 55%)}
.result-card{max-width:680px;padding:clamp(2rem,6vw,4rem);border:1px solid #4c4437;border-radius:24px;background:#151516;text-align:center}
.result-card h1{font-size:clamp(2.5rem,8vw,5rem);margin:.4rem 0 1rem}.result-card p{color:var(--text-muted);line-height:1.7}.result-card .btn{margin-top:1rem}
@media(max-width:850px){.reservation-layout{grid-template-columns:1fr}.reservation-copy{position:static}.reservation-form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.reservation-form-grid{grid-template-columns:1fr}.reservation-form{border-radius:15px}.reservation-submit{align-items:stretch;flex-direction:column}.reservation-submit .btn{width:100%}}

@media(prefers-reduced-motion:reduce){#ember-canvas{display:none}}
@media print{
header,footer,.cookie-panel,.menu-tools,.back-link,.menu-jump,.drink-jump,.skip-link,#ember-canvas{display:none!important}
[data-menu-section],[data-menu-entry],[data-menu-group]{display:block!important}
body{background:white;color:#111;font-size:11pt}
h1,h2,h3,.menu-item-price,.feature-price,.menu-item-name,.subhead,.eyebrow{color:#111}
p,.menu-item-desc,.feature-desc,.menu-note,.subnote{color:#333!important}
.content-section,.subpage-intro,.feature-card,.darkblend-card,.drinks-photo-block,.flaschen-photo-block{background:white!important;color:#111;box-shadow:none}
.feature-card,.menu-list li{break-inside:avoid}
.content-section{padding:1rem 0}
.visual-card,.heiss-photos{display:none}
.visual-grid,.heiss-block{display:block}
.container{max-width:none;padding:0}
}
@media(max-width:720px){.hero{background-image:linear-gradient(100deg,rgba(6,6,7,.93) 0%,rgba(6,6,7,.74) 32%,rgba(6,6,7,.4) 60%,rgba(6,6,7,.66) 100%),url("hero-mobile.56e8e7abc9.webp")}}
@media(max-width:720px){
.highlight-card{position:relative;display:block;padding-left:105px}
.highlight-card>img{position:absolute;left:0;top:0;width:105px;height:100%;min-height:0}
.highlight-copy{min-height:150px}
}
.btn-ghost{background:transparent}
/* Homepage refresh: the original black-and-gold identity. */
.about-story{background:radial-gradient(ellipse at 88% 40%,rgba(164,111,35,.075),transparent 50%)}
.about-story-grid{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:clamp(2rem,5vw,4.5rem)}
.about-story-copy h2{font-size:clamp(2.6rem,4.8vw,4rem);line-height:1.12;margin:1rem 0 1.4rem}
.about-story-copy h2 em,.visit-section h2 em{font-weight:500;color:var(--accent-soft)}
.about-story-copy p{font-size:1rem;color:var(--text-muted);margin:0 0 1rem;line-height:1.85}
.about-story-copy .about-lead{color:var(--text);font-family:'Fraunces',serif;font-size:1.3rem;line-height:1.55;max-width:30ch;margin-bottom:1.2rem}
.about-story-copy .text-link{margin-top:0}
.about-story-photo{margin:0;position:relative;height:460px;border-radius:24px;overflow:hidden;border:1px solid var(--border);background:var(--surface)}
.about-story-photo>img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 61%}
.about-story-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,.04) 20%,rgba(11,11,12,.05) 42%,rgba(11,11,12,.95) 100%);pointer-events:none}
.about-photo-badge{position:absolute;top:1.25rem;right:1.25rem;z-index:1;border:1px solid rgba(240,207,124,.5);border-radius:16px;background:rgba(11,11,12,.82);padding:.7rem 1rem;color:var(--accent-soft);font-family:'Fraunces',serif;font-style:italic;font-size:1.05rem;text-align:center}
.about-photo-badge span{display:block;font-family:'Manrope',sans-serif;font-style:normal;font-size:.61rem;text-transform:uppercase;letter-spacing:.2em;margin-top:.2rem}
.about-story-photo figcaption{position:absolute;bottom:0;left:0;right:0;padding:1.8rem;z-index:1}
.about-story-photo blockquote{margin:.7rem 0 0;font-family:'Fraunces',serif;font-style:italic;font-size:clamp(1.3rem,2.3vw,1.7rem);line-height:1.4;color:var(--text);max-width:25ch}
.about-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:2.8rem;padding-top:1.8rem;border-top:1px solid var(--border);gap:1.8rem}
.about-values>div{display:flex;align-items:flex-start;gap:1rem}
.value-number{font-family:'Fraunces',serif;color:var(--accent);font-size:1.35rem;font-style:italic;line-height:1.5}
.about-values h3{font-size:1.1rem;margin:.15rem 0 .5rem}
.about-values p{font-size:.89rem;color:var(--text-muted);line-height:1.7;margin:0}
.highlight-grid{row-gap:1.4rem}
.highlight-card--illustrated>img{object-fit:contain;padding:1.8rem;background:radial-gradient(ellipse at center,rgba(212,175,55,.12),transparent 70%)}
.highlight-title{flex-wrap:wrap;gap:.35rem .65rem}
.highlight-title h3{font-size:1.12rem}
/* Touch keeps an explicit photo control. Mouse and keyboard reveal on hover/focus. */
.event-hover-hint{display:none;color:var(--accent-soft);font-size:.79rem;font-weight:600;margin-top:auto}
.event-card.clickable{outline-offset:4px}
.event-card-photo-reveal{pointer-events:none!important}
.event-card-photo-reveal img{object-fit:cover}
@media(hover:hover) and (pointer:fine) and (min-width:761px){
 .event-photo-button{display:none}
 .event-hover-hint{display:block}
 .event-card.clickable:hover .event-card-photo-reveal,.event-card.clickable:focus-visible .event-card-photo-reveal{opacity:1}
}
.visit-section{background:linear-gradient(180deg,var(--bg),#100e0a)}
.visit-section .section-head{max-width:100%;margin-bottom:2rem}
.visit-section h2{line-height:1.18;font-size:clamp(2.1rem,4vw,3rem)}
.visit-panel{display:grid;grid-template-columns:1fr 1.08fr;border:1px solid rgba(212,175,55,.3);border-radius:24px;overflow:hidden;background:var(--surface)}
.visit-address{position:relative;isolation:isolate;padding:clamp(1.6rem,4vw,2.8rem);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;background:linear-gradient(120deg,rgba(11,11,12,.95),rgba(11,11,12,.77)),url('flaschen_hintergrund.9365397265.webp') center/cover}
.visit-pin{height:46px;width:46px;display:grid;place-items:center;color:var(--accent-soft);border:1px solid var(--border);border-radius:14px;margin-bottom:1.4rem;background:rgba(212,175,55,.07)}
.visit-pin svg{width:24px;height:24px}
.visit-address h3{font-size:clamp(1.65rem,2.6vw,2.2rem);line-height:1.25;margin:1rem 0 .6rem}
.visit-address p{margin:0 0 1.5rem;color:var(--text-muted)}
.visit-hours{padding:clamp(1.6rem,4vw,2.8rem);border-left:1px solid var(--border);min-width:0;background:radial-gradient(ellipse at 100% 0%,rgba(212,175,55,.07),transparent 65%)}
.visit-hours h3{font-size:1.6rem;margin:.8rem 0 1.5rem}
.visit-times{margin:0}
.visit-times>div{padding:1.1rem 0;border-bottom:1px solid var(--border)}
.visit-times>div:first-child{padding-top:0}
.visit-times dt{color:var(--text-muted);font-size:.9rem;margin:0 0 .3rem}
.visit-times dd{color:var(--accent-soft);font-variant-numeric:tabular-nums;font-size:1.65rem;font-weight:700;margin:0;white-space:nowrap;line-height:1.4}
.visit-times dd span{font-weight:400;color:#9c834e;padding:0 .25rem}
.visit-small{color:var(--text-muted);font-size:.77rem;margin:.8rem 0 1rem}
.visit-note{display:flex;align-items:flex-start;gap:.8rem;color:var(--accent-soft)}
.visit-note>span{font-family:system-ui,sans-serif}
.visit-note p{margin:0;font-size:.85rem;line-height:1.7;color:var(--text-muted)}
.visit-contact{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1.4rem;padding:1.3rem clamp(1.6rem,4vw,2.8rem);border-top:1px solid var(--border);background:rgba(11,11,12,.4)}
.visit-contact .eyebrow{font-size:.65rem}
.visit-contact p{margin:.2rem 0 0;font-size:.9rem;color:var(--text-muted)}
.visit-contact-links{display:flex;flex-wrap:wrap;gap:.8rem 1.4rem}
.visit-contact-links a{display:inline-flex;gap:.6rem;align-items:center;min-height:44px;font-size:.92rem;font-weight:600;color:var(--accent-soft);text-decoration:none}
.visit-contact-links a:hover{text-decoration:underline;text-underline-offset:4px}
@media(min-width:721px) and (max-width:920px){.highlight-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){
 .about-story-grid{grid-template-columns:1fr;gap:1.8rem}
 .about-story-copy p{max-width:62ch}
 .about-story-photo{height:370px}
 .about-story-photo>img{object-position:center 66%}
 .about-values{gap:1rem;margin-top:2rem}
 .about-values>div{gap:.6rem}
 .visit-contact{align-items:flex-start;flex-direction:column;gap:.6rem}
}
@media(max-width:600px){
 .about-story-copy h2{font-size:2.7rem;margin-top:.8rem}
 .about-story-photo{height:330px;border-radius:18px}
 .about-story-photo figcaption{padding:1.4rem}
 .about-values{grid-template-columns:1fr;margin-top:1.6rem;padding-top:1.4rem;gap:1.2rem}
 .about-values>div{gap:1rem}
 .about-values h3{margin:0 0 .3rem}
 .highlight-card--illustrated>img{padding:.8rem}
 .visit-panel{grid-template-columns:1fr;border-radius:18px}
 .visit-address{padding:1.5rem}
 .visit-address h3{font-size:1.9rem}
 .visit-hours{border-left:0;border-top:1px solid var(--border);padding:1.5rem}
 .visit-times dd{font-size:1.6rem}
 .visit-contact{padding:1.2rem 1.5rem}
 .visit-contact-links{gap:.25rem;flex-direction:column}
}
@media print{.about-photo-badge,.event-hover-hint{display:none}.visit-panel,.visit-hours,.visit-address{background:white;color:#111}.visit-times dd{color:#111}}