/* --- NAČTENÍ FONTŮ --- */
        
        /* 1. Načtení Work Sans z Google Fonts pro běžný text */
        @import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;700;900&display=swap');

        /* 2. Načtení vlastního fontu Tyrs pro nadpisy */
        @font-face {
            font-family: 'Tyrs';
            src: url('fonty/ft.woff2') format('woff2');
            font-weight: normal;
            font-style: normal;
            font-display: swap;
        }
        
        @font-face {
            font-family: 'Fugner';
            src: url('fonty/ff.woff2') format('woff2');
            font-weight: normal;
            font-style: normal;
            font-display: swap;
        }

        :root {
            --sokol-cervena: #c8001e;
            --sokol-zluta: #2d2e87;
            
            /* Přiřazení fontů k nadpisům a textu */
            --font-nadpis: 'Tyrs', sans-serif;
            --font-nadpis2: 'Fugner', sans-serif;
            --font-text: 'Work Sans', sans-serif;
        }

        body { 
            margin: 0; 
            font-family: var(--font-text); 
            text-align: center; 
            color: #1a1a1a;
            background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), 
                        url('obr/pozadi.jpg');
            background-size: cover;
            background-attachment: fixed;
            line-height: 1.6;
        }

        header { 
            display: flex; 
            justify-content: space-between; 
            align-items: center; 
            padding: 10px 5%; 
            border-bottom: 5px solid var(--sokol-cervena); 
            background: rgba(255, 255, 255, 0.95); 
            position: sticky;
            top: 0;
            z-index: 1000;
        }

        .logo-container { display: flex; align-items: center; text-decoration: none; gap: 15px; }
        .logo-img { height: 50px; }
        .logo-text { font-family: var(--font-nadpis); color: var(--sokol-cervena); font-size: 1.6rem; text-transform: uppercase; }
        
        nav a { margin-left: 20px; text-decoration: none; color: #333; font-weight: 700; font-size: 0.9rem; text-transform: uppercase; transition: color 0.3s; }
        nav a:hover { color: var(--sokol-cervena); }
        .btn { background: var(--sokol-cervena); color: white !important; padding: 10px 20px; border-radius: 4px; }

        .container {
            max-width: 1100px;
            margin: 60px auto;
            padding: 0 20px;
        }

        h1, h2, h3, h4, h5, h6 {
            font-weight: normal;
        }
           
        h1 {
            font-family: var(--font-nadpis2);
            color: var(--sokol-cervena);
            font-size: clamp(2rem, 6vw, 3.5rem);
            margin-bottom: 30px;
            text-transform: uppercase;
        }
        
        h2 {
            font-family: var(--font-nadpis);
            text-transform: uppercase;
        }

        .hero-box {
            background: white;
            border: 3px solid var(--sokol-cervena);
            padding: 30px;
            margin-bottom: 50px;
            box-shadow: 10px 10px 0px var(--sokol-zluta);
            font-size: 1.1rem;
            font-weight: 500;
        }
                /* --- STYLOVÝ BOX PRO TEXT --- */
        .page-header-box {
            background: white;
            border: 5px solid var(--sokol-cervena);
            padding: 30px;
            margin-bottom: 50px;
            box-shadow: 10px 10px 0px var(--sokol-zluta);
            font-size: 1.1rem;
        }

        .page-header-box p {
            margin: 0;
            font-weight: normal;
        }

        h2.section-title {
            font-family: var(--font-nadpis);
            border-bottom: 4px solid var(--sokol-zluta);
            display: inline-block;
            margin: 40px 0 30px;
            padding-bottom: 5px;
            text-transform: uppercase;
            font-size: 1.8rem;
        }

        .schedule-container {
            margin-bottom: 60px;
            overflow-x: auto;
        }

        table {
            width: 100%;
            border-collapse: collapse;
            background: white;
            box-shadow: 0 10px 20px rgba(0,0,0,0.05);
        }

        th, td {
            border: 1px solid #ddd;
            padding: 15px;
            text-align: center;
        }

        th {
            background-color: var(--sokol-cervena);
            color: white;
            font-family: var(--font-nadpis);
            text-transform: uppercase;
            font-weight: normal;
        }

        .day-label {
            color: var(--sokol-cervena);
            font-family: var(--font-nadpis);
        }

        .sections-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
            margin-bottom: 60px;
        }

        .section-card {
            background: white;
            padding: 30px;
            border-left: 8px solid var(--sokol-cervena);
            box-shadow: 0 10px 20px rgba(0,0,0,0.05);
            text-align: left;
            transition: transform 0.2s;
            display: flex;
            flex-direction: column;
        }

        .section-card:hover { transform: translateY(-5px); }

        .time-tag {
            display: block;
            font-size: 0.8rem;
            font-weight: normal;
            color: #777;
            text-transform: uppercase;
            margin-bottom: 5px;
            font-family: var(--font-nadpis);
        }

        .section-card h3 {
            font-family: var(--font-nadpis);
            font-size: 1.4rem;
            color: #1a1a1a;
            margin: 0 0 10px 0;
            text-transform: uppercase;
        }

        .section-card p {
            margin: 0;
            font-size: 0.95rem;
        }


        .role {
            display: block;
            font-size: 0.8rem;
            font-weight: 900;
            color: #777;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        .name {
            font-family: var(--font-nadpis);
            font-size: 1.4rem;
            color: #1a1a1a;
            display: block;
            margin-bottom: 10px;
        }
        
        .trainers-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 20px;
        }

        .trainer-card {
            background: rgba(45, 46, 135, 0.3); 
            padding: 20px;
            border-bottom: 4px solid var(--sokol-zluta);
        }

        @media (max-width: 768px) {
            header { flex-direction: column; gap: 15px; }
        }

        /* --- SEKCE NOVINKY (Sjednocený styl) --- */
        .news-section {
            padding: 0;
            text-align: center; /* Změněno z left na center pro vycentrování nadpisu */
        }

        .news-title {
            font-family: var(--font-nadpis);
            border-bottom: 4px solid var(--sokol-zluta);
            display: inline-block;
            margin: 40px 0 30px; /* Sjednocené okraje podle druhé stránky */
            padding-bottom: 5px;
            text-transform: uppercase;
            font-size: 1.8rem;
            color: #1a1a1a;
        }

        .news-container {
            display: flex;
            flex-direction: column;
            gap: 60px;
            text-align: left; /* Text novinek zůstane zarovnaný vlevo */
        }

        .news-row {
            display: flex;
            align-items: center;
            gap: 50px;
            flex-wrap: wrap;
        }

        .news-image {
            flex: 1;
            min-width: 300px;
        }

        .news-image img {
            width: 100%;
            height: auto;
            display: block;
            /* Odstraněny stíny a filtry, aby obrázky splývaly */
            filter: none;
            box-shadow: none;
        }

        .news-text {
            flex: 1.2;
            min-width: 300px;
            font-size: 1rem;
            color: #1a1a1a;
        }

        .motto {
            display: block;
            font-family: var(--font-nadpis);
            font-size: 1.6rem;
            color: var(--sokol-cervena);
            margin: 10px 0;
            text-transform: uppercase;
            line-height: 1.2;
        }

        .reverse {
            flex-direction: row-reverse;
        }

        @media (max-width: 768px) {
            header { flex-direction: column; gap: 15px; }
            .news-row, .reverse { flex-direction: column; text-align: center; gap: 30px; }
        }
        
        /* --- OBSAH --- */
        .container {
            max-width: 1100px;
            margin: 40px auto;
            padding: 0 20px;
            flex: 1;
        }

        .support-box {
            background: white;
            padding: 40px;
            border-radius: 15px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
            border-bottom: 8px solid var(--sokol-zluta);
            margin-bottom: 50px;
        }

        .qr-container {
            width: 250px;
            height: 250px;
            margin: 20px auto;
            background: white;
            padding: 15px;
            border: 2px solid #eee;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .qr-real-img { width: 100%; height: 100%; object-fit: contain; }

        /* --- ODMĚNY --- */
        .rewards-section { margin-top: 60px; }
        .rewards-section h2 { 
            font-family: var(--font-nadpis); 
            color: var(--sokol-cervena); 
            font-size: 2.2rem; 
            margin-bottom: 40px; 
            text-transform: uppercase;
        }

        .rewards-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 25px;
            margin-bottom: 80px;
        }

        .reward-card {
            background: rgba(255, 255, 255, 0.8);
            padding: 30px;
            border-radius: 12px;
            border-left: 6px solid var(--sokol-cervena);
            text-align: left;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: all 0.3s ease;
        }

        .reward-card:hover { 
            transform: translateY(-5px); 
            background: white; 
            box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        }

        .price-idr {
            display: block;
            font-family: var(--font-nadpis);
            color: var(--sokol-cervena);
            font-size: 1.4rem;
            margin-bottom: 15px;
            letter-spacing: 0.5px;
        }

        .reward-text { 
            font-weight: 700; 
            line-height: 1.5; 
            font-size: 1.05rem;
            color: #333;
        }

        .vip-card {
            border-left-color: var(--sokol-zluta);
            background: #fffdf0;
        }

        .hint {
            margin-top: 20px;
            font-size: 0.9rem;
            color: #777;
            font-style: italic;
        }
        
