/* iKonekt's own layout for the homepage demo.

   assets/try/try.css is the castomo kit's stylesheet and is shared byte for byte by the five product
   sites, so nothing here is written into it. This file loads straight after it and only changes how
   the demo's parts are placed on a wide screen.

   Stacked, the ask card is as wide as the section while its text ends at 70ch, which leaves an empty
   strip down the right of the block. From 1000px up the section becomes two columns: the heading and
   its lead stay on the left exactly where they were, and the ask card with its "places to start from"
   rail moves into the right column beside them. Results still run the full width, because a wide
   answer is the point of the demo. */
@media (min-width: 1000px) {
  .try .wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: clamp(32px, 4vw, 64px);
    align-items: start;
  }
  /* The head spans both form rows so it can sit centred against them rather than riding the top. */
  .try-head { grid-column: 1; grid-row: 1 / span 2; align-self: center; max-width: none; margin-bottom: 0; }
  .try-ask { grid-column: 2; grid-row: 1; }
  .try-ideas { grid-column: 2; grid-row: 2; }
  .try-stage, .try-status { grid-column: 1 / -1; }
  /* The stage only carries its own top margin once there is an answer in it. */
  .try-stage:not(:empty) { margin-top: clamp(28px, 3.5vw, 48px); }
}