/* --- 1. PROMĚNNÉ A BARVY --- */
:root {
    --namorni-modra: #0a192f;
    --svetla-modra: #112240;
    --kovova-seda: #b0c4de;
    --tmava-seda: #8892b0;
    --bila: #ffffff;

    --vyska-hlavicky: -70px;
}

/* --- 2. ZÁKLADNÍ RESET --- */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f4f4f4;
    color: #333;
    padding-top: 70px; /* Pouze místo pro horní lištu, levý panel už neodsazuje obsah */
}

/* --- 3. HORNÍ HLAVIČKA --- */
.horni-lista {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    background-color: #fff;
    display: flex;
    justify-content: space-between; /* Název vlevo, menu vpravo */
    align-items: center;
    padding: 0 40px;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* Kontejner navigace */
.hlavni-navigace ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 30px; /* Mezery mezi odkazy */
    margin: 0;
    padding: 0;
}

.lista-levo {
    display: flex;
    align-items: left; /* Aby text "Název Firmy" byl zarovnaný s logem (pokud tam je) */
}

/* --- MOBILNÍ ÚPRAVA HLAVIČKY (Vložte do style/machines_style.css) --- */
@media (max-width: 850px) {


    /* Zrušíme pevnou výšku lišty a seřadíme prvky pod sebe */
    body .horni-lista {
        height: auto;          /* Klíčové: lišta poroste s obsahem */
        min-height: 60px;
        
        display: flex;
        flex-direction: column; /* Logo nahoře, menu dole */
        justify-content: center;
        padding: 15px 10px;    /* Větší prostor uvnitř */
    }

    /* Úprava samotných odkazů v menu */
    body .hlavni-navigace ul {
        margin-top: 15px;      /* Odstup menu od loga */
        
        display: flex;
        flex-wrap: wrap;       /* Povolí odkazům spadnout na nový řádek */
        justify-content: center;
        gap: 10px;             /* Mezery mezi odkazy */
    }
}

/* Styl textových odkazů (modré písmo) */
.hlavni-navigace ul li a:not(.tlacitko) {
    color: var(--namorni-modra);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s;
}

/* Modré tlačítko pro kontakt (využívá vaše stávající třídy) */
.hlavni-navigace .btn-modra {
    color: white !important; /* Vynucení bílého písma */
    margin: 0;
    padding: 10px 25px;
}

.logo-stred {
    height: 50px;
}

.kontakt-hlavicka {
    font-weight: bold;
    color: var(--namorni-modra);
}
/* --- STYL TEXTOVÉHO LOGA --- */

/* Obal pro text (odkaz) */
.logo-text-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-decoration: none;
    line-height: 1;         /* Základní řádkování */
}

/* Hlavní nápis "Remachine" */
.logo-hlavni {
    font-size: 2rem;
    font-weight: 700;
    color: #c2b59b;
    text-transform: none;
    letter-spacing: -0.5px;
    margin-bottom: 2px;     /* Malá mezera pod nápisem */
}

/* Obal pro podtext (Oba řádky) */
.logo-podtext {
    font-size: 0.5rem;      /* Velikost písma (cca 8px) */
    font-weight: 600;
    color: #c2b59b;
    text-transform: uppercase;
    letter-spacing: 1.5px;  /* Rozestupy mezi písmeny */
    text-align: center;     /* Vycentrování řádků pod sebou */
    line-height: 1.4;       /* Větší mezera mezi řádky podtextu */
    display: block;         /* Aby se to chovalo jako blok */
}

/* Specifický styl pro slovo REIMAGINED */
.logo-reimagined {
    display: block;         /* Hodí slovo na nový řádek (pojistka) */
    letter-spacing: 4px;    /* VÍCE roztáhnout než první řádek, aby to lícovalo */
    margin-top: 2px;        /* Malý odstup od horního řádku */
}

/* 1. Kontejner (Kotva) */
.logo-hlavni-container {
    position: relative;     /* Abychom mohli uvnitř pozicovat */
    display: inline-block;
    margin-bottom: 5px;
}

/* 2. Text "Remachine" (Horní vrstva) */
.logo-text-layer {
    position: relative;
    z-index: 2;             /* Musí být vyšší než ikona */
    font-size: 2.8rem;      /* Velikost textu */
    font-weight: 700;
    color: #c2b59b;         /* Béžová/Zlatá */
    text-transform: none;
    line-height: 1;
}