/* HLAVNÍ KONTEJNERY */
.time-axis, .grid-container {
    display: grid;
    grid-template-columns: 100px repeat(10, 1fr);
    min-width: 800px; /* Změněno z 1000px */
}

.grid-container {
    align-items: stretch; /* Toto je výchozí a zajistí stejnou výšku buněk */
}



/* OSA ČASU */
.time-axis {
    margin-bottom: 10px;
    height: 25px;
}

.time-axis span {
    font-weight: 900;
    font-size: 0.8rem;
    color: #999;
    grid-row: 1;
    white-space: nowrap;
    justify-self: start; 
    transform: translateX(-50%); /* Střed textu nad čáru */
}

/* Pozice popisků na ose */
.time-axis span:nth-child(2) { grid-column: 2; }  /* 6:00 */
.time-axis span:nth-child(3) { grid-column: 3; }  /* 7:00 */
.time-axis span:nth-child(4) { grid-column: 4; }  /* 8:00 */
.time-axis span:nth-child(5) { grid-column: 5; }  /* 9:00 */
.time-axis span:nth-child(6) { grid-column: 6; }  /* 14:00 */
.time-axis span:nth-child(7) { grid-column: 7; }  /* 15:00 */
.time-axis span:nth-child(8) { grid-column: 8; }  /* 16:00 */
.time-axis span:nth-child(9) { grid-column: 9; }  /* 17:00 */
.time-axis span:nth-child(10) { grid-column: 10; } /* 18:00 */
.time-axis span:nth-child(11) { grid-column: 11; } /* 19:00 */
.time-axis span:last-child { 
    grid-column: 11; 
    justify-self: end; 
    transform: none; /* Tímhle zabráníme přetečení a posuvníku na PC */
    padding-right: 5px;
}

