/* ====== RESPONSIVE ====== */
@media (max-width: 1050px) {
	
	:root{
	  --header-h: 42px;
    }
	
	.nav-logo img {
		width: 90px;
	}

	.title {      
      font-size: 35px;      
	  margin-top: -100px;
    }
	
	.maintitle {
		line-height: 45px;
	}


	.subtitle {      
      font-size: 20px;      
	  line-height: 30px;
	  margin-bottom: 8px;
    }		

	
	.video-peek {		      
      width: 100%;     	
	  border-radius: 0px;
	  margin-top: -100px;
    }	
	
	.video-peek video {		            
	  border-radius: 0px;
    }		
	
  .nav-bar { grid-template-columns: auto auto; }
  .nav-toggle { display: inline-flex; }

  .nav-menu {
    position: fixed;
    inset: var(--header-h) 0 0 0;           /* panel začíná pod fixním headerem */
    height: calc(100dvh - var(--header-h)); /* plná výška pod headerem */
    background: #000;                        /* plné černé pozadí */
    overflow-y: auto;                        /* KLÍČ: umožní skrolovat dlouhé menu */
    -webkit-overflow-scrolling: touch;       /* plynulé skrolování v iOS */
    display: grid;
    grid-template-rows: 1fr auto;
    padding: 24px clamp(16px, 5vmin, 32px);
    transform: translateY(-8px);             /* použijeme klasický transform (širší podpora) */
    opacity: 0;
    pointer-events: none;
    transition: transform .25s ease, opacity .25s ease;
    z-index: 1100;                            /* nad obsahem stránky */
  }


  .site-header.is-open .nav-menu {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  .nav-menu > ul {
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
  }

  .nav-cta {   
    padding-top: 16px;
    display: inline-block; 
	
	
  }
  
  .section-card, .program {
	  max-width: 95%;
	  
}

  
}


/* Rezerva pod fixed header, aby ho hero nepřekrýval */
body { padding-top: var(--header-h); }

/* Malý efekt stínu při scrollu */
.scrolled .site-header { box-shadow: 0 10px 28px rgba(0,0,0,.25); }

/* Preferuje-li uživatel méně animací */
@media (prefers-reduced-motion: reduce) {
  .btn, .nav-menu, .burger, .cta-button { transition: none !important; }
}




