/* 24iFM section rhythm · 26 October 2026. Marketing routes only.
   Preserve hero/header composition, typography, media ratios and control hit areas. */
body[data-page] {
  --section-block: 52px;
  --section-title-gap: 16px;
  --section-copy-gap: 10px;
  --collection-gap: 20px;
  --tab-layer-gap: 12px;
  --tab-content-gap: 16px;
}
body[data-page] main .section { padding-block: var(--section-block); }
body[data-page] main .section-intro { margin-bottom: var(--section-title-gap); }
body[data-page] main .section-intro > p { margin-top: var(--section-copy-gap); }
body[data-page] main .overview-heading { margin-bottom: 18px; }
body[data-page] main .card-grid { gap: var(--collection-gap); }
body[data-page] main .card-grid.five { gap: 14px; }
body[data-page] main .image-content-card { gap: 10px; }
body[data-page] main .feature-copy > p { margin-top: 12px; }
body[data-page] main .feature-copy > .benefits { margin-top: 16px; }
body[data-page] main .benefits { row-gap: 10px; }
body[data-page] main .story-row > div > p { margin-top: 10px; }
body[data-page] main .story-row .button { margin-top: 20px; }

/* Two tab levels form one compact group; buttons retain their original hit areas. */
body[data-page] main .primary-tabs { margin-bottom: var(--tab-layer-gap); }
body[data-page] main .secondary-tabs {
  margin-bottom: var(--tab-content-gap);
  column-gap: 20px;
}
body[data-page] main .expanded-workspace > .section-intro { margin-bottom: 18px; }
body[data-page] main .homepage-platform.section { padding-block: 32px 38px; }
body[data-page] main .home-technology { padding-top: 32px; }
body[data-page] main .ecosystem-flows { padding-top: 38px; }
body[data-page] main .technology-gallery { padding-top: 26px; }
body[data-page] main .technology-grid { margin-top: 20px; }

/* Category title and rail controls share a row without adding another large gap. */
body[data-page] main .partner-categories { padding-block: 32px 20px; }
body[data-page] main .partner-categories > .section-intro { margin-bottom: 16px; }
body[data-page] main .industry-heading { margin-bottom: 4px; }
/* Bleed space keeps hover shadows inside the horizontal scrollport.
   Negative margins preserve the existing card positions and section rhythm. */
body[data-page] main .industry-rail { padding: 12px 20px 32px; margin: -10px -20px -22px; }
body[data-page] main .partner-categories .industry-group + .industry-group { margin-top: 26px; }
body[data-page] main .inline-partner-tools { margin-top: 12px; }
body[data-page] main .inline-partner-tools .secondary-tabs { margin-bottom: 16px; }
body[data-page] main .inline-partner-tools .feature-copy > p { margin-top: 10px; }
body[data-page] main .inline-partner-tools .how-it-works ol { margin-top: 12px; }
body[data-page] main .join-process { padding-bottom: 20px; }
body[data-page] main .join-process ol { margin-top: 20px; }

/* Estate identities need optical clear space, unlike the compact content groups. */
body[data-page] main .logo-wall { padding-block: 24px 32px; }
body[data-page] main .logo-heading { margin-bottom: 24px; }
body[data-page] main .logo-set { gap: 32px; padding-right: 32px; }
body[data-page] main .estate-logo {
  width: 164px;
  height: 112px;
  padding: 24px 16px;
  background: #fff;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body[data-page] main .estate-logo img {
  width: auto;
  height: auto;
  max-width: 132px;
  max-height: 62px;
  object-fit: contain;
}

@media (max-width: 760px) {
  body[data-page] { --section-block: 32px; --section-title-gap: 16px; --tab-content-gap: 12px; }
  body[data-page] main .overview-heading { margin-bottom: 18px; }
  body[data-page] main .primary-tabs { margin-bottom: 16px; }
  body[data-page] main .secondary-tabs { margin-bottom: 12px; column-gap: 16px; }
  body[data-page] main .homepage-platform.section { padding-block: 26px; }
  body[data-page] main .home-technology { padding-top: 26px; }
  body[data-page] main .ecosystem-flows { padding-top: 26px; }
  body[data-page] main .technology-gallery { padding-top: 26px; }
  body[data-page] main .technology-grid { margin-top: 16px; }
  body[data-page] main .partner-categories { padding-block: 20px 16px; }
  body[data-page] main .partner-categories > .section-intro { margin-bottom: 12px; }
  body[data-page] main .partner-categories .industry-group + .industry-group { margin-top: 26px; }
  body[data-page] main .inline-partner-tools .secondary-tabs { margin-bottom: 12px; }
  body[data-page] main .inline-partner-tools .partner-feature { row-gap: 16px; }
  body[data-page] main .platform-feature,
  body[data-page] main .platform-feature:has(.portrait),
  body[data-page] main .story-row,
  body[data-page] main .faq { row-gap: 20px; }
  body[data-page] main .logo-wall { padding-block: 16px 24px; }
  body[data-page] main .logo-heading { margin-bottom: 20px; }
  body[data-page] main .logo-set { gap: 24px; padding-right: 24px; }
  body[data-page] main .estate-logo { width: 144px; height: 96px; padding: 20px 14px; }
  body[data-page] main .estate-logo img { max-width: 110px; max-height: 56px; }
}
@media (max-width: 374px) {
 body[data-page] main .industry-rail { padding-inline: 16px; margin-inline: -16px; }
}