/* ============================================================================
   /free-spiny-dnes — hlavička denního vydání + jedna široká tabulka nabídek
   ----------------------------------------------------------------------------
   Načítá se automaticky přes header.php (page-<route>.css), tedy jako POSLEDNÍ
   page stylesheet, hned před core/perf.css. Díky tomu tu stačí normální
   specificita a nikde není potřeba !important.

   Co tenhle soubor řeší (a proč):
     1. Navbar. Kapsle navigace je na desktopu vysoká ~133 px, ale .main-content
        odsazuje obsah jen o --nav-height (80 px). Základní .landing-hero přidá
        64 px, takže první řádek čipů začínal 3 px pod rámečkem navigace, tedy
        opticky useknutý. Hero si proto odsazení počítá sám.
     2. Prázdno v hero. Původně to byl jen řádek čipů a H1, napravo 700 px
        nicoty. Teď je vpravo číselná lišta, což je zároveň to, kvůli čemu na
        tuhle stránku lidi chodí (kolik nabídek dnes platí).
     3. Díra v Tokyo kartě. Karty se natahovaly na stejnou výšku a uvnitř té
        nižší vznikla ~200px mezera mezi štítky a tlačítkem. Vnitřek karet je
        schválený a nedotčený, mění se JEN rámování na úrovni řádku: výška
        karty, svislé zarovnání dvojice a poměr sloupců (viz sekce 5).
     4. Tabulka. Čísla vpravo s tabulárními číslicemi, logo v buňce názvu,
        hlavička normálním řezem místo drobných proložených verzálek.

   Povrch všude stejný jako u bonusové karty:
     linear-gradient(160deg, rgba(20,15,30,.80), rgba(10,8,15,.95))
     1px var(--alpha-white-5), var(--radius-card), bez klidového stínu.
   ============================================================================ */

/* base.css dává display:flex všem <section>, blokové obaly to musí přebít.
   POZOR: sem patří JEN obaly, které mají zůstat blokové. .fsd-hero-grid
   a .fsd-rail jsou mřížky — kdyby se sem připsaly, přepíše se jim display
   a hero se rozpadne na tři pruhy pod sebou (přesně to se stalo v první verzi). */
.fsd-page .fsd-hero-inner,
.fsd-page .fsd-partners,
.fsd-page .fsd-intro-main,
.fsd-page .fsd-offers {
    display: block;
}

/* ============================================================================
   1. HERO — hlavička denního vydání
   ============================================================================ */
.landing-hero.fsd-hero {
    /* .main-content odsadí 80 px, navigační kapsle končí na ~133 px od horní
       hrany stránky. Tohle odsazení navíc dá pod navigací ~55 px vzduchu. */
    padding: 52px 0 34px;
    overflow: visible;
}

/* Jedna značková záře shora, žádný opakující se vzor za textem. */
.landing-hero.fsd-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 62% 78% at 22% -10%, rgba(0, 245, 255, 0.10), transparent 62%),
        radial-gradient(ellipse 48% 70% at 88% -14%, rgba(145, 71, 255, 0.12), transparent 66%);
    pointer-events: none;
}

.landing-hero.fsd-hero::after {
    left: 0;
    right: 0;
    background: linear-gradient(90deg, var(--alpha-cyan-25), rgba(145, 71, 255, 0.28) 45%, transparent 92%);
}

.fsd-hero-inner { position: relative; z-index: 1; }

/* ── Řádek čipů čerstvosti ─────────────────────────────────────────────── */
.fsd-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
}

.landing-badge.fsd-badge {
    padding: 7px 15px;
    border-radius: var(--radius-pill);
    font-family: var(--font-accent, 'Exo 2', sans-serif);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--alpha-white-8);
    color: rgba(255, 255, 255, 0.72);
}

/* Datum je hlavní sdělení celé stránky, takže jediný plný čip. */
.landing-badge.fsd-badge--date {
    gap: 8px;
    background: linear-gradient(135deg, rgba(0, 245, 255, 0.16), rgba(145, 71, 255, 0.16));
    border-color: var(--alpha-cyan-30);
    color: #fff;
}

.fsd-badge--date time {
    color: var(--neon-cyan);
    font-weight: 800;
}

