/* partner-strip breakpoints, loaded after the shared ones. */

@media (max-width: 900px) {
  /* Mobile frame (Figma 211:2798): the hairline sits on the white band's top edge
     and runs out to the screen edge, the T caps end 12px either side of a 211px
     heading (x 90 / 325 on the 414 frame), the L corners stand on the line at the
     rails, and the heading's two 18px lines straddle the line. The band therefore
     starts at the label's centre: 2 lines x 18px / 2 = 18px. */
  .partner-strip { padding-bottom: 40px; }
  .partner-strip .strip-surface { top: 18px; }
  .partner-strip__label { gap: 12px; padding-inline: 0; }
  .partner-strip__label::before, .partner-strip__label::after { margin-top: -8px; }
  .partner-strip__label h2 { width: 211px; padding-inline: 0; font-size: 14px; line-height: 18px; }
  .partner-strip__viewport { margin-top: 35px; }
  .partner-strip__set { min-width: 760px; gap: 40px; padding-inline: 16px; }
  .partner-strip__set img { max-width: none; height: 20px; }
  .partner-strip__track { animation-duration: 22s; }
  .platform-section { min-height: 460px; margin-top: 80px; padding: 43px 0; }
  .platform-section .web-section-intro { padding-inline: 40px; }
  .platform-section .web-section-intro h2 { font-size: 32px; line-height: 32px; }
  .platform-section .web-section-intro > p:last-child { font-size: 16px; line-height: 22px; }
  .platform-logos { grid-template-columns: repeat(2,1fr); gap: 34px 20px; margin-top: 38px; padding-inline: 38px; }
  .platform-logos img { height: 30px; }
  body.web-development-page .platform-section .eyebrow { width: 87px; padding: 0; }
  body.web-development-page .platform-section .web-section-intro > p:last-child { width: auto; line-height: 24px; }
  body.web-development-page .platform-section h2 { width: auto; }
  body.web-development-page .platform-section { padding: 59px 0 53px; }
  body.web-development-page .platform-logos { display: grid; width: auto; justify-content: center; justify-items: center; margin-top: 34px; padding-inline: 32px; gap: 34px 26px; grid-template-columns: repeat(2, max-content); }
  body.web-development-page .platform-logos span:nth-child(1) { width: 108px; height: 31px; }
  body.web-development-page .platform-logos span:nth-child(2) { width: 133px; height: 30px; }
  body.web-development-page .platform-logos span:nth-child(3) { width: 205px; height: 30px; }
  body.web-development-page .platform-logos span:nth-child(4) { width: 77px; height: 21px; }
  body.email-marketing-page .email-tools { height: auto; margin-top: 80px; padding-bottom: 56px; }
  body.email-marketing-page .email-tools .section-intro { padding: 56px 24px 0; }
  body.email-marketing-page .email-tools .section-intro h2 { width: 100%; font-size: 40px; line-height: 42px; }
  body.email-marketing-page .email-tools .section-intro > p:last-of-type:not(.eyebrow) { width: 100%; margin-top: 20px; font-size: 16px; line-height: 24px; }
  body.email-marketing-page .email-tools__logos { margin-top: 40px; flex-wrap: wrap; gap: 28px; padding-inline: 24px; }
  body.email-marketing-page .email-tools__logos img { height: 34px; }
}

@media (max-width: 900px) {
  /* This Digital variant reuses email-tools, including its desktop text widths. */
  body.digital-marketing-page .email-tools { height: auto; min-height: 519px; padding-bottom: 60px; }
  body.digital-marketing-page .email-tools .section-intro h2,
  body.digital-marketing-page .email-tools .section-intro > p:last-of-type:not(.eyebrow) { width: 100%; max-width: 100%; }
  body.digital-marketing-page .email-tools__logos { flex-wrap: wrap; padding-inline: 16px; gap: 28px; }
  body.digital-marketing-page .email-tools__logos img { max-width: 100%; object-fit: contain; }
}

@media (max-width: 900px) {
  body.email-marketing-page .email-tools { padding-bottom: 60px; }
  body.email-marketing-page .email-tools .section-intro { max-width: 414px; padding: 60px 40px 0; }
  body.email-marketing-page .email-tools .section-intro h2 { margin-top: 32px; font-size: 32px; line-height: 32px; }
  body.email-marketing-page .email-tools .section-intro > p:last-of-type:not(.eyebrow) { margin-top: 24px; }
  body.email-marketing-page .email-tools__logos { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 30px 28px; margin-top: 40px; padding-inline: 26px; }
  body.email-marketing-page .email-tools__logos img { grid-column: span 2; width: 100%; max-width: 100%; height: 30px; object-fit: contain; }
  body.email-marketing-page .email-tools__logos img:nth-child(4) { grid-column: 2 / span 2; }
  body.email-marketing-page .email-tools__logos img:nth-child(5) { grid-column: 4 / span 2; }
}

/* Match the textured white Tools surface in the Web Development design. */
body.web-development-page .platform-section {
  background-color: #fff;
  background-image: var(--noise);
}
