body {
    margin: 0;
    padding: 0;
    background: #f5f5f5;
    font-family: Arial, sans-serif;
}

.nadpis {
    text-align: center;
    padding: 25px;
}

.grid {
    width: 90%;
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(14, 1fr);
    grid-auto-rows: 80px;
    gap: 10px;
}

/* Barvy jako v předloze */
.t1 { background: #00b7c6; color: #fff; border-radius: 6px; }
.t2 { background: #00d1df; color: #fff; border-radius: 6px; }

.p1 { background: #6a32c8; color: #fff; border-radius: 6px; }

/* Standardní vzhled všech bloků */
.item {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    border-radius: 8px;
    font-size: 17px;
}

/* --- Rozložení pro jednotlivé bloky --- */

/* První řádek */
.grid > .item:nth-child(1) { grid-column: 1 / span 3; }
.grid > .item:nth-child(2) { grid-column: 4 / span 3; }
.grid > .item:nth-child(3) { grid-column: 7 / span 7; }

/* Design – 2 řádky vysoký */
.design {
    grid-column: 1 / span 6;
    grid-row: span 2;
}

/* Rust */
.rust {
    grid-column: 9 / span 3;
}

/* JavaScript, Layout, Ruby, CSS */
.grid > .item:nth-child(6) { grid-column: 1 / span 3; }
.grid > .item:nth-child(7) { grid-column: 4 / span 3; }
.grid > .item:nth-child(8) { grid-column: 7 / span 3; }
.grid > .item:nth-child(9) { grid-column: 10 / span 3; }

/* PHP + HTML */
.grid > .item:nth-child(10) { grid-column: 7 / span 2; }
.grid > .item:nth-child(11) { grid-column: 9 / span 2; }

/* WebDev – velké pole přes 2 řádky */
.webdev {
    grid-column: 4 / span 7;
    grid-row: span 2;
}

/* Go */
.grid > .item:nth-child(13) {
    grid-column: 1 / span 3;
}

/* Motion – velký fialový */
.motion {
    grid-column: 4 / span 6;
    grid-row: span 2;
}

/* Maya, Nuke */
.grid > .item:nth-child(15) { grid-column: 10 / span 2; }
.grid > .item:nth-child(16) { grid-column: 12 / span 2; }

/* Cinema 4D */
.grid > .item:nth-child(17) { grid-column: 10 / span 4; }

/* After Effects */
.grid > .item:nth-child(18) { grid-column: 4 / span 3; }
