/* =========================================================
   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-radius: 1.5rem;
	padding: 0.4rem 1rem;    
	background-color: var(--c-primary);
	
}
.mts-lokalita-hero .lok-hero-nadpis {
    font-size: var(--text-h1);
    font-weight: 900;
    line-height: 1.15;
    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);
	border: 1px solid rgba(255, 255, 255, 0.15);
    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(50px);
    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: 1rem;
    margin: 0 0 0.25rem 0;
    color: white;
	text-transform: uppercase;
}
.mts-lokalita-hero .lok-info-popis {
    font-size: 1rem;    
    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: 0.3rem;
	transition: all 0.3s ease;
}

.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 (kalendář lekcí Po–Ne)
   ========================================================= */

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

/* --- Hlavička sekce --- */
.mts-lok-rozvrh .lok-rozvrh-hlavicka {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
    margin-bottom: 3.5rem;
}
/* Štítek sezóny nad nadpisem (v HTML je až za ním) */
.mts-lok-rozvrh .lok-rozvrh-hlavicka .lok-rozvrh-sezona {
    order: -1;
}
.mts-lok-rozvrh .lok-rozvrh-nadpis {
    font-family: var(--font-heading);
    font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.15;
    color: var(--color-sport);
    margin: 0;
}
.mts-lok-rozvrh .lok-rozvrh-sezona {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 1rem;
    background-color: var(--c-bg);
    color: var(--c-primary);
    font-family: var(--font-body);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 99px;
}

/* --- Mřížka kalendáře (7 sloupců Po–Ne) --- */
.mts-lok-rozvrh .lok-kalendar {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.75rem;
    align-items: start;
}

/* Sloupec dne */
.mts-lok-rozvrh .lok-kalendar-den {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Záhlaví dne */
.mts-lok-rozvrh .lok-kalendar-den-hlavicka {
    text-align: center;
    padding-bottom: 0.6rem;
    border-bottom: 2px solid var(--c-bg);
}
.mts-lok-rozvrh .lok-kalendar-den-zkratka {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-sport);
}
.mts-lok-rozvrh .lok-kalendar-den-nazev {
    display: none; /* Na desktopu jen zkratka; plný název se ukáže na mobilu */
}

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

/* Prázdný den (desktop: decentní pomlčka) */
.mts-lok-rozvrh .lok-kalendar-prazdno {
    text-align: center;
    color: rgba(26, 43, 60, 0.25);
    font-family: var(--font-body);
    margin: 0.5rem 0 0 0;
}

/* --- Karta lekce --- */
.mts-lok-rozvrh .lok-lekce-karta {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1rem;
    background-color: var(--c-bg);
    border-radius: 1rem;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mts-lok-rozvrh .lok-lekce-karta:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px -10px rgba(0, 0, 0, 0.18);
}

/* Čas (text nad názvem) */
.mts-lok-rozvrh .lok-lekce-cas {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--c-primary);
}

/* Název lekce */
.mts-lok-rozvrh .lok-lekce-nazev {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-sport);
    margin: 0;
}

/* Popis lekce */
.mts-lok-rozvrh .lok-lekce-popis {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.5;
    color: var(--color-sport);
    margin: 0;
	opacity: 0.75;
}

/* Tlačítko „Detail lekce" */
.mts-lok-rozvrh .lok-lekce-tlacitko {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: 0.4rem;
    color: var(--c-primary);
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    text-decoration: underline;
    transition: all 0.3s ease;
    text-underline-offset: 0.3rem;
}
.mts-lok-rozvrh .lok-lekce-tlacitko:hover {
    color: var(--color-sport);
}

/* --- Tlačítko pod kalendářem (rezervace) --- */
.mts-lok-rozvrh .lok-rozvrh-cta {
    text-align: center;
    margin-top: 3.5rem;
}
.mts-lok-rozvrh .lok-rozvrh-cta-nadpis {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    color: #4A5568;
    margin: 0 0 1.25rem 0;
}
.mts-lok-rozvrh .lok-rozvrh-cta-tlacitko {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 2.5rem;
    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.25s ease;
}
.mts-lok-rozvrh .lok-rozvrh-cta-tlacitko:hover {
    background-color: var(--c-primary);
    transform: translateY(-2px);
}

/* --- Responzivita: překlopení mřížky na seznam po dnech --- */

