/* Keep the existing review pill and typography. Real high-resolution brand
   sources must fit the native logo slot, not expand to their intrinsic width. */

/* Catalogue names share two native line-height rows. Keep the full name in
   the DOM, use the existing font at every breakpoint, and cap only its visual
   presentation: long company names must not create a third title row. */
.reviews__name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  block-size: 2lh;
  min-block-size: 2lh;
  max-block-size: 2lh;
  max-width: 100%;
  overflow: hidden;
  flex-shrink: 0;
}

/* The admitted full shared catalogue uses the same two-line name limit.
   Keep the original typography and complete accessible DOM text. */
.p-reviews[data-review-taxonomy="1"] .p-reviews-elem__name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* The native paper uses a306px preview with153/176 proportions. Some old
   JPEGs are intrinsically249/252px wide while new previews are2x. Give the
   common slot the native width, rather than deriving its height from each
   file's pixel count; keep the complete sheet visible with contain. */
.reviews__img > .reviews__fancy {
  flex: 0 1 306px;
  width: 100%;
  min-width: 0;
  max-width: 306px;
}

.reviews__fancy img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 153 / 176;
  object-fit: contain;
}

[data-client-review-id] .reviews__logo,
[data-client-review-id] .p-reviews-elem__logo {
  max-width: 100%;
}

[data-client-review-id] .reviews__logo img,
[data-client-review-id] .p-reviews-elem__logo img {
  display: block;
  width: 119px;
  height: 30px;
  max-width: 100%;
  object-fit: contain;
}

/* Two supplied raster canvases contain large verified empty margins. Frame
   only that empty area in CSS; source pixels and every painted glyph remain
   intact, with a four-source-pixel safety margin recorded in the registry. */
.client-review-logo-viewport {
  position: relative;
  display: block;
  width: min(119px, calc(var(--client-logo-ratio) * var(--client-logo-slot-height, 30px)));
  height: min(var(--client-logo-slot-height, 30px), calc(119px / var(--client-logo-ratio)));
  overflow: hidden;
  flex-shrink: 0;
}

[data-client-review-id] .client-review-logo-viewport > img {
  position: absolute;
  left: var(--client-logo-image-left);
  top: var(--client-logo-image-top);
  width: var(--client-logo-image-width);
  height: var(--client-logo-image-height);
  max-width: none;
  max-height: none;
  object-fit: contain;
}

/* Vertical brand lockups use the same native pill height, with less empty
   padding rather than a distorted or clipped logo. */
[data-client-review-id="stupino-kvadrat"] .reviews__logo,
[data-client-review-id="vrvent"] .reviews__logo {
  padding-top: 6px;
  padding-bottom: 6px;
}

[data-client-review-id="stupino-kvadrat"] .reviews__logo img,
[data-client-review-id="vrvent"] .reviews__logo img {
  height: 48px;
}

.a-clients__content > .client-review-brand {
  align-self: flex-start;
  width: fit-content;
}

/* Open the full scan without expanding the existing 255px paper presentation
   to the original image's intrinsic (often 1200–2400px) width. */
.a-clients__item[data-client-review-id] .a-clients__img {
  max-width: 100%;
}

.a-clients__item[data-client-review-id] .a-clients__img img {
  width: 255px;
  height: auto;
  max-width: 100%;
  aspect-ratio: auto;
  object-fit: contain;
}

[data-client-review-id] a.reviews__logo:focus-visible,
[data-client-review-id] a.p-reviews-elem__logo:focus-visible,
.client-review-brand:hover {
  filter: none;
}

[data-client-review-id] a.reviews__logo:focus-visible,
[data-client-review-id] a.p-reviews-elem__logo:focus-visible {
  outline: 2px solid var(--main-color-secondary);
  outline-offset: 3px;
}

[data-client-review-id] a.p-reviews-elem__logo:focus-visible img {
  filter: grayscale(0);
}

@media (max-width: 1023.98px) {
  .client-review-logo-viewport {
    --client-logo-slot-height: 21px;
  }

  [data-client-review-id] .reviews__logo img {
    width: 119px;
    height: 21px;
  }

  [data-client-review-id] .client-review-logo-viewport > img {
    width: var(--client-logo-image-width);
    height: var(--client-logo-image-height);
  }

  [data-client-review-id="stupino-kvadrat"] .reviews__logo img,
  [data-client-review-id="vrvent"] .reviews__logo img {
    height: 31px;
  }
}

/* This case's inherited CPL figures used fixed 167/234px flex children that
   escaped narrow cards before the review update. Keep the native figures and
   typography, but let their real flex boxes shrink/wrap inside each card. */
body[data-akiwa-path="/cases/seo/es-med-klinik/"] .co-problem__cpl-bottom,
body[data-akiwa-path="/cases/seo/es-med-klinik/"] .co-problem__cpl-bottom-block {
  min-width: 0;
  max-width: 100%;
}

/* The same inherited comparison column is a flex item: its automatic
   min-content width otherwise overrules the available desktop column. */
body[data-akiwa-path="/cases/seo/es-med-klinik/"] .co-problem__content {
  min-width: 0;
}
