/* =========================================================
   MTS Life — styly sekcí lokalit
   ========================================================= */

/* =========================================================
   SYSTÉM BAREVNÝCH PALET PRO LOKALITY
   Každá lokalita nastaví tělu třídu (palette-park, palette-bazen,
   palette-neutral), která naplní univerzální proměnné
   --c-primary, --c-bg, --c-badge.
   ========================================================= */

/* Výchozí paleta (kdyby nebyla zvolená žádná) = neutral */
:root {
    --c-primary: #1A2B3C;
	--c-primary-rgb: 26 43 60;
    --c-bg: #E6EAEF;
    --c-badge: #0F1924;
}

/* PALETA: Park (hnědá / zemitá) */
.palette-park {
    --c-primary: #795548;
	--c-primary-rgb: 121 85 72;
    --c-bg: #F2EBE9;
    --c-badge: #4A342C;
}

/* PALETA: Bazén (tyrkysová / voda) */
.palette-bazen {
    --c-primary: #03B7D5;
	--c-primary-rgb: 3 183 213;
    --c-bg: #E1F6FA;
    --c-badge: #02768A;
}

/* PALETA: Neutral (sport – pro měření InBody apod.) */
.palette-neutral {
    --c-primary: #1A2B3C;
    --c-bg: #E6EAEF;
    --c-badge: #0F1924;
}

/* =========================================================
   BLOK: HERO LOKALITY
   ========================================================= */

.mts-lokalita-hero {
    position: relative;
    min-height: 70vh;
    display: flex;
    align-items: center;
    padding: 4rem 0;
    overflow: hidden;
    color: white;
}

/* Fonty */
.mts-lokalita-hero,
.mts-lokalita-hero * {
    font-family: var(--font-body);
}
.mts-lokalita-hero .lok-hero-nadpis {
    font-family: var(--font-heading);
}

/* Obrázek na pozadí – začíná až pod hlavičkou (výška hlavičky = 5.5rem) */
.mts-lokalita-hero .lok-hero-bg {
    position: absolute;
    top: 5.5rem;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    z-index: -2;
}

/* Tmavý gradient pro čitelnost – stejně začíná pod hlavičkou */
.mts-lokalita-hero .lok-hero-overlay {
    position: absolute;
    top: 5.5rem;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(26, 43, 60, 0.85), rgba(26, 43, 60, 0.35) 60%, rgba(26, 43, 60, 0.2));
    z-index: -1;
}

/* Vnitřní rozložení – text vlevo, panel vpravo */
.mts-lokalita-hero .lok-hero-inner {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 3rem;
    align-items: center;
    width: 100%;
}

/* --- Levá část (hlavní) --- */
.mts-lokalita-hero .lok-hero-stitek {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
	border-top: 2px solid white;
	border-bottom: 2px solid white;
    opacity: 0.75;
	
}
.mts-lokalita-hero .lok-hero-nadpis {
    font-size: var(--text-h1);
    font-weight: 900;
    line-height: 1.2;
    margin: 0 0 1.5rem 0;
    color: white;
}

