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

@media (max-width: 1280px) {

    .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 1.25rem;
        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;
    }

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

    .blog-head__btn {
        display: none;
    }

    .blog-cta-mobile {
        display: block;
        margin-top: 1.5rem;
    }

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

    .g24-oferta,
    .g24-shop,
    .g24-about,
    .g24-blog,
    .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-bottom {
        grid-template-columns: 1fr;
    }

    .about-cta {
        justify-content: flex-start;
    }

    .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: 0;
    }

    /* Kolumna 1: pełna szerokość na tablecie */
    .footer-col:first-child {
        grid-column: 1 / -1;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, .07);
        padding: 2rem;
    }

    .footer-col:nth-child(2) {
        border-right: 1px solid rgba(255, 255, 255, .07);
        padding: 2rem;
    }

    .footer-col:nth-child(3) {
        padding: 2rem;
    }

    .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;
    }

    .shop-card__info {
        display: block;
        justify-content: unset;
    }
}

@media (max-width: 768px) {
    .header-top {
        display: none;
    }

    .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-swiper .swiper-slide:nth-child(even) {
        padding-top: 0;
    }

    .oferta-swiper-prev,
    .oferta-swiper-next {
        display: none;
    }

    .footer-col:nth-child(2) {
        border: none;
        border-top: 1px solid rgba(255, 255, 255, .07);
    }

    .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;
    }

    .shop-card__meta {
        margin-bottom: .75rem;
    }
}

@media (max-width: 576px) {
    .shop-grid,
    .blog-grid,
    .realizacje-grid,
    .footer-grid,
    .projects-grid {
        grid-template-columns: 1fr;
    }

    .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 {
        width: 100%;
    }

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

    /* Typografia kontakt — redukcja na bardzo małym ekranie */
    .kontakt-info .section-title {
        font-size: 1.6rem;
    }

    .kontakt-detail__phone {
        font-size: 1.7rem;
    }

    /* Touch targets — minimum 44px wysokości dla głównych przycisków */
    .btn,
    .btn-main a,
    .btn-black a,
    .btn-red,
    .kontakt-form button[type="submit"],
    .footer-nl-form .btn-red {
        min-height: 44px;
    }

    /* Mobilna nawigacja — wewnętrzny padding panelu */
    .mobile-nav__body {
        padding: 1.25rem;
    }

    .mobile-nav__menu li a {
        padding: 0.85rem 0;
        font-size: 1.05rem;
    }

    /* Sekcje — redukcja gapów wewnątrz */
    .about-inner,
    .kontakt-inner {
        gap: 2rem;
    }

    /* Stopka — kolumny w 1fr, padding wewnętrzny mniejszy */
    .footer-col {
        padding: 1.5rem !important;
    }
}