/* 3. Obrázek kolečka (Spodní vrstva) */
.logo-gear-icon {
    position: absolute;     /* Vytrhneme ho z toku */
    z-index: 1;             /* Musí být nižší než text */
    
    /* LADĚNÍ POZICE - TOTO SI UPRAVTE PODLE TVARU VAŠEHO SVG */
    width: 70px;            /* Velikost kolečka */
    height: auto;           /* Výška se dopočítá */
    
    top: 58%;               /* Svislá pozice (zkuste 50% až 60%) */
    transform: translateY(-50%); /* Přesné vycentrování */
    
    left: -18px;            /* Vodorovná pozice (aby bylo pod R) */
    
    /* POZNÁMKA K BARVĚ: */
    /* U <img> tagu nejde měnit barva přes CSS (fill). 
       Obrázek musí být už uložený ve správné barvě (tmavě modrá). */
}

/* Zbytek stylů pro podtext (stejné jako předtím) */
.logo-podtext {
    color: #c2b59b; 
    font-size: 0.5rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    text-align: center;
    line-height: 1.4;
    display: block;
}
.logo-reimagined {
    display: block;
    letter-spacing: 4px;
    margin-top: 2px;
}

/* --- MOBILNÍ ÚPRAVA (max-width: 850px) --- */
@media (max-width: 850px) {
    
    /* Na mobilu skryjeme celý podtext */
    .logo-podtext {
        display: 0.35rem;
    }

    /* Hlavní nápis na mobilu */
    .logo-hlavni {
        font-size: 1.7rem;
    }

    /* Na mobilu musíme ikonu i text trochu zmenšit */
    .logo-text-layer {
        font-size: 2rem;
    }
    .logo-gear-icon {
        width: 50px;    /* Menší kolečko na mobilu */
        left: -13px;     /* Úprava pozice */
        top: 50%;               /* Svislá pozice (zkuste 50% až 60%) */
    }
}

