@layer components {
.main-content > .cx-desk { position: relative; }

.cx-deskcol { min-width: 0; }

@media (max-width: 1023px) {

  .cx-form { padding: var(--space-4); gap: var(--space-3); }
  .cx-form-head { padding-bottom: var(--space-3); }
  .cx-form-foot { padding-top: 0; }
  .cx-textarea { height: 104px; min-height: 104px; }

  .cx-direct { margin-top: var(--space-6); padding-top: var(--space-5); }
  .cx-statusline { margin-top: var(--space-5); padding-top: var(--space-4); }

  .cx-docs-panel { padding: var(--space-5); }
}
}

@layer components {

@media (max-width: 1023px) {
  .cx-desk-grid { gap: var(--stack-lg); }

  .main-content > .cx-desk {
    padding-top: calc(var(--navbar-h) + var(--hero-lede));
    padding-bottom: var(--stack-lg);
  }
  .main-content > .cx-docs {
    padding-top: var(--stack-lg);
    padding-bottom: var(--stack-lg);
  }
}

@media (max-width: 1023px) {

  .cx-form-head--p {
    display: flex;
    margin-bottom: var(--stack-md);
    padding-bottom: 0;
    border-bottom: 0;
  }

  .cx-docs-head-p { margin-bottom: var(--stack-md); }
  .cx-docs-head-p .cx-docs-lede { margin: var(--stack-xs) 0 0; }

  .cx-docs-more {
    flex-direction: column;
    gap: var(--stack-md);
  }
}

@media (max-width: 1023px) {
  .cx-direct-note,
  .cx-submit-note,
  .cx-docs-lede { font-size: var(--mt-body); }
}

@media (max-width: 1023px) {
  .main-content.main-content .cx-form-head--p .cx-form-h {
    font-size: var(--mt-kicker);
    line-height: 1.2;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
}

}

@layer components {
@media (max-width: 1023px) {

  .cx-direct-note--p {
    margin-top: var(--stack-sm);
    font-size: var(--mt-body);
  }

  .cx-docs-cap { grid-column: 1 / -1; }

  .cx-hint,
  .cx-hint-to,
  .cx-hint-link { font-size: var(--mt-body); }
}
}