/**
 * Zen Addons Pro - Hover Card design library (24 Pro designs).
 *
 * Hex values, sizes and effects are tuned to the canonical Claude Design spec
 * ("Hover Card Widget.dc.html", project 559ffdf9), layouts 03-10 x 3 skins. Each
 * design is a self-contained look built ONLY on the markup the free Hover Card
 * widget already emits:
 *
 *   .zaso-hover-card (wrapper)
 *     .zaso-hover-card__box
 *       .zaso-hover-card__media > img
 *       .zaso-hover-card__caption > .zaso-hover-card__caption-title  (hidden here)
 *       .zaso-hover-card__modal (the hover-reveal panel)
 *         .zaso-hover-card__modal-title + p + a.zaso-hover-card__modal-action
 *
 * The six FREE designs (layouts 01 slide-up + 02 overlay) apply the shared base FX
 * (rounded clipped card, image zoom on hover, card lift + deeper shadow, bottom
 * vignette, hidden caption) to their own six ids only, in the compiled free LESS.
 * This Pro sheet therefore self-applies that same base FX to its own 24 ids, then
 * layers the per-layout reveal + per-skin colours on top. Skins colour only the
 * reveal panel (__modal / side panel / badge / card / strip) and its button; they
 * NEVER paint a gradient over __media, so the user's uploaded image always shows
 * through (the design's demo image gradient is a preview-only device).
 *
 * Every rule is scoped with a TRIPLED wrapper class
 * `.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-<id>` (specificity
 * 0,3,0 for the wrapper, 0,4,0 for children, 0,4,1 for the button) so it
 * deterministically beats the free base regardless of stylesheet load order, with
 * no !important. The free Hover Card base compiles OPAQUE defaults (a hidden
 * <img>, a default __modal fill) into every instance under the `.so-widget-<id>`
 * (0,2,0) / `... a.zaso-hover-card__modal-action` (0,3,1) scope; a merely DOUBLED
 * Pro selector only ties those and loses on load order. The extra root class clears
 * the tie. :focus-within mirrors :hover everywhere so keyboard users get the same
 * reveal. Loads only when licensed.
 *
 * @package Zen Addons for SiteOrigin Page Builder Pro
 */

