/* Responsive */
    @media (max-width: 980px) {

      .hero-grid,
      .ecosystem {
        grid-template-columns: 1fr;
      }

      .hero-visual {
        min-height: auto;
      }

      .overview-flow {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px 16px;
      }

      .overview-step:not(:last-child)::after {
        display: none;
      }

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

      .audience-note {
        flex-direction: column;
        gap: 8px;
        text-align: center;
      }

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

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

      .footer-col {
        padding: 28px 24px;
      }

      .footer-col + .footer-col {
        border-left: none;
        border-top: 1px solid rgba(8, 120, 201, 0.1);
      }

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

      .footer-feature:nth-child(odd) {
        border-left: none;
      }

      .footer-feature:nth-child(n + 3) {
        border-top: 1px solid rgba(255, 255, 255, 0.12);
      }

      .footer-feature:nth-child(even) {
        border-left: 1px solid rgba(255, 255, 255, 0.12);
      }
    }

    @media (max-width: 700px) {
      .container {
        width: min(100% - 28px, 1180px);
      }

      .section {
        padding: 62px 0;
      }

      .nav {
        min-height: 76px;
      }

      .brand img {
        height: 78px;
      }

      .hero {
        padding: 58px 0 50px;
      }

      h1 {
        font-size: 2.35rem;
      }

      .hero-copy {
        font-size: var(--fs-base);
      }

      .hero-actions {
        display: grid;
      }

      .button {
        width: 100%;
      }

      .overview-flow,
      .module-grid,
      .benefit-wrap {
        grid-template-columns: 1fr;
      }

      .overview-step:not(:last-child)::after {
        display: none;
      }

      .cta-box {
        padding: 38px 22px;
      }

      .cta-actions {
        display: grid;
      }

      .site-footer {
        padding-bottom: 32px;
      }

      .footer-col {
        padding: 24px 20px;
        text-align: center;
      }

      .footer-about {
        text-align: left;
      }

      .footer-desc {
        max-width: none;
      }

      .footer-scene {
        height: 90px;
        margin-top: 20px;
      }

      .footer-heading-wrap {
        display: block;
      }

      .footer-contact-item {
        text-align: left;
        max-width: 360px;
        margin-inline: auto;
      }

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

      .footer-feature {
        border-left: none !important;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
      }

      .footer-feature:first-child {
        border-top: none;
      }
    }
