body {

    display: flex;

    justify-content: center;

    background: #131c18;

    width: 100%;

    background: #131c18;

background: linear-gradient(90deg,rgba(19, 28, 24, 1) 0%, #b84040 18%, rgba(19, 28, 24, 1) 50%, #b84040 82%, rgba(28, 30, 27, 1) 100%, rgba(19, 28, 24, 1) 100%);

overflow-x: hidden;

}



a {

    text-decoration: none;

}



.content {

    flex: none;

    background-color: #1b1b1e;

    max-width: 1920px;

    width: 1920px;

    overflow-x: hidden;

}



.landing {

    margin-top: -20px;

    padding-top: 100px;

    width: 100%;

    height: 900px;

    background: hsla(0, 0%, 0%, 1);

    background: -webkit-linear-gradient(315deg, #1b1b1e 65%, #b84040 35%);

    display: flex;

    flex-direction: row;

    z-index: 5;

    /* Zajišťuje, že landing je pod navbar */

}



.leftLanding {

    width: 55%;

    height: 100%;

    display: flex;

    flex-direction: column;

    padding-left: 150px;

}



.leftLanding span {

    display: flex;

    flex-direction: row;

}



.leftLanding h3 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

}



.leftLanding img {

    height: 32px;

    filter: invert();

}



.rightLanding {

    width: 45%;

    height: 100%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    filter: drop-shadow(0px 0px px #ff002b)

}



.landingTeamText {

    padding-top: 0px;

}



.landingTeamNums {

    display: flex;

    flex: 1;

    height: max-content;

    flex-direction: row;

    margin-top: 200px;

}



.landingTeamNums div {

    display: flex;

    flex-direction: column;

    width: 270px;

    height: 60px;

    align-items: center;

    margin: 10px;

    justify-content: center;

    border-radius: 20px;

}



.landingTeamText h1 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 160px;

}



.landingTeamText h2 {

    color: #f8f8f800;

    font-family: Staatliches, Arial;

    font-size: 90px;

    -webkit-text-stroke: 2px white;

    margin-top: -20px;

}



.landingButton {

    color: #f8f8f8;

    outline: 2px solid #b84040;

    height: 200px;

    font-family: Staatliches, Arial;

}



#landingButton1 {

    background-color: #b84040;

    color: #1b1b1e;

    transition: 0.3s;



}



#landingButton1 h3 {

    color: #1b1b1e;

}



#landingButton1:hover {

    background-color: #cf5555;

    color: #1b1b1e;

    transition: 0.3s;

}





.landingButton h3 {

    margin: 0;

}



.rightLanding {

    display: flex;

    justify-content: center;

    align-items: center;

}



.rightLanding img {

    height: 800px;

    width: auto;

    user-select: none;

}



/* responzivita sekce1 */



/* --- RESPONZIVITA SEKCE 1 (LANDING) --- */



/* Větší monitory a menší notebooky (do 1400px) */

@media (max-width: 1919px) {

    .content {

        width: 100%;

    }



    .landing {

        width: 100%;

        position: relative; /* Důležité: Tímto ohraničíme hřiště pro absolutní pozici fotky */

    }



    .leftLanding {

        width: 100%; /* Natáhne textovou část na 100% šířky sekce */

        position: relative;

        z-index: 1; /* Ujistíme se, že textová část zůstane vzadu */

    }



    .rightLanding {

        position: absolute; /* Umožní překrývání vrstev */

        right: 10px; /* Tvoje odsazení zprava */

        bottom: -50px; /* Fotka bude sedět dole v sekci (můžeš změnit na top: 0, pokud ji chceš nahoře) */

        height: 100%; /* Zachová výšku sekce */

        z-index: 10; /* Vytáhne fotku dopředu PŘED text */

        

        /* Odstranili jsme float: right, tady už není potřeba */

    }

}



