/* Post-card images: always show the WHOLE picture - no crop, no letterbox bands.
   Wrappers take the image's own height; the older fixed aspect-ratio / cover / contain rules are overridden here. */
.ok-card__image,
.ok-feature__image,
.ok-item__image,
.ok-community-card__image,
.ok-news-category-feature-image,
.ok-editorial-row-image{
  aspect-ratio:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  align-self:start;
  overflow:hidden;
  background:transparent!important;
}
.ok-card__image img,
.ok-feature__image img,
.ok-item__image img,
.ok-community-card__image img,
.ok-news-category-feature-image img,
.ok-editorial-row-image img,
.ok-news-mini-card img,
.ok-single-related-grid img{
  display:block;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
}
.ok-sidebar-posts img{
  height:auto!important;
  object-fit:contain!important;
  align-self:start;
}
.ok-news-mini-card{height:auto!important}

/* WordPress/Chrome "sizes=auto" lazy images get contain:size + a 3000x1500 intrinsic size, which makes
   height:auto images 1500px tall. The width/height attributes already reserve the correct ratio (no CLS). */
img:is([sizes="auto" i],[sizes^="auto," i]){
  contain:none!important;
  contain-intrinsic-size:none!important;
}

/* Hero slider: show the whole banner (it contains text) over a blurred backdrop of itself */
.ok-hero-card__image{position:relative;overflow:hidden;background:#f3ebe0}
.ok-hero-card__image::before{content:"";position:absolute;inset:-24px;background:var(--ok-hero-bg) center/cover no-repeat;filter:blur(22px) saturate(1.1);opacity:.85}
@media (min-width:1024px){
.ok-hero-card__image img{position:relative;object-fit:contain!important}
}

/* WCAG 2.2 target size: slider dots keep their look but get a >=24px hit area */
.ok-slider-dots button{position:relative}
.ok-slider-dots button::after{position:absolute;inset:-7px;content:""}

/* /news/ category blocks: let each mini card take the height its (uncropped) image needs */
.ok-news-category-links{grid-template-rows:none!important;grid-auto-rows:auto!important;height:auto!important;align-content:start}
.ok-news-mini-card img{flex:0 0 auto!important;min-height:0}