/* Štítky pod nadpisem */
.mts-lokalita-hero .lok-hero-stitky {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.mts-lokalita-hero .lok-stitek {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background-color: rgba(255,255,255,0.05);
    backdrop-filter: blur(16px);
    border-radius: 99px;
    font-size: 1rem;
    font-weight: 600;
}
.mts-lokalita-hero .lok-stitek-icon {
    display: inline-flex;
    width: 1.1rem;
    height: 1.1rem;
}
.mts-lokalita-hero .lok-stitek-icon svg {
    width: 100%;
    height: 100%;
}
.mts-lokalita-hero .lok-stitek-icon svg path {
    fill: white;
}

/* --- Pravá část (glass panel) --- */
.mts-lokalita-hero .lok-hero-panel {
    background-color: rgba(255,255,255,0.05);
	backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 1.5rem;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.mts-lokalita-hero .lok-info-blok {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}
.mts-lokalita-hero .lok-info-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 3rem;
    height: 3rem;
    background-color: white;
    border-radius: 50%;
}
.mts-lokalita-hero .lok-info-icon svg {
    width: 50%;
    height: 50%;
}

.mts-lokalita-hero .lok-info-icon svg path {
    fill: var(--c-primary);
}
.mts-lokalita-hero .lok-info-nadpis {
    font-weight: 700;
    font-size: 0.875rem;
    margin: 0 0 0.25rem 0;
    color: white;
	text-transform: uppercase;
}
.mts-lokalita-hero .lok-info-popis {
    font-size: 0.875rem;
    line-height: 1.2;
    margin: 0;
    opacity: 0.85;
}
.mts-lokalita-hero .lok-info-odkaz {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-mind);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mts-lokalita-hero .lok-info-odkaz:hover {
    color: white;    
}

/* === Responzivita === */
@media (max-width: 989px) {
    .mts-lokalita-hero .lok-hero-inner {
        grid-template-columns: 1fr;
        gap: 2rem;
		margin-top: 5rem;
    }

}
@media (max-width: 767px) {
    .mts-lokalita-hero {
        padding: 5rem 0 3rem 0;
    }
	
	.mts-lokalita-hero .lok-stitek {
		font-size: 0.875rem;
		padding: 0.4rem 0.8rem;
    }

    .mts-lokalita-hero .lok-hero-panel {
        padding: 1.5rem;
    }
	
	.mts-lokalita-hero .lok-hero-inner {
        margin-top: 3rem;
	}
}


/* =========================================================
   ARCHIV MĚSTA (výpis lokalit)
   ========================================================= */

.mts-lokality-archiv {
    padding-top: 9rem;   /* odsazení od fixed hlavičky */
    padding-bottom: 6rem;
    background-color: var(--color-bg);
}

/* --- Hlavička archivu --- */
.mts-lokality-archiv .mts-lokality-hlavicka {
    position: relative;
    text-align: center;
    margin: 0 0 4rem 0;
    padding: 3.5rem 2rem;
    background-color: #EBF4FF;
    border-radius: 2rem;
    overflow: hidden;
    isolation: isolate;
}

/* Triskelion vodoznak v rohu hlavičky */
.mts-lokality-archiv .mts-lokality-hlavicka::before {
    content: "";
    position: absolute;
    right: -3rem;
    bottom: -4rem;
    width: 18rem;
    height: 18rem;
    background-color: #4A90E2;
    opacity: 0.06;
    z-index: -1;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 146.3 143'%3E%3Cpath d='M71.4,86.8c2,6.2,5.4,12.6,5.4,12.6c33.2-26.8,44-75.6-4-99.4C42.8,12.2,34.4,47.8,46,70l-0.1-0.1 c11.1-1.1,18.6,0.9,18.6,0.9C46.2,52.6,57,25.4,72.8,16.6h0.4C101.4,36,90.8,67.6,71.4,86.8z M104.4,75.8c21.8,1.6,44.2,20.6,41.8,51.8c-15.6,21.4-64.6,28.8-85.6-35.4c4-1.2,7.8-3,10.8-5.4 c3.2,11,26.8,60.2,61,35.8c-0.6-19.2-13.2-36-36.2-32.4C99.6,82.2,102.4,78.4,104.4,75.8z M70,80.6C30,66.6-2.8,87,0.2,128.8c10,14,45.6,25.4,66.4-5.2c-3.2-6.2-5-10-8.6-18.2 c-3.8,25.2-29.6,29-45.2,17.8C13.6,99.4,33,82.6,60.6,91.6C65.2,86,67.2,83.8,70,80.6z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 146.3 143'%3E%3Cpath d='M71.4,86.8c2,6.2,5.4,12.6,5.4,12.6c33.2-26.8,44-75.6-4-99.4C42.8,12.2,34.4,47.8,46,70l-0.1-0.1 c11.1-1.1,18.6,0.9,18.6,0.9C46.2,52.6,57,25.4,72.8,16.6h0.4C101.4,36,90.8,67.6,71.4,86.8z M104.4,75.8c21.8,1.6,44.2,20.6,41.8,51.8c-15.6,21.4-64.6,28.8-85.6-35.4c4-1.2,7.8-3,10.8-5.4 c3.2,11,26.8,60.2,61,35.8c-0.6-19.2-13.2-36-36.2-32.4C99.6,82.2,102.4,78.4,104.4,75.8z M70,80.6C30,66.6-2.8,87,0.2,128.8c10,14,45.6,25.4,66.4-5.2c-3.2-6.2-5-10-8.6-18.2 c-3.8,25.2-29.6,29-45.2,17.8C13.6,99.4,33,82.6,60.6,91.6C65.2,86,67.2,83.8,70,80.6z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* Obsah hlavičky nad vodoznakem */
.mts-lokality-archiv .mts-lokality-hlavicka > * {
    position: relative;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}
.mts-lokality-archiv .mts-lokality-titulek {
    font-family: var(--font-heading);
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 1.1;
    color: var(--color-sport);
    margin: 0 auto 1.5rem auto;
}
.mts-lokality-archiv .mts-lokality-popis {
    font-family: var(--font-body);
    font-size: 1.15rem;
    line-height: 1.7;
    color: #4A5568;
}
.mts-lokality-archiv .mts-lokality-popis p {
    margin: 0 0 1rem 0;
}

/* --- Sekce (Parky / Bazény) --- */
.mts-lokality-archiv .mts-lokality-sekce {
    margin-bottom: 4rem;
}
.mts-lokality-archiv .mts-lokality-sekce:last-child {
    margin-bottom: 0;
}
.mts-lokality-archiv .mts-lokality-sekce-nadpis {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 600;
    color: var(--color-sport);
    margin: 0 0 2rem 0;
    padding-bottom: 1rem;
    border-bottom: 2px solid rgba(26, 43, 60, 0.1);
}

/* --- Mřížka karet --- */
.mts-lokality-archiv .mts-lokality-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 2rem;
}

/* --- Karta lokality --- */
.mts-lokality-archiv .mts-lokalita-karta {
    display: flex;
    flex-direction: column;
    background-color: white;
    border-radius: 1.5rem;
    overflow: hidden;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
    color: inherit;
}
.mts-lokality-archiv .mts-lokalita-karta:hover {
    transform: translateY(-6px);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.2);
}

