/* --- 5. SEKCE: KONTAKTNÍ FORMULÁŘ (BÍLÝ PODKLAD) --- */
.kontaktni-sekce-bila {
    width: 100%;
    background-color: #ffffff;
    padding: 80px 0;
    display: flex;
    justify-content: center;
}

.kontakt-wrapper {
    display: flex;
    max-width: 1200px;
    width: 90%;
    gap: 60px;
}

.kontakt-info { flex: 2; }
.kontakt-info strong { color: #0a192f; }

/* Karta formuláře s efektem "ležení" */
.kontakt-form-karta {
    flex: 3;
    background: #ffffff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); /* Výraznější stín */
    border: 1px solid #f0f4f8;
}

/* Větší checkboxy */
/* Mřížka pro checkboxy ve dvou sloupcích */
.checkbox-grid-velky {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Dva sloupce o stejné šířce */
    gap: 15px 30px;                /* Mezera mezi řádky a sloupci */
    margin-bottom: 25px;
}

/* Styl pro jednotlivé popisky s boxíky */
.checkbox-grid-velky label {
    display: flex;
    align-items: center;           /* Zarovnání textu na střed boxíku */
    gap: 12px;
    font-size: 1.05rem;
    color: #333;
    cursor: pointer;
    transition: color 0.2s;
}

/* Větší zaškrtávací políčka v tmavě modré */
.checkbox-grid-velky input[type="checkbox"] {
    width: 24px;                   /* Mírně zvětšeno pro lepší ovladatelnost */
    height: 24px;
    cursor: pointer;
    accent-color: #0a192f;         /* Tvá tmavě modrá pro zaškrtnutí */
    margin: 0;
}

/* Inputy a Textarea */
.full-width { width: 100%; margin-bottom: 15px; }
.input-skupina { display: flex; gap: 15px; margin-bottom: 15px; }
.input-skupina input { flex: 1; }

.kontakt-form-karta input, 
.kontakt-form-karta textarea {
    padding: 14px;
    border: 1px solid #dee4e7;
    border-radius: 4px;
    background: #fcfdfe;
    font-size: 1rem;
}

/* Odesílací tlačítko */
.odeslat-tlacitko {
    background-color: #0a192f;
    color: white;
    padding: 18px;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    width: 100%;
}

.modal-stinovani {
    display: none; 
    position: fixed;
    z-index: 1000;
    left: 0; top: 0; width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.6); 
    align-items: center;
    justify-content: center;
}

.modal-obsah {
    background-color: white;
    padding: 40px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    max-width: 350px;
}

/* Modrý kruh se zelenou fajfkou */
.modal-ikona {
    font-size: 50px;
    color: #28a745;            /* Původní zelená barva */
    font-weight: 900;          /* Tlustší fajfka */
    margin: 0 auto 20px auto;
    display: flex;             /* Flexbox pro centrování */
    align-items: center;       /* Vertikální vycentrování */
    justify-content: center;   /* Horizontální vycentrování */
    border: 5px solid #28a745; /* Modrý kruh z designu */
    width: 90px;
    height: 90px;
    border-radius: 50%;
}

@keyframes nabeh {
    from { transform: translateY(-50px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* --- MOBILNÍ ÚPRAVA PRO KONTAKTNÍ FORMULÁŘ --- */
@media (max-width: 850px) {

    /* 1. Seřadit Text a Formulář pod sebe */
    .kontakt-wrapper {
        flex-direction: column; /* Klíčový příkaz */
        gap: 30px;              /* Menší mezera mezi nimi */
    }

    /* 2. Checkboxy pod sebe (jeden sloupec) */
    .checkbox-grid-velky {
        grid-template-columns: 1fr; /* 1fr = jeden sloupec */
        gap: 15px;
    }

    /* 3. Dvojice inputů (Jméno/Příjmení) pod sebe */
    .input-skupina {
        flex-direction: column;
    }

    /* 4. Úprava karty formuláře, aby se vešla */
    .kontakt-form-karta {
        width: 100%;            /* Roztáhnout na šířku */
        padding: 20px;          /* Zmenšit vnitřní okraj (původně 40px) */
        box-sizing: border-box; /* Aby padding nerozbil šířku */
    }
}