/* mootolhome.com - "Brand story" block (home page and About page).
 *
 * The craftsman photo used to be a full-width 16:9 block on its own row
 * (~1455px wide on a 1440-1850px screen), while the source file
 * story-craftsman.png is only 932x626 - so it was both oversized and upscaled.
 * It now sits to the right of the body copy, at 3:2 to match the source.
 *
 * Added 2026-09-28. Scoped to >1100px on purpose, so the existing tablet and
 * mobile rules in main-BLobzTDb.css keep working exactly as before.
 */
@media (min-width: 1101px) {
  .story {
    grid-template-columns: minmax(120px, .6fr) minmax(320px, 1.15fr) minmax(300px, 1.05fr);
    align-items: start;
  }

  /* headline keeps the full content width (columns 2-3) */
  .story__statement {
    grid-column: 2 / -1;
  }

  /* body copy moves to row 2, left column */
  .story__foot {
    grid-column: 2;
    grid-row: 2;
    display: block;
    margin-top: clamp(40px, 4.5vw, 76px);
  }

  .story__foot .magnetic-link {
    margin-top: 28px;
  }

  /* photo moves to row 2, right column */
  .story__image {
    grid-column: 3;
    grid-row: 2;
    width: 100%;
    aspect-ratio: 3 / 2;
    margin-top: clamp(40px, 4.5vw, 76px);
    align-self: start;
  }
}