/* Tablet: méně sloupců, ať se lekce vejdou */
@media (max-width: 1024px) {
    .mts-lok-rozvrh .lok-kalendar {
        grid-template-columns: repeat(3, 1fr);
    }
    /* Prázdné dny na užší mřížce skryjeme */
    .mts-lok-rozvrh .lok-kalendar-den.je-prazdny {
        display: none;
    }
}

/* Mobil: jeden sloupec = seznam po dnech */
@media (max-width: 640px) {
    .mts-lok-rozvrh {
        padding: 4rem 0;
    }
    .mts-lok-rozvrh .lok-kalendar {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    /* Záhlaví dne přes celou šířku: zkratka + plný název */
    .mts-lok-rozvrh .lok-kalendar-den-hlavicka {
        text-align: left;
        border-bottom-width: 1px;
    }
    .mts-lok-rozvrh .lok-kalendar-den-zkratka {
        display: none;
    }
    .mts-lok-rozvrh .lok-kalendar-den-nazev {
        display: block;
        font-family: var(--font-heading);
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--color-sport);
    }
    .mts-lok-rozvrh .lok-rozvrh-cta-tlacitko {
        display: flex;
        width: 100%;
    }
}


/* =========================================================
   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.15;
    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: 1rem 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.75rem;
    font-weight: 700;
    color: var(--color-sport);
    margin: 0;
	line-height: 1.2;
}
.mts-lok-treneri .lok-trener-karta-role {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 900;
    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-sport);
	opacity: 0.75;
    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: 1rem;
    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.15;
    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: 1rem 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: 4rem 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.15;
    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: 1rem 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;
    }
}

/* =========================================================
   BLOK: POPIS (rozšířený textový popis lokality)
   ========================================================= */
.mts-lok-popis {
    position: relative;   /* kotva pro dekorativní tečky */
    overflow: hidden;     /* tečky přetékající přes okraj se ořízne */
    padding: 6rem 0;
}
/* Obsah nad tečkami (tečky mají z-index 0). */
.mts-lok-popis > .container {
    position: relative;
    z-index: 1;
}
.mts-lok-popis .lok-popis-inner {    
    margin: 0 auto;
    text-align: center;
}
.mts-lok-popis .lok-popis-nadpis {
    font-family: var(--font-heading);
	font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.15;
    color: var(--color-sport);
    margin: 0 0 1rem;
}
.mts-lok-popis .lok-popis-podnadpis {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
    margin: 0 0 1.5rem;
}
.mts-lok-popis .lok-popis-text {
    font-family: var(--font-body);
	text-align: left;
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
	margin-top: 3rem;	
    padding-left: 1.5rem;
}
.mts-lok-popis .lok-popis-text p {
    margin: 0 0 1.1rem;
}
/* První odstavec – zvýraznění barevným pozadím (jako perex ve vlogu).
   display:inline + box-decoration-break zajistí obtékání po řádcích.
   Mezeru pod ním drží margin-top následujícího odstavce. */
.mts-lok-popis .lok-popis-text > p:first-child {
    display: inline;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-color: var(--c-primary);
    color: #fff;
    font-weight: 500;
    line-height: 2;
    padding: 0.15em 0.4em;
}
.mts-lok-popis .lok-popis-text > p:first-child + p {
    margin-top: 1.75rem;
}
.mts-lok-popis .lok-popis-text p:last-child {
    margin-bottom: 0;
}
.mts-lok-popis .lok-popis-text a {    
    text-decoration: underline;
    transition: all 0.3s ease;
    text-underline-offset: 0.3rem;	
}
.mts-lok-popis .lok-popis-text a:hover {    
    color: var(--color-sport);	
}


/* =========================================================
   BLOK: PROČ CVIČIT TADY (karty s ikonami)
   ========================================================= */
