@media only screen and (max-width: 768px) {
  /* Layout – sidebar hore, obsah pod ním */
  .container { 
    display: block !important; 
    margin-left: 0 !important; 
  }

  nav.sidebar {
    position: relative !important;
    width: 100% !important;
    min-height: auto !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 2;
    padding: 12px 16px;
    box-sizing: border-box;
  }

  nav.sidebar ul { 
    display: flex; 
    flex-direction: column; 
    gap: 8px; 
    padding: 0; 
    margin: 0;
  }

  nav.sidebar ul li a { 
    font-size: 18px; 
    padding: 10px 12px; 
  }

  main.content { 
    padding: 16px !important; 
  }

  /* Header */
  .header-image { 
    height: auto !important; 
    overflow: visible; 
    padding: 16px 0;
  }

  .header-image h1 { 
    position: static !important; 
    transform: none !important; 
    font-size: 1.8rem !important; 
    text-align: center; 
    margin: 12px 0 0 0;
  }

  .header-image .subtitle {
    position: static !important;
    text-align: center;
    font-size: 1rem !important;
    margin: 4px 0 0 0;
  }

  /* Text a obrázky v sekcii Úvod pod seba */
  .uvod-section, .o-mne, .onas-section, .kangal-section { 
    display: block !important; 
  }

  .uvod-section .text,
  .uvod-section .image,
  .o-mne .text, .o-mne .foto,
  .onas-section .text, .onas-section .image,
  .kangal-section .text, .kangal-section .image {
    width: 100% !important; 
    max-width: 100% !important; 
    margin: 0 0 16px 0;
  }

  img { 
    max-width: 100% !important; 
    height: auto !important; 
  }

  /* Titulky */
  h1 { font-size: 2rem !important; }
  h2 { font-size: 1.6rem !important; }
  h3 { font-size: 1.3rem !important; }

  section { 
    padding: 20px 16px !important; 
  }

  /* --- SUBMENU len na klik --- */
  .has-submenu .submenu-panel {
    display: none !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    border: none !important;
    box-shadow: none !important;
    padding-left: 15px;
  }

  .has-submenu.open .submenu-panel {
    display: block !important;
  }

  .has-submenu.open .arrow {
    transform: rotate(90deg);
  }
}
@media only screen and (max-width: 768px) {
  .has-submenu:hover .submenu-panel {
    display: none; /* vypneme hover otváranie */
  }
}



@media only screen and (max-width: 768px) {
  .lang-switch { justify-content: center; margin: 8px 0; }
}