/**
 * Franšíza — stránka /o-nas/fransiza/ a přihláška.
 *
 * Tokeny níže navazují na paletu webu (Astra global colors z Customizeru).
 * Globální paletu webu tento soubor nepřepisuje.
 */

#lz-fr {
    /* === BARVY === */
    --lz-fr-primary:       var(--ast-global-color-0, #03136c);
    --lz-fr-primary-dark:  #020d4d;
    --lz-fr-secondary:     var(--ast-global-color-1, #790d79);
    --lz-fr-accent:        var(--ast-global-color-8, #34b6be);
    --lz-fr-accent-pink:   var(--ast-global-color-7, #e868ca);

    --lz-fr-text:          var(--ast-global-color-3, #495052);
    --lz-fr-text-strong:   var(--ast-global-color-2, #1e293b);
    --lz-fr-bg:            var(--ast-global-color-5, #ffffff);
    --lz-fr-bg-alt:        var(--ast-global-color-4, #f9fafb);
    --lz-fr-border:        var(--ast-global-color-6, #e3e4e5);
    --lz-fr-on-dark:       #ffffff;
    --lz-fr-on-dark-muted: rgba(255, 255, 255, .82);
    --lz-fr-error:         #dc2626;

    /* Tlačítka — stavy podle .elementor-widget-button na webu:
       výchozí modrá, hover fialová. (Šedý hover ve style.css se neuplatní,
       hodnota var(--e-global-color-astglobalcolor3 ) je kvůli mezeře
       před závorkou neplatná a prohlížeč to pravidlo zahodí.) */
    --lz-fr-btn-bg:        var(--ast-global-color-0, #03136c);
    --lz-fr-btn-bg-hover:  var(--ast-global-color-1, #790d79);
    --lz-fr-btn-text:      var(--ast-global-color-4, #f9fafb);
    --lz-fr-btn-radius:    10px;

    /* Formuláře — hodnoty ze stávajících CF7 stylů webu
       (plugins/nps-forms/css/m.css, cj.css). */
    --lz-fr-forms-panel-bg:      #f9f9f9;
    --lz-fr-forms-panel-border:  #ddd;
    --lz-fr-forms-panel-radius:  8px;
    --lz-fr-forms-panel-shadow:  0 4px 8px rgba(0, 0, 0, .1);
    --lz-fr-forms-panel-padding: 20px;
    --lz-fr-forms-input-border:  #ccc;
    --lz-fr-forms-input-radius:  4px;
    --lz-fr-forms-label:         #333;
    --lz-fr-forms-text:          14px;
    --lz-fr-forms-gap:           15px;

    /* Světlý podklad CTA pásu — shodný s div.cta-full ve style.css webu. */
    --lz-fr-cta-bg:        #f6f6f6;

    /* Podklad pod obrázek tabule, než se načte. */
    --lz-fr-tabule-fallback: #2f2f33;

    /* Sticky hlavička webu po zmenšení (40 + 70 px) + odstup. */
    --lz-fr-header-offset: 134px;

    /* === TYPOGRAFIE === */
    --lz-fr-font-heading: 'Fira Sans', system-ui, sans-serif;
    --lz-fr-font-body:    'Open Sans', system-ui, sans-serif;

    --lz-fr-text-sm:   .875rem;
    --lz-fr-text-base: 1rem;
    --lz-fr-text-lg:   1.125rem;
    --lz-fr-text-xl:   1.25rem;
    --lz-fr-text-2xl:  1.5rem;
    --lz-fr-text-3xl:  1.875rem;
    --lz-fr-text-4xl:  2.25rem;
    --lz-fr-text-5xl:  2.75rem;

    --lz-fr-lh-tight: 1.2;
    --lz-fr-lh-base:  1.65;

    /* === SPACING === */
    --lz-fr-space-2:  .5rem;
    --lz-fr-space-3:  .75rem;
    --lz-fr-space-4:  1rem;
    --lz-fr-space-5:  1.25rem;
    --lz-fr-space-6:  1.5rem;
    --lz-fr-space-8:  2rem;
    --lz-fr-space-10: 2.5rem;
    --lz-fr-space-12: 3rem;
    --lz-fr-space-16: 4rem;
    --lz-fr-space-20: 5rem;

    /* === LAYOUT === */
    --lz-fr-container: 1200px;
    --lz-fr-gutter:    1.25rem;

    /* === BORDER / STÍNY / PŘECHODY === */
    --lz-fr-radius-md:   10px;
    --lz-fr-radius-lg:   10px;
    --lz-fr-radius-xl:   10px;
    --lz-fr-radius-full: 100%;

    --lz-fr-blok-bg:   #f6f6f6;

    --lz-fr-transition: 220ms ease;

    font-family: var(--lz-fr-font-body);
    color: var(--lz-fr-text);
    line-height: var(--lz-fr-lh-base);
    overflow-x: clip;

    /* Astra page-builder kontejner je display:flex. Bez roztažení by se sekce
       smrskly na šířku obsahu a odsadily doleva místo přes celou šířku. */
    flex: 1 1 100%;
    width: 100%;
}

/* Web přidává všem h3 dekorativní obrázek přes ::before (style.css, h3:before).
   V kartách a krocích rozbíjí zarovnání nadpisu. */
#lz-fr h3::before,
#lz-fr h3::after {
    content: none !important;
}

/* ==========================================================================
   Základ
   ========================================================================== */

#lz-fr .lz-fr-inner {
    max-width: var(--lz-fr-container);
    margin-inline: auto;
    padding-inline: var(--lz-fr-gutter);
}

#lz-fr h1,
#lz-fr h2,
#lz-fr h3 {
    font-family: var(--lz-fr-font-heading);
    color: var(--lz-fr-text-strong);
    line-height: var(--lz-fr-lh-tight);
    margin-block: 0 var(--lz-fr-space-4);
}

#lz-fr p {
    margin-block: 0 var(--lz-fr-space-4);
}

#lz-fr ul,
#lz-fr ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

#lz-fr .lz-fr-icon {
    width: 100%;
    height: 100%;
    display: block;
}

#lz-fr a,
#lz-fr button,
#lz-fr [role="button"] {
    -webkit-tap-highlight-color: transparent;
}

#lz-fr .lz-fr-section__title {
    font-size: var(--lz-fr-text-3xl);
    font-weight: 700;
    text-align: center;
}

#lz-fr .lz-fr-section__title--light {
    color: var(--lz-fr-on-dark);
    text-align: start;
}

#lz-fr .lz-fr-section__lead {
    max-width: 46rem;
    margin-inline: auto;
    margin-block-end: var(--lz-fr-space-10);
    text-align: center;
    font-size: var(--lz-fr-text-lg);
}

#lz-fr .lz-fr-section__lead--light {
    color: var(--lz-fr-on-dark-muted);
    text-align: start;
    margin-inline: 0;
    margin-block-end: 0;
}

#lz-fr .lz-fr-admin-note {
    display: inline-block;
    margin-block-start: var(--lz-fr-space-6);
    padding: var(--lz-fr-space-3) var(--lz-fr-space-5);
    border-radius: var(--lz-fr-radius-md);
    background: rgba(255, 255, 255, .14);
    color: var(--lz-fr-on-dark);
    font-size: var(--lz-fr-text-sm);
}

