/*
Theme Name: Win-Win Pro
Theme URI: https://www.winwin.coop
Author: Stanislav Zbořil
Author URI: https://www.winwin.coop
Description: Bleskově rychlý klientský portál na míru pro Podílové družstvo Win-Win.
Version: 1.2.1
Text Domain: winwin-pro
*/

/* ==========================================================================
   0. HLAVNÍ PROMĚNNÉ (DESIGN SYSTEM - VARIANTA B)
   ========================================================================== */
:root {
    --soft-black: #1A1C20;
    --off-white: #F8F9FA;
    --pure-white: #FFFFFF;
    --gold-light: #D4B08C;
    --gold-main: #BC926A;
    --gold-dark: #A37A52;
    /* Tmavší zlatá pro drobný text na světlém pozadí (kontrast 5 : 1, splňuje WCAG AA) */
    --gold-ink: #8A6440;
    --gold-ink-hover: #6B4C2F;
    /* Hlavní tlačítko: zlatá plocha + tmavý text (kontrast 6 : 1). Bílý text na zlaté má jen 2,8 : 1. */
    --btn-primary-bg: var(--gold-main);
    --btn-primary-bg-hover: var(--gold-light);
    --btn-primary-text: var(--soft-black);
    --radius-prvku: 12px;
    --luxusni-stin: 0 20px 40px rgba(0, 0, 0, 0.04);
    --animace-plynula: 1.2s cubic-bezier(0.25, 1, 0.5, 1);
    --animace-rychla: 0.3s ease;
}

/* ==========================================================================
   1. ZÁKLADNÍ RESET A ROZVRŽENÍ
   ========================================================================== */
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: var(--off-white);
    color: var(--soft-black);
    margin: 0; padding: 0; line-height: 1.6;
    display: flex; flex-direction: column; min-height: 100vh;
}

/* ==========================================================================
   1a. ODKAZY – na celém webu jen dva vzhledy
   --------------------------------------------------------------------------
   1. Odkaz v textu (ve větě, odstavci, poznámce): vždy podtržený.
   2. Samostatný odkaz (patička, seznam odkazů, „Zjistit více →“, kontakty):
      bez podtržení, podtrhne se až pod myší.
   U obou platí stejná barva: na světlém podkladu hnědá (--gold-ink),
   pod myší tmavší (--gold-ink-hover); na tmavém podkladu světle zlatá.
   Tlačítka, dlaždice a hlavní menu v hlavičce nejsou odkazy v tomto smyslu.
   Pravidla mají nulovou váhu (:where), konkrétní styl komponenty je vždy přebije.
   ========================================================================== */
:where(a) { color: var(--gold-ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
:where(a:hover) { color: var(--gold-ink-hover); }

.ww-container {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: block !important;
}

.ww-container-wide {
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: block !important;
}

.ww-main-content { flex: 1; }

/* Text jen pro čtečky obrazovky (vizuálně skrytý) */
.ww-sr-only {
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    padding: 0 !important; margin: -1px !important;
    overflow: hidden !important; clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important; border: 0 !important;
}

/* Odkaz "Přeskočit na obsah" - viditelný jen po stisku Tab */
.ww-sr-only-focusable { position: absolute; left: -9999px; top: 0; }
.ww-sr-only-focusable:focus { left: 16px; top: 16px; z-index: 100000; background: var(--pure-white); color: var(--soft-black); padding: 10px 16px; border-radius: 8px; box-shadow: var(--luxusni-stin); }

/* Hláška viditelná jen pro administrátory */
.ww-admin-hint { text-align: center; width: 100%; padding: 15px; border: 1px dashed var(--gold-main); border-radius: var(--radius-prvku); color: var(--soft-black); background: var(--pure-white); }

/* ==========================================================================
   2. TLAČÍTKA
   ========================================================================== */
.ww-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 16px 32px; font-size: 16px; font-weight: 600; text-decoration: none;
    border-radius: var(--radius-prvku);
    transition: background-color var(--animace-rychla), transform var(--animace-plynula), box-shadow var(--animace-plynula);
    cursor: pointer;
}
.ww-btn:focus-visible { outline: 3px solid var(--gold-ink); outline-offset: 3px; }

.ww-btn-primary {
    background-color: var(--btn-primary-bg); color: var(--btn-primary-text) !important; border: none;
    box-shadow: 0 10px 20px rgba(188, 146, 106, 0.2);
}

.ww-btn-primary:hover {
    background-color: var(--btn-primary-bg-hover); transform: translateY(-3px);
    box-shadow: 0 15px 25px rgba(188, 146, 106, 0.3); color: var(--btn-primary-text) !important;
}

/* Obrysové tlačítko (např. "Všechny články") */
.ww-btn-outline {
    background-color: transparent; color: var(--gold-ink) !important;
    border: 2px solid var(--gold-main);
    padding: 12px 26px;
}
.ww-btn-outline:hover { background-color: var(--gold-main); color: var(--soft-black) !important; transform: translateY(-3px); }
.ww-btn-outline i { transition: transform 0.3s ease; }
.ww-btn-outline:hover i { transform: translateX(4px); }

.registrace {
    position: relative;
    display: inline-block;
    color: var(--gold-ink); /* Výchozí barva textu */
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    padding: 2px 0; /* Lehký prostor nad a pod textem */
    background: transparent;
    border: none;
    box-shadow: none;
    cursor: pointer;
    transition: color var(--animace-rychla);
}

/* 2. Barva textu po najetí myší (volitelné) */
.registrace:hover {
    color: var(--gold-ink-hover) !important;
}

/* 3. Samotná linka pod textem (využívá pseudo-element ::after) */
.registrace::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: -15px;
    width: 120%;
    height: 1px; /* Definuje maximální tloušťku ve středu */

    /* Přechod: Průhledná -> Zlatá ve středu -> Průhledná */
    background: linear-gradient(90deg, transparent 0%, var(--gold-main) 50%, transparent 100%);

    /* Vytvoří tvar, který je uprostřed tlustý a do krajů se ztenčuje do špičky */
    border-radius: 50%;

    /* Výchozí stav: Linka je smrštěná na střed (není vidět) */
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--animace-plynula);
}

/* 4. Zobrazení a roztažení linky ze středu do stran po najetí myší */
.registrace:hover::after {
    transform: scaleX(1);
}

/* ==========================================================================
   3. HERO SEKCE + PLYNULÝ CAROUSEL
   ========================================================================== */
/* Horní odsazení přesně dopočítá skript hlavičky podle její skutečné výšky. */
.ww-hero-section {
    padding: 80px 0 80px 0 !important;
    background-color: transparent;
    width: 100%;
    box-sizing: border-box;
}

.ww-hero-grid { display: flex !important; flex-direction: row !important; justify-content: space-between !important; align-items: center !important; gap: 50px !important; }
.ww-hero-content { flex: 1 1 50% !important; text-align: left !important; min-width: 0; }
.ww-hero-subtitle { display: block; color: var(--gold-ink); font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; margin: 0 0 20px 0; }
.ww-hero-title { color: var(--soft-black); font-size: 46px; line-height: 1.2; font-weight: 700; margin-top: 0; margin-bottom: 25px; }
.ww-hero-text { font-size: 18px; color: var(--soft-black); opacity: 0.85; line-height: 1.6; margin: 0 0 35px 0; }
.ww-hero-image-wrapper { flex: 1 1 50% !important; min-width: 0; position: relative; padding: 10px; box-sizing: border-box; }
.ww-hero-carousel { position: relative; width: 100%; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--radius-prvku); box-shadow: var(--luxusni-stin); }

