/* 1. Matematicky přesné pozicování podle SVG pro VŠECHNA rozlišení */

/* Musíme upravit animaci plavání, aby udržela karty vycentrované na bodech */
@keyframes float-centered {
    0%, 100% { transform: translate(-50%, -50%); }
    50% { transform: translate(-50%, calc(-50% - 10px)); }
}

/* Aplikujeme novou vycentrovanou animaci */
#spoluprace .bg-slate-50.shadow-inner .relative.z-10 > div.animate-float {
    animation-name: float-centered !important;
}

/* Frontend karta */
#spoluprace .bg-slate-50.shadow-inner .relative.z-10 > div:nth-child(1) {
    top: 22.5% !important;
    left: 76% !important;
    right: auto !important;
    transform: translate(-50%, -50%);
}

/* Backend karta */
#spoluprace .bg-slate-50.shadow-inner .relative.z-10 > div:nth-child(2) {
    top: 35% !important;
    left: 26% !important;
    transform: translate(-50%, -50%);
}

/* Databáze karta */
#spoluprace .bg-slate-50.shadow-inner .relative.z-10 > div:nth-child(4) {
    top: 77.5% !important;
    left: 28% !important;
    bottom: auto !important;
    transform: translate(-50%, -50%);
}

@media (max-width: 600px) {
    .mb-zmenit1 {

        margin-left: -2rem;
        margin-right: -2rem;
        width: 100vw !important;
        border-radius: 0px !important;
        box-shadow: none;
    }


    .mb-zmenit1>div {
        border-radius: 0px !important;
        box-shadow: none;
        background: transparent;
        border: 0px;
    }
}
@media (max-width: 768px) {
    #spoluprace .bg-slate-50.shadow-inner {
        aspect-ratio: 1 / 1.2 !important; /* Dáme tomu na mobilu víc místa na výšku */
    }

    /* Zmenšení vnitřních elementů karet pro mobily */
    #spoluprace .bg-slate-50.shadow-inner .absolute.bg-white:not(.w-48) {
        padding: 0.5rem 0.75rem !important;
        gap: 0.5rem !important;
    }
    #spoluprace .bg-slate-50.shadow-inner .absolute.bg-white:not(.w-48) .w-10 {
        width: 2rem !important;
        height: 2rem !important;
    }
    #spoluprace .bg-slate-50.shadow-inner .absolute.bg-white:not(.w-48) .text-xs {
        font-size: 0.65rem !important;
    }

    /* Zmenšení středového API GATEWAY boxu */
    #spoluprace .bg-slate-50.shadow-inner .w-48 {
        width: 140px !important;
        padding: 0.75rem !important;
    }
    #spoluprace .bg-slate-50.shadow-inner .w-48 .text-sm {
        font-size: 0.75rem !important;
    }
    .mobil-schovat{
        margin-top: 2px !important;
        z-index: -8;
        position: relative;
    }




}