@media (max-width: 1340px) {



    .landing h1 {

        font-size: 120px;

    }



    .landing h2 {

        font-size: 60px;

    }



    .landing h3 {

        font-size: 20px;

    }



    .rightLanding {

        margin-right: 20px;

    }

}



/* Tablety a menší obrazovky (do 1024px) - Přeskládání pod sebe */

@media (max-width: 1200px) {

    .landing {

        flex-direction: column; 

        height: auto; 

        min-height: 100vh;

        padding-top: 130px;

        background: linear-gradient(100deg, #1b1b1e 75%, #b84040 100%); 

    }



    .leftLanding {

        width: 100%;

        padding-left: 20px;

        padding-right: 20px;

        align-items: center; 

        text-align: center;

    }



    .leftLanding span {

        justify-content: center; 

    }



    .landingTeamNums {

        margin-top: 60px; 

        justify-content: center;

        flex-wrap: wrap; 

    }



    .rightLanding {

        position: static; /* Vypne absolutní pozici z velkého monitoru */

        width: 100%;

        margin-top: 20px; /* Tvoje původní hodnota */

        margin-right: 0;

        width: 100%;

    }



    .rightLanding img {

        height: auto;

        max-width: 90%; 

        max-height: 600px; /* Tvoje původní hodnota */

    }

}



@media (max-width: 620px) { 

    .landing { padding-top: 70px;}

}



@media (max-width: 390px) {

    .landing h1 {

        font-size: 100px;

    }



    .landing h2 {

        font-size: 50px;

    }



    .landing h3 {

        font-size: 20px;

    }



    .rightLanding {

        margin-right: 20px;

    }

} 



/* Přidej tohle do své hlavní třídy .landing, pokud to tam ještě není */

.landing {

    position: relative; 

}



.omne {

    height: 500px;

    display: flex;

    flex-direction: column;

    align-items: center;

}



.omneContent {

    width: 100%;

    height: 400px;

    padding-left: 150px;

    padding-right: 30%;

}





.omne h1 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 70px;

    margin-top: 30px;

}



.omne p {

    color: #979797;

    font-family: Staatliches, Arial;

    font-size: 30px;

    margin-top: 20px;

    

}



/* responzivita sekce2 */

@media (max-width: 1600px) {

    .omneContent {

    padding-right: 120px;

}

}



@media (max-width: 1200px) {

    .omne h1, .omne p { 

        text-align: center;

    }

}



@media (max-width: 1030px) {

    .omne p {

        font-size: 23px;

    }

}



@media (max-width: 725px) {

    .omne p {

        font-size: 20px;

    }



    .omne h1 {

        font-size: 50px;

        margin-top: 0;

    }



    .omneContent {

    padding: 40px

}

}



@media (max-width: 425px) {

    .omne p {

        font-size: 17px;

    }



    .omneContent {

    padding: 20px}



    .omne {

    height: 450px;

}

}



.vykony {

    height: 200px;

    display: flex;

    flex-direction: column;

    align-items: center;

    flex-direction: row;

}



.vykonyCard {

    width: calc(100% / 3);

    height: 200px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    background-color: #181818;

}



.vykonyCard:nth-of-type(2) {

    background-color: #111111;

}



.vykonyCard h3 {

    margin-top: 15px;

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 50px;

}



.vykonNumber {

    margin-top: 10px;

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 40px;

}



/* responzivita sekce3 */

@media (max-width: 725px) {

    .vykony {

        flex-direction: column;

        height: 420px;

    }



    .vykonyCard {

    width: 100%;

    height: 140px;}



    .vykonyCard h4 {

        margin-bottom: -15px !important;

    }

}



@media (max-width: 500px) {

    .vykonyCard h3 {

    margin-top: 15px;

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 40px;

}



.vykonNumber {

    margin-top: 10px;

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 30px;

}

}





.zamereniTitle {

    height: 120px;

    width: 100%;

    display: flex;

    justify-content: center;

    align-items: center;

    margin-top: 30px

}