/* Neaktivní snímky jsou skryté i pro klávesnici a čtečky (visibility), prolínání zůstává. */
.ww-carousel-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; z-index: 1; transition: opacity 1.5s ease-in-out, visibility 0s linear 1.5s !important; }
.ww-carousel-slide.active { opacity: 1; visibility: visible; z-index: 2; transition: opacity 1.5s ease-in-out, visibility 0s linear 0s !important; }
.ww-carousel-slide img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; display: block; }

/* HOVER EFEKT PRO KLIKACÍ BANNERY */
a.ww-linked-slide { display: block; text-decoration: none !important; color: inherit; overflow: hidden; position: relative; }
a.ww-linked-slide img { transition: transform 0.6s ease; }
a.ww-linked-slide:hover img { transform: scale(1.04); }
a.ww-linked-slide:focus-visible { outline: 3px solid var(--gold-main); outline-offset: -3px; }
a.ww-linked-slide .ww-slide-caption { transition: transform 0.4s ease, box-shadow 0.4s ease; }
a.ww-linked-slide:hover .ww-slide-caption { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0,0,0,0.5); }
.ww-slide-caption { position: absolute; bottom: 25px; left: 25px; max-width: 80%; background: rgba(0, 0, 0, 0.72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 20px 25px; border-radius: var(--radius-prvku); border: 1px solid rgba(255, 255, 255, 0.1); z-index: 3; text-align: left; box-sizing: border-box; }
.ww-slide-caption .ww-slide-title { color: var(--pure-white) !important; font-size: 20px; font-weight: 600; margin: 0; line-height: 1.4; }
.ww-slide-caption .ww-slide-text { display: block; color: var(--gold-light); font-size: 13px; font-weight: 600; text-transform: none; letter-spacing: 1px; margin: 8px 0 0 0; line-height: 1.5; }

/* Tečky pro ruční přepínání snímků */
.ww-carousel-dots { display: flex; justify-content: center; gap: 10px; margin-top: 16px; }
.ww-carousel-dot { width: 12px; height: 12px; padding: 0; border-radius: 50%; border: 2px solid var(--gold-ink); background: transparent; cursor: pointer; transition: background-color var(--animace-rychla), transform var(--animace-rychla); }
.ww-carousel-dot.active { background: var(--gold-ink); transform: scale(1.15); }
.ww-carousel-dot:focus-visible { outline: 2px solid var(--gold-ink); outline-offset: 3px; }

/* ==========================================================================
   4. SEKCE BENEFITŮ (KARTY - 3 SLOUPCE, PŘI 4 KARTÁCH 4 SLOUPCE)
   ========================================================================== */
.ww-benefits-section { padding: 60px 0; background-color: transparent; width: 100%; }
/* Flexbox: neúplný poslední řádek se vycentruje místo osiřelé karty vlevo. */
.ww-benefits-grid { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 30px !important; align-items: stretch; }
.ww-benefits-grid > .ww-benefit-card { flex: 0 1 calc((100% - 60px) / 3); min-width: 0; }
@media (min-width: 1101px) {
    .ww-benefits-grid--4 > .ww-benefit-card { flex-basis: calc((100% - 90px) / 4); }
    .ww-benefits-grid--4 .ww-benefit-card { padding: 35px 22px !important; }
}
.ww-benefit-card { background-color: var(--pure-white) !important; padding: 40px 30px !important; border-radius: var(--radius-prvku) !important; box-shadow: var(--luxusni-stin) !important; text-align: center; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: center !important; transition: transform var(--animace-plynula), box-shadow var(--animace-plynula) !important; }
/* Zvedání při najetí jen u karet, které opravdu někam vedou (celá karta je klikací). */
.ww-benefit-card--odkaz { position: relative; cursor: pointer; }
.ww-benefit-card--odkaz:hover, .ww-benefit-card--odkaz:focus-within { transform: translateY(-8px) !important; box-shadow: 0 30px 60px rgba(0, 0, 0, 0.06) !important; }
.ww-benefit-card--odkaz .ww-benefit-more-link::after { content: ''; position: absolute; inset: 0; border-radius: var(--radius-prvku); }
.ww-benefit-card--odkaz:focus-within { outline: 3px solid var(--gold-ink); outline-offset: 3px; }
.ww-benefit-card--odkaz .ww-benefit-more-link:focus { outline: none; }
.ww-benefit-icon { width: 65px; height: 65px; background-color: var(--off-white); color: var(--gold-ink); border-radius: var(--radius-prvku); display: flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 25px; transition: background-color var(--animace-rychla), color var(--animace-rychla); }
/* Zlatá plocha + tmavá ikona (bílá na zlaté má kontrast jen 2,8 : 1) */
.ww-benefit-card--odkaz:hover .ww-benefit-icon { background-color: var(--gold-main); color: var(--soft-black); }
.ww-benefit-card h3 { color: var(--soft-black); font-size: 22px; margin-top: 0; margin-bottom: 15px; font-weight: 600; }
.ww-benefit-card p { color: var(--soft-black); opacity: 0.85; font-size: 15px; line-height: 1.6; margin: 0; }
.ww-benefit-more-link { display: inline-block; margin-top: auto !important; padding-top: 20px; color: var(--gold-ink); font-weight: 600; text-decoration: none; transition: color 0.3s ease; }
.ww-benefit-more-link:hover,
.ww-benefit-card--odkaz:hover .ww-benefit-more-link { color: var(--gold-ink-hover); text-decoration: underline; text-underline-offset: 3px; }
.ww-benefit-more-link i { margin-left: 5px; transition: transform 0.3s ease; }
.ww-benefit-card--odkaz:hover .ww-benefit-more-link i { transform: translateX(5px); }

/* ==========================================================================
   5. SEKCE BLOGU (KARTY, 4 SLOUPCE A STRÁNKOVÁNÍ)
   ========================================================================== */
.ww-blog-section { padding: 60px 0 10px 0; background-color: transparent; width: 100%; }
.ww-blog-header { text-align: center !important; margin-bottom: 50px; }
.ww-blog-header h2 { color: var(--soft-black); font-size: 36px; font-weight: 700; margin-bottom: 15px; margin-top: 0; }
.ww-blog-header p { color: var(--soft-black); opacity: 0.85; font-size: 17px; max-width: 600px; margin: 0 auto !important; }

/* Karty blogu mají pevnou šířku (1/4 řádku) – když je článků méně, karty se neroztáhnou, jen se vycentrují. */
.ww-blog-grid { display: flex !important; flex-direction: row !important; justify-content: center !important; align-items: stretch !important; gap: 25px !important; width: 100%; }
.ww-blog-grid-4 { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 30px !important; align-items: stretch; }

/* OPRAVA KARET (TOTO ZABRÁNÍ DEFORMACI OBRÁZKŮ) */
.ww-blog-card { flex: 0 1 calc((100% - 75px) / 4) !important; min-width: 0; background-color: var(--pure-white) !important; border-radius: var(--radius-prvku) !important; box-shadow: var(--luxusni-stin) !important; text-decoration: none !important; display: flex !important; flex-direction: column !important; height: 100%; overflow: hidden; box-sizing: border-box !important; transition: transform var(--animace-plynula), box-shadow var(--animace-plynula) !important; }
.ww-blog-card:hover { transform: translateY(-8px) !important; box-shadow: 0 30px 50px rgba(0, 0, 0, 0.06) !important; }
.ww-blog-card:focus-visible { outline: 3px solid var(--gold-ink); outline-offset: 3px; }
/* Obrázek karty: pevný poměr stran 16 : 10 – s obrázkem i bez něj mají karty stejnou výšku.
   Jemný zlatý podklad je vidět, než se obrázek načte. */
.ww-blog-card-image { position: relative; flex-shrink: 0; width: 100%; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(135deg, #fcf9f5 0%, #f1e9df 100%); }
/* Článek bez obrázku (výpisy archivu a hledání): logo na jemném podkladu, stejná velikost jako fotka */
.ww-blog-card-image--prazdny { background: url("https://test.winwin.coop/wp-content/themes/winwin-pro/assets/logo-znak.png") center / 45% auto no-repeat, linear-gradient(135deg, #fcf9f5 0%, #f1e9df 100%); }
.ww-blog-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--animace-plynula) !important; }
.ww-blog-card:hover .ww-blog-card-image img { transform: scale(1.06) !important; }
.ww-blog-card-content { padding: 20px !important; display: flex !important; flex-direction: column !important; flex-grow: 1 !important; }
.ww-blog-date { font-size: 12px; color: var(--gold-ink); font-weight: 600; margin-bottom: 8px; text-transform: uppercase; }
.ww-blog-card h3 { font-size: 18px; color: var(--soft-black); margin: 0 0 12px 0; line-height: 1.4; }
.ww-blog-card:hover h3 { color: var(--gold-ink); }
/* Výtah: nejvýš 4 řádky. Odkaz „Číst dále“ odtlačí na dno karty margin-top: auto (níže). */
.ww-blog-excerpt { font-size: 14px; color: var(--soft-black); opacity: 0.8; line-height: 1.5; margin-bottom: 15px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.ww-blog-more-link { display: inline-block; margin-top: auto !important; padding-top: 20px; color: var(--gold-ink); font-weight: 600; text-decoration: none; transition: color 0.3s ease; }
.ww-blog-card:hover .ww-blog-more-link { color: var(--soft-black); }
.ww-blog-more-link i { margin-left: 5px; transition: transform 0.3s ease; }
.ww-blog-card:hover .ww-blog-more-link i { transform: translateX(5px); }

/* Náhled článku bez obrázku: logo na jemném pozadí místo šedého obdélníku */
.ww-blog-placeholder-img { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #fcf9f5 0%, #f1e9df 100%); }
/* Karta úplně bez obrázkové části (jiné značení): stejně velké místo s logem doplní CSS. */
.ww-blog-card:not(:has(.ww-blog-card-image, .ww-blog-image-wrapper))::before { content: ""; display: block; flex-shrink: 0; width: 100%; aspect-ratio: 16 / 10; background: url("https://test.winwin.coop/wp-content/themes/winwin-pro/assets/logo-znak.png") center / 45% auto no-repeat, linear-gradient(135deg, #fcf9f5 0%, #f1e9df 100%); }
.ww-blog-card .ww-blog-placeholder-img img { width: 45% !important; height: auto !important; object-fit: contain !important; filter: none !important; transform: none !important; opacity: 0.9; }

/* Tlačítko "Všechny články" */
.ww-blog-all { display: flex; justify-content: center; margin-top: 40px; }

/* Vzhled pro podstránku Blog */
.ww-blog-intro-section { margin-bottom: 50px; }
.ww-blog-intro-title { color: var(--soft-black); font-size: 38px; margin-bottom: 25px; font-weight: 700; margin-top: 0; }
.ww-blog-intro-text { font-size: 17px; line-height: 1.7; opacity: 0.9; max-width: 900px; }
.ww-pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 60px; width: 100%; }
.ww-pagination .page-numbers { display: inline-flex; gap: 8px; align-items: center; justify-content: center; min-width: 45px; height: 45px; padding: 0 15px; background: var(--pure-white); border: 1px solid #ddd; border-radius: var(--radius-prvku); color: var(--soft-black); text-decoration: none; font-weight: 600; transition: all var(--animace-rychla); }
.ww-pagination .page-numbers.current, .ww-pagination .page-numbers:hover { background: var(--gold-ink); color: var(--pure-white); border-color: var(--gold-ink); }

/* ==========================================================================
   6. SEKCE SPOLEČENSTVÍ
   ========================================================================== */
.ww-community-section { padding: 60px 0 100px 0; background-color: transparent; }
.ww-community-grid { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 60px !important; width: 100%; }
.ww-community-content { flex: 1 1 50% !important; min-width: 0; }
.ww-community-content h2 { color: var(--gold-ink); font-size: 36px; line-height: 1.25; margin-top: 0; margin-bottom: 30px; font-weight: 500; }
.ww-community-content p { font-size: 16px; color: var(--soft-black); margin-bottom: 30px; line-height: 1.6; }
.ww-disclaimer { color: var(--soft-black); opacity: 0.75; font-size: 14px; line-height: 1.6; }
.ww-disclaimer strong { color: var(--soft-black); font-weight: 600; }
.ww-community-image { flex: 1 1 50% !important; width: 100% !important; min-width: 0; box-sizing: border-box; }
.ww-community-image img { width: 100%; height: auto; display: block; border-radius: var(--radius-prvku); box-shadow: var(--luxusni-stin); }

/* ==========================================================================
   7. PATIČKA (FOOTER) – tmavá, navazuje na hlavičku (návrh A, 5. 10. 2026)
   Sloupce s odkazy = nabídky typu „Seznam“ z hlavního menu. Pod 768 px se rozbalují.
   ========================================================================== */
.ww-pa { margin-top: 64px; background: #000000; border-top: 1px solid rgba(188, 146, 106, 0.45); color: #E8E1D8; font-family: 'Nunito Sans', 'Nunito-sans', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
.ww-pa *, .ww-pa *::before, .ww-pa *::after { box-sizing: border-box; }
.ww-pa-obal { max-width: 1240px; margin: 0 auto; padding: 60px 20px 0; }
.ww-pa-mrizka { display: grid; gap: 48px; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.15fr); }
.ww-pa-mrizka--1 { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.15fr); }
.ww-pa-mrizka--2 { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr); }
.ww-pa-mrizka--3 { grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.1fr); gap: 36px; }
.ww-pa ul { list-style: none; margin: 0; padding: 0; }
.ww-pa li { margin: 0; }

/* Logo, motto, sítě a portál */
.ww-pa-znacka { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.ww-pa .ww-pa-logo { display: block; line-height: 0; border-radius: 12px; }
.ww-pa .ww-pa-logo img { display: block; width: 220px; max-width: 100%; height: auto; }
/* Záloha, když server nevytvoří světlou verzi loga: původní logo na světlém podkladu */
.ww-pa .ww-pa-logo--podklad { padding: 10px 14px; background: #F3EEE7; }
.ww-pa .ww-pa-motto { margin: 0; max-width: 300px; color: #CFC6BA; font-size: 15px; line-height: 1.6; }
.ww-pa .ww-pa-site { display: flex; gap: 10px; }
.ww-pa .ww-pa-site a { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #3A332C; border-radius: 999px; color: #D4B08C; text-decoration: none; transition: border-color 0.15s, background-color 0.15s, color 0.15s; }
.ww-pa .ww-pa-site a:hover { border-color: #BC926A; background: #1A1714; color: #F3EEE7; }
.ww-pa .ww-pa-portal { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 1px solid #BC926A; border-radius: 999px; color: #D4B08C; font-size: 14px; font-weight: 700; text-decoration: none; transition: background-color 0.15s, color 0.15s; }
.ww-pa .ww-pa-portal:hover { background: #BC926A; color: #1A1C20; }

/* Nadpisy a odkazy sloupců */
.ww-pa .ww-pa-nadpis { margin: 6px 0 20px; padding: 0; font-family: 'Montserrat', 'Nunito Sans', sans-serif; font-size: 12px; font-weight: 700; line-height: 1.3; letter-spacing: 0.12em; text-transform: uppercase; color: #BC926A; }
.ww-pa .ww-pa-prepinac { display: none; }
.ww-pa .ww-pa-odkazy { display: flex; flex-direction: column; gap: 12px; }
.ww-pa .ww-pa-odkazy a, .ww-pa .ww-pa-udaje a { color: #E8E1D8; text-decoration: none; }
.ww-pa .ww-pa-odkazy a:hover, .ww-pa .ww-pa-udaje a:hover { color: #D4B08C; text-decoration: underline; text-underline-offset: 3px; }

/* Kontakt */
.ww-pa .ww-pa-firma { margin: 0 0 14px; color: #F3EEE7; font-weight: 700; }
.ww-pa .ww-pa-udaje { display: flex; flex-direction: column; gap: 12px; }
/* Odkaz na stránku Kontakty pod údaji (samostatný odkaz: podtrhne se pod myší) */
.ww-pa .ww-pa-vice { margin: 18px 0 0; }
.ww-pa .ww-pa-vice a { color: #D4B08C; font-weight: 600; text-decoration: none; }
.ww-pa .ww-pa-vice a:hover { color: #E8C9A6; text-decoration: underline; text-underline-offset: 3px; }
.ww-pa .ww-pa-udaje li { display: flex; align-items: flex-start; gap: 12px; }
.ww-pa .ww-pa-udaje svg { flex-shrink: 0; margin-top: 2px; color: #BC926A; }
.ww-pa .ww-pa-ic { color: #CFC6BA; }

/* Spodní lišta: copyright a rejstřík, dokumenty, autoři */
.ww-pa-spodek { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "pravni dokumenty" "pravni autori"; gap: 12px 32px; align-items: start; margin-top: 52px; padding: 24px 0 30px; border-top: 1px solid #2A2520; font-size: 13px; }
.ww-pa .ww-pa-pravni { grid-area: pravni; color: #B5AA9C; }
.ww-pa .ww-pa-pravni p { margin: 0 0 4px; font-size: 13px; }
.ww-pa .ww-pa-rejstrik { color: #8C8277; }
.ww-pa .ww-pa-dokumenty { grid-area: dokumenty; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 22px; }
.ww-pa .ww-pa-dokumenty a { color: #B5AA9C; text-decoration: none; }
.ww-pa .ww-pa-cookies { margin: 0; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; color: #B5AA9C; font: inherit; font-size: 13px; text-decoration: none; cursor: pointer; }
.ww-pa .ww-pa-dokumenty a:hover, .ww-pa .ww-pa-cookies:hover { color: #D4B08C; text-decoration: underline; text-underline-offset: 3px; background: none; }
.ww-pa .ww-pa-autori { grid-area: autori; margin: 0; text-align: right; color: #8C8277; font-size: 13px; }
.ww-pa .ww-pa-jmena { margin-left: 6px; font-family: 'Farrington', Georgia, serif; font-size: 15px; letter-spacing: 0.04em; color: #BC926A; }
.ww-pa a:focus-visible, .ww-pa button:focus-visible { outline: 2px solid #D4B08C; outline-offset: 3px; border-radius: 4px; }

/* Tablet: logo přes celou šířku, pod ním sloupce */
@media (max-width: 1099px) {
    .ww-pa-mrizka, .ww-pa-mrizka--1, .ww-pa-mrizka--2, .ww-pa-mrizka--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; }
    /* Logo, motto, sítě a portál v jednom pásu nad sloupci */
    .ww-pa-znacka { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 20px 32px; }
    .ww-pa .ww-pa-motto { flex: 1 1 260px; }
}

/* Mobil: sloupce s odkazy se rozbalují, kontakt zůstává otevřený */
@media (max-width: 767px) {
    .ww-pa { margin-top: 48px; }
    .ww-pa-obal { padding: 40px 20px 0; }
    .ww-pa-mrizka, .ww-pa-mrizka--1, .ww-pa-mrizka--2, .ww-pa-mrizka--3 { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .ww-pa-znacka { flex-direction: column; align-items: flex-start; gap: 18px; margin-bottom: 28px; }
    .ww-pa .ww-pa-motto { flex: none; }
    .ww-pa .ww-pa-logo img { width: 200px; }
    .ww-pa .ww-pa-portal { width: 100%; justify-content: center; min-height: 48px; border-radius: 12px; font-size: 15px; }
    .ww-pa-sloupec { border-top: 1px solid #2A2520; }
    .ww-pa .ww-pa-sloupec .ww-pa-nadpis { margin: 20px 0 16px; }
    .ww-pa-sloupec .ww-pa-odkazy { margin-bottom: 24px; }
    .ww-pa-js .ww-pa-sloupec .ww-pa-nadpis { display: none; }
    .ww-pa.ww-pa-js .ww-pa-prepinac { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; color: #F3EEE7; font-family: 'Montserrat', 'Nunito Sans', sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; text-align: left; cursor: pointer; }
    .ww-pa.ww-pa-js .ww-pa-prepinac svg { color: #BC926A; transition: transform 0.2s; }
    .ww-pa.ww-pa-js .ww-pa-sloupec.is-open .ww-pa-prepinac { color: #D4B08C; }
    .ww-pa.ww-pa-js .ww-pa-sloupec.is-open .ww-pa-prepinac svg { transform: rotate(180deg); }
    .ww-pa.ww-pa-js .ww-pa-sloupec .ww-pa-odkazy { display: none; margin: 0; }
    .ww-pa.ww-pa-js .ww-pa-sloupec.is-open .ww-pa-odkazy { display: flex; gap: 0; padding-bottom: 16px; }
    .ww-pa.ww-pa-js .ww-pa-odkazy a { display: flex; align-items: center; min-height: 44px; }
    .ww-pa-kontakt { padding-top: 28px; border-top: 1px solid #2A2520; }
    .ww-pa .ww-pa-kontakt .ww-pa-nadpis { margin-top: 0; }
    .ww-pa-spodek { grid-template-columns: minmax(0, 1fr); grid-template-areas: "dokumenty" "pravni" "autori"; gap: 14px; margin-top: 32px; }
    .ww-pa .ww-pa-dokumenty { justify-content: flex-start; gap: 4px 18px; }
    .ww-pa .ww-pa-dokumenty a, .ww-pa .ww-pa-cookies { display: inline-flex; align-items: center; min-height: 32px; }
    .ww-pa .ww-pa-autori { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
    .ww-pa .ww-pa-site a, .ww-pa .ww-pa-portal, .ww-pa.ww-pa-js .ww-pa-prepinac svg { transition: none; }
}

/* ==========================================================================
   8. RESPONSIVITA (MOBILY A TABLETY)
   ========================================================================== */
@media (max-width: 1200px) { .ww-blog-grid-4 { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 1100px) {
    /* Čtyři karty 2 + 2. Tři karty zůstávají ve třech sloupcích (2 + 1 by měla poslední kartu
       jinak vysokou a samotnou), na užší obrazovce pod sebou – viz 860px. */
    .ww-benefits-grid--4 > .ww-benefit-card { flex-basis: calc((100% - 30px) / 2); }
    .ww-benefits-grid:not(.ww-benefits-grid--4) { gap: 20px !important; }
    .ww-benefits-grid:not(.ww-benefits-grid--4) > .ww-benefit-card { flex-basis: calc((100% - 40px) / 3); padding: 32px 20px !important; }
}
@media (max-width: 860px) {
    .ww-benefits-grid:not(.ww-benefits-grid--4) > .ww-benefit-card { flex-basis: 100%; max-width: 560px; }
}
@media (max-width: 992px) {
    /* Výchozí hodnota do chvíle, než skript hlavičky dopočítá přesné odsazení. */
    .ww-hero-section { padding: 110px 0 50px 0 !important; }
    /* Na mobilu nejdřív nadpis a tlačítko, obrázek až pod nimi. */
    .ww-hero-grid { flex-direction: column !important; gap: 30px !important; }
    .ww-hero-content, .ww-hero-image-wrapper { flex: 1 1 100% !important; width: 100% !important; }
    .ww-hero-content h1 { font-size: 34px !important; }
    .ww-hero-text { margin-bottom: 25px; }
    .ww-blog-grid { flex-wrap: wrap !important; }
    .ww-blog-grid-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .ww-blog-card { flex: 0 1 calc((100% - 25px) / 2) !important; }
    .ww-community-grid { flex-direction: column-reverse !important; text-align: center; gap: 40px !important; }
    .ww-community-content h2 { font-size: 28px; }
}
@media (max-width: 600px) {
    .ww-hero-content h1 { font-size: 30px !important; }
    .ww-benefits-grid > .ww-benefit-card { flex-basis: 100%; }
    .ww-blog-grid { flex-direction: column !important; }
    .ww-blog-grid-4 { grid-template-columns: 1fr !important; }
    .ww-blog-card { flex: 1 1 100% !important; width: 100% !important; }
    .ww-slide-caption { bottom: 15px; left: 15px; padding: 15px; max-width: 90%; }
    .ww-slide-caption .ww-slide-text { font-size: 12px; }
    .ww-slide-caption .ww-slide-title { font-size: 16px; }
}

/* ==========================================================================
   9. DETAIL ČLÁNKU A DVOUSLOUPCOVÝ LAYOUT
   ========================================================================== */
.ww-single-section { padding-bottom: 100px; }

/* VYNUCENÉ Flexbox rozložení (Přebití agresivní šablony) */
.ww-single-layout {
    display: flex !important;
    flex-direction: row !important;
    gap: 40px !important;
    align-items: flex-start !important;
    max-width: 1250px !important;
    margin: 0 auto !important;
    width: 100% !important;
}

/* Levý hlavní sloupec */
.ww-single-main {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: 100% !important;
}

/* Pravý boční sloupec s Sticky efektem */
.ww-single-sidebar {
    flex: 0 0 350px !important;
    width: 350px !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 130px !important;
    margin-top: 0 !important;
}

/* --- LEVÝ SLOUPEC: DESIGN ČLÁNKU --- */
.ww-single-post {
    background: var(--pure-white);
    padding: 50px;
    border-radius: var(--radius-prvku);
    box-shadow: var(--luxusni-stin);
    margin: 0 !important;
    max-width: none !important; /* Odstranění limitu, aby se sloupec natáhl */
}

.ww-single-header { text-align: center; margin-bottom: 40px; }
.ww-single-date { color: var(--gold-ink); font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; font-size: 14px; display: block; margin-bottom: 15px; }
.ww-single-title { color: var(--soft-black); font-size: 38px; margin: 0; line-height: 1.2; font-weight: 700; }
/* Vyšší váha než globální styly nadpisů ze starých šablon (Elementor kit): název článku má vždy tento vzhled. */
.ww-single-header h1.ww-single-title { font-family: inherit; color: var(--soft-black); font-size: 38px; font-weight: 700; line-height: 1.2; letter-spacing: normal; text-transform: none; margin: 0; }
.ww-single-header .ww-single-date { color: var(--gold-ink); }

/* Zaoblený hlavní obrázek jako na úvodní straně */
.ww-single-thumbnail { width: 100%; border-radius: 20px; overflow: hidden; margin-bottom: 45px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.ww-single-thumbnail img { width: 100%; height: auto; display: block; object-fit: cover; max-height: 550px; border-radius: 20px; }

/* Texty v článku */
.ww-post-content { color: var(--soft-black); font-size: 18px; line-height: 1.8; opacity: 0.9; }
.ww-post-content h2, .ww-post-content h3 { color: var(--soft-black); font-weight: 600; margin-top: 40px; margin-bottom: 20px; }
.ww-post-content h2 { font-size: 26px; }
.ww-post-content p { margin-bottom: 25px; }
.ww-post-content a { color: var(--gold-ink); text-decoration: none; font-weight: 600; border-bottom: 1px solid transparent; transition: border-color 0.3s ease; }
.ww-post-content a:hover { border-color: var(--gold-ink); }
.ww-post-content ul { margin-bottom: 25px; padding-left: 20px; }
.ww-post-content li { margin-bottom: 10px; }

/* --- TVRDÉ ODSTRANĚNÍ FORMULÁŘE PRO ODBĚR NOVINTEK --- */
.ww-post-content form,
.ww-post-content .newsletter-form,
.ww-post-content .mc4wp-form {
    display: none !important;
}

/* --- PRAVÝ SLOUPEC: BOČNÍ PANEL (SIDEBAR) --- */
.ww-sidebar-widget { background: var(--pure-white); padding: 30px; border-radius: 20px; box-shadow: var(--luxusni-stin); }
.ww-sidebar-title { font-size: 20px; font-weight: 600; margin-top: 0; margin-bottom: 25px; color: var(--soft-black); border-bottom: 2px solid var(--gold-main); padding-bottom: 10px; display: inline-block; }
.ww-sidebar-posts { display: flex; flex-direction: column; gap: 20px; }
.ww-sidebar-post-link { display: flex; gap: 15px; text-decoration: none; align-items: center; transition: transform var(--animace-rychla); }
.ww-sidebar-post-link:hover { transform: translateX(5px); }
.ww-sidebar-thumb { flex: 0 0 90px; width: 90px; height: 70px; border-radius: 10px; overflow: hidden; }
.ww-sidebar-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ww-sidebar-info { display: flex; flex-direction: column; }
.ww-sidebar-date { font-size: 12px; color: var(--gold-ink); margin-bottom: 4px; font-weight: 600; }
.ww-sidebar-post-title { font-size: 15px; font-weight: 600; color: var(--soft-black); margin: 0; line-height: 1.3; transition: color var(--animace-rychla); }
.ww-sidebar-post-link:hover .ww-sidebar-post-title { color: var(--gold-ink); }

/* --- SDÍLENÍ A NAVIGACE --- */
.ww-single-share { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 50px; padding-top: 30px; border-top: 1px solid rgba(0,0,0,0.05); }
.ww-single-share span { font-weight: 600; font-size: 16px; color: var(--soft-black); }
.ww-single-share a { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: var(--off-white); color: var(--soft-black); border-radius: 50%; text-decoration: none; font-size: 16px; transition: all var(--animace-rychla); }
.ww-single-share a:hover { background: var(--gold-main); color: var(--soft-black); transform: translateY(-3px); }
.ww-single-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; padding-top: 40px; border-top: 1px solid rgba(0,0,0,0.05); flex-wrap: wrap; gap: 20px; }
.ww-single-nav a { display: inline-flex; align-items: center; gap: 8px; color: var(--soft-black); text-decoration: none; font-weight: 600; transition: color var(--animace-rychla); font-size: 16px; }
.ww-single-nav a:hover { color: var(--gold-ink); }
.ww-nav-next { text-align: right; }
.ww-single-back { margin-top: 50px; text-align: center; }

/* --- RESPONZIVITA (Mobily a menší tablety) --- */
@media (max-width: 1024px) {
    .ww-single-layout { flex-direction: column !important; padding: 0 20px !important; }
    .ww-single-sidebar { flex: none !important; width: 100% !important; position: static !important; margin-top: 30px !important; }
    .ww-single-post { padding: 30px 20px !important; }
    .ww-single-title { font-size: 30px !important; }
    .ww-single-nav { flex-direction: column !important; text-align: center !important; }
    .ww-nav-prev, .ww-nav-next { text-align: center !important; width: 100% !important; }
}
/* ========================================================= */
/* --- KÓD PRO KLIENTSKÝ PORTÁL (AUTENTIZACE A FORMULÁŘE) --- */
/* ========================================================= */
.ww-account-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; max-width: 1200px; margin: 140px auto 80px auto; padding: 0 20px; align-items: start; }
.ww-auth-card { background-color: var(--pure-white, #ffffff); border: 1px solid rgba(0, 0, 0, 0.08); border-radius: var(--radius-prvku, 12px); padding: 40px; box-shadow: var(--luxusni-stin, 0 20px 40px rgba(0, 0, 0, 0.04)); transition: transform 1.2s cubic-bezier(0.25, 1, 0.5, 1); }
.ww-auth-card:hover { transform: translateY(-5px); }
.ww-auth-title { color: #005B9F; font-size: 1.5rem; margin-bottom: 30px; font-weight: 600; }
.ww-auth-form { display: flex; flex-direction: column; gap: 20px; }
.ww-form-group { display: flex; flex-direction: column; gap: 8px; }
.ww-form-row { display: grid; grid-template-columns: 1fr; gap: 20px; }
.ww-auth-form label { font-size: 0.9rem; color: var(--soft-black, #1A1C20); font-weight: 500; }
.ww-required { color: #cc0000; }
.ww-input { width: 100%; padding: 12px 15px; border: 1px solid #ced4da; border-radius: 6px; background-color: #f4f7fb; font-size: 1rem; color: var(--soft-black, #1A1C20); transition: border-color 0.3s ease, box-shadow 0.3s ease; }
.ww-input:focus { outline: none; border-color: var(--gold-main, #b88645); box-shadow: 0 0 0 3px rgba(184, 134, 69, 0.15); background-color: #ffffff; }
.ww-password-input-wrapper { position: relative; display: flex; align-items: center; }
.ww-password-toggle { position: absolute; right: 15px; cursor: pointer; opacity: 0.6; transition: opacity 0.3s ease; }
.ww-password-toggle:hover { opacity: 1; }
.ww-form-actions { display: flex; align-items: center; gap: 20px; margin-top: 10px; }
.ww-checkbox-label { display: flex; align-items: center; gap: 8px; font-size: 0.9rem; cursor: pointer; }
.ww-forgot-password { color: var(--gold-ink, #8A6440); font-size: 0.9rem; text-decoration: none; margin-top: 10px; display: inline-block; transition: color 0.3s ease; }
.ww-forgot-password:hover { color: var(--gold-ink-hover, #6B4C2F); text-decoration: underline; }
.ww-form-disclaimer { font-size: 0.85rem; color: #555555; line-height: 1.5; margin-top: 10px; }
.ww-form-disclaimer a { color: var(--gold-ink, #8A6440); text-decoration: none; }
.ww-form-disclaimer a:hover { text-decoration: underline; }
.ww-btn-gold { background-color: var(--btn-primary-bg); color: var(--btn-primary-text); border: none; padding: 12px 30px; border-radius: var(--radius-prvku); font-weight: 600; font-size: 1rem; cursor: pointer; transition: background-color var(--animace-rychla), transform var(--animace-plynula), color var(--animace-rychla); display: inline-block; width: fit-content; }
.ww-btn-gold:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-text); }
@media (max-width: 992px) { .ww-account-wrapper { grid-template-columns: 1fr; gap: 30px; margin: 40px auto; } }

.ww-standalone-portal { width: 100% !important; float: none !important; margin: 0 auto !important; padding: 0 !important; }
.ww-standalone-portal .clear { display: none !important; }
.ww-custom-form-grid { display: grid; grid-template-columns: 1fr; gap: 15px; width: 100%; }
.ww-custom-form-grid > div { display: flex; flex-direction: column; justify-content: flex-start; }
.ww-req-star { color: #d63638; font-weight: bold; margin-left: 3px; }
abbr.required, abbr[title] { border-bottom: none !important; text-decoration: none !important; cursor: default !important; color: #d63638 !important; font-weight: bold; }
@media (min-width: 768px) { .ww-custom-form-grid { grid-template-columns: repeat(12, 1fr); } .ww-col-3 { grid-column: span 3; } .ww-col-4 { grid-column: span 4; } .ww-col-5 { grid-column: span 5; } .ww-col-6 { grid-column: span 6; } .ww-col-8 { grid-column: span 8; } .ww-col-12 { grid-column: span 12; } }
.ww-custom-emoji { width: 26px; height: 26px; object-fit: contain; display: inline-block; vertical-align: middle; margin-right: 8px !important; flex-shrink: 0; transition: transform 0.2s ease; }
.ww-menu-btn:hover .ww-custom-emoji, .ww-dropdown-content a:hover .ww-custom-emoji, .ww-dash-action-btn:hover .ww-custom-emoji, .ww-tab-btn:hover .ww-custom-emoji, .ww-accordion-btn:hover .ww-custom-emoji, .ww-kz-btn-dark:hover .ww-custom-emoji, .ww-kz-btn-brown:hover .ww-custom-emoji { transform: scale(1.3) rotate(0deg); }
.ww-menu-active .ww-custom-emoji, button.ww-tab-btn.active .ww-custom-emoji { filter: none !important; }
.ww-portal-container { margin-top: 80px !important; }
@media screen and (min-width: 765px) and (max-width: 1018px) { .ww-portal-container { margin-top: 150px !important; } }
@media screen and (min-width: 1019px) and (max-width: 1250px) { .ww-portal-container { margin-top: 120px !important; } }
@media screen and (min-width: 1251px) and (max-width: 1600px) { .ww-portal-container { margin-top: 20px !important; } }
@media screen and (min-width: 1601px) { .ww-portal-container { margin-top: 20px !important; } }
/* ==========================================================================
   RESPONZIVNÍ NADPISY PRO BLOG (Mobily a tablety)
   ========================================================================== */

/* Pro tablety a menší notebooky */
@media (max-width: 992px) {
    .ww-blog-intro-title {
        font-size: 32px !important;
    }
    .ww-blog-header h2 {
        font-size: 30px !important;
    }
}

/* Pro mobilní telefony */
@media (max-width: 600px) {
    .ww-blog-intro-title {
        font-size: 25px !important;
        margin-bottom: 15px;
    }
    .ww-blog-header h2 {
        font-size: 23px !important;
    }
    .ww-blog-intro-text {
        font-size: 15px !important; /* Lehce zmenšený i podnadpis pro lepší čitelnost */
    }
}
/* ==========================================================================
   DOKONALÉ ZAROVNÁNÍ VLASTNÍCH KARET BLOGU (.ww-blog-card)
   ========================================================================== */

/* 1. Samotná karta se natáhne přesně podle té nejvyšší v řadě */
.ww-blog-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

/* 2. Obsahová část vyplní celou zbylou výšku */
.ww-blog-card-content {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    height: 100% !important;
}

/* 3. Nadpis zafixujeme PŘESNĚ na 3 řádky (i když má jen 2, místo mu zůstane) */
.ww-blog-card-content h3,
.ww-blog-card-content h4,
.ww-blog-card-content .ww-blog-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important; /* Ořízne na 3 řádky a přidá ... */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    line-height: 1.4em !important;
    min-height: 4.2em !important; /* 3 x 1.4 = fixní místo pro 3 řádky */
    margin-bottom: 15px !important;
}

/* 4. Šedý text (perex) zafixujeme na 3 řádky (kdyby náhodou přesáhl) */
.ww-blog-card-content p {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
}

/* 5. Odtlačí úplně poslední prvek ("Číst dále") na absolutní dno karty */
.ww-blog-card-content > :last-child {
    margin-top: auto !important;
    display: inline-block !important;
}
/* ==========================================================================
   VIZUÁLNÍ SJEDNOCENÍ FOTEK BLOGU (Elegantní CSS filtr a Hover efekt)
   Filtr se používá jen na zařízeních s myší. Na mobilu (bez najetí myší)
   by fotky zůstaly trvale ztmavené, proto tam zůstávají v původních barvách.
   ========================================================================== */

.ww-blog-card img {
    transition: all 0.5s ease-in-out !important;
    /* Pojistka pro hladké vykreslování přiblížení */
    backface-visibility: hidden !important;
    transform: translateZ(0) !important;
}

@media (hover: hover) and (pointer: fine) {
    /* Výchozí stav: ztlumení sytosti, lehké ztmavení a jemný hřejivý závoj */
    .ww-blog-card img {
        filter: grayscale(50%) brightness(75%) sepia(30%) !important;
    }

    /* Při najetí myší (na celou kartu): Fotka se plynule rozzáří a lehce přiblíží */
    .ww-blog-card:hover img {
        filter: grayscale(0%) brightness(100%) sepia(0%) !important;
        transform: scale(1.06) !important;
    }
}

/* Zajištění, aby se zvětšená fotka nevylila ven přes zakulacené rohy karty */
.ww-blog-card .ww-blog-card-image,
.ww-blog-card .ww-blog-image-wrapper {
    overflow: hidden !important;
    /* Zaoblené jen horní rohy (dole navazuje text karty) */
    border-radius: var(--radius-prvku) var(--radius-prvku) 0 0 !important;
}
/* ==========================================================================
   VĚTŠÍ A VYŠŠÍ FOTKY V PŘEHLEDU BLOGU (Zrušení oříznutí)
   ========================================================================== */

/* 1. Obal fotky má pevný poměr stran 16 : 10 (výška podle šířky) – stejný u karet s fotkou i bez ní */
.ww-blog-card .ww-blog-card-image,
.ww-blog-card .ww-blog-image-wrapper {
    aspect-ratio: 16 / 10 !important;
    height: auto !important;
}

/* 2. Donutíme samotnou fotku, aby tento nový, vyšší prostor vyplnila a vycentrovala se */
.ww-blog-card img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 20% !important; /* Mírně posune ohnisko nahoru, aby to neřezalo hlavy */
}
/* Logo v náhledu článku bez obrázku se nemá roztahovat ani ořezávat */
.ww-blog-card .ww-blog-placeholder-img img {
    width: 45% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center !important;
}

/* ==========================================================================
   MEGA MENU DESIGN (Kontejner z vlastní administrace)
   ========================================================================== */

/* 1. Hlavní rozbalovací krabice (Zaoblení a stín) */
.ww-mega-menu-container {
    background-color: #ffffff;
    border-radius: 20px !important; /* Luxusní zaoblení jako na blogu */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08) !important; /* Jemný padající stín */
    border: 1px solid rgba(188, 146, 106, 0.1); /* Extrémně nenápadná zlatavá linka */
    padding: 20px !important;
    overflow: hidden; /* Aby vnitřní prvky nepřetékaly přes kulaté rohy */

    /* Plynulá animace zobrazení (pokud už nějakou nemáš v JS) */
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* 2. Hover efekt pro jednotlivé bloky uvnitř (Elementor sloupce) */
/* (Předpokládám standardní strukturu, kterou Elementor uvnitř shortcodu vygeneruje) */
.ww-mega-menu-container .elementor-column-wrap,
.ww-mega-menu-container .elementor-widget-wrap {
    border-radius: 15px;
    transition: background-color 0.3s ease, transform 0.3s ease;
    cursor: pointer;
    padding: 15px; /* Vytvoří dýchací prostor pro kliknutí */
}

/* Po najetí myší na konkrétní blok v menu (např. "O nás") */
.ww-mega-menu-container .elementor-column-wrap:hover,
.ww-mega-menu-container .elementor-widget-wrap:hover {
    background-color: #fcf9f5 !important; /* Velmi jemná pískovo-béžová barva */
    transform: translateY(-2px); /* Mírné nadskočení bloku */
}

/* Po najetí myší se ikonka zbarví do vaší zlaté */
.ww-mega-menu-container .elementor-widget-wrap:hover i,
.ww-mega-menu-container .elementor-widget-wrap:hover svg {
    color: var(--gold-ink, #8A6440) !important;
    transform: scale(1.1);
    transition: all 0.3s ease;
}
/* ==========================================================================
   ŽIVÉ A KOMPAKTNÍ MEGA MENU (Interaktivní hover efekty)
   ========================================================================== */
.ww-mega-menu-grid {
    max-width: 950px !important;
    margin: 0 auto !important;
    padding: 10px !important;
}
.ww-menu-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 20px 15px !important;
    text-decoration: none !important;
    border-radius: 12px !important;
    background: transparent !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}
.ww-menu-item i {
    font-size: 26px !important;
    color: var(--gold-ink, #8A6440) !important;
    margin-bottom: 12px !important;
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.ww-menu-item h4 {
    color: var(--gold-ink, #8A6440) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    transition: color 0.3s ease !important;
}
.ww-menu-item p {
    font-size: 13px !important;
    color: #1A1C20 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    opacity: 0.8 !important;
    transition: opacity 0.3s ease !important;
}

/* --- MAGIE PŘI NAJETÍ MYŠÍ (HOVER) --- */
.ww-menu-item:hover {
    background-color: #fcf9f5 !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 24px rgba(188, 146, 106, 0.12) !important;
}
.ww-menu-item:hover i {
    transform: scale(1.2) translateY(-2px) !important;
    color: var(--gold-ink-hover, #6B4C2F) !important;
}
.ww-menu-item:hover h4 {
    color: var(--gold-ink-hover, #6B4C2F) !important;
}
.ww-menu-item:hover p {
    opacity: 1 !important;
}

/* ==========================================================================
   10. VÝPISY ČLÁNKŮ (rubrika, archiv, hledání, blog) A STRÁNKA 404
   Šablony archive.php, search.php, home.php, index.php, 404.php a template-parts/.
   Karty jsou stejné jako karty blogu na úvodní stránce (.ww-blog-card).
   ========================================================================== */
.ww-vypis { padding-bottom: 40px; }
/* Výchozí odsazení pod pevnou hlavičkou – přesnou hodnotu dopočítá skript hlavičky (.ww-blog-intro-section). */
.ww-vypis-hlavicka { padding-top: 150px; margin-bottom: 44px; text-align: center; }
.ww-vypis-hlavicka h1.ww-vypis-nadpis { margin: 0; font-family: inherit; font-size: 42px; line-height: 1.2; font-weight: 700; letter-spacing: normal; text-transform: none; color: var(--soft-black); overflow-wrap: anywhere; }
.ww-vypis-popis { max-width: 760px; margin: 18px auto 0; font-size: 17px; line-height: 1.7; color: #4A4D54; }
.ww-vypis-popis p { margin: 0 0 12px; }
.ww-vypis-popis p:last-child { margin-bottom: 0; }
.ww-vypis-pocet { margin: 14px 0 0; font-size: 15px; color: #4A4D54; }
.ww-vypis-hlavicka .ww-hledani { margin-top: 22px; }

/* Mřížka karet: 3 sloupce (pod 992 px 2, pod 600 px 1). Karty v řadě mají stejnou výšku,
   jedna karta se nikdy neroztáhne přes celou šířku. */
.ww-vypis-mrizka { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; align-items: stretch; }
.ww-vypis-mrizka > .ww-blog-card { flex: none !important; width: auto !important; height: 100% !important; }
.ww-blog-card h2.ww-blog-title { font-size: 18px; font-weight: 700; color: var(--soft-black); margin: 0 0 12px; line-height: 1.4; }
.ww-blog-card:hover h2.ww-blog-title { color: var(--gold-ink); }
.ww-vypis-prazdny { max-width: 640px; margin: 0 auto; padding: 40px 30px; background: var(--pure-white); border-radius: var(--radius-prvku); box-shadow: var(--luxusni-stin); text-align: center; }
.ww-vypis-prazdny p { margin: 0 0 22px; font-size: 17px; }
@media (max-width: 992px) {
    .ww-vypis-mrizka { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; }
    .ww-vypis-hlavicka { padding-top: 110px; }
    .ww-vypis-hlavicka h1.ww-vypis-nadpis { font-size: 32px; }
}
@media (max-width: 600px) {
    .ww-vypis-mrizka { grid-template-columns: minmax(0, 1fr); }
    .ww-vypis-hlavicka h1.ww-vypis-nadpis { font-size: 28px; }
}

/* Stránkování: Předchozí / Další a vynechané stránky (…) */
.ww-pagination { flex-wrap: wrap; }
.ww-pagination .page-numbers.dots,
.ww-pagination .page-numbers.dots:hover { background: transparent; border-color: transparent; color: var(--soft-black); }

/* Vyhledávací formulář (stránka 404, výsledky hledání) */
.ww-hledani { display: flex; gap: 10px; width: 100%; max-width: 560px; margin: 0 auto; }
.ww-hledani-pole { flex: 1 1 auto; min-width: 0; padding: 14px 18px; border: 1px solid #DCD3C8; border-radius: var(--radius-prvku); background: var(--pure-white); font: inherit; font-size: 16px; color: var(--soft-black); }
.ww-hledani-pole:focus { outline: 2px solid var(--gold-ink); outline-offset: 1px; border-color: var(--gold-ink); }
.ww-hledani .ww-hledani-tlacitko { padding: 14px 26px; border: 0; font-family: inherit; box-shadow: none; }
.ww-hledani .ww-hledani-tlacitko:hover { transform: none; }
@media (max-width: 480px) { .ww-hledani { flex-direction: column; } }

/* Stránka 404 */
.ww-stranka-404 { text-align: center; }
.ww-404-kod { margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-ink); }
.ww-404-obsah { max-width: 640px; margin: 0 auto; }
.ww-404-text { margin: 0 0 28px; font-size: 18px; line-height: 1.6; }
.ww-404-pokracovat { margin: 34px 0 16px; font-size: 15px; color: #4A4D54; }
.ww-404-odkazy { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.ww-404-odkazy .ww-btn { padding: 12px 24px; }

/* ==========================================================================
   OMEZENÍ POHYBU (uživatelé, kteří mají v systému vypnuté animace)
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .ww-btn, .ww-benefit-card, .ww-blog-card, .ww-blog-card img, .ww-carousel-slide, .ww-carousel-slide img,
    .ww-slide-caption, .ww-menu-item, .ww-menu-item i, .registrace::after, .ww-auth-card {
        transition: none !important;
    }
    .ww-btn-primary:hover, .ww-btn-outline:hover, .ww-benefit-card--odkaz:hover, .ww-benefit-card--odkaz:focus-within,
    .ww-blog-card:hover, .ww-blog-card:hover img, a.ww-linked-slide:hover img, a.ww-linked-slide:hover .ww-slide-caption,
    .ww-menu-item:hover, .ww-menu-item:hover i, .ww-auth-card:hover {
        transform: none !important;
    }
}