/* ── H1 vlevo, číselná lišta vpravo ────────────────────────────────────── */
.fsd-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.52fr) minmax(0, 1fr);
    gap: 30px 52px;
    align-items: center;
}

.landing-hero .fsd-h1 {
    margin: 0;
    font-size: clamp(1.95rem, 3.05vw, 2.85rem);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -0.02em;
    color: var(--text-primary);
}

/* ── Číselná lišta ─────────────────────────────────────────────────────── */
.fsd-rail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 1px;
    border: 1px solid var(--alpha-white-8);
    border-radius: var(--radius-card);
    background: var(--alpha-white-8);
    overflow: hidden;
}

.fsd-rail-cell {
    --acc: var(--neon-cyan);
    position: relative;
    display: block;
    padding: 18px 20px 17px;
    background: linear-gradient(160deg, rgba(20, 15, 30, 0.88), rgba(10, 8, 15, 0.97));
}

.fsd-rail-cell--hot { --acc: var(--neon-magenta); }

.fsd-rail-cell::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--acc), transparent 90%);
    opacity: 0.75;
}

/* Číslo je plné bílé, jednotka nese barvu. Žádný gradient mizející do bílé. */
.fsd-rail-v {
    display: block;
    font-family: var(--font-accent, 'Exo 2', sans-serif);
    font-size: clamp(1.55rem, 2.1vw, 2rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.fsd-rail-v i {
    font-style: normal;
    color: var(--acc);
}

.fsd-rail-v--code {
    color: var(--neon-cyan);
    letter-spacing: 0.06em;
}

.fsd-rail-k {
    display: block;
    margin-top: 7px;
    font-size: 0.84rem;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.66);
}

/* ============================================================================
   2. HLAVIČKY SEKCÍ
   ============================================================================ */
.fsd-page .fsd-sec-head {
    align-items: baseline;
    gap: 14px;
    margin-bottom: 10px;
}

.fsd-page .fsd-sec-head h2 {
    margin: 0;
    font-size: clamp(1.45rem, 2.1vw, 2rem);
    letter-spacing: -0.01em;
}

.fsd-sec-note {
    margin: 0 0 26px;
    max-width: 78ch;
    font-size: 0.96rem;
    line-height: 1.65;
    color: var(--text-secondary);
}

/* ============================================================================
   3. LIMITOVANÉ AKCE (renderuje se jen když nějaká dnes běží)
   ============================================================================ */
.fsd-limited-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 24px;
    margin-bottom: 8px;
}

.fsd-limited-grid > * { min-width: 0; }

/* ============================================================================
   4. ÚVOD: postup vlevo, panel čerstvosti vpravo
   ============================================================================ */
.fsd-intro {
    gap: 44px;
    margin-bottom: 38px;
}

.fsd-lede {
    margin: 0 0 30px;
    max-width: none;
    font-size: 1.04rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

.fsd-steps-h { margin-bottom: 16px; }
.fsd-steps-h h2 { font-size: 1.28rem; }

/* Kroky jako karty: chip s číslem má kolem sebe povrch, ne holé pozadí stránky. */
.fsd-steps { margin: 0; max-width: none; }

.fsd-steps li {
    padding: 17px 22px 17px 62px;
    margin-bottom: 12px;
    font-size: 1rem;
    line-height: 1.65;
    border-color: var(--alpha-white-8);
    transition: border-color 0.2s ease;
}

.fsd-steps li:last-child { margin-bottom: 0; }
.fsd-steps li:hover { border-color: var(--alpha-cyan-20); }
.fsd-steps li strong { color: var(--text-primary); }

.fsd-steps li::before {
    left: 18px;
    top: 17px;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-tile);
    font-size: 0.9rem;
    font-weight: 800;
}

/* Panel faktů: azurový akcent a o něco vzdušnější řádky, ať výškou odpovídá
   sloupci s kroky vedle (jinak pod ním zůstane mrtvý kus sloupce). */
.fsd-facts {
    --acc: var(--neon-cyan);
    padding: 24px 26px;
}

.fsd-facts .ed-facts-title { margin-bottom: 16px; }
.fsd-facts .ed-facts-row { padding: 13.5px 0; }
.fsd-facts .ed-facts-k { font-size: 0.84rem; color: rgba(255, 255, 255, 0.6); }
.fsd-facts .ed-facts-v { font-size: 0.98rem; }
.fsd-facts .ed-facts-v time { color: var(--neon-cyan); }