/* ==========================================================================
   Tlačítka
   ========================================================================== */

/* Tvar podle a.btn ve style.css, barvy stavů podle .elementor-button na webu. */
#lz-fr .lz-fr-btn,
#lz-fr .lz-fr-btn--primary,
#lz-fr .lz-fr-btn--light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-inline: 1.6em;
    background-color: var(--lz-fr-btn-bg);
    border-radius: var(--lz-fr-btn-radius);
    color: var(--lz-fr-btn-text);
    font-family: var(--lz-fr-font-heading);
    font-size: 16px;
    font-weight: 500;
    line-height: 2.8em;
    text-align: center;
    text-decoration: none;
    transition: background-color var(--lz-fr-transition);
}

#lz-fr .lz-fr-btn:hover,
#lz-fr .lz-fr-btn:focus-visible {
    background-color: var(--lz-fr-btn-bg-hover);
    color: var(--lz-fr-btn-text);
}

#lz-fr .lz-fr-btn:focus-visible {
    outline: 3px solid var(--lz-fr-accent);
    outline-offset: 3px;
}

/* ==========================================================================
   Hero
   ========================================================================== */

/* Pozadí tabule — stejný obrázek i chování jako sekce #hp-tabule na webu. */
#lz-fr .lz-fr-hero,
#lz-fr .lz-fr-formhero {
    position: relative;
    background-color: var(--lz-fr-tabule-fallback);
    background-image: url('../img/tabule-m.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: var(--lz-fr-on-dark);
}

