@media (max-width: 1240px) {
  .heroInner {
    grid-template-columns: minmax(0, 0.9fr) minmax(470px, 1.1fr);
    gap: 38px;
  }

  .hero h1 {
    font-size: clamp(3rem, 4.5vw, 4.15rem);
  }

  .dashboardMetricCard {
    padding: 12px;
  }

  .metricValue {
    font-size: 1.06rem;
  }
}

@media (max-width: 1120px) {
  .heroInner,
  .split,
  .aboutPanel,
  .ctaInner,
  .contactBox {
    grid-template-columns: 1fr;
  }

  .serviceGrid,
  .whyGrid,
  .trustInner,
  .numberList,
  .quoteGrid,
  .insightGrid {
    grid-template-columns: repeat(2, 1fr);
  }

  .hero {
    min-height: auto;
    padding-bottom: 112px;
  }

  .heroCopy {
    max-width: 820px;
  }

  .hero h1 {
    max-width: 780px;
    font-size: clamp(3.2rem, 7vw, 4.8rem);
  }

  .dashboardScene {
    max-width: 820px;
    margin: 18px auto 0;
  }

  .dashboardFloat {
    animation-duration: 7.5s;
  }

  .ctaActions {
    justify-content: flex-start;
  }
}

@media (max-width: 840px) {
  .menuButton {
    display: block;
  }

  .navLinks {
    position: absolute;
    top: 84px;
    left: 16px;
    right: 16px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    padding: 14px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: var(--shadow);
  }

  .navLinks.open {
    display: flex;
  }

  .navLinks a {
    width: 100%;
    justify-content: center;
  }

  .hero {
    padding: 126px 0 98px;
  }

  .hero h1 {
    font-size: clamp(2.7rem, 10.8vw, 4rem);
  }

  .heroText {
    font-size: 1rem;
  }

  .proofStrip {
    gap: 14px 20px;
  }

  .commercialDashboard {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .dashboardSidebar {
    display: none;
  }

  .dashboardContent {
    padding: 18px;
  }

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

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

  .dashboardFloat {
    animation: none;
  }

  .proofStrip,
  .serviceGrid,
  .whyGrid,
  .trustInner,
  .numberList,
  .quoteGrid,
  .insightGrid,
  .formRow,
  .footerGrid {
    grid-template-columns: 1fr;
  }

  .section,
  .contact {
    padding: 78px 0;
  }

  .aboutCopy,
  .contactInfo,
  .form {
    padding: 34px;
  }

  .imageFrame {
    min-height: 420px;
  }
}

@media (max-width: 560px) {
  .container {
    padding-inline: 18px;
  }

  .brandText span {
    display: none;
  }

  .hero {
    padding-top: 118px;
  }

  .eyebrow {
    font-size: 0.67rem;
    letter-spacing: 0.1em;
  }

  .hero h1 {
    font-size: clamp(2.45rem, 12vw, 3.35rem);
  }

  .heroActions {
    display: grid;
  }

  .heroActions .button {
    width: 100%;
  }

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

  .dashboardHeader {
    display: grid;
  }

  .dashboardPeriod {
    width: max-content;
  }

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

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

  .progressRow {
    grid-template-columns: 62px minmax(0, 1fr) 28px;
  }

  .dashboardInsight {
    grid-template-columns: auto 1fr;
  }

  .insightAction {
    display: none;
  }
}