/* ═══════════════════════════════════════════════════════════════════
   Candor Lumen — Per-Viewport Responsive Studio (v0.3.0)
   ───────────────────────────────────────────────────────────────────
   Eigene CSS-Vars (--candor-*), eigene Klassen-Konventionen.
   Komplett unabhängig von MUP. Inhalt:
     · Padding / Margin / Schrift / Farben pro Viewport
     · candor-hide-d / candor-hide-t / candor-hide-m  (Sichtbarkeit)
     · candor-shape-{d|t|m}-{shape}  (oval/hexagon/circle/diamond/blob/soft)
     · candor-fx-{d|t|m}-{effect}    (sparkle/glow/lightning/shimmer/pulse)
     · candor-align-{d|t|m}-{align}  (left/center/right)
   ═══════════════════════════════════════════════════════════════════ */

/* ───────── DESKTOP (default) ───────── */
.has-candor-resp {
  padding-top:    var(--candor-pad-y, inherit);
  padding-bottom: var(--candor-pad-y, inherit);
  padding-left:   var(--candor-pad-x, inherit);
  padding-right:  var(--candor-pad-x, inherit);
  margin-top:     var(--candor-marg-y, inherit);
  margin-bottom:  var(--candor-marg-y, inherit);
  font-size:      var(--candor-font, inherit);
}
.has-candor-resp[style*="--candor-bg"] { background-color: var(--candor-bg); }
.has-candor-resp[style*="--candor-fg"] { color: var(--candor-fg); }

/* ───────── TABLET (≤ 1024 px) ───────── */
@media (max-width: 1024px) {
  .has-candor-resp {
    padding-top:    var(--candor-pad-y-t, var(--candor-pad-y, inherit));
    padding-bottom: var(--candor-pad-y-t, var(--candor-pad-y, inherit));
    padding-left:   var(--candor-pad-x-t, var(--candor-pad-x, inherit));
    padding-right:  var(--candor-pad-x-t, var(--candor-pad-x, inherit));
    margin-top:     var(--candor-marg-y-t, var(--candor-marg-y, inherit));
    margin-bottom:  var(--candor-marg-y-t, var(--candor-marg-y, inherit));
    font-size:      var(--candor-font-t, var(--candor-font, inherit));
  }
  .has-candor-resp[style*="--candor-bg-t"] { background-color: var(--candor-bg-t) !important; }
  .has-candor-resp[style*="--candor-fg-t"] { color: var(--candor-fg-t) !important; }
}

