/* Ergänzungen 10/2026: Hintergrundbild-Ausschnitt, Burger-Menü, Handy-Layout */
.menu-toggle{display:none}

/* Hintergrund auf allen Bildschirmen: Ausschnitt links verankert,
   damit das Gesicht auch bei schmalem Fenster sichtbar bleibt */
.backstretch{display:none!important}
body::before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;
  background:#000 url("../../files/darja/img/darja-bg.jpg") 20% 50%/cover no-repeat}

/* Footer immer am unteren Bildschirmrand, wenn der Inhalt kürzer ist */
#wrapper{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
#container{flex:1 0 auto}
#footer{flex-shrink:0}
@media (max-width:767px){

  /* Burger-Menü */
  #navi{position:relative;margin:12px 0 0}
  .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;
    width:48px;height:48px;margin:0 0 0 auto;padding:0 10px;background:none;border:0;cursor:pointer}
  .menu-toggle span{display:block;height:3px;border-radius:2px;background:#c00;transition:transform .25s,opacity .25s}
  #navi.open .menu-toggle span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  #navi.open .menu-toggle span:nth-child(2){opacity:0}
  #navi.open .menu-toggle span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
  #navi ul.level_1{display:none;margin:0;padding:0;background:rgba(0,0,0,.9);border-top:1px solid #400;border-bottom:1px solid #400}
  #navi.open ul.level_1{display:block}
  #navi ul.level_1 > li{float:none;height:auto;margin:0;border-bottom:1px solid #222}
  #navi ul.level_1 > li:last-child{border-bottom:0}
  #navi ul.level_1 li a,#navi ul.level_1 li span{display:block;padding:12px 20px;font-size:20px;line-height:1.2}
  #navi li + .active,#navi ul li .active{background-image:none;float:none;height:auto}
  #navi ul.level_1 li span.active{color:#F0F0F0}
  #navi ul li ul.level_2,#navi ul li:hover ul.level_2{position:static;display:block;margin:0;padding:0 0 6px}
  #navi ul.level_2 li{float:none;height:auto;margin:0;padding:0;background:none;border-top:0}
  #navi ul.level_2 li a,#navi ul.level_2 li span{padding:6px 20px 6px 40px;font-size:17px}
  /* Titel oben links neben dem Burger-Menü */
  #header .inside{position:relative}
  #logo{position:absolute;top:0;left:16px;right:70px;margin:0;line-height:48px;height:48px;
    font-size:clamp(17px,5.4vw,24px);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .untertitel{margin:2px 0 24px;padding-left:16px;text-align:left;font-size:13px;letter-spacing:3px}

  /* Galerie: zwei Spalten */
  .ce_gallery>ul{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 8px}
  .ce_gallery>ul li{float:none;clear:none}
  .ce_gallery figure.image_container{margin:0!important}
  .ce_gallery img{display:block;width:100%;height:auto}
  #container{text-shadow:0 1px 6px rgba(0,0,0,.9)}
}