/* ============================================================ */
/* Shared base FX (all 24 Pro design variants)                  */
/* Rounded, clipped card; image zoom on hover; card lift +      */
/* deeper shadow; bottom vignette; hidden always-on caption.    */
/* ============================================================ */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba( 15, 23, 42, 0.14 );
  transition: transform 0.45s cubic-bezier( 0.4, 0, 0.2, 1 ), box-shadow 0.45s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__box,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__box {
  border-radius: inherit;
  overflow: hidden;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__media,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__media {
  position: relative;
  overflow: hidden;
  line-height: 0;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__media img {
  visibility: visible;
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.6s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__media::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__media::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  background: linear-gradient( to top, rgba( 0, 0, 0, 0.34 ), rgba( 0, 0, 0, 0 ) 55% );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__caption,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__caption {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:focus-within,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:focus-within {
  transform: translateY( -4px );
  box-shadow: 0 26px 54px rgba( 15, 23, 42, 0.3 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:focus-within .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:hover .zaso-hover-card__media img,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:focus-within .zaso-hover-card__media img {
  transform: scale( 1.09 );
}

/* ============================================================ */
/* LAYOUT 03 - side-panel (left 158px panel, slides in from left) */
/* __modal = left panel, translateX(-100%) -> 0 on hover.        */
/* ============================================================ */
/* ----- side-panel-white ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__modal {
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
  width: 158px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px 18px;
  background: #ffffff;
  opacity: 1;
  transform: translateX( -100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white:focus-within .zaso-hover-card__modal {
  transform: translateX( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white .zaso-hover-card__modal p {
  margin: 0 0 12px;
  padding: 0;
  color: #64748b;
  font-size: 11.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #78350f;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white a.zaso-hover-card__modal-action:focus {
  background: #5c2a0c;
  color: #ffffff;
  border: 0;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-white a.zaso-hover-card__modal-action::after { content: "\e5c8"; font-family: "ZASO Material Symbols Rounded"; font-weight: normal; font-style: normal; line-height: 1; font-size: 1.1em; font-variation-settings: 'wght' 600; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* ----- side-panel-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__modal {
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
  width: 158px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px 18px;
  background: #0f172a;
  opacity: 1;
  transform: translateX( -100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark:focus-within .zaso-hover-card__modal {
  transform: translateX( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark .zaso-hover-card__modal p {
  margin: 0 0 12px;
  padding: 0;
  color: #94a3b8;
  font-size: 11.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #f59e0b;
  color: #0f172a;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-dark a.zaso-hover-card__modal-action:focus {
  background: #d97706;
  color: #0f172a;
  border: 0;
}

/* ----- side-panel-amber ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__modal {
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
  width: 158px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px 18px;
  background: rgba( 217, 119, 6, 0.92 );
  -webkit-backdrop-filter: blur( 6px );
  backdrop-filter: blur( 6px );
  opacity: 1;
  transform: translateX( -100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber:focus-within .zaso-hover-card__modal {
  transform: translateX( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber .zaso-hover-card__modal p {
  margin: 0 0 12px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 11.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #c2410c;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-side-panel-amber a.zaso-hover-card__modal-action:focus {
  background: #fff7ed;
  color: #c2410c;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 04 - strips (bottom compact strip, title left + button */
/* right). translateY(100%) -> 0 on hover. Top bar dropped.      */
/* ============================================================ */
/* ----- strips-white ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  text-align: left;
  padding: 14px 16px;
  background: rgba( 255, 255, 255, 0.97 );
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #5b21b6;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white a.zaso-hover-card__modal-action:focus {
  background: #4c1d95;
  color: #ffffff;
  border: 0;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-white a.zaso-hover-card__modal-action::after { content: "\e5c8"; font-family: "ZASO Material Symbols Rounded"; font-weight: normal; font-style: normal; line-height: 1; font-size: 1.1em; font-variation-settings: 'wght' 600; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* ----- strips-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  text-align: left;
  padding: 14px 16px;
  background: rgba( 15, 23, 42, 0.96 );
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #6366f1;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-dark a.zaso-hover-card__modal-action:focus {
  background: #4f46e5;
  color: #ffffff;
  border: 0;
}

/* ----- strips-accent ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  text-align: left;
  padding: 14px 16px;
  background: rgba( 109, 40, 217, 0.92 );
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #6d28d9;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-strips-accent a.zaso-hover-card__modal-action:focus {
  background: #f5f3ff;
  color: #6d28d9;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 05 - corner (frame brackets ::before/::after + top-right */
/* badge). Brackets fade in; badge scales/rises in on hover.     */
/* ============================================================ */
/* ----- corner-white ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  width: 46px;
  height: 46px;
  border-top: 2px solid rgba( 255, 255, 255, 0.85 );
  border-left: 2px solid rgba( 255, 255, 255, 0.85 );
  border-radius: 12px 0 0 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white::after {
  content: "";
  position: absolute;
  bottom: 12px;
  right: 12px;
  width: 46px;
  height: 46px;
  border-bottom: 2px solid rgba( 255, 255, 255, 0.85 );
  border-right: 2px solid rgba( 255, 255, 255, 0.85 );
  border-radius: 0 0 12px 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:hover::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:hover::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:focus-within::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:focus-within::after {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__modal {
  top: 16px;
  right: 16px;
  left: auto;
  bottom: auto;
  width: auto;
  max-width: 190px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba( 255, 255, 255, 0.97 );
  opacity: 0;
  transform: scale( 0.85 ) translateY( -6px );
  transform-origin: top right;
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
  z-index: 3;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: scale( 1 ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 5px;
  padding: 0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white .zaso-hover-card__modal p {
  margin: 0 0 10px;
  padding: 0;
  color: #64748b;
  font-size: 11px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 0 2px;
  background: transparent;
  color: #be123c;
  border: 0;
  border-bottom: 2px solid #be123c;
  border-radius: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-white a.zaso-hover-card__modal-action:focus {
  background: transparent;
  color: #9f1239;
  border-bottom-color: #9f1239;
}

/* ----- corner-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  width: 46px;
  height: 46px;
  border-top: 2px solid rgba( 255, 255, 255, 0.7 );
  border-left: 2px solid rgba( 255, 255, 255, 0.7 );
  border-radius: 12px 0 0 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark::after {
  content: "";
  position: absolute;
  bottom: 12px;
  right: 12px;
  width: 46px;
  height: 46px;
  border-bottom: 2px solid rgba( 255, 255, 255, 0.7 );
  border-right: 2px solid rgba( 255, 255, 255, 0.7 );
  border-radius: 0 0 12px 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:hover::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:hover::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:focus-within::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:focus-within::after {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__modal {
  top: 16px;
  right: 16px;
  left: auto;
  bottom: auto;
  width: auto;
  max-width: 190px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba( 15, 23, 42, 0.96 );
  opacity: 0;
  transform: scale( 0.85 ) translateY( -6px );
  transform-origin: top right;
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
  z-index: 3;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: scale( 1 ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 5px;
  padding: 0;
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark .zaso-hover-card__modal p {
  margin: 0 0 10px;
  padding: 0;
  color: #94a3b8;
  font-size: 11px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #e11d48;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-dark a.zaso-hover-card__modal-action:focus {
  background: #be123c;
  color: #ffffff;
  border: 0;
}

/* ----- corner-accent ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  width: 46px;
  height: 46px;
  border-top: 2px solid rgba( 255, 200, 100, 0.95 );
  border-left: 2px solid rgba( 255, 200, 100, 0.95 );
  border-radius: 12px 0 0 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent::after {
  content: "";
  position: absolute;
  bottom: 12px;
  right: 12px;
  width: 46px;
  height: 46px;
  border-bottom: 2px solid rgba( 255, 200, 100, 0.95 );
  border-right: 2px solid rgba( 255, 200, 100, 0.95 );
  border-radius: 0 0 12px 0;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:hover::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:hover::after,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:focus-within::before,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:focus-within::after {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__modal {
  top: 16px;
  right: 16px;
  left: auto;
  bottom: auto;
  width: auto;
  max-width: 190px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba( 251, 146, 60, 0.94 );
  opacity: 0;
  transform: scale( 0.85 ) translateY( -6px );
  transform-origin: top right;
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
  z-index: 3;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: scale( 1 ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 5px;
  padding: 0;
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent .zaso-hover-card__modal p {
  margin: 0 0 10px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 11px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #ea580c;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-corner-accent a.zaso-hover-card__modal-action:focus {
  background: #fff7ed;
  color: #ea580c;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 06 - centered (centred card, fade + rise on hover).    */
/* ============================================================ */
/* ----- centered-light ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 255, 255, 255, 0.94 );
  -webkit-backdrop-filter: blur( 10px );
  backdrop-filter: blur( 10px );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #0f172a;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: #64748b;
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: #0f172a;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-light a.zaso-hover-card__modal-action:focus {
  background: #1e293b;
  color: #ffffff;
  border: 0;
}

/* ----- centered-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 15, 23, 42, 0.88 );
  -webkit-backdrop-filter: blur( 10px );
  backdrop-filter: blur( 10px );
  border: 1px solid rgba( 255, 255, 255, 0.1 );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: #94a3b8;
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: #38bdf8;
  color: #0c4a6e;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-dark a.zaso-hover-card__modal-action:focus {
  background: #0ea5e9;
  color: #0c4a6e;
  border: 0;
}

/* ----- centered-accent ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 37, 99, 235, 0.88 );
  -webkit-backdrop-filter: blur( 10px );
  backdrop-filter: blur( 10px );
  border: 1px solid rgba( 255, 255, 255, 0.25 );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #1d4ed8;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-centered-accent a.zaso-hover-card__modal-action:focus {
  background: #eff6ff;
  color: #1d4ed8;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 07 - type-strip (bottom strip, big 20px title + button) */
/* translateY(100%) -> 0 on hover.                               */
/* ============================================================ */
/* ----- type-strip-white ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  text-align: left;
  padding: 18px 20px;
  background: #ffffff;
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #0f172a;
  font-size: 20px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #0c4a6e;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-white a.zaso-hover-card__modal-action:focus {
  background: #0a3d5c;
  color: #ffffff;
  border: 0;
}

/* ----- type-strip-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  text-align: left;
  padding: 18px 20px;
  background: #0f172a;
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #ffffff;
  font-size: 20px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #22d3ee;
  color: #042f2e;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-dark a.zaso-hover-card__modal-action:focus {
  background: #06b6d4;
  color: #042f2e;
  border: 0;
}

/* ----- type-strip-tinted ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  text-align: left;
  padding: 18px 20px;
  background: rgba( 13, 148, 136, 0.93 );
  -webkit-backdrop-filter: blur( 6px );
  backdrop-filter: blur( 6px );
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 0;
  padding: 0;
  color: #ffffff;
  font-size: 20px;
  font-weight: 800;
  text-align: left;
  flex: 1 1 auto;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #0f766e;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-type-strip-tinted a.zaso-hover-card__modal-action:focus {
  background: #f0fdfa;
  color: #0f766e;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 08 - tint (full-inset colour layer fades in + bottom-  */
/* left text). __modal holds the tint fill; opacity 0 -> 1.      */
/* ============================================================ */
/* ----- tint-blue ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__modal {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px;
  background: rgba( 37, 99, 235, 0.72 );
  opacity: 0;
  transition: opacity 0.4s ease;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue:focus-within .zaso-hover-card__modal {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 12.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #1e40af;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-blue a.zaso-hover-card__modal-action:focus {
  background: #eff6ff;
  color: #1e40af;
  border: 0;
}

/* ----- tint-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__modal {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px;
  background: rgba( 15, 23, 42, 0.78 );
  opacity: 0;
  transition: opacity 0.4s ease;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark:focus-within .zaso-hover-card__modal {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: #94a3b8;
  font-size: 12.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #f97316;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-dark a.zaso-hover-card__modal-action:focus {
  background: #ea580c;
  color: #ffffff;
  border: 0;
}

/* ----- tint-amber ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__modal {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 20px;
  background: rgba( 217, 119, 6, 0.7 );
  opacity: 0;
  transition: opacity 0.4s ease;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber:focus-within .zaso-hover-card__modal {
  opacity: 1;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.9 );
  font-size: 12.5px;
  line-height: 1.5;
  text-align: left;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #c2410c;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-tint-amber a.zaso-hover-card__modal-action:focus {
  background: #fff7ed;
  color: #c2410c;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 09 - glass (centred glass card, backdrop-blur; fade +  */
/* rise on hover).                                               */
/* ============================================================ */
/* ----- glass-light ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 255, 255, 255, 0.18 );
  -webkit-backdrop-filter: blur( 12px );
  backdrop-filter: blur( 12px );
  border: 1px solid rgba( 255, 255, 255, 0.35 );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #3730a3;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-light a.zaso-hover-card__modal-action:focus {
  background: #eef2ff;
  color: #3730a3;
  border: 0;
}

/* ----- glass-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 15, 23, 42, 0.82 );
  -webkit-backdrop-filter: blur( 12px );
  backdrop-filter: blur( 12px );
  border: 1px solid rgba( 255, 255, 255, 0.12 );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: #94a3b8;
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: #7c3aed;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-dark a.zaso-hover-card__modal-action:focus {
  background: #6d28d9;
  color: #ffffff;
  border: 0;
}

/* ----- glass-frosted ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__modal {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: calc( 100% - 48px );
  max-width: 250px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 20px;
  border-radius: 16px;
  background: rgba( 168, 85, 247, 0.28 );
  -webkit-backdrop-filter: blur( 12px );
  backdrop-filter: blur( 12px );
  border: 1px solid rgba( 240, 171, 252, 0.4 );
  opacity: 0;
  transform: translate( -50%, -50% ) translateY( 14px );
  transition: opacity 0.35s ease, transform 0.35s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted:focus-within .zaso-hover-card__modal {
  opacity: 1;
  transform: translate( -50%, -50% ) translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 6px;
  padding: 0;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted .zaso-hover-card__modal p {
  margin: 0 0 14px;
  padding: 0;
  color: rgba( 255, 255, 255, 0.88 );
  font-size: 12.5px;
  line-height: 1.5;
  text-align: center;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0 auto;
  padding: 0.6em 1.2em;
  background: linear-gradient( 135deg, #d946ef, #8b5cf6 );
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-glass-frosted a.zaso-hover-card__modal-action:focus {
  background: linear-gradient( 135deg, #c026d3, #7c3aed );
  color: #ffffff;
  border: 0;
}

/* ============================================================ */
/* LAYOUT 10 - editorial (bottom strip, big 2-line title + button */
/* stacked). translateY(100%) -> 0 on hover. Eyebrow dropped.    */
/* ============================================================ */
/* ----- editorial-white ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 22px 22px 24px;
  background: #ffffff;
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 12px;
  padding: 0;
  color: #0f172a;
  font-size: 19px;
  font-weight: 800;
  text-align: left;
  line-height: 1.2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #14532d;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-white a.zaso-hover-card__modal-action:focus {
  background: #0f3d21;
  color: #ffffff;
  border: 0;
}

/* ----- editorial-dark ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 22px 22px 24px;
  background: #0f172a;
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 12px;
  padding: 0;
  color: #ffffff;
  font-size: 19px;
  font-weight: 800;
  text-align: left;
  line-height: 1.2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #4ade80;
  color: #052e16;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-dark a.zaso-hover-card__modal-action:focus {
  background: #22c55e;
  color: #052e16;
  border: 0;
}

/* ----- editorial-accent ----- */
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__modal {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  text-align: left;
  padding: 22px 22px 24px;
  background: rgba( 22, 163, 74, 0.93 );
  -webkit-backdrop-filter: blur( 6px );
  backdrop-filter: blur( 6px );
  opacity: 1;
  transform: translateY( 100% );
  transition: transform 0.38s cubic-bezier( 0.4, 0, 0.2, 1 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:hover .zaso-hover-card__modal,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent:focus-within .zaso-hover-card__modal {
  transform: translateY( 0 );
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__modal-title {
  display: block;
  margin: 0 0 12px;
  padding: 0;
  color: #ffffff;
  font-size: 19px;
  font-weight: 800;
  text-align: left;
  line-height: 1.2;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent .zaso-hover-card__modal p {
  display: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent a.zaso-hover-card__modal-action {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.6em 1.2em;
  background: #ffffff;
  color: #15803d;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent a.zaso-hover-card__modal-action:hover,
.zaso-hover-card.zaso-hover-card.zaso-hover-card--design-editorial-accent a.zaso-hover-card__modal-action:focus {
  background: #f0fdf4;
  color: #15803d;
  border: 0;
}

