:root{
  --wine:#7f2336;
  --wine-dark:#5f1727;
  --ink:#332623;
  --olive:#48522f;
  --cream:#faf7f0;
  --sand:#efe7db;
  --line:#d7ccbc;
  --beige-icon:#c7b79b;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.6;
}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}
.narrow{max-width:900px}
.center{text-align:center}
h1,h2{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  letter-spacing:.01em;
  color:#3a2c29;
}
h2{font-size:clamp(2rem,3.5vw,3.1rem);margin:0 0 12px}
p{margin:0 0 1rem}

.hero-image-wrap{
  background:#f5efe6;
}
.hero-image-box{
  position:relative;
  max-width:1680px;
  margin:0 auto;
}
.hero-image{
  width:100%;
  height:auto;
}
.hero-hotspot{
  position:absolute;
  display:block;
  border-radius:999px;
  background:transparent;
}
.hero-hotspot:hover{
  outline:none;
}
.hero-hotspot:focus-visible{
  outline:2px solid #7f2336;
  outline-offset:3px;
}
.hotspot-wines{left:5.9%; top:78.2%; width:21.0%; height:5.9%;}
.hotspot-contact{left:28.3%; top:78.2%; width:18.8%; height:5.9%;}
.mobile-hero-actions{display:none}

section{padding:62px 0}
.icons-section{padding-top:44px;padding-bottom:40px}
.subline{color:#6b6059;max-width:680px;margin:0 auto 1.2rem}
.mini-icons{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  max-width:620px;
  margin:26px auto 0;
}
.mini-icons figure{margin:0}
.mini-icons img{
  width:74px;
  height:74px;
  object-fit:contain;
  margin:0 auto 8px;
  opacity:.82;
}
.mini-icons figcaption{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:1.15rem;
}
.band{
  background:var(--sand);
}
.contact .mail-link{font-weight:600;color:var(--wine-dark)}
.note{color:#6d6761;font-size:.97rem}

.btn{
  display:inline-block;
  text-decoration:none;
  background:var(--wine);
  color:#fff;
  border:1px solid var(--wine);
  padding:14px 24px;
  border-radius:999px;
  font-weight:700;
  letter-spacing:.02em;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.btn:hover,.btn:focus{background:var(--wine-dark);border-color:var(--wine-dark);transform:translateY(-1px)}
.btn.secondary{background:#fff;color:var(--wine);border-color:#c7af9b}
.btn.secondary:hover,.btn.secondary:focus{background:#f8f1eb;color:var(--wine-dark)}

footer{
  background:var(--wine);
  color:#fff;
  text-align:center;
  padding:20px 15px;
}
footer a{display:inline-block;margin:0 13px;text-decoration:none}
footer a:hover,footer a:focus{text-decoration:underline}

/* Unterseiten */
.subhero{
  background:linear-gradient(180deg,#8a293d 0%,#6d1b2e 100%);
  color:#fff;
  padding:64px 20px;
  text-align:center;
}
.subhero img{display:block;width:240px;max-width:90%;margin:0 auto 18px;border:1px solid rgba(255,255,255,.25)}
.subhero h1{color:#fff;font-size:clamp(2.2rem,4vw,3.6rem);margin:0 0 10px}
.subhero a{color:#fff}
.intro{max-width:850px;margin:auto}
.navpills{display:flex;flex-wrap:wrap;gap:10px;margin:25px 0}
.navpills a{padding:8px 13px;border:1px solid #d8bcc4;border-radius:40px;text-decoration:none;font-size:.9rem;background:#fff}
.navpills a:hover,.navpills a:focus{border-color:var(--wine);color:var(--wine-dark)}
.wine-group{margin:45px 0}
.wine-group h2{font-size:2rem;border-bottom:2px solid #d7b793;padding-bottom:8px}
.wine-table{border-collapse:collapse;width:100%;background:#fff}
.wine-table th{text-align:left;background:#f6eaed}
.wine-table th,.wine-table td{padding:13px 16px;border-bottom:1px solid #e7e0d7;vertical-align:top}
.wine-table td:last-child,.wine-table th:last-child{text-align:right;white-space:nowrap}
.wine-table small{color:#5f5e5e}
.disclaimer{border-left:4px solid #c9a971;padding:15px 18px;background:#f5eee3;margin:22px 0}

@media (max-width: 980px){
  .hero-hotspot{display:none}
  .mobile-hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    justify-content:center;
    padding:18px 18px 0;
    margin-top:-6px;
  }
}
@media (max-width: 680px){
  section{padding:42px 0}
  .icons-section{padding-top:34px;padding-bottom:28px}
  .mini-icons{gap:14px}
  .mini-icons img{width:58px;height:58px}
  .mini-icons figcaption{font-size:1rem}
  .subhero{padding:44px 16px}
  .wine-table th,.wine-table td{padding:10px 8px;font-size:.9rem}
  footer a{margin:5px 10px}
}

.location{font-weight:600;color:#5f1727;margin-top:22px}.route{margin-top:4px}

/* Kleine Social-Media-Links unterhalb der Anfahrt */
.social-links{display:flex;gap:14px;justify-content:center;align-items:center;flex-wrap:wrap;margin:20px auto 0}
.social-links a{color:#7b1e2b;border:1px solid #cba9ac;background:transparent;border-radius:999px;padding:7px 16px;text-decoration:none;font-size:.95rem;font-weight:600}
.social-links a:hover,.social-links a:focus-visible{background:#f6e9e9;border-color:#7b1e2b}

/* V10: Im Mobilformat keine zweiten, riesigen Bild-Buttons. Die
   transparenten Linkflaechen bleiben auch bei Touch bedienbar. */
.mobile-hero-actions { display:none !important; }
.hero-hotspot { display:block !important; }
.hero-hotspot:hover { outline:none !important; }
.hero-hotspot:focus-visible { outline:3px solid #7b1e2b !important; outline-offset:2px; }
/* Trefflaechen im Bannerbild sind bei kleinen Displays zusaetzlich vergroessert. */
@media(max-width:980px){
  .hero-hotspot.hotspot-wines{left:5.5%;top:76.7%;width:22%;height:9%}
  .hero-hotspot.hotspot-contact{left:27.5%;top:76.7%;width:21%;height:9%}
}
/* Weinliste: neuer heller Banner statt hohem einfarbigem Block */
.wine-banner {background:#f9f1e7;position:relative;margin:0;}
.wine-banner img{display:block;width:100%;height:auto;max-height:410px;object-fit:contain;margin:0 auto;}
.wine-back {text-align:center;background:#f9f1e7;padding:9px 16px 15px;font-size:.95rem;}
.wine-back a{color:#7b1e2b;text-decoration:underline;text-underline-offset:3px;}
/* Nur dieser Kopfbereich kompakt; restliche Weinliste bleibt unveraendert */
@media(max-width:680px){
 .wine-banner img{max-height:none;}
 .wine-back{padding:8px 12px 12px;font-size:.88rem;}
 .icons-section{padding-top:28px;padding-bottom:25px}
 .icons-section h2{font-size:clamp(1.65rem,7vw,2.25rem);line-height:1.2}
 .icons-section .subline{font-size:.95rem}
}