/* ───────── MOBILE (≤ 640 px) ───────── */
@media (max-width: 640px) {
  .has-candor-resp {
    padding-top:    var(--candor-pad-y-m, var(--candor-pad-y-t, var(--candor-pad-y, inherit)));
    padding-bottom: var(--candor-pad-y-m, var(--candor-pad-y-t, var(--candor-pad-y, inherit)));
    padding-left:   var(--candor-pad-x-m, var(--candor-pad-x-t, var(--candor-pad-x, inherit)));
    padding-right:  var(--candor-pad-x-m, var(--candor-pad-x-t, var(--candor-pad-x, inherit)));
    margin-top:     var(--candor-marg-y-m, var(--candor-marg-y-t, var(--candor-marg-y, inherit)));
    margin-bottom:  var(--candor-marg-y-m, var(--candor-marg-y-t, var(--candor-marg-y, inherit)));
    font-size:      var(--candor-font-m, var(--candor-font-t, var(--candor-font, inherit)));
  }
  .has-candor-resp[style*="--candor-bg-m"] { background-color: var(--candor-bg-m) !important; }
  .has-candor-resp[style*="--candor-fg-m"] { color: var(--candor-fg-m) !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   SICHTBARKEIT PRO VIEWPORT
   ═══════════════════════════════════════════════════════════════════ */
@media (min-width: 1025px) {
  .candor-hide-d { display: none !important; }
}
@media (min-width: 641px) and (max-width: 1024px) {
  .candor-hide-t { display: none !important; }
}
@media (max-width: 640px) {
  .candor-hide-m { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   BILD-SHAPES PRO VIEWPORT
   ───────────────────────────────────────────────────────────────────
   Wirkt auf das Bild im Block — sucht das <img> oder den Cover-Layer.
   Schweben unabhängig: Desktop-Shape gilt erst >1024, Tablet 641-1024,
   Mobile ≤640. So kannst du wirklich oval-tablet + hexagon-mobile haben.
   ═══════════════════════════════════════════════════════════════════ */

/* Universal: Shape auf <img>, Cover-Background, Gallery-Items */
.candor-shape img,
.candor-shape .wp-block-cover__background,
.candor-shape .wp-block-cover__image-background {
  transition: clip-path 0.4s ease, border-radius 0.4s ease;
}

/* Helper-Mixin via Klasse-Prefix */
[class*="candor-shape-d-circle"]   img,
[class*="candor-shape-d-circle"]   .wp-block-cover__image-background { border-radius: 50% !important; aspect-ratio: 1 / 1; object-fit: cover; }
[class*="candor-shape-d-oval"]     img,
[class*="candor-shape-d-oval"]     .wp-block-cover__image-background { border-radius: 50% / 35% !important; }
[class*="candor-shape-d-hexagon"]  img,
[class*="candor-shape-d-hexagon"]  .wp-block-cover__image-background { clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }
[class*="candor-shape-d-diamond"]  img,
[class*="candor-shape-d-diamond"]  .wp-block-cover__image-background { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
[class*="candor-shape-d-soft"]     img,
[class*="candor-shape-d-soft"]     .wp-block-cover__image-background { border-radius: 24px !important; }
[class*="candor-shape-d-blob"]     img,
[class*="candor-shape-d-blob"]     .wp-block-cover__image-background { border-radius: 60% 40% 50% 50% / 50% 60% 40% 50% !important; }

@media (max-width: 1024px) {
  [class*="candor-shape-t-circle"]  img, [class*="candor-shape-t-circle"]  .wp-block-cover__image-background { border-radius: 50% !important; aspect-ratio: 1 / 1; object-fit: cover; clip-path: none; }
  [class*="candor-shape-t-oval"]    img, [class*="candor-shape-t-oval"]    .wp-block-cover__image-background { border-radius: 50% / 35% !important; clip-path: none; }
  [class*="candor-shape-t-hexagon"] img, [class*="candor-shape-t-hexagon"] .wp-block-cover__image-background { clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); border-radius: 0 !important; }
  [class*="candor-shape-t-diamond"] img, [class*="candor-shape-t-diamond"] .wp-block-cover__image-background { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); border-radius: 0 !important; }
  [class*="candor-shape-t-soft"]    img, [class*="candor-shape-t-soft"]    .wp-block-cover__image-background { border-radius: 18px !important; clip-path: none; }
  [class*="candor-shape-t-blob"]    img, [class*="candor-shape-t-blob"]    .wp-block-cover__image-background { border-radius: 60% 40% 50% 50% / 50% 60% 40% 50% !important; clip-path: none; }
}

@media (max-width: 640px) {
  [class*="candor-shape-m-circle"]  img, [class*="candor-shape-m-circle"]  .wp-block-cover__image-background { border-radius: 50% !important; aspect-ratio: 1 / 1; object-fit: cover; clip-path: none; }
  [class*="candor-shape-m-oval"]    img, [class*="candor-shape-m-oval"]    .wp-block-cover__image-background { border-radius: 50% / 35% !important; clip-path: none; }
  [class*="candor-shape-m-hexagon"] img, [class*="candor-shape-m-hexagon"] .wp-block-cover__image-background { clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); border-radius: 0 !important; }
  [class*="candor-shape-m-diamond"] img, [class*="candor-shape-m-diamond"] .wp-block-cover__image-background { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); border-radius: 0 !important; }
  [class*="candor-shape-m-soft"]    img, [class*="candor-shape-m-soft"]    .wp-block-cover__image-background { border-radius: 14px !important; clip-path: none; }
  [class*="candor-shape-m-blob"]    img, [class*="candor-shape-m-blob"]    .wp-block-cover__image-background { border-radius: 60% 40% 50% 50% / 50% 60% 40% 50% !important; clip-path: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   EFFEKTE PRO VIEWPORT
   ───────────────────────────────────────────────────────────────────
   Profi: gleicher Block hat Desktop-Sparkle, Mobile-Lightning etc.
   Setzt nur die Effekt-Klasse aktiv im jeweiligen Viewport. Die
   eigentlichen Animations-Keyframes laden aus dem MUP-Effects-CSS
   ODER aus Candor's eigenen Effekt-Definitionen (effects.php enqueue).
   ═══════════════════════════════════════════════════════════════════ */

/* Sparkle */
@keyframes candor-fx-sparkle {
  0%, 100% { text-shadow: 0 0 4px rgba(255, 215, 0, 0.4), 0 0 12px rgba(255, 215, 0, 0.2); }
  50%      { text-shadow: 0 0 8px rgba(255, 215, 0, 0.85), 0 0 24px rgba(255, 215, 0, 0.5); }
}
/* Glow */
@keyframes candor-fx-glow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(201, 168, 76, 0.4)); }
  50%      { filter: drop-shadow(0 0 12px rgba(201, 168, 76, 0.85)); }
}
/* Lightning */
@keyframes candor-fx-lightning {
  0%, 88%, 100% { filter: brightness(1); }
  90%, 94%      { filter: brightness(1.6) contrast(1.2); }
  92%           { filter: brightness(0.8); }
}
/* Shimmer */
@keyframes candor-fx-shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
/* Pulse */
@keyframes candor-fx-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.04); }
}

