@media (max-width: 1180px) {
  .card-grid.four {
    grid-template-columns: repeat(2, 1fr);
  }

  .icon-grid.six,
  .mini-card-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .flow-list,
  .six-flow {
    grid-template-columns: repeat(3, 1fr);
    gap: 26px 0;
  }

  .flow-list li:nth-child(3n)::after,
  .flow-list li:last-child::after {
    display: none;
  }

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

@media (max-width: 900px) {
  .container,
  .narrow {
    width: min(100% - 32px, var(--container));
  }

  .header-inner {
    min-height: 76px;
  }

  .brand-mark {
    width: 220px;
    height: 58px;
  }

  .brand-name {
    font-size: 22px;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .global-nav {
    position: fixed;
    inset: 76px 0 auto 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px 16px 18px;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-white);
    box-shadow: 0 18px 40px rgba(11, 31, 51, 0.16);
  }

  body.is-menu-open .global-nav {
    display: flex;
  }

  .global-nav a {
    min-height: 54px;
    border-bottom: 1px solid var(--color-border);
  }

  .global-nav a::after {
    bottom: 0;
    height: 2px;
    transform-origin: left;
  }

  .hero-inner,
  .hero-home .hero-inner,
  .page-hero .hero-inner {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: var(--space-lg);
    padding-block: var(--space-lg);
  }

  .hero h1,
  .page-hero h1 {
    font-size: 38px;
  }

  .hero-visual {
    min-height: 260px;
  }

  .section {
    padding-block: 48px;
  }

  .card-grid.three,
  .two-column,
  .split-section,
  .contact-layout,
  .contact-lower,
  .message-panel,
  .leadership-grid {
    grid-template-columns: 1fr;
  }

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

  .timeline li {
    padding: 0 0 0 34px;
    text-align: left;
  }

  .timeline li::before {
    left: 9px;
    right: auto;
    top: 0;
    bottom: 0;
    width: 3px;
    height: auto;
  }

  .timeline li::after {
    left: 10px;
    top: 4px;
  }

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

  .cta-actions {
    width: 100%;
  }

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

@media (max-width: 640px) {
  body {
    line-height: 1.7;
  }

  .container,
  .narrow {
    width: min(100% - 28px, var(--container));
  }

  .brand {
    gap: 9px;
  }

  .brand-mark {
    width: 185px;
    height: 50px;
  }

  .brand-name {
    font-size: 18px;
  }

  .brand-name span {
    max-width: 34px;
    font-size: 10px;
  }

  .brand-sub,
  .brand-area {
    font-size: 10px;
  }

  .hero h1,
  .page-hero h1,
  .sub-hero h1 {
    font-size: 34px;
  }

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

  .hero-actions,
  .filter-tabs {
    flex-direction: column;
  }

  .button,
  .filter-button {
    width: 100%;
  }

  .notice-bar {
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    padding: 16px;
  }

  .notice-text {
    grid-column: 2 / 4;
  }

  .section-heading h2,
  .cta-band h2 {
    font-size: 27px;
  }

  .card-grid.four,
  .icon-grid.six,
  .mini-card-grid {
    grid-template-columns: 1fr;
  }

  .feature-card {
    grid-template-columns: 1fr;
    padding: 24px;
  }

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

  .leader-photo {
    min-height: 230px;
  }

  .feature-card .line-icon {
    grid-row: auto;
  }

  .flow-list,
  .six-flow {
    grid-template-columns: 1fr;
    padding: 22px;
  }

  .flow-list li {
    padding: 0;
  }

  .flow-list li::after {
    display: none;
  }

  .company-table,
  .company-table tbody,
  .company-table tr,
  .company-table th,
  .company-table td {
    display: block;
    width: 100%;
  }

  .company-table th {
    border-bottom: 0;
  }

  .form-panel,
  .side-card,
  .faq-card,
  .area-card {
    padding: 22px;
  }

  .form-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .form-row label {
    padding-top: 0;
  }

  .form-row small {
    grid-column: 1;
  }

  .form-submit {
    width: 100%;
    margin-left: 0;
  }

  .map-label {
    left: 16px;
    right: 16px;
    top: auto;
    bottom: 16px;
  }

  .map-pin {
    left: 48%;
    top: 24%;
  }

  .footer-bottom nav {
    flex-direction: column;
    gap: 8px;
  }
}