.zamereniTitle h1 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 50px;

}



.zamereni {

    min-height: 800px; /* ZMĚNA: z height na min-height */

    height: auto;      /* ZMĚNA: výška se přizpůsobí obsahu */

    display: flex;

    flex-direction: column;

    padding-bottom: 50px; /* Přidáme trochu místa dole, ať karty nelepí na další sekci */

}



.zamereniCardRow {

    width: 100%;

    display: flex;

    flex-direction: row;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap; /* ZMĚNA: Povolí kartám "spadnout" na další řádek, pokud se nevejdou */

}



.zamereniCard {

    border: 5px solid #b84040;

    width: 500px;

    margin: 20px;

    border-radius: 15px;

    min-height: 570px; /* ZMĚNA: z height na min-height, aby text mohl růst */

    height: auto;      /* ZMĚNA */

    display: flex;

    flex-direction: column;

    align-items: center;

    padding-bottom: 30px; /* Vnitřní odsazení dole, ať text nelepí na okraj */

}



.zamereniCardIcon {

    height: 200px;

    width: 400px;

    margin-top: 20px;

    display: flex;

    justify-content: center;

    align-items: center;

}



.zamereniCardIcon img {

    width: 200px;

    height: 200px;

    fill: #b84040;

    user-select: none;

}



.zamereniCard h3 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 40px;

    margin-top: 50px;

}



.zamereniCard p {

    color: #b3b3b3;

    font-family: Staatliches, Arial;

    font-size: 22px;

    margin-top: 20px;

    margin-left: 30px;

    margin-right: 30px;

    text-align: center;

}



#svg1 {

    width: 200px;

    height: 200px;

}



#svg2 {

    width: 170px;

    height: 170px;

}



#svg3 {

    width: 170px;

    height: 200px;

}





/* responzivita sekce 4 */

/* --- RESPONZIVITA SEKCE 4 (ZAMĚŘENÍ) --- */



/* Od 1330px a méně: Dvě karty nahoře, třetí pod nimi */

@media (max-width: 1330px) {

    .zamereniCard {

        /* Mírně zmenšíme šířku karet, aby měly kolem sebe dost místa */

        width: 45%; 

        max-width: 500px; 

    }

    

    /* Změníme i velikost vnitřku, aby se text nemačkal */

    .zamereniCardIcon {

        width: 100%;

    }

}



/* Tablet / Menší obrazovky (do 900px): Karty se zalamují více */

@media (max-width: 900px) {

    .zamereniCard {

        /* Zvětšíme šířku karet, když je na ně méně místa */

        width: 80%;

    }

    

    .zamereniTitle h1 {

        font-size: 40px; /* Zmenšíme nadpis */

        text-align: center;

    }

}



/* Mobily (do 768px): Všechny karty pod sebou na 98 % šířky */

@media (max-width: 768px) {

    .zamereniCardRow {

        flex-direction: column; /* Přinutí karty být striktně pod sebou */

        margin: 0;

    }



    .zamereniCard {

        width: 95%; /* Požadovaná šířka na mobilu */

        margin: 15px 1%; /* Místo po stranách (1 % na každou stranu = 98 % šířka) */

        min-height: auto; /* Zrušíme minimální výšku, přizpůsobí se čistě obsahu */

    }



    .zamereniTitle h1 {

        font-size: 35px;

    }



    .zamereniCard h3 {

        font-size: 30px; /* Zmenšení nadpisu na kartě */

        margin-top: 30px;

    }



    .zamereniCard p {

        font-size: 18px; /* Zmenšení textu na kartě pro lepší čitelnost na mobilu */

        margin-left: 15px;

        margin-right: 15px;

    }

    

    /* Zmenšení ikon na mobilu, aby nezabíraly tolik místa */

    .zamereniCardIcon {

        height: 150px;

        margin-top: 10px;

    }

    

    .zamereniCardIcon img {

        width: 120px;

        height: 120px;

    }



    #svg1, #svg2, #svg3 {

        width: 120px;

        height: 130px;

    }

}