/* VNITŘNÍ ROZVRH */
.day-label {
    grid-column: 1;
    display: flex;
    /* SVISLÉ VYCENTROVÁNÍ */
    align-items: center; 
    /* VODOROVNÉ ZAROVNÁNÍ */
    justify-content: flex-start;
    padding: 0 10px;

    font-family: var(--font-nadpis);
    color: var(--sokol-cervena);
    font-weight: normal;
    font-size: 0.9rem;
    text-transform: uppercase;
    
    /* Spodní linka, aby navazovala na zbytek řádku */
    border-bottom: 1px solid #eee;
    
    /* Vynucení výšky, aby se flexbox měl o co opřít */
    min-height: 80px; 
}

.day-track {
    grid-column: 2 / -1;
    display: grid;
    grid-template-columns: repeat(40, 1fr);
    /* Výška tracku - musí odpovídat labelu */
    min-height: 80px; 
    background: #fcfcfc;
    border-bottom: 1px solid #eee;
    position: relative;
}

/* Svislé linky (KAŽDOU HODINU) */
.day-track::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(to right, #e0e0e0 1px, transparent 1px);
    background-size: 10% 100%; /* 100% / 10 hodin = 10% */
    pointer-events: none;
    z-index: 1;
}

/* DESIGN KARET */
.event-card {
    grid-row: 1;
    z-index: 2;
    margin: 8px 1px;
    background: white;
    border-left: 4px solid var(--sokol-cervena);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 5px;
    overflow: hidden;
}


