*{box-sizing:border-box}
body{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;color:#333;background:#faf9f2;line-height:1.6}
.site-header{background:#fff;border-bottom:1px solid #d9ded6}
.header-inner{width:1100px;max-width:94%;margin:auto;padding:22px 0 0}
.brand{text-align:center;padding-bottom:18px}
.brand-name{color:#009845;font-size:30px;font-weight:bold}
.brand-slogan{color:#777;font-size:16px}
.main-menu{text-align:center;border-top:1px solid #e6e6e6}
.main-menu a{display:inline-block;padding:14px 17px;color:#007f3b;text-decoration:none;font-size:15px;font-weight:bold}
.main-menu a:hover,.main-menu a.active{color:#fff;background:#009845;border-bottom:4px solid #fecc00}
.content{width:1100px;max-width:94%;margin:auto}
.welcome{background:#eef7f1;text-align:center;padding:48px 20px}
.welcome h1{margin:0 0 12px;color:#007f3b;font-size:34px}
.welcome p{margin:auto;max-width:760px;color:#5f6b63;font-size:18px}
.photo-section{background:#fff;text-align:center;padding:45px 20px 50px}
.board-photo{display:block;width:606px;max-width:100%;height:auto;margin:0 auto 25px;border:7px solid #fff;box-shadow:0 3px 14px rgba(0,0,0,.18)}
.photo-section h2{color:#009845;font-size:27px;margin:10px 0 5px}
.photo-section p{max-width:750px;margin:auto;color:#666;font-size:17px}
.content-section{padding:55px 20px;background:#faf9f2}
.content-section h2{text-align:center;color:#009845;font-size:30px;margin:0 0 30px}
.boxes{display:flex;gap:24px}
.box{flex:1;background:#fff;border:1px solid #e0e3dd;border-top:5px solid #009845;padding:24px;min-height:190px}
.box h3{margin:0 0 10px;color:#009845;font-size:21px}
.box p{color:#666;margin:0 0 15px}
.box a{color:#009845;font-weight:bold;text-decoration:none}
.box a:hover{text-decoration:underline}
footer{background:#009845;color:#fff;text-align:center;padding:25px 20px}
footer p{margin:4px}
footer a{color:#fff;text-decoration:none}
@media screen and (max-width:800px){
.header-inner{max-width:100%;padding-top:18px}
.brand-name{font-size:25px}
.main-menu a{padding:11px 10px;font-size:14px}
.welcome h1{font-size:27px}
.boxes{display:block}
.box{margin-bottom:18px}
}

/* Eyecatcher */
.slogan{
    margin: 30px auto 0;
    color: #FECC00;
    font-size: 42px;
    font-weight: bold;
    line-height: 1.15;
    text-align: center;
    text-shadow: 0 1px 1px rgba(0,0,0,0.08);
}
@media screen and (max-width:800px){
    .slogan{font-size:31px}
}

/* Programm / Termine */
.program-header{
    background-color:#009845;
    color:#ffffff;
    padding:45px 20px;
    text-align:center;
}
.program-kicker{
    color:#FECC00;
    font-size:24px;
    font-weight:bold;
    letter-spacing:.3px;
}
.program-header h1{
    margin:5px 0;
    font-size:38px;
}
.program-period{
    color:#FECC00;
    font-size:24px;
    font-weight:bold;
}
.program-intro{
    max-width:800px;
    margin:0 auto 30px;
    text-align:center;
    color:#666;
}
.month-box{
    background:#ffffff;
    border-left:7px solid #FECC00;
    margin:0 0 18px;
    padding:18px 22px;
    box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.month-box h3{
    margin:0 0 5px;
    color:#009845;
    font-size:24px;
}
.month-box p{
    margin:0;
    color:#666;
}

/* Termine – neues Programm-Layout */
.guest-note{
    text-align:center;
    font-size:20px;
    font-weight:bold;
    color:#009845;
    margin:0 0 35px;
}
.month-title{
    color:#009845;
    font-size:30px;
    margin:45px 0 18px;
    padding:10px 16px;
    border-left:9px solid #FECC00;
    background:#eef4eb;
}
.event-card{
    background:#ffffff;
    border:1px solid #d9dfd5;
    border-left:7px solid #009845;
    margin:0 0 26px;
    padding:24px 28px;
    box-shadow:0 3px 12px rgba(0,0,0,.07);
}
.event-date{
    color:#d60000;
    font-weight:bold;
    font-size:22px;
    line-height:1.25;
    margin-bottom:10px;
}
.event-card h3{
    color:#3f6039;
    font-size:24px;
    margin:0 0 15px;
}
.event-card p{
    margin:0 0 11px;
    color:#555;
}
.event-details{
    margin-top:18px;
    padding-top:14px;
    border-top:1px solid #e7eadf;
}
.preview-section{
    background:#e9efe6;
    padding:45px 20px;
}

/* Monatssprung */
.month-jump{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin:25px auto 5px;
}
.month-jump a{
    display:inline-block;
    background:#FECC00;
    color:#006f34;
    text-decoration:none;
    font-weight:bold;
    padding:8px 15px;
    border-radius:5px;
    border:1px solid rgba(255,255,255,.65);
}
.month-jump a:hover{
    background:#ffffff;
    color:#009845;
}
@media screen and (max-width:800px){
    .month-jump{
        gap:6px;
    }
    .month-jump a{
        padding:7px 11px;
        font-size:14px;
    }
    .event-date{
        font-size:20px;
    }
}


/* Rückblick */
.retro-header{
    background:#009845;
    color:#fff;
    padding:45px 20px 35px;
    text-align:center;
}
.retro-kicker{
    color:#FECC00;
    font-size:20px;
    font-weight:bold;
}
.retro-header h1{
    margin:5px 0 8px;
    font-size:40px;
}
.retro-header p{
    margin:0 auto;
    max-width:760px;
    font-size:18px;
}
.retro-jump{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin:25px auto 0;
}
.retro-jump a{
    background:#FECC00;
    color:#006f34;
    text-decoration:none;
    font-weight:bold;
    padding:8px 14px;
    border-radius:5px;
}
.retro-jump a:hover{
    background:#fff;
    color:#009845;
}
.retro-content{
    padding:35px 0 55px;
}
.retro-card{
    background:#fff;
    border:1px solid #d9dfd5;
    border-left:8px solid #009845;
    margin:0 auto 32px;
    padding:25px 30px 28px;
    max-width:1050px;
    box-shadow:0 3px 12px rgba(0,0,0,.07);
}
.retro-date{
    color:#d60000;
    font-size:21px;
    font-weight:bold;
    line-height:1.35;
    margin-bottom:6px;
}
.retro-card h2{
    color:#3f6039;
    font-size:27px;
    margin:0 0 18px;
}
.retro-gallery{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:0 0 15px;
    justify-content:center;
}
.retro-photo{
    display:block;
    width:220px;
}
.retro-photo img{
    display:block;
    width:100%;
    height:160px;
    object-fit:cover;
    border:4px solid #fff;
    box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.retro-photo img:hover{
    opacity:.9;
}
.retro-credit{
    color:#666;
    font-size:14px;
    font-style:italic;
    margin:8px 0 14px;
}
.retro-text{
    color:#4d4d4d;
    font-size:17px;
}
.retro-text p{
    margin:0 0 13px;
}
.photo-button{
    display:inline-block;
    background:#FECC00;
    color:#006f34;
    font-weight:bold;
    text-decoration:none;
    padding:9px 18px;
    border-radius:5px;
    margin:2px 0 15px;
}
.photo-button:hover{
    background:#009845;
    color:#fff;
}
.retro-created{
    margin-top:20px;
    padding-top:10px;
    border-top:1px solid #e5e8e2;
    color:#888;
    font-size:12px;
}
@media screen and (max-width:800px){
    .retro-header h1{font-size:31px}
    .retro-card{padding:20px 18px}
    .retro-card h2{font-size:23px}
    .retro-photo{width:calc(50% - 6px)}
    .retro-photo img{height:130px}
}


.retro-gallery-three .retro-photo{width:31%; max-width:300px;}
.retro-gallery-three .retro-photo img{height:145px;}
.retro-action-card .retro-text{margin-bottom:18px;}

/* Einzelnes Vorschaubild im Rückblick */
.retro-gallery-single .retro-photo{
    width:100%;
    max-width:620px;
}
.retro-gallery-single .retro-photo img{
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
}

/* Einzelner Rückblick mit Bildergalerie */
.retro-detail-header{
    background:#009845;
    color:#fff;
    padding:42px 20px 34px;
    text-align:center;
}
.retro-detail-header .retro-kicker{
    color:#FECC00;
    font-size:20px;
    font-weight:bold;
}
.retro-detail-header h1{
    margin:6px 0 8px;
    font-size:38px;
}
.retro-detail-header .retro-detail-date{
    color:#FECC00;
    font-size:21px;
    font-weight:bold;
}
.retro-detail{
    max-width:1050px;
    margin:0 auto;
    padding:35px 20px 55px;
}
.retro-detail-card{
    background:#fff;
    border:1px solid #d9dfd5;
    border-left:8px solid #009845;
    padding:28px 30px 34px;
    box-shadow:0 3px 12px rgba(0,0,0,.07);
}
.retro-detail-text{
    color:#4d4d4d;
    font-size:18px;
    line-height:1.7;
    margin-bottom:30px;
}
.retro-detail-text p{margin:0 0 14px}
.gallery-title{
    color:#009845;
    font-size:28px;
    margin:10px 0 18px;
}
.local-gallery{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
}
.local-gallery a{
    display:block;
    text-decoration:none;
}
.local-gallery img{
    display:block;
    width:100%;
    height:165px;
    object-fit:cover;
    border:4px solid #fff;
    box-shadow:0 2px 8px rgba(0,0,0,.16);
    transition:transform .15s ease, opacity .15s ease;
}
.local-gallery img:hover{
    opacity:.9;
    transform:scale(1.02);
}
.gallery-note{
    color:#777;
    font-size:14px;
    font-style:italic;
    margin:0 0 18px;
}
.back-link{
    display:inline-block;
    margin-top:28px;
    background:#FECC00;
    color:#006f34;
    text-decoration:none;
    font-weight:bold;
    padding:9px 18px;
    border-radius:5px;
}
.back-link:hover{
    background:#009845;
    color:#fff;
}
@media screen and (max-width:900px){
    .local-gallery{grid-template-columns:repeat(2,1fr)}
}
@media screen and (max-width:650px){
    .retro-detail-header h1{font-size:30px}
    .retro-detail-card{padding:20px 18px 25px}
    .retro-detail-text{font-size:17px}
    .local-gallery{grid-template-columns:repeat(2,1fr);gap:9px}
    .local-gallery img{height:135px}
}


/* Komfortable Bilder-Grossansicht mit Navigation */
body.lightbox-open { overflow: hidden; }
.lightbox {
  display:none; position:fixed; z-index:9999; inset:0;
  background:rgba(0,0,0,.90); align-items:center; justify-content:center;
}
.lightbox.open { display:flex; }
.lightbox-content { max-width:90vw; max-height:88vh; text-align:center; }
.lightbox-content img { max-width:90vw; max-height:82vh; width:auto; height:auto; object-fit:contain; border-radius:4px; box-shadow:0 4px 25px rgba(0,0,0,.45); }
.lightbox button { position:absolute; border:0; background:rgba(0,152,69,.85); color:#FECC00; cursor:pointer; font-size:32px; line-height:1; width:52px; height:52px; border-radius:50%; }
.lightbox button:hover { background:#009845; }
.lightbox-close { top:20px; right:20px; font-size:38px !important; }
.lightbox-prev { left:20px; top:50%; transform:translateY(-50%); }
.lightbox-next { right:20px; top:50%; transform:translateY(-50%); }
.lightbox-counter { color:white; margin-top:8px; font-size:16px; }
@media (max-width:700px) {
  .lightbox-content { max-width:96vw; max-height:88vh; }
  .lightbox-content img { max-width:96vw; max-height:78vh; }
  .lightbox button { width:44px; height:44px; font-size:26px; }
  .lightbox-close { top:12px; right:12px; }
  .lightbox-prev { left:8px; }
  .lightbox-next { right:8px; }
  .lightbox-counter { font-size:14px; }
}

.eyecatcher{background:#009845;color:#FECC00;font-size:56px;font-weight:800;text-align:center;padding:28px 20px;margin:28px auto 10px;border-radius:8px;line-height:1.1;}

@media screen and (max-width:800px){ .eyecatcher{font-size:36px;} .retro-gallery-single .retro-photo{max-width:100%;} }

/* Einheitliche große Fotos im Rückblick 2026 */
.retro-gallery{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:18px;
    margin:0 0 18px;
}
.retro-gallery .retro-photo{
    display:block;
    width:100%;
    max-width:800px;
    text-decoration:none;
}
.retro-gallery .retro-photo img,
.retro-gallery .retro-photo-img{
    display:block;
    width:100%;
    height:420px;
    object-fit:cover;
    border:4px solid #fff;
    box-shadow:0 2px 8px rgba(0,0,0,.16);
    box-sizing:border-box;
}
.retro-gallery .retro-photo:hover img{
    opacity:.92;
}
.retro-gallery-single .retro-photo{
    width:100%;
    max-width:800px;
}
.retro-gallery-single .retro-photo img{
    width:100%;
    height:420px;
    object-fit:cover;
}
@media screen and (max-width:800px){
    .retro-gallery .retro-photo,
    .retro-gallery-single .retro-photo{max-width:100%;}
    .retro-gallery .retro-photo img,
    .retro-gallery .retro-photo-img,
    .retro-gallery-single .retro-photo img{
        height:300px;
    }
}


/* Rückblick 2026: Fotos groß, vollständig und nicht anklickbar */
.retro-gallery .retro-photo-img,
.retro-gallery > img {
  width: 100%;
  max-width: 800px;
  height: auto !important;
  object-fit: contain !important;
  display: block;
  margin: 0 auto;
}
.retro-gallery {
  display: block;
}
.retro-gallery .retro-photo {
  display: block;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.retro-gallery .retro-photo:hover img {
  transform: none;
}

/* Rückblick 2026 – kompakte Fotodarstellung ohne Beschneiden */
.retro-gallery{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:center;
  align-items:flex-start;
  gap:14px;
  margin:0 0 18px;
}
.retro-gallery .retro-photo,
.retro-gallery > img,
.retro-gallery .retro-photo-img{
  display:block;
  width:auto;
  max-width:440px;
  height:auto !important;
  object-fit:contain !important;
  margin:0;
  border:3px solid #fff;
  box-shadow:0 2px 7px rgba(0,0,0,.14);
  box-sizing:border-box;
}
.retro-gallery .retro-photo img{
  display:block;
  width:auto;
  max-width:440px;
  height:auto !important;
  object-fit:contain !important;
}
.retro-gallery .retro-photo:hover img{opacity:1; transform:none;}
.retro-gallery-single{
  display:flex;
  justify-content:center;
}
.retro-gallery-single .retro-photo,
.retro-gallery-single > img,
.retro-gallery-single .retro-photo img{
  max-width:560px;
  width:auto;
  height:auto !important;
}
@media screen and (max-width:800px){
  .retro-gallery{gap:9px;}
  .retro-gallery .retro-photo,
  .retro-gallery > img,
  .retro-gallery .retro-photo-img,
  .retro-gallery .retro-photo img{max-width:47vw;}
  .retro-gallery-single .retro-photo,
  .retro-gallery-single > img,
  .retro-gallery-single .retro-photo img{max-width:94vw;}
}