@media (max-width:1199px) {

  .problem-cards,
  .solution-orbit-cards {
    grid-template-columns: repeat(3, 1fr)
  }

  .admin-stats-cards {
    grid-template-columns: repeat(2, 1fr)
  }

  .app-card {
    grid-template-columns: 1fr;
    position: relative;
    top: auto
  }
}

@media (max-width:991px) {
  .section-shell {
    padding: 86px 0
  }

  .hero-section {
    height: auto;
    min-height: auto;
    padding: 94px 0 70px
  }

  .hero-section:after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .9) 48%, rgba(255, 255, 255, .5) 100%)
  }

  .hero-bg-media {
    position: absolute;
    inset: 0;
    height: 100%
  }

  .hero-bg-img {
    object-position: center top
  }

  .hero-float-cards {
    display: none
  }

  .hero-img {
    max-width: 100%;
    margin-left: 0
  }

  .cta-box {
    grid-template-columns: 1fr;
    padding: 42px
  }

  .cta-actions {
    justify-content: flex-start
  }

  .navbar-collapse {
    padding: 18px 0
  }

  .brand-logo.payshop-logo {
    height: 35px
  }

  .brand-logo.fidaty-logo {
    height: 31px
  }
}

@media (max-width:767px) {
  body {
    font-size: 15px
  }

  .section-shell {
    padding: 72px 0
  }

  h1 {
    font-size: 4.1rem
  }

  h2 {
    font-size: 2.35rem
  }

  .hero-section {
    padding-top: 92px
  }

  .hero-bg-media {
    opacity: .34
  }

  .hero-bg-img {
    object-position: 62% top
  }

  .hero-title {
    font-size: 1.75rem
  }

  .hero-actions .btn {
    width: 100%
  }

  .hero-proof {
    gap: 8px
  }

  .hero-proof span {
    font-size: .82rem;
    padding: 9px 12px
  }

  .hero-copy {
    order: 2
  }

  .hero-media {
    order: 1
  }

  .hero-img,
  .section-img {
    border-radius: 24px
  }

  .problem-cards,
  .solution-orbit-cards,
  .admin-stats-cards {
    grid-template-columns: 1fr
  }

  .mini-card {
    min-height: auto
  }

  .portal-slide-cards {
    margin-left: -12px;
    margin-right: -12px;
    padding-left: 12px
  }

  .app-card {
    padding: 18px;
    border-radius: 26px
  }

  .app-card h3 {
    font-size: 2rem
  }

  .feature-tags span {
    font-size: .78rem
  }

  .integration-grid article {
    grid-template-columns: 46px 1fr;
    padding: 16px
  }

  .integration-grid i {
    width: 46px;
    height: 46px
  }

  .cta-box {
    padding: 30px 22px;
    border-radius: 28px
  }

  .cta-actions .btn {
    width: 100%
  }

  .site-footer {
    text-align: left
  }

  .footer-links {
    margin: 18px 0
  }

  .whatsapp-float {
    right: 16px;
    bottom: 16px;
    width: 54px;
    height: 54px
  }

  .brand-combo {
    gap: 10px
  }

  .brand-separator {
    height: 26px
  }

  .payshop-logo {
    height: 32px
  }

  .fidaty-logo {
    height: 28px
  }
}

@media (max-width:1199px) {
  .section-media-frame {
    min-height: 360px;
  }

  .app-card-media--mockup {
    min-height: 360px;
  }
}

@media (max-width:767px) {
  .section-media-frame {
    min-height: 250px;
  }

  .section-media-frame .section-img--cover {
    object-position: center;
  }

  .app-card-media--mockup {
    min-height: 240px;
  }

  .hero-img,
  .section-img,
  .app-mockup-img {
    border-radius: 0;
    box-shadow: none;
    filter: none;
  }
}


@media (prefers-reduced-motion:reduce) {
  * {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important
  }

  .parallax-img,
  .hero-float-card,
  .hero-progress-bar,
  .hero-bars-chart span,
  .hero-chart-line,
  .hero-status-pill b {
    transform: none !important
  }
}