/* ============================================================
   G24 - Responsive Styles
   Active layout only: header, homepage widgets, footer, page templates
   ============================================================ */

@media (max-width: 1280px) {
    .oferta-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .oferta-card--offset {
        margin-top: 0;
    }

    .shop-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-inner {
        gap: 3rem;
    }

    .realizacje-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto;
    }

    .real-item--main,
    .real-item--small {
        grid-column: auto;
        grid-row: auto;
    }

    .footer-grid {
        gap: 2rem;
    }
}

@media (max-width: 991px) {
    .g24-header .header-nav,
    .g24-header .header-cta {
        display: none;
    }

    .g24-header .nav-hamburger {
        display: flex;
    }

    .g24-header .header-inner {
        padding: 0.9rem 0;
        gap: 1rem;
    }

    .slide-inner {
        max-width: 100%;
        padding-top: 1rem;
        padding-bottom: 3.5rem;
    }

    .slide-eyebrow {
        margin-bottom: 1.25rem;
    }

    .slide-title {
        margin-bottom: 1rem;
    }

    .slide-desc {
        margin-bottom: 1.75rem;
    }

    .slide-ctas {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.9rem;
    }

    .section-head-split,
    .realizacje-head,
    .opinie-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .g24-oferta,
    .g24-shop,
    .g24-about,
    .g24-realizacje,
    .g24-opinie,
    .g24-kontakt {
        padding: 3.5rem 0;
    }

    .about-inner,
    .kontakt-inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .about-img-frame {
        height: 380px;
    }

    .about-float-card {
        left: 0;
        bottom: 1rem;
    }

    .about-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .form-pills {
        grid-template-columns: 1fr;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2rem 3rem;
    }

    .footer-col--brand {
        grid-column: 1 / -1;
    }

    .services-row {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .services-row--reverse {
        direction: ltr;
    }

    .projects-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page-bg {
        height: 300px;
    }

    .page-title {
        padding: 3rem 0 2.25rem;
    }

    .page-title h1 {
        font-size: 2.1rem;
    }
}

@media (max-width: 768px) {
    .g24-hero,
    .g24-slide {
        height: 100svh;
        min-height: 520px;
    }

    .slide-title {
        font-size: clamp(1.85rem, 7vw, 2.6rem);
    }

    .g24-swiper-prev,
    .g24-swiper-next,
    .hero-scroll {
        display: none;
    }

    .oferta-grid,
    .shop-grid,
    .realizacje-grid,
    .footer-grid,
    .projects-grid {
        grid-template-columns: 1fr;
    }

    .oferta-grid {
        max-width: 420px;
        margin: 0 auto;
    }

    .shop-grid {
        max-width: 520px;
        margin: 0 auto;
    }

    .about-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
    }

    .about-img-frame {
        height: 280px;
    }

    .about-float-card {
        position: relative;
        left: auto;
        bottom: auto;
        max-width: 100%;
        padding: 1.25rem;
        box-shadow: none;
    }

    .kontakt-form-box {
        padding: 1.5rem;
    }

    .radio-group,
    .form-footer,
    .fb-inner,
    .footer-nl-form .nl-input-wrap {
        flex-direction: column;
        align-items: stretch;
    }

    .shop-filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start;
        padding-bottom: 0.5rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .shop-filters::-webkit-scrollbar {
        display: none;
    }

    .section-head-center {
        margin-bottom: 2rem;
    }

    .section-head-split {
        margin-bottom: 1.75rem;
    }
}

@media (max-width: 576px) {
    .container-xl {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .header-logo-link img {
        height: 34px;
    }

    .slide-eyebrow {
        font-size: 0.65rem;
    }

    .slide-title {
        font-size: clamp(1.75rem, 8vw, 2.3rem);
    }

    .about-stats {
        grid-template-columns: 1fr;
    }

    .kontakt-detail {
        flex-direction: column;
        gap: 0.5rem;
    }

    .mobile-nav__panel {
        width: 100%;
        max-width: 100%;
    }

    .footer-nl-form .btn-red,
    .scroll-top {
        width: 100%;
    }

    .page-title h1 {
        font-size: 1.8rem;
    }
}