/* Marathon Model – main-banners.css (šablona Merkur) */

/* ---------- Carousel a TOP banner ---------- */
.homepage-box.before-carousel {
    background: var(--mm-bg);
}

#carousel,
#carousel .carousel-inner,
.next-to-carousel-banners .banner-wrapper,
.next-to-carousel-banners .banner-wrapper img {
    border-radius: var(--mm-radius);
    overflow: hidden;
}

/* Hover: rámeček stojí na místě (stejná šířka, bez stínu), uvnitř se jen pomalu přiblíží fotka.
   clip-path drží zaoblené rohy i během animace (overflow: hidden je v Chromu při transformaci ztrácí). */
html body #carousel,
html body .next-to-carousel-banners .banner-wrapper {
    clip-path: inset(0 round var(--mm-radius));
}

html body #carousel,
html body #carousel:hover,
html body .carousel-inner:hover,
html body .next-to-carousel-banners .banner-wrapper,
html body .next-to-carousel-banners .banner-wrapper:hover {
    box-shadow: none;
    transform: none;
}

html body #carousel img,
html body .next-to-carousel-banners .banner-wrapper img {
    display: block;
    transition: transform 1.2s cubic-bezier(.2, .7, .2, 1);
}

html body #carousel:hover .item.active img,
html body .next-to-carousel-banners .banner-wrapper:hover img {
    transform: scale(1.015);
}

@media (prefers-reduced-motion: reduce) {
html body #carousel img,
html body .next-to-carousel-banners .banner-wrapper img { transition: none; }
}

/* ---------- TOP banner s texty z administrace (např. výstavy) ----------
   Obrázek je jen pozadí bez textu. Nadpis, text a tlačítko se píšou v adminu
   (Návrhář šablon nebo Bannery) do polí Název banneru / Text banneru / Text odkazu
   a Merkur je vypíše do .extended-banner-texts. Merkur jim dává bílý podklad,
   pevnou výšku a posun top, proto !important. Velikosti v cqw = podíl šířky
   banneru, takže to vypadá stejně na desktopu i na mobilu.
   Platí JEN pro banner „MM TOP – Přijďte se podívat“ (banner5 v adminu,
   na webu data-ec-promo-id="72"). Ostatní bannery zůstávají beze změny. */
html body .next-to-carousel-banners .banner-wrapper a[data-ec-promo-id="72"] {
    position: relative;
    display: block;
    container-type: inline-size;
}

html body .next-to-carousel-banners a[data-ec-promo-id="72"] .extended-banner-texts {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 6cqw 8cqw 8.5cqw !important;
    background: none !important;
    text-align: left !important;
    transform: none !important;
    pointer-events: none;
}

html body .next-to-carousel-banners a[data-ec-promo-id="72"] .extended-banner-texts > span {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
}

/* Nadpis: klient píše normálně, velká písmena dělá CSS */
html body .next-to-carousel-banners a[data-ec-promo-id="72"] .extended-banner-title {
    display: block !important;
    max-width: 62cqw !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    font-family: var(--mm-font-head) !important;
    font-size: 9cqw !important;
    font-weight: 800 !important;
    /* 1.1 = co nejtěsněji, ale čárky a háčky nad velkými písmeny (Ř, Ď, Í, Ž)
       se ještě nedotýkají řádku nad nimi (1.05 už se dotýká) */
    line-height: 1.1 !important;
    letter-spacing: -.02em !important;
    text-transform: uppercase !important;
    color: var(--mm-navy) !important;
}

/* Kdy a kde akce je */
html body .next-to-carousel-banners a[data-ec-promo-id="72"] .extended-banner-text {
    display: block !important;
    max-width: 58cqw !important;
    margin: 2.5cqw 0 0 !important;
    padding: 0 !important;
    background: none !important;
    font-family: var(--mm-font-body) !important;
    font-size: 3.9cqw !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    color: var(--mm-navy) !important;
}

/* Tlačítko vlevo dole jako PROZKOUMAT v carouselu */
html body .next-to-carousel-banners a[data-ec-promo-id="72"] .extended-banner-link {
    display: inline-block !important;
    height: auto !important;
    min-height: 0 !important;
    margin: auto 0 0 !important;
    padding: 3cqw 6.5cqw !important;
    border: 0 !important;
    border-radius: 99px !important;
    background: var(--mm-lime) !important;
    font-family: var(--mm-font-head) !important;
    font-size: 5cqw !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    color: var(--mm-navy) !important;
}

/* Při najetí myší tlačítko neztmavne (přání klienta), zůstává limetkové */
html body .next-to-carousel-banners .banner-wrapper:hover a[data-ec-promo-id="72"] .extended-banner-link,
html body .next-to-carousel-banners a[data-ec-promo-id="72"]:hover .extended-banner-link {
    background: var(--mm-lime) !important;
    color: var(--mm-navy) !important;
}
