/* hotbytes Mitglied-Profil – Walldürn Gemeinsam (04.11.2026) */
.wgp{--petrol:#083A49;--petrol-2:#0d4b5e;--rot:#D3280F;--grau:#f2f4f5;--linie:#dde3e6;--text:#1c2b31;--text-2:#55666d;--radius:14px;
  font-family:"Public Sans",system-ui,sans-serif;color:var(--text);line-height:1.55;font-size:16px;width:100%}
body .wgp *,body .wgp *::before,body .wgp *::after{box-sizing:border-box}
body .wgp a{color:inherit}
body .wgp .wgp-wrap{max-width:1180px;margin:0 auto;padding:0 20px}
body .wgp .wgp-script{font-family:"Pacifico",cursive;font-weight:400;color:var(--rot);display:block;line-height:1.3}
body .wgp h1,body .wgp h2,body .wgp h3{font-family:"Public Sans",system-ui,sans-serif;letter-spacing:0;text-transform:none}

/* Knöpfe */
body .wgp .wgp-btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 18px;font-weight:700;font-size:15px;line-height:1.2;text-decoration:none;border:2px solid transparent;cursor:pointer;white-space:nowrap;transition:filter .15s,background .15s}
body .wgp .wgp-btn:hover{filter:brightness(1.08)}
body .wgp .wgp-btn svg{width:18px;height:18px;flex:none}
body .wgp .wgp-btn-rot{background:var(--rot);color:#fff}
body .wgp .wgp-btn-petrol{background:var(--petrol);color:#fff}
body .wgp .wgp-btn-rand{border-color:var(--petrol);color:var(--petrol);background:#fff}

/* Vorschau-Leiste (nur bei Passwortschutz) */
body .wgp .wgp-review{background:#fff7d6;border-bottom:1px solid #eedc8f;font-size:15px}
body .wgp .wgp-review .wgp-wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}
body .wgp .wgp-review b{color:var(--petrol)}
body .wgp .wgp-btns{display:flex;gap:8px;flex-wrap:wrap}

/* Passwortformular */
body .wgp-pw .wgp-wrap{max-width:640px;padding-top:72px;padding-bottom:96px}
body .wgp-pw h1{color:var(--petrol);font-size:36px;margin:0 0 12px;line-height:1.15}
body .wgp-pw .post-password-form input[type=password]{border:2px solid var(--linie);border-radius:10px;padding:10px 12px;font-size:16px;margin-top:6px;max-width:100%}
body .wgp-pw .post-password-form input[type=submit]{background:var(--rot);color:#fff;border:0;border-radius:999px;padding:11px 22px;font-weight:700;cursor:pointer;margin-top:8px}

/* Titelbereich */
body .wgp .wgp-hero{position:relative;background:var(--petrol);color:#fff;overflow:hidden}
body .wgp .wgp-hero-img{position:absolute;top:0;bottom:0;left:42%;right:0}
body .wgp .wgp-hero-img img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
body .wgp .wgp-hero-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--petrol) 0%,rgba(8,58,73,.55) 30%,rgba(8,58,73,0) 65%)}
body .wgp .wgp-ki{position:absolute;right:14px;bottom:12px;font-size:12px;background:rgba(0,0,0,.55);color:#fff;padding:3px 9px;border-radius:6px;z-index:2}
body .wgp .wgp-hero-in{position:relative;z-index:1;padding-top:calc(var(--wgp-kopf,120px) + 36px);padding-bottom:52px;min-height:340px;display:flex;flex-direction:column;justify-content:center}
body .wgp .wgp-hero:not(.wgp-hero-bild) .wgp-hero-in{min-height:0}
body .wgp .wgp-hero-in{min-height:calc(var(--wgp-kopf,120px) + 300px)}
body .wgp-pw .wgp-wrap{padding-top:calc(var(--wgp-kopf,120px) + 48px)}
body .wgp .wgp-krumen{font-size:14px;opacity:.85;margin-bottom:16px}
body .wgp .wgp-krumen a{text-decoration:none;color:#fff}
body .wgp .wgp-kat{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600;margin-bottom:14px;width:max-content;max-width:100%}
body .wgp .wgp-hero h1{font-size:clamp(32px,5vw,54px);line-height:1.06;margin:0 0 10px;font-weight:800;max-width:600px;color:#fff}
body .wgp .wgp-unter{font-size:19px;margin:0;max-width:540px;opacity:.92;color:#fff}
body .wgp .wgp-scheck{margin-top:24px;display:inline-flex;align-items:center;gap:12px;background:#fff;color:var(--petrol);border-radius:12px;padding:10px 16px 10px 10px;width:max-content;max-width:100%;box-shadow:0 8px 24px rgba(0,0,0,.18)}
body .wgp .wgp-ic{width:42px;height:42px;border-radius:10px;background:var(--rot);display:grid;place-items:center;flex:none}
body .wgp .wgp-ic svg{width:24px;height:24px;color:#fff}
body .wgp .wgp-scheck b{display:block;font-size:16px}
body .wgp .wgp-scheck small{color:var(--text-2);font-size:13px}
body .wgp .wgp-scheck small a{color:var(--petrol)}

/* Schnellaktionen */
body .wgp .wgp-aktionen{background:#fff;border-bottom:1px solid var(--linie)}
body .wgp .wgp-aktionen .wgp-wrap{display:flex;gap:10px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}

/* Inhalt */
body .wgp .wgp-main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:48px;padding-top:52px;padding-bottom:64px}
body .wgp h2{font-size:28px;margin:0 0 14px;color:var(--petrol);line-height:1.2;font-weight:700}
body .wgp h2 .wgp-script{font-size:28px;margin-bottom:2px}
body .wgp .wgp-intro{font-size:18px;margin:0 0 26px}
body .wgp .wgp-intro p{margin:0 0 12px}
body .wgp .wgp-merkmale{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 34px;padding:0;list-style:none}
body .wgp .wgp-merkmale li{display:flex;align-items:center;gap:7px;background:var(--grau);border-radius:999px;padding:7px 14px;font-size:14px;font-weight:600;color:var(--petrol);margin:0}
body .wgp .wgp-merkmale li svg{width:16px;height:16px;color:var(--rot)}
body .wgp .wgp-person{display:flex;gap:18px;align-items:center;background:var(--grau);border-radius:var(--radius);padding:20px}
body .wgp .wgp-avatar{width:76px;height:76px;border-radius:50%;background:var(--petrol);color:#fff;display:grid;place-items:center;font-weight:800;font-size:24px;flex:none;overflow:hidden}
body .wgp .wgp-avatar img{width:100%;height:100%;object-fit:cover}
body .wgp .wgp-person b{display:block;font-size:18px;color:var(--petrol)}
body .wgp .wgp-person span{display:block;color:var(--text-2);font-size:15px}
body .wgp .wgp-person a{color:var(--petrol);font-weight:600;font-size:15px;text-decoration:none}

/* Kontaktkarte */
body .wgp .wgp-karte{border:1px solid var(--linie);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(8,58,73,.07);align-self:start}
body .wgp .wgp-logo{padding:26px;display:grid;place-items:center;border-bottom:1px solid var(--linie);background:#fff}
body .wgp .wgp-logo img{max-width:100%;max-height:110px;width:auto;height:auto;object-fit:contain}
body .wgp dl{margin:0;padding:6px 24px 16px}
body .wgp dl>div{display:grid;grid-template-columns:28px 1fr;gap:10px;padding:13px 0;border-bottom:1px solid var(--linie)}
body .wgp dl>div:last-child{border-bottom:0}
body .wgp dt{margin:0}
body .wgp dt svg{width:20px;height:20px;color:var(--rot);margin-top:2px}
body .wgp dd{margin:0;font-size:15px;word-break:break-word}
body .wgp dd small{display:block;color:var(--text-2);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
body .wgp dd a{color:var(--petrol);font-weight:600;text-decoration:none}
body .wgp .wgp-zeiten p{margin:0}

/* Karte (OpenStreetMap im CI) */
body .wgp .wgp-map{position:relative;height:280px;background:#dfe7e9;border-top:1px solid var(--linie)}
body .wgp .wgp-map-platz{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:16px;
  background:repeating-linear-gradient(35deg,#e6edef 0 18px,#dbe4e7 18px 20px),#e6edef}
body .wgp .wgp-map-platz small{font-size:12px;color:var(--text-2);max-width:220px}
body .wgp .wgp-map-pin{width:40px;height:52px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}
body .wgp .wgp-map-leaflet{position:absolute;inset:0}
body .wgp .wgp-map-leaflet .leaflet-tile-pane{filter:grayscale(1) sepia(1) hue-rotate(165deg) saturate(.38) brightness(.9) contrast(1.08)}
body .wgp .leaflet-container{font-family:"Public Sans",sans-serif}
body .wgp .leaflet-bar a{background:var(--petrol)!important;color:#fff!important;border-color:rgba(255,255,255,.2)!important}
body .wgp .leaflet-control-attribution{font-size:10px;background:rgba(255,255,255,.85)!important}
body .wgp .leaflet-control-attribution a{color:var(--petrol)}
body .wgp .wgp-pin svg{width:44px;height:56px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.3))}
body .wgp .leaflet-popup-content-wrapper{border-radius:12px;box-shadow:0 8px 24px rgba(8,58,73,.2)}
body .wgp .leaflet-popup-content{margin:12px 16px;font-size:14px;line-height:1.4;color:var(--text)}
body .wgp .leaflet-popup-content b{color:var(--petrol);font-size:15px}
body .wgp .leaflet-popup-content a{color:var(--rot);font-weight:700;text-decoration:none}
body .wgp .wgp-route{position:absolute;left:12px;bottom:12px;z-index:500;font-size:13px;padding:8px 14px;box-shadow:0 4px 14px rgba(0,0,0,.2)}

/* Einkaufsscheck-Band */
body .wgp .wgp-band{background:var(--grau)}
body .wgp .wgp-band .wgp-wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center;padding-top:48px;padding-bottom:48px}
body .wgp .wgp-band .wgp-script{font-size:24px}
body .wgp .wgp-band h3{font-size:30px;margin:0 0 8px;color:var(--petrol);line-height:1.15;font-weight:800}
body .wgp .wgp-band p{margin:0 0 18px;color:var(--text-2);font-size:17px}
body .wgp .wgp-band .wgp-btn{margin:0 6px 6px 0}
body .wgp .wgp-schritte{display:grid;gap:10px}
body .wgp .wgp-schritt{background:#fff;border-radius:12px;padding:14px 16px;display:flex;gap:12px;align-items:center;font-weight:600;color:var(--petrol)}
body .wgp .wgp-schritt span{width:30px;height:30px;border-radius:50%;background:var(--rot);color:#fff;display:grid;place-items:center;font-size:14px;flex:none}

/* Weitere Mitglieder */
body .wgp .wgp-weitere .wgp-wrap{padding-top:52px;padding-bottom:64px}
body .wgp .wgp-kopf{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap}
body .wgp .wgp-kopf h2{margin:0}
body .wgp .wgp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
body .wgp .wgp-mkarte{border:1px solid var(--linie);border-radius:var(--radius);padding:18px;text-decoration:none;display:flex;flex-direction:column;gap:4px;transition:.15s;background:#fff}
body .wgp .wgp-mkarte:hover{border-color:var(--petrol);box-shadow:0 8px 22px rgba(8,58,73,.1)}
body .wgp .wgp-mlogo{height:64px;display:flex;align-items:center;margin-bottom:8px}
body .wgp .wgp-mlogo img{max-height:64px;max-width:160px;width:auto;height:auto;object-fit:contain}
body .wgp .wgp-mkarte b{color:var(--petrol);font-size:17px}
body .wgp .wgp-mkarte small{color:var(--text-2)}
body .wgp .wgp-tag{margin-top:6px;font-size:12px;font-weight:700;color:var(--rot)}

/* Tablet/Handy */
@media (max-width:900px){
  body .wgp .wgp-main{grid-template-columns:1fr;gap:32px;padding-top:34px}
  body .wgp .wgp-band .wgp-wrap{grid-template-columns:1fr}
}
@media (max-width:760px){
  body .wgp .wgp-hero-img{left:0;opacity:.35}
  body .wgp .wgp-hero-img::after{background:linear-gradient(180deg,rgba(8,58,73,.2),var(--petrol))}
  body .wgp .wgp-hero-in{min-height:0;padding-top:calc(var(--wgp-kopf,90px) + 24px);padding-bottom:38px}
  body .wgp .wgp-aktionen{position:fixed;left:0;right:0;bottom:0;z-index:999;border-top:1px solid var(--linie);border-bottom:0;box-shadow:0 -6px 20px rgba(0,0,0,.08)}
  body .wgp .wgp-aktionen .wgp-wrap{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;padding:8px 10px}
  body .wgp .wgp-aktionen .wgp-btn{flex-direction:column;gap:3px;font-size:12px;padding:8px 4px;border-radius:10px;justify-content:center}
  .wgp{padding-bottom:76px}
  body .wgp h2{font-size:24px}
}