.kontakt {

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 100px 20px; /* Větší odsazení nahoře a dole */

    font-family: Arial, sans-serif;

}



/* Hlavní kontejner - 1500px a tmavé pozadí */

.contact-wrapper {

    display: flex;

    max-width: 1500px;

    width: 100%;

    background: #111111; /* Temné pozadí, sladěno s footerem a kartami */

    border-radius: 20px;

    box-shadow: 0 25px 50px rgba(0,0,0,0.5); /* Silnější stín pro dark mode */

    overflow: hidden; 

}



/* Levá část - Kontaktní informace s tmavě červeným gradientem */

.contact-info {

    flex: 1;

    background: linear-gradient(135deg, #b84040 0%, #7c2f2f 100%);

    color: #f8f8f8;

    padding: 80px 60px; /* Větší vnitřní prostor */

    display: flex;

    flex-direction: column;

    justify-content: center;

}



.contact-info h3 {

    font-family: 'Staatliches', Arial, sans-serif; /* Sjednoceno se zbytkem webu */

    font-size: 70px; /* Masivní nadpis pro 1500px monitor */

    margin-top: 0;

    margin-bottom: 20px;

    letter-spacing: 2px;

}



.contact-info p {

    font-size: 24px; /* Větší a čitelnější text */

    line-height: 1.6;

    margin-bottom: 40px;

    opacity: 0.95;

}



.contact-details p {

    margin-bottom: 20px;

    font-size: 26px; /* Zvětšené údaje */

}



.contact-details a {

    color: #f8f8f8;

    text-decoration: none;

    font-weight: 600;

    transition: opacity 0.3s;

}



.contact-details a:hover {

    opacity: 0.8;

}



/* Pravá část - Samotný formulář (Temný) */

.contact-form-container {

    flex: 1.2;

    padding: 80px 60px;

    background: #181818; /* Lehce odlišný odstín od wrapperu pro hloubku */

}



.form-group {

    margin-bottom: 35px; /* Větší mezery mezi poli */

}



.form-group label {

    display: block;

    margin-bottom: 12px;

    font-weight: 600;

    color: #f8f8f8; /* Světlý text labelů */

    font-size: 20px; /* Větší písmo nad políčky */

}



/* Stylování políček pro psaní - Dark styl */

.form-group input,

.form-group textarea {

    width: 100%;

    padding: 20px; /* Velkorysý prostor uvnitř políček */

    border: 2px solid #333333; /* Tmavé ohraničení */

    border-radius: 10px;

    font-family: inherit;

    font-size: 20px; /* Písmo při psaní je teď hezky velké */

    background-color: #1b1b1e; /* Sladěno s pozadím .content */

    color: #f8f8f8; /* Text uvnitř políček bude bílý */

    transition: all 0.3s ease;

    box-sizing: border-box;

}



.form-group input::placeholder,

.form-group textarea::placeholder {

    color: #666666; /* Jemně šedá nápověda textu */

}



/* Efekt při prokliknutí do políčka */

.form-group input:focus,

.form-group textarea:focus {

    outline: none;

    border-color: #b84040; /* Tvá hlavní červená */

    background-color: #111111;

    box-shadow: 0 0 0 4px rgba(184, 64, 64, 0.2); 

}



.form-group textarea {

    resize: vertical; 

    min-height: 180px; /* Textovka je rovnou o něco vyšší */

}



/* Animované tlačítko - sladěno přesně podle tvých .landingButton */

.btn-submit {

    background-color: #b84040;

    color: #1b1b1e; /* Tmavý text na červeném tlačítku, přesně jak to máš nahoře */

    padding: 20px 40px;

    border: none;

    border-radius: 50px;

    cursor: pointer;

    font-family: 'Staatliches', Arial, sans-serif; /* Tvůj hlavní nadpisový font */

    font-size: 32px; /* Obrovské CTA tlačítko */

    letter-spacing: 2px;

    width: 100%;

    transition: transform 0.3s ease, background-color 0.3s, box-shadow 0.3s ease;

    margin-top: 20px;

}



.btn-submit:hover {

    background-color: #cf5555; /* Světlejší červená při najetí (z tvého kódu) */

    color: #1b1b1e;

    transform: translateY(-3px); 

    box-shadow: 0 10px 20px rgba(184, 64, 64, 0.4); 

}



/* Neviditelná past na roboty */

.spam-check {

    position: absolute;

    opacity: 0;

    z-index: -1;

}



/* --- Zpráva po odeslání formuláře --- */

.form-message {

    margin-top: 25px;

    padding: 20px;

    border-radius: 10px;

    text-align: center;

    font-family: Arial, sans-serif;

    font-size: 20px;

    font-weight: bold;

    display: none; /* Ve výchozím stavu je skrytá */

    animation: fadeIn 0.5s ease;

}



.form-message.success {

    display: block;

    background-color: #1a3a24; /* Tmavě zelená k tvému dark pozadí */

    color: #4ade80; /* Světle zelený text */

    border: 2px solid #22c55e;

}



.form-message.error {

    display: block;

    background-color: #3a1a1a;

    color: #f87171;

    border: 2px solid #b84040; /* Tvá hlavní červená */

}



@keyframes fadeIn {

    from { opacity: 0; transform: translateY(-10px); }

    to { opacity: 1; transform: translateY(0); }

}



/* --- Responzivita (Mobily a tablety) --- */

/* --- Responzivita (Mobily a tablety) - KONTAKTNÍ FORMULÁŘ --- */



/* Tablety (do 1000px) - Přeskládání vedle sebe na pod sebe */

@media (max-width: 1000px) {

    .contact-wrapper {

        flex-direction: column; 

    }

    

    .contact-info,

    .contact-form-container {

        padding: 50px 30px;

    }

    

    .contact-info {

        text-align: center;

        border-radius: 20px 20px 0 0;

    }



    .contact-info h3 {

        font-size: 55px;

    }



    .kontakt {padding-top: 0;}

}



/* Větší mobily (do 725px) - Sjednocení s velikostmi textu sekce .omne */

@media (max-width: 725px) {

    .kontakt {

        padding: 50px 15px; /* Menší vnější mezera na mobilu */

    }



    .contact-info,

    .contact-form-container {

        padding: 40px 20px; /* Menší vnitřní mezery, aby neubíraly místo obsahu */

    }



    .contact-info h3 {

        font-size: 50px; /* Sladěno s h1 v sekci .omne a .vykony */

    }



    .contact-info p {

        font-size: 20px; /* Sladěno s p v sekci .omne */

        margin-bottom: 25px;

    }



    .contact-details p {

        font-size: 22px; 

    }



    /* Zmenšení formuláře samotného */

    .form-group label {

        font-size: 18px;

    }



    .form-group input,

    .form-group textarea {

        font-size: 18px;

        padding: 15px; /* Menší padding uvnitř políček */

    }



    .btn-submit {

        font-size: 26px; /* Zmenšení tlačítka */

        padding: 15px 30px;

    }

}



/* Malé mobily (do 425px) - Sjednocení s nejmenšími breakpointy */

@media (max-width: 425px) {

    .contact-info,

    .contact-form-container {

        padding: 30px 15px; 

    }



    .contact-info h3 {

        font-size: 40px; 

    }



    .contact-info p {

        font-size: 17px; /* Sladěno s .omne p na nejmenším rozlišení */

    }



    .contact-details p {

        font-size: 19px; 

    }



    .form-group label {

        font-size: 16px;

    }



    .form-group input,

    .form-group textarea {

        font-size: 16px;

        padding: 12px;

    }



    .btn-submit {

        font-size: 22px;

        padding: 12px 20px;

    }

    

    .form-message {

        font-size: 16px; /* Zmenšení textu úspěchu/chyby */

        padding: 15px;

    }

}



/* konec formulare */



footer {

    width: 100%;

    background-color: #111111;

    padding-top: 10px;

    padding-bottom: 10px;

    display: flex;

    justify-content: right;

    padding-right: 30px;

}



footer h4 {

    color: #525252;

    font-size: 20px;

}



/* ---- OPRAVY PRO LANDING (Tlačítka H3 -> H4) ---- */

.landingButton h4 {  /* Změněno z h3 na h4 */

    margin: 0;

    font-size: 30px; /* Zdědí velikost od rodiče */

}



#landingButton1 h4 { /* Změněno z h3 na h4 */

    color: #1b1b1e;

}



