/* V244 - Brand details belong beside their action, not midway up the card.
   Animate the real content height (0fr -> 1fr) instead of jumping to an
   arbitrary max-height. Applies to both Home and the dedicated Brands page. */
body[data-design-system="2026"] main .brand-showcase .card > .brand-description-reveal {
  position:relative!important;
  z-index:3!important;
  display:grid!important;
  grid-template-rows:minmax(0,1fr);
  flex:0 0 auto!important;
  width:calc(100% - 12px)!important;
  min-width:0!important;
  margin:0 6px 13px!important;
  padding:0!important;
  opacity:1;
  transform:translateY(0) scale(1);
  transform-origin:center bottom;
  transition:grid-template-rows .38s cubic-bezier(.22,1,.36,1),
             opacity .3s ease, transform .38s cubic-bezier(.22,1,.36,1),
             margin-bottom .38s cubic-bezier(.22,1,.36,1)!important;
}
body[data-design-system="2026"] main .brand-showcase .card > .brand-description-reveal > .brand-description-reveal-inner {
  min-height:0!important;
  min-width:0!important;
  overflow:hidden!important;
}
body[data-design-system="2026"] main .brand-showcase .card .brand-description-reveal p.brand-description {
  margin:0!important;
  padding:0!important;
  max-width:none!important;
  color:var(--mute,#576574);
  font:400 clamp(13px,1vw,17px)/1.55 var(--body-font,Inter,sans-serif)!important;
}
/* Full-background cards: keep the service subtitle immediately above the
   CTA when the description is hidden. On reveal the copy grows UPWARD,
   remaining next to the action and never floating in empty card space. */
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full > small.brand-service-pill {
  margin:auto 0 10px!important;
  align-self:stretch!important;
  flex:0 0 auto!important;
}
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full > .brand-description-reveal {
  width:100%!important;
  margin:0 0 12px!important;
}
body[data-design-system="2026"] main .brand-showcase .card.brand-layout-full .brand-description-reveal p.brand-description {
  color:var(--brand-content-ink,#fff)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.12)!important;
  font:400 14px/1.55 var(--body-font,Inter,sans-serif)!important;
}
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full > a[data-brand] {
  margin:0!important;
  padding:13px 0 0!important;
}
/* Where the subtitle is omitted, the description itself sits beside the CTA. */
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full:not(:has(> .brand-service-pill)) > .brand-description-reveal {
  margin-top:auto!important;
}
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full:not(:has(> .brand-service-pill)):not(:has(> .brand-description-reveal)) > a[data-brand] {
  margin-top:auto!important;
}
/* Healthcare's optional description stays after the service information and
   immediately before the bottom CTA (same position in hover mode). */
body[data-design-system="2026"] main .brand-showcase .care .card.big > .brand-description-reveal {
  margin-top:auto!important;
  margin-bottom:12px!important;
}
body[data-design-system="2026"] main .brand-showcase .care .card.big.brand-layout-full > .brand-description-reveal {
  width:100%!important;
  margin-bottom:12px!important;
}
body[data-design-system="2026"] main .brand-showcase .care .card.big:has(> .brand-description-reveal) > a[data-brand] {
  margin-top:0!important;
}
/* Grid-row interpolation keeps varying description lengths readable and
   avoids the snap created by a very large max-height. */
@media (hover:hover) and (pointer:fine) {
  body[data-design-system="2026"] main .brand-showcase .card.brand-desc-mode-hover > .brand-description-reveal {
    grid-template-rows:minmax(0,0fr)!important;
    opacity:0!important;
    transform:translateY(8px) scale(.985)!important;
    margin-bottom:0!important;
    pointer-events:none!important;
  }
  body[data-design-system="2026"] main .brand-showcase .card.brand-desc-mode-hover:is(:hover,:focus-within) > .brand-description-reveal {
    grid-template-rows:minmax(0,1fr)!important;
    opacity:1!important;
    transform:translateY(0) scale(1)!important;
    margin-bottom:12px!important;
    pointer-events:auto!important;
  }
}
/* No hover on touch: the description stays visible and the action remains
   usable. Motion-sensitive visitors get the content with no animation. */
@media (prefers-reduced-motion:reduce) {
  body[data-design-system="2026"] main .brand-showcase .card > .brand-description-reveal {
    transition:none!important;
  }
}

/* Reserve enough room for the text to expand upward without stretching an
   otherwise equal-height property card for an ordinary three-line summary. */
body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full {
  padding-top:125px!important;
}
@media(max-width:560px) {
  body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full {
    padding-top:120px!important;
  }
}
@media (hover:hover) and (pointer:fine) {
  /* This must outrank the full-card default margin from earlier styles. */
  body[data-design-system="2026"] main .brand-showcase .prop .card.brand-layout-full.brand-desc-mode-hover:not(:hover):not(:focus-within) > .brand-description-reveal {
    margin-bottom:0!important;
  }
  body[data-design-system="2026"] main .brand-showcase .care .card.big.brand-desc-mode-hover:not(:hover):not(:focus-within) > .brand-description-reveal {
    margin-bottom:0!important;
  }
}