/* --- SEKCE S UPOUTÁVKOU --- */
/* ÚPRAVA TVÉHO CONTACT FORMU (UPOUTÁVKY) */
.kontaktni-upoutavka-hero {
    /* 1. Přechod tmavě modré (Gradient) */
    /* Začíná světlejší šedo-modrou a jde do hluboké firemní modré #0a192f */
    background: linear-gradient(135deg, #374b63 0%, #0a192f 100%);
    
    /* Alternativa pro starší prohlížeče */
    background-color: #0a192f;
    
    /* 2. Mezera mezi touto sekcí a footerem */
    margin-bottom: 20px; /* Vytvoří bílý proužek nad patičkou */
    
    /* Vzhled a odsazení obsahu */
    padding: 30px 0;
    text-align: center;
    color: #ffffff;
    
    /* Jemný stín pod celou sekcí pro zdůraznění "odlepení" od patičky */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

/* Úprava obsahu uvnitř, aby byl hezky čitelný */
.upoutavka-obsah h2 {
    color: #ffffff;
    font-size: 2.4rem;
    margin-bottom: 20px;
    font-weight: 700;
}

.upoutavka-obsah p {
    color: #dbeaf9; /* Velmi světlá modro-bílá, čitelnější než čistá šedá */
    font-size: 1.2rem;
    max-width: 700px;
    margin: 0 auto 35px auto; /* Vycentrování textu a mezera pod ním */
    line-height: 1.6;
}

/* Pokud chceš tlačítko doladit do stylu sekce (volitelné) */
.kontaktni-upoutavka-hero .btn-modra {
    background-color: #ffffff;
    color: #0a192f;
    border: 2px solid #ffffff;
    font-weight: bold;
    transition: all 0.3s ease;
}

.kontaktni-upoutavka-hero .btn-modra:hover {
    background-color: transparent;
    color: #ffffff;
    transform: translateY(-3px); /* Jemné nadzvednutí při najetí */
}

/* --- METALICKÁ HERO SEKCE (Bez obrázku) --- */
.hero-metalicka {
    /* Zachování rozměrů původní hero sekce */
    min-height: 35vh; 
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 20px;

    /* Metalický gradient (předdefinovaná šedá) */
    background: linear-gradient(135deg, #cfd8dc 0%, #eceff1 50%, #b0bec5 100%);
    
    /* Jemný vnitřní stín pro hloubku */
    box-shadow: inset 0 0 50px rgba(0,0,0,0.05);
    border-bottom: 1px solid #9ea9ad;
}

/* Úprava textu uvnitř metalické sekce */
.hero-metalicka h2 {
    color: #0a192f; /* Tmavě modrá pro kontrast na světlém kovu */
    font-size: 2.5rem;
    margin-bottom: 15px;
}

.hero-metalicka p {
    color: #455a64;
    max-width: 800px;
    margin: 0 auto;
}

/* Úprava šipky u tlačítka */
.btn-sipka .sipka {
    display: inline-block;
    transition: transform 0.3s ease;
}

.btn-sipka:hover .sipka {
    transform: translateX(5px);
}

/* Efekt šipky při najetí */
.btn-sipka:hover .sipka {
    transform: translateX(5px); /* Šipka popojede doprava */
}

.btn-sipka:hover {
    box-shadow: 0 4px 15px rgba(10, 25, 47, 0.3);
}

/* --- 5. OBSAH A SEKCE --- */
.kontejner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

section {
    padding: 60px 0;
    border-bottom: 1px solid #ddd;
}

h1, h2, h3 {
    color: var(--namorni-modra);
    margin-bottom: 20px;
}

/* Stylizace formuláře */
.kontaktni-formular {
    max-width: 500px;
    background: #fff;
    padding: 20px;
    border: 1px solid var(--kovova-seda);
    border-radius: 8px;
    margin-top: 20px;
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
    color: var(--tmava-seda);
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-family: inherit;
}

.form-group textarea {
    resize: vertical; /* Povolit změnu velikosti jen na výšku */
}

/* --- 6. TLAČÍTKA --- */
.tlacitko {
    display: inline-block;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    font-weight: bold;
    transition: opacity 0.3s;
    margin: 5px 5px 5px 0;
}

.tlacitko:hover {
    opacity: 0.8;
}

/* Velikosti */
.btn-male { padding: 5px 10px; font-size: 0.8rem; }
.btn-stredni { padding: 10px 20px; font-size: 1rem; }
.btn-velke { padding: 15px 30px; font-size: 1.2rem; }

/* Barvy */
.btn-modra { background-color: var(--namorni-modra); color: white; }
.btn-bila { background-color: var(--bila); color: black; }
.btn-seda { background-color: var(--bila); color: black; }

/* Mřížka pro nabídku */
.grid-nabidka {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.karta {
    background: #fff;
    border: 1px solid var(--kovova-seda);
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    transition: transform 0.2s;
}

.karta:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* RESPONZIVITA */
@media (max-width: 850px) {
    .kontakt-hlavicka { display: none; } /* Na malém mobilu schováme číslo v hlavičce */
}

/* --- BÍLÁ ŠIROKÁ PATIČKA (Verze 2 - Klikatelné nadpisy) --- */
.paticka {
    background-color: #ffffff;
    color: #0a192f;
    padding: 60px 0;
    font-size: 0.95rem;
    border-top: 1px solid #e0e0e0;
}

/* Kontejner přes celou šířku */
.paticka-obsah {
    width: 100%;
    padding: 0 40px;
    box-sizing: border-box;
    
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}

/* 2. STŘEDNÍ ČÁST - Sloupce */
.paticka-stred {
    flex: 3;
    display: flex;
    justify-content: center;
    gap: 80px;
}

.paticka-sloupec {
    display: flex;
    flex-direction: column;
    text-align: left;
    gap: 12px;
}

/* Nadpisy sloupců (H4) */
.paticka-sloupec h4 {
    margin: 0 0 5px 0; /* Menší mezera pod nadpisem */
    font-size: 1.1rem;
    font-weight: 800;
    text-transform: uppercase;
}

/* ODKAZY UVNITŘ NADPISŮ (Aby vypadaly jako nadpis, ne jako link) */
.paticka-sloupec h4 a {
    color: #0a192f;
    text-decoration: none;
    transition: color 0.3s;
}

.paticka-sloupec h4 a:hover {
    color: #007bff; /* Zmodrá při najetí */
}

/* Běžné odkazy pod nadpisy */
.paticka-sloupec a:not(h4 a) {
    color: #555;
    text-decoration: none;
    font-size: 0.95rem;
    transition: color 0.3s;
}

.paticka-sloupec a:not(h4 a):hover {
    color: #007bff;
    text-decoration: underline;
}

/* Informace (email, telefon) */
.kontakt-info p {
    margin: 5px 0;
    color: #555;
    font-size: 0.95rem;
    font-weight: 500;
}

/* 3. PRAVÁ ČÁST - Copyright */
.paticka-vpravo {
    flex: 1;
    max-width: 300px;
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.paticka-vpravo p {
    margin: 0;
    color: #888;
    font-size: 0.85rem;
}

.privacy-link {
    color: #0a192f;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.85rem;
}

/* RESPONZIVITA */
@media (max-width: 850px) {
    .paticka-obsah {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 40px;
    }

    .paticka-stred {
        flex-direction: column;
        gap: 30px;
    }

    .paticka-vpravo {
        text-align: center;
        align-items: center;
    }
}

/* =========================================
   STYLY PRO PŘEHLED SLUŽEB/PRODUKTŮ (GRID)
   ========================================= */

/* Základní styl sekce */
#prehled-sluzeb {
    padding: 40px 20px;
    text-align: center;
}

/* Kontejner mřížky (Grid) - pro responzivní rozložení */
.mrizka-karet {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px; /* Mezera mezi kartami */
    margin-top: 30px;
}

/* Styl pro jednotlivou kartu služby - využívá neutrální barvy */
.karta-sluzby {
    background-color: var(--bila);
    border: 1px solid var(--svetla-seda); /* Používáme stávající proměnnou */
    border-radius: 8px;
    padding: 25px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s, box-shadow 0.3s;
    height: 100%; /* Důležité pro sjednocení výšky v mřížce */
    display: flex;
    flex-direction: column;
}

.karta-sluzby:hover {
    transform: translateY(-5px); 
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.karta-sluzby h3 {
    color: var(--tmava-modra);
    margin-top: 15px;
    margin-bottom: 10px;
}

/* Styl pro ikonu (používá emoji jako fallback, pokud nemáte obrázky) */
.ikona-sluzby {
    font-size: 3em; /* Větší velikost pro emoji/text */
    color: var(--namorni-modra); /* Používáme modrou barvu motivu */
    height: 60px;
}

/* Tlačítko uvnitř karty - posun na konec karty */
.karta-sluzby .tlacitko {
    margin-top: auto; /* Zajistí, že tlačítko bude vždy dole, i když se liší text */
    display: block;
    width: 100%; /* Tlačítko přes celou šířku pro lepší UX */
}

/* --- HERO SEKCE (PŘES CELOU OBRAZOVKU) --- */
.hero-sekce {
    height: 75vh; /* 100% výšky okna prohlížeče */
    width: 100%;
    display: flex;
    align-items: center; /* Vertikální vycentrování */
    justify-content: center; /* Horizontální vycentrování */
    text-align: center;
    position: relative;
    overflow: hidden;
    
    /* SVG Pozadí - nahraďte 'bg.svg' svým souborem */
    background: linear-gradient(135deg, #374b63 0%, #0a192f 100%), 
                url('assets/bg.svg') no-repeat center center;
    background-size: cover; /* Obrázek se vždy roztáhne přes celou plochu */
    color: white;
    margin-top: calc(var(--vyska-hlavicky) * -1);
    padding-top: var(--vyska-hlavicky);
    /* Pro jistotu, aby padding nezvětšoval výšku nad 85vh */
    box-sizing: border-box;
}

.hero-obsah {
    z-index: 10;
    padding: 0 20px;
    animation: fadeInHero 1s ease-out;
}

.hero-obsah h1 {
    font-size: 3.5rem; /* Opravdu velký nadpis */
    color: white;
    margin-bottom: 20px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.hero-obsah p {
    font-size: 1.5rem;
    color: white;
    max-width: 800px;
    margin: 0 auto 40px auto;
}

.hero-tlacitka {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Úprava velkých tlačítek v Hero sekci */
.hero-sekce .btn-velke {
    padding: 18px 40px;
    font-size: 1.2rem;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
}



/* Animace při načtení */
@keyframes fadeInHero {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Responzivita pro mobily */
@media (max-width: 850px) {
    .hero-obsah h1 { font-size: 2.2rem; }
    .hero-obsah p { font-size: 1.1rem; }
}
/* --- SUB-HERO (Třetina strany) --- */
.sub-hero-sekce {
    height: 35vh; /* Přibližně třetina výšky okna */
    min-height: 250px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    
    /* Použijeme tmavší gradient pro čitelnost a obrázek stroje */
    background: linear-gradient(135deg, #374b63 0%, #0a192f 100%), 
                url('assets/tampoprint-detail.jpg') no-repeat center center;
    background-size: cover;
    color: white;
    margin-top: 0; 
    padding-top: 0; 
    padding-bottom: 0;
    
}

.sub-hero-obsah h1 {
    font-size: 2.5rem;
    color: white;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.sub-hero-obsah p {
    font-size: 1.1rem;
    color: var(--kovova-seda);
    max-width: 700px;
    margin: 0 auto;
}
/* Kontejner pro tlačítka v Hero sekci */
.hero-prepni-stranky {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 25px;
}

@media (max-width: 850px) {
    /* Resetujeme chování Hero sekce */
    body .hero-sekce {
        /* Vypneme vytahování nahoru */
        margin-top: 140px;
        
        /* Nastavíme normální odsazení */
        padding-top: 40px;
        padding-bottom: 40px;
        
        /* Výška se přizpůsobí obsahu (aby se text neuřízl) */
        height: auto;
    }

    /* Resetujeme chování Sub-Hero sekce */
    body .sub-hero-sekce {
        /* Vypneme vytahování nahoru */
        margin-top: 70px;
        
        /* Nastavíme normální odsazení */
        padding-top: 40px;
        padding-bottom: 40px;
        
        /* Výška se přizpůsobí obsahu (aby se text neuřízl) */
        height: auto;
    }

    /* Zmenšíme nadpis na mobilu */
    body .sub-hero-obsah h1 {
        font-size: 1.8rem; /* Menší písmo */
        margin-bottom: 15px;
    }

    /* Úprava tlačítek (Tampoprint, Horká ražba...) */
    body .hero-prepni-stranky {
        flex-direction: column; /* Tlačítka pod sebe */
        gap: 10px;
        margin-top: 15px;
    }
    
    /* Aby tlačítka nebyla přes celou šířku, ale vypadala hezky */
    body .hero-prepni-stranky a,
    body .hero-prepni-stranky button {
        width: 100%;
        max-width: 250px; /* Maximální šířka tlačítka */
        margin: 0 auto;   /* Vycentrovat */
    }
}

/* Základní vzhled neaktivního tlačítka (Bílé, černé písmo) */
.tlacitko-nav {
    display: inline-block;
    padding: 12px 25px;
    background-color: white;
    color: black;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: 1px solid #ccc;
}

/* --- ÚPRAVA AKTIVNÍHO TLAČÍTKA V HERO SEKCI --- */

/* Vzhled AKTIVNÍHO tlačítka (Tmavě modré s bílým písmem) */
.tlacitko-nav.aktivni {
    background-color: #0a192f; /* Tvoje definovaná tmavě modrá (námořní modrá) */
    color: white !important;   /* Bílé písmo pro maximální kontrast */
    border-color: #0a192f;     /* Okraj ve stejné barvě */
    cursor: default;           /* Zamezí zobrazení kurzoru ruky, protože už jsme na této stránce */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Jemný stín pro zvýraznění */
}

/* Pokud chceš, aby i hover na aktivním tlačítku zůstal stejný */
.tlacitko-nav.aktivni:hover {
    background-color: #0a192f;
    transform: none; /* Aktivní tlačítko se při najetí nepohybuje */
}

/* Ostatní neaktivní tlačítka zůstávají bílá s černým písmem */
.tlacitko-nav:not(.aktivni) {
    background-color: #ffffff;
    color: #333333;
    border: 1px solid #dddddd;
}

.sipka-zpet {
    font-size: 1.2rem;
}
/* Omezovač šířky pro textové stránky */
.text-uzky {
    max-width: 800px;
    margin: 50px auto;
    padding: 0 20px;
}

/* --- KARTA RECENZE (Ladí k mrizka-karet) --- */
.karta-recenze {
    background-color: white;
    padding: 30px;
    border-radius: 8px; /* Stejné zaoblení jako u služeb */
    box-shadow: 0 4px 15px rgba(0,0,0,0.05); /* Jemný stín */
    border-top: 4px solid var(--namorni-modra); /* Modrý proužek nahoře */
    
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%; /* Aby byly stejně vysoké */
    text-align: left;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efekt při najetí - stejný jako u služeb */
.karta-recenze:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

/* Velké uvozovky */
.velke-uvozovky {
    font-size: 3rem;
    line-height: 1;
    color: var(--namorni-modra);
    opacity: 0.2; /* Jemně průhledné */
    margin-bottom: 10px;
    font-family: serif;
}

/* Samotný text recenze */
.text-zazitek {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #444;
    margin-bottom: 25px;
    flex-grow: 1; /* Roztáhne text, aby podpisy byly dole v rovině */
}

/* Sekce autora */
.autor-podpis {
    border-top: 1px solid #eee; /* Čára oddělující jméno */
    padding-top: 15px;
}

.autor-podpis strong {
    display: block;
    color: var(--namorni-modra);
    font-size: 1rem;
    margin-bottom: 2px;
}

.autor-podpis span {
    display: block;
    font-size: 0.85rem;
    color: #888;
}