@media (min-width: 545px) {
    #lz-fr .lz-fr-hero,
    #lz-fr .lz-fr-formhero {
        background-image: url('../img/tabule-40.jpg');
    }
}

#lz-fr .lz-fr-hero__inner {
    position: relative;
    z-index: 1;
    padding-block: var(--lz-fr-space-16) var(--lz-fr-space-20);
    text-align: center;
}

#lz-fr .lz-fr-hero__eyebrow {
    margin-block-end: var(--lz-fr-space-4);
    font-family: var(--lz-fr-font-heading);
    font-size: var(--lz-fr-text-sm);
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lz-fr-accent);
}

#lz-fr .lz-fr-hero__title {
    max-width: 22ch;
    margin-inline: auto;
    color: var(--lz-fr-on-dark);
    font-size: var(--lz-fr-text-4xl);
    font-weight: 800;
}

#lz-fr .lz-fr-hero__lead {
    max-width: 44rem;
    margin-inline: auto;
    margin-block-end: var(--lz-fr-space-8);
    color: var(--lz-fr-on-dark-muted);
    font-size: var(--lz-fr-text-lg);
}

/* ==========================================================================
   Lokality
   ========================================================================== */

#lz-fr .lz-fr-lokality {
    background: var(--lz-fr-bg);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-lokality__grid {
    display: grid;
    gap: var(--lz-fr-space-5);
    margin-block-start: var(--lz-fr-space-10);
}

#lz-fr .lz-fr-lokalita {
    display: flex;
    flex-direction: column;
    gap: var(--lz-fr-space-2);
    padding: var(--lz-fr-space-6);
    background-color: var(--lz-fr-blok-bg);
    border-radius: var(--lz-fr-radius-lg);
}

#lz-fr .lz-fr-lokalita__mesto {
    font-family: var(--lz-fr-font-heading);
    font-size: var(--lz-fr-text-2xl);
    font-weight: 700;
    color: var(--lz-fr-primary);
}

#lz-fr .lz-fr-lokalita__pocet {
    font-family: var(--lz-fr-font-heading);
    font-size: var(--lz-fr-text-base);
    font-weight: 600;
    color: var(--lz-fr-secondary);
}

#lz-fr .lz-fr-lokalita__detail {
    font-size: var(--lz-fr-text-sm);
}

/* ==========================================================================
   Výhody
   ========================================================================== */

#lz-fr .lz-fr-vyhody {
    background-color: var(--lz-fr-bg);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-vyhody__grid {
    display: grid;
    gap: var(--lz-fr-space-5);
}

#lz-fr .lz-fr-karta {
    padding: var(--lz-fr-space-8) var(--lz-fr-space-6);
    background-color: var(--lz-fr-blok-bg);
    border-radius: var(--lz-fr-radius-lg);
}

#lz-fr .lz-fr-karta__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    margin-block-end: var(--lz-fr-space-5);
    padding: .7rem;
    border-radius: var(--lz-fr-radius-md);
    background-color: var(--lz-fr-primary);
    color: var(--lz-fr-on-dark);
}

#lz-fr .lz-fr-karta__title {
    font-size: var(--lz-fr-text-lg);
    font-weight: 700;
    color: var(--lz-fr-primary);
}

#lz-fr .lz-fr-karta__text {
    margin-block-end: 0;
    font-size: var(--lz-fr-text-base);
}

/* ==========================================================================
   Koho hledáme
   ========================================================================== */

#lz-fr .lz-fr-koho {
    background-color: var(--lz-fr-primary);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-koho__inner {
    display: grid;
    gap: var(--lz-fr-space-10);
    align-items: start;
}

/* Náhledový obrázek stránky — zaoblení 10px jako ostatní obrázky na webu. */
#lz-fr .lz-fr-koho__media {
    margin: var(--lz-fr-space-8) 0 0 0;
}