/* ============================================================================
   5. PARTNERSKÁ DVOJICE — jen rámování, vnitřek karet je schválený
   ----------------------------------------------------------------------------
   Odkud se ta ~200px díra brala: .bp-hero-row > .bonus-card-h má height:100 %
   (obě karty se natáhnou na výšku té vyšší) a uvnitř karty má .bonus-content-h
   flex:1, takže všechno volné místo spolkne obsahový blok a CTA i s datem se
   odtlačí ke spodku. V nižší kartě tím vznikne prázdno mezi štítky a tlačítkem.

   Řeší se to čistě na úrovni řádku, do karty se nesahá:
     a) height:auto — karta je vysoká přesně tak, jak vyžaduje její obsah,
        takže uvnitř nezbyde žádné volné místo, které by se dalo nafouknout;
     b) align-items:center — nižší karta se vůči vyšší vycentruje, takže se
        rozdíl rozdělí souměrně nad a pod ni místo jedné díry uprostřed;
     c) poměr sloupců není 50/50. Tokyo má tři dlouhé řádky, dědek čtyři krátké
        plus pruh s promo kódem. Užší sloupec pro Tokyo a širší pro dědka
        rozdíl výšek srazí na minimum.
   ============================================================================ */
.fsd-partners { margin: 0 0 34px; }

.fsd-partners .bp-hero-row {
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    gap: 26px;
    /* start, ne center: při centrování se nižší karta posunula dolů a obě
       začínaly na jiné výšce, což vypadalo rozhozeně. Takhle mají obě stejnou
       horní hranu a rozdíl výšky zůstane dole, kde neruší. */
    align-items: stretch;
    margin-bottom: 0;
}


.fsd-partners .bp-hero-row .bonus-tags-h { margin-top: 16px; }

@media (max-width: 900px) {
    .fsd-partners .bp-hero-row { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}

/* ============================================================================
   6. TABULKA NABÍDEK
   ============================================================================ */
.fsd-offers { margin: 0; }

.fsd-table { table-layout: auto; }

/* Hlavička normálním řezem. Drobné proložené verzálky nad každým sloupcem
   dělaly z tabulky zeď, ve které se nedalo najít, kde začíná obsah. */
.fsd-table thead th {
    padding: 15px 22px;
    font-family: var(--font-accent, 'Exo 2', sans-serif);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-transform: none;
    color: rgba(0, 245, 255, 0.88);
    background: rgba(0, 245, 255, 0.045);
    border-bottom: 1px solid rgba(0, 245, 255, 0.16);
}

.fsd-table td { padding: 17px 22px; }

/* ── Sloupce ───────────────────────────────────────────────────────────── */
.fsd-table th.fsd-c-rank,
.fsd-table td.fsd-c-rank { width: 62px; text-align: center; }

.fsd-table th.fsd-c-name,
.fsd-table td.fsd-c-name { width: 210px; }

.fsd-table th.fsd-c-bonus,
.fsd-table td.fsd-c-bonus { width: 240px; text-align: right; }

.fsd-table th.fsd-c-promo,
.fsd-table td.fsd-c-promo { width: 132px; }

.fsd-table th.fsd-c-cta,
.fsd-table td.fsd-c-cta { width: 214px; }

/* ── Pořadí ────────────────────────────────────────────────────────────── */
.fsd-rank {
    display: inline-block;
    font-family: var(--font-accent, 'Exo 2', sans-serif);
    font-size: 0.92rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.58);
}

.fsd-rank--top { color: var(--neon-cyan); }

/* Doporučené casino = azurový nádech řádku. Magenta zůstává exkluzivním partnerům. */
.fsd-table tr.fsd-row--featured { --acc: var(--neon-cyan); }

/* ── Název casina ──────────────────────────────────────────────────────── */
.fsd-table .fsd-name {
    gap: 12px;
    font-size: 1rem;
    line-height: 1.25;
}

/* Logo dostane vlastní dlaždici, jinak různě velká a různě průhledná loga
   rozhoupou levý okraj sloupce. */
.fsd-logo {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: var(--radius-tile);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--alpha-white-8);
}

.fsd-table .fsd-logo img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

/* ── Bonus: číslo vpravo, tabulární číslice ────────────────────────────── */
.fsd-table td.fsd-c-bonus { font-variant-numeric: tabular-nums; }

.fsd-bonus {
    display: block;
    color: var(--neon-cyan);
    font-family: var(--font-accent, 'Exo 2', sans-serif);
    font-weight: 800;
    font-size: 1.02rem;
    line-height: 1.3;
}

/* Signál čerstvosti u každého řádku, ne jen v hlavičce stránky. */
.fsd-avail {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 7px;
    font-size: 0.8rem;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.62);
}

.fsd-avail::before {
    content: '';
    flex: none;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--neon-cyan);
    box-shadow: 0 0 8px rgba(0, 245, 255, 0.55);
}

/* ── Co získáš ─────────────────────────────────────────────────────────── */
.fsd-table td.fsd-c-desc { color: var(--text-secondary); }

.fsd-desc-main {
    display: block;
    max-width: 62ch;
    font-size: 0.96rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.86);
}

.fsd-sub {
    display: block;
    margin-top: 5px;
    max-width: 62ch;
    font-size: 0.95rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.66);
}

/* ── Promo kód / CTA ───────────────────────────────────────────────────── */
/* .ed-t-muted má v editorial.css 38% bílou, což je na buňku, kterou má člověk
   opravdu přečíst, málo. Tady jen zesvětlení, nic víc. */
.fsd-table .ed-t-muted { font-size: 0.92rem; color: rgba(255, 255, 255, 0.55); }

.fsd-table .fsd-c-cta .rsp-btn {
    display: block;
    width: 100%;
    text-align: center;
}

/* ============================================================================
   7. PRŮVODCE
   ============================================================================ */
.fsd-guide .ed-split { margin-bottom: 8px; }

.fsd-pair > div > h2:first-child { margin-top: 0; }
.fsd-pair p { max-width: none; }

/* Textový sloupec je krátký, karta se seznamem vysoká. Užší text a širší
   karta obě strany výškově srovnají, takže vedle textu nezůstane mrtvý pruh. */
.fsd-rhythm { grid-template-columns: minmax(0, 1fr) minmax(0, 1.62fr); }

.fsd-aside-card { --acc: var(--neon-purple); }
.fsd-aside-card .ed-list { margin-bottom: 0; max-width: none; }
.fsd-aside-card .ed-list li { font-size: 0.96rem; line-height: 1.6; }

.fsd-rhythm .ed-list { columns: 2; column-gap: 34px; }
.fsd-rhythm .ed-list li { break-inside: avoid; margin-bottom: 15px; }
.fsd-rhythm .ed-list li:last-child { margin-bottom: 0; }

/* Odkazy v průvodci. Guard je povinný, jinak by pravidlo přebilo affiliate
   tlačítka uvnitř textu (azurový podtržený text na azurovém gradientu). */
.fsd-guide a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]) {
    color: var(--neon-cyan);
    text-decoration: underline;
    text-decoration-color: rgba(0, 245, 255, 0.35);
    text-underline-offset: 3px;
}

.fsd-guide a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):hover {
    color: var(--text-primary);
    text-decoration-color: var(--neon-cyan);
}

/* Varovný pruh: čtyři kompaktní karty přes celou šířku. */
.fsd-warn { margin: 6px 0 10px; }
.fsd-warn .ed-card-text { font-size: 0.95rem; }

.fsd-faq { margin-bottom: 4px; }

/* ============================================================================
   8. ROZCESTNÍK + DISCLAIMER
   ============================================================================ */
.fsd-links-sec { padding-top: 6px; }
.fsd-links .ed-card-title { font-size: 1rem; }
.fsd-links .ed-card-text { font-size: 0.92rem; }

.fsd-disclaimer { font-size: 0.86rem; line-height: 1.7; }

/* ============================================================================
   9. RESPONZIVITA
   ============================================================================ */
/* Pod 1400 px se H1 do svého sloupce nevejde na jeden řádek a zbyl by v něm
   osamocený letopočet. Lišta proto jde pod nadpis a oba dostanou plnou šířku. */
@media (max-width: 1400px) {
    .fsd-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 26px; }
    .fsd-rail { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
}

@media (max-width: 1240px) {
    .fsd-rhythm { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }
}

@media (max-width: 1080px) {
    .fsd-table th.fsd-c-name, .fsd-table td.fsd-c-name { width: 180px; }
    .fsd-table th.fsd-c-bonus, .fsd-table td.fsd-c-bonus { width: 200px; }
    .fsd-table th.fsd-c-cta, .fsd-table td.fsd-c-cta { width: 186px; }
}

@media (max-width: 980px) {
    .fsd-intro { gap: 26px; }
    .fsd-rhythm { grid-template-columns: minmax(0, 1fr); }
    .fsd-rhythm .ed-list { columns: 1; }
}

@media (max-width: 768px) {
    .landing-hero.fsd-hero { padding: 48px 0 26px; }
    .fsd-badges { gap: 8px; margin-bottom: 16px; }
    .landing-badge.fsd-badge { font-size: 0.74rem; padding: 6px 12px; }
    .fsd-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* Lichý počet buněk by ve dvousloupci nechal dole prázdné okno (svítilo
       skrz pozadí mřížky). Poslední buňka proto v takovém případě zabere
       celý řádek. */
    .fsd-rail-cell:last-child:nth-child(odd) { grid-column: span 2; }
    .fsd-rail-cell { padding: 15px 16px 14px; }
    .fsd-page .fsd-sec-head { flex-wrap: wrap; gap: 10px; }
    .fsd-steps li { padding: 15px 18px 15px 56px; }
    .fsd-steps li::before { left: 15px; top: 15px; width: 28px; height: 28px; }
}

/* Na mobilu se z řádků tabulky stanou bloky. Vodorovné rolování tabulky by
   schovalo CTA úplně mimo obrazovku, a to je na nabídkové stránce to poslední,
   co chceme. Žádný obsah se neskrývá, jen se přeskládá pod sebe. */
@media (max-width: 720px) {
    .fsd-table thead { display: none; }
    .fsd-table,
    .fsd-table tbody,
    .fsd-table tr,
    .fsd-table td { display: block; width: 100%; }

    .fsd-table tr {
        padding: 18px 18px 20px;
        border-bottom: 1px solid var(--alpha-white-5);
    }

    .fsd-table tr:last-child { border-bottom: none; }
    .fsd-table td { padding: 0; border-bottom: none; }

    /* Pevné šířky sloupců by se v blokovém režimu propsaly do zebry a udělaly
       z pozadí řádku roztřepené obdélníky. */
    .fsd-table td.fsd-c-rank,
    .fsd-table td.fsd-c-name,
    .fsd-table td.fsd-c-bonus,
    .fsd-table td.fsd-c-promo,
    .fsd-table td.fsd-c-desc { width: 100%; }

    .fsd-table td.fsd-c-rank { text-align: left; margin-bottom: 6px; }
    .fsd-table td.fsd-c-bonus { text-align: left; margin-top: 10px; }
    .fsd-table td.fsd-c-desc { margin-top: 10px; }
    .fsd-table td.fsd-c-promo { margin-top: 12px; }

    .fsd-table th.fsd-c-cta,
    .fsd-table td.fsd-c-cta { width: 100%; margin-top: 14px; }

    /* Zebra i partnerský nádech patří v blokovém režimu na CELÝ řádek. Na
       buňkách z toho byly vodorovné pruhy proložené mezerami, takže řádek
       vypadal jako rozsypaná mřížka obdélníků. */
    .fsd-table tbody tr:nth-child(even) td,
    .fsd-table tbody tr:hover td,
    .fsd-table tr.is-partner td { background: transparent; }

    .fsd-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.022); }

    .fsd-table tr.is-partner {
        background: color-mix(in srgb, var(--acc, var(--neon-cyan)) 7%, transparent);
    }

    .fsd-table tr.is-partner td:first-child { box-shadow: none; }
    .fsd-table tr.is-partner { box-shadow: inset 3px 0 0 var(--acc, var(--neon-cyan)); }

    .fsd-bonus { white-space: normal; }
    .fsd-desc-main, .fsd-sub { max-width: none; }
}

@media (max-width: 480px) {
    .fsd-rail { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================================
   10. OMEZENÝ POHYB
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
    .fsd-steps li { transition: none; }
}

/* Číselná lišta z hera odebrána, hero je teď jednosloupcový: nadpis a odznaky
   čerstvosti. Mřížka by po ní nechala prázdný pravý sloupec. */
.fsd-hero-grid { display: block; }
