:root{
 --bg:#030b16;
 --bg2:#071321;
 --card:#081625;
 --card2:#0b1b2d;
 --line:#1d3550;
 --line2:#274b71;
 --text:#f4f7fb;
 --muted:#aab8ca;
 --blue:#1594ff;
 --blue2:#0a70df;
 --glow:rgba(22,145,255,.33);
 --soft:#0c2035;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 min-height:100vh;
 color:var(--text);
 font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
 padding-bottom:96px;
 background:
   radial-gradient(circle at 76% 7%,rgba(20,112,229,.16),transparent 28%),
   radial-gradient(circle at 12% 20%,rgba(0,108,255,.07),transparent 25%),
   linear-gradient(180deg,#020914 0%,#06111e 55%,#020914 100%);
}
a{color:inherit}
.site-header{
 position:sticky;top:0;z-index:30;
 background:rgba(3,11,22,.88);
 backdrop-filter:blur(18px);
 border-bottom:1px solid rgba(69,111,155,.35);
 box-shadow:0 8px 24px rgba(0,0,0,.2);
}
.header-inner{max-width:1380px;margin:auto;height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 22px}
.brand-link{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:max-content}
.brand-link img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(24,143,255,.2))}
.brand-link div{display:flex;flex-direction:column}
.brand-link span{font-size:.78rem;color:#9cb0c8;letter-spacing:.03em}
.brand-link strong{font-size:1.1rem;color:#fff;letter-spacing:.01em}
.desktop-nav{display:flex;align-items:center;gap:26px}
.desktop-nav a{position:relative;text-decoration:none;color:#c9d4e2;font-size:.9rem;padding:28px 0}
.desktop-nav a:hover{color:#fff}
.desktop-nav a:first-child{color:#fff}
.desktop-nav a:first-child:after{content:"";position:absolute;left:0;right:0;bottom:12px;height:2px;background:var(--blue);box-shadow:0 0 12px var(--glow)}
main{max-width:1380px;margin:auto;padding:14px 22px}
.hero{
 position:relative;overflow:hidden;
 min-height:410px;
 background:
  radial-gradient(circle at 78% 45%,rgba(24,139,255,.15),transparent 24%),
  linear-gradient(135deg,#061423 0%,#03101d 48%,#06192e 100%);
 border:1px solid #1c3857;border-radius:20px;color:#fff;padding:38px 50px;
 display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:30px;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 18px 50px rgba(0,0,0,.34),0 0 55px rgba(10,101,205,.08);
}
.hero:before{content:"";position:absolute;width:760px;height:120px;right:-180px;top:105px;transform:rotate(-16deg);background:linear-gradient(90deg,transparent,rgba(14,111,227,.13),rgba(35,147,255,.26),transparent);filter:blur(24px);pointer-events:none}
.hero-copy{position:relative;z-index:2}
.badge{display:inline-block;background:rgba(6,26,46,.82);border:1px solid #1f4c77;border-radius:9px;padding:9px 14px;font-size:.74rem;font-weight:900;color:#31a5ff;letter-spacing:.04em;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.hero h1{font-size:clamp(3.2rem,5.2vw,5.5rem);line-height:.94;margin:22px 0 16px;letter-spacing:-.05em;text-shadow:0 4px 30px rgba(0,0,0,.24)}
.hero p{font-size:1.08rem;line-height:1.55;margin:0;color:#d2dbea}
.hero-buttons{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;padding:14px 22px;border-radius:11px;font-weight:850;font-size:.98rem;transition:.2s ease}
.btn:hover{transform:translateY(-1px)}
.btn-white{color:#fff;background:linear-gradient(180deg,#219fff,#0877e8);border:1px solid #3fb0ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 22px rgba(9,119,235,.26),0 0 26px rgba(26,151,255,.14)}
.btn-outline{border:1px solid #284866;color:#eef5ff;background:rgba(7,19,32,.45)}
.mini{font-size:.95rem}
.hero-brand{position:relative;z-index:2;display:flex;justify-content:center;align-items:center;height:100%}
.hero-brand:before{content:"";position:absolute;width:350px;height:350px;border-radius:50%;border:1px solid #178df7;box-shadow:0 0 18px rgba(23,141,247,.7),inset 0 0 20px rgba(23,141,247,.2)}
.hero-brand img{width:min(100%,360px);height:360px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(23,141,247,.22))}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}
.quick a{min-height:108px;background:linear-gradient(145deg,rgba(8,23,39,.98),rgba(4,15,27,.98));border:1px solid #1b344f;border-radius:16px;text-decoration:none;color:inherit;padding:18px;display:flex;align-items:center;gap:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 24px rgba(0,0,0,.19);transition:.2s ease}
.quick a:hover{border-color:#286195;transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.28),0 0 20px rgba(17,123,231,.08)}
.icon,.round-icon{width:54px;height:54px;border-radius:50%;background:linear-gradient(145deg,#0f2943,#071728);border:1px solid #244766;display:grid;place-items:center;color:#1a96ff;font-size:1.55rem;font-weight:900;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.quick strong{display:block;font-size:1rem;color:#fff}.quick small{display:block;color:var(--muted);margin-top:6px;font-size:.79rem;line-height:1.35}
.panel{background:linear-gradient(145deg,rgba(7,21,36,.98),rgba(3,13,24,.98));border:1px solid #19344f;border-radius:18px;padding:25px;margin-top:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 12px 34px rgba(0,0,0,.22)}
.section-title>span{font-size:.72rem;font-weight:900;letter-spacing:.08em;color:#1e9bff}
.section-title h2{font-size:1.6rem;margin:6px 0 8px;color:#fff}.section-title p,.info>p{margin:0;color:var(--muted);line-height:1.55}
.info{min-height:130px}
.contact-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.contact-buttons a{background:linear-gradient(180deg,#168fe9,#0b67bc);border:1px solid #2ba4ff;color:#fff;text-decoration:none;padding:12px 15px;border-radius:10px;font-weight:800;box-shadow:0 7px 20px rgba(8,117,225,.17)}
.catalog-panel{padding:28px}
.catalog-tools{position:sticky;top:76px;z-index:8;background:rgba(4,15,27,.94);backdrop-filter:blur(15px);padding:13px 0 14px;border-bottom:1px solid #183650;margin-top:15px}
.catalog-tools input{width:100%;border:1px solid #21425f;background:#061522;color:#fff;border-radius:12px;padding:14px 15px;font:inherit;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
.catalog-tools input::placeholder{color:#70869e}
.catalog-tools input:focus{border-color:#168ff4;box-shadow:0 0 0 3px rgba(22,143,244,.12),0 0 22px rgba(16,127,235,.08)}
.catalog-tabs{display:flex;gap:8px;overflow:auto;padding-top:11px;scrollbar-width:none}.catalog-tabs::-webkit-scrollbar{display:none}
.catalog-tabs a{white-space:nowrap;text-decoration:none;background:#0b2137;border:1px solid #1f4467;color:#a9d8ff;padding:8px 13px;border-radius:999px;font-size:.78rem;font-weight:800}
.catalog-tabs a:hover{background:#0e3153;color:#fff;border-color:#2776b9}
.catalog-group{scroll-margin-top:155px;margin-top:28px}
.catalog-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:10px}
.catalog-heading h3{font-size:1.32rem;margin:0;color:#fff}.catalog-heading>span{font-size:.76rem;color:#1c9bff;background:#071c30;border:1px solid #174367;padding:5px 9px;border-radius:8px}
.article-table{border:1px solid #193953;border-radius:14px;overflow:hidden;background:#061522}
.article-table-head,.article-row{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:16px;align-items:center}
.article-table-head{background:linear-gradient(180deg,#0c2945,#071f35);color:#58b5ff;font-size:.71rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em;padding:11px 14px;border-bottom:1px solid #214665}
.article-row{padding:11px 14px;border-top:1px solid #112c42;background:#061421;transition:.14s ease}
.article-row:nth-child(odd){background:#071827}
.article-row:hover{background:#0a2136}
.article-name{font-size:.86rem;font-weight:650;color:#edf5ff}.article-pack{font-size:.82rem;color:#9db1c5;font-weight:750}
.article-row.hidden{display:none}
.bottom-nav{position:fixed;z-index:40;left:50%;bottom:12px;transform:translateX(-50%);width:min(94%,620px);height:68px;background:rgba(3,13,24,.94);backdrop-filter:blur(18px);border:1px solid #213c57;border-radius:17px;box-shadow:0 16px 38px rgba(0,0,0,.35),0 0 26px rgba(10,119,229,.08);display:grid;grid-template-columns:repeat(4,1fr);padding:6px}
.bottom-nav a{text-decoration:none;color:#a7b6c7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.bottom-nav a:first-child{color:#1b9cff;text-shadow:0 0 10px rgba(27,156,255,.42)}.bottom-nav span{font-size:1.15rem}.bottom-nav small{font-size:.67rem;font-weight:750}
@media(max-width:1050px){.desktop-nav{display:none}}
@media(max-width:800px){
 .header-inner{height:64px}.brand-link img{width:44px;height:44px}.brand-link strong{font-size:.98rem}
 main{padding:10px}
 .hero{grid-template-columns:1fr;padding:25px;min-height:auto}.hero h1{font-size:2.75rem}.hero p{font-size:.94rem}.hero p br{display:none}
 .hero-brand{grid-row:1}.hero-brand:before{width:220px;height:220px}.hero-brand img{width:220px;height:220px}
 .quick{grid-template-columns:repeat(2,1fr)}.quick a{padding:14px;gap:12px;min-height:98px}.icon{width:46px;height:46px}
 .catalog-tools{top:62px}
}
@media(max-width:600px){
 .catalog-panel{padding:17px}.article-table-head,.article-row{grid-template-columns:minmax(0,1fr) 105px;gap:8px;padding-left:10px;padding-right:10px}.article-name,.article-pack{font-size:.76rem}
}
@media(max-width:480px){
 .quick{grid-template-columns:1fr}.hero h1{font-size:2.35rem}.hero-brand:before{width:190px;height:190px}.hero-brand img{width:190px;height:190px}
}

.reservation-inline,.reservation-card{
  margin-top:18px;
}
.reservation-inline{
  padding:18px;
  border:1px solid rgba(111,180,255,.24);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(52,132,219,.14),rgba(255,255,255,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.reservation-inline strong{display:block;font-size:1.05rem;margin-bottom:4px}
.reservation-inline span{display:block;opacity:.78;font-size:.88rem;margin-bottom:13px}
.reservation-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 17px;
  border-radius:11px;
  text-decoration:none;
  font-weight:850;
  background:linear-gradient(135deg,#58adff,#2e79dc);
  color:#fff!important;
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 8px 24px rgba(39,124,220,.28),inset 0 1px 0 rgba(255,255,255,.3);
}
.reservation-btn:hover{transform:translateY(-1px);filter:brightness(1.06)}

.availability-box{
  margin-top:18px;
  padding:18px;
  border:1px solid rgba(84,172,255,.28);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(36,112,191,.18),rgba(255,255,255,.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 28px rgba(0,0,0,.12);
}
.availability-status{display:flex;align-items:center;gap:10px}
.availability-dot{
  width:11px;height:11px;border-radius:50%;
  background:#39d98a;box-shadow:0 0 12px rgba(57,217,138,.8);
  flex:none
}
.availability-box.is-unavailable .availability-dot{
  background:#ff5f67;box-shadow:0 0 12px rgba(255,95,103,.75)
}
.availability-box p{margin:8px 0 0;opacity:.8}
.blocked-dates{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.blocked-date{
  padding:7px 10px;border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  font-size:.78rem
}

/* V16: Aufklappbare Sortiment-Kategorien */
.accordion-group{
  border:1px solid rgba(111,180,255,.18);
  border-radius:16px;
  overflow:hidden;
  background:rgba(255,255,255,.025);
  margin-top:14px;
}
.accordion-summary{
  cursor:pointer;
  list-style:none;
  padding:16px 18px;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:linear-gradient(135deg,rgba(65,145,235,.12),rgba(255,255,255,.02));
  user-select:none;
}
.accordion-summary::-webkit-details-marker{display:none}
.accordion-summary>div{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.accordion-summary h3{margin:0}
.accordion-summary>div>span{font-size:.76rem;opacity:.72}
.accordion-chevron{
  font-size:1.4rem;
  color:#69b7ff;
  transition:transform .2s ease;
}
.accordion-group[open] .accordion-chevron{transform:rotate(180deg)}
.accordion-group .article-table{
  border:none;
  border-top:1px solid rgba(111,180,255,.15);
  border-radius:0;
}
.catalog-group{scroll-margin-top:110px}
@media(max-width:600px){
  .accordion-summary{padding:14px}
}

.main-site-link{
  margin-left:auto;text-decoration:none;color:#8ec8ff;font-size:.82rem;font-weight:800;
  padding:9px 12px;border:1px solid rgba(105,183,255,.25);border-radius:10px;
  background:rgba(255,255,255,.03)
}
.main-site-link:hover{background:rgba(73,154,240,.12)}
.website-hero-btn{
  display:inline-flex;align-items:center;justify-content:center;margin-top:14px;
  padding:11px 15px;border-radius:11px;text-decoration:none;font-weight:850;color:#fff!important;
  border:1px solid rgba(122,191,255,.26);
  background:linear-gradient(135deg,rgba(69,153,240,.25),rgba(255,255,255,.05));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)
}
.bottom-nav{grid-template-columns:repeat(5,1fr)!important}
@media(max-width:720px){.main-site-link{font-size:.72rem;padding:8px 10px}}

/* V18: Firmenlogo oben deutlich größer */
.site-header .header-inner img,
header .header-inner img{
  width:82px !important;
  height:82px !important;
  object-fit:contain;
}
.site-header .header-inner,
header .header-inner{
  min-height:96px;
}
@media(max-width:720px){
  .site-header .header-inner img,
  header .header-inner img{
    width:68px !important;
    height:68px !important;
  }
  .site-header .header-inner,
  header .header-inner{
    min-height:80px;
  }
}

/* V19: Instagram & Facebook */
.social-links{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:18px;
}
.social-btn{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  padding:10px 15px;
  border-radius:12px;
  text-decoration:none;
  color:#fff!important;
  font-weight:850;
  border:1px solid rgba(125,190,255,.25);
  background:linear-gradient(135deg,rgba(44,128,221,.25),rgba(255,255,255,.05));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 8px 22px rgba(0,0,0,.14);
  transition:transform .18s ease,filter .18s ease;
}
.social-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.social-icon{
  width:25px;height:25px;border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.10);
  font-size:1rem;font-weight:950;
}
.footer-social{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  padding-top:10px;
  font-size:.78rem;
}
.footer-social a{color:#8ec8ff;text-decoration:none;font-weight:800}
.footer-social a:hover{text-decoration:underline}
@media(max-width:600px){
  .social-links{display:grid;grid-template-columns:1fr 1fr}
  .social-btn{justify-content:center;padding:10px}
}