#lz-fr .lz-fr-koho__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--lz-fr-radius-lg);
}

#lz-fr .lz-fr-koho__list {
    display: grid;
    gap: var(--lz-fr-space-4);
}

#lz-fr .lz-fr-koho__item {
    display: flex;
    align-items: flex-start;
    gap: var(--lz-fr-space-4);
    padding: var(--lz-fr-space-5) var(--lz-fr-space-6);
    background-color: rgba(255, 255, 255, .08);
    border-radius: var(--lz-fr-radius-md);
    color: var(--lz-fr-on-dark);
    font-size: var(--lz-fr-text-lg);
}

#lz-fr .lz-fr-koho__check {
    flex: 0 0 auto;
    width: 1.5rem;
    height: 1.5rem;
    margin-block-start: .28rem;
    color: var(--lz-fr-accent);
}

/* ==========================================================================
   Kroky
   ========================================================================== */

#lz-fr .lz-fr-kroky {
    background: var(--lz-fr-bg);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-kroky__grid {
    display: grid;
    gap: var(--lz-fr-space-8);
    margin-block-start: var(--lz-fr-space-10);
    counter-reset: lz-fr-krok;
}

#lz-fr .lz-fr-krok {
    position: relative;
    padding-block-start: var(--lz-fr-space-4);
    /* Na mobilu je krok sám na celou šířku — vystředěný drží osu se zbytkem
       stránky. Od tabletu výš stojí kroky vedle sebe a zarovnávají se doleva. */
    text-align: center;
}

#lz-fr .lz-fr-krok__cislo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    margin-inline: auto;
    margin-block-end: var(--lz-fr-space-4);
    border-radius: var(--lz-fr-radius-full);
    background-color: var(--lz-fr-secondary);
    color: var(--lz-fr-on-dark);
    font-family: var(--lz-fr-font-heading);
    font-size: var(--lz-fr-text-xl);
    font-weight: 700;
}

#lz-fr .lz-fr-krok__title {
    font-size: var(--lz-fr-text-lg);
    font-weight: 700;
    color: var(--lz-fr-primary);
    line-height: 1.3;
    text-wrap: balance;
}

/* Ruční zlom nadpisu kroku se uplatní až v pětisloupcovém rozvržení (níže),
   v širších sloupcích se nadpisy vejdou na jeden řádek a zlom se vypíná. */
#lz-fr .lz-fr-krok__br {
    display: none;
}

#lz-fr .lz-fr-krok__text {
    margin-block-end: 0;
    font-size: var(--lz-fr-text-base);
}

/* ==========================================================================
   Závěrečné CTA
   ========================================================================== */

#lz-fr .lz-fr-cta {
    background-color: var(--lz-fr-cta-bg);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-cta__inner {
    text-align: center;
}

#lz-fr .lz-fr-cta__title {
    color: var(--lz-fr-primary);
    font-size: var(--lz-fr-text-3xl);
    font-weight: 800;
}

#lz-fr .lz-fr-cta__text {
    margin-block-end: var(--lz-fr-space-8);
    color: var(--lz-fr-text);
    font-size: var(--lz-fr-text-lg);
}

/* ==========================================================================
   Volitelný obsah z editoru
   ========================================================================== */

#lz-fr .lz-fr-obsah {
    background: var(--lz-fr-bg);
    padding-block: var(--lz-fr-space-12);
}

#lz-fr .lz-fr-obsah__inner {
    max-width: 46rem;
}

/* ==========================================================================
   Stránka přihlášky
   ========================================================================== */

#lz-fr .lz-fr-formhero__inner {
    padding-block: var(--lz-fr-space-12);
    text-align: center;
}

#lz-fr .lz-fr-formhero__title {
    color: var(--lz-fr-on-dark);
    font-size: var(--lz-fr-text-4xl);
    font-weight: 800;
}

#lz-fr .lz-fr-formhero__lead {
    max-width: 42rem;
    margin-inline: auto;
    margin-block-end: 0;
    color: var(--lz-fr-on-dark-muted);
    font-size: var(--lz-fr-text-lg);
}

#lz-fr .lz-fr-formwrap {
    background-color: var(--lz-fr-bg);
    padding-block: var(--lz-fr-space-16);
}

