/* Keep the original text-only layout below large desktop widths. */
.home .dot-field { display: none; margin: 0; }
.dot-field-stage { position: relative; width: 100%; aspect-ratio: 12 / 11; }
.dot-field-stage canvas,
.dot-field-stage img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.dot-field-stage canvas { visibility: hidden; touch-action: pan-y; }
.dot-field-ready .dot-field-stage canvas { visibility: visible; }
.dot-field-ready .dot-field-stage img { visibility: hidden; }

@media (min-width: 1440px) {
  .home .content {
    display: grid;
    grid-template-columns: minmax(0, 494px) minmax(0, 530px);
    column-gap: 96px;
    row-gap: 30px;
    width: min(1120px, calc(100% - 128px));
    padding-block: 112px;
    align-items: start;
    overflow: visible;
  }
  .home .brand { grid-column: 1; grid-row: 1; }
  .home .headline { grid-column: 1; grid-row: 2; max-width: 100%; }
  .home .mission { grid-column: 1; grid-row: 3; }
  .home .intro { grid-column: 1; grid-row: 4; }
  .home .partners { grid-column: 1; grid-row: 5; width: 100%; }
  .home .news-contact { grid-column: 1; grid-row: 6; }
  .home .footer { grid-column: 1; grid-row: 7; }
  .home .dot-field {
    display: block;
    grid-column: 2;
    grid-row: 2 / 7;
    width: 100%;
    max-width: 530px;
    margin-top: 12px;
    align-self: start;
    justify-self: center;
  }
}

/* A restrained desktop scale, retaining the original line lengths and type. */
@media (min-width: 1920px) {
  .home .content {
    grid-template-columns: minmax(0, 700px) minmax(0, 560px);
    width: min(1370px, calc(100% - 160px));
    column-gap: 110px;
    row-gap: 32px;
  }
  .home .brand { width: 140px; height: 46px; }
  .home .headline { width: 580px; }
  .home .headline .text { font-size: 42px; }
  .home .mission { width: 690px; }
  .home .mission .text { font-size: 21px; }
  .home .intro { width: 700px; }
  .home .intro .text,
  .home .news-contact .text { font-size: 18px; }
  .home .news-contact { width: 685px; }
  .home .partners { gap: 32px; }
  .home .aria { width: 113px; }
  .home .yc { width: 147px; }
  .home .nvidia { width: 110px; }
  .home .imperial { width: 176px; }
  .home .dot-field { max-width: 560px; margin-top: 56px; }
}

/* Spacious desktop windows: size the art to both available dimensions and
   balance it against the complete content column, without changing text formatting. */
@media (min-width: 1920px) and (min-height: 1100px) {
  .home .content {
    --art-size: clamp(560px, min(28vw, 55svh), 740px);
    --art-gap: clamp(96px, 4vw, 140px);
    grid-template-columns: minmax(0, 700px) minmax(0, var(--art-size));
    column-gap: var(--art-gap);
    width: min(calc(700px + var(--art-gap) + var(--art-size)), calc(100% - 160px));
  }
  .home .dot-field {
    grid-row: 1 / 8;
    max-width: none;
    margin-top: 0;
    align-self: center;
  }
}
