body {
      margin: 0;
        font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
          background-color: #d3c3ae;
            color: #1E2D3A;
              line-height: 1.7;
          }

          header {
                background-color: #3E5668;
                  color: white;
                    text-align: center;
                      padding: 1rem;
                        border-bottom: 4px;
                    }

                    /* Tagline unter H1 */
                    .tagline {
                          font-size: 1rem;
                            font-weight: 400;
                              color: #FFD54F;
                                margin: 4px 0 20px;
                                  letter-spacing: 0.3px;
                                    text-align: center;
                                }

                                header h1 {
                                      margin: 0;
                                        font-size: 2rem;
                                    }

                                    body h2 { margin: 0; font-size: 1.5rem; }
                                    body h3 { margin: 0; font-size: 1.3rem; }
                                    body h4 { margin: 0; font-size: 1.1rem; }
                                    body h5 { margin: 0; font-size: 1rem; }

                                    header p {
                                          margin: 0.5rem 0 0;
                                            font-size: 1rem;
                                              color: #D4AF37; /* goldene Farbe */
                                          }

                                          section {
                                                padding: 2rem 1rem;
                                            }

                                            /* Kartenstil für
                                             * strukturierte Inhalte */
    .content-card {
          background-color: #c0c8cd;
            border-left: 5px solid #3E5668;
              padding: 2rem;
                margin: 2rem auto;
                  border-radius: 6px;
                    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
                      max-width: 800px;
                        color: #1E2D3A;
                          line-height: 1.6;
                      }

                      .content-card h2 {
                            background-color: #d3c3ae;
                              box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
                                margin-top: 0;
                                  color: #1E2D3A;
                                    padding: 0.5rem 1rem;
                                      border: 1px solid #405c72;
                                        border-radius: 4px;
                                    }

                                    .content-card p {
                                          font-size: 1rem;
                                            line-height: 1.6;
                                        }

                                        /* Alternative strukturierte Box
                                         * für Textseiten */
    .section {
          padding: 40px 20px;
            max-width: 900px;
              margin: auto;
          }

          .highlight {
                background-color: white;
                  border-left: 5px solid #5E7C99;
                    padding: 20px;
                      margin-bottom: 30px;
                        border-radius: 6px;
                          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
                            color: #1E2D3A;
                        }

                        footer {
                              background-color: #3E5668;
                                color: #FFD54F;
                                  text-align: center;
                                    padding: 1rem;
                                      border-top: 4px solid #D4AF37;
                                  }

                                  footer a {
                                        color: #FFD54F;
                                          text-decoration: none;
                                            font-weight: bold;
                                        }
                                        footer a:hover { color: #FFFFFF; text-decoration: underline; }
                                        footer p { margin: 10px 0; }
                                        footer .contact { color: #FFFFFF; font-weight: 600; }
                                        footer .credits { font-size: 0.85rem; color: #ccc; }

                                        /* === Bilddarstellung für
                                         * responsive Fotos === */
    img.responsive {
          max-width: 100%;
            width: 100%;
              height: auto;
                display: block;
                  margin: 20px auto;
                    border-radius: 8px;
                      box-shadow: 0 4px 8px rgba(0,0,0,0.15);
                  }

                  /* Titel-Foto enger begrenzen */
                  .hero .responsive {
                        max-width: 420px;
                          margin: 0 auto;
                      }
                      @media (max-width: 480px) {
                            .hero .responsive {
                                    max-width: 300px;
                                      }
                                  }

                                  /* Fotostreifen */
                                  .photo-strip {
                                        display: flex;
                                          justify-content: center;
                                            gap: 0.75rem;
                                              margin: 20px 0;
                                          }
                                          .photo-strip img {
                                                width: 100%;
                                                  max-width: 720px;
                                                    height: auto;
                                                      border-radius: 12px;
                                                        box-shadow: 0 4px 12px rgba(0,0,0,.18);
                                                    }

                                                    /* Portraitbilder */
                                                    figure.portrait { margin: 0; text-align: center; }
                                                    figure.portrait figcaption {
                                                          font-size: 0.85rem;
                                                            color: #555;
                                                              margin-top: 0.4rem;
                                                          }
                                                          figure.portrait img {
                                                                display: block;
                                                                  margin-bottom: 1rem;
                                                              }

                                                              /* ===
                                                               * Navigation:
                                                               * Checkbox-Burger
                                                               * (einzige
                                                               * Variante)
                                                               * === */

    /* Button */
    .nav-btn{
          display:inline-block;
            font-weight:700;
              cursor:pointer;
                padding:.6rem 1rem;
                  background:#3E5668;
                    color:#FFD54F;
                      border-radius:6px;
                        margin:0 .75rem .5rem;
                    }

                    /* Menü mobil */
                    .main-nav{
                          display:none;
                            flex-direction:column;
                              gap:.6rem;
                                background:#3E5668;
                                  padding:.75rem 1rem;
                                    border-bottom:4px solid #D4AF37;
                                      overflow-x:auto;
                                        -webkit-overflow-scrolling:touch;
                                    }
                                    .main-nav a{
                                          color:#fff;
                                            text-decoration:none;
                                              font-weight:bold;
                                                white-space:nowrap;
                                            }
                                            .main-nav a:hover{ color:#FFD54F; }

                                            /* Toggle */
                                            #nav-toggle:checked + .nav-btn + .main-nav{ display:flex; }

                                            /* Desktop */
                                            @media (min-width:900px){
                                                  .nav-btn{ display:none; }
                                                    #nav-toggle{ display:none; }
                                                      .main-nav{
                                                              display:flex;
                                                                  flex-direction:row;
                                                                      justify-content:center;
                                                                          gap:1.2rem;
                                                                            }
                                                                        }
.header-name {
      text-align: center;
        font-size: 1.1em;        /* etwas kleiner als die H1 */
          color: #f1c40f;          /* gleiche Farbe wie deine Tagline */
            margin: 0.3em 0 0.6em;   /* oben/unten etwas Abstand */
              font-weight: 600;        /* leicht betont */
          }

