/* Editorial layer for the existing blog DOM. The source's image geometry,
   masonry packing, block grid, metadata order and mobile table labels stay intact. */

/* A compact listing introduction sits outside the existing masonry packer. */
html[data-match-design="v1"] body.view-list [data-match-blog-intro] {
  margin: 0 auto var(--match-group-space);
  text-align: center;
}
html[data-match-design="v1"] body.view-list [data-match-blog-listing-heading] {
  max-width: 24ch;
  margin: 0 auto;
  padding: 0;
  color: var(--match-text);
  font-family: var(--match-font-display);
  font-size: clamp(2rem, 1.35rem + 2.5vw, 3.5rem);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.035em;
  text-wrap: balance;
}

/* The packer reads this vertical gap; photograph width and crop stay native. */
html[data-match-design="v1"] body.view-list [data-match-native-layout="blog-masonry"] {
  --match-editorial-card-gap: var(--match-block-space);
}
html[data-match-design="v1"] body.view-item .blog-item-content .sqs-block {
  padding-top: 16px;
  padding-bottom: 16px;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-top-wrapper {
  max-width: 68ch;
  margin-inline: auto;
  margin-bottom: var(--match-space-6);
  font-family: var(--match-font-body);
  font-size: clamp(1.0625rem, 1rem + .15vw, 1.125rem);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-title h1.entry-title {
  max-width: 22ch;
  margin: 0;
  color: var(--match-text);
  font-family: var(--match-font-display);
  font-size: clamp(2.125rem, 1.35rem + 3.2vw, 4.25rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.035em;
  text-wrap: balance;
  overflow-wrap: break-word;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-meta-wrapper {
  column-gap: var(--match-space-2);
  row-gap: var(--match-space-1);
  color: var(--match-muted);
  font-family: var(--match-font-body);
  font-size: .8125rem;
  line-height: 1.5;
  letter-spacing: .01em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-meta-wrapper :is(a, time, .blog-meta-item) {
  color: inherit;
  font: inherit;
}

/* Author images no longer depend on the archived lazy image controller.
   Keep their source link and sibling biography in normal document flow. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper {
  box-sizing: border-box;
  width: 100%;
  max-width: 68ch;
  margin: var(--match-group-space) auto;
  padding-top: var(--match-block-space);
  border-top: 1px solid var(--match-line);
  align-items: flex-start;
  gap: 16px;
  color: var(--match-muted);
  font-family: var(--match-font-body);
  font-size: clamp(1.0625rem, 1rem + .15vw, 1.125rem);
  line-height: 1.65;
  text-align: left;
  overflow-wrap: anywhere;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper > a:has(.author-avatar) {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  max-width: 100%;
  color: var(--match-text);
  text-decoration: none;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper .author-avatar {
  position: relative;
  display: block;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  margin: 0;
  border-radius: 50%;
  overflow: hidden;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper .author-avatar-image {
  position: static !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper :is(.author-name, .author-bio, .author-website) {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  color: inherit;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  text-align: left;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper .author-name {
  font-weight: 600;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper :is(.author-website, .author-bio a) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-author-profile-wrapper a:focus-visible {
  outline: 2px solid var(--match-text);
  outline-offset: 4px;
  border-radius: 4px;
}

/* The captured pagination used inverse-accent black on a black background.
   Restore contrast through its own tokens; retain native labels and destinations. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] {
  --tweak-blog-item-pagination-title-color: var(--match-text);
  --tweak-blog-item-pagination-meta-color: var(--match-muted);
  --tweak-blog-item-pagination-icon-color: var(--match-text);
}

/* Native half-width links must let their title shrink around the fixed icon. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] .item-pagination-link {
  min-width: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] .pagination-title-wrapper {
  min-width: 0;
  overflow-wrap: anywhere;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] .item-pagination-icon {
  flex-shrink: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] .item-pagination-title {
  font-family: var(--match-font-display);
  font-weight: 500;
}

@media (max-width: 767px) {
  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #itemPagination[data-collection-type="blog-masonry"] .item-pagination-title {
    font-size: 20px;
    line-height: 1.2;
  }
}

/* Restrict the reading measure to text blocks, leaving galleries, photographs,
   buttons and the Squarespace row/column boundaries at their original width. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content {
  max-width: 68ch;
  margin-inline: auto;
  color: var(--match-text);
  font-family: var(--match-font-body);
  font-size: clamp(1.0625rem, 1rem + .15vw, 1.125rem);
  line-height: 1.72;
  overflow-wrap: break-word;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content :is(h2, h3, h4, h5, h6) {
  color: var(--match-text);
  font-family: var(--match-font-display);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
  text-wrap: balance;
  scroll-margin-top: 7rem;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content h2 {
  margin: 2.5em 0 .75em;
  font-size: clamp(1.65rem, 1.3rem + 1vw, 2.25rem);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content h3,
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content [data-match-heading-style="article-section"] {
  margin: 2em 0 .7em;
  font-size: clamp(1.35rem, 1.15rem + .65vw, 1.75rem);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content :is(h4, h5, h6) {
  margin: 1.75em 0 .65em;
  font-size: 1.1875rem;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content :is(p, ul, ol) {
  margin: 1.1em 0;
  font-size: inherit;
  line-height: inherit;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content :is(ul, ol) {
  padding-inline-start: 1.35em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content li {
  padding-inline-start: .2em;
  margin-block: .5em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content li > :is(ul, ol) {
  margin-block: .5em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content blockquote {
  margin: var(--match-space-4) 0;
  padding: var(--match-space-1) 0 var(--match-space-1) var(--match-space-3);
  border-inline-start: 2px solid var(--match-line);
  color: var(--match-text);
  font-family: var(--match-font-display);
  font-size: 1.25rem;
  line-height: 1.5;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content > :first-child {
  margin-top: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content > :last-child {
  margin-bottom: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content a,
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about) a {
  color: var(--match-text);
  text-decoration: underline;
  text-decoration-color: var(--match-muted);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-content .sqs-html-content a:hover,
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about) a:hover {
  text-decoration-color: currentColor;
}

/* These known code boxes embed ID-specific styles after the document
   head. The family + ID scope wins that cascade without changing their HTML. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about, #mp-comparison-table, #mp-format-table),
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about, #mp-comparison-table, #mp-format-table) * {
  font-family: var(--match-font-body);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about) {
  max-width: 68ch;
  margin-inline: auto;
  color: var(--match-muted);
  font-size: clamp(1.0625rem, 1rem + .15vw, 1.125rem);
  line-height: 1.65;
  background-image: none;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-keybox {
  padding: var(--match-space-3);
  background: var(--match-card-bg);
  border: 1px solid var(--match-card-line);
  border-radius: var(--match-card-radius);
  box-shadow: var(--match-card-shadow);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-about {
  padding: var(--match-space-3) 18px;
  background: var(--match-shell-bg);
  border: 0;
  border-top: 1px solid transparent;
  border-radius: var(--match-shell-radius);
  box-shadow: inset 0 0 0 1px var(--match-shell-line);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about) .mp-h {
  margin: 0 0 var(--match-space-2);
  color: var(--match-text);
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .08em;
  text-transform: uppercase;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-keybox, #mp-about) :is(strong, em) {
  color: var(--match-text);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-keybox li {
  margin-block: .55em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-keybox .mp-sep {
  margin-block: var(--match-space-3);
  background: var(--match-line);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-keybox ul.mp-toc {
  column-gap: var(--match-space-4);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) {
  background: transparent;
  color: var(--match-text);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) .mp-wrap {
  background: var(--match-card-bg);
  border-color: var(--match-card-line);
  border-radius: var(--match-card-radius);
  box-shadow: var(--match-card-shadow);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) :is(th, td) {
  border-color: var(--match-card-line);
  line-height: 1.55;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) th {
  background: var(--match-card-bg);
  color: var(--match-muted);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) td {
  color: var(--match-muted);
  font-size: 1rem;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) td:first-child {
  color: var(--match-text);
  font-weight: 600;
  white-space: normal;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) tbody tr:hover {
  background: var(--match-card-bg);
}

/* The newer articles use div grids rather than table elements. Their desktop
   track ratios and mobile single-column rows remain source-controlled. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) {
  --bg: var(--match-bg);
  --card: var(--match-card-bg);
  --line: var(--match-card-line);
  --text: var(--match-text);
  --muted: var(--match-muted);
  --radius: var(--match-card-radius);
  background: transparent;
  font-family: var(--match-font-body);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) > [class$="-wrap"] {
  background: var(--match-card-bg);
  border-color: var(--match-card-line);
  border-radius: var(--match-card-radius);
  box-shadow: var(--match-card-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-head"] {
  background: var(--match-card-bg);
  color: var(--match-muted);
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: .06em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-label"] {
  color: var(--match-text);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-text"] {
  color: var(--match-muted);
  font-size: 1rem;
  line-height: 1.55;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-text"]::before {
  color: var(--match-muted);
}

/* The two-column location comparison shares an ID with an older table, but
   has its own div-grid wrapper. Match its materials without changing tracks. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item section#mp-format-table {
  --card: var(--match-card-bg);
  --line: var(--match-card-line);
  --radius: var(--match-card-radius);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-format-table > .mp-format-wrap {
  background: var(--match-card-bg);
  border-color: var(--match-card-line);
  border-radius: var(--match-card-radius);
  box-shadow: var(--match-card-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-format-table .mp-format-head {
  background: var(--match-card-bg);
}

/* Three articles use a class-based comparison table with native horizontal
   scrolling. Keep its widths, column proportions and scroll container. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .mp-table-wrap > .mp-compare-table {
  background: var(--match-card-bg);
  border-color: var(--match-card-line);
  border-radius: var(--match-card-radius);
  box-shadow: var(--match-card-shadow);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .mp-compare-table :is(th, td) {
  border-color: var(--match-card-line);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .mp-compare-table thead th,
html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .mp-compare-table tbody tr:nth-child(even) td {
  background: var(--match-card-bg);
}

/* Source pixel minima exceed the article width on tablets and get clipped by
   the rounded wrapper. Flexible minima preserve those ratios and all text. */
@media (min-width: 768px) {
  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-position-table {
    --match-editorial-table-tracks: minmax(0, 1.15fr) minmax(0, .8fr) minmax(0, .95fr);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-background-guide-table {
    --match-editorial-table-tracks: minmax(0, 1.05fr) minmax(0, .95fr) minmax(0, 1.35fr);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-session-rate-table {
    --match-editorial-table-tracks: minmax(0, 1.05fr) minmax(0, .9fr) minmax(0, 1.1fr);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-format-budget-table {
    --match-editorial-table-tracks: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1fr);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-corporate-program-table {
    --match-editorial-table-tracks: minmax(0, 1.05fr) minmax(0, .8fr) minmax(0, .85fr);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) :is([class$="-head"], [class$="-row"]) {
    grid-template-columns: var(--match-editorial-table-tracks);
    overflow-wrap: anywhere;
  }
}

/* Each captured div row is label + text + text. Source nth-of-type(1)/(2)
   counted the leading label div and attached the wrong mobile heading. Keep
   the exact source heading strings, associated with their actual columns. */
@media (max-width: 767px) {
  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-position-table {
    --match-editorial-label-1: "How it reads";
    --match-editorial-label-2: "Best for";
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-background-guide-table {
    --match-editorial-label-1: "Recommended Backgrounds";
    --match-editorial-label-2: "Notes";
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-session-rate-table {
    --match-editorial-label-1: "Typical NYC Range";
    --match-editorial-label-2: "Match Production Starting Rate";
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-format-budget-table {
    --match-editorial-label-1: "Best For";
    --match-editorial-label-2: "Budget Logic";
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-corporate-program-table {
    --match-editorial-label-1: "People";
    --match-editorial-label-2: "Price";
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-row"] > [class$="-text"]::before {
    display: block;
    margin-bottom: 4px;
    color: var(--match-muted);
    font-size: 11px;
    line-height: 1.4;
    letter-spacing: .12em;
    text-transform: uppercase;
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-row"] > [class$="-text"]:nth-of-type(2)::before {
    content: var(--match-editorial-label-1);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-position-table, #mp-background-guide-table, #mp-session-rate-table, #mp-format-budget-table, #mp-corporate-program-table) [class$="-row"] > [class$="-text"]:nth-of-type(3)::before {
    content: var(--match-editorial-label-2);
  }
}

/* Native masonry retains every column, gap and image crop. The inset stroke
   leaves photograph width intact; only the text receives the roster inset. */
html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-item {
  background: var(--match-card-bg);
  border-radius: var(--match-card-radius);
  box-shadow: inset 0 0 0 1px var(--match-card-line);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-image-wrapper {
  margin-bottom: 0;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-image-wrapper .image-wrapper {
  border-radius: var(--match-card-radius) var(--match-card-radius) 0 0;
  overflow: hidden;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-item-summary {
  box-sizing: border-box;
  padding: 18px;
  font-family: var(--match-font-body);
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-title {
  max-width: 22ch;
  margin-block: var(--match-space-2);
  color: var(--match-text);
  font-family: var(--match-font-display);
  font-weight: 500;
  letter-spacing: -.025em;
  text-wrap: balance;
  overflow-wrap: break-word;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-title a {
  color: inherit;
  font: inherit;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-meta-section {
  color: var(--match-muted);
  font-size: .75rem;
  line-height: 1.5;
  letter-spacing: .015em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-excerpt,
html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-excerpt p {
  color: var(--match-muted);
  font-family: var(--match-font-body);
  font-size: 1rem;
  line-height: 1.65;
}

html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-more-link {
  color: var(--match-text);
  font-family: var(--match-font-body);
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .25em;
}

html[data-match-design="v1"] body.collection-type-blog-masonry:is(.view-item, .view-list) :is(.blog-item-content, .blog-item-summary, .blog-item-meta-wrapper) a:focus-visible {
  outline: 2px solid var(--match-text);
  outline-offset: 4px;
}

@media (min-width: 761px) {
  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) :is(th, td) {
    padding: var(--match-space-2) var(--match-space-3);
  }
}

@media (max-width: 760px) {
  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item .blog-item-top-wrapper {
    margin-bottom: var(--match-space-4);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-keybox {
    padding: var(--match-space-2);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item #mp-about {
    padding-inline: 16px;
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-list .blog-item-summary {
    padding: 16px;
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) tr {
    border-color: var(--match-card-line);
  }

  html[data-match-design="v1"] body.collection-type-blog-masonry.view-item :is(#mp-comparison-table, #mp-format-table) td::before {
    color: var(--match-muted);
  }
}

/* These labels gain section semantics while retaining their original paragraph
   typography and rhythm. The sibling stays a paragraph-to-paragraph distance. */
html[data-match-design="v1"] #siteWrapper main .blog-item-content .sqs-html-content [data-match-heading-style="article-subsection-label"],
html[data-match-design="v1"] #siteWrapper main .blog-item-content .sqs-html-content [data-match-heading-style="article-numbered-label"] {
  font-family: var(--match-font-body) !important;
  font-size: inherit !important;
  font-weight: 400 !important;
  font-style: normal;
  line-height: inherit !important;
  letter-spacing: normal !important;
  text-align: start;
  text-transform: none;
  text-wrap: wrap;
  scroll-margin-top: 0;
  color: inherit;
  max-width: none;
  padding: 0;
  margin: 1.1em 0;
}
html[data-match-design="v1"] #siteWrapper main .blog-item-content .sqs-html-content > [data-match-heading-style="article-subsection-label"] {
  margin-block: var(--match-prose-space) !important;
}
html[data-match-design="v1"] #siteWrapper main .blog-item-content .sqs-html-content > [data-match-heading-style="article-subsection-label"] + :is(p,ul,ol) {
  margin-top: var(--match-prose-space) !important;
}
html[data-match-design="v1"] #siteWrapper main .blog-item-content .sqs-html-content [data-match-heading-style="article-section-preserved"] {
  font-size: clamp(1.65rem, 1.3rem + 1vw, 2.25rem);
  margin-block: var(--match-section-space) var(--match-heading-space) !important;
}