/* ---- OPRAVY PRO SEKCI O MNĚ (H1 -> H2) ---- */

.omne h2 { /* Změněno z h1 na h2 */

    color: #f8f8f8 ;

    font-family: Staatliches, Arial ;

    font-size: 70px ;

    margin-top: 30px;

}



@media (max-width: 1200px) {

    .omne h2, .omne p { /* Změněno z h1 na h2 */

        text-align: center;

    }

}



@media (max-width: 725px) {

    .omne h2 { /* Změněno z h1 na h2 */

        font-size: 50px;

        margin-top: 0;

    }

}



/* ---- OPRAVY PRO SEKCI VÝKONY (H3 -> H4) ---- */

.vykonyCard h4 { /* Změněno z h3 na h4 */

    margin-top: 15px ;

    color: #f8f8f8 ;

    font-family: Staatliches, Arial ;

    font-size: 50px ;

}



@media (max-width: 500px) {

    .vykonyCard h4 { /* Změněno z h3 na h4 */

    margin-top: 15px;

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 40px;

}

}



/* ---- OPRAVY PRO SEKCI ZAMĚŘENÍ (Titul H1 -> H2) ---- */

.zamereniTitle h2 { /* Změněno z h1 na h2 */

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 50px;

    margin: 0; /* Přidán reset marginu, H2 má defaultně jiný než H1 */

}