/* Obrázek karty */
.mts-lokality-archiv .karta-obrazek {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background-color: var(--color-sport);
}
.mts-lokality-archiv .karta-obrazek img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.mts-lokality-archiv .mts-lokalita-karta:hover .karta-obrazek img {
    transform: scale(1.05);
}

/* Štítek (Park / Bazén) v rohu obrázku */
.mts-lokality-archiv .karta-stitek {
    position: absolute;
    top: 1rem;
    left: 1rem;
    padding: 0.4rem 1rem;
    background-color: rgba(26, 43, 60, 0.85);
    backdrop-filter: blur(8px);
    color: white;
    font-family: var(--font-body);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 99px;
}

/* Tělo karty */
.mts-lokality-archiv .karta-telo {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex: 1;
}
.mts-lokality-archiv .karta-nazev {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--color-sport);
    margin: 0;
}
.mts-lokality-archiv .karta-popis {
    font-family: var(--font-body);
    font-size: 0.95rem;
    line-height: 1.6;
    color: #4A5568;
    margin: 0 0 20px 0;
}

/* Tlačítko "Detail lokality" (vizuální, karta je klikací jako celek) */
.mts-lokality-archiv .karta-tlacitko {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: auto;
    padding: 0.75rem 1.875rem;
    background-color: var(--color-mind);
    color: white;
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: 99px;
    transition: background-color 0.3s ease;
}
.mts-lokality-archiv .mts-lokalita-karta:hover .karta-tlacitko {
    background-color: var(--color-sport);
}

