/* Business: keep legacy two-up excursion cards responsive without editing articles. */
/* The original articles use inline flex-basis:calc(50% - ...) with 250–270px
   minimums. The Business centre column is narrower, so flex wraps every card. */
@media (min-width: 768px) {
  body.com-content.view-article .astroid-article-text
  div[style*="flex-wrap: wrap"]:has(> [style*="calc(50%"])
  {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch;
  }
}

body.com-content.view-article .astroid-article-text
div[style*="flex-wrap: wrap"]:has(> [style*="calc(50%"])
> [style*="calc(50%"] {
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100%;
}

@media (max-width: 767px) {
  body.com-content.view-article .astroid-article-text
  div[style*="flex-wrap: wrap"]:has(> [style*="calc(50%"])
  {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Shopping cards have a fixed 132px picture; two cards in the Business
   centre column need a smaller rendered picture to leave room for text. */
@media (min-width: 768px) {
  body.com-content.view-article .astroid-article-text
  div[style*="flex-wrap: wrap"]:has(> a[style*="calc(50%"] > img[style*="132px"])
  > a > img[style*="132px"] {
    flex-basis: clamp(72px, 7vw, 94px) !important;
    width: clamp(72px, 7vw, 94px) !important;
    height: auto !important;
    min-height: 100%;
  }
  body.com-content.view-article .astroid-article-text
  div[style*="flex-wrap: wrap"]:has(> a[style*="calc(50%"] > img[style*="132px"])
  > a > span {
    padding: 8px !important;
  }
}

/* Astroid's generic small rule sets letter-spacing:1em. In the right-hand
   contact module that separates every letter of phone numbers and handles. */
.astroid-framework .rus-contact-card .rus-method small,
.astroid-framework .rus-contact-card .rus-method small.rus-phone {
  letter-spacing: normal !important;
  word-break: normal;
  text-align: left;
}

/* The legacy 23px inline heading is wider than the 170px article text area
   at 320px; reduce only this heading pattern at that breakpoint. */
@media (max-width: 360px) {
  body.com-content.view-article .astroid-article-text
  h2[style*="clamp(23px,3vw,29px)"] {
    font-size: 18px !important;
  }
}