@media (min-width: 1025px) {
  [class*="candor-fx-d-sparkle"]   { animation: candor-fx-sparkle   3s ease-in-out infinite; }
  [class*="candor-fx-d-glow"]      { animation: candor-fx-glow      2.4s ease-in-out infinite; }
  [class*="candor-fx-d-lightning"] { animation: candor-fx-lightning 4s ease-in-out infinite; }
  [class*="candor-fx-d-shimmer"]   {
    background: linear-gradient(90deg, transparent 30%, rgba(255,255,255,0.6) 50%, transparent 70%);
    background-size: 200% 100%;
    -webkit-background-clip: text; background-clip: text;
    animation: candor-fx-shimmer 3s linear infinite;
  }
  [class*="candor-fx-d-pulse"]     { animation: candor-fx-pulse 2.2s ease-in-out infinite; transform-origin: center; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  [class*="candor-fx-t-sparkle"]   { animation: candor-fx-sparkle   3s ease-in-out infinite; }
  [class*="candor-fx-t-glow"]      { animation: candor-fx-glow      2.4s ease-in-out infinite; }
  [class*="candor-fx-t-lightning"] { animation: candor-fx-lightning 4s ease-in-out infinite; }
  [class*="candor-fx-t-shimmer"]   {
    background: linear-gradient(90deg, transparent 30%, rgba(255,255,255,0.6) 50%, transparent 70%);
    background-size: 200% 100%;
    -webkit-background-clip: text; background-clip: text;
    animation: candor-fx-shimmer 3s linear infinite;
  }
  [class*="candor-fx-t-pulse"]     { animation: candor-fx-pulse 2.2s ease-in-out infinite; transform-origin: center; }
}

@media (max-width: 640px) {
  [class*="candor-fx-m-sparkle"]   { animation: candor-fx-sparkle   3s ease-in-out infinite; }
  [class*="candor-fx-m-glow"]      { animation: candor-fx-glow      2.4s ease-in-out infinite; }
  [class*="candor-fx-m-lightning"] { animation: candor-fx-lightning 4s ease-in-out infinite; }
  [class*="candor-fx-m-shimmer"]   {
    background: linear-gradient(90deg, transparent 30%, rgba(255,255,255,0.6) 50%, transparent 70%);
    background-size: 200% 100%;
    -webkit-background-clip: text; background-clip: text;
    animation: candor-fx-shimmer 3s linear infinite;
  }
  [class*="candor-fx-m-pulse"]     { animation: candor-fx-pulse 2.2s ease-in-out infinite; transform-origin: center; }
}

/* Reduced-Motion respektieren */
@media (prefers-reduced-motion: reduce) {
  [class*="candor-fx-"] { animation: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   ALIGNMENT PRO VIEWPORT
   ───────────────────────────────────────────────────────────────────
   v0.3.1: kaskadiert in alle Heading/Paragraph/Kadence-Children rein.
   Kadence Advanced Heading bringt eine eigene text-align mit, die hier
   überschrieben wird. Sonst bleibt der Header trotz „Mitte" links.
   ═══════════════════════════════════════════════════════════════════ */
@media (min-width: 1025px) {
  [class*="candor-align-d-left"],
  [class*="candor-align-d-left"]   h1, [class*="candor-align-d-left"]   h2, [class*="candor-align-d-left"]   h3, [class*="candor-align-d-left"]   h4, [class*="candor-align-d-left"]   h5, [class*="candor-align-d-left"]   h6, [class*="candor-align-d-left"]   p, [class*="candor-align-d-left"]   .wp-block-heading, [class*="candor-align-d-left"]   .wp-block-paragraph, [class*="candor-align-d-left"]   .kt-adv-heading-wrap, [class*="candor-align-d-left"]   .kadence-advanced-heading-wrap, [class*="candor-align-d-left"]   .kb-adv-heading-wrap   { text-align: left !important; }
  [class*="candor-align-d-center"],
  [class*="candor-align-d-center"] h1, [class*="candor-align-d-center"] h2, [class*="candor-align-d-center"] h3, [class*="candor-align-d-center"] h4, [class*="candor-align-d-center"] h5, [class*="candor-align-d-center"] h6, [class*="candor-align-d-center"] p, [class*="candor-align-d-center"] .wp-block-heading, [class*="candor-align-d-center"] .wp-block-paragraph, [class*="candor-align-d-center"] .kt-adv-heading-wrap, [class*="candor-align-d-center"] .kadence-advanced-heading-wrap, [class*="candor-align-d-center"] .kb-adv-heading-wrap { text-align: center !important; }
  [class*="candor-align-d-right"],
  [class*="candor-align-d-right"]  h1, [class*="candor-align-d-right"]  h2, [class*="candor-align-d-right"]  h3, [class*="candor-align-d-right"]  h4, [class*="candor-align-d-right"]  h5, [class*="candor-align-d-right"]  h6, [class*="candor-align-d-right"]  p, [class*="candor-align-d-right"]  .wp-block-heading, [class*="candor-align-d-right"]  .wp-block-paragraph, [class*="candor-align-d-right"]  .kt-adv-heading-wrap, [class*="candor-align-d-right"]  .kadence-advanced-heading-wrap, [class*="candor-align-d-right"]  .kb-adv-heading-wrap  { text-align: right !important; }
}
@media (max-width: 1024px) {
  [class*="candor-align-t-left"],
  [class*="candor-align-t-left"]   h1, [class*="candor-align-t-left"]   h2, [class*="candor-align-t-left"]   h3, [class*="candor-align-t-left"]   h4, [class*="candor-align-t-left"]   h5, [class*="candor-align-t-left"]   h6, [class*="candor-align-t-left"]   p, [class*="candor-align-t-left"]   .wp-block-heading, [class*="candor-align-t-left"]   .wp-block-paragraph, [class*="candor-align-t-left"]   .kt-adv-heading-wrap, [class*="candor-align-t-left"]   .kadence-advanced-heading-wrap, [class*="candor-align-t-left"]   .kb-adv-heading-wrap   { text-align: left !important; }
  [class*="candor-align-t-center"],
  [class*="candor-align-t-center"] h1, [class*="candor-align-t-center"] h2, [class*="candor-align-t-center"] h3, [class*="candor-align-t-center"] h4, [class*="candor-align-t-center"] h5, [class*="candor-align-t-center"] h6, [class*="candor-align-t-center"] p, [class*="candor-align-t-center"] .wp-block-heading, [class*="candor-align-t-center"] .wp-block-paragraph, [class*="candor-align-t-center"] .kt-adv-heading-wrap, [class*="candor-align-t-center"] .kadence-advanced-heading-wrap, [class*="candor-align-t-center"] .kb-adv-heading-wrap { text-align: center !important; }
  [class*="candor-align-t-right"],
  [class*="candor-align-t-right"]  h1, [class*="candor-align-t-right"]  h2, [class*="candor-align-t-right"]  h3, [class*="candor-align-t-right"]  h4, [class*="candor-align-t-right"]  h5, [class*="candor-align-t-right"]  h6, [class*="candor-align-t-right"]  p, [class*="candor-align-t-right"]  .wp-block-heading, [class*="candor-align-t-right"]  .wp-block-paragraph, [class*="candor-align-t-right"]  .kt-adv-heading-wrap, [class*="candor-align-t-right"]  .kadence-advanced-heading-wrap, [class*="candor-align-t-right"]  .kb-adv-heading-wrap  { text-align: right !important; }
}
@media (max-width: 640px) {
  [class*="candor-align-m-left"],
  [class*="candor-align-m-left"]   h1, [class*="candor-align-m-left"]   h2, [class*="candor-align-m-left"]   h3, [class*="candor-align-m-left"]   h4, [class*="candor-align-m-left"]   h5, [class*="candor-align-m-left"]   h6, [class*="candor-align-m-left"]   p, [class*="candor-align-m-left"]   .wp-block-heading, [class*="candor-align-m-left"]   .wp-block-paragraph, [class*="candor-align-m-left"]   .kt-adv-heading-wrap, [class*="candor-align-m-left"]   .kadence-advanced-heading-wrap, [class*="candor-align-m-left"]   .kb-adv-heading-wrap   { text-align: left !important; }
  [class*="candor-align-m-center"],
  [class*="candor-align-m-center"] h1, [class*="candor-align-m-center"] h2, [class*="candor-align-m-center"] h3, [class*="candor-align-m-center"] h4, [class*="candor-align-m-center"] h5, [class*="candor-align-m-center"] h6, [class*="candor-align-m-center"] p, [class*="candor-align-m-center"] .wp-block-heading, [class*="candor-align-m-center"] .wp-block-paragraph, [class*="candor-align-m-center"] .kt-adv-heading-wrap, [class*="candor-align-m-center"] .kadence-advanced-heading-wrap, [class*="candor-align-m-center"] .kb-adv-heading-wrap { text-align: center !important; }
  [class*="candor-align-m-right"],
  [class*="candor-align-m-right"]  h1, [class*="candor-align-m-right"]  h2, [class*="candor-align-m-right"]  h3, [class*="candor-align-m-right"]  h4, [class*="candor-align-m-right"]  h5, [class*="candor-align-m-right"]  h6, [class*="candor-align-m-right"]  p, [class*="candor-align-m-right"]  .wp-block-heading, [class*="candor-align-m-right"]  .wp-block-paragraph, [class*="candor-align-m-right"]  .kt-adv-heading-wrap, [class*="candor-align-m-right"]  .kadence-advanced-heading-wrap, [class*="candor-align-m-right"]  .kb-adv-heading-wrap  { text-align: right !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   EDITOR-ONLY: Indikator-Badge wenn ein Block Candor-Werte hat
   ═══════════════════════════════════════════════════════════════════ */
body.block-editor-page .has-candor-resp {
  position: relative;
}
body.block-editor-page .has-candor-resp::before {
  content: "📐";
  position: absolute;
  top: -8px; left: -8px;
  background: #fbf4e2;
  border: 1px solid #c9a84c;
  border-radius: 50%;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
}
body.block-editor-page .has-candor-resp:hover::before,
body.block-editor-page .has-candor-resp.is-selected::before {
  opacity: 1;
}

/* Body-Indicator: welcher Device-Mode aktiv ist */
body[data-candor-device="t"]::after,
body[data-candor-device="m"]::after {
  content: attr(data-candor-device-label);
  position: fixed;
  bottom: 12px; right: 12px;
  background: linear-gradient(135deg, #c9a84c 0%, #a68838 100%);
  color: #fff;
  padding: 6px 14px;
  border-radius: 18px;
  font-size: 12px;
  font-weight: 600;
  z-index: 9999;
  pointer-events: none;
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}
body[data-candor-device="t"]::after { content: "💻 Tablet-Modus"; }
body[data-candor-device="m"]::after { content: "📱 Smartphone-Modus"; }

/* ═══════════════════════════════════════════════════════════════════
   v0.3.1 — IMAGE-PRO PRO VIEWPORT
   ───────────────────────────────────────────────────────────────────
   Kette: Format (Aspect-Ratio) → Größe (Lange/Kurze Kante) →
   Fokuspunkt → Object-Fit. Bild bleibt verzerrungsfrei: wenn nur eine
   Kante gesetzt ist, übernimmt die andere automatisch das Format
   (height/width: auto).
   ═══════════════════════════════════════════════════════════════════ */

/* ── BILD-GRÖSSE (Lange / Kurze Kante) ── */
.has-candor-resp img,
.has-candor-resp .wp-block-image img {
  max-width:  var(--candor-img-long, none);
  max-height: var(--candor-img-short, none);
  height: auto;
  width:  auto;
  object-position: var(--candor-img-fx, 50%) var(--candor-img-fy, 50%);
}
/* v0.3.2: KEINE Defaults für Cover-min-height — sonst überschreiben wir
   MUP-Fullscreen-Sektion (100vh) oder Theme-Werte. Nur wenn der User
   explizit candor-img-h gesetzt hat, greifen wir ein. */
.has-candor-resp.wp-block-cover[style*="--candor-img-h"] {
  min-height: var(--candor-img-h) !important;
}
.has-candor-resp.wp-block-cover[style*="--candor-img-fx"] .wp-block-cover__image-background,
.has-candor-resp.wp-block-cover[style*="--candor-img-fx"] .wp-block-cover__video-background,
.has-candor-resp.wp-block-cover[style*="--candor-img-fy"] .wp-block-cover__image-background,
.has-candor-resp.wp-block-cover[style*="--candor-img-fy"] .wp-block-cover__video-background {
  object-position: var(--candor-img-fx, 50%) var(--candor-img-fy, 50%) !important;
}

@media (max-width: 1024px) {
  .has-candor-resp img,
  .has-candor-resp .wp-block-image img {
    max-width:  var(--candor-img-long-t, var(--candor-img-long, none));
    max-height: var(--candor-img-short-t, var(--candor-img-short, none));
  }
  .has-candor-resp[style*="--candor-img-fx-t"] img,
  .has-candor-resp[style*="--candor-img-fy-t"] img {
    object-position: var(--candor-img-fx-t, 50%) var(--candor-img-fy-t, 50%);
  }
  .has-candor-resp.wp-block-cover[style*="--candor-img-h-t"] {
    min-height: var(--candor-img-h-t) !important;
  }
  .has-candor-resp.wp-block-cover[style*="--candor-img-fx-t"] .wp-block-cover__image-background,
  .has-candor-resp.wp-block-cover[style*="--candor-img-fy-t"] .wp-block-cover__image-background {
    object-position: var(--candor-img-fx-t, 50%) var(--candor-img-fy-t, 50%) !important;
  }
}

@media (max-width: 640px) {
  .has-candor-resp img,
  .has-candor-resp .wp-block-image img {
    max-width:  var(--candor-img-long-m, var(--candor-img-long-t, var(--candor-img-long, none)));
    max-height: var(--candor-img-short-m, var(--candor-img-short-t, var(--candor-img-short, none)));
  }
  .has-candor-resp[style*="--candor-img-fx-m"] img,
  .has-candor-resp[style*="--candor-img-fy-m"] img {
    object-position: var(--candor-img-fx-m, 50%) var(--candor-img-fy-m, 50%);
  }
  .has-candor-resp.wp-block-cover[style*="--candor-img-h-m"] {
    min-height: var(--candor-img-h-m) !important;
  }
  .has-candor-resp.wp-block-cover[style*="--candor-img-fx-m"] .wp-block-cover__image-background,
  .has-candor-resp.wp-block-cover[style*="--candor-img-fy-m"] .wp-block-cover__image-background {
    object-position: var(--candor-img-fx-m, 50%) var(--candor-img-fy-m, 50%) !important;
  }
}

/* ── MAX-WIDTH ── */
.has-candor-resp { max-width: var(--candor-img-maxw, none); }
@media (max-width: 1024px) {
  .has-candor-resp { max-width: var(--candor-img-maxw-t, var(--candor-img-maxw, none)); }
}
@media (max-width: 640px) {
  .has-candor-resp { max-width: var(--candor-img-maxw-m, var(--candor-img-maxw-t, var(--candor-img-maxw, none))); }
}

/* ── ASPECT-RATIO PRO VIEWPORT ── */
/* Wirkt auf den Block-Container (Cover) ODER auf das innere <img> (Image) */
@media (min-width: 1025px) {
  [class*="candor-ar-d-16-9"]   img, [class*="candor-ar-d-16-9"].wp-block-cover   { aspect-ratio: 16 / 9;  }
  [class*="candor-ar-d-4-3"]    img, [class*="candor-ar-d-4-3"].wp-block-cover    { aspect-ratio: 4 / 3;   }
  [class*="candor-ar-d-3-2"]    img, [class*="candor-ar-d-3-2"].wp-block-cover    { aspect-ratio: 3 / 2;   }
  [class*="candor-ar-d-21-9"]   img, [class*="candor-ar-d-21-9"].wp-block-cover   { aspect-ratio: 21 / 9;  }
  [class*="candor-ar-d-1-1"]    img, [class*="candor-ar-d-1-1"].wp-block-cover    { aspect-ratio: 1 / 1;   }
  [class*="candor-ar-d-4-5"]    img, [class*="candor-ar-d-4-5"].wp-block-cover    { aspect-ratio: 4 / 5;   }
  [class*="candor-ar-d-3-4"]    img, [class*="candor-ar-d-3-4"].wp-block-cover    { aspect-ratio: 3 / 4;   }
  [class*="candor-ar-d-2-3"]    img, [class*="candor-ar-d-2-3"].wp-block-cover    { aspect-ratio: 2 / 3;   }
  [class*="candor-ar-d-9-16"]   img, [class*="candor-ar-d-9-16"].wp-block-cover   { aspect-ratio: 9 / 16;  }
}
@media (min-width: 641px) and (max-width: 1024px) {
  [class*="candor-ar-t-16-9"]   img, [class*="candor-ar-t-16-9"].wp-block-cover   { aspect-ratio: 16 / 9;  }
  [class*="candor-ar-t-4-3"]    img, [class*="candor-ar-t-4-3"].wp-block-cover    { aspect-ratio: 4 / 3;   }
  [class*="candor-ar-t-3-2"]    img, [class*="candor-ar-t-3-2"].wp-block-cover    { aspect-ratio: 3 / 2;   }
  [class*="candor-ar-t-21-9"]   img, [class*="candor-ar-t-21-9"].wp-block-cover   { aspect-ratio: 21 / 9;  }
  [class*="candor-ar-t-1-1"]    img, [class*="candor-ar-t-1-1"].wp-block-cover    { aspect-ratio: 1 / 1;   }
  [class*="candor-ar-t-4-5"]    img, [class*="candor-ar-t-4-5"].wp-block-cover    { aspect-ratio: 4 / 5;   }
  [class*="candor-ar-t-3-4"]    img, [class*="candor-ar-t-3-4"].wp-block-cover    { aspect-ratio: 3 / 4;   }
  [class*="candor-ar-t-2-3"]    img, [class*="candor-ar-t-2-3"].wp-block-cover    { aspect-ratio: 2 / 3;   }
  [class*="candor-ar-t-9-16"]   img, [class*="candor-ar-t-9-16"].wp-block-cover   { aspect-ratio: 9 / 16;  }
}
@media (max-width: 640px) {
  [class*="candor-ar-m-16-9"]   img, [class*="candor-ar-m-16-9"].wp-block-cover   { aspect-ratio: 16 / 9;  }
  [class*="candor-ar-m-4-3"]    img, [class*="candor-ar-m-4-3"].wp-block-cover    { aspect-ratio: 4 / 3;   }
  [class*="candor-ar-m-3-2"]    img, [class*="candor-ar-m-3-2"].wp-block-cover    { aspect-ratio: 3 / 2;   }
  [class*="candor-ar-m-21-9"]   img, [class*="candor-ar-m-21-9"].wp-block-cover   { aspect-ratio: 21 / 9;  }
  [class*="candor-ar-m-1-1"]    img, [class*="candor-ar-m-1-1"].wp-block-cover    { aspect-ratio: 1 / 1;   }
  [class*="candor-ar-m-4-5"]    img, [class*="candor-ar-m-4-5"].wp-block-cover    { aspect-ratio: 4 / 5;   }
  [class*="candor-ar-m-3-4"]    img, [class*="candor-ar-m-3-4"].wp-block-cover    { aspect-ratio: 3 / 4;   }
  [class*="candor-ar-m-2-3"]    img, [class*="candor-ar-m-2-3"].wp-block-cover    { aspect-ratio: 2 / 3;   }
  [class*="candor-ar-m-9-16"]   img, [class*="candor-ar-m-9-16"].wp-block-cover   { aspect-ratio: 9 / 16;  }
}

/* ── OBJECT-FIT PRO VIEWPORT ── */
@media (min-width: 1025px) {
  [class*="candor-fit-d-cover"]      img, [class*="candor-fit-d-cover"]      .wp-block-cover__image-background { object-fit: cover !important; }
  [class*="candor-fit-d-contain"]    img, [class*="candor-fit-d-contain"]    .wp-block-cover__image-background { object-fit: contain !important; }
  [class*="candor-fit-d-fill"]       img, [class*="candor-fit-d-fill"]       .wp-block-cover__image-background { object-fit: fill !important; }
  [class*="candor-fit-d-scale-down"] img, [class*="candor-fit-d-scale-down"] .wp-block-cover__image-background { object-fit: scale-down !important; }
  [class*="candor-fit-d-none"]       img, [class*="candor-fit-d-none"]       .wp-block-cover__image-background { object-fit: none !important; }
}
@media (min-width: 641px) and (max-width: 1024px) {
  [class*="candor-fit-t-cover"]      img, [class*="candor-fit-t-cover"]      .wp-block-cover__image-background { object-fit: cover !important; }
  [class*="candor-fit-t-contain"]    img, [class*="candor-fit-t-contain"]    .wp-block-cover__image-background { object-fit: contain !important; }
  [class*="candor-fit-t-fill"]       img, [class*="candor-fit-t-fill"]       .wp-block-cover__image-background { object-fit: fill !important; }
  [class*="candor-fit-t-scale-down"] img, [class*="candor-fit-t-scale-down"] .wp-block-cover__image-background { object-fit: scale-down !important; }
  [class*="candor-fit-t-none"]       img, [class*="candor-fit-t-none"]       .wp-block-cover__image-background { object-fit: none !important; }
}
@media (max-width: 640px) {
  [class*="candor-fit-m-cover"]      img, [class*="candor-fit-m-cover"]      .wp-block-cover__image-background { object-fit: cover !important; }
  [class*="candor-fit-m-contain"]    img, [class*="candor-fit-m-contain"]    .wp-block-cover__image-background { object-fit: contain !important; }
  [class*="candor-fit-m-fill"]       img, [class*="candor-fit-m-fill"]       .wp-block-cover__image-background { object-fit: fill !important; }
  [class*="candor-fit-m-scale-down"] img, [class*="candor-fit-m-scale-down"] .wp-block-cover__image-background { object-fit: scale-down !important; }
  [class*="candor-fit-m-none"]       img, [class*="candor-fit-m-none"]       .wp-block-cover__image-background { object-fit: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   v0.3.1 — EFFEKT-SHIFT-FIX
   ───────────────────────────────────────────────────────────────────
   Effekte (Sparkle/Glow/Pulse + auch MUP-Effekte) verschieben das
   Element nicht mehr. CSS-Containment + GPU-Compositing isoliert
   die Animation vom Dokumenten-Layout.
   ═══════════════════════════════════════════════════════════════════ */
/* v0.3.2: contain:paint entfernt — versteckte Sparkle-Partikel!
   Behalten nur GPU-Hints + will-change. Layout-Containment NICHT, weil
   das hindert overflow-Animationen wie Sparkle-Partikel.
   Sparkle bleibt sichtbar, Bild verschiebt sich nicht mehr. */
[class*="candor-fx-"][class*="-pulse"],
[class*="mup-fx-pulse"], .mup-fx-pulse {
  transform-origin: center;
  display: inline-block;
  will-change: transform;
}
[class*="candor-fx-"][class*="-shimmer"] {
  will-change: background-position;
}
[class*="candor-fx-"][class*="-glow"],
[class*="candor-fx-"][class*="-sparkle"] {
  will-change: filter, opacity;
}