:root{
  --ink:#17110d;
  --espresso:#241611;
  --mahogany:#5f2f18;
  --copper:#b9763f;
  --gold:#d9a15f;
  --champagne:#fff8ef;
  --linen:#f5eadb;
  --porcelain:#fffdf9;
  --sage:#243c32;
  --muted:#78685d;
  --line:rgba(95,47,24,.18);
  --shadow:0 24px 70px rgba(39,22,12,.10);
  --shadow-soft:0 12px 35px rgba(39,22,12,.08);
  --radius:30px;
  --max:1180px;
}

/* === Final override: Dark luxury redesign for mobile nav and WhatsApp popup === */
/*
   This section ensures the navigation overlay and floating contact button adopt a
   unified brown/black matte palette with golden highlights. Declared last to
   override any prior definitions.
*/
@media (max-width:980px){
  .nav{
    background:linear-gradient(135deg,rgba(23,17,13,.96),rgba(59,33,22,.92)) !important;
    border:1px solid rgba(217,161,95,.30) !important;
    box-shadow:0 40px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter:blur(20px) saturate(130%) !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .nav::before{
    content:"Navigation" !important;
    grid-column:1/-1 !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:1.5rem !important;
    letter-spacing:-.04em !important;
    color:rgba(255,248,239,.92) !important;
    margin-bottom:8px !important;
  }
  .nav::after{
    background:linear-gradient(135deg,rgba(23,17,13,.96),rgba(59,33,22,.92)) !important;
    border-left:1px solid rgba(217,161,95,.30) !important;
    border-top:1px solid rgba(217,161,95,.30) !important;
  }
  .nav a{
    display:flex !important;
    align-items:center !important;
    min-height:60px !important;
    border-radius:22px !important;
    padding:14px 18px !important;
    background:rgba(36,22,17,.82) !important;
    border:1px solid rgba(217,161,95,.20) !important;
    color:#f5e7d8 !important;
    font-size:.98rem !important;
    font-weight:900 !important;
    letter-spacing:.015em !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
    transition:background .22s ease,border-color .22s ease,transform .22s ease,color .22s ease !important;
  }
  .nav a:hover,
  .nav a.active{
    background:linear-gradient(135deg,rgba(217,161,95,.28),rgba(36,22,17,.88)) !important;
    border-color:rgba(217,161,95,.36) !important;
    color:#fff9f1 !important;
    transform:translateY(-2px) !important;
  }
  .nav a::before{
    width:32px !important;
    height:32px !important;
    margin-right:12px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,rgba(217,161,95,.20),rgba(59,33,22,.30)) !important;
    color:var(--gold) !important;
    display:grid !important;
    place-items:center !important;
    font-size:1rem !important;
  }
}

.social-main{
  background:linear-gradient(135deg,var(--espresso),var(--mahogany)) !important;
  border:1px solid rgba(217,161,95,.30) !important;
  box-shadow:0 20px 46px rgba(59,33,22,.34),inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.social-main .whatsapp-icon{
  color:var(--gold) !important;
}
.social-plus{
  background:var(--espresso) !important;
  color:var(--gold) !important;
  border:1px solid rgba(217,161,95,.30) !important;
  box-shadow:0 8px 18px rgba(23,17,13,.20) !important;
}
.social-panel{
  background:linear-gradient(135deg,rgba(23,17,13,.95),rgba(59,33,22,.90)) !important;
  border:1px solid rgba(217,161,95,.26) !important;
  box-shadow:0 28px 72px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08) !important;
  color:#f5e7d8 !important;
}
.social-item{
  background:rgba(36,22,17,.82) !important;
  border:1px solid rgba(217,161,95,.18) !important;
  color:#f5e7d8 !important;
  font-weight:900 !important;
}
.social-item:hover{
  background:linear-gradient(135deg,rgba(217,161,95,.22),rgba(36,22,17,.86)) !important;
  border-color:rgba(217,161,95,.34) !important;
}
.social-item .whatsapp-icon,
.social-item .social-icon{
  color:var(--gold) !important;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  line-height:1.72;
  background:
    radial-gradient(circle at 10% 0%,rgba(217,161,95,.18),transparent 34rem),
    radial-gradient(circle at 95% 12%,rgba(95,47,24,.10),transparent 26rem),
    linear-gradient(180deg,var(--champagne),#fbf1e5 42%,#fffaf4);
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.28;
  background-image:linear-gradient(rgba(95,47,24,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(95,47,24,.035) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
  z-index:-1;
}
a{color:inherit;text-underline-offset:4px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(217,161,95,.55);outline-offset:4px}
img,svg{max-width:100%}

.site-header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;gap:28px;
  padding:16px max(5vw,24px);
  background:rgba(255,248,239,.84);
  backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid rgba(95,47,24,.12);
  box-shadow:0 10px 35px rgba(39,22,12,.045);
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:900;letter-spacing:-.03em;font-size:1.12rem;white-space:nowrap}
.brand-mark{
  display:grid;place-items:center;width:46px;height:46px;border-radius:16px;
  color:#fff;background:linear-gradient(135deg,var(--espresso),var(--mahogany) 62%,var(--gold));
  box-shadow:0 12px 28px rgba(95,47,24,.24);
}

.brand-logo-frame{
  position:relative;display:grid;place-items:center;width:88px;height:58px;border-radius:20px;
  background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,248,239,.82));
  border:1px solid rgba(95,47,24,.18);
  box-shadow:0 14px 30px rgba(95,47,24,.14),inset 0 1px 0 rgba(255,255,255,.9);
  overflow:hidden;
}
.brand-logo-frame::before{
  content:"";position:absolute;inset:5px;border-radius:16px;border:1px solid rgba(217,161,95,.22);pointer-events:none;
}
.brand-logo-frame::after{
  content:"";position:absolute;inset:auto 12px -11px 12px;height:20px;border-radius:999px;background:rgba(217,161,95,.20);filter:blur(8px);
}
.brand-logo{
  position:relative;z-index:1;width:76px;height:auto;display:block;object-fit:contain;
  filter:drop-shadow(0 2px 1px rgba(255,255,255,.78));
}
.footer-logo-wrap{
  width:92px;height:60px;margin:0 auto 16px;display:grid;place-items:center;border-radius:22px;
  background:linear-gradient(135deg,#fff,#fff7ed);border:1px solid rgba(217,161,95,.28);
  box-shadow:0 18px 34px rgba(0,0,0,.22);
}
.footer-logo{width:78px;height:auto;display:block;object-fit:contain}

.nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;font-weight:750}
.nav a{
  position:relative;text-decoration:none;font-size:.92rem;letter-spacing:.01em;
  padding:10px 13px;border-radius:999px;color:rgba(23,17,13,.82);
  transition:background .22s ease,color .22s ease,transform .22s ease;
}
.nav a:hover,.nav a.active{background:rgba(185,118,63,.12);color:var(--mahogany);transform:translateY(-1px)}
.menu-toggle{display:none;border:0;background:var(--espresso);color:#fff;border-radius:14px;padding:10px 13px;font-size:1.1rem;box-shadow:var(--shadow-soft)}

.hero,.section,.newsletter,.content,.page-hero{padding-left:max(5vw,24px);padding-right:max(5vw,24px)}
.hero,.section,.newsletter{padding-top:86px;padding-bottom:86px}
.hero>* , .section>* , .content>* , .page-hero>* , .newsletter>*{max-width:var(--max)}
.hero.split,.section.two-col,.content.two-col{max-width:none}
.split,.two-col{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(340px,.94fr);gap:clamp(34px,5vw,76px);align-items:center}
.hero{
  min-height:82vh;
  position:relative;overflow:hidden;
  background:
    linear-gradient(135deg,rgba(36,22,17,.92),rgba(95,47,24,.78)),
    radial-gradient(circle at 78% 26%,rgba(217,161,95,.35),transparent 28rem);
  color:#fff9f1;
}
.hero::after{
  content:"";position:absolute;inset:auto -12% -38% 44%;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(217,161,95,.28),transparent 62%);filter:blur(10px);pointer-events:none;
}
.hero-copy{position:relative;z-index:1;max-width:760px}
.hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.85rem,6.6vw,6.8rem);line-height:.94;margin:0 0 24px;letter-spacing:-.07em;font-weight:700}
.hero p{font-size:1.16rem;max-width:720px;color:rgba(255,249,241,.86)}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--copper);font-weight:900;font-size:.76rem;margin:0 0 14px}
.hero .eyebrow{color:#f0bc7b}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;align-items:center}
.btn,button{
  --btn-bg:transparent;--btn-color:var(--espresso);--btn-border:rgba(36,22,17,.85);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;border:1px solid var(--btn-border);border-radius:999px;padding:13px 23px;
  font-weight:900;letter-spacing:.01em;text-decoration:none;background:var(--btn-bg);color:var(--btn-color);cursor:pointer;
  box-shadow:0 10px 24px rgba(39,22,12,.06);
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease,color .22s ease,border-color .22s ease;
}
.btn::after,button::after{content:"→";font-weight:900;transition:transform .22s ease}
.btn:hover,button:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(39,22,12,.13);background:rgba(95,47,24,.08)}
.btn:hover::after,button:hover::after{transform:translateX(3px)}
.btn.primary,button{--btn-bg:linear-gradient(135deg,var(--espresso),var(--mahogany));--btn-color:#fff;--btn-border:transparent}
.hero .btn{--btn-color:#fff;--btn-border:rgba(255,255,255,.42);box-shadow:none}
.hero .btn:hover{background:rgba(255,255,255,.12)}
.hero .btn.primary{--btn-bg:linear-gradient(135deg,#f0bc7b,var(--gold));--btn-color:#241611}

.media-placeholder{
  position:relative;overflow:hidden;min-height:340px;border:1px solid rgba(95,47,24,.17);border-radius:var(--radius);
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(245,234,219,.64)),
    repeating-linear-gradient(-45deg,rgba(185,118,63,.08) 0 10px,rgba(255,255,255,.18) 10px 20px);
  display:grid;place-items:center;text-align:center;padding:34px;color:var(--muted);box-shadow:var(--shadow);
}
.hero .media-placeholder{background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.06));border-color:rgba(255,255,255,.22);color:rgba(255,249,241,.82);box-shadow:0 30px 90px rgba(0,0,0,.20)}
.media-placeholder::before{content:"";position:absolute;inset:16px;border:1px dashed rgba(95,47,24,.27);border-radius:calc(var(--radius) - 12px)}
.hero .media-placeholder::before{border-color:rgba(255,255,255,.3)}
.media-placeholder::after{content:"";position:absolute;inset:auto -20% -45% -20%;height:180px;background:radial-gradient(circle,rgba(217,161,95,.22),transparent 60%)}
.media-placeholder.large{min-height:540px}
.media-placeholder span{display:block;font-size:4.1rem;filter:drop-shadow(0 10px 16px rgba(39,22,12,.14))}
.media-placeholder p{font-weight:900;margin:10px 0 0;letter-spacing:.02em}

.section h2,.content h2,.newsletter h2,.page-hero h1{font-family:Georgia,"Times New Roman",serif;line-height:1.03;letter-spacing:-.045em;font-weight:700}
.section h2,.content h2,.newsletter h2{font-size:clamp(2rem,4vw,4rem);margin:0 0 22px}
.section h3,.content h3{margin:26px 0 10px;line-height:1.25;font-size:1.28rem;letter-spacing:-.02em}
.section p,.content p,.page-hero p{color:var(--muted)}
.alt{background:linear-gradient(135deg,rgba(245,234,219,.88),rgba(255,253,249,.78));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cards-3,.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.card,.info-card,.product-card,.post-card,.form{
  position:relative;background:rgba(255,253,249,.88);border:1px solid var(--line);border-radius:var(--radius);padding:30px;
  box-shadow:var(--shadow-soft);backdrop-filter:blur(8px);
}
.card,.info-card,.product-card,.post-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.card:hover,.info-card:hover,.product-card:hover,.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(185,118,63,.35)}
.card .icon{width:58px;height:58px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,rgba(217,161,95,.22),rgba(95,47,24,.09));font-size:2rem;margin-bottom:14px}
.card a,.post-card>a:not(.btn){font-weight:900;color:var(--mahogany)}
.product-card{display:flex;flex-direction:column;gap:12px}
.product-card .media-placeholder,.post-card .media-placeholder{min-height:220px;margin:-10px -10px 14px;border-radius:24px;box-shadow:none}
.badge{display:inline-flex;width:max-content;border-radius:999px;background:rgba(217,161,95,.18);color:var(--mahogany);padding:7px 13px;font-weight:900;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}
.price-list{display:grid;gap:14px;margin:22px 0}.price-row{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:13px 0}.price-row span{text-align:right;color:var(--mahogany);font-weight:800}
ul{padding-left:1.1rem;color:var(--muted)}li{margin:.42rem 0}

.page-hero{
  padding-top:90px;padding-bottom:56px;
  background:linear-gradient(135deg,rgba(245,234,219,.88),rgba(255,253,249,.55));
  border-bottom:1px solid var(--line);
}
.page-hero h1{font-size:clamp(2.8rem,6vw,5.8rem);margin:0 0 18px;color:var(--espresso)}
.page-hero p{max-width:850px;font-size:1.08rem}
.content{padding-top:62px;padding-bottom:62px}
.newsletter{text-align:center;background:linear-gradient(135deg,var(--sage),#14231d);color:#fff;position:relative;overflow:hidden}
.newsletter::before{content:"";position:absolute;inset:-40% auto auto -8%;width:420px;height:420px;border-radius:50%;background:rgba(217,161,95,.18);filter:blur(3px)}
.newsletter h2,.newsletter p,.newsletter form{position:relative;margin-left:auto;margin-right:auto}
.newsletter p{color:rgba(255,255,255,.78)}
.inline-form{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}
.inline-form input,.form input,.form select,.form textarea{
  border:1px solid rgba(95,47,24,.22);border-radius:18px;padding:15px 16px;min-width:260px;background:#fffdf9;color:var(--ink);font:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.form input,.form select,.form textarea{width:100%}
.inline-form input:focus,.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--copper);box-shadow:0 0 0 4px rgba(217,161,95,.14);transform:translateY(-1px)}
.form{display:grid;gap:14px;max-width:780px}.form textarea{min-height:130px;resize:vertical}.source-note{font-size:.88rem;color:var(--muted);margin:0}.form-status{margin:0;padding:12px 14px;border-radius:16px;background:rgba(36,60,50,.08);color:var(--sage);font-weight:800;display:none}.form-status.show{display:block}
.footer{padding:42px max(5vw,24px);background:linear-gradient(135deg,#1a100d,var(--espresso));color:#f9ead7;text-align:center;border-top:1px solid rgba(255,255,255,.1)}
.footer p{margin:6px 0;color:rgba(249,234,215,.82)}

@media(max-width:980px){
  .menu-toggle{display:inline-flex}.nav{display:none;position:absolute;left:max(5vw,24px);right:max(5vw,24px);top:82px;flex-direction:column;align-items:stretch;background:rgba(255,253,249,.98);border:1px solid var(--line);border-radius:24px;padding:14px;box-shadow:var(--shadow)}.nav.open{display:flex}.nav a{padding:13px 15px}.split,.two-col,.grid-2{grid-template-columns:1fr}.hero{min-height:auto}.cards-3,.grid-3{grid-template-columns:1fr}.hero,.section,.newsletter{padding-top:62px;padding-bottom:62px}.content{padding-top:46px;padding-bottom:46px}.media-placeholder.large{min-height:380px}.price-row{display:block}.price-row span{text-align:left;display:block;margin-top:4px}
}
@media(max-width:620px){
  .site-header{padding:12px 18px}.brand-logo-frame{width:70px;height:48px;border-radius:16px}.brand-logo{width:60px}.footer-logo-wrap{width:80px;height:52px}.footer-logo{width:66px}.brand span:last-child{max-width:150px;overflow:hidden;text-overflow:ellipsis}.hero,.section,.newsletter,.content,.page-hero{padding-left:18px;padding-right:18px}.hero h1{font-size:3rem}.page-hero h1{font-size:3rem}.card,.info-card,.product-card,.post-card,.form{padding:22px;border-radius:24px}.inline-form input,.form input,.form select,.form textarea{min-width:0;width:100%}.inline-form button,.form button,.btn{width:100%}.media-placeholder{min-height:260px}.media-placeholder.large{min-height:320px}
}


/* Creative popup navigation upgrade */
body.menu-open{overflow:hidden}
body.menu-open::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:45;
  background:radial-gradient(circle at 82% 18%,rgba(217,161,95,.20),transparent 26rem),rgba(23,17,13,.42);
  backdrop-filter:blur(7px);
}
.site-header{z-index:80}
.menu-toggle{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:54px;
  min-height:48px;
  border:1px solid rgba(217,161,95,.32);
  background:linear-gradient(135deg,var(--espresso),var(--mahogany) 66%,#8b542b);
  color:#fff;
  border-radius:999px;
  padding:12px 18px;
  font-weight:900;
  letter-spacing:.02em;
  box-shadow:0 16px 34px rgba(95,47,24,.24),inset 0 1px 0 rgba(255,255,255,.20);
  cursor:pointer;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}
.menu-toggle::before{content:"Menu";font-size:.82rem;text-transform:uppercase;letter-spacing:.11em}
.menu-toggle:hover{transform:translateY(-2px);box-shadow:0 22px 42px rgba(95,47,24,.30),inset 0 1px 0 rgba(255,255,255,.22)}
.menu-toggle[aria-expanded="true"]{background:linear-gradient(135deg,#8b542b,var(--mahogany),var(--espresso))}
.menu-toggle[aria-expanded="true"]::before{content:"Close"}
.nav{
  position:fixed !important;
  top:94px !important;
  right:max(5vw,24px) !important;
  left:auto !important;
  z-index:90;
  width:min(430px,calc(100vw - 48px));
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:12px;
  padding:28px;
  border-radius:34px;
  background:
    linear-gradient(145deg,rgba(255,253,249,.98),rgba(255,248,239,.94)),
    radial-gradient(circle at 12% 0%,rgba(217,161,95,.22),transparent 18rem);
  border:1px solid rgba(217,161,95,.30);
  box-shadow:0 34px 90px rgba(23,17,13,.28),inset 0 1px 0 rgba(255,255,255,.88);
  backdrop-filter:blur(20px) saturate(145%);
  transform-origin:top right;
  transform:translateY(-12px) scale(.96);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,transform .24s ease,visibility .24s ease;
}
.nav.open{
  /* override: keep existing open state (opacity, visibility, transform) */
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.nav::before{
  content:"Explore Bolt Bier-Art";
  grid-column:1/-1;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.55rem;
  line-height:1;
  letter-spacing:-.04em;
  color:var(--espresso);
  margin-bottom:6px;
}
.nav::after{
  content:"";
  position:absolute;
  top:-10px;
  right:30px;
  width:20px;
  height:20px;
  transform:rotate(45deg);
  background:rgba(255,253,249,.98);
  border-left:1px solid rgba(217,161,95,.30);
  border-top:1px solid rgba(217,161,95,.30);
}
.nav.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.nav a{
  display:flex;
  align-items:center;
  min-height:64px;
  border-radius:22px;
  padding:16px 18px !important;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(95,47,24,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.74);
  font-size:.96rem;
}
.nav a:hover,.nav a.active{
  background:linear-gradient(135deg,rgba(217,161,95,.24),rgba(255,255,255,.72));
  border-color:rgba(185,118,63,.34);
  transform:translateY(-2px);
}
.nav a::before{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  margin-right:10px;
  border-radius:11px;
  background:linear-gradient(135deg,rgba(95,47,24,.12),rgba(217,161,95,.18));
  font-size:1rem;
}
.nav a[href$="index.html"]::before{content:"⌂"}
.nav a[href*="brauerei"]::before{content:"🍺"}
.nav a[href*="gastronomie"]::before{content:"🍽"}
.nav a[href*="dirndl"]::before{content:"👗"}
.nav a[href*="reservation"]::before{content:"✦"}
.nav a[href*="shop"]::before{content:"🛍"}
.nav a[href*="news"]::before{content:"✎"}
.nav a[href*="kontakt"]::before{content:"☎"}
@media(max-width:620px){
  .menu-toggle{padding:11px 14px;min-height:44px}.menu-toggle::before{display:none}
  .nav{top:78px !important;right:18px !important;left:18px !important;width:auto;grid-template-columns:1fr;padding:22px;border-radius:28px;max-height:calc(100vh - 104px);overflow:auto}
  .nav a{min-height:56px}
}

/* Real imagery added to the prepared visual slots */
.image-frame,.card-photo{position:relative;overflow:hidden;background:var(--cream);border:1px solid rgba(255,255,255,.64);box-shadow:var(--shadow);isolation:isolate}
.image-frame{min-height:360px;border-radius:var(--radius)}
.image-frame.large{min-height:540px}
.image-frame::after,.card-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(47,25,13,.06),rgba(217,161,95,.12));pointer-events:none;mix-blend-mode:multiply}
.image-frame img,.card-photo img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0;transition:transform .5s ease}
.image-frame:hover img,.card-photo:hover img{transform:scale(1.035)}
.hero-photo{box-shadow:0 34px 95px rgba(0,0,0,.22)}
.portrait-photo img{object-position:center center}
.card-photo{height:190px;border-radius:24px;margin:-10px -10px 18px;box-shadow:none}
.card-photo img{position:absolute}
@media (max-width:800px){.image-frame.large{min-height:380px}.image-frame{min-height:300px}.card-photo{height:210px}}
@media (max-width:520px){.image-frame.large{min-height:320px}.image-frame{min-height:260px}.card-photo{height:190px}}

/* Full-body portrait treatment for the brewery guest image */
.image-frame.portrait-full{
  min-height:560px;
  max-width:470px;
  width:100%;
  justify-self:center;
  background:linear-gradient(135deg,#fff7ed,#eadcc9);
}
.image-frame.portrait-full img{
  object-fit:contain;
  object-position:center bottom;
  padding:10px;
}
@media (max-width:980px){
  .image-frame.portrait-full{max-width:520px;min-height:620px;}
}
@media (max-width:520px){
  .image-frame.portrait-full{min-height:500px;}
  .image-frame.portrait-full img{padding:8px;}
}

/* Photo composition refinement: show complete images instead of cutting important people/products */
.card-photo{
  height:auto;
  aspect-ratio:4 / 3;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.98), rgba(245,234,219,.72) 70%),
    linear-gradient(135deg, rgba(217,161,95,.12), rgba(95,47,24,.06));
}
.card-photo img{
  position:relative;
  inset:auto;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  padding:8px;
  background:transparent;
}
.card-photo::after{
  mix-blend-mode:normal;
  background:linear-gradient(135deg,rgba(47,25,13,.02),rgba(217,161,95,.08));
}
.content .image-frame:not(.hero-photo):not(.portrait-full){
  min-height:430px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.96), rgba(245,234,219,.74) 72%),
    linear-gradient(135deg, rgba(217,161,95,.12), rgba(95,47,24,.06));
}
.content .image-frame:not(.hero-photo):not(.portrait-full) img{
  position:relative;
  inset:auto;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  padding:10px;
}
.content .image-frame:not(.hero-photo):not(.portrait-full)::after{
  mix-blend-mode:normal;
  background:linear-gradient(135deg,rgba(47,25,13,.025),rgba(217,161,95,.08));
}
.content.two-col .image-frame:not(.hero-photo):not(.portrait-full){
  align-self:stretch;
}
@media (max-width:800px){
  .content .image-frame:not(.hero-photo):not(.portrait-full){min-height:380px;}
  .card-photo{aspect-ratio:1 / 1;}
}

