* {
				box-sizing: border-box;
				margin: 0;
				padding: 0;
			}

			body {
				min-height: 100vh;
				display: flex;
				justify-content: center; 
				align-items: center;     
			}

			.grid-layout-4 {
				width: 950px;
				height: 417px;
				display: flex;
				flex-direction: column;  
			}

			.row {
				flex: 1;                             
				display: flex;
			}

			.grid-item {
				flex: 1;                             
				border: 1px solid black;
				transition: transform 0.3s, background-color 0.3s;
			}

			.grid-item.item-1 { background-color: #DD9AE3; }
			.grid-item.item-2 { background-color: #39DBD4; }
			.grid-item.item-3 { background-color: #41AB94; }
			.grid-item.item-4 { background-color: #A14C64; }

			.grid-item:hover {
				transform: scale(1);
				background-color: #854494;
				z-index: 6;
			}