/* === Responzivita === */
@media (max-width: 767px) {
    .mts-lokality-archiv {
        padding-top: 7rem;
        padding-bottom: 4rem;
    }
    .mts-lokality-archiv .mts-lokality-titulek {
        font-size: 2.5rem;
    }
    .mts-lokality-archiv .mts-lokality-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   BLOK: ROZVRH LOKALITY
   ========================================================= */

.mts-lok-rozvrh {
    padding: 6rem 0;
    background-color: white;
}

.mts-lok-rozvrh .lok-rozvrh-inner {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 4rem;
    align-items: start;
}

/* --- LEVÝ SLOUPEC: popis --- */
.mts-lok-rozvrh .lok-rozvrh-popis-nadpis {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 900;
    color: var(--color-sport);
    margin: 0 0 1.5rem 0;
    line-height: 1.2;
}
.mts-lok-rozvrh .lok-rozvrh-popis-text {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
}
.mts-lok-rozvrh .lok-rozvrh-popis-text p {
    margin: 0 0 1.25rem 0;
}

/* Box „Vhodné pro lekce" */
.mts-lok-rozvrh .lok-rozvrh-vhodne {
    margin-top: 2rem;
    padding: 1.5rem;
    background-color: var(--color-bg);
    border: 1px solid rgba(26, 43, 60, 0.08);
    border-radius: 1.25rem;
}
.mts-lok-rozvrh .lok-rozvrh-vhodne-nadpis {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-sport);
    margin: 0 0 1rem 0;
}
.mts-lok-rozvrh .lok-rozvrh-vhodne-stitky {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.mts-lok-rozvrh .lok-vhodne-stitek {
    display: inline-block;
    padding: 0.35rem 0.85rem;
    background-color: white;
    border: 1px solid rgba(26, 43, 60, 0.12);
    border-radius: 99px;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
}
.mts-lok-rozvrh .lok-vhodne-blue  { color: var(--color-mind); }
.mts-lok-rozvrh .lok-vhodne-brown { color: var(--color-body); }
.mts-lok-rozvrh .lok-vhodne-navy  { color: var(--color-sport); }

/* --- PRAVÝ SLOUPEC: rozvrh --- */
.mts-lok-rozvrh .lok-rozvrh-hlavicka {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
}
.mts-lok-rozvrh .lok-rozvrh-nadpis {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 700;
	line-height: 1.2;
    color: var(--color-sport);
    margin: 0;
}
.mts-lok-rozvrh .lok-rozvrh-sezona {
    flex-shrink: 0;
    padding: 0.35rem 0.85rem;
    background-color: var(--c-bg);
    color: var(--c-primary);
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-radius: 99px;
}

/* Seznam lekcí */
.mts-lok-rozvrh .lok-rozvrh-lekce {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Karta lekce */
.mts-lok-rozvrh .lok-lekce {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.5rem;
    background-color: white;
    border: 1px solid rgba(26, 43, 60, 0.12);
    border-radius: 1.25rem;
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
.mts-lok-rozvrh .lok-lekce:hover {
    border-color: var(--c-primary);
    box-shadow: 0 10px 25px -8px rgba(0, 0, 0, 0.12);
}

/* Levá část karty (čas + text) */
.mts-lok-rozvrh .lok-lekce-info {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

/* Čtvereček den/čas */
.mts-lok-rozvrh .lok-lekce-cas {
    flex-shrink: 0;
    width: 4rem;
    height: 4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: var(--c-bg);
    color: var(--c-primary);
    border-radius: 0.85rem;
}
.mts-lok-rozvrh .lok-lekce-den {
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
}
.mts-lok-rozvrh .lok-lekce-hodina {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1;
}

/* Text lekce */
.mts-lok-rozvrh .lok-lekce-nazev {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-sport);
    margin: 0 0 0.2rem 0;
}
.mts-lok-rozvrh .lok-lekce-popis {
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--color-slate);
    margin: 0;
}

/* Trenéři u lekce */
.mts-lok-rozvrh .lok-lekce-treneri {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.6rem;
}
.mts-lok-rozvrh .lok-trener {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--color-slate);
    text-decoration: none;
}
.mts-lok-rozvrh a.lok-trener-odkaz:hover {
    color: var(--color-mind);
}
.mts-lok-rozvrh a.lok-trener-odkaz:hover .lok-trener-jmeno {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.mts-lok-rozvrh .lok-trener-foto {
    display: inline-flex;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    overflow: hidden;
    background-color: rgba(26, 43, 60, 0.1);
}
.mts-lok-rozvrh .lok-trener-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Tlačítko rezervace */
.mts-lok-rozvrh .lok-lekce-tlacitko {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    padding: 0.7rem 1.5rem;
    background-color: var(--color-sport);
    color: white;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 99px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}
.mts-lok-rozvrh .lok-lekce-tlacitko:hover {
    background-color: var(--c-primary);
}

/* === Responzivita === */
@media (max-width: 1024px) {
    .mts-lok-rozvrh .lok-rozvrh-inner {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
}
@media (max-width: 600px) {
    .mts-lok-rozvrh {
        padding: 4rem 0;
    }
    .mts-lok-rozvrh .lok-lekce {
        flex-direction: column;
        align-items: stretch;
        gap: 1.25rem;
    }
    .mts-lok-rozvrh .lok-lekce-tlacitko {
        justify-content: center;
    }
}

/* =========================================================
   BLOK: TRENEŘI LOKALITY (Vaši průvodci)
   ========================================================= */

.mts-lok-treneri {
    padding: 6rem 0;
    background-color: var(--color-sport);
}

/* --- Hlavička sekce --- */
.mts-lok-treneri .lok-treneri-hlavicka {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3.5rem auto;
}
.mts-lok-treneri .lok-treneri-nadpis {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.2;
    color: white;
    margin: 0;
}
.mts-lok-treneri .lok-treneri-podnadpis {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
    margin: 1.25rem 0 0 0;
}

/* --- Mřížka karet --- */
.mts-lok-treneri .lok-treneri-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    max-width: 960px;
    margin: 0 auto;
}

/* --- Karta trenéra --- */
.mts-lok-treneri .lok-trener-karta {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 2rem;
	border: 1px solid rgba(26, 43, 60, 0.12);
    background-color: white;
    border-radius: 2rem;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08);
    text-align: left;
    text-decoration: none;
    color: inherit;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
/* Karta jako odkaz – zvýraznění při najetí */
.mts-lok-treneri a.lok-trener-karta--odkaz:hover {
    transform: translateY(-6px);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
	
}

/* Fotka trenéra */
.mts-lok-treneri .lok-trener-karta-foto {
    flex-shrink: 0;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    overflow: hidden;
    background-color: rgba(26, 43, 60, 0.08);
}
.mts-lok-treneri .lok-trener-karta-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Text karty */
.mts-lok-treneri .lok-trener-karta-jmeno {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-sport);
    margin: 0;
}
.mts-lok-treneri .lok-trener-karta-role {
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--c-primary);
    margin: 0.35rem 0 0 0;
}
.mts-lok-treneri .lok-trener-karta-citat {
    font-family: var(--font-body);
    font-size: 1rem;
    font-style: italic;
    line-height: 1.5;
    color: var(--color-slate);
    margin: 0.75rem 0 0 0;
}