#lz-fr .lz-fr-formwrap__inner {
    display: grid;
    gap: var(--lz-fr-space-8);
    align-items: start;
}

#lz-fr .lz-fr-form,
#lz-fr .lz-fr-formaside {
    padding: var(--lz-fr-forms-panel-padding);
    background-color: var(--lz-fr-forms-panel-bg);
    border: 1px solid var(--lz-fr-forms-panel-border);
    border-radius: var(--lz-fr-forms-panel-radius);
    box-shadow: var(--lz-fr-forms-panel-shadow);
}

/* Na úzkých displejích patří rady nad formulář — čtou se před vyplňováním. */
#lz-fr .lz-fr-formaside {
    order: -1;
}

#lz-fr .lz-fr-formaside__title {
    font-size: var(--lz-fr-text-xl);
    font-weight: 700;
    color: var(--lz-fr-primary);
}

#lz-fr .lz-fr-formaside__list {
    display: flex;
    flex-direction: column;
    gap: var(--lz-fr-forms-gap);
}

#lz-fr .lz-fr-formaside__list li {
    display: flex;
    align-items: flex-start;
    gap: var(--lz-fr-space-3);
    font-size: var(--lz-fr-forms-text);
}

#lz-fr .lz-fr-formaside__icon {
    flex: 0 0 auto;
    width: 1.25rem;
    height: 1.25rem;
    margin-block-start: .22rem;
    color: var(--lz-fr-accent);
}

#lz-fr .lz-fr-formaside__note {
    display: flex;
    align-items: flex-start;
    gap: var(--lz-fr-space-3);
    margin-block-start: var(--lz-fr-space-6);
    padding: 10px;
    background-color: var(--lz-fr-bg);
    border: 1px solid var(--lz-fr-forms-panel-border);
    border-radius: var(--lz-fr-forms-input-radius);
    font-size: var(--lz-fr-forms-text);
}

#lz-fr .lz-fr-formaside__note p {
    margin-block-end: 0;
}

/* ==========================================================================
   Contact Form 7

   Hodnoty převzaté z nps-forms/css/m.css a cj.css, kde jsou stylované
   stávající CF7 formuláře webu — rozestupy, rámečky, velikost písma
   i chování řádků. Odlišnost: barva nadpisů sekcí je firemní modrá místo
   výchozí WordPressové #0073aa.
   ========================================================================== */

/* CF7 sem ukládá skrytá pole; prázdný fieldset by jinak vykreslil rámeček. */
#lz-fr .wpcf7-form .hidden-fields-container {
    display: none;
}

#lz-fr .wpcf7-form .lz-fr-fieldset {
    margin: 0 0 var(--lz-fr-space-8) 0;
    padding: 0;
    border: 0;
}

#lz-fr .wpcf7-form .lz-fr-legend {
    display: block;
    width: 100%;
    margin-block-end: var(--lz-fr-forms-gap);
    padding-block-end: 5px;
    border-block-end: 2px solid var(--lz-fr-forms-panel-border);
    font-family: var(--lz-fr-font-heading);
    font-size: var(--lz-fr-text-lg);
    font-weight: 700;
    color: var(--lz-fr-primary);
    text-transform: uppercase;
}

/* Řádek polí — obdoba .form-group-inline (flex, gap 15px). */
#lz-fr .wpcf7-form .lz-fr-row {
    display: flex;
    flex-direction: column;
    gap: var(--lz-fr-forms-gap);
    margin-block-end: var(--lz-fr-forms-gap);
}

#lz-fr .wpcf7-form .lz-fr-field {
    display: flex;
    flex: 1;
    flex-direction: column;
}

/* Pojistka pro případ, že je zapnuté automatické formátování odstavců:
   WordPress obalí obsah řádku do <p> a mezi pole vloží <br>. Bez tohoto
   by se sloupce zhroutily do jednoho úzkého sloupce. */
#lz-fr .wpcf7-form .lz-fr-row > p {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--lz-fr-forms-gap);
    width: 100%;
    margin: 0;
}

#lz-fr .wpcf7-form .lz-fr-row br {
    display: none;
}

