/* ============================================================
   MDS Digital Media — Responsive Breakpoints
============================================================ */

/* ============================================================
   TABLET (991px)
============================================================ */
@media (max-width:991px){

  /* ---------- Navigation ---------- */

  .nav-top{
    padding:0 20px;
  }

  .nav-center{
    display:none;
  }

  .nav-right .nav-btn-login,
  .nav-btn-demo{
    display:none;
  }

  .nav-hamburger{
    display:flex;
  }

  /* ---------- Hero ---------- */

  .hero{
    grid-template-columns:1fr;
    padding:110px 24px 70px;
    gap:50px;
  }

  .hero-right{
    display:none;
  }

  .hero h1{
    font-size:46px;
    line-height:1.05;
    letter-spacing:-1px;
  }

  .hero-desc{
    font-size:16px;
  }

  .hero-stats{
    gap:24px;
  }

  .stat-num{
    font-size:24px;
  }

  /* ---------- ALL SECTION HEADINGS ---------- */

  .section-title,
  .testimonial-heading,
  .cta-section h2{
    font-size:40px;
    line-height:1.08;
    letter-spacing:-1px;
  }

  /* ---------- Logos ---------- */

  .logos-section{
    padding:40px 24px;
  }

  /* ---------- Pillars ---------- */

  .pillars-section{
    padding:70px 24px;
  }

  .pillars-grid{
    grid-template-columns:1fr;
  }

  /* ---------- Steps ---------- */

  .how-section{
    padding:70px 24px;
  }

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

  /* ---------- Industry ---------- */

  .industries-section{
    padding:70px 24px;
  }

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

  /* ---------- Testimonials ---------- */

  .testimonial-section{
    padding:70px 24px;
  }

  /* ---------- CTA ---------- */

  .cta-section{
    padding:80px 24px;
  }

  .cta-actions{
    flex-direction:column;
    gap:14px;
  }

  .cta-actions .btn-primary,
  .cta-actions .btn-outline{
    width:100%;
    justify-content:center;
  }

  /* ---------- Footer ---------- */

  footer{
    padding:55px 24px 35px;
  }

  .footer-top{
    grid-template-columns:repeat(2,1fr);
    gap:30px;
  }

  .footer-bottom{
    flex-direction:column;
    text-align:center;
    gap:10px;
  }

}


/* ============================================================
   MOBILE (767px)
============================================================ */

@media (max-width:767px){

  .hero{
    padding:100px 22px 60px;
  }

  .hero h1{
    font-size:40px;
    line-height:1.08;
  }

  .hero-actions{
    flex-direction:column;
    align-items:stretch;
    gap:14px;
  }

  .btn-primary,
  .btn-secondary{
    width:100%;
    justify-content:center;
  }

  /* ---------- ALL SECTION HEADINGS ---------- */

  .section-title,
  .testimonial-heading,
  .cta-section h2{
    font-size:32px;
    line-height:1.1;
    letter-spacing:-1px;
  }

  .steps-grid{
    grid-template-columns:1fr;
  }

  .industries-grid{
    grid-template-columns:repeat(2,1fr);
    gap:16px;
  }

  .footer-top{
    grid-template-columns:1fr;
  }

}


/* ============================================================
   SMALL MOBILE (480px)
============================================================ */

@media (max-width:480px){

  .hero{
    padding:90px 18px 50px;
  }

  .hero h1{
    font-size:34px;
    line-height:1.08;
  }

  .hero-desc{
    font-size:15px;
  }

  /* ---------- ALL SECTION HEADINGS ---------- */

  .section-title,
  .testimonial-heading,
  .cta-section h2{
    font-size:30px;
    line-height:1.12;
    letter-spacing:-1px;
  }

  .hero-stats{
    justify-content:space-between;
    gap:10px;
  }

  .stat-num{
    font-size:20px;
  }

  .industries-grid{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
  }

  .testimonial-card{
    width:100%;
    padding:20px;
  }

  .testimonial-header{
    flex-wrap:wrap;
    gap:12px;
  }

  .client-logo{
    width:90px;
    height:50px;
  }

  .testimonial-card p{
    font-size:14px;
    line-height:1.7;
  }

  .client-info h3{
    font-size:16px;
  }

  .testimonial-section{
    padding:50px 18px;
  }

  .testimonialSwiper .swiper-wrapper{
    display:flex !important;
    gap:0 !important;
  }

  .testimonialSwiper .swiper-slide{
    width:100% !important;
  }

}


/* ============================================================
   EXTRA SMALL DEVICES (360px)
============================================================ */

@media (max-width:360px){

  .hero{
    padding:85px 16px 45px;
  }

  .hero h1{
    font-size:32px;
    line-height:1.08;
  }

  .hero-desc{
    font-size:14px;
  }

  /* ---------- ALL SECTION HEADINGS ---------- */

  .section-title,
  .testimonial-heading,
  .cta-section h2{
    font-size:28px;
    line-height:1.15;
    letter-spacing:-1px;
    word-break:break-word;
    overflow-wrap:break-word;
  }

  .hero-stats{
    gap:8px;
  }

  .stat-num{
    font-size:18px;
  }

  .industries-grid{
    grid-template-columns:repeat(2,1fr);
    gap:10px;
  }

  .testimonial-card{
    padding:16px;
  }

  footer{
    padding:45px 16px 30px;
  }

  .cta-section p{
    font-size:14px;
    line-height:1.6;
  }

}