@layer page {
  @media (max-width: 1080px) {
    .hero__grid,
    .statement-grid,
    .difference-grid,
    .contact-grid,
    .operating-grid,
    .form-grid {
      grid-template-columns: 1fr;
    }

    .hero h1,
    .section-heading h2,
    .difference-panel h2,
    .contact-panel h2 {
      max-width: 26ch;
    }

    .hero {
      min-height: auto;
      padding-block: clamp(3.5rem, 7vw, 5.2rem);
    }

    .hero__grid {
      width: min(100%, 52rem);
      justify-content: stretch;
    }

    .hero-system {
      min-height: auto;
      margin-block-start: 1.6rem;
    }
  }

  @media (max-width: 640px) {
    .hero {
      min-height: auto;
      padding-block: 1.05rem 2.1rem;
    }

    .hero__grid {
      display: block;
      width: 100%;
    }

    .hero__copy {
      gap: 0.92rem;
    }

    .hero .eyebrow {
      max-width: 100%;
      font-size: 0.7rem;
      font-weight: 600;
      letter-spacing: 0.13em;
      line-height: 1.35;
    }

    .hero .eyebrow::after {
      width: 1.35rem;
      margin-block-start: 1.18rem;
    }

    .hero h1 {
      width: min(100%, 21.6rem);
      font-size: 2.08rem;
      line-height: 1.02;
      letter-spacing: 0;
    }

    .hero .lead {
      max-width: 21rem;
      font-size: 0.9rem;
      line-height: 1.58;
    }

    .hero-system {
      min-height: auto;
      margin-block-start: 1.05rem;
      padding: 0.88rem;
      border-radius: var(--radius);
    }

    .hero-system__header {
      align-items: start;
    }

    .hero-system__header h2 {
      max-width: 20ch;
      font-size: 1.02rem;
      line-height: 1.14;
    }

    .hero-system__canvas {
      grid-template-columns: 1fr;
      min-height: auto;
      padding: 0.65rem;
      gap: 0.48rem;
    }

    .hero-system__rail {
      min-height: 0;
      padding: 0.68rem;
    }

    .hero-system__rail span,
    .hero-system__nodes span,
    .hero-system__panel-label,
    .hero-system__metric span {
      font-size: 0.58rem;
    }

    .hero-system__nodes {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.42rem;
    }

    .hero-system__nodes::before {
      display: none;
    }

    .hero-system__nodes span {
      min-height: 2.35rem;
      justify-items: center;
      padding: 0.5rem 0.42rem;
      white-space: normal;
      text-align: center;
    }

    .hero-system__panel {
      padding: 0.68rem;
    }

    .hero-system__metric {
      align-items: start;
      display: grid;
      gap: 0.08rem;
      min-height: auto;
      padding-block: 0.42rem;
    }

    .hero-system__metric strong {
      text-align: left;
    }

    .hero-system__proof div {
      grid-template-columns: 1fr;
      gap: 0.18rem;
      padding-block: 0.55rem;
    }

    .hero-system__proof dt {
      font-size: 0.62rem;
    }

    .hero-system__proof dd {
      font-size: 0.82rem;
      line-height: 1.42;
    }

    .hero__actions {
      display: grid;
      gap: 0.65rem;
      margin-block-start: 0.25rem;
    }

    .hero__actions .button-secondary {
      display: none;
    }

    #apresentacao .section-heading h2,
    #como-trabalha .section-heading h2,
    .difference-panel h2,
    .contact-panel h2 {
      max-width: 12.8em;
      font-size: 2rem;
      line-height: 1.13;
    }

    .hero__actions,
    .form-actions {
      align-items: stretch;
    }

    .operational-evidence {
      min-height: auto;
    }

    .workflow-map {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.45rem;
      padding: 0.65rem;
    }

    .workflow-map::before {
      display: none;
    }

    .workflow-map span {
      min-height: 2.75rem;
      font-size: 0.55rem;
      white-space: normal;
    }

    .decision-matrix {
      margin-block-start: 0.55rem;
    }

    .decision-matrix div {
      grid-template-columns: 1fr;
      gap: 0.22rem;
      padding-block: 0.82rem;
    }

    .difference-grid {
      gap: 1rem;
    }

    .difference-item {
      grid-template-columns: 3.6rem 1fr;
      gap: 1rem;
      padding-block: 1.25rem;
    }

    .difference-item__icon {
      width: 3.6rem;
      padding: 0.95rem;
    }

    .deep-panel h3 {
      font-size: 1.18rem;
    }

    .deep-panel dl {
      grid-template-columns: 1fr;
      margin-block-start: 0.75rem;
    }

    .deep-panel dl div {
      grid-template-columns: 2.25rem 1fr;
      grid-template-rows: auto auto;
      gap: 0.32rem 0.85rem;
      min-height: auto;
      padding: 0.95rem;
    }

    .deep-panel dt {
      align-self: center;
    }

    .deep-panel dd {
      align-self: auto;
      grid-column: 1 / -1;
    }

    .operational-evidence,
    .process-card,
    .difference-panel,
    .deep-panel,
    .contact-form,
    .hero-system {
      padding: 1.15rem;
    }

    .contact-form__head {
      padding-block-end: 1.1rem;
    }

    .contact-form__head h3 {
      max-width: 18rem;
      font-size: 1.15rem;
    }

    .contact-grid {
      gap: 2.2rem;
    }

    .contact-point {
      grid-template-columns: 3.45rem 1fr;
      gap: 1rem;
      padding-block: 1.1rem;
    }

    .contact-point__icon {
      width: 3.35rem;
      padding: 0.8rem;
    }

    .form-grid {
      gap: 1.25rem;
    }

    .form-actions .button {
      width: 100%;
    }

    .operational-evidence__head h3 {
      font-size: 1.12rem;
    }
  }
}