.event-time { font-weight: 700;  font-size: 0.6rem; color: #777; }
.event-name { font-weight: 700; font-size: 0.75rem }
.kids-event { border-left-color: #4CAF50; }
.group-event { border-left-color: var(--sokol-zluta); }

@media (max-width: 768px) {
    .schedule-wrapper { 
        padding: 10px; 
    }
}
/* Sekce detailů (zůstává stejná) */
.sections-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-top: 50px;
}
.section-card { background: white; padding: 20px; border-left: 5px solid var(--sokol-cervena); text-align: left; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }

@media (max-width: 768px) {
    header nav {
        display: flex;
        flex-wrap: wrap;         /* Dovolí prvkům zalomit se na další řádek, když dojde místo */
        justify-content: center; /* Vystředí všechno hezky na střed */
        align-items: center;
        column-gap: 20px;        /* Udělá vodorovnou mezeru mezi odkazy (O nás, Oddíly...) */
        row-gap: 20px;           /* Udělá svislou mezeru, takže tlačítko odskočí dolů a nebude se překrývat */
    }
    
    header nav a {
        margin-left: 0;          /* Zruší to velké odsazení z počítačové verze */
    }
    
    header nav .btn {
        width: auto;             /* Zabrání tomu, aby bylo tlačítko hrozně široké */
    }
   
    /* Přidaná úprava pro mobilní zobrazení rozvrhu */
    .day-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    .day-header {
        width: 100%;
        text-align: left;
        border-right: none;
        border-bottom: 3px solid var(--sokol-zluta);
        padding-right: 0;
        padding-bottom: 10px;
    }
    
    .event-card {
        width: 100%;
        box-sizing: border-box;
    }
}

/* --- FOTOGALERIE --- */
.gallery-section {
    margin: 60px auto;     /* Odsazení sekce shora a zdola */
    text-align: center;    /* Vystředí nadpis */
}

.gallery-grid {
    display: grid;
    /* Kouzelný řádek: na PC poskládá víc fotek vedle sebe, na mobilu je hodí pod sebe */
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); 
    gap: 15px;             /* Mezery mezi fotkami */
    margin-top: 30px;
}

.gallery-grid img {
    width: 100%;           /* Obrázek vyplní svůj chlívek v mřížce */
    height: 250px;         /* Pevná výška, aby všechny fotky byly stejně velké a dělaly hezké čtverce/obdélníky */
    object-fit: cover;     /* Zajistí, že se fotka ořízne, ale NEDEFORMUJE se (nezdrskne) */
    border-radius: 8px;    /* Jemně zakulacené rohy pro modernější vzhled */
    box-shadow: 0 4px 6px rgba(0,0,0,0.1); /* Lehký stín */
    transition: transform 0.3s ease; /* Příprava na animaci */
}

/* Efekt při najetí myší (na počítači) */
.gallery-grid img:hover {
    transform: scale(1.03); /* Fotka se trošičku zvětší, když na ni najedeš */
}

        footer {
            margin-top: 80px;
            padding: 20px;
            background: #1a1a1a;
            color: white;
        }
        
        /* --- STYLIZACE PATIČKY --- */
/*footer {
    background-color: #fff; /* Nebo barva, kterou tam máš teď 
    padding: 40px 0;
    border-top: 1px solid #eee;
}*/

.footer-content {
    max-width: 1100px;      /* Tady nastav stejnou šířku, jakou máš u zbytku webu */
    margin: 0 auto;         /* Vycentruje patičku na střed */
    padding: 0 20px;        /* Mezera od krajů na mobilech */
    display: flex;
    justify-content: space-between; /* Roztlačí text doleva a ikony doprava */
    align-items: center;    /* Vyrovná je na střed výšky */
}

.footer-text p {
    margin: 0;
    color: white;
}

.social-links {
    display: flex;
    gap: 15px;              /* Mezera mezi FB a IG ikonou */
}

.social-links img {
    width: 30px;            /* Velikost ikonek */
    height: auto;
    transition: transform 0.2s ease;
}

.social-links img:hover {
    transform: scale(1.1);  /* Jemné zvětšení při najetí myší */
}

/* --- RESPONZIVITA (MOBILY) --- */
@media (max-width: 600px) {
    .footer-content {
        flex-direction: column; /* Na mobilu se dají pod sebe */
        text-align: center;
        gap: 20px;
    }
}