/* Přepsání pozadí pouze pro tuto stránku (světle tyrkysová) */
body {
    background-color: #73cfb6 !important;
}

/* =========================================
   HLAVNÍ NADPIS A VRTAČKA
   ========================================= */
.sekce-dilna-hero {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px 20px 0px 20px;
    box-sizing: border-box;
    overflow: visible;
}

.dilna-nadpis-kontejner {
    display: flex;
    flex-direction: column;
    gap: 0px;
    width: fit-content;
    align-items: flex-start;
    position: relative;
}

.chvejici-se-text {
    height: 125px;
    width: auto;
    display: block;
    object-fit: contain;
    object-position: left center;
    will-change: transform;
    margin-bottom: -35px;
}

.radek-pepy {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-bottom: -70px;
    margin-top: -20px;
    z-index: 2;
    position: relative;
}

.radek-pepy .chvejici-se-text {
    height: 110px;
    margin-bottom: 0px;
}

.vrtacka-img {
    height: 300px;
    width: auto;
    transform: translate(12px, 100px);
    position: relative;
    overflow: visible;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent; 
    touch-action: manipulation;
}

/* =========================================
   ANIMACE ROTACE VRTÁKU (FRAME-BY-FRAME)
   ========================================= */
.vrtak-frame {
    opacity: 0;
    animation: stop-motion-vrtak 0.5s infinite;
}

/* Klasický chod */
.vrtak-1 { animation-delay: 0s; }
.vrtak-2 { animation-delay: 0.1s; }
.vrtak-3 { animation-delay: 0.2s; }
.vrtak-4 { animation-delay: 0.3s; }
.vrtak-5 { animation-delay: 0.4s; }

/* Obrácený chod po kliknutí */
.vrtacka-img.obraceny-chod .vrtak-1 { animation-delay: 0.4s; }
.vrtacka-img.obraceny-chod .vrtak-2 { animation-delay: 0.3s; }
.vrtacka-img.obraceny-chod .vrtak-3 { animation-delay: 0.2s; }
.vrtacka-img.obraceny-chod .vrtak-4 { animation-delay: 0.1s; }
.vrtacka-img.obraceny-chod .vrtak-5 { animation-delay: 0s; }

@keyframes stop-motion-vrtak {
    0%, 19.99% { opacity: 1; }
    20%, 100% { opacity: 0; }
}

/* =========================================
   SEKCE PODNADPIS
   ========================================= */
.sekce-dilna-podnadpis {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0 20px 20px 20px;
    box-sizing: border-box;
    margin-top: 110px;
    position: relative;
    z-index: 1;
}

.kontejner-podnadpis {
    text-align: center;
    color: #ffffff;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    max-width: 1180px;
    width: 100%;
}

.kontejner-podnadpis h2 {
    color: #ffffff;
    font-size: 38px;
    font-weight: 900;
    letter-spacing: 1px;
    margin: 0 0 10px 0;
    line-height: 1.25;
    text-transform: uppercase;
}

.kontejner-podnadpis .svaslitko {
    color: #ed1c24 !important;
    font-weight: 900;
    padding: 0 8px;
}

/* =========================================
   SEKCE TERMÍNY, KAŠPÁREK A TLAČÍTKO
   ========================================= */
.sekce-dilna-terminy {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0px 20px 20px 20px;
    box-sizing: border-box;
}

.kontejner-terminy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    max-width: 1180px;
    width: 100%;
}

.kasparek-obal {
    flex-shrink: 0;
}

.kasparek-img {
    height: 220px;
    width: auto;
    display: block;
}

.terminy-texty {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #000000;
}

.terminy-texty .velky-termin {
    color: #000000;
    font-size: 38px;
    font-weight: 900;
    letter-spacing: 1px;
    margin: 0 0 6px 0;
    line-height: 1.2;
    text-transform: uppercase;
}

.terminy-texty .rezervace-nadpis {
    color: #000000;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 1px;
    margin: 20px 0 4px 0;
    text-transform: uppercase;
}

.terminy-texty .rezervace-casy {
    color: #000000;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin: 0 0 20px 0;
}