@media (max-width: 900px) {

    .zamereniTitle h2 { /* Změněno z h1 na h2 */

        font-size: 40px; 

        text-align: center;

    }

}



@media (max-width: 768px) {

    .zamereniTitle h2 { /* Změněno z h1 na h2 */

        font-size: 35px;

    }

}

/* (Karty v Zaměření zůstaly H3, takže tam se CSS nemění) */





/* ---- OPRAVY PRO KONTAKT (Titul H3 -> H2) ---- */

.contact-info h2 { /* Změněno z h3 na h2 */

    font-family: 'Staatliches', Arial, sans-serif; 

    font-size: 70px; 

    margin-top: 0;

    margin-bottom: 20px;

    letter-spacing: 2px;

}



@media (max-width: 1000px) {

    .contact-info h2 { /* Změněno z h3 na h2 */

        font-size: 55px;

    }

}



@media (max-width: 725px) {

    .contact-info h2 { /* Změněno z h3 na h2 */

        font-size: 50px; 

    }

}



@media (max-width: 425px) {

    .contact-info h2 { /* Změněno z h3 na h2 */

        font-size: 40px; 

    }

}



/* --- SEKCE CENÍK --- */



.cenikTitle {

    height: 120px;

    width: 100%;

    display: flex;

    justify-content: center;

    align-items: center;

    margin-top: 30px;

}



.cenikTitle h2 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 50px;

    margin: 0;

}



.cenik {

    min-height: 800px;

    height: auto;

    display: flex;

    flex-direction: column;

    align-items: center;

    padding-bottom: 80px; /* Mezera nad sekcí kontakt */

}



