/* Responsive */

@media (max-width: 860px) {
  .header-inner {
    min-height: auto;
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 0;
  }

  .site-nav {
    width: 100%;
    flex-wrap: wrap;
    gap: 18px;
  }

  .nav-links,
  .nav-actions {
    flex-wrap: wrap;
  }

  .nav-links {
    gap: 18px;
  }

  .nav-actions {
    gap: 10px;
  }

  .hero {
    min-height: 420px;
    padding: 64px 0 30px;
  }

  .page-title-line {
    gap: 12px;
    margin-top: 34px;
  }

  .about-page-intro {
    margin-top: 28px;
  }

  .about-whatdo-inner h2 {
    margin-bottom: 28px;
  }

  .about-whatdo-inner p {
    margin-top: 28px;
    font-size: 0.92rem;
  }

  .about-homepage-inner > img {
    margin-bottom: 36px;
  }

  .about-homepage-copy {
    padding: 30px 20px;
  }

  .about-homepage-note {
    margin-top: 32px;
    font-size: 0.92rem;
  }

  .about-design-field-inner h2 {
    margin-bottom: 32px;
  }

  .about-product-export-copy {
    margin-bottom: 32px;
  }

  .about-product-export-copy h2 span {
    display: block;
    margin-left: 0;
  }

  .about-intro {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .about-content {
    gap: 34px;
  }

  .about-divider {
    width: min(100%, 520px);
  }

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

  .about-decoration,
  .business-image {
    margin-right: auto;
    margin-left: auto;
  }

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

  .works-preview-inner {
    width: min(100% - 32px, 520px);
  }

  .works-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .contact-heading {
    margin-bottom: 42px;
  }

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

  .contact-card {
    min-height: auto;
    padding: 34px 24px;
  }

  .contact-address-detail {
    padding-left: 0;
  }

  .works-heading {
    margin-bottom: 34px;
  }

  .works-heading h1 span {
    display: block;
    margin-left: 0;
  }

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

  .works-service-card {
    min-height: auto;
    padding: 34px 24px;
  }

  .works-content-block {
    margin-top: 52px;
    padding-top: 46px;
  }

  .works-block-heading {
    margin-bottom: 34px;
  }

  .works-block-heading h2 span {
    display: block;
    margin-left: 0;
  }

  .works-product-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .works-character-grid {
    grid-template-columns: 1fr;
  }

  .footer-inner {
    align-items: flex-start;
    flex-direction: column;
  }
}