/* ============================================= */
/* MOBILE.CSS – tylko style dla telefonów       */
/* Poprawiona wersja – bez rozciągania          */
/* ============================================= */

@media (max-width: 768px) {

    /* === NAJWAŻNIEJSZE – blokuje wychodzenie poza ekran === */
    html, body {
        max-width: 100%;
        overflow-x: hidden;
        padding: 0;
        margin: 0;
    }

    img {
        max-width: 100%;
        height: auto;
    }

    /* Wszystkie główne kontenery – pełna szerokość bez przepełnienia */
    .header-container,
    .brands-section,
    .main-content,
    .footer-main,
    .trust-container,
    .hero {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box;
    }

    /* HEADER */
    .header-container {
        padding: 0 15px;
        flex-wrap: wrap;
        gap: 10px;
    }
    .logo img {
        height: 42px;
    }

    /* NAWIGACJA */
    nav ul {
        gap: 15px;
        padding: 0 15px;
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
    }
    nav ul li a {
        font-size: 0.8rem;
        padding: 6px 10px;
    }

    /* DROPDOWN na telefonie */
    .dropdown-menu {
        position: static !important;
        width: 100%;
        background-color: #1a1a1a;
        border: 1px solid #333;
        border-top: none;
        box-shadow: none;
        margin-top: 0;
        padding: 5px 0;
    }
    .dropdown-menu li a {
        padding: 14px 20px;
        font-size: 0.95rem;
    }

    /* HERO */
    .hero {
        margin-bottom: 25px;
        padding: 0 15px;
    }
    .hero img {
        aspect-ratio: 16 / 5.5;
        width: 100%;
    }

    /* SEKCJA MAREK */
    .brands-section {
        margin: 20px auto 35px;
        padding: 0 15px;
    }
    .brands-grid {
        gap: 14px;
    }
    .brand-card {
        padding: 16px 10px;
    }
    .brand-card img {
        height: 42px;
    }
    .brand-card span {
        font-size: 0.75rem;
    }

    /* GŁÓWNA TREŚĆ + KARTY */
    .main-content {
        padding: 0 15px 40px;
    }
    .grid-wrapper {
        gap: 20px;
    }
    .card.ad-card {
        padding: 0;
        width: 100%;
    }
    .card-image {
        height: 190px;
    }
    .card-content {
        padding: 18px;
    }
    .card-content h3 {
        font-size: 1.15rem;
    }
    .tech-specs {
        gap: 12px;
    }
    .btn-details {
        padding: 14px;
        font-size: 0.95rem;
    }

    /* FOOTER */
    .footer-main {
        padding: 45px 15px;
        gap: 35px;
    }
    .footer-trust-badges {
        padding: 25px 15px;
    }
    .map-container {
        height: 220px;
        width: 100% !important;
    }
    .contact-info li {
        font-size: 1rem;
    }

    /* Tytuły sekcji */
    .section-title,
    h2[style*="border-left"] {
        font-size: 1.35rem;
        margin: 30px 0 20px;
    }
}

/* Bardzo małe telefony */
@media (max-width: 480px) {
    .brands-grid {
        grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    }
    .brand-card img {
        height: 38px;
    }
    .card-image {
        height: 175px;
    }
}