/* Final no-crop image rule for user-provided photos: keep every photo complete inside its elegant frame. */
.image-frame.portrait-photo{
  min-height:0;
  aspect-ratio:1 / 1;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.96), rgba(245,234,219,.76) 72%),
    linear-gradient(135deg, rgba(217,161,95,.12), rgba(95,47,24,.06));
}
.image-frame.portrait-photo img{
  position:relative;
  inset:auto;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  padding:10px;
  background:transparent;
}
.image-frame.portrait-photo::after{
  mix-blend-mode:normal;
  background:linear-gradient(135deg,rgba(47,25,13,.02),rgba(217,161,95,.08));
}
@media (max-width:800px){
  .image-frame.portrait-photo{aspect-ratio:1 / 1;}
}

/* Creative home motion slideshow: elegant movement, no image cropping. */
.hero-showcase{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(440px,1.08fr);
  gap:clamp(30px,5vw,76px);
  align-items:center;
  min-height:82vh;
}
.hero-slideshow{
  position:relative;
  z-index:1;
  min-height:clamp(430px,46vw,650px);
  border-radius:36px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  background:linear-gradient(135deg,rgba(255,248,239,.10),rgba(36,22,17,.52));
  box-shadow:0 38px 110px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18);
  isolation:isolate;
}
.hero-slideshow::before{
  content:"";
  position:absolute;
  inset:-22%;
  background:radial-gradient(circle at 20% 20%,rgba(217,161,95,.30),transparent 28rem),radial-gradient(circle at 78% 72%,rgba(255,248,239,.20),transparent 20rem);
  animation:ambientDrift 12s ease-in-out infinite alternate;
  z-index:0;
}
.hero-slideshow::after{
  content:"";
  position:absolute;
  inset:18px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:26px;
  pointer-events:none;
  z-index:4;
}
.slide{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  opacity:0;
  transform:scale(.985) translateY(18px);
  transition:opacity 1.1s ease, transform 1.1s ease;
  z-index:1;
}
.slide::before{
  content:"";
  position:absolute;
  inset:0;
  background:inherit;
  background-image:var(--slide-bg);
  background-size:cover;
  background-position:center;
  filter:blur(24px) saturate(1.05);
  transform:scale(1.12);
  opacity:.46;
}
.slide.is-active{
  opacity:1;
  transform:scale(1) translateY(0);
  z-index:2;
}
.slide img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  padding:clamp(14px,2.2vw,28px);
  filter:drop-shadow(0 28px 48px rgba(0,0,0,.30));
  animation:photoFloat 6.8s ease-in-out infinite;
}
.slide:nth-child(1){--slide-bg:url('danny-dilani-toast.jpeg')}
.slide:nth-child(2){--slide-bg:url('brauerei-couple.jpeg')}
.slide:nth-child(3){--slide-bg:url('beer-tasting-glasses.jpeg')}
@keyframes ambientDrift{from{transform:translate3d(-2%,1%,0) scale(1)}to{transform:translate3d(2%,-1%,0) scale(1.04)}}
@keyframes photoFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.012)}}
@media (prefers-reduced-motion:reduce){.hero-slideshow::before,.slide img{animation:none}.slide{transition:none}}
@media (max-width:980px){
  .hero-showcase{grid-template-columns:1fr;min-height:auto}
  .hero-slideshow{min-height:560px;order:-1}
}
@media (max-width:620px){
  .hero-slideshow{min-height:430px;border-radius:28px}
  .hero-slideshow::after{inset:12px;border-radius:20px}
}

/* Embedded Tele Züri contribution: native controls, full frame visible, never cropped. */
.video-frame{
  display:grid;
  place-items:center;
  margin:-10px -10px 14px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(95,47,24,.14);
  background:linear-gradient(135deg,#19100c,#3c2419);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}
.video-frame video{
  display:block;
  width:100%;
  height:auto;
  max-height:520px;
  object-fit:contain;
  background:#120c09;
}

/* Premium homepage slideshow replacement: manual switching, cinematic, and never cropped. */
.hero-luxury{
  min-height:calc(100vh - 86px);
  grid-template-columns:minmax(360px,.72fr) minmax(520px,1.28fr);
  gap:clamp(34px,5.5vw,88px);
  padding-top:clamp(58px,7vw,96px);
  padding-bottom:clamp(58px,7vw,96px);
  background:
    radial-gradient(circle at 10% 16%,rgba(217,161,95,.22),transparent 26rem),
    radial-gradient(circle at 86% 18%,rgba(255,248,239,.10),transparent 24rem),
    linear-gradient(135deg,#1b100d 0%,#4a281a 52%,#7b4727 100%);
}
.hero-luxury::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.30),transparent 58%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 96px);
  pointer-events:none;
}
.hero-luxury .luxury-copy{
  position:relative;
  z-index:3;
  max-width:620px;
  padding:clamp(10px,2vw,22px) 0;
}
.hero-luxury .luxury-copy h1{
  font-size:clamp(3.1rem,5.4vw,6.9rem);
  letter-spacing:-.065em;
  text-wrap:balance;
}
.hero-luxury .luxury-copy p:not(.eyebrow){max-width:560px;color:rgba(255,249,241,.82)}