#lz-fr .wpcf7-form .lz-fr-label {
    display: block;
    margin-block-end: 5px;
    font-family: var(--lz-fr-font-body);
    font-size: var(--lz-fr-forms-text);
    font-weight: bold;
    color: var(--lz-fr-forms-label);
}

#lz-fr .wpcf7-form .lz-fr-hint {
    display: block;
    margin-block-start: 5px;
    font-size: var(--lz-fr-forms-text);
    color: var(--lz-fr-text);
}

#lz-fr .wpcf7-form .lz-fr-required {
    color: var(--lz-fr-secondary);
}

#lz-fr .wpcf7-form input[type="text"],
#lz-fr .wpcf7-form input[type="email"],
#lz-fr .wpcf7-form input[type="tel"],
#lz-fr .wpcf7-form input[type="url"],
#lz-fr .wpcf7-form textarea {
    width: 100% !important;
    padding: 10px !important;
    background-color: var(--lz-fr-bg) !important;
    border-top: 1px solid var(--lz-fr-forms-input-border) !important;
    border-right: 1px solid var(--lz-fr-forms-input-border) !important;
    border-bottom: 1px solid var(--lz-fr-forms-input-border) !important;
    border-left: 1px solid var(--lz-fr-forms-input-border) !important;
    border-radius: var(--lz-fr-forms-input-radius) !important;
    box-sizing: border-box;
    font-family: var(--lz-fr-font-body) !important;
    font-size: var(--lz-fr-forms-text) !important;
    color: var(--lz-fr-text-strong) !important;
    transition: border-color var(--lz-fr-transition);
}

#lz-fr .wpcf7-form input[type="text"]:focus,
#lz-fr .wpcf7-form input[type="email"]:focus,
#lz-fr .wpcf7-form input[type="tel"]:focus,
#lz-fr .wpcf7-form input[type="url"]:focus,
#lz-fr .wpcf7-form textarea:focus {
    border-top-color: var(--lz-fr-primary) !important;
    border-right-color: var(--lz-fr-primary) !important;
    border-bottom-color: var(--lz-fr-primary) !important;
    border-left-color: var(--lz-fr-primary) !important;
    outline: 2px solid var(--lz-fr-secondary) !important;
    outline-offset: 1px !important;
}

#lz-fr .wpcf7-form textarea {
    height: 100px !important;
    resize: vertical;
}

#lz-fr .wpcf7-form input[type="file"] {
    width: 100%;
    padding: 10px;
    background-color: var(--lz-fr-bg);
    border: 1px solid var(--lz-fr-forms-input-border);
    border-radius: var(--lz-fr-forms-input-radius);
    box-sizing: border-box;
    font-size: var(--lz-fr-forms-text);
    cursor: pointer;
}

#lz-fr .wpcf7-form input[type="file"]:focus-visible {
    outline: 2px solid var(--lz-fr-secondary);
    outline-offset: 1px;
}

#lz-fr .wpcf7-form .wpcf7-acceptance .wpcf7-list-item {
    margin: 0;
    width: 100%;
}

#lz-fr .wpcf7-form .wpcf7-acceptance label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: var(--lz-fr-forms-text);
    cursor: pointer;
}

#lz-fr .wpcf7-form input[type="checkbox"] {
    flex: 0 0 auto;
    width: 1.15rem;
    height: 1.15rem;
    margin-block-start: .15rem;
    accent-color: var(--lz-fr-primary);
}

/* Odesílací tlačítko — vzhled a.btn / #submit.btn ze style.css webu,
   umístění dle .form-submit v nps-forms. */
#lz-fr .wpcf7-form .lz-fr-submit-wrap {
    margin-block-start: 30px;
    text-align: center;
}

#lz-fr .wpcf7-form .wpcf7-submit {
    display: inline-block;
    padding: 10px 20px !important;
    background-color: var(--lz-fr-btn-bg) !important;
    border: 0 !important;
    border-radius: var(--lz-fr-btn-radius) !important;
    color: var(--lz-fr-btn-text) !important;
    font-family: var(--lz-fr-font-heading) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    cursor: pointer;
    transition: background-color var(--lz-fr-transition);
}

#lz-fr .wpcf7-form .wpcf7-submit:hover,
#lz-fr .wpcf7-form .wpcf7-submit:focus-visible {
    background-color: var(--lz-fr-btn-bg-hover) !important;
    color: var(--lz-fr-btn-text) !important;
}

/* Chybové a stavové hlášky */
#lz-fr .wpcf7-not-valid-tip {
    margin-block-start: 5px;
    color: var(--lz-fr-error) !important;
    font-size: var(--lz-fr-forms-text) !important;
}

#lz-fr .wpcf7-form input.wpcf7-not-valid,
#lz-fr .wpcf7-form textarea.wpcf7-not-valid {
    border-top-color: var(--lz-fr-error) !important;
    border-right-color: var(--lz-fr-error) !important;
    border-bottom-color: var(--lz-fr-error) !important;
    border-left-color: var(--lz-fr-error) !important;
}

#lz-fr .wpcf7 form .wpcf7-response-output {
    margin: var(--lz-fr-forms-gap) 0 0 0 !important;
    padding: 10px !important;
    border-radius: var(--lz-fr-forms-input-radius) !important;
    border-top-width: 2px !important;
    border-right-width: 2px !important;
    border-bottom-width: 2px !important;
    border-left-width: 2px !important;
    font-size: var(--lz-fr-forms-text) !important;
}

#lz-fr .wpcf7 form.sent .wpcf7-response-output {
    border-color: var(--lz-fr-accent) !important;
    background-color: #e9f7f9 !important;
}

#lz-fr .wpcf7 form.invalid .wpcf7-response-output,
#lz-fr .wpcf7 form.failed .wpcf7-response-output {
    border-color: var(--lz-fr-error) !important;
    background-color: rgba(220, 38, 38, .07) !important;
}

/* ==========================================================================
   Breakpointy
   ========================================================================== */

@media (min-width: 576px) {
    #lz-fr .lz-fr-hero__title {
        font-size: var(--lz-fr-text-5xl);
    }

    #lz-fr .wpcf7-form .lz-fr-row--2,
    #lz-fr .wpcf7-form .lz-fr-row--3,
    #lz-fr .wpcf7-form .lz-fr-row--2 > p,
    #lz-fr .wpcf7-form .lz-fr-row--3 > p {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media (min-width: 768px) {
    #lz-fr {
        --lz-fr-gutter: 2rem;
    }

    #lz-fr .lz-fr-lokality__grid,
    #lz-fr .lz-fr-kroky__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    #lz-fr .lz-fr-krok {
        text-align: start;
    }

    #lz-fr .lz-fr-krok__cislo {
        margin-inline: 0;
    }

    #lz-fr .lz-fr-vyhody__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    #lz-fr .lz-fr-section__title {
        font-size: var(--lz-fr-text-4xl);
    }

    #lz-fr .lz-fr-form,
    #lz-fr .lz-fr-formaside {
        padding: var(--lz-fr-space-8);
    }
}

@media (min-width: 1024px) {
    #lz-fr .lz-fr-vyhody__grid {
        grid-template-columns: repeat(4, 1fr);
    }

    #lz-fr .lz-fr-kroky__grid {
        grid-template-columns: repeat(5, 1fr);
    }

    /* Pět úzkých sloupců — nejdelší nadpis se na jeden řádek nevejde,
       proto se zalomí všechny stejně, aby řada držela tvar. */
    #lz-fr .lz-fr-krok__br {
        display: initial;
    }

    #lz-fr .lz-fr-koho__inner {
        grid-template-columns: 1fr 1.15fr;
        gap: var(--lz-fr-space-16);
    }

    #lz-fr .lz-fr-formwrap__inner {
        grid-template-columns: 1.9fr 1fr;
        gap: var(--lz-fr-space-10);
    }

    #lz-fr .lz-fr-formaside {
        order: 0;
        position: sticky;
        inset-block-start: var(--lz-fr-header-offset);
    }

    #lz-fr .lz-fr-hero__inner {
        padding-block: var(--lz-fr-space-20);
    }
}

@media (prefers-reduced-motion: reduce) {
    #lz-fr *,
    #lz-fr *::before,
    #lz-fr *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

    #lz-fr .lz-fr-btn:hover,
    #lz-fr .lz-fr-karta:hover,
    #lz-fr .wpcf7-form .wpcf7-submit:hover {
        transform: none;
    }
}