.cenikCardRow {

    width: 100%;

    max-width: 1400px;

    display: flex;

    flex-direction: row;

    justify-content: center;

    align-items: stretch; /* Udrží všechny karty stejně vysoké */

    flex-wrap: wrap;

    gap: 30px;

    padding: 0 20px;

    margin-top: 20px;

}



.cenikCard {

    background-color: #181818; /* Barva karet ze sekce Výkony */

    border: 3px solid #333333;

    border-radius: 15px;

    width: calc(33.333% - 40px); /* 3 vedle sebe s mezerou */

    min-width: 320px;

    display: flex;

    flex-direction: column;

    align-items: center;

    padding: 40px 30px;

    transition: transform 0.3s ease, border-color 0.3s ease;

}



.cenikCard:hover {

    transform: translateY(-10px);

    border-color: #b84040;

    transition: 0.1s;

}



/* Zvýrazněná prostřední karta */

.cenikCard.premium {

    border: 4px solid #b84040;

    background: linear-gradient(180deg, #181818 0%, #301111 100%);

    transform: scale(1.05); /* Je o trošku větší než ostatní */

    position: relative;

    z-index: 2;

}



.cenikCard.premium:hover {

    transform: scale(1.05) translateY(-10px);

}



.cenikCard h3 {

    color: #f8f8f8;

    font-family: Staatliches, Arial;

    font-size: 45px;

    margin-top: 0;

    margin-bottom: 15px;

    text-align: center;

}



.cenikCard .price {

    color: #b84040;

    font-family: Staatliches, Arial;

    font-size: 60px;

    margin-bottom: 40px;

    text-align: center;

    transition: 0.3s;

}



.cenikCard .price span {

    font-size: 25px;

    color: #979797;

    transition: 0.3s;

}



/* Odrážky (Seznam v kartě) */

.cenikList {

    list-style: none;

    padding: 0;

    margin: 0 0 40px 0;

    width: 100%;

    flex-grow: 1; /* Posune tlačítko vždy na úplný spodek karty */

}



.cenikList li {

    color: #b3b3b3;

    font-family: Arial, sans-serif;

    font-size: 19px;

    margin-bottom: 20px;

    padding-left: 35px;

    position: relative;

    line-height: 1.4;

}



/* Vlastní ikona fajfky u odrážek */

.cenikList li::before {

    content: '✔';

    position: absolute;

    left: 0;

    color: #b84040;

    font-size: 20px;

    font-weight: bold;

}



/* Tlačítka na kartách */

.cenikBtn {

    background-color: transparent;

    color: #f8f8f8;

    border: 3px solid #b84040;

    padding: 15px 40px;

    border-radius: 50px;

    font-family: Staatliches, Arial;

    font-size: 26px;

    letter-spacing: 1px;

    transition: all 0.1s ease;

    text-decoration: none;

    width: 100%;

    text-align: center;

    box-sizing: border-box;

}



.cenikBtn:hover {

    background-color: #b84040;

    color: #1b1b1e;

}



.cenikCard.premium .cenikBtn {

    background-color: #b84040;

    color: #1b1b1e;

}



.cenikCard.premium .cenikBtn:hover {

    background-color: #cf5555;

    border-color: #cf5555;

}



/* --- RESPONZIVITA CENÍK --- */

@media (max-width: 1150px) {

    .cenikCardRow {

        flex-direction: column;

        align-items: center;

    }

    .cenikCard {

        width: 80%;

        max-width: 500px;

    }

    .cenikCard.premium {

        transform: scale(1); /* Zrušíme zvětšení na tabletech a mobilech */

    }

    .cenikCard.premium:hover {

        transform: translateY(-10px);

    }

}



@media (max-width: 768px) {

    .cenikCard {

        width: 95%; /* Na mobilech na plnou šířku */

        padding: 30px 20px;

    }

    .cenikCard h3 {

        font-size: 35px;

    }

    .cenikCard .price {

        font-size: 45px;

    }

    .cenikList li {

        font-size: 17px;

    }

    .cenikBtn {

        font-size: 22px;

    }

}