/* === Responzivita === */

@media (max-width: 989px) {
   .mts-lok-treneri .lok-treneri-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 767px) {
    .mts-lok-treneri {
        padding: 4rem 0;
    }
}
@media (max-width: 479px) {
    .mts-lok-treneri .lok-trener-karta {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
}

/* --- CTA „Více o trenérovi" v pravém dolním rohu --- */
.mts-lok-treneri .lok-trener-karta {
    position: relative;
    padding-bottom: 3.5rem;
}
.mts-lok-treneri .lok-trener-karta-cta {
    position: absolute;
    right: 2rem;
    bottom: 1.5rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--c-primary);
}
.mts-lok-treneri .lok-trener-karta-sipka {
    width: 1.1rem;
    height: 1.1rem;
    transition: transform 0.3s ease;
}
/* Animace šipky při najetí na (klikací) kartu */
.mts-lok-treneri a.lok-trener-karta--odkaz:hover .lok-trener-karta-sipka {
    transform: translateX(0.35rem);
}

/* Na nejmenších displejích CTA zpět do toku a vycentrovat */
@media (max-width: 479px) {
    .mts-lok-treneri .lok-trener-karta {
        padding-bottom: 2rem;
    }
    .mts-lok-treneri .lok-trener-karta-cta {
        position: static;
        justify-content: center;
        margin-top: 1rem;
    }
}

/* =========================================================
   BLOK: GALERIE LOKALITY (Jak to u nás vypadá)
   ========================================================= */

.mts-lok-galerie {
    padding: 6rem 0;
    background-color: white;
}

/* --- Hlavička sekce --- */
.mts-lok-galerie .lok-galerie-hlavicka {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3.5rem auto;
}
.mts-lok-galerie .lok-galerie-nadpis {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.2;
    color: var(--color-sport);
    margin: 0;
}
.mts-lok-galerie .lok-galerie-podnadpis {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
    margin: 1.25rem 0 0 0;
}

