.feature-card {
    display: flex;
    flex-direction: column;   /* tartalom egymás alá */
    justify-content: flex-start;
    height: 100%;            /* hogy minden kártya azonos magasságú legyen */
}

.feature-card a.btn-primary {
    margin-top: auto;        /* mindig a legaljára teszi */
}

.text-center {
    text-align: center;
}
.pricing-card {
    display: flex;
    flex-direction: column;   /* egymás alá rendezi a tartalmat */
    justify-content: flex-start;
    height: 100%;             /* azonos magasság kell a gridben */
}

.pricing-card a.btn-primary,
.pricing-card a.btn-secondary {
    margin-top: auto;         /* gomb mindig a legalján lesz */
}

.plan-features-shortly {
    margin-bottom: 0 ;
}

.text-start {
    text-align: left;
}

a {
    color: #00ffff;
}

/* A kép jobbra igazítása és a térközök beállítása */
.profil_img {
    float: right;
    margin-left: 20px;
    margin-bottom: 10px;
    max-width: 33%;
    border-radius: 8px;
}

/* Biztosítja, hogy a wrapper div kiterjedjen a float-olt képre,
   megakadályozva az alatta lévő elemek felcsúszását. */
.image-text-wrapper {
    overflow: auto; /* Ez a legegyszerűbb "clearfix" megoldás. */
}

@media (max-width: 768px) {
    .profil_img {
        float: none;
        display: block;
        margin: 0 auto 20px;   /* középre igazítja */
        max-width: 80%;        /* mobilon legyen szélesebb */
    }
}
.mobil_li {
    padding: 0px 100px 0px 0px;
}

.mobil_li a{
    color: white;
}

.nav-container {
    width: 100%;
    /*margin: 0 !important;*/
}

.hero-container {
    overflow: auto;
}

/* Fade-up animáció kikapcsolása */
.fade-up {
    opacity: 1;
    transform: translateY(0);
}
.feature-card {
    padding: 1rem;
}

@media (max-width: 768px) {
    /* EZ A KÉT SOR OLDJA MEG A PROBLÉMÁT */
    .nav-links,
    .nav-bottom {
        display: none !important;
    }

    .logo {
        font-size: 1.2rem;
        flex-shrink: 1; /* Engedélyezi az elem zsugorodását */
        min-width: 0;   /* Felülírja a flexbox alapértelmezett viselkedését */
    }
    /* EZT A RÉSZT ADD HOZZÁ: */
    /*nav {*/
    /*    padding-left: 1rem;  !* Csökkenti a bal oldali paddingot *!*/
    /*    padding-right: 1rem; !* Csökkenti a jobb oldali paddingot *!*/
    /*}*/

    /*!* A korábbi .logo szabályt is érdemes megtartani, ha beletetted: *!*/
    /*.logo {*/
    /*    font-size: 1.0rem;*/
    /*    flex-shrink: 1;*/
    /*    min-width: 0;*/
    /*}*/

    /*!* A profilképre vonatkozó szabály, ha beletetted: *!*/
    /*.profil_img {*/
    /*    float: none;*/
    /*    display: block;*/
    /*    margin: 0 auto 20px;*/
    /*    max-width: 80%;*/
    /*}*/
    stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
        gap: 1rem;
    }

    .plan-price {
        font-size: 2rem;
    }

    /* ----- ÚJ RÉSZ: Animált hátterek kikapcsolása mobilon a teljesítményért ----- */
    /*
     * Az alábbi szabályok elrejtik az összes nagy teljesítményigényű
     * háttéranimációt, hogy az oldal gyors és reszponzív maradjon
     * gyengébb mobil eszközökön is.
    */
    /*.cyber-gradient,*/
    /*.matrix-rain,*/
    /*.grid-overlay,*/
    /*.particles,*/
    /*.orb,*/
    /*.scanlines,*/
    /*.data-streams,*/
    /*.noise-overlay {*/
    /*    display: none !important;*/
    /*}*/
    .stat-number {
        font-size: 2rem;
    }
    nav {
        /*width: 76%;*/
    }

    .hero-subtitle {
        font-size: 1rem;
    }
}


/* EZ A GLOBÁLIS SZABÁLY MEGGÁTOL MINDEN JÖVŐBELI HORIZONTÁLIS GÖRGETÉST */
html, body {
    /*overflow-x: hidden;*/
}