/* =============================================================================
   ARTICLE IMAGE + CAPTION — ONE SHADOW, ZERO SEAM, PARAGRAPH-RHYTHM MATCH
   - Half-width figure floats LEFT/RIGHT; text wraps; stacks on phones
   - Unified shadow on the <figure> (never on the <img> or <figcaption>)
   - Caption is completely flush to the image (no gap, no “top shadow”)
   - Prevent doubled spacing by syncing to paragraph rhythm above/below
   ============================================================================ */

/* Tunables — match to your site */
figure.article-img{
  --card-shadow: 0 8px 22px rgba(0,0,0,.18); /* unified card shadow */
  --card-radius: 8px;                         /* set 0 if no rounding is desired */
  --cap-pad-x: 10px;                          /* caption left/right padding */
  --cap-pad-b: 10px;                          /* caption bottom padding */
  --card-bg: #fff;                            /* card/caption background */
}

/* Base card (image + caption act as a single unit) */
figure.article-img{
  width: 50%;
  max-width: 50%;
  box-sizing: border-box;

  /* match paragraph rhythm: no extra top gap; 1rem bottom like <p> */
  margin: 0 0 1rem;

  background: var(--card-bg);
  box-shadow: var(--card-shadow);   /* SINGLE shadow for both image + caption */
  border-radius: var(--card-radius);
  overflow: hidden;                 /* unify corners across image+caption */
}

/* Float directions */
figure.article-img.left  { float: left;  margin: 0 1rem 1rem 0; }
figure.article-img.right { float: right; margin: 0 0 1rem 1rem; }

/* Neutralize editor centering that can fight floats */
figure.article-img[data-align="center"]{
  margin-left: 0;
  margin-right: 0;
  text-align: initial;
}

/* Image: fill width; never cast own shadow; no baseline/descender gap */
figure.article-img > a,
figure.article-img > img{ display:block; }

figure.article-img > a{
  line-height: 0; font-size: 0; margin: 0; padding: 0; border: 0;
}

figure.article-img img{
  width: 100%;
  height: auto;
  display: block;
  vertical-align: top;
  margin: 0;

  /* ensure shadow only comes from the figure */
  box-shadow: none !important;
  filter: none !important;      /* cancels filter: drop-shadow(...) if present */
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
}

/* Caption: FLUSH to image; NO top seam; NO own shadow/border */
figure.article-img figcaption{
  margin: 0 !important;                               /* zero gap above */
  padding: 0 var(--cap-pad-x) var(--cap-pad-b) !important; /* no top padding */
  line-height: 1.4;
  box-sizing: border-box;

  /* kill any theme separators/lines/shadows that create a "top shadow" */
  border: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  outline: 0 !important;
  position: relative;
}

/* Some themes inject separators via pseudo elements — force them off */
figure.article-img figcaption::before,
figure.article-img figcaption::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: none !important;
}

/* Remove default margins if caption text is wrapped in <p> */
figure.article-img figcaption > p{
  margin: 0 !important;
  padding: 0 !important;
}

/* Paragraph rhythm integration — avoid doubled spacing when adjacent */
p + figure.article-img{ margin-top: 0 !important; }   /* no extra gap after a <p> */
figure.article-img + p{ margin-top: 0 !important; }   /* let paragraph handle spacing */

/* Common heading/list adjacencies (kept subtle) */
h2 + figure.article-img,
h3 + figure.article-img,
h4 + figure.article-img,
ul + figure.article-img,
ol + figure.article-img{ margin-top: 0 !important; }
figure.article-img + ul,
figure.article-img + ol{ margin-top: 0.5rem !important; }
figure.article-img + h2,
figure.article-img + h3,
figure.article-img + h4{ margin-top: 0.75rem !important; }

/* Mobile: stack full-width */
@media (max-width: 600px){
  figure.article-img{
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 0 0 1rem 0;
  }
}

/* Optional: clearfix for any wrapper around floated figures */
.article-text::after{
  content: "";
  display: table;
  clear: both;
}
