/* UI-only corrections, loaded after the frozen R2/A2 styles. */
.perspective::before { content: none; display: none; }
.contact .enquiry-wrap { transform: none; transition: none; will-change: auto; }

/* Reserve a real header cell for the pause control. Never float over content. */
.header:has(> .motion-control) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  column-gap: clamp(.75rem, 2vw, 2rem);
}
.header > .motion-control {
  position: static;
  justify-self: end;
  justify-content: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  max-width: none;
  margin: 0;
  padding: .5rem .65rem;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.5;
  text-transform: none;
}
.header > .motion-control .motion-icon { font-size: 1.125rem; line-height: 1; }
@media (max-width: 68.75rem) {
  .header > .motion-control { width: 2.75rem; padding: .5rem; }
  .header > .motion-control .motion-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
}
@media (max-width: 50rem) {
  .header:has(> .motion-control) { grid-template-columns: minmax(0, 1fr) auto; }
  .header:has(> .motion-control) > .brand { grid-column: 1; grid-row: 1; }
  .header > .motion-control { grid-column: 2; grid-row: 1; }
  .header:has(> .motion-control) > nav { grid-column: 1 / -1; grid-row: 2; }
  .header:has(> .motion-control) .nav-services { position: static; }
  .header:has(> .motion-control) .nav-panel {
    position: absolute;
    top: 100%;
    left: 4%;
    right: 4%;
    width: auto;
    max-height: calc(100svh - 12rem);
  }
}
@media (max-width: 25rem) {
  html:has(.header > .motion-control) { scroll-padding-top: 11rem; }
  .header:has(> .motion-control) ~ main .hero { padding-top: 11rem; }
}
@media print { .header > .motion-control { display: none; } }