:root {
    --sobr-green: #4BC0C8; /* TYRKYSOVÁ DLE LOGA */
    --sobr-light: #F0F8FF; /* Velmi jemná, světle modrá barva (Alice Blue) */
    --sobr-lighter: #F8FFFF; /* Ještě světlejší modrá pro horní část gradientu */
    --wave-height: 80px; /* Definujeme výšku vlny */
    /* SVG vlny, fill="#ffffff" (bílá barva následující sekce) */
    --wave-svg-uri: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 100" preserveAspectRatio="none"><path fill="%23ffffff" fill-opacity="1" d="M0,64L48,64C96,64,192,64,288,69.3C384,75,480,85,576,80C672,75,768,56,864,48C960,40,1056,43,1152,48C1248,53,1344,69,1392,77.3L1440,85.3L1440,101L1392,101C1344,101,1248,101,1152,101C1056,101,960,101,864,101C768,101,672,101,576,101C480,101,384,101,288,101C192,101,96,101,48,101L0,101Z"></path></svg>');
    /* SVG reverzní vlny, fill pro pozadí (sobr-light nebo jiné) */
    /* Zde použiji fill="var(--sobr-light)" - reverzní vlna z bílé na sob-light */
    --reverse-wave-svg-uri: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 100" preserveAspectRatio="none"><path fill="var(--sobr-light)" fill-opacity="1" d="M0,85.3L48,77.3C96,69,192,53,288,48C384,43,480,40,576,48C672,56,768,75,864,80C960,85,1056,75,1152,69.3C1248,64,1344,64,1392,64L1440,64L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>');
}
.navbar-brand, .nav-link, h1, h2 {
    font-family: 'Georgia', serif;
}
.btn-primary, .bg-primary {
    background-color: var(--sobr-green) !important;
    border-color: var(--sobr-green) !important;
}
.text-primary {
    color: var(--sobr-green) !important;
}
.nav-link:hover {
    color: var(--sobr-green) !important;
}

/* Základní padding a pozice pro sekce */
.section-padding {
    padding: 6rem 0;
    position: relative; 
    z-index: 0; 
}

/* --- STYLY PRO VLNOVÉ ODDĚLOVAČE (WAVES) --- */

/* Sekce s pozadím (např. bílá na pozadí light) */
/* Přidání horní vlny (z bílé na light) */
.section-padding {
     /* Přidáme extra padding pro umístění vlny nad obsahem */
    padding-top: calc(6rem + var(--wave-height)); 
}

/* Reverzní vlna na horní hraně sekce (přechod z bílé na light) */
.section-padding::before {
     content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--wave-height); 
     /* Obrácená SVG vlna, ale fill musíme nechat bílý pro přechod z bílé na světlé pozadí */
     /* Nicméně, pro zjednodušení použijeme cestu, která jde z opačné strany a bude mít barvu následující sekce, tj. var(--sobr-light) */
     /* Vzhledem k tomu, že následující sekce je .bg-light, tak musíme vlnu otočit a dát jí barvu .bg-light */
    background-image: var(--reverse-wave-svg-uri); 
    background-size: cover; 
    background-repeat: no-repeat;
    background-position: top; /* Umístíme vlnu nahoře */
    z-index: 2; 
}

/* Zrušení horní vlny pro první sekci (uvod), která má nad sebou masthead */
#uvod.section-padding::before {
    content: none;
    padding-top: 6rem; /* Vrátíme původní padding */
}

/* Sekce s pozadím light - ZMĚNA NA GRADIENT */
.bg-light {
     /* Nahrazeno pevnou barvou gradientem: z tmavší (sobr-light) do světlejší (sobr-lighter), ZLEVA DOPRAVA */
    background: linear-gradient(to right, var(--sobr-light), var(--sobr-lighter)) !important;
    position: relative;
    z-index: 1; 
     /* Přidáme extra padding pro umístění vlny pod obsahem */
    padding-bottom: calc(6rem + var(--wave-height)); 
     /* Negativní margin zajistí, že se následující sekce posune nahoru a překryje spodní okraj vlny, čímž zmizí nežádoucí pruh */
    margin-bottom: calc(-1 * var(--wave-height)); 
     /* Přidáme extra padding pro umístění vlny nad obsahem (z light na light/předchozí) */
    padding-top: calc(6rem + var(--wave-height));
    margin-top: calc(-1 * var(--wave-height)); 
}

/* Vlna na horní hraně světlé sekce (přechod z bílé nebo z předchozí light sekce) */
.bg-light::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--wave-height); 
     /* Použijeme obrácenou vlnu, ale s bílou barvou, aby přecházela z bílého pozadí na light */
    background-image: var(--wave-svg-uri); 
    background-size: cover; 
    background-repeat: no-repeat;
    background-position: top;
    /* Invertujeme vlnu pro horní přechod */
    transform: scaleY(-1); 
    z-index: 2; 
}

/* Vlna na spodní hraně světlé sekce (přechod na bílou) */
.bg-light::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--wave-height); 
    background-image: var(--wave-svg-uri);
    background-size: cover; 
    background-repeat: no-repeat;
    background-position: bottom;
    z-index: 2; 
}

/* Ostatní styly */
.masthead {
    height: 80vh;
    min-height: 500px;
    /* Cesta k obrázku v kořeni projektu */
    background-image: url('../../hero_bg.jpg'); 
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    color: white;
    position: relative;
     /* Přidáme dolní vlnu (přechod z hrdiny na bílou) */
    padding-bottom: var(--wave-height);
     /* Negativní margin, aby se následující sekce posunula nahoru */
    margin-bottom: calc(-1 * var(--wave-height));
}

 /* Vlna na spodní hraně mastheadu (přechod na bílou) */
.masthead::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--wave-height); 
    background-image: var(--wave-svg-uri);
    background-size: cover; 
    background-repeat: no-repeat;
    background-position: bottom;
    z-index: 2; 
}

/* ... Zbytek masthead stylu (původní ::before pro overlay) ... */
.masthead::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* ZVÝŠENÝ TMAVÝ PŘEKRYV */
    z-index: 1; /* Musí být pod vlnou (z-index: 2) */
}

/* Aby se obsah mastheadu zobrazil nad překryvem */
.masthead .container {
     z-index: 3;
}
/* Konec úprav pro masthead */

.gallery-item {
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.gallery-item:hover {
    transform: scale(1.05);
}
.modal-image {
    max-height: 85vh;
    width: auto;
    object-fit: contain;
}