/**
 * Block-compat shims.
 *
 * When a section is rebuilt from raw HTML into native Gutenberg blocks, a few
 * core blocks add their own wrapper/spacing (e.g. core/image's <figure>,
 * core/table's <figure>). These rules neutralise that extra spacing so the
 * front end stays pixel-identical to the approved design. Grouped per section.
 * Loaded on both the front end and inside the editor.
 */

/* ---------- Team grid: core/image inside .team-card ---------- */
/* Native block groups inject block-gap margins between children; the original
   cards were flush. Zero the gap on these containers (the theme's own element
   margins, e.g. .team-info h3, are untouched). */
.team-grid.wp-block-group,
.team-card.wp-block-group,
.team-info.wp-block-group { --wp--style--block-gap: 0px; }
.team-card.wp-block-group > * + *,
.team-info.wp-block-group > * + * { margin-block-start: 0; }
.team-card .wp-block-image { margin: 0; }
.team-card .wp-block-image img { display: block; width: 100%; }

/* ---------- Converted section containers ---------- */
/* Native core/group wrappers inject block-gap margins between children; the
   original raw-HTML sections had none (their spacing comes from element
   margins). Zero the block-gap on every converted container so spacing is
   unchanged; theme element margins are untouched. */
.attr-band.wp-block-group, .feature-grid.wp-block-group, .product-grid.wp-block-group,
.hero-cta.wp-block-group, .md-portrait.wp-block-group, .md-figure.wp-block-group,
.detail-visual.wp-block-group, .callout.wp-block-group, .container.wp-block-group,
.section-head.wp-block-group, .section-video.wp-block-group {
	--wp--style--block-gap: 0px;
}
.attr-band.wp-block-group > * + *, .feature-grid.wp-block-group > * + *,
.product-grid.wp-block-group > * + *, .hero-cta.wp-block-group > * + *,
.md-portrait.wp-block-group > * + *, .md-figure.wp-block-group > * + *,
.detail-visual.wp-block-group > * + *, .callout.wp-block-group > * + * {
	margin-block-start: 0;
}

/* core/image inside fixed-ratio image shells → the <figure> must fill the shell
   (its default height is auto) so the photo frames exactly like the bare <img>. */
.detail-visual .wp-block-image, .md-figure .wp-block-image { margin: 0; height: 100%; }
.detail-visual .wp-block-image img, .md-figure .wp-block-image img { display: block; width: 100%; height: 100%; object-fit: cover; }