.mts-lok-proc {
    position: relative;   /* kotva pro dekorativní tečky */
    overflow: hidden;     /* tečky přetékající přes okraj se ořízne */
    padding: 4rem 0;
    background-color: white;
}
/* Obsah nad tečkami (tečky mají z-index 0). */
.mts-lok-proc > .container {
    position: relative;
    z-index: 1;
}
/* Fonty: vše body, výjimky nadpisy */
.mts-lok-proc,
.mts-lok-proc * {
    font-family: var(--font-body);
}
.mts-lok-proc .lok-proc-nadpis,
.mts-lok-proc .lok-proc-karta-nadpis {
    font-family: var(--font-heading);
}
.mts-lok-proc .lok-proc-hlavicka {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 4rem auto;
}
.mts-lok-proc .lok-proc-nadpis {
    font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.15;
    color: var(--color-sport);
    margin: 0 0 1rem;
}
.mts-lok-proc .lok-proc-popis {
    font-size: var(--text-body-size);
    line-height: 1.6;
    color: #4A5568;
    margin: 0;
}
.mts-lok-proc .lok-proc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 2rem;
}
.mts-lok-proc .lok-proc-karta {
    background-color: var(--c-bg);
    padding: 2.5rem 2rem;
    border-radius: 2.5rem;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.mts-lok-proc .lok-proc-karta:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
}
.mts-lok-proc .lok-proc-ikona {
    width: 4.5rem;
    height: 4.5rem;
    margin: 0 auto 1.5rem auto;
    background-color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mts-lok-proc .lok-proc-ikona svg {
    width: 2rem;
    height: 2rem;
}
.mts-lok-proc .lok-proc-ikona svg path {
    fill: var(--c-primary);
}
.mts-lok-proc .lok-proc-karta-nadpis {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--color-sport);
    margin: 0 0 1rem 0;
	line-height: 1.2;
}
.mts-lok-proc .lok-proc-karta-text {
    font-size: var(--h3-text);
    line-height: 1.6;
    color: #475569;
    margin: 0;
}

/* =========================================================
   BLOK: FAQ lokality (accordion)
   Přeneseno z bloku cest, aby lokalita nebyla závislá na
   sections.css. Sdílí funkční třídy .faq-* s JS accordionem.
   ========================================================= */
.mts-lok-faq {
    padding: 4rem 0;
    background-color: white;
}
.mts-lok-faq,
.mts-lok-faq * {
    font-family: var(--font-body);
}
.mts-lok-faq .mts-nase-cesty-section-title {
    font-family: var(--font-heading);
	font-size: var(--text-h2);
    font-weight: 900;
    line-height: 1.15;
    color: var(--color-sport);
    text-align: center;
    margin: 0 0 3rem;
}
.mts-lok-faq .faq-container {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.mts-lok-faq .faq-item {
    background-color: white;
    border-radius: 1rem;
    border: 1px solid #F3F4F6;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    overflow: hidden;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.mts-lok-faq .faq-item.active {
    border-color: var(--c-primary);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08);
}
.mts-lok-faq .faq-btn {
    width: 100%;
    padding: 1.25rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s;
}
.mts-lok-faq .faq-btn:hover {
    background-color: #FAFAFA;
}
.mts-lok-faq .faq-question {
    font-weight: 500;
    font-size: var(--faq-nadpis);
    line-height: 1.3;
    color: var(--color-sport);
}
.mts-lok-faq .faq-icon {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--c-primary);
    transition: transform 0.3s ease;
}
.mts-lok-faq .faq-icon svg {
    width: 1.5rem;
    height: 1.5rem;
}
.mts-lok-faq .faq-item.active .faq-icon {
    transform: rotate(180deg);
}
.mts-lok-faq .faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}
.mts-lok-faq .faq-text {
    padding: 0 1.5rem 1.5rem 1.5rem;
    color: #4A5568;
    line-height: 1.6;
    font-size: var(--faq-popis);
    margin-top: 1rem;
}
.mts-lok-faq .faq-text p {
    margin: 0 0 0.75rem 0;
}
.mts-lok-faq .faq-text p:last-child {
    margin-bottom: 0;
}
.mts-lok-faq .faq-text a {
    color: var(--c-primary);
    text-decoration: underline;
    text-underline-offset: 0.3rem;
}
.mts-lok-faq .faq-text a:hover {
    color: var(--color-sport);
}

/* Responzivita nových bloků lokality */
@media (max-width: 767px) {
    .mts-lok-popis,
    .mts-lok-proc {
        padding: 4rem 0;
    }
    .mts-lok-proc .lok-proc-grid {
        grid-template-columns: 1fr;
    }
    .mts-lok-proc .lok-proc-karta {
        padding: 2rem 1.5rem;
    }
    .mts-lok-faq {
        padding: 4rem 0;
    }
}
