/*
 * Old Wide Eye blocks on posts.
 * The post column is off-center, so these full-width blocks stay inside the
 * column and draw their full-width background behind it instead (same fix as
 * the MFOL blocks). Pages are not affected.
 */

/* Keep the block in the post column instead of stretching it to 100vw */
.single-post .gutenberg-content > .image-text-block.alignfull,
.single-post .gutenberg-content > .block-stats-with-media.alignfull,
.single-post .gutenberg-content > .impact-stat.alignfull,
.single-post .gutenberg-content > .block-index-cards.alignfull,
.single-post .gutenberg-content > .block-feature-accordion.alignfull {
  left: auto;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100%;
  right: auto;
  width: 100%;
}

/* The post column already has side padding, so drop the block's own */
.single-post .gutenberg-content > .image-text-block.alignfull .container,
.single-post .gutenberg-content > .block-stats-with-media.alignfull .container,
.single-post .gutenberg-content > .impact-stat.alignfull .container,
.single-post .gutenberg-content > .block-index-cards.alignfull .container,
.single-post .gutenberg-content > .block-feature-accordion.alignfull .container {
  padding-left: 0;
  padding-right: 0;
}

/* Solid backgrounds, drawn edge to edge */
.single-post .gutenberg-content > .block-stats-with-media.alignfull,
.single-post .gutenberg-content > .impact-stat.alignfull {
  border-image: conic-gradient(var(--color-black) 0 0) fill 0 / / 0 100vw;
}
.single-post .gutenberg-content > .image-text-block.green-background.alignfull {
  border-image: conic-gradient(var(--color-green) 0 0) fill 0 / / 0 100vw;
}

/* Image and Text right after Stats With Media keeps the black band at the top */
.single-post .gutenberg-content > .block-stats-with-media + .image-text-block.alignfull {
  border-image: linear-gradient(var(--color-black) 153px, var(--color-white) 153px) fill 0 / / 0 100vw;
}
.single-post .gutenberg-content > .block-stats-with-media + .image-text-block.green-background.alignfull {
  border-image: linear-gradient(var(--color-black) 153px, var(--color-green) 153px) fill 0 / / 0 100vw;
}
@media (min-width: 992px) {
  .single-post .gutenberg-content > .block-stats-with-media + .image-text-block.green-background.alignfull {
    border-image: linear-gradient(var(--color-black) 177px, var(--color-green) 177px) fill 0 / / 0 100vw;
  }
}

/* Textured background (Index Cards, Feature Accordion "Textured"), drawn edge to edge */
.single-post .gutenberg-content > .block-index-cards.alignfull,
.single-post .gutenberg-content > .block-feature-accordion.bg-image.alignfull {
  background-image: none;
  isolation: isolate;
}
.single-post .gutenberg-content > .block-index-cards.alignfull::before,
.single-post .gutenberg-content > .block-feature-accordion.bg-image.alignfull::before {
  background-attachment: fixed;
  background-image: url("../../static/images/index-cards-bg-mobile.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  bottom: 0;
  content: "";
  left: -100vw;
  position: absolute;
  right: -100vw;
  top: 0;
  z-index: -1;
}
@media (min-width: 960px) {
  .single-post .gutenberg-content > .block-index-cards.alignfull::before,
  .single-post .gutenberg-content > .block-feature-accordion.bg-image.alignfull::before {
    background-image: url("../../static/images/index-cards-bg-tablet.jpg");
  }
}
@media (min-width: 992px) {
  .single-post .gutenberg-content > .block-index-cards.alignfull::before,
  .single-post .gutenberg-content > .block-feature-accordion.bg-image.alignfull::before {
    background-image: url("../../static/images/index-cards-bg.jpg");
  }
}

/* Keep a white gap between the green post header and a green block right below it */
.single-post .topper:has(+ .image-text-block.green-background),
.single-post .topper:has(+ .block-post-grid.green-background) {
  --topper-margin-bottom: clamp(56px, 7vw, 80px);
}