/* Image + text, compatible with left/right variants */
@layer horeca.components {
  .horeca-blog-media-text {
    align-items: center;
    display: grid;
    gap: clamp(1.5rem, 3vw, 3rem);
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    margin: var(--horeca-space-6) 0;
    max-width: var(--horeca-wide-width);
  }

  /* Neutralize the float behavior added by legacy WordPress alignment classes. */
  .horeca-blog-media-text:is(.alignleft, .alignright) {
    float: none;
    margin: var(--horeca-space-6) 0;
    width: auto;
  }

  .horeca-blog-media-text :where(.alignleft, .alignright) {
    float: none;
    margin: 0;
  }

  .horeca-blog-media-text__media { grid-column: 1; }
  .horeca-blog-media-text__content { grid-column: 2; }

  .horeca-blog-media-text:is(.is-image-right, .alignright) .horeca-blog-media-text__media {
    grid-column: 2;
    grid-row: 1;
  }

  .horeca-blog-media-text:is(.is-image-right, .alignright) .horeca-blog-media-text__content {
    grid-column: 1;
    grid-row: 1;
  }

  .horeca-blog-media-text:has(.horeca-blog-media-text__media.alignright) .horeca-blog-media-text__media {
    grid-column: 2;
    grid-row: 1;
  }

  .horeca-blog-media-text:has(.horeca-blog-media-text__media.alignright) .horeca-blog-media-text__content {
    grid-column: 1;
    grid-row: 1;
  }

  .horeca-blog-media-text img {
    border-radius: var(--horeca-radius-sm);
    display: block;
    height: auto;
    width: 100%;
  }

  /* Small assets: same 5fr/6fr split as default; don't stretch image tall. */
  .horeca-blog-media-text.is-compact {
    align-items: start;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  }

  .horeca-blog-media-text.is-compact .horeca-blog-media-text__media {
    max-width: none;
    width: auto;
    max-height: 22rem;
  }

  .horeca-blog-media-text.is-compact img {
    width: 100%;
    height: auto;
    max-height: 22rem;
    object-fit: contain;
    object-position: top center;
  }

  .horeca-blog-media-text__content.horeca-blog-lead {
    margin: 0;
    max-width: none;
  }

  .horeca-blog-media-text__content > :first-child { margin-top: 0; }
  .horeca-blog-media-text__content > :last-child { margin-bottom: 0; }

  @media (max-width: 43.75rem) {
    .horeca-blog-media-text,
    .horeca-blog-media-text:is(.is-image-right, .alignright),
    .horeca-blog-media-text.is-compact,
    .horeca-blog-media-text.is-compact.is-image-right {
      align-items: start;
      gap: var(--horeca-space-4);
      grid-template-columns: 1fr;
      margin: 2.25rem 0;
    }

    .horeca-blog-media-text .horeca-blog-media-text__media,
    .horeca-blog-media-text:is(.is-image-right, .alignright) .horeca-blog-media-text__media,
    .horeca-blog-media-text.is-compact .horeca-blog-media-text__media {
      grid-column: 1;
      grid-row: 1;
      max-width: 100%;
      max-height: 18rem;
      width: auto;
      justify-self: start;
    }

    .horeca-blog-media-text.is-compact img {
      max-height: 18rem;
    }

    .horeca-blog-media-text:has(.horeca-blog-media-text__media.alignright) .horeca-blog-media-text__media {
      grid-column: 1;
      grid-row: 1;
    }

    .horeca-blog-media-text .horeca-blog-media-text__content,
    .horeca-blog-media-text:is(.is-image-right, .alignright) .horeca-blog-media-text__content,
    .horeca-blog-media-text.is-compact .horeca-blog-media-text__content {
      grid-column: 1;
      grid-row: 2;
    }


    .horeca-blog-media-text:has(.horeca-blog-media-text__media.alignright) .horeca-blog-media-text__content {
      grid-column: 1;
      grid-row: 2;
    }

    .horeca-blog-media-text__content { overflow-wrap: anywhere; }
  }
}