.premium-carousel{
  min-height:clamp(560px,50vw,760px);
  border-radius:42px;
  padding:0;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  isolation:isolate;
}
.premium-carousel::before{
  /* hide decorative frame so photos are not cropped by the faux device */
  display:none;
}
.premium-carousel::after{display:none}
.carousel-radio{position:absolute;opacity:0;pointer-events:none}
.carousel-viewport{
  position:absolute;
  inset:0;
  /* remove border radius and overflow so images can fill the entire viewport without being clipped */
  border-radius:0;
  overflow:visible;
  background:none;
  border:0;
  box-shadow:none;
}
.premium-carousel .slide{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  margin:0;
  /* remove internal padding so images can occupy full width */
  padding:0;
  opacity:0 !important;
  /* remove rotation and translation on idle slides to prevent cropping */
  transform:translateX(4%) scale(.985) !important;
  transition:opacity .65s ease,transform .75s cubic-bezier(.2,.85,.2,1);
  z-index:1;
  pointer-events:none;
}
.premium-carousel .slide::before{display:none}
.premium-carousel .slide-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  filter:blur(28px) saturate(1.08) brightness(.82);
  transform:scale(1.13);
  opacity:.68;
}
.premium-carousel .slide-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 48%,transparent 0 36%,rgba(23,17,13,.42) 78%),
    linear-gradient(135deg,rgba(36,22,17,.38),rgba(217,161,95,.12));
}
.premium-carousel .slide img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  /*
   * Override the default sizing on the slideshow images so that they
   * can always display the entire photo without cropping. By removing
   * the max‑height constraint and letting the height adjust naturally,
   * the images scale down proportionally to fit within the carousel
   * viewport. When combined with object‑fit:contain they will never
   * be clipped, even on small screens. This ensures that important
   * subjects (like the people and glasses in the hero images) are
   * always visible.
   */
  height:auto;
  max-height:none;
  width:100%;
  object-fit:contain;
  object-position:center center;
  padding:0;
  border-radius:30px;
  filter:drop-shadow(0 34px 58px rgba(0,0,0,.38));
  animation:none;
}
.premium-carousel figcaption{
  position:absolute;
  left:clamp(28px,3vw,48px);
  bottom:clamp(28px,3vw,48px);
  z-index:5;
  display:flex;
  align-items:center;
  gap:14px;
  max-width:min(78%,560px);
  padding:13px 17px;
  border-radius:999px;
  background:rgba(255,248,239,.88);
  color:var(--espresso);
  border:1px solid rgba(255,255,255,.50);
  box-shadow:0 18px 42px rgba(0,0,0,.20);
  backdrop-filter:blur(14px);
}
.premium-carousel figcaption span{display:none}
.premium-carousel figcaption strong{line-height:1.15;font-size:clamp(.98rem,1.3vw,1.16rem)}
#home-slide-1:checked ~ .carousel-viewport .slide-1,
#home-slide-2:checked ~ .carousel-viewport .slide-2,
#home-slide-3:checked ~ .carousel-viewport .slide-3{
  opacity:1 !important;
  transform:translateX(0) scale(1) rotate(0) !important;
  z-index:3;
  pointer-events:auto;
}
.carousel-arrows{
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
}
.arrow-pair{display:none;position:absolute;inset:0;align-items:center;justify-content:space-between;padding:0 clamp(14px,2vw,26px)}
#home-slide-1:checked ~ .carousel-arrows .for-1,
#home-slide-2:checked ~ .carousel-arrows .for-2,
#home-slide-3:checked ~ .carousel-arrows .for-3{display:flex}
.carousel-arrow{
  pointer-events:auto;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:999px;
  background:rgba(255,248,239,.82);
  color:var(--espresso);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 18px 42px rgba(0,0,0,.22);
  backdrop-filter:blur(14px);
  font-size:2.35rem;
  line-height:1;
  cursor:pointer;
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
  user-select:none;
}
.carousel-arrow:hover{transform:scale(1.08);background:#fff8ef;box-shadow:0 24px 52px rgba(0,0,0,.26)}
.carousel-dots{
  position:absolute;
  right:clamp(26px,3vw,46px);
  top:clamp(26px,3vw,46px);
  z-index:9;
  display:flex;
  gap:10px;
  padding:9px;
  border-radius:999px;
  background:rgba(23,17,13,.34);
  border:1px solid rgba(255,255,255,.20);
  backdrop-filter:blur(14px);
}
.carousel-dots label{
  display:block;
  width:12px;
  height:12px;
  border-radius:999px;
  background:rgba(255,248,239,.48);
  border:1px solid rgba(255,255,255,.45);
  cursor:pointer;
  transition:width .22s ease,background .22s ease,transform .22s ease;
}
.carousel-dots label:hover{transform:translateY(-1px);background:#fff8ef}
#home-slide-1:checked ~ .carousel-dots label[for="home-slide-1"],
#home-slide-2:checked ~ .carousel-dots label[for="home-slide-2"],
#home-slide-3:checked ~ .carousel-dots label[for="home-slide-3"]{
  width:34px;
  background:linear-gradient(135deg,#f0bc7b,var(--gold));
}
@keyframes premiumGlow{from{transform:rotate(-1.2deg) translate3d(-6px,4px,0)}to{transform:rotate(.8deg) translate3d(8px,-5px,0)}}
@media(max-width:980px){
  .hero-luxury{grid-template-columns:1fr;min-height:auto}
  .premium-carousel{order:-1;min-height:clamp(500px,78vw,720px)}
  .premium-carousel .slide img{max-height:calc(clamp(500px,78vw,720px) - 72px)}
}
@media(max-width:620px){
  .hero-luxury{padding-top:38px;padding-bottom:52px}
  .premium-carousel{min-height:440px;border-radius:30px}
  .carousel-viewport{border-radius:30px}
  .premium-carousel .slide{padding:16px}
  .premium-carousel .slide img{max-height:408px;border-radius:22px}
  .premium-carousel figcaption{left:16px;right:16px;bottom:16px;max-width:none;border-radius:22px}

  /*
   * On very small screens the slideshow images tended to be cropped by the
   * carousel viewport, making it difficult to appreciate the full photo.
   * To remedy this we hide the <img> element entirely and instead use
   * the slide’s background span to display the photo at its natural
   * aspect ratio. The blurred overlay and dark vignette are removed and
   * the background is set to `contain` so the entire image fits within
   * the available space. This ensures both portrait and landscape
   * photographs remain fully visible without unwanted clipping.
   */
  .premium-carousel .slide img{
    display:none;
  }
  .premium-carousel .slide-bg{
    filter:none;
    opacity:1;
    background-size:contain;
    background-position:center center;
    transform:none;
  }
  .premium-carousel .slide-bg::after{
    display:none;
  }

  /* Hide the decorative device frame on very small screens so the
   * slideshow can use the full width of the viewport. This prevents
   * the round‑corner phone mockup from cropping the photos. */
  .premium-carousel::before{
    display:none;
  }
  .carousel-dots{top:14px;right:14px}
  .carousel-dots label{width:11px;height:11px}
  #home-slide-1:checked ~ .carousel-dots label[for="home-slide-1"],
  #home-slide-2:checked ~ .carousel-dots label[for="home-slide-2"],
  #home-slide-3:checked ~ .carousel-dots label[for="home-slide-3"]{width:30px}
  .carousel-arrow{width:44px;height:44px;font-size:1.9rem}
}

/* Mobile stability polish: phone layout, popup menu, and no-horizontal-scroll fixes */
html,body{max-width:100%;overflow-x:hidden}

@media(max-width:760px){
  body{font-size:16px;line-height:1.62}
  .site-header{
    padding:10px 14px;
    gap:10px;
    min-height:70px;
  }
  .brand{gap:9px;min-width:0;font-size:1rem;letter-spacing:-.02em}
  .brand span:last-child{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .brand-logo-frame{width:66px;height:46px;border-radius:16px;flex:0 0 auto}
  .brand-logo-frame::before{inset:4px;border-radius:12px}
  .brand-logo{width:58px}
  .menu-toggle{
    position:relative;
    z-index:101;
    flex:0 0 auto;
    width:auto;
    min-width:48px;
    min-height:46px;
    padding:10px 13px;
    border-radius:16px;
    touch-action:manipulation;
  }
  .nav{
    top:74px !important;
    left:12px !important;
    right:12px !important;
    width:auto !important;
    max-height:calc(100dvh - 92px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    grid-template-columns:1fr !important;
    gap:10px;
    padding:18px !important;
    border-radius:26px;
  }
  .nav::before{font-size:1.32rem;margin-bottom:2px}
  .nav::after{right:24px}
  .nav a{
    min-height:52px !important;
    padding:13px 14px !important;
    border-radius:18px;
    font-size:.95rem;
  }
  .nav a::before{width:28px;height:28px;margin-right:9px;border-radius:10px}
  body.menu-open{overflow:hidden}

  .hero,.section,.newsletter,.content,.page-hero{padding-left:18px;padding-right:18px}
  .hero,.section,.newsletter{padding-top:48px;padding-bottom:48px}
  .page-hero{padding-top:52px;padding-bottom:38px}
  .content{padding-top:34px;padding-bottom:42px}
  .split,.two-col,.cards-3,.grid-3,.grid-2{grid-template-columns:1fr !important;gap:24px}

  .hero-luxury{
    padding-top:28px;
    padding-bottom:44px;
    min-height:auto;
    gap:28px;
  }
  .hero-luxury .luxury-copy{padding:0;max-width:100%}
  .hero-luxury .luxury-copy h1,
  .hero h1{
    font-size:clamp(2.15rem,11vw,3.35rem);
    line-height:1.02;
    letter-spacing:-.055em;
    margin-bottom:18px;
  }
  .hero p{font-size:1rem;max-width:100%}
  .actions{gap:10px;margin-top:22px}
  .actions .btn{width:100%;min-height:50px}

  .premium-carousel{
    order:-1;
    width:100%;
    min-height:0 !important;
    height:clamp(360px,82vw,500px);
    border-radius:28px;
  }
  .premium-carousel::before{inset:7% 4% -4% 5%;border-radius:30px}
  .carousel-viewport{border-radius:28px}
  .premium-carousel .slide{padding:14px !important}
  .premium-carousel .slide img{
    width:100%;
    height:100%;
    max-height:none !important;
    object-fit:contain;
    border-radius:20px;
  }
  .premium-carousel figcaption{
    left:14px;
    right:14px;
    bottom:14px;
    max-width:none;
    padding:10px 13px;
    border-radius:18px;
  }
  .premium-carousel figcaption strong{font-size:.92rem}
  .carousel-dots{top:12px;right:12px;gap:8px;padding:8px}
  .carousel-dots label{width:10px;height:10px}
  #home-slide-1:checked ~ .carousel-dots label[for="home-slide-1"],
  #home-slide-2:checked ~ .carousel-dots label[for="home-slide-2"],
  #home-slide-3:checked ~ .carousel-dots label[for="home-slide-3"]{width:26px}
  .arrow-pair{padding:0 8px}
  .carousel-arrow{width:42px;height:42px;font-size:1.8rem}

  .section h2,.content h2,.newsletter h2,.page-hero h1{font-size:clamp(1.8rem,9vw,2.6rem);line-height:1.08}
  .card,.info-card,.product-card,.post-card,.form{padding:22px;border-radius:24px}
  .product-card .media-placeholder,.post-card .media-placeholder{min-height:180px}
  .image-frame,.image-frame.large,.content .image-frame:not(.hero-photo):not(.portrait-full){
    min-height:0 !important;
    aspect-ratio:1 / 1;
  }
  .image-frame img,.content .image-frame:not(.hero-photo):not(.portrait-full) img,.card-photo img{
    object-fit:contain !important;
    max-width:100%;
  }
  .image-frame.portrait-full{min-height:0 !important;aspect-ratio:4 / 5;max-width:100%}
  .image-frame.portrait-photo{aspect-ratio:1 / 1;max-width:100%}
  .card-photo{height:auto;aspect-ratio:1 / 1}

  .inline-form{display:grid;grid-template-columns:1fr;gap:12px}
  .inline-form input,.inline-form button,.form input,.form select,.form textarea,.form button{width:100%}
  .price-row{display:block}
  .price-row span{display:block;text-align:left;margin-top:4px}
  .footer{padding-left:18px;padding-right:18px}
  .video-frame video{width:100%;height:auto;max-height:70dvh;object-fit:contain}
}

@media(max-width:390px){
  .brand span:last-child{display:none}
  .premium-carousel{height:350px}
  .hero-luxury .luxury-copy h1,.hero h1{font-size:2.05rem}
  .btn,button{padding:12px 18px}
}

/* Mobile centering correction: keep homepage carousel perfectly centered on phones. */
@media(max-width:760px){
  .hero-luxury{
    justify-items:stretch;
  }
  .hero-luxury > *{
    width:100%;
  }
  .premium-carousel{
    justify-self:center;
    align-self:start;
    width:min(100%, 430px);
    margin-inline:auto;
  }
  .premium-carousel::before{
    inset:14px;
    border-radius:28px;
    transform:none;
    animation:none;
  }
  .carousel-viewport{
    inset:0;
    width:100%;
  }
  .premium-carousel .slide,
  .premium-carousel .slide img{
    margin-inline:auto;
  }
}

@media(max-width:430px){
  .premium-carousel{
    width:min(100%, 100%);
    max-width:390px;
  }
  .premium-carousel::before{
    inset:12px;
  }
}



/* WhatsApp polish: icons in WhatsApp action buttons plus a fixed bottom contact button. */
.whatsapp-icon{
  display:inline-grid;
  place-items:center;
  width:1.28em;
  height:1.28em;
  flex:0 0 auto;
}
.whatsapp-icon svg{
  display:block;
  width:100%;
  height:100%;
  fill:currentColor;
}
.whatsapp-button{
  gap:10px;
}
.whatsapp-float{
  position:fixed;
  right:clamp(18px,3vw,34px);
  bottom:clamp(18px,3vw,34px);
  z-index:60;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:14px 20px;
  border-radius:999px;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.01em;
  color:#fff;
  background:linear-gradient(135deg,#1fa855,#108c42);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 18px 44px rgba(16,140,66,.30), inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.whatsapp-float:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 58px rgba(16,140,66,.36), inset 0 1px 0 rgba(255,255,255,.24);
  filter:saturate(1.05);
}
.whatsapp-float .whatsapp-icon{
  width:1.45em;
  height:1.45em;
}
@media(max-width:620px){
  .whatsapp-float{
    right:16px;
    bottom:16px;
    min-height:50px;
    padding:13px 16px;
    box-shadow:0 14px 34px rgba(16,140,66,.32), inset 0 1px 0 rgba(255,255,255,.22);
  }
  .whatsapp-float span:last-child{
    display:none;
  }
  .whatsapp-float .whatsapp-icon{
    width:1.55em;
    height:1.55em;
  }
}


/* FINAL mobile premium correction: centered phone hero, no sideways overflow, and cleaner text scale. */
@media(max-width:760px){
  body{overflow-x:hidden}
  .hero-luxury{
    display:flex !important;
    flex-direction:column;
    align-items:center !important;
    justify-content:flex-start;
    text-align:center;
    padding-left:16px !important;
    padding-right:16px !important;
    padding-top:28px !important;
    gap:26px !important;
    width:100%;
  }
  .hero-luxury .luxury-copy{
    width:100%;
    max-width:390px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  .hero-luxury .luxury-copy .eyebrow{
    text-align:center;
    letter-spacing:.15em;
    font-size:.72rem;
    line-height:1.45;
  }
  .hero-luxury .luxury-copy h1{
    max-width:100%;
    font-size:clamp(2rem,9.2vw,2.95rem) !important;
    line-height:1.04 !important;
    letter-spacing:-.052em !important;
    text-align:center;
    overflow-wrap:break-word;
    hyphens:auto;
  }
  .hero-luxury .luxury-copy p:not(.eyebrow){
    text-align:center;
    max-width:34ch;
    margin-left:auto;
    margin-right:auto;
  }
  .hero-luxury .actions{
    width:100%;
    max-width:360px;
    margin-left:auto;
    margin-right:auto;
  }
  .premium-carousel{
    order:0 !important;
    display:block !important;
    width:calc(100vw - 32px) !important;
    max-width:390px !important;
    height:420px !important;
    min-height:0 !important;
    margin:0 auto !important;
    align-self:center !important;
    justify-self:center !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    overflow:visible;
  }
  .premium-carousel::before{
    inset:10px !important;
    border-radius:30px !important;
    transform:none !important;
    animation:none !important;
  }
  .carousel-viewport{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    border-radius:30px !important;
    margin:0 auto !important;
  }
  .premium-carousel .slide{
    inset:0 !important;
    padding:14px !important;
    width:100% !important;
    height:100% !important;
  }
  .premium-carousel .slide img{
    width:100% !important;
    height:100% !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 auto !important;
  }
  .premium-carousel figcaption{
    left:16px !important;
    right:16px !important;
    bottom:16px !important;
    justify-content:center;
    text-align:center;
  }
}
@media(max-width:390px){
  .premium-carousel{height:390px !important;max-width:360px !important}
}

/* FINAL mobile Über uns order: keep the photo directly under the Über uns intro, before the long text. */
@media(max-width:760px){
  #ueber-uns{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
    align-items:start;
  }
  #ueber-uns > div{display:contents}
  #ueber-uns .eyebrow{order:1;text-align:center;margin-bottom:0}
  #ueber-uns h2{order:2;text-align:center;margin-bottom:6px}
  #ueber-uns > div > p:first-of-type{order:3;text-align:center;margin:0 auto 8px;max-width:34ch}
  #ueber-uns > .image-frame{
    order:4;
    width:min(100%,340px);
    justify-self:center;
    margin:8px auto 16px;
  }
  #ueber-uns h3{order:5;text-align:left;margin-top:4px}
  #ueber-uns > div > p:not(:first-of-type){order:6;text-align:left}
}

/* FINAL social popup: polished compact button with expandable social contacts. */
.whatsapp-float{display:none !important}
.social-pop{
  position:fixed;
  right:clamp(18px,4vw,34px);
  bottom:clamp(18px,4vw,34px);
  z-index:120;
  display:grid;
  justify-items:end;
  gap:12px;
}
.social-pop-check{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.social-main{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:
    radial-gradient(circle at 35% 28%,rgba(255,255,255,.26),transparent 32%),
    linear-gradient(135deg,#25d366,#128c4a);
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 20px 46px rgba(18,140,74,.34), inset 0 1px 0 rgba(255,255,255,.28);
  cursor:pointer;
  transition:transform .22s ease,box-shadow .22s ease;
}
.social-main:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 26px 58px rgba(18,140,74,.40), inset 0 1px 0 rgba(255,255,255,.30)}
.social-main .whatsapp-icon{width:31px;height:31px}
.social-panel{
  display:grid;
  gap:9px;
  min-width:218px;
  padding:12px;
  border-radius:26px;
  background:rgba(255,253,249,.94);
  border:1px solid rgba(217,161,95,.34);
  box-shadow:0 28px 72px rgba(23,17,13,.24), inset 0 1px 0 rgba(255,255,255,.84);
  backdrop-filter:blur(18px) saturate(145%);
  transform:translateY(10px) scale(.96);
  transform-origin:bottom right;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
}
.social-pop:hover .social-panel,
.social-pop:focus-within .social-panel,
.social-pop-check:checked ~ .social-panel{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.social-item{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:10px 12px;
  border-radius:18px;
  text-decoration:none;
  font-weight:900;
  color:var(--espresso);
  background:rgba(255,255,255,.66);
  border:1px solid rgba(95,47,24,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.80);
}
.social-item:hover{background:linear-gradient(135deg,rgba(217,161,95,.22),rgba(255,255,255,.82))}
.social-item .whatsapp-icon,
.social-item .social-icon{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  color:#128c4a;
  font-size:1.15rem;
}
@media(max-width:760px){
  .social-pop{
    right:16px;
    bottom:calc(16px + env(safe-area-inset-bottom));
  }
  .social-main{
    width:56px;
    height:56px;
  }
  .social-main .whatsapp-icon{width:28px;height:28px}
  .social-panel{
    min-width:205px;
    border-radius:24px;
  }
}


/* LAST MOBILE FIX: slideshow first, centered, text stable, contact popup bottom-right and closeable. */
@media(max-width:760px){
  .hero-luxury{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    max-width:100vw !important;
    padding:22px 16px 44px !important;
    gap:24px !important;
    text-align:center !important;
    overflow:hidden !important;
  }
  .hero-luxury .premium-carousel{
    order:-1 !important;
    flex:0 0 auto !important;
    width:min(100%,392px) !important;
    max-width:392px !important;
    height:clamp(330px,78vw,430px) !important;
    min-height:0 !important;
    margin:0 auto 6px !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    align-self:center !important;
    justify-self:center !important;
  }
  .hero-luxury .carousel-viewport{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
  }
  .hero-luxury .premium-carousel::before{
    inset:10px !important;
    transform:none !important;
  }
  .hero-luxury .luxury-copy{
    order:0 !important;
    width:100% !important;
    max-width:392px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }
  .hero-luxury .luxury-copy .eyebrow{
    max-width:28ch !important;
    margin:0 auto 12px !important;
    text-align:center !important;
    font-size:.78rem !important;
    letter-spacing:.16em !important;
  }
  .hero-luxury .luxury-copy h1{
    max-width:9.2em !important;
    margin:0 auto 16px !important;
    text-align:center !important;
    font-size:clamp(2.15rem,10vw,3.15rem) !important;
    line-height:1.02 !important;
    letter-spacing:-.055em !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:auto !important;
  }
  .hero-luxury .luxury-copy p:not(.eyebrow){
    max-width:31ch !important;
    margin:0 auto !important;
    text-align:center !important;
    font-size:1rem !important;
    line-height:1.55 !important;
  }
  .hero-luxury .actions{
    width:100% !important;
    max-width:340px !important;
    margin:22px auto 0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .hero-luxury .actions .btn{
    width:100% !important;
  }
}

@media(max-width:390px){
  .hero-luxury .premium-carousel{
    width:100% !important;
    max-width:360px !important;
    height:350px !important;
  }
  .hero-luxury .luxury-copy h1{
    font-size:2.12rem !important;
  }
}

/* Closeable social popup: no hover/focus auto-open, always fixed at the bottom-right. */
.social-pop{
  position:fixed !important;
  right:18px !important;
  bottom:calc(18px + env(safe-area-inset-bottom)) !important;
  z-index:999 !important;
  display:grid !important;
  justify-items:end !important;
  gap:10px !important;
  pointer-events:none !important;
}
.social-main{
  pointer-events:auto !important;
  position:relative !important;
  width:58px !important;
  height:58px !important;
  border:0 !important;
  padding:0 !important;
  border-radius:999px !important;
  display:grid !important;
  place-items:center !important;
  color:#fff !important;
  background:linear-gradient(135deg,#25d366,#128c4a) !important;
  box-shadow:0 18px 44px rgba(18,140,74,.36),0 0 0 8px rgba(37,211,102,.10) !important;
}
.social-main::after{content:none !important}
.social-main .whatsapp-icon{width:30px !important;height:30px !important}
.social-plus{
  position:absolute;
  right:-3px;
  top:-4px;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff8ef;
  color:#128c4a;
  font-weight:900;
  font-size:18px;
  line-height:1;
  box-shadow:0 8px 18px rgba(23,17,13,.18);
  transition:transform .22s ease;
}
.social-pop.open .social-plus{transform:rotate(45deg)}
.social-panel{
  pointer-events:none !important;
  position:absolute !important;
  right:0 !important;
  bottom:72px !important;
  min-width:222px !important;
  max-width:calc(100vw - 34px) !important;
  padding:10px !important;
  border-radius:24px !important;
  opacity:0 !important;
  visibility:hidden !important;
  transform:translateY(8px) scale(.96) !important;
  transform-origin:bottom right !important;
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease !important;
}
.social-pop:hover .social-panel,
.social-pop:focus-within .social-panel,
.social-pop-check:checked ~ .social-panel{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(8px) scale(.96) !important;
}
.social-pop.open .social-panel{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateY(0) scale(1) !important;
}
.social-item{
  min-height:44px !important;
  border-radius:16px !important;
  font-size:.94rem !important;
}
@media(max-width:760px){
  .social-pop{
    right:14px !important;
    bottom:calc(18px + env(safe-area-inset-bottom)) !important;
  }
  .social-main{
    width:54px !important;
    height:54px !important;
  }
  .social-main .whatsapp-icon{width:28px !important;height:28px !important}
  .social-panel{
    bottom:66px !important;
    min-width:210px !important;
  }
}


/* Elegant map overview for the contact page. */
.map-section{padding-top:28px}
.map-overview-card{
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);
  gap:clamp(24px,4vw,48px);
  align-items:stretch;
  padding:clamp(22px,3vw,36px);
  border-radius:34px;
  border:1px solid rgba(95,47,24,.16);
  background:
    radial-gradient(circle at 12% 14%,rgba(217,161,95,.18),transparent 20rem),
    linear-gradient(135deg,rgba(255,253,249,.92),rgba(245,234,219,.78));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.map-visual{
  position:relative;
  min-height:360px;
  border-radius:28px;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(95,47,24,.08) 1px,transparent 1px),
    linear-gradient(rgba(95,47,24,.08) 1px,transparent 1px),
    radial-gradient(circle at 45% 48%,rgba(217,161,95,.34),transparent 9rem),
    linear-gradient(135deg,#fff8ef,#ead9c5);
  background-size:54px 54px,54px 54px,auto,auto;
  border:1px solid rgba(95,47,24,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
}
.map-visual::before{
  content:"";
  position:absolute;
  inset:22px;
  border-radius:22px;
  border:1px dashed rgba(95,47,24,.24);
}
.map-pin{
  position:absolute;
  left:50%;top:48%;
  transform:translate(-50%,-50%);
  z-index:4;
  display:grid;
  place-items:center;
  width:82px;height:82px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--espresso),var(--mahogany) 60%,var(--gold));
  color:#fff8ef;
  font-size:2.5rem;
  box-shadow:0 24px 55px rgba(95,47,24,.28),0 0 0 16px rgba(217,161,95,.14);
}
.map-pin::after{
  content:"Bolt Bier-Art";
  position:absolute;
  top:92px;
  white-space:nowrap;
  padding:8px 13px;
  border-radius:999px;
  background:rgba(255,253,249,.90);
  color:var(--espresso);
  font-size:.82rem;
  font-weight:900;
  box-shadow:0 12px 28px rgba(39,22,12,.10);
}
.map-route{
  position:absolute;
  height:12px;
  border-radius:999px;
  background:rgba(185,118,63,.34);
  box-shadow:0 0 0 1px rgba(255,255,255,.45) inset;
}
.route-one{width:74%;left:-8%;top:32%;transform:rotate(18deg)}
.route-two{width:88%;right:-14%;bottom:30%;transform:rotate(-16deg);background:rgba(36,60,50,.24)}
.route-three{width:58%;left:20%;top:62%;transform:rotate(38deg);background:rgba(217,161,95,.36)}
.map-details{align-self:center}
.map-details h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,3.6vw,3.7rem);line-height:1.03;letter-spacing:-.045em;margin:0 0 18px}
.map-details p{color:var(--muted)}
.address-card{
  display:flex;
  align-items:center;
  gap:14px;
  margin:24px 0;
  padding:17px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(95,47,24,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.address-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:rgba(217,161,95,.20);font-size:1.5rem;flex:0 0 auto}
.address-card strong,.address-card span{display:block}.address-card span{color:var(--muted)}
.map-actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:820px){
  .map-overview-card{grid-template-columns:1fr;padding:20px;border-radius:28px}
  .map-visual{min-height:280px;order:2}
  .map-actions .btn{width:100%}
}

/* Luxury menu button upgrade only: premium Swiss-lounge feel, rest untouched. */
.menu-toggle{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-width:128px;
  min-height:54px;
  padding:0 18px 0 20px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,226,177,.52) !important;
  background:
    linear-gradient(135deg,rgba(255,231,189,.18),rgba(255,255,255,.04) 20%,rgba(64,30,18,.08) 36%),
    radial-gradient(circle at 24% 12%,rgba(255,226,177,.40),transparent 34%),
    linear-gradient(135deg,#1b0d08 0%,#4a2112 45%,#7a3f20 100%) !important;
  color:#fff8ed !important;
  box-shadow:
    0 18px 42px rgba(79,38,20,.30),
    0 5px 14px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -12px 24px rgba(0,0,0,.16) !important;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-size:0 !important;
}
.menu-toggle::before{
  content:"Menu" !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  font-size:.76rem !important;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-right:13px;
  text-shadow:0 1px 12px rgba(255,226,177,.28);
}
.menu-toggle::after{
  content:"" !important;
  width:31px;
  height:31px;
  flex:0 0 31px;
  border-radius:999px;
  background:
    linear-gradient(#fff8ed,#fff8ed) center 9px/15px 2px no-repeat,
    linear-gradient(#fff8ed,#fff8ed) center 15px/15px 2px no-repeat,
    linear-gradient(#fff8ed,#fff8ed) center 21px/15px 2px no-repeat,
    radial-gradient(circle at 35% 24%,rgba(255,255,255,.48),transparent 36%),
    rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 10px 20px rgba(0,0,0,.16);
  transform:none !important;
  transition:transform .28s ease, background .28s ease;
}
.menu-toggle span{position:relative;z-index:2}
.menu-toggle:before,.menu-toggle:after{position:relative;z-index:2}
.menu-toggle:hover{
  transform:translateY(-3px) scale(1.015) !important;
  box-shadow:
    0 24px 54px rgba(79,38,20,.38),
    0 8px 18px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -12px 24px rgba(0,0,0,.14) !important;
}
.menu-toggle[aria-expanded="true"]::before{content:"Close" !important;}
.menu-toggle[aria-expanded="true"]::after{
  background:
    linear-gradient(#fff8ed,#fff8ed) center/17px 2px no-repeat,
    linear-gradient(#fff8ed,#fff8ed) center/17px 2px no-repeat,
    radial-gradient(circle at 35% 24%,rgba(255,255,255,.48),transparent 36%),
    rgba(255,255,255,.12);
  transform:rotate(45deg) !important;
}
.menu-toggle[aria-expanded="true"]::after{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 10px 20px rgba(0,0,0,.16);
}
.menu-toggle[aria-expanded="true"]{
  background:
    radial-gradient(circle at 24% 12%,rgba(255,226,177,.38),transparent 34%),
    linear-gradient(135deg,#7a3f20 0%,#4a2112 50%,#1b0d08 100%) !important;
}
.menu-toggle::marker{display:none}
.menu-toggle:empty::before{content:"Menu" !important;}
.site-header .menu-toggle{
  backdrop-filter:blur(18px) saturate(150%);
}
.site-header .menu-toggle:before{
  animation:menuTextGlow 4.8s ease-in-out infinite alternate;
}
.site-header .menu-toggle:after{
  animation:menuIconBreath 4.8s ease-in-out infinite alternate;
}
.menu-toggle .unused{display:none}
@keyframes menuTextGlow{from{text-shadow:0 1px 10px rgba(255,226,177,.20)}to{text-shadow:0 1px 18px rgba(255,226,177,.48)}}
@keyframes menuIconBreath{from{filter:drop-shadow(0 0 0 rgba(255,226,177,0))}to{filter:drop-shadow(0 0 9px rgba(255,226,177,.28))}}

.nav{
  border-color:rgba(255,226,177,.38) !important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,226,177,.28),transparent 18rem),
    linear-gradient(145deg,rgba(255,253,249,.985),rgba(255,244,229,.955)) !important;
  box-shadow:
    0 42px 110px rgba(23,17,13,.34),
    0 12px 30px rgba(95,47,24,.15),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
}
.nav a{
  background:linear-gradient(135deg,rgba(255,255,255,.74),rgba(255,248,239,.46)) !important;
}
.nav a:hover,.nav a.active{
  background:linear-gradient(135deg,rgba(255,226,177,.34),rgba(255,255,255,.80)) !important;
}

@media(max-width:760px){
  .menu-toggle{
    min-width:82px !important;
    min-height:58px !important;
    padding:0 12px !important;
    border-radius:22px !important;
    gap:8px !important;
  }
  .menu-toggle::before{
    content:"" !important;
    width:18px;
    height:18px;
    margin:0 2px 0 0;
    border-radius:7px;
    background:
      linear-gradient(#fff8ed,#fff8ed) center 4px/18px 2px no-repeat,
      linear-gradient(#fff8ed,#fff8ed) center 9px/18px 2px no-repeat,
      linear-gradient(#fff8ed,#fff8ed) center 14px/18px 2px no-repeat !important;
  }
  .menu-toggle::after{
    width:30px;
    height:30px;
    flex-basis:30px;
    background:
      linear-gradient(#fff8ed,#fff8ed) 12px center/13px 2px no-repeat,
      linear-gradient(45deg,transparent 48%,#fff8ed 49% 58%,transparent 59%) 14px 8px/10px 10px no-repeat,
      linear-gradient(-45deg,transparent 48%,#fff8ed 49% 58%,transparent 59%) 14px 12px/10px 10px no-repeat,
      radial-gradient(circle at 35% 24%,rgba(255,255,255,.45),transparent 36%),
      rgba(255,255,255,.10) !important;
  }
  .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    background:
      linear-gradient(45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/20px 20px no-repeat,
      linear-gradient(-45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/20px 20px no-repeat !important;
  }
  .menu-toggle[aria-expanded="true"]::after{transform:rotate(45deg) !important;}
}

/* Gastronomie creative photo feature + shop PDF overview, added without changing existing content. */
.gastro-feature-section{padding-top:18px}
.gastro-showpiece{
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);
  gap:clamp(24px,4vw,54px);
  align-items:center;
  padding:clamp(18px,2.6vw,30px);
  border-radius:38px;
  border:1px solid rgba(217,161,95,.30);
  background:
    radial-gradient(circle at 18% 8%,rgba(217,161,95,.20),transparent 22rem),
    linear-gradient(135deg,rgba(255,253,249,.92),rgba(245,234,219,.78));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.gastro-panorama{
  position:relative;
  min-height:430px;
  margin:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(95,47,24,.14);
  background:linear-gradient(135deg,#21130f,#5a321d);
  box-shadow:0 28px 70px rgba(39,22,12,.18),inset 0 1px 0 rgba(255,255,255,.18);
}
.gastro-panorama::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url('gastronomie-brau-stuebli-overview.jpg');
  background-size:cover;
  background-position:center;
  filter:blur(24px) saturate(1.05) brightness(.78);
  transform:scale(1.10);
  opacity:.70;
}
.gastro-panorama::after{
  content:"";
  position:absolute;
  inset:16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.22);
  pointer-events:none;
}
.gastro-halo{
  position:absolute;
  inset:auto 10% -20% 10%;
  height:160px;
  border-radius:50%;
  background:rgba(217,161,95,.24);
  filter:blur(28px);
}
.gastro-panorama img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  max-height:470px;
  object-fit:contain;
  object-position:center;
  padding:14px;
  border-radius:26px;
  filter:drop-shadow(0 24px 44px rgba(0,0,0,.30));
}
.gastro-feature-copy h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,3.6vw,3.8rem);line-height:1.03;letter-spacing:-.045em;margin:0 0 18px}
.gastro-feature-copy p:not(.eyebrow){color:var(--muted)}
.shop-price-section{padding-top:0}
.price-overview-card{
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(320px,.88fr) minmax(0,1.12fr);
  gap:clamp(24px,4vw,54px);
  align-items:stretch;
  padding:clamp(22px,3vw,34px);
  border-radius:38px;
  border:1px solid rgba(217,161,95,.30);
  background:
    radial-gradient(circle at 12% 0%,rgba(217,161,95,.20),transparent 20rem),
    linear-gradient(135deg,rgba(255,253,249,.94),rgba(245,234,219,.78));
  box-shadow:var(--shadow);
}
.price-overview-copy h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,3.6vw,3.8rem);line-height:1.03;letter-spacing:-.045em;margin:0 0 18px}
.price-overview-copy p:not(.eyebrow){color:var(--muted)}
.price-pills{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 26px}
.price-pills span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  border-radius:999px;
  padding:8px 13px;
  background:rgba(255,255,255,.70);
  border:1px solid rgba(95,47,24,.12);
  color:var(--espresso);
  font-weight:850;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
.pdf-preview-card{
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:30px;
  background:linear-gradient(135deg,rgba(36,22,17,.08),rgba(217,161,95,.10));
  border:1px solid rgba(95,47,24,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}
.pdf-preview{
  width:100%;
  min-height:560px;
  border:0;
  border-radius:22px;
  background:#fff;
  box-shadow:0 20px 55px rgba(39,22,12,.12);
}
@media(max-width:900px){
  .gastro-showpiece,.price-overview-card{grid-template-columns:1fr;border-radius:30px}
  .gastro-panorama{min-height:340px}
  .gastro-panorama img{max-height:380px}
  .pdf-preview{min-height:460px}
}
@media(max-width:620px){
  .gastro-feature-section{padding-top:6px}
  .gastro-showpiece,.price-overview-card{padding:16px;border-radius:26px}
  .gastro-panorama{min-height:280px;border-radius:22px}
  .gastro-panorama::after{inset:10px;border-radius:16px}
  .gastro-panorama img{max-height:310px;padding:10px;border-radius:18px}
  .price-pills span{width:100%;justify-content:center;text-align:center}
  .pdf-preview{min-height:390px;border-radius:18px}
}

/* Shop creative photo display: full image visible, no cropping. */
.shop-creative-gallery{
  position:relative;
  display:grid;
  gap:16px;
  padding:18px;
  border-radius:var(--radius);
  background:
    radial-gradient(circle at 20% 8%,rgba(217,161,95,.22),transparent 18rem),
    linear-gradient(135deg,rgba(255,253,249,.92),rgba(245,234,219,.72));
  border:1px solid rgba(217,161,95,.28);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.shop-creative-gallery::before{
  content:"";
  position:absolute;
  inset:14px;
  border:1px solid rgba(95,47,24,.10);
  border-radius:calc(var(--radius) - 10px);
  pointer-events:none;
}
.shop-panorama{
  position:relative;
  z-index:1;
  margin:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:24px;
  background:linear-gradient(135deg,#fff8ef,#efe1cf);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 18px 45px rgba(39,22,12,.12);
}
.shop-panorama.primary{aspect-ratio:16 / 7;}
.shop-panorama.secondary{aspect-ratio:16 / 7;transform:translateX(22px);max-width:88%;justify-self:end;}
.shop-panorama img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  display:block;
  padding:8px;
}
.shop-gallery-note{
  position:absolute;
  left:28px;
  bottom:28px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:11px 15px;
  border-radius:999px;
  background:rgba(255,248,239,.90);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 16px 34px rgba(39,22,12,.14);
  backdrop-filter:blur(12px);
  color:var(--espresso);
}
.shop-gallery-note span{font-size:1.18rem;}
.shop-gallery-note strong{line-height:1;font-size:.94rem;}
@media(max-width:760px){
  .shop-creative-gallery{padding:14px;border-radius:24px;gap:12px;}
  .shop-creative-gallery::before{inset:10px;border-radius:18px;}
  .shop-panorama.primary,.shop-panorama.secondary{aspect-ratio:16 / 9;max-width:100%;transform:none;justify-self:stretch;}
  .shop-panorama img{padding:6px;}
  .shop-gallery-note{position:relative;left:auto;bottom:auto;justify-content:center;border-radius:18px;margin-top:2px;}
}

/* Premium Swiss brewery restaurant background refinement: clean, realistic, balanced, text-friendly. */
:root{
  --swiss-cream:#fbf6ee;
  --swiss-paper:#fffaf3;
  --swiss-oak:#b98250;
  --swiss-walnut:#3b2218;
  --swiss-copper:#a76334;
  --swiss-stone:#ece3d8;
}
html{
  background:#fbf6ee;
}
body{
  background:
    linear-gradient(180deg,rgba(255,250,243,.96),rgba(248,240,229,.96) 48%,rgba(255,250,243,.98)),
    repeating-linear-gradient(90deg,rgba(96,58,35,.030) 0 1px,transparent 1px 120px),
    repeating-linear-gradient(0deg,rgba(96,58,35,.020) 0 1px,transparent 1px 68px),
    #fbf6ee !important;
}
body::before{
  opacity:.18 !important;
  background-image:
    linear-gradient(90deg,transparent 0 18%,rgba(118,78,48,.045) 18% 18.5%,transparent 18.5% 100%),
    linear-gradient(180deg,rgba(255,255,255,.18),rgba(104,63,38,.035));
  background-size:260px 100%,100% 100%;
  mask-image:linear-gradient(to bottom,black 0%,black 58%,transparent 100%) !important;
}
.site-header{
  background:rgba(255,250,243,.91) !important;
  border-bottom:1px solid rgba(72,42,26,.13) !important;
  box-shadow:0 10px 30px rgba(43,25,16,.07) !important;
}
.hero-luxury{
  background:
    linear-gradient(90deg,rgba(31,18,13,.84),rgba(59,34,24,.74) 48%,rgba(95,56,34,.68)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 96px),
    linear-gradient(135deg,#2f1b13,#5f3721 58%,#7d4929) !important;
}
.hero-luxury::before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.06) 58%,rgba(0,0,0,.18)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 74px),
    repeating-linear-gradient(90deg,rgba(0,0,0,.055) 0 1px,transparent 1px 150px) !important;
}
.premium-carousel::before,
.hero-slideshow::before{
  background:linear-gradient(135deg,rgba(255,250,243,.16),rgba(185,118,63,.08)) !important;
  filter:none !important;
}
.carousel-viewport{
  background:
    linear-gradient(145deg,rgba(255,250,243,.10),rgba(33,20,15,.54)) !important;
}
.page-hero,
.alt{
  background:
    linear-gradient(135deg,rgba(255,250,243,.95),rgba(241,231,218,.88)),
    repeating-linear-gradient(90deg,rgba(95,47,24,.025) 0 1px,transparent 1px 92px) !important;
}
.section:not(.newsletter),
.content{
  background-image:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0)) !important;
}
.card,.info-card,.product-card,.post-card,.form,.gastro-showpiece,.price-overview-card,.shop-creative-gallery{
  background:
    linear-gradient(145deg,rgba(255,252,247,.94),rgba(247,238,227,.88)) !important;
  border-color:rgba(95,47,24,.14) !important;
  box-shadow:0 22px 58px rgba(43,25,16,.10) !important;
}
.newsletter{
  background:
    linear-gradient(135deg,rgba(26,47,39,.98),rgba(17,31,26,.98)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 88px) !important;
}
.newsletter::before{
  background:rgba(185,118,63,.14) !important;
  filter:blur(16px) !important;
}
.footer{
  background:
    linear-gradient(135deg,#1d120e,#2b1a13 58%,#1a100d) !important;
}
@media(max-width:760px){
  body{
    background:
      linear-gradient(180deg,rgba(255,250,243,.98),rgba(248,240,229,.98) 54%,rgba(255,250,243,.98)),
      repeating-linear-gradient(90deg,rgba(96,58,35,.025) 0 1px,transparent 1px 86px),
      #fbf6ee !important;
  }
  .hero-luxury{
    background:
      linear-gradient(180deg,rgba(43,25,18,.92),rgba(74,43,27,.88)),
      repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 86px),
      #442719 !important;
  }
}


/* PDF preview shown as a static image only, so visitors can view it without browser edit controls. */
.pdf-preview-image{
  display:block;
  height:auto;
  min-height:0;
  max-height:640px;
  object-fit:contain;
  object-position:center top;
  padding:10px;
}
@media(max-width:900px){.pdf-preview-image{min-height:0;max-height:none}}

/* Elegant press preview for Zürcher Oberländer article: full image visible, no cropping. */
.press-card{
  overflow:hidden;
}
.press-preview{
  position:relative;
  display:grid;
  place-items:center;
  margin:-10px -10px 18px;
  padding:16px;
  border-radius:26px;
  background:
    linear-gradient(145deg,rgba(255,253,249,.98),rgba(241,231,218,.84)),
    radial-gradient(circle at 18% 6%,rgba(217,161,95,.16),transparent 18rem);
  border:1px solid rgba(95,47,24,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 22px 52px rgba(43,25,16,.10);
  overflow:hidden;
}
.press-preview::before{
  content:"Presse";
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,248,239,.88);
  border:1px solid rgba(255,255,255,.68);
  color:var(--espresso);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  box-shadow:0 12px 28px rgba(43,25,16,.12);
  backdrop-filter:blur(10px);
}
.press-preview img{
  width:100%;
  height:auto;
  max-height:580px;
  object-fit:contain;
  object-position:center top;
  display:block;
  border-radius:18px;
  box-shadow:0 16px 42px rgba(43,25,16,.14);
  background:#fff;
}
@media(max-width:760px){
  .press-preview{padding:12px;border-radius:22px;margin:-6px -6px 16px;}
  .press-preview img{max-height:none;border-radius:16px;}
}

/* Elegant Dirnd’l Aktion preview: full user photo visible, no cropping. */
.dirndl-action-preview{
  position:relative;
  display:grid;
  place-items:center;
  margin:-10px -10px 18px;
  padding:16px;
  border-radius:26px;
  background:
    linear-gradient(145deg,rgba(255,253,249,.98),rgba(241,231,218,.86)),
    radial-gradient(circle at 20% 10%,rgba(145,22,38,.13),transparent 20rem);
  border:1px solid rgba(95,47,24,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 22px 52px rgba(43,25,16,.10);
  overflow:hidden;
}
.dirndl-action-preview::before{
  content:"Aktion";
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,248,239,.9);
  border:1px solid rgba(255,255,255,.72);
  color:var(--espresso);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  box-shadow:0 12px 28px rgba(43,25,16,.12);
  backdrop-filter:blur(10px);
}
.dirndl-action-preview img{
  width:100%;
  height:auto;
  max-height:580px;
  object-fit:contain;
  object-position:center center;
  display:block;
  border-radius:18px;
  box-shadow:0 16px 42px rgba(43,25,16,.14);
  background:#fffaf4;
}
@media(max-width:760px){
  .dirndl-action-preview{padding:12px;border-radius:22px;margin:-6px -6px 16px;}
  .dirndl-action-preview img{max-height:none;border-radius:16px;}
}

/* FINAL LAUNCH POLISH — simple Swiss luxury palette + strict no-crop media. */
:root{
  --ink:#150f0b;
  --espresso:#1f130d;
  --mahogany:#4a2618;
  --copper:#9b6339;
  --gold:#c99250;
  --champagne:#f8f1e7;
  --linen:#efe4d6;
  --porcelain:#fffaf3;
  --sage:#20372e;
  --muted:#6f6258;
  --line:rgba(66,38,24,.15);
  --shadow:0 28px 80px rgba(31,19,13,.12);
  --shadow-soft:0 16px 42px rgba(31,19,13,.08);
}
body{
  background:
    radial-gradient(circle at 12% -8%,rgba(201,146,80,.12),transparent 30rem),
    linear-gradient(180deg,#fbf7f0 0%,#f2e8da 54%,#fbf7f0 100%) !important;
  color:var(--ink) !important;
}
body::before{
  opacity:.12 !important;
  background-image:
    linear-gradient(90deg,rgba(92,59,38,.06) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.55),rgba(98,61,39,.03)) !important;
  background-size:132px 100%,100% 100% !important;
}
.site-header{
  background:rgba(255,250,243,.94) !important;
  box-shadow:0 18px 48px rgba(31,19,13,.08) !important;
}
.card,.info-card,.product-card,.post-card,.form,.gastro-showpiece,.price-overview-card,.shop-creative-gallery{
  background:linear-gradient(145deg,rgba(255,252,247,.98),rgba(244,236,226,.92)) !important;
  border:1px solid rgba(74,38,24,.14) !important;
  box-shadow:0 24px 64px rgba(31,19,13,.10) !important;
}
.card:hover,.info-card:hover,.product-card:hover,.post-card:hover{
  transform:translateY(-3px) !important;
  box-shadow:0 34px 86px rgba(31,19,13,.14) !important;
}
.btn.primary,button{
  background:linear-gradient(135deg,#24140d,#5c2f1d) !important;
  color:#fffaf3 !important;
}
.newsletter{
  background:linear-gradient(135deg,#183128,#101f1a) !important;
}

/* Never crop user-provided article/news images. The frame adapts to the photo. */
.post-card figure.no-crop-photo,
.post-card .card-photo.no-crop-photo,
.post-card .press-preview.no-crop-photo,
.post-card .dirndl-action-preview.no-crop-photo{
  aspect-ratio:auto !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  display:block !important;
  overflow:visible !important;
  padding:18px !important;
  margin:-10px -10px 20px !important;
  border-radius:28px !important;
  background:linear-gradient(145deg,#fffaf3,#efe2d2) !important;
  border:1px solid rgba(74,38,24,.15) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 22px 56px rgba(31,19,13,.11) !important;
}
.post-card figure.no-crop-photo::after,
.post-card .card-photo.no-crop-photo::after,
.post-card .press-preview.no-crop-photo::after,
.post-card .dirndl-action-preview.no-crop-photo::after{
  display:none !important;
}
.post-card figure.no-crop-photo img,
.post-card .card-photo.no-crop-photo img,
.post-card .press-preview.no-crop-photo img,
.post-card .dirndl-action-preview.no-crop-photo img{
  position:relative !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  padding:0 !important;
  border-radius:20px !important;
  background:#fff !important;
  transform:none !important;
  box-shadow:0 18px 44px rgba(31,19,13,.12) !important;
}
.post-card figure.no-crop-photo:hover img,
.post-card .card-photo.no-crop-photo:hover img,
.post-card .press-preview.no-crop-photo:hover img,
.post-card .dirndl-action-preview.no-crop-photo:hover img{
  transform:none !important;
}

/* Keep the opening poster readable and fully visible. */
.post-card .card-photo.no-crop-photo img[src*="eroeffnung"]{
  max-width:min(100%,680px) !important;
  margin-inline:auto !important;
}

@media(max-width:760px){
  .post-card figure.no-crop-photo,
  .post-card .card-photo.no-crop-photo,
  .post-card .press-preview.no-crop-photo,
  .post-card .dirndl-action-preview.no-crop-photo{
    padding:12px !important;
    margin:-6px -6px 18px !important;
    border-radius:22px !important;
  }
  .post-card figure.no-crop-photo img,
  .post-card .card-photo.no-crop-photo img,
  .post-card .press-preview.no-crop-photo img,
  .post-card .dirndl-action-preview.no-crop-photo img{
    border-radius:16px !important;
  }
  .content.grid-2{gap:22px !important;}
}

/* News page: clean creator row + elegant like button, no extra marks/text clutter. */
.news-grid .news-post{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.post-author{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:2px;
  color:var(--espresso);
}
.author-avatar{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,#fffaf3,#eadbc9);
  border:1px solid rgba(74,38,24,.16);
  box-shadow:0 12px 28px rgba(31,19,13,.10), inset 0 1px 0 rgba(255,255,255,.82);
  font-size:1.1rem;
}
.post-author strong{
  display:block;
  font-size:.95rem;
  letter-spacing:.01em;
}
.post-author small{
  display:block;
  margin-top:1px;
  color:var(--muted);
  font-size:.78rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.news-post .eyebrow{display:none !important;}
.post-actions{
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid rgba(74,38,24,.12);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.post-actions > a{
  font-weight:900;
  color:var(--mahogany);
  text-decoration:none;
}
.like-button{
  width:auto !important;
  min-height:42px !important;
  padding:9px 15px !important;
  border-radius:999px !important;
  background:rgba(255,250,243,.86) !important;
  color:var(--espresso) !important;
  border:1px solid rgba(74,38,24,.16) !important;
  box-shadow:0 12px 28px rgba(31,19,13,.08) !important;
  font-weight:900;
  gap:8px;
}
.like-button::after{display:none !important;}
.like-button .heart{
  font-size:1.25rem;
  line-height:1;
  color:#b64b3b;
  transition:transform .2s ease;
}
.like-button:hover .heart{transform:scale(1.15);}
.like-button.is-liked{
  background:linear-gradient(135deg,#fff0ec,#fffaf3) !important;
  border-color:rgba(182,75,59,.32) !important;
}
.like-button.is-liked .heart{color:#c83b2d;}
@media(max-width:760px){
  .post-actions{align-items:stretch;}
  .like-button{min-width:132px;}
  .like-text{display:none;}
}


/* === Final targeted fixes: mobile menu, premium beer slide, and real map embed === */
.menu-toggle{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  white-space:nowrap;
  line-height:1;
}
.menu-toggle::before,
.menu-toggle::after{
  content:none !important;
}
.menu-toggle{
  font-size:0 !important;
}
.menu-toggle .menu-icon-lines,
.menu-toggle .menu-icon-orb{
  position:relative;
  z-index:1;
  display:block;
  flex:0 0 auto;
}
.menu-toggle .menu-icon-lines{
  width:19px;
  height:13px;
  border-radius:6px;
  background:
    linear-gradient(#fff8ed,#fff8ed) center 1px/19px 2px no-repeat,
    linear-gradient(#fff8ed,#fff8ed) center 6px/19px 2px no-repeat,
    linear-gradient(#fff8ed,#fff8ed) center 11px/19px 2px no-repeat;
}
.menu-toggle .menu-icon-orb{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.26);
  background:
    linear-gradient(#fff8ed,#fff8ed) center/16px 2px no-repeat,
    linear-gradient(45deg,transparent 47%,#fff8ed 48% 56%,transparent 57%) 18px 10px/10px 10px no-repeat,
    linear-gradient(-45deg,transparent 47%,#fff8ed 48% 56%,transparent 57%) 18px 15px/10px 10px no-repeat,
    radial-gradient(circle at 32% 24%,rgba(255,255,255,.28),transparent 38%),
    rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 16px rgba(0,0,0,.14);
}
.menu-toggle[aria-expanded="true"] .menu-icon-lines{
  background:
    linear-gradient(45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/20px 20px no-repeat,
    linear-gradient(-45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/20px 20px no-repeat;
}
.menu-toggle[aria-expanded="true"] .menu-icon-orb{
  background:
    linear-gradient(45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/18px 18px no-repeat,
    linear-gradient(-45deg,transparent 44%,#fff8ed 45% 55%,transparent 56%) center/18px 18px no-repeat,
    radial-gradient(circle at 32% 24%,rgba(255,255,255,.28),transparent 38%),
    rgba(255,255,255,.10);
}
@media (max-width: 760px){
  .site-header .menu-toggle{
    min-width:84px !important;
    min-height:58px !important;
    padding:0 14px !important;
    border-radius:24px !important;
    gap:10px !important;
    align-self:center;
  }
  .site-header .menu-toggle .menu-icon-orb{
    width:36px;
    height:36px;
  }
}

.map-overview-card--real{
  align-items:stretch;
}
.map-visual--real{
  padding:0 !important;
  overflow:hidden;
  min-height:430px;
  background:#efe8dd;
}
.map-embed{
  display:block;
  width:100%;
  height:100%;
  min-height:430px;
  border:0;
  filter:saturate(1.02) contrast(1.02);
}
@media (max-width:820px){
  .map-visual--real,
  .map-embed{
    min-height:320px;
  }
}

/* Final mobile menu refinement: elegant Swiss-style menu button and popover. */
@media (max-width: 980px){
  .site-header{
    gap:16px;
  }

  .menu-toggle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    min-width:96px !important;
    min-height:58px !important;
    padding:0 16px 0 18px !important;
    border-radius:22px !important;
    border:1px solid rgba(203,181,141,.38) !important;
    background:linear-gradient(135deg,#17372f 0%,#20453c 52%,#2d5a4f 100%) !important;
    color:#f8f3e8 !important;
    font-size:0 !important;
    line-height:0 !important;
    letter-spacing:normal !important;
    text-transform:none !important;
    box-shadow:0 16px 34px rgba(20,42,36,.22), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -10px 20px rgba(0,0,0,.10) !important;
    transform:none !important;
    backdrop-filter:blur(10px) saturate(120%);
  }
  .menu-toggle:hover{
    transform:translateY(-1px) !important;
    box-shadow:0 18px 38px rgba(20,42,36,.26), inset 0 1px 0 rgba(255,255,255,.16), inset 0 -10px 20px rgba(0,0,0,.10) !important;
  }
  .menu-toggle::before,
  .site-header .menu-toggle::before,
  .menu-toggle:empty::before{
    content:"Menü" !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    background:none !important;
    border-radius:0 !important;
    font-size:.82rem !important;
    line-height:1 !important;
    font-weight:900 !important;
    letter-spacing:.14em !important;
    text-transform:uppercase !important;
    color:#f7f1e6 !important;
    text-shadow:none !important;
    animation:none !important;
  }
  .menu-toggle::after,
  .site-header .menu-toggle::after{
    content:"" !important;
    display:block !important;
    width:34px !important;
    height:34px !important;
    flex:0 0 34px !important;
    border-radius:50% !important;
    background:
      linear-gradient(#f7f1e6,#f7f1e6) center 10px/16px 2px no-repeat,
      linear-gradient(#f7f1e6,#f7f1e6) center 16px/16px 2px no-repeat,
      linear-gradient(#f7f1e6,#f7f1e6) center 22px/16px 2px no-repeat,
      rgba(255,255,255,.10) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16) !important;
    transform:none !important;
    animation:none !important;
  }
  .menu-toggle[aria-expanded="true"]{
    background:linear-gradient(135deg,#214b40 0%,#2f6658 58%,#5c8a78 100%) !important;
  }
  .menu-toggle[aria-expanded="true"]::before,
  .site-header .menu-toggle[aria-expanded="true"]::before{
    content:"Schliessen" !important;
  }
  .menu-toggle[aria-expanded="true"]::after,
  .site-header .menu-toggle[aria-expanded="true"]::after{
    background:
      linear-gradient(45deg,transparent 44%,#f7f1e6 45% 55%,transparent 56%) center/16px 16px no-repeat,
      linear-gradient(-45deg,transparent 44%,#f7f1e6 45% 55%,transparent 56%) center/16px 16px no-repeat,
      rgba(255,255,255,.10) !important;
    transform:none !important;
  }

  .nav{
    top:92px !important;
    left:18px !important;
    right:18px !important;
    padding:20px !important;
    border-radius:30px !important;
    border:1px solid rgba(31,72,62,.15) !important;
    background:linear-gradient(180deg,rgba(249,246,239,.985) 0%,rgba(241,236,227,.985) 100%) !important;
    box-shadow:0 36px 80px rgba(22,23,20,.20), 0 10px 24px rgba(33,47,42,.08), inset 0 1px 0 rgba(255,255,255,.92) !important;
    gap:12px !important;
  }
  .nav::before{
    content:"Navigation" !important;
    display:block !important;
    margin:0 0 8px !important;
    padding:0 4px !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:1.05rem !important;
    font-weight:700 !important;
    letter-spacing:-.02em !important;
    color:#17372f !important;
  }
  .nav a,
  .nav a:hover,
  .nav a.active{
    min-height:58px !important;
    display:flex !important;
    align-items:center !important;
    padding:14px 16px !important;
    border-radius:20px !important;
    border:1px solid rgba(31,72,62,.10) !important;
    background:rgba(255,255,255,.72) !important;
    color:#25211d !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.86) !important;
    transform:none !important;
  }
  .nav a:hover,
  .nav a.active{
    background:linear-gradient(135deg,rgba(45,90,79,.08),rgba(255,255,255,.88)) !important;
    border-color:rgba(45,90,79,.18) !important;
  }
  .nav a::before{
    background:rgba(23,55,47,.07) !important;
    color:#2d5a4f !important;
  }
}

/* Final mobile menu button cleanup: single elegant hamburger / close icon only. */
@media (max-width:760px){
  .site-header .menu-toggle,
  .menu-toggle{
    position:relative !important;
    display:grid !important;
    place-items:center !important;
    width:78px !important;
    min-width:78px !important;
    height:58px !important;
    min-height:58px !important;
    padding:0 !important;
    border-radius:24px !important;
    overflow:hidden !important;
    font-size:0 !important;
    line-height:0 !important;
    color:transparent !important;
    text-indent:-9999px !important;
    white-space:nowrap !important;
    letter-spacing:0 !important;
    background:
      radial-gradient(circle at 24% 18%, rgba(255,255,255,.18), transparent 28%),
      linear-gradient(135deg,#22544b 0%, #2b6a5f 42%, #1f433d 100%) !important;
    border:1px solid rgba(255,255,255,.16) !important;
    box-shadow:
      0 14px 32px rgba(18,41,37,.26),
      inset 0 1px 0 rgba(255,255,255,.24),
      inset 0 -8px 16px rgba(0,0,0,.12) !important;
    transform:none !important;
    backdrop-filter:blur(10px) saturate(115%);
  }

  .site-header .menu-toggle::before,
  .menu-toggle::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:26px !important;
    height:2.5px !important;
    margin:0 !important;
    border-radius:999px !important;
    background:#fff9f1 !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -8px 0 #fff9f1, 0 8px 0 #fff9f1 !important;
    animation:none !important;
    filter:none !important;
  }

  .site-header .menu-toggle::after,
  .menu-toggle::after{
    content:none !important;
    display:none !important;
    background:none !important;
    box-shadow:none !important;
  }

  .site-header .menu-toggle:hover,
  .menu-toggle:hover,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle:focus-visible{
    transform:translateY(-1px) !important;
    box-shadow:
      0 18px 38px rgba(18,41,37,.30),
      inset 0 1px 0 rgba(255,255,255,.26),
      inset 0 -8px 16px rgba(0,0,0,.12) !important;
  }

  .site-header .menu-toggle[aria-expanded="true"],
  .menu-toggle[aria-expanded="true"]{
    background:
      radial-gradient(circle at 24% 18%, rgba(255,255,255,.16), transparent 28%),
      linear-gradient(135deg,#1f433d 0%, #255249 52%, #16342f 100%) !important;
  }

  .site-header .menu-toggle[aria-expanded="true"]::before,
  .menu-toggle[aria-expanded="true"]::before{
    width:24px !important;
    height:24px !important;
    background:
      linear-gradient(45deg, transparent 44%, #fff9f1 45% 55%, transparent 56%),
      linear-gradient(-45deg, transparent 44%, #fff9f1 45% 55%, transparent 56%) !important;
    box-shadow:none !important;
    border-radius:0 !important;
  }
}

/* Final correction: mobile menu button shows ONLY three hamburger lines, no text, no extra symbols, no extra circles. */
@media (max-width:760px){
  .menu-toggle,
  .site-header .menu-toggle{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
    padding:0 !important;
    border-radius:28px !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:-9999px !important;
    color:transparent !important;
    overflow:hidden !important;
    position:relative !important;
    background:linear-gradient(145deg,#2a675e 0%, #2d6b61 45%, #234e48 100%) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    box-shadow:0 12px 28px rgba(18,41,37,.22), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -10px 18px rgba(0,0,0,.10) !important;
  }

  .menu-toggle span,
  .site-header .menu-toggle span{
    display:none !important;
  }

  .menu-toggle::after,
  .site-header .menu-toggle::after,
  .menu-toggle[aria-expanded="true"]::after,
  .site-header .menu-toggle[aria-expanded="true"]::after{
    content:none !important;
    display:none !important;
    background:none !important;
    box-shadow:none !important;
    border:none !important;
  }

  .menu-toggle::before,
  .site-header .menu-toggle::before,
  .menu-toggle[aria-expanded="true"]::before,
  .site-header .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:28px !important;
    height:3px !important;
    border-radius:999px !important;
    background:#fff8ef !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -10px 0 #fff8ef, 0 10px 0 #fff8ef !important;
    margin:0 !important;
    filter:none !important;
    animation:none !important;
  }

  .menu-toggle:hover,
  .site-header .menu-toggle:hover,
  .menu-toggle:focus-visible,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle[aria-expanded="true"],
  .site-header .menu-toggle[aria-expanded="true"]{
    background:linear-gradient(145deg,#2a675e 0%, #2d6b61 45%, #234e48 100%) !important;
    transform:none !important;
  }
}

/* ------------------------------------------------------------------ */
/* Dark luxury redesign for mobile nav menu and WhatsApp popup (bar menu) */
/*
   These overrides provide a more professional, matte brown/black palette for the
   collapsible navigation and the floating WhatsApp contact pop‑up. They do not
   alter the HTML structure or functionality. Only appearance and colours are
   changed, using !important to ensure they override prior rules.
*/
@media (max-width:980px){
  /* Navigation fly‑out container: dark background, golden border, generous gaps */
  .nav{
    background:linear-gradient(135deg,rgba(23,17,13,.96),rgba(59,33,22,.92)) !important;
    border:1px solid rgba(217,161,95,.30) !important;
    box-shadow:0 40px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter:blur(20px) saturate(130%) !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .nav::before{
    content:"Navigation" !important;
    grid-column:1/-1 !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:1.5rem !important;
    letter-spacing:-.04em !important;
    color:rgba(255,248,239,.92) !important;
    margin-bottom:8px !important;
  }
  .nav::after{
    background:linear-gradient(135deg,rgba(23,17,13,.96),rgba(59,33,22,.92)) !important;
    border-left:1px solid rgba(217,161,95,.30) !important;
    border-top:1px solid rgba(217,161,95,.30) !important;
  }
  .nav a{
    display:flex !important;
    align-items:center !important;
    min-height:60px !important;
    border-radius:22px !important;
    padding:14px 18px !important;
    background:rgba(36,22,17,.82) !important;
    border:1px solid rgba(217,161,95,.20) !important;
    color:#f5e7d8 !important;
    font-size:.98rem !important;
    font-weight:900 !important;
    letter-spacing:.015em !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
    transition:background .22s ease,border-color .22s ease,transform .22s ease,color .22s ease !important;
  }
  .nav a:hover,
  .nav a.active{
    background:linear-gradient(135deg,rgba(217,161,95,.28),rgba(36,22,17,.88)) !important;
    border-color:rgba(217,161,95,.36) !important;
    color:#fff9f1 !important;
    transform:translateY(-2px) !important;
  }
  .nav a::before{
    width:32px !important;
    height:32px !important;
    margin-right:12px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,rgba(217,161,95,.20),rgba(59,33,22,.30)) !important;
    color:var(--gold) !important;
    display:grid !important;
    place-items:center !important;
    font-size:1rem !important;
  }
}

/* WhatsApp floating button and pop‑up: dark matte with golden highlights */
.social-main{
  background:linear-gradient(135deg,var(--espresso),var(--mahogany)) !important;
  border:1px solid rgba(217,161,95,.30) !important;
  box-shadow:0 20px 46px rgba(59,33,22,.34),inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.social-main .whatsapp-icon{
  color:var(--gold) !important;
}
.social-plus{
  background:var(--espresso) !important;
  color:var(--gold) !important;
  border:1px solid rgba(217,161,95,.30) !important;
  box-shadow:0 8px 18px rgba(23,17,13,.20) !important;
}
.social-panel{
  background:linear-gradient(135deg,rgba(23,17,13,.95),rgba(59,33,22,.90)) !important;
  border:1px solid rgba(217,161,95,.26) !important;
  box-shadow:0 28px 72px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08) !important;
  color:#f5e7d8 !important;
}
.social-item{
  background:rgba(36,22,17,.82) !important;
  border:1px solid rgba(217,161,95,.18) !important;
  color:#f5e7d8 !important;
  font-weight:900 !important;
}
.social-item:hover{
  background:linear-gradient(135deg,rgba(217,161,95,.22),rgba(36,22,17,.86)) !important;
  border-color:rgba(217,161,95,.34) !important;
}
.social-item .whatsapp-icon,
.social-item .social-icon{
  color:var(--gold) !important;
}

/* --------------------------------------------------------------
 * Custom luxury palette and layout overrides
 *
 * These rules redefine the navigation bar and social popup buttons to
 * adopt a brown/black matte colour scheme with golden accents. They
 * also provide global overrides to ensure the homepage slideshow images
 * are fully visible without cropping, removing the faux device frame and
 * allowing the carousel viewport to expand to fit its content. All
 * other parts of the site remain untouched.
 */

/* Dark matte navigation bar with golden highlights */
.site-header{
  background:linear-gradient(135deg,#1a100d 0%,#2d1a13 100%) !important;
  backdrop-filter:blur(12px) saturate(120%) !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.32) !important;
}
/* Hide brand text beside the logo */
.brand span:last-child{
  display:none !important;
}
/* Navigation link styling */
.nav a{
  color:rgba(245,236,225,.88) !important;
  padding:12px 16px !important;
  border-radius:999px !important;
  transition:background .24s ease,color .24s ease,transform .24s ease !important;
}
.nav a:hover,
.nav a.active{
  color:#d4af37 !important;
  background:rgba(212,175,55,.16) !important;
  transform:translateY(-2px) !important;
}
/* Mobile menu toggle button styling */
@media(max-width:980px){
  .menu-toggle{
    display:inline-flex !important;
    background:linear-gradient(135deg,#1a100d,#2d1a13) !important;
    color:#d4af37 !important;
    border-radius:14px !important;
    padding:12px 14px !important;
    box-shadow:0 8px 20px rgba(0,0,0,.36) !important;
  }
  .nav{
    background:linear-gradient(135deg,#1a100d 0%,#2d1a13 100%) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    box-shadow:0 12px 28px rgba(0,0,0,.35) !important;
  }
  .nav a{color:rgba(245,236,225,.92) !important;}
}

/* Social popup: dark luxurious style */
.social-main{
  background:linear-gradient(135deg,#2b1a12,#1a100d) !important;
  border:1px solid rgba(212,175,55,.40) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.46) !important;
  color:#d4af37 !important;
}
.social-main .whatsapp-icon{
  width:28px !important;
  height:28px !important;
  color:inherit !important;
}
.social-plus{
  background:#1f120c !important;
  color:#d4af37 !important;
  border:1px solid rgba(212,175,55,.40) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.32) !important;
}
.social-panel{
  background:linear-gradient(135deg,#1a100d,#2d1a13) !important;
  border:1px solid rgba(212,175,55,.25) !important;
  box-shadow:0 20px 48px rgba(0,0,0,.42) !important;
  backdrop-filter:blur(14px) saturate(125%) !important;
}
.social-item{
  color:rgba(245,236,225,.92) !important;
  background:rgba(26,16,13,.76) !important;
  border:1px solid rgba(212,175,55,.15) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.social-item:hover{
  background:rgba(212,175,55,.18) !important;
}
.social-item .whatsapp-icon,
.social-item .social-icon{
  color:#d4af37 !important;
}

/* Overrides for slideshow cropping */
.premium-carousel::before{
  display:none !important;
}
.premium-carousel .carousel-viewport{
  overflow:visible !important;
  border-radius:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
}
.premium-carousel .slide{
  padding:0 !important;
  transform:translateX(0) scale(1) !important;
}
.premium-carousel .slide img{
  height:auto !important;
  max-height:none !important;
  width:100% !important;
  object-fit:contain !important;
  padding:0 !important;
}
@media(max-width:620px){
  .premium-carousel .slide img{display:none !important;}
  .premium-carousel .slide-bg{
    filter:none !important;
    opacity:1 !important;
    background-size:contain !important;
    background-position:center center !important;
    transform:none !important;
  }
  .premium-carousel .slide-bg::after{display:none !important;}
  .premium-carousel::before{display:none !important;}
}


/* Desktop correction: menu button shows only the same clean three hamburger lines, no text or extra marks. */
@media (min-width:761px){
  .menu-toggle,
  .site-header .menu-toggle{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:56px !important;
    min-height:56px !important;
    max-height:56px !important;
    padding:0 !important;
    border-radius:24px !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:-9999px !important;
    color:transparent !important;
    overflow:hidden !important;
    position:relative !important;
    background:linear-gradient(145deg,#2a675e 0%, #2d6b61 45%, #234e48 100%) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    box-shadow:0 12px 28px rgba(18,41,37,.22), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -10px 18px rgba(0,0,0,.10) !important;
    transform:none !important;
  }

  .menu-toggle span,
  .site-header .menu-toggle span{
    display:none !important;
  }

  .menu-toggle::after,
  .site-header .menu-toggle::after,
  .menu-toggle[aria-expanded="true"]::after,
  .site-header .menu-toggle[aria-expanded="true"]::after{
    content:none !important;
    display:none !important;
    background:none !important;
    box-shadow:none !important;
    border:none !important;
  }

  .menu-toggle::before,
  .site-header .menu-toggle::before,
  .menu-toggle[aria-expanded="true"]::before,
  .site-header .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:28px !important;
    height:3px !important;
    border-radius:999px !important;
    background:#fff8ef !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -10px 0 #fff8ef, 0 10px 0 #fff8ef !important;
    margin:0 !important;
    filter:none !important;
    animation:none !important;
  }

  .menu-toggle:hover,
  .site-header .menu-toggle:hover,
  .menu-toggle:focus-visible,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle[aria-expanded="true"],
  .site-header .menu-toggle[aria-expanded="true"]{
    background:linear-gradient(145deg,#2a675e 0%, #2d6b61 45%, #234e48 100%) !important;
    transform:none !important;
  }
}


/* ==========================================================
   FINAL NAV + WHATSAPP FIX
   Goal: match website colors, remove “clicked button” look,
   keep all HTML/links/IDs/JS untouched.
   ========================================================== */

/* Header / desktop navigation: calm matte brown-black, no pressed pills */
.site-header{
  background:
    linear-gradient(180deg, rgba(14,10,8,.96), rgba(22,13,9,.94)),
    radial-gradient(circle at 85% 0%, rgba(154,94,42,.16), transparent 28rem) !important;
  border-bottom:1px solid rgba(211,166,105,.14) !important;
  box-shadow:0 12px 36px rgba(0,0,0,.28) !important;
}

.brand span:last-child{
  display:none !important;
}

.brand-logo-frame{
  background:linear-gradient(135deg,#fffdf8,#f8efe3) !important;
  border:1px solid rgba(207,164,112,.26) !important;
  box-shadow:0 14px 32px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.92) !important;
}

/* Desktop nav should be text-like, not button-like */
.nav{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.nav a{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:rgba(255,246,234,.76) !important;
  border-radius:0 !important;
  padding:10px 12px !important;
  font-weight:850 !important;
  letter-spacing:.01em !important;
  position:relative !important;
  transform:none !important;
}

.nav a::before{
  display:none !important;
  content:none !important;
}

.nav a::after{
  content:"" !important;
  position:absolute !important;
  left:12px !important;
  right:12px !important;
  bottom:2px !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg, transparent, #c9965b, transparent) !important;
  transform:scaleX(0) !important;
  transform-origin:center !important;
  opacity:.9 !important;
  transition:transform .22s ease, opacity .22s ease !important;
}

.nav a:hover,
.nav a.active{
  color:#f5d1a2 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  transform:none !important;
}

.nav a:hover::after,
.nav a.active::after{
  transform:scaleX(1) !important;
}

/* Desktop: show normal nav, hide hamburger */
@media (min-width:981px){
  .menu-toggle{
    display:none !important;
  }

  .nav{
    display:flex !important;
    position:static !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    grid-template-columns:none !important;
    gap:8px !important;
    padding:0 !important;
  }

  .nav::before,
  .nav::after{
    display:none !important;
    content:none !important;
  }
}

/* Mobile hamburger: matte, not “pressed”, matched with site */
@media (max-width:980px){
  .menu-toggle,
  .site-header .menu-toggle{
    display:grid !important;
    place-items:center !important;
    position:relative !important;
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    min-height:58px !important;
    padding:0 !important;
    border-radius:22px !important;
    border:1px solid rgba(211,166,105,.26) !important;
    background:
      linear-gradient(145deg, #2a1710 0%, #4a2a18 56%, #21120c 100%) !important;
    box-shadow:
      0 18px 42px rgba(0,0,0,.34),
      inset 0 1px 0 rgba(255,255,255,.10),
      inset 0 -10px 20px rgba(0,0,0,.18) !important;
    color:#f6e1c8 !important;
    transform:none !important;
    filter:none !important;
  }

  .menu-toggle span,
  .site-header .menu-toggle span{
    display:none !important;
  }

  .menu-toggle::before,
  .site-header .menu-toggle::before,
  .menu-toggle[aria-expanded="true"]::before,
  .site-header .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:26px !important;
    height:2.5px !important;
    border-radius:999px !important;
    background:#f7e4ce !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -8px 0 #f7e4ce, 0 8px 0 #f7e4ce !important;
    margin:0 !important;
  }

  .menu-toggle::after,
  .site-header .menu-toggle::after{
    display:none !important;
    content:none !important;
  }

  .menu-toggle:hover,
  .site-header .menu-toggle:hover,
  .menu-toggle:focus-visible,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle[aria-expanded="true"],
  .site-header .menu-toggle[aria-expanded="true"]{
    background:
      linear-gradient(145deg, #2a1710 0%, #4a2a18 56%, #21120c 100%) !important;
    transform:none !important;
    box-shadow:
      0 18px 42px rgba(0,0,0,.34),
      inset 0 1px 0 rgba(255,255,255,.10),
      inset 0 -10px 20px rgba(0,0,0,.18) !important;
  }

  /* Dark overview menu: compact tab cards, no white/grey “wrong” pills */
  body.menu-open::after{
    background:
      radial-gradient(circle at 84% 8%, rgba(185,118,63,.18), transparent 22rem),
      rgba(8,5,4,.58) !important;
    backdrop-filter:blur(9px) saturate(115%) !important;
  }

  .nav,
  .site-header .nav{
    position:fixed !important;
    top:calc(78px + env(safe-area-inset-top)) !important;
    left:18px !important;
    right:18px !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100svh - 104px) !important;
    overflow:auto !important;
    z-index:1000 !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:10px !important;
    padding:18px !important;
    border-radius:28px !important;
    background:
      linear-gradient(145deg, rgba(15,9,7,.96), rgba(38,22,15,.94)),
      radial-gradient(circle at 20% 0%, rgba(201,150,91,.12), transparent 18rem) !important;
    border:1px solid rgba(211,166,105,.18) !important;
    box-shadow:
      0 34px 80px rgba(0,0,0,.50),
      inset 0 1px 0 rgba(255,255,255,.06) !important;
    backdrop-filter:blur(18px) saturate(125%) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-10px) scale(.98) !important;
    transform-origin:top right !important;
    transition:opacity .22s ease, transform .22s ease, visibility .22s ease !important;
  }

  .nav.open,
  .site-header .nav.open{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) scale(1) !important;
  }

  .nav::before,
  .site-header .nav::before{
    content:"Menu" !important;
    display:block !important;
    grid-column:1/-1 !important;
    font-family:Inter, ui-sans-serif, system-ui, sans-serif !important;
    font-size:.78rem !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    letter-spacing:.22em !important;
    color:#c9965b !important;
    margin:2px 4px 8px !important;
  }

  .nav::after,
  .site-header .nav::after{
    display:none !important;
    content:none !important;
  }

  .nav a,
  .site-header .nav a{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:52px !important;
    padding:12px 10px !important;
    border-radius:17px !important;
    color:rgba(255,246,234,.82) !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)) !important;
    border:1px solid rgba(211,166,105,.12) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045) !important;
    font-size:.92rem !important;
    font-weight:900 !important;
    letter-spacing:.005em !important;
    text-align:center !important;
    transform:none !important;
  }

  .nav a::before,
  .site-header .nav a::before{
    display:none !important;
    content:none !important;
  }

  .nav a::after,
  .site-header .nav a::after{
    left:18px !important;
    right:18px !important;
    bottom:8px !important;
    height:2px !important;
    background:linear-gradient(90deg, transparent, #c9965b, transparent) !important;
    opacity:.75 !important;
  }

  .nav a:hover,
  .nav a.active,
  .site-header .nav a:hover,
  .site-header .nav a.active{
    color:#f5d1a2 !important;
    background:
      linear-gradient(180deg, rgba(201,150,91,.12), rgba(255,255,255,.025)) !important;
    border-color:rgba(211,166,105,.24) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
    transform:none !important;
  }
}

@media (max-width:430px){
  .nav,
  .site-header .nav{
    left:14px !important;
    right:14px !important;
    grid-template-columns:1fr !important;
    border-radius:24px !important;
  }
}

/* WhatsApp floating button: no “clicked” look, same matte luxury palette */
.social-main,
.social-pop .social-main{
  background:
    linear-gradient(145deg, #2a1710 0%, #4a2a18 56%, #21120c 100%) !important;
  border:1px solid rgba(211,166,105,.28) !important;
  color:#f7d6a7 !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -10px 20px rgba(0,0,0,.18) !important;
  transform:none !important;
}

.social-main:hover,
.social-pop .social-main:hover,
.social-pop.open .social-main{
  background:
    linear-gradient(145deg, #2a1710 0%, #4a2a18 56%, #21120c 100%) !important;
  transform:none !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -10px 20px rgba(0,0,0,.18) !important;
}

.social-main .whatsapp-icon,
.social-main .whatsapp-icon svg{
  color:#f7d6a7 !important;
  fill:currentColor !important;
}

.social-plus{
  display:none !important;
}

.social-panel{
  background:
    linear-gradient(145deg, rgba(15,9,7,.96), rgba(38,22,15,.94)) !important;
  border:1px solid rgba(211,166,105,.18) !important;
  box-shadow:0 30px 70px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
}

.social-item{
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(211,166,105,.12) !important;
  color:rgba(255,246,234,.86) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.social-item:hover{
  background:rgba(201,150,91,.12) !important;
  border-color:rgba(211,166,105,.24) !important;
  color:#f5d1a2 !important;
}

.social-item .whatsapp-icon,
.social-item .social-icon,
.social-item .whatsapp-icon svg{
  color:#f7d6a7 !important;
  fill:currentColor !important;
}

/* FINAL GREEN REMOVAL + NAV MATCH: bar/menu colors now follow the black/brown luxury site palette. */
:root{
  --nav-black:#120b08;
  --nav-brown:#2b170f;
  --nav-brown-2:#4b2a18;
  --nav-gold:#d9a15f;
  --nav-cream:#fff8ef;
}

.site-header{
  background:linear-gradient(180deg,rgba(25,14,10,.96),rgba(18,11,8,.94)) !important;
  border-bottom:1px solid rgba(217,161,95,.14) !important;
  box-shadow:0 12px 34px rgba(0,0,0,.22) !important;
}

/* Desktop: no extra hamburger button beside the real navigation. */
@media (min-width:981px){
  .site-header .menu-toggle,
  .menu-toggle{
    display:none !important;
  }
  .site-header .nav,
  .nav{
    background:rgba(18,11,8,.72) !important;
    border:1px solid rgba(217,161,95,.10) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.04) !important;
    border-radius:999px !important;
    padding:8px 10px !important;
  }
  .site-header .nav a,
  .nav a{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    color:rgba(255,248,239,.82) !important;
    padding:10px 14px !important;
    border-radius:999px !important;
    transform:none !important;
  }
  .site-header .nav a:hover,
  .site-header .nav a.active,
  .nav a:hover,
  .nav a.active{
    background:transparent !important;
    color:var(--nav-gold) !important;
    box-shadow:none !important;
    transform:none !important;
  }
  .site-header .nav a::after,
  .nav a::after{
    content:"" !important;
    position:absolute !important;
    left:14px !important;
    right:14px !important;
    bottom:4px !important;
    height:2px !important;
    border-radius:99px !important;
    background:linear-gradient(90deg,transparent,var(--nav-gold),transparent) !important;
    opacity:0 !important;
    transform:none !important;
  }
  .site-header .nav a:hover::after,
  .site-header .nav a.active::after,
  .nav a:hover::after,
  .nav a.active::after{
    opacity:1 !important;
  }
}

/* Mobile/tablet: hamburger is dark brown/black, never green, never pressed-looking. */
@media (max-width:980px){
  .site-header .menu-toggle,
  .menu-toggle,
  .site-header .menu-toggle:hover,
  .menu-toggle:hover,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle:focus-visible,
  .site-header .menu-toggle[aria-expanded="true"],
  .menu-toggle[aria-expanded="true"]{
    display:inline-flex !important;
    width:60px !important;
    height:60px !important;
    min-width:60px !important;
    min-height:60px !important;
    padding:0 !important;
    border-radius:20px !important;
    background:
      radial-gradient(circle at 30% 18%,rgba(255,248,239,.18),transparent 28%),
      linear-gradient(145deg,var(--nav-brown-2) 0%,var(--nav-brown) 48%,var(--nav-black) 100%) !important;
    border:1px solid rgba(217,161,95,.32) !important;
    box-shadow:0 18px 42px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -10px 18px rgba(0,0,0,.12) !important;
    color:var(--nav-cream) !important;
    transform:none !important;
  }
  .site-header .menu-toggle span,
  .menu-toggle span{
    display:none !important;
  }
  .site-header .menu-toggle::after,
  .menu-toggle::after{
    content:none !important;
    display:none !important;
  }
  .site-header .menu-toggle::before,
  .menu-toggle::before,
  .site-header .menu-toggle[aria-expanded="true"]::before,
  .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:28px !important;
    height:3px !important;
    border-radius:99px !important;
    background:var(--nav-cream) !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -10px 0 var(--nav-cream),0 10px 0 var(--nav-cream) !important;
    opacity:1 !important;
  }

  .site-header .nav,
  .nav{
    background:
      radial-gradient(circle at 16% 8%,rgba(217,161,95,.14),transparent 16rem),
      linear-gradient(145deg,rgba(18,11,8,.98),rgba(43,23,15,.96)) !important;
    border:1px solid rgba(217,161,95,.22) !important;
    box-shadow:0 28px 80px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.06) !important;
    border-radius:28px !important;
  }
  .site-header .nav::before,
  .nav::before{
    color:rgba(255,248,239,.92) !important;
  }
  .site-header .nav::after,
  .nav::after{
    background:linear-gradient(145deg,rgba(18,11,8,.98),rgba(43,23,15,.96)) !important;
    border-left:1px solid rgba(217,161,95,.22) !important;
    border-top:1px solid rgba(217,161,95,.22) !important;
  }
  .site-header .nav a,
  .nav a{
    background:rgba(255,248,239,.055) !important;
    border:1px solid rgba(217,161,95,.12) !important;
    color:rgba(255,248,239,.86) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
    transform:none !important;
  }
  .site-header .nav a:hover,
  .site-header .nav a.active,
  .nav a:hover,
  .nav a.active{
    background:rgba(217,161,95,.10) !important;
    border-color:rgba(217,161,95,.22) !important;
    color:var(--nav-gold) !important;
    box-shadow:none !important;
    transform:none !important;
  }
}

/* WhatsApp floating button: same matte brown/black palette, no green. */
.social-main,
.social-main:hover,
.social-main:focus-visible,
.social-pop.open .social-main{
  background:
    radial-gradient(circle at 32% 20%,rgba(255,248,239,.16),transparent 30%),
    linear-gradient(145deg,var(--nav-brown-2) 0%,var(--nav-brown) 50%,var(--nav-black) 100%) !important;
  border:1px solid rgba(217,161,95,.34) !important;
  color:var(--nav-cream) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.10) !important;
  transform:none !important;
}
.social-main .whatsapp-icon,
.social-item .whatsapp-icon,
.social-item .social-icon{
  color:var(--nav-gold) !important;
  fill:currentColor !important;
}
.social-plus{
  background:var(--nav-black) !important;
  color:var(--nav-gold) !important;
  border:1px solid rgba(217,161,95,.34) !important;
}

/* === ROOSTERS / 818-INSPIRED DARK BREWERY NAV FINAL PATCH ===
   Visual-only override: keeps all links, IDs, JS and content untouched.
   Fixes desktop + mobile navigation and WhatsApp popup so they match the
   dark brown/black brewery design and removes any teal/green menu styling. */
:root{
  --ba-black:#070403;
  --ba-ink:#100907;
  --ba-brown:#24130d;
  --ba-brown-2:#3a2015;
  --ba-copper:#a66735;
  --ba-gold:#d8a25a;
  --ba-cream:#fff1dc;
  --ba-line:rgba(216,162,90,.24);
}

.site-header,
body .site-header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  width:100% !important;
  min-height:86px !important;
  padding:12px clamp(20px,4vw,64px) !important;
  background:
    radial-gradient(circle at 18% 0%,rgba(166,103,53,.16),transparent 24rem),
    linear-gradient(180deg,rgba(15,8,6,.96),rgba(24,12,8,.94)) !important;
  border-bottom:1px solid rgba(216,162,90,.14) !important;
  box-shadow:0 16px 48px rgba(0,0,0,.42) !important;
  backdrop-filter:blur(18px) saturate(130%) !important;
}

.brand,
.site-header .brand{
  min-width:max-content !important;
  gap:0 !important;
}
.brand span:last-child,
.site-header .brand span:last-child{
  display:none !important;
}
.brand-logo-frame,
.site-header .brand-logo-frame{
  width:104px !important;
  height:58px !important;
  padding:7px 12px !important;
  border-radius:18px !important;
  background:linear-gradient(135deg,#fffaf2,#efe4d4) !important;
  border:1px solid rgba(216,162,90,.22) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.72) !important;
}
.brand-logo,
.site-header .brand-logo{
  width:82px !important;
  height:auto !important;
  object-fit:contain !important;
}

/* Desktop nav: no hamburger, no pressed pills, only clean brewery tabs */
@media (min-width:981px){
  .site-header .menu-toggle,
  .menu-toggle{
    display:none !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }
  .site-header .nav,
  body .nav{
    position:static !important;
    inset:auto !important;
    width:auto !important;
    max-width:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:2px !important;
    padding:8px !important;
    margin:0 !important;
    border-radius:999px !important;
    background:rgba(7,4,3,.64) !important;
    border:1px solid rgba(216,162,90,.13) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 16px 40px rgba(0,0,0,.24) !important;
    backdrop-filter:blur(16px) !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }
  .site-header .nav::before,
  .site-header .nav::after,
  body .nav::before,
  body .nav::after{
    display:none !important;
    content:none !important;
  }
  .site-header .nav a,
  body .nav a{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:40px !important;
    padding:9px 14px !important;
    border-radius:999px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    color:rgba(255,241,220,.78) !important;
    font-size:.9rem !important;
    font-weight:850 !important;
    letter-spacing:.025em !important;
    line-height:1 !important;
    text-decoration:none !important;
    transform:none !important;
    transition:color .22s ease,background .22s ease !important;
  }
  .site-header .nav a::before,
  body .nav a::before{
    display:none !important;
    content:none !important;
  }
  .site-header .nav a::after,
  body .nav a::after{
    content:"" !important;
    position:absolute !important;
    left:18px !important;
    right:18px !important;
    bottom:3px !important;
    height:2px !important;
    border-radius:999px !important;
    background:linear-gradient(90deg,transparent,var(--ba-gold),transparent) !important;
    opacity:0 !important;
    transform:scaleX(.45) !important;
    transition:opacity .22s ease,transform .22s ease !important;
  }
  .site-header .nav a:hover,
  .site-header .nav a.active,
  body .nav a:hover,
  body .nav a.active{
    color:var(--ba-cream) !important;
    background:rgba(216,162,90,.08) !important;
    border:0 !important;
    box-shadow:none !important;
    transform:none !important;
  }
  .site-header .nav a:hover::after,
  .site-header .nav a.active::after,
  body .nav a:hover::after,
  body .nav a.active::after{
    opacity:1 !important;
    transform:scaleX(1) !important;
  }
}

/* Mobile/tablet hamburger: brown/black, not green */
@media (max-width:980px){
  .site-header,
  body .site-header{
    min-height:82px !important;
    padding:12px 18px !important;
  }
  .site-header .menu-toggle,
  .menu-toggle,
  .site-header .menu-toggle:hover,
  .menu-toggle:hover,
  .site-header .menu-toggle:focus-visible,
  .menu-toggle:focus-visible,
  .site-header .menu-toggle[aria-expanded="true"],
  .menu-toggle[aria-expanded="true"]{
    display:grid !important;
    place-items:center !important;
    position:relative !important;
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    min-height:58px !important;
    padding:0 !important;
    border-radius:18px !important;
    border:1px solid rgba(216,162,90,.32) !important;
    color:var(--ba-cream) !important;
    background:
      radial-gradient(circle at 28% 20%,rgba(255,255,255,.13),transparent 34%),
      linear-gradient(145deg,#3b2217 0%,#20100b 58%,#0b0504 100%) !important;
    box-shadow:0 18px 42px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.13) !important;
    transform:none !important;
    filter:none !important;
    cursor:pointer !important;
  }
  .site-header .menu-toggle::before,
  .menu-toggle::before,
  .site-header .menu-toggle[aria-expanded="true"]::before,
  .menu-toggle[aria-expanded="true"]::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:26px !important;
    height:2px !important;
    border-radius:999px !important;
    background:var(--ba-cream) !important;
    transform:translate(-50%,-50%) !important;
    box-shadow:0 -8px 0 var(--ba-cream),0 8px 0 var(--ba-cream) !important;
  }
  .site-header .menu-toggle::after,
  .menu-toggle::after,
  .site-header .menu-toggle span,
  .menu-toggle span,
  .menu-icon-lines,
  .menu-icon-orb{
    display:none !important;
    content:none !important;
  }

  /* Mobile nav: dark overview, no white cards and no clicked-state look */
  body.menu-open::after{
    background:rgba(6,3,2,.68) !important;
    backdrop-filter:blur(10px) saturate(110%) !important;
  }
  .site-header .nav,
  body .nav{
    position:fixed !important;
    top:94px !important;
    left:18px !important;
    right:18px !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100svh - 116px) !important;
    overflow:auto !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:18px !important;
    border-radius:28px !important;
    background:
      radial-gradient(circle at 86% 0%,rgba(166,103,53,.23),transparent 16rem),
      linear-gradient(145deg,rgba(16,9,7,.98),rgba(45,24,16,.96)) !important;
    border:1px solid rgba(216,162,90,.22) !important;
    box-shadow:0 32px 90px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.06) !important;
    backdrop-filter:blur(22px) saturate(135%) !important;
    transform:translateY(-10px) scale(.98) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:opacity .22s ease,transform .22s ease,visibility .22s ease !important;
  }
  .site-header .nav.open,
  body .nav.open{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) scale(1) !important;
  }
  .site-header .nav::before,
  body .nav::before{
    content:"Menu" !important;
    display:block !important;
    grid-column:1/-1 !important;
    margin:0 0 4px !important;
    padding:0 2px 10px !important;
    color:var(--ba-gold) !important;
    font-family:Inter,system-ui,sans-serif !important;
    font-size:.78rem !important;
    font-weight:950 !important;
    letter-spacing:.26em !important;
    text-transform:uppercase !important;
    border-bottom:1px solid rgba(216,162,90,.14) !important;
  }
  .site-header .nav::after,
  body .nav::after{
    display:none !important;
    content:none !important;
  }
  .site-header .nav a,
  body .nav a{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    min-height:56px !important;
    padding:13px 14px !important;
    border-radius:16px !important;
    color:rgba(255,241,220,.86) !important;
    background:rgba(255,255,255,.035) !important;
    border:1px solid rgba(216,162,90,.13) !important;
    box-shadow:none !important;
    font-size:1rem !important;
    font-weight:850 !important;
    letter-spacing:.01em !important;
    text-decoration:none !important;
    transform:none !important;
  }
  .site-header .nav a::before,
  body .nav a::before{
    display:grid !important;
    place-items:center !important;
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    margin-right:12px !important;
    border-radius:12px !important;
    color:var(--ba-gold) !important;
    background:rgba(216,162,90,.11) !important;
    border:1px solid rgba(216,162,90,.14) !important;
    box-shadow:none !important;
  }
  .site-header .nav a:hover,
  .site-header .nav a.active,
  body .nav a:hover,
  body .nav a.active{
    color:var(--ba-cream) !important;
    background:rgba(216,162,90,.10) !important;
    border-color:rgba(216,162,90,.22) !important;
    box-shadow:none !important;
    transform:none !important;
  }
}

/* Floating WhatsApp: same dark brewery system, no green */
.social-pop{
  z-index:1200 !important;
}
.social-main,
.social-main:hover,
.social-main:focus-visible{
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.12),transparent 34%),
    linear-gradient(145deg,#3b2217 0%,#20100b 58%,#0b0504 100%) !important;
  color:var(--ba-gold) !important;
  border:1px solid rgba(216,162,90,.34) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.12) !important;
  transform:none !important;
}
.social-main .whatsapp-icon,
.social-main .whatsapp-icon svg{
  color:var(--ba-gold) !important;
  fill:currentColor !important;
}
.social-plus{
  background:var(--ba-ink) !important;
  color:var(--ba-gold) !important;
  border:1px solid rgba(216,162,90,.34) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.34) !important;
}
.social-panel{
  background:linear-gradient(145deg,rgba(16,9,7,.98),rgba(45,24,16,.96)) !important;
  border:1px solid rgba(216,162,90,.22) !important;
  box-shadow:0 26px 74px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter:blur(18px) saturate(130%) !important;
}
.social-item{
  color:rgba(255,241,220,.9) !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(216,162,90,.13) !important;
  box-shadow:none !important;
}
.social-item:hover{
  color:var(--ba-cream) !important;
  background:rgba(216,162,90,.10) !important;
  border-color:rgba(216,162,90,.24) !important;
}
.social-item .whatsapp-icon,
.social-item .social-icon,
.social-item svg{
  color:var(--ba-gold) !important;
  fill:currentColor !important;
}

/* =========================================================
   ROOSTERS-INSPIRED DARK BREWERY REDESIGN
   Visual layer only: keeps all existing HTML, links, IDs, JS, and content.
   Inspired by the uploaded preview.html: dark sticky header, bold centered hero,
   gold buttons, card grid, and dark split sections.
   ========================================================= */
:root{
  --rs-dark:#241610;
  --rs-ink:#160d09;
  --rs-brown:#3b2116;
  --rs-brown-2:#5e321e;
  --rs-cream:#f7efe2;
  --rs-cream-2:#ead9c4;
  --rs-gold:#c68a2d;
  --rs-gold-2:#e3a844;
  --rs-red:#8f2e1f;
  --rs-muted:#bba995;
  --rs-line:rgba(198,138,45,.28);
}

html{background:var(--rs-ink) !important;}
body{
  font-family:Georgia,"Times New Roman",serif !important;
  background:
    radial-gradient(circle at 78% 10%,rgba(198,138,45,.16),transparent 30rem),
    radial-gradient(circle at 10% 40%,rgba(143,46,31,.13),transparent 28rem),
    linear-gradient(180deg,#160d09 0%,#241610 44%,#160d09 100%) !important;
  color:var(--rs-cream) !important;
  line-height:1.6 !important;
}
body::before{
  opacity:.10 !important;
  background-image:
    linear-gradient(rgba(198,138,45,.18) 1px,transparent 1px),
    linear-gradient(90deg,rgba(198,138,45,.14) 1px,transparent 1px) !important;
  background-size:72px 72px !important;
  mask-image:linear-gradient(to bottom,black,transparent 86%) !important;
}

/* Header / navigation */
.site-header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding:18px 7% !important;
  min-height:86px !important;
  background:linear-gradient(180deg,rgba(36,22,16,.98),rgba(22,13,9,.96)) !important;
  color:var(--rs-cream) !important;
  border-bottom:1px solid rgba(198,138,45,.18) !important;
  box-shadow:0 4px 20px rgba(0,0,0,.42) !important;
  backdrop-filter:blur(14px) saturate(120%) !important;
}
.brand{
  gap:14px !important;
  color:var(--rs-gold) !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.brand span:last-child{display:none !important;}
.brand-logo-frame{
  width:98px !important;
  height:62px !important;
  border-radius:18px !important;
  background:linear-gradient(135deg,#fffaf0,#efe1ce) !important;
  border:1px solid rgba(198,138,45,.44) !important;
  box-shadow:0 12px 26px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.92) !important;
}
.brand-logo{width:82px !important;filter:contrast(1.08) drop-shadow(0 1px 1px rgba(255,255,255,.55)) !important;}

.nav{
  position:static !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:26px !important;
  width:auto !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:none !important;
  backdrop-filter:none !important;
}
.nav::before,.nav::after{display:none !important;content:none !important;}
.nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:auto !important;
  padding:0 0 7px !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:var(--rs-cream) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:15px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:1px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  position:relative !important;
  transition:color .22s ease,transform .22s ease !important;
}
.nav a::before{display:none !important;content:none !important;}
.nav a::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:2px !important;
  border-radius:999px !important;
  background:var(--rs-gold) !important;
  opacity:0 !important;
  transform:scaleX(.35) !important;
  transition:opacity .22s ease,transform .22s ease !important;
}
.nav a:hover,.nav a.active{
  color:var(--rs-gold) !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  transform:translateY(-1px) !important;
}
.nav a:hover::after,.nav a.active::after{opacity:1 !important;transform:scaleX(1) !important;}
.menu-toggle{display:none !important;}

/* Buttons from preview style */
.btn,button,.inline-form button,.form button,.card a,.product-card a,.info-card a,.post-card a,.press-card a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:48px !important;
  padding:13px 28px !important;
  border-radius:4px !important;
  background:var(--rs-gold) !important;
  color:var(--rs-dark) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:none !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:1px !important;
  text-decoration:none !important;
  transition:background .25s ease,transform .25s ease,color .25s ease,border-color .25s ease !important;
}
.btn::after,button::after{display:none !important;content:none !important;}
.btn:hover,button:hover,.inline-form button:hover,.form button:hover,.card a:hover,.product-card a:hover,.info-card a:hover,.post-card a:hover,.press-card a:hover{
  background:var(--rs-gold-2) !important;
  color:var(--rs-dark) !important;
  transform:translateY(-2px) !important;
  box-shadow:none !important;
}
.btn:not(.primary),.hero .btn:not(.primary){
  background:transparent !important;
  color:var(--rs-cream) !important;
  border:2px solid var(--rs-gold) !important;
}
.btn:not(.primary):hover,.hero .btn:not(.primary):hover{
  background:var(--rs-gold) !important;
  color:var(--rs-dark) !important;
}

/* Homepage hero: full brewery landing feeling */
.hero.hero-luxury,.hero.hero-showcase{
  min-height:78vh !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  align-items:center !important;
  justify-content:center !important;
  padding:clamp(80px,8vw,120px) 7% !important;
  text-align:center !important;
  overflow:hidden !important;
  background:#160d09 !important;
  color:white !important;
  position:relative !important;
}
.hero.hero-luxury::before,.hero.hero-showcase::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background:
    linear-gradient(rgba(36,22,16,.48),rgba(36,22,16,.62)),
    radial-gradient(circle at 70% 25%,rgba(198,138,45,.16),transparent 32rem) !important;
  pointer-events:none !important;
}
.hero.hero-luxury::after,.hero.hero-showcase::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.36)) !important;
  pointer-events:none !important;
}
.hero-slideshow.premium-carousel{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:#160d09 !important;
  border:0 !important;
  box-shadow:none !important;
}
.carousel-viewport{position:absolute !important;inset:0 !important;border-radius:0 !important;overflow:hidden !important;background:#160d09 !important;}
.premium-carousel::before,.premium-carousel::after,.hero-slideshow::before,.hero-slideshow::after{display:none !important;content:none !important;}
.premium-carousel .slide{
  position:absolute !important;
  inset:0 !important;
  padding:0 !important;
  opacity:0 !important;
  transform:scale(1.02) !important;
  transition:opacity .85s ease,transform 5.8s ease !important;
  pointer-events:none !important;
}
#home-slide-1:checked ~ .carousel-viewport .slide-1,
#home-slide-2:checked ~ .carousel-viewport .slide-2,
#home-slide-3:checked ~ .carousel-viewport .slide-3{
  opacity:1 !important;
  transform:scale(1.08) !important;
  z-index:1 !important;
}
.premium-carousel .slide-bg{display:none !important;}
.premium-carousel .slide img{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  padding:0 !important;
  border-radius:0 !important;
  filter:saturate(1.04) contrast(1.05) brightness(.72) !important;
  animation:none !important;
}
.premium-carousel figcaption{display:none !important;}
.hero-copy.luxury-copy,.hero-copy{
  position:relative !important;
  z-index:4 !important;
  width:min(900px,100%) !important;
  max-width:900px !important;
  margin:0 auto !important;
  padding:0 !important;
  display:grid !important;
  justify-items:center !important;
  text-align:center !important;
}
.hero-copy .eyebrow,.luxury-copy .eyebrow{
  color:var(--rs-gold) !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:4px !important;
  font-size:clamp(.9rem,1.6vw,1.2rem) !important;
  margin:0 0 22px !important;
  max-width:760px !important;
}
.hero h1,.hero-copy h1,.luxury-copy h1{
  color:#fffaf2 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(48px,7.6vw,96px) !important;
  line-height:.95 !important;
  text-transform:uppercase !important;
  letter-spacing:3px !important;
  margin:0 0 24px !important;
  text-shadow:0 5px 20px rgba(0,0,0,.48) !important;
  max-width:980px !important;
}
.hero-copy p:not(.eyebrow),.hero p{
  color:#f7e8d4 !important;
  font-size:clamp(18px,2vw,22px) !important;
  max-width:780px !important;
  margin:0 auto 32px !important;
}
.hero-copy .actions,.hero .actions{
  display:flex !important;
  justify-content:center !important;
  gap:16px !important;
  flex-wrap:wrap !important;
  margin-top:0 !important;
}
.carousel-dots{
  position:absolute !important;
  right:7% !important;
  top:auto !important;
  bottom:32px !important;
  left:auto !important;
  z-index:5 !important;
  display:flex !important;
  gap:10px !important;
  padding:8px 10px !important;
  border-radius:999px !important;
  background:rgba(22,13,9,.56) !important;
  border:1px solid rgba(247,239,226,.20) !important;
  backdrop-filter:blur(10px) !important;
  transform:none !important;
}
.carousel-dots label{width:11px !important;height:11px !important;border-radius:999px !important;background:rgba(247,239,226,.48) !important;border:1px solid rgba(255,255,255,.36) !important;}
#home-slide-1:checked ~ .carousel-dots label[for="home-slide-1"],
#home-slide-2:checked ~ .carousel-dots label[for="home-slide-2"],
#home-slide-3:checked ~ .carousel-dots label[for="home-slide-3"]{width:34px !important;background:var(--rs-gold) !important;}
.carousel-arrows{position:absolute !important;inset:0 !important;z-index:5 !important;pointer-events:none !important;}
.arrow-pair{display:none !important;position:absolute !important;inset:0 !important;align-items:center !important;justify-content:space-between !important;padding:0 7% !important;}
#home-slide-1:checked ~ .carousel-arrows .for-1,
#home-slide-2:checked ~ .carousel-arrows .for-2,
#home-slide-3:checked ~ .carousel-arrows .for-3{display:flex !important;}
.carousel-arrow{pointer-events:auto !important;width:54px !important;height:54px !important;border-radius:4px !important;background:rgba(247,239,226,.88) !important;color:var(--rs-dark) !important;border:0 !important;box-shadow:0 12px 28px rgba(0,0,0,.28) !important;font-size:2.1rem !important;}
.carousel-arrow:hover{background:var(--rs-gold) !important;color:var(--rs-dark) !important;transform:translateY(-2px) !important;}

/* Sections and page heroes */
.section,.content,.newsletter,.page-hero{
  padding:80px 7% !important;
  background:var(--rs-cream) !important;
  color:var(--rs-dark) !important;
}
.section:nth-of-type(even),.content:nth-of-type(even){background:#efe2d0 !important;}
.page-hero{
  min-height:420px !important;
  display:grid !important;
  align-content:center !important;
  background:
    linear-gradient(rgba(36,22,16,.62),rgba(36,22,16,.72)),
    url('../assets/danny-bar-tap.jpeg') center/cover no-repeat !important;
  color:white !important;
  border:0 !important;
}
.page-hero h1,.page-hero h2{
  color:white !important;
  font-size:clamp(48px,7vw,88px) !important;
  line-height:.95 !important;
  text-transform:uppercase !important;
  letter-spacing:2px !important;
  text-shadow:0 5px 20px rgba(0,0,0,.45) !important;
}
.page-hero p{color:#f7e8d4 !important;font-size:20px !important;}
.eyebrow{color:var(--rs-gold) !important;text-transform:uppercase !important;letter-spacing:3px !important;font-weight:900 !important;}
.section h2,.content h2,.newsletter h2,.page-hero h1{
  font-family:Georgia,"Times New Roman",serif !important;
  color:var(--rs-dark) !important;
  text-transform:uppercase !important;
  letter-spacing:2px !important;
  font-size:clamp(42px,5vw,72px) !important;
  line-height:1 !important;
}
.section h3,.content h3,.card h3,.info-card h3,.product-card h3,.post-card h3{
  font-family:Georgia,"Times New Roman",serif !important;
  color:var(--rs-red) !important;
  text-transform:uppercase !important;
  letter-spacing:1px !important;
}
.section p,.content p,.card p,.info-card p,.product-card p,.post-card p,ul,li{color:#76685d !important;}

/* Cards like preview */
.cards-3,.grid-3,.news-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:28px !important;margin-top:40px !important;}
.card,.info-card,.product-card,.post-card,.press-card,.price-overview-card,.pdf-preview-card,.map-overview-card,.address-card,.form{
  background:#fffaf3 !important;
  border:0 !important;
  border-radius:4px !important;
  overflow:hidden !important;
  box-shadow:0 12px 35px rgba(0,0,0,.16) !important;
  padding:28px !important;
  transition:transform .25s ease,box-shadow .25s ease !important;
  color:var(--rs-dark) !important;
}
.card:hover,.info-card:hover,.product-card:hover,.post-card:hover,.press-card:hover,.price-overview-card:hover,.pdf-preview-card:hover,.map-overview-card:hover{transform:translateY(-6px) !important;box-shadow:0 20px 42px rgba(0,0,0,.18) !important;}
.card .icon{background:rgba(198,138,45,.16) !important;color:var(--rs-red) !important;border-radius:4px !important;}
.image-frame,.card-photo,.portrait-photo,.portrait-full,.media-placeholder,.shop-panorama,.gastro-panorama,.dirndl-action-preview,.map-visual--real{
  border-radius:4px !important;
  border:8px solid rgba(255,255,255,.08) !important;
  box-shadow:0 12px 35px rgba(0,0,0,.18) !important;
  background:#160d09 !important;
  overflow:hidden !important;
}
.image-frame img,.card-photo img,.portrait-photo img,.portrait-full img,.media-placeholder img,.shop-panorama img,.gastro-panorama img,.dirndl-action-preview img,.map-visual--real img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  padding:0 !important;
  border-radius:0 !important;
}

/* Split/dark blocks */
.two-col,.grid-2,.pdf-preview,.map-overview-card{
  gap:50px !important;
  align-items:center !important;
}
.two-col.alt,.newsletter,.footer{
  background:var(--rs-dark) !important;
  color:white !important;
}
.two-col.alt h2,.newsletter h2,.footer strong{color:var(--rs-gold) !important;}
.two-col.alt p,.newsletter p,.footer p{color:#ead9c4 !important;}

/* Forms */
.inline-form input,.form input,.form select,.form textarea{
  border:2px solid rgba(198,138,45,.32) !important;
  border-radius:4px !important;
  background:#fffaf3 !important;
  color:var(--rs-dark) !important;
  box-shadow:none !important;
  font-family:Georgia,"Times New Roman",serif !important;
}
.form input:focus,.form select:focus,.form textarea:focus,.inline-form input:focus{border-color:var(--rs-gold) !important;box-shadow:0 0 0 4px rgba(198,138,45,.16) !important;}

/* Footer */
.footer{
  padding:50px 7% !important;
  background:#160d09 !important;
  color:#d8c6ad !important;
  text-align:center !important;
  border-top:1px solid rgba(198,138,45,.18) !important;
}
.footer-logo-wrap{background:#fffaf3 !important;border-radius:4px !important;border:1px solid rgba(198,138,45,.34) !important;}

/* WhatsApp popup matched to brewery style */
.social-main{
  width:62px !important;height:62px !important;border-radius:4px !important;
  background:var(--rs-gold) !important;color:var(--rs-dark) !important;border:0 !important;
  box-shadow:0 12px 35px rgba(0,0,0,.28) !important;
}
.social-main:hover{background:var(--rs-gold-2) !important;transform:translateY(-2px) !important;}
.social-plus{display:none !important;}
.social-panel{background:#160d09 !important;border:1px solid var(--rs-line) !important;border-radius:4px !important;box-shadow:0 20px 48px rgba(0,0,0,.42) !important;}
.social-item{background:#241610 !important;color:var(--rs-cream) !important;border:1px solid rgba(198,138,45,.22) !important;border-radius:4px !important;}
.social-item:hover{background:rgba(198,138,45,.16) !important;color:white !important;}
.social-item .whatsapp-icon,.social-item .social-icon,.social-main .whatsapp-icon{color:inherit !important;}

/* Mobile */
@media(max-width:980px){
  .site-header{padding:14px 5% !important;min-height:78px !important;}
  .menu-toggle{
    display:grid !important;place-items:center !important;
    width:58px !important;height:58px !important;min-width:58px !important;min-height:58px !important;
    padding:0 !important;border-radius:4px !important;
    background:var(--rs-gold) !important;color:var(--rs-dark) !important;
    border:0 !important;box-shadow:0 12px 28px rgba(0,0,0,.28) !important;
  }
  .menu-toggle::before{content:"" !important;width:28px !important;height:3px !important;background:var(--rs-dark) !important;border-radius:0 !important;box-shadow:0 -9px 0 var(--rs-dark),0 9px 0 var(--rs-dark) !important;position:absolute !important;left:50% !important;top:50% !important;transform:translate(-50%,-50%) !important;}
  .menu-toggle::after,.menu-toggle span,.menu-icon-lines,.menu-icon-orb{display:none !important;content:none !important;}
  .menu-toggle:hover,.menu-toggle[aria-expanded="true"]{background:var(--rs-gold-2) !important;transform:none !important;}
  .nav{
    position:fixed !important;top:90px !important;left:5% !important;right:5% !important;width:auto !important;
    display:grid !important;grid-template-columns:1fr !important;gap:12px !important;
    padding:20px !important;border-radius:4px !important;background:#160d09 !important;border:1px solid var(--rs-line) !important;
    box-shadow:0 26px 70px rgba(0,0,0,.54) !important;opacity:0 !important;visibility:hidden !important;pointer-events:none !important;transform:translateY(-8px) !important;max-height:calc(100svh - 110px) !important;overflow:auto !important;
  }
  .nav.open{opacity:1 !important;visibility:visible !important;pointer-events:auto !important;transform:translateY(0) !important;}
  .nav a{min-height:54px !important;padding:15px 16px !important;border-radius:4px !important;background:#241610 !important;border:1px solid rgba(198,138,45,.20) !important;color:var(--rs-cream) !important;justify-content:flex-start !important;}
  .nav a:hover,.nav a.active{background:rgba(198,138,45,.18) !important;color:white !important;}
  .hero.hero-luxury,.hero.hero-showcase{min-height:74vh !important;padding:88px 5% 72px !important;}
  .hero h1,.hero-copy h1,.luxury-copy h1{font-size:clamp(38px,10vw,64px) !important;letter-spacing:1.5px !important;}
  .hero-copy .eyebrow{letter-spacing:2.6px !important;font-size:.85rem !important;}
  .hero-copy p:not(.eyebrow),.hero p{font-size:17px !important;}
  .hero-copy .actions,.hero .actions{display:grid !important;grid-template-columns:1fr !important;width:min(100%,340px) !important;}
  .cards-3,.grid-3,.news-grid,.grid-2,.two-col{grid-template-columns:1fr !important;}
  .section,.content,.newsletter,.page-hero{padding:60px 5% !important;}
  .carousel-dots{right:5% !important;bottom:18px !important;}
  .carousel-arrows{display:none !important;}
}
@media(max-width:520px){
  .brand-logo-frame{width:92px !important;height:56px !important;}
  .brand-logo{width:78px !important;}
  .hero h1,.hero-copy h1,.luxury-copy h1{font-size:clamp(34px,12vw,52px) !important;}
  .section h2,.content h2,.newsletter h2,.page-hero h1{font-size:32px !important;}
  .btn,button,.inline-form button,.form button,.card a,.product-card a,.info-card a,.post-card a{width:100% !important;}
}