/* Wide displays: share a fluid reading grid instead of a narrow 1200px island.
   Keep existing tablet/mobile rules, text measures and approved brand motion. */
@media (min-width: 1280px) {
  :root { --wide-gutter: clamp(32px, 5vw, 160px); }
  .container {
    width: min(2160px, calc(100% - 2 * var(--wide-gutter)));
  }
  .header {
    padding-inline: max(var(--wide-gutter), calc((100% - 2160px) / 2));
  }
  .motion-toggle {
    right: max(var(--wide-gutter), calc((100% - 2160px) / 2));
  }
  /* Align the product intro with its image, rather than leaving a blank column. */
  .product-layout { align-items: start; }
  /* Widen the grid, not the screenshot without limit: keep the intro in view. */
  .product .visual {
    width: 100%;
    max-width: 860px;
    justify-self: end;
  }
}