.contact-window-scene { display: none; }
.contact-copy > [data-calculator] {
  align-self: start;
  width: fit-content;
  max-width: 100%;
  min-height: 44px;
  padding: 12px 19px;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: #fff;
  font-size: 12px;
}
.contact-copy > [data-calculator]:hover { background: color-mix(in srgb, var(--accent) 90%, #000); }

@media (min-width: 781px) {
  .contact-window-scene {
    display: block;
    --window-edge: #858585;
    --window-pane: #f4f4f4;
    --window-frame: #c5c5c5;
    --window-frame-line: #626262;
    --window-outline: #464646;
    --window-detail: #737373;
    --window-coat: #b7b7b7;
    --window-skin: #e5e5e5;
    --window-hair: #858585;
    --window-pupil: #292929;
    --window-eyes: #fafafa;
    --window-accent: var(--accent);
    width: min(100%, 200px);
    padding: 0;
    border: 0;
    background: transparent;
    margin: 22px 0 0 auto;
  }
  .contact-window-scene:disabled { opacity: 1; cursor: default; }
  .contact-window { display: block; width: 100%; height: auto; }
  [data-theme="dark"] .contact-window-scene {
    --window-edge: #666;
    --window-pane: #202020;
    --window-frame: #3d3d3d;
    --window-frame-line: #969696;
    --window-outline: #d0d0d0;
    --window-detail: #999;
    --window-coat: #343434;
    --window-skin: #414141;
    --window-hair: #252525;
    --window-pupil: #191919;
    --window-eyes: #ddd;
  }
}
@media (min-width: 1250px) {
  /* Use part of the existing column gap for the drawing without moving the form. */
  .contact-copy:has(.contact-window-scene) {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    column-gap: clamp(10px, 1.5vw, 32px);
    align-content: start;
    align-self: start;
  }
  .contact-copy > :is(.eyebrow, h2) { grid-column: 1 / -1; }
  .contact-copy > :is(p:not(.eyebrow), .text-button, .contact-email, .contact-details) { grid-column: 1; justify-self: start; }
  .contact-copy .contact-details { flex-wrap: wrap; gap: 12px 20px; }
  .contact-window-scene {
    grid-column: 2;
    grid-row: 3 / 7;
    align-self: center;
    margin: 20px 0 0;
    width: calc(100% + min(4vw, 110px));
  }
}
