/* November 1 RIGHT-hand selector, measured in its native 1036 × 1518 canvas.
   The six supplied crops have widths 318 / 311 / 317, with 17px gutters.
   Scale the reference geometry together on desktop; retain the existing
   readable stacked layout below 761px. Actual copy and links remain HTML. */
@media (min-width: 761px) {
  .markets-page {
    --selector-px: min(.0965250965vw, 1.38996139px);
  }

  .markets-page #main > .shell {
    width: calc(979 * var(--selector-px));
    max-width: calc(100% - 56 * var(--selector-px));
  }

  .markets-page .breadcrumb {
    gap: calc(13 * var(--selector-px));
    padding: calc(34 * var(--selector-px)) calc(8 * var(--selector-px)) calc(26 * var(--selector-px));
    font-size: calc(14 * var(--selector-px));
    line-height: calc(20 * var(--selector-px));
  }

  .markets-page .page-intro {
    padding: 0 calc(8 * var(--selector-px)) calc(24 * var(--selector-px));
  }

  .markets-page .page-intro h1 {
    position: relative;
    top: calc(3 * var(--selector-px));
    max-width: calc(900 * var(--selector-px));
    margin-bottom: calc(13 * var(--selector-px));
    font-size: calc(55 * var(--selector-px));
    line-height: calc(56 * var(--selector-px));
    font-weight: 800;
    letter-spacing: -.049em;
  }

  .markets-page .page-intro p {
    position: relative;
    top: calc(1 * var(--selector-px));
    max-width: none;
    font-size: calc(23 * var(--selector-px));
    line-height: calc(27 * var(--selector-px));
    letter-spacing: -.03em;
  }

  .markets-page .market-grid {
    grid-template-columns: 318fr 311fr 317fr;
    gap: calc(17 * var(--selector-px));
  }

  .markets-page .market-card {
    border-color: #e3e2e6;
    border-radius: calc(12 * var(--selector-px));
  }

  .markets-page .market-card > :is(img:not(.responsive-picture-image), picture.responsive-picture) {
    width: 100%;
    height: calc(266 * var(--selector-px));
    aspect-ratio: auto;
    object-fit: cover;
  }

  .markets-page .market-card:nth-child(n + 4) > :is(img:not(.responsive-picture-image), picture.responsive-picture) {
    height: calc(261 * var(--selector-px));
  }

  .markets-page .market-card > div {
    min-height: calc(163 * var(--selector-px));
    padding: calc(15 * var(--selector-px)) calc(22 * var(--selector-px)) calc(22 * var(--selector-px));
  }

  .markets-page .market-card:nth-child(n + 4) > div {
    min-height: calc(174 * var(--selector-px));
  }

  .markets-page .market-card h2 {
    margin: 0 0 calc(5 * var(--selector-px));
    font-size: calc(30.5 * var(--selector-px));
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: -.045em;
  }

  /* The reference uses a narrower face for these long titles. Preserve the
     reference line breaks without reducing their height or flattening text. */
  .markets-page .market-card:nth-child(3) h2,
  .markets-page .market-card:nth-child(6) h2 {
    width: 106.383%;
    transform: scaleX(.94);
    transform-origin: left center;
  }

  .markets-page .market-card p {
    margin-bottom: calc(12 * var(--selector-px));
    font-size: calc(24 * var(--selector-px));
    line-height: 1.14;
    letter-spacing: -.025em;
  }

  .markets-page .market-card .text-link {
    min-height: calc(30 * var(--selector-px));
    font-size: calc(18 * var(--selector-px));
    line-height: 1.15;
    font-weight: 500;
    white-space: nowrap;
    margin-top: auto;
  }

  .markets-page .market-card .text-link span {
    font-size: calc(25 * var(--selector-px));
  }

  .markets-page .campaign-callout {
    min-height: calc(114 * var(--selector-px));
    margin-top: calc(26 * var(--selector-px));
    padding: calc(22 * var(--selector-px)) calc(32 * var(--selector-px));
    gap: calc(25 * var(--selector-px));
    border-radius: calc(14 * var(--selector-px));
    background: linear-gradient(110deg, #fff2f7, #fff4f8);
  }

  .markets-page .campaign-callout h2 {
    margin-bottom: calc(8 * var(--selector-px));
    font-size: calc(27 * var(--selector-px));
    line-height: 1.1;
    letter-spacing: -.035em;
  }

  .markets-page .campaign-callout p {
    font-size: calc(20 * var(--selector-px));
    line-height: 1.3;
    letter-spacing: -.02em;
  }

  .markets-page .campaign-callout .button {
    min-width: calc(188 * var(--selector-px));
    min-height: calc(49 * var(--selector-px));
    padding: calc(12 * var(--selector-px)) calc(27 * var(--selector-px));
    gap: calc(28 * var(--selector-px));
    font-size: calc(17 * var(--selector-px));
    border-radius: calc(27 * var(--selector-px));
  }

  .markets-page .campaign-callout .button span {
    font-size: calc(25 * var(--selector-px));
  }

  .markets-page .footer-row.shell {
    width: calc(964 * var(--selector-px));
    max-width: calc(100% - 72 * var(--selector-px));
    min-height: calc(84 * var(--selector-px));
    margin-top: calc(20 * var(--selector-px));
    padding-block: calc(8 * var(--selector-px));
    gap: calc(24 * var(--selector-px));
  }

  .markets-page .footer-logo {
    width: calc(107 * var(--selector-px));
  }

  .markets-page .representation-credit {
    border-left: 1px solid #a7a7ae;
    padding: calc(8 * var(--selector-px)) 0 calc(8 * var(--selector-px)) calc(26 * var(--selector-px));
    font-size: calc(12 * var(--selector-px));
  }

  .markets-page .footer-links {
    font-size: calc(12 * var(--selector-px));
  }

  .markets-page .footer-links > a {
    padding-inline: calc(14 * var(--selector-px));
  }
}
