
    /* Definice tvých oblíbených barev jako proměnných */
:root {
    --bg-dark: #121212;      /* Velmi tmavá šedá (téměř černá) */
    --nav-bg: #1e1e1e;       /* Tmavší šedá pro prvky */
    --text-main: #e0e0e0;    /* Světle šedá pro text (lepší na oči než čistě bílá) */

    --accent-blue: #38bdf8;  /* Světle modrá (Light Blue) */
    --accent-green: #a3e635; /* Limetková zelená (Lime Green) */
}
    body {
        margin: 0;
        font-family: 'Segoe UI', system-ui, sans-serif;
        background-color: var(--bg-dark);
        color: var(--text-main);

        /* NOVÉ VĚCI PRO PATIČKU DOLE */
        display: flex;
        flex-direction: column;
        min-height: 100vh; /* Roztáhne stránku na 100% výšky obrazovky */
    }

    /* Tímto řekneme hlavnímu obsahu: "Zaber všechen volný prostor!" */
    main {
        flex: 1;
        padding: 20px 40px; /* Trochu odsazení od krajů, ať to dýchá */
    }

/* --- STYLY PRO NAVBAR --- */
.modern-navbar {
    background-color: var(--nav-bg);
    padding: 15px 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Jemný stín pod menu */
    border-bottom: 2px solid var(--accent-blue); /* Modrý proužek dole */
}

.nav-brand {
    font-size: 1.5rem;
    font-weight: bold;
    letter-spacing: 1px;
}

.accent-blue {
    color: var(--accent-blue);
}

/* Styl pro běžné odkazy */
.nav-links a {
    color: var(--text-main);
    text-decoration: none;
    margin-left: 25px;
    font-size: 1rem;
    font-weight: 500;
    transition: color 0.2s ease-in-out; /* Plynulá změna barvy */
}

/* Hover efekt pro běžné odkazy - zbarví se do modra */
.nav-links a:hover {
    color: var(--accent-blue);
}

/* Styl pro hlavní tlačítko (Lime Green) */
.cta-button {
    background-color: transparent;
    border: 2px solid var(--accent-green);
    padding: 8px 16px;
    border-radius: 6px;
    color: var(--accent-green) !important;
    transition: all 0.2s ease-in-out;
}

/* Hover efekt pro tlačítko - vyplní se zelenou a text zčerná */
.cta-button:hover {
    background-color: var(--accent-green);
    color: #121212 !important;
    box-shadow: 0 0 10px rgba(163, 230, 53, 0.5); /* Zelená záře */
}