/* --- Mřížka (mozaika s rytmem) ---
   4 sloupce. Čtvercovost buněk řeší aspect-ratio na položkách. */
.mts-lok-galerie .lok-galerie-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

/* --- Položka (fotka) = čtverec --- */
.mts-lok-galerie .lok-galerie-polozka {
    position: relative;
    overflow: hidden;
    border-radius: 1.5rem;
    cursor: pointer;
    padding: 0;
    border: none;
    background-color: rgba(26, 43, 60, 0.06);
    aspect-ratio: 1 / 1;
}

/* Každá první ze šestice = velký blok 2x2 (rytmus).
   Protože má span 2 sloupce i 2 řádky a aspect-ratio 1/1, zůstává čtvercový. */
.mts-lok-galerie .lok-galerie-polozka:nth-child(6n+1) {
    grid-column: span 2;
    grid-row: span 2;
}

.mts-lok-galerie .lok-galerie-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}
.mts-lok-galerie .lok-galerie-polozka:hover .lok-galerie-img {
    transform: scale(1.05);
}

/* Štítek v rohu fotky */
.mts-lok-galerie .lok-galerie-stitek {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    padding: 0.35rem 0.85rem;
    background-color: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(8px);
    color: var(--color-sport);
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 99px;
}

/* === Responzivita === */
@media (max-width: 989px) {
    .mts-lok-galerie .lok-galerie-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 767px) {
    .mts-lok-galerie {
        padding: 4rem 0;
    }
    .mts-lok-galerie .lok-galerie-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    /* Velký blok zpět na normální velikost, ať se mozaika nerozbije */
    .mts-lok-galerie .lok-galerie-polozka:nth-child(6n+1) {
        grid-column: span 1;
        grid-row: span 1;
    }
}

@media (max-width: 600px) {
    .mts-lok-galerie .lok-galerie-grid {
        grid-template-columns: 1fr;
    }
    .mts-lok-galerie .lok-galerie-polozka {
        aspect-ratio: 4 / 3;
    }
    .mts-lok-galerie .lok-galerie-polozka:nth-child(6n+1) {
        grid-column: span 1;
        grid-row: span 1;
    }
}

/* =========================================================
   BLOK: MAPA LOKALITY (kde nás najdete)
   ========================================================= */

.mts-lok-mapa {
    padding: 6rem 0 0 0;    
}

/* --- Hlavička sekce --- */
.mts-lok-mapa .lok-mapa-hlavicka {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3rem auto;
}
.mts-lok-mapa .lok-mapa-nadpis {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.2;
    color: var(--color-sport);
    margin: 0;
}
.mts-lok-mapa .lok-mapa-podnadpis {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
    margin: 1.25rem 0 0 0;
}

/* --- Rámeček mapy --- */
.mts-lok-mapa .lok-mapa-ramecek {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    box-shadow: 0 15px 40px -10px rgba(0, 0, 0, 0.15);
    line-height: 0;
}
/* iframe z Mapy.cz roztáhneme na plnou šířku a danou výšku */
.mts-lok-mapa .lok-mapa-ramecek iframe {
    width: 100% !important;
    height: 70vh !important;
    border: 0 !important;
    display: block;
}

/* --- Tlačítko „Otevřít v mapách" --- */
.mts-lok-mapa .lok-mapa-tlacitko-obal {
    text-align: center;
    margin-top: 2rem;
}
.mts-lok-mapa .lok-mapa-tlacitko {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.75rem;
    background-color: var(--color-sport);
    color: white;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 700;
    border-radius: 99px;
    text-decoration: none;
    transition: background-color 0.3s ease, transform 0.3s ease;
}
.mts-lok-mapa .lok-mapa-tlacitko:hover {
    background-color: var(--c-primary);
    transform: translateY(-2px);
}
.mts-lok-mapa .lok-mapa-tlacitko-ikona {
    display: inline-flex;
    width: 1.2rem;
    height: 1.2rem;
}
.mts-lok-mapa .lok-mapa-tlacitko-ikona svg {
    width: 100%;
    height: 100%;
}

/* === Responzivita === */
@media (max-width: 767px) {
    .mts-lok-mapa {
        padding: 4rem 0 0 0;
    }
   .mts-lok-mapa .lok-mapa-ramecek iframe {
        height: 50vh !important;
    }
}