/* ============================================================
   Férovémilovice — hlavní stylesheet
   Estetika: moderní, svěží, optimistická
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,400;1,9..144,500;1,9..144,600;1,9..144,700&family=Outfit:wght@300;400;500;600;700&display=swap&subset=latin,latin-ext');

:root,
body {
    /* Paleta — modrá blíž ODS + teplý korál */
    --fm-modra:      #0a5ba8;   /* posunuto blíž k ODS #034EA2 */
    --fm-modra-tmava:#074a8a;
    --fm-modra-svetla:#e8f1fa;
    --fm-koral:      #f06449;   /* teplý akcent */
    --fm-koral-tmavy:#d94e34;
    --fm-zlata:      #e8b730;
    --fm-svetla:     #f7f4ee;   /* teplá krémová */
    --fm-text:       #1a2430;
    --fm-text-mid:   #5a6573;
    --fm-bila:       #ffffff;
    --fm-border:     #e6e9ee;

    /* Stíny */
    --fm-shadow-sm: 0 1px 3px rgba(20,40,60,0.06), 0 1px 2px rgba(20,40,60,0.04);
    --fm-shadow-md: 0 6px 24px rgba(20,40,60,0.08);
    --fm-shadow-lg: 0 16px 48px rgba(20,40,60,0.12);

    --fm-radius:     14px;
    --fm-radius-lg:  24px;
}

/* ---- Typografie ---- */
body {
    color: var(--fm-text);
    font-family: 'Outfit', -apple-system, sans-serif;
    font-size: 17px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.fm-display {
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.12;
    color: var(--fm-text);
}

/* ---- CTA tlačítka ---- */
.fm-btn-primary,
.fm-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    border-radius: 999px;
    padding: 13px 30px;
    transition: transform 0.18s cubic-bezier(.34,1.56,.64,1), box-shadow 0.18s ease, background 0.18s ease;
    cursor: pointer;
    border: none;
}
.fm-btn-primary {
    background: var(--fm-koral);
    color: var(--fm-bila);
    box-shadow: 0 4px 14px rgba(240,100,73,0.35);
}
.fm-btn-primary:hover {
    background: var(--fm-koral-tmavy);
    color: var(--fm-bila);
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(240,100,73,0.45);
}
.fm-btn-secondary {
    background: transparent;
    border: 2px solid var(--fm-modra);
    color: var(--fm-modra);
    padding: 11px 28px;
}
.fm-btn-secondary:hover {
    background: var(--fm-modra);
    color: var(--fm-bila);
    transform: translateY(-2px);
}

/* ============================================================
   GRID KANDIDÁTŮ (/kandidati)
   ============================================================ */
.fm-kandidati-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 28px;
    padding: 28px 0;
}
.fm-kandidat-karta-small {
    background: var(--fm-bila);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius-lg);
    overflow: hidden;
    box-shadow: var(--fm-shadow-sm);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    display: flex;
    flex-direction: column;
}
.fm-kandidat-karta-small:hover {
    transform: translateY(-6px);
    box-shadow: var(--fm-shadow-lg);
}
.fm-kandidat-karta-small img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    /* Postava lici se spodni hranou karty — ne aby se torzo
       vznaselo nad pruhem bileho pozadi. */
    object-position: center bottom;
}
.fm-kandidat-karta-small .fm-kandidat-karta-info {
    padding: 18px 20px 22px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.fm-kandidat-karta-small .poradi {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--fm-koral);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.fm-kandidat-karta-small h3 {
    margin: 4px 0 6px;
    font-size: 1.3rem;
}
.fm-kandidat-karta-small p {
    font-size: 0.92rem;
    color: var(--fm-text-mid);
    margin: 0 0 14px;
}
.fm-kandidat-karta-small .fm-btn-secondary {
    margin-top: auto;
    font-size: 0.85rem;
    padding: 7px 18px;
}

/* ============================================================
   GRID TÉMAT (/program)
   ============================================================ */
.fm-temata-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 28px;
    padding: 28px 0;
}
.fm-tema-karta-grid {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: var(--fm-radius-lg);
    overflow: hidden;
    text-decoration: none;
    color: var(--fm-text);
    background: var(--fm-bila);
    border: 1px solid var(--fm-border);
    box-shadow: var(--fm-shadow-sm);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    min-height: 280px;
}
.fm-tema-karta-grid:hover {
    transform: translateY(-6px);
    box-shadow: var(--fm-shadow-lg);
}
.fm-tema-karta-grid img {
    width: 100%;
    height: 160px;
    object-fit: cover;
}
.fm-tema-karta-grid > div {
    padding: 20px 22px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.fm-tema-karta-grid h3 {
    font-size: 1.3rem;
    margin: 0 0 8px;
}
.fm-tema-karta-grid p {
    font-size: 0.95rem;
    color: var(--fm-text-mid);
    margin: 0 0 12px;
    flex: 1;
}
.fm-tema-karta-grid small {
    font-size: 0.82rem;
    color: var(--fm-koral);
    font-weight: 600;
}

/* ============================================================
   ANIMACE — staggered reveal
   ============================================================ */
@keyframes fmFadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.fm-temata-grid > *,
.fm-kandidati-grid > * {
    animation: fmFadeUp 0.5s ease backwards;
}
.fm-temata-grid > *:nth-child(1),
.fm-kandidati-grid > *:nth-child(1) { animation-delay: 0.05s; }
.fm-temata-grid > *:nth-child(2),
.fm-kandidati-grid > *:nth-child(2) { animation-delay: 0.12s; }
.fm-temata-grid > *:nth-child(3),
.fm-kandidati-grid > *:nth-child(3) { animation-delay: 0.19s; }
.fm-temata-grid > *:nth-child(4),
.fm-kandidati-grid > *:nth-child(4) { animation-delay: 0.26s; }
.fm-temata-grid > *:nth-child(5),
.fm-kandidati-grid > *:nth-child(5) { animation-delay: 0.33s; }
.fm-temata-grid > *:nth-child(6),
.fm-kandidati-grid > *:nth-child(6) { animation-delay: 0.40s; }

@media (prefers-reduced-motion: reduce) {
    * { animation: none !important; transition: none !important; }
}

/* ============================================================
   Badge "s podporou ODS"
   ============================================================ */
.fm-ods-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
    color: var(--fm-text-mid);
    font-weight: 500;
}
.fm-ods-badge img {
    height: 26px;
    width: auto;
    border-radius: 4px;
}

/* Skryt textovy site-title — pouzivame jen logo */
.site-title { display: none !important; }
/* Logo v headeru — rozumna velikost */
.site-logo img, .custom-logo { max-height: 44px; width: auto; }

/* ============================================================
   Newsletter blok
   ============================================================ */
.fm-newsletter {
    background: var(--fm-modra-svetla);
    border-radius: var(--fm-radius-lg);
    padding: 40px 32px;
    margin: 48px 0;
}
.fm-newsletter-inner { max-width: 520px; margin: 0 auto; text-align: center; }
.fm-newsletter h2 { margin: 0 0 8px; }
.fm-newsletter p { color: var(--fm-text-mid); margin: 0 0 20px; }
.fm-footer-newsletter { max-width: 1180px; margin: 0 auto; padding: 0 24px; }

/* ============================================================
   Mohlo by vas zajimat
   ============================================================ */
.fm-related { margin: 48px 0; }
.fm-related h2 { font-size: 1.4rem; margin: 0 0 20px; }
.fm-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}
.fm-related-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px 20px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    text-decoration: none;
    color: var(--fm-text);
    transition: all 0.2s;
}
.fm-related-card:hover {
    border-color: var(--fm-modra);
    transform: translateY(-3px);
    box-shadow: var(--fm-shadow-md);
}
.fm-related-kicker {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--fm-koral);
    font-weight: 600;
}
.fm-related-card strong { font-size: 1.05rem; }

/* ============================================================
   Breadcrumbs
   ============================================================ */
.fm-breadcrumbs {
    font-size: 0.85rem;
    color: var(--fm-text-mid);
    margin-bottom: 16px;
}
.fm-breadcrumbs a { color: var(--fm-modra); text-decoration: none; }
.fm-breadcrumbs a:hover { text-decoration: underline; }

/* ---- Odkaz na zásady ochrany osobních údajů v patičce ---- */
.fm-footer-gdpr {
    text-align: center;
    padding: 14px 16px 0;
    font-size: 0.85rem;
}
.fm-footer-gdpr a {
    color: var(--fm-text-mid);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.fm-footer-gdpr a:hover {
    color: var(--fm-modra);
    border-bottom-color: currentColor;
}