.tlacitko-goout {
    display: inline-block;
    background-color: #ed1c24;
    color: #ffffff !important;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 14px 28px;
    border-radius: 8px;
    transition: transform 0.15s ease, background-color 0.15s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.tlacitko-goout:hover {
    background-color: #c9151c;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

/* =========================================
   SEKCE JEZDÍCÍ PILA
   ========================================= */
.sekce-dilna-pila {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 10px 20px 40px 20px;
    box-sizing: border-box;
    overflow: hidden;
}

.kontejner-pila {
    max-width: 1180px;
    width: 100%;
    position: relative;
    height: 160px;
}

.pila-pohyb {
    position: absolute;
    top: 0;
    left: 0;
    animation: rezani-pilou 4s ease-in-out infinite alternate;
}

.pila-pohyb svg {
    height: 160px;
    width: auto;
    display: block;
}

@keyframes rezani-pilou {
    0% {
        left: 100%;
        transform: translateX(-100%);
    }
    100% {
        left: 0%;
        transform: translateX(0%);
    }
}

/* =========================================
   SEKCE PROGRAM A ACADEMY TLAČÍTKO
   ========================================= */
.sekce-dilna-info {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px 20px 20px 20px;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
}

.kontejner-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    max-width: 1180px;
    width: 100%;
}

.seznam-prednosti {
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    text-align: left;
}

.seznam-prednosti li {
    color: #000000;
    font-size: 26px;
    font-weight: 900;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
    line-height: 1.25;
    position: relative;
    padding-left: 32px;
    text-transform: uppercase;
    text-align: left;
}

.seznam-prednosti li::before {
    content: "•";
    color: #000000;
    font-size: 40px;
    position: absolute;
    left: 0;
    top: -6px;
}

.academy-obal {
    flex-shrink: 0;
}

.tlacitko-academy {
    display: block;
    background-color: #ed1c24;
    color: #ffffff !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 1px;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    padding: 30px 40px;
    border-radius: 20px;
    transition: transform 0.15s ease, background-color 0.15s ease;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.tlacitko-academy:hover {
    background-color: #c9151c;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

/* =========================================
   SEKCE BOUCHAJÍCÍ KLADIVO
   ========================================= */
.sekce-dilna-kladivo {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px 20px 0px 20px; /* ZRUŠENA MEZERA DOLE (bylo 80px) */
    box-sizing: border-box;
    overflow: visible;
    position: relative;
    z-index: 2;
}

.kontejner-kladivo {
    max-width: 1180px;
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative;
}

.kladivo-animace {
    transform-origin: left bottom;
    animation: bouchani-kladiva 1.5s ease-in-out infinite;
}

.kladivo-animace svg {
    height: 180px;
    width: auto;
    display: block;
}

@keyframes bouchani-kladiva {
    0% { transform: translate(0, 0) rotate(0deg); }
    35% { transform: translate(-30px, -100px) rotate(-45deg); }
    45% { transform: translate(-30px, -100px) rotate(-45deg); }
    65% { transform: translate(0, 0) rotate(4deg); }
    75%, 100% { transform: translate(0, 0) rotate(0deg); }
}

/* =========================================
   SEKCE FOTOGALERIE (NEKONEČNÝ PÁS)
   ========================================= */
.sekce-dilna-galerie {
    width: 100%;
    padding: 0 0 80px 0;
    box-sizing: border-box;
    overflow: hidden;
}

.galerie-marquee {
    width: 100%;
    overflow: hidden;
    position: relative;
    mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}

.galerie-track {
    display: flex;
    width: max-content;
    animation: posuv-galerie 45s linear infinite;
    padding: 20px 0; 
}

.galerie-sada {
    display: flex;
    gap: 30px; 
    padding-right: 30px; 
}

.galerie-img {
    height: 250px;
    width: 250px;
    object-fit: cover; 
    border-radius: 20px; 
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    pointer-events: none;
    user-select: none;
}

/* Náklony fotografií */
.galerie-img:nth-child(even) { transform: rotate(3deg); }
.galerie-img:nth-child(odd)  { transform: rotate(-3deg); }
.galerie-img:nth-child(3n)   { transform: rotate(-5deg); }
.galerie-img:nth-child(4n)   { transform: rotate(4deg); }
.galerie-img:nth-child(5n)   { transform: rotate(-2deg); }

@keyframes posuv-galerie {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* =========================================
   SEKCE PARK 360
   ========================================= */
.sekce-dilna-park360 {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0px 20px 80px 20px;
    box-sizing: border-box;
}

.kontejner-park360 {
    text-align: center;
    width: 100%;
    max-width: 1180px;
}

.park360-img {
    width: 250px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* =========================================
   RESPONZIVITA PRO MOBILY
   ========================================= */
@media (max-width: 768px) {
    .sekce-dilna-hero { padding: 15px 15px 0px 15px; }
    .dilna-nadpis-kontejner { width: fit-content; align-items: flex-start; }
    .chvejici-se-text { height: 55px; margin-bottom: -15px; }
    
    .radek-pepy { gap: 0px; margin-bottom: -35px; margin-top: 0px; justify-content: flex-start; }
    .radek-pepy .chvejici-se-text { height: 50px; margin-bottom: 0px; }
    
    .vrtacka-img { height: 135px; transform: translate(5px, 45px); }
    .sekce-dilna-podnadpis { padding: 0 15px 15px 15px; margin-top: 65px; }
    
    .kontejner-podnadpis h2 { font-size: 18px; letter-spacing: 0.5px; margin-bottom: 6px; line-height: 1.3; }
    .sekce-dilna-terminy { padding: 0px 15px 15px 15px; }
    .kontejner-terminy { flex-direction: column; text-align: center; gap: 20px; }
    .kasparek-img { height: 150px; }
    
    .terminy-texty .velky-termin { font-size: 22px; margin-bottom: 4px; }
    .terminy-texty .rezervace-nadpis { font-size: 15px; margin-top: 14px; }
    .terminy-texty .rezervace-casy { font-size: 15px; margin-bottom: 16px; }
    .tlacitko-goout { font-size: 16px; padding: 12px 20px; width: 100%; box-sizing: border-box; }

    .sekce-dilna-pila { padding: 5px 15px 30px 15px; }
    .kontejner-pila { height: 110px; }
    .pila-pohyb svg { height: 110px; }

    .sekce-dilna-info { padding: 20px 15px 30px 15px; }
    .kontejner-info { flex-direction: column; gap: 30px; }
    
    .seznam-prednosti { text-align: left; width: 100%; }
    .seznam-prednosti li { font-size: 16px; padding-left: 22px; margin-bottom: 10px; text-align: left; }
    .seznam-prednosti li::before { font-size: 28px; top: -4px; }
    
    .tlacitko-academy { font-size: 18px; padding: 20px 30px; width: 100%; box-sizing: border-box; }

    .sekce-dilna-kladivo { padding: 10px 15px 0px 15px; } /* ZRUŠENA MEZERA DOLE NA MOBILU (bylo 30px) */
    .kladivo-animace svg { height: 120px; }

    /* Fotogalerie - Zmenšení na mobilech */
    .sekce-dilna-galerie { padding: 0 0 50px 0; }
    
    .galerie-img {
        height: 180px;
        width: 180px;
        border-radius: 15px;
    }
    
    .galerie-sada {
        gap: 20px;
        padding-right: 20px;
    }

    /* Zmenšení mezer u sekce Park 360 pro mobil */
    .sekce-dilna-park360 { padding: 0px 15px 50px 15px; }

    @keyframes bouchani-kladiva {
        0% { transform: translate(0, 0) rotate(0deg); }
        35% { transform: translate(-20px, -60px) rotate(-40deg); }
        45% { transform: translate(-20px, -60px) rotate(-40deg); }
        65% { transform: translate(0, 0) rotate(4deg); }
        75%, 100% { transform: translate(0, 0) rotate(0deg); }
    }
}

/* =========================================
   PŘEBARVENÍ HLAVIČKY A PATIČKY
   ========================================= */
.hlavni-navigace {
    background-color: #234a51 !important;
    border-bottom-color: #73cfb6 !important;
}

@media (max-width: 768px) {
    .nav-menu {
        background-color: #234a51 !important;
        border-bottom-color: #73cfb6 !important;
    }
}

.sekce-paticka .kopecek-svg path { fill: #234a51 !important; }
.sekce-partneri { background-color: #234a51 !important; }
.sekce-paticka .partneri-nadpis {
    color: #73cfb6 !important;
    border-bottom-color: rgba(115, 207, 182, 0.3) !important;
}