@media (max-width: 980px){
  .footerTop{grid-template-columns:1fr; gap:18px}
  .footGrid{grid-template-columns:1fr 1fr}
}

@media (max-width: 560px){
  .navLearn{display:none;}
  /* jeśli .rule ma być globalnie chowana na mobile, to zostaw tu: */
  .rule{display:none;}

  footer{padding:26px 0 18px;}

  .footGrid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .companyBlock{
    font-size:12px;
    line-height:1.6;
  }

  .footBottom{
    margin-top:18px;
  }

  .navRight{gap:12px}
  .ctaContactBtn{display: none;}
}

    /* =========================================================
      RESPONSIVE
    ========================================================= */
    @media (max-width: 980px){
      .heroGrid{grid-template-columns:1fr; gap:22px}
      .heroMedia{order:2}
      .heroText{order:1}
      .h1{font-size:44px}

      .sectionGrid{grid-template-columns:1fr; gap:18px}
      .reverse .sectionText{order:1}
      .reverse .sectionMedia{order:2}

      .footerTop{grid-template-columns:1fr; gap:18px}
      .footGrid{grid-template-columns:1fr 1fr}

      .sectionCenter .centerMedia{min-height:320px}

      .ctaInner{flex-wrap:wrap;}
    }

    @media (max-width: 560px){
      .h1{font-size:38px}

      .navLearn{display:none;}
      .rule{display:none;}

      .ctaInner{flex-direction:column; align-items:flex-start;}
      .ctaActions{width:100%;}
      .ctaActions .btn{ width:100%; justify-content:center;}
      .btn{font-size:15px!important;}

      footer{padding:26px 0 18px;}

      .footGrid{
        grid-template-columns:1fr;
        gap:18px;
      }

      .companyBlock{
        font-size:12px;
        line-height:1.6;
      }

      .footBottom{
        margin-top:18px;
      }

      .navRight{gap:12px}
      .sectionCenter .centerMedia{min-height:260px}
      .ctaContactBtn{display: none;}
    }