/* Gutenberg block normalization for the BDLCONSULT visual editor. The
 * original design classes remain the source of truth; these rules only keep
 * native blocks from adding browser/editor spacing around them. */
.wp-block-group { box-sizing: border-box; }
.wp-block-group > .wp-block-group { max-width: none; }
.wp-block-image { margin: 0; }
.wp-block-image img { display: block; max-width: 100%; height: auto; }
.wp-block-buttons { display: flex; align-items: center; gap: 23px; flex-wrap: wrap; }
.wp-block-button { margin: 0; }
.wp-block-button__link { display: inline-flex; align-items: center; justify-content: space-between; gap: 23px; }
.wp-block-button.button > .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 23px;
    min-height: 56px;
    padding: 9px 9px 9px 25px;
    border: 1px solid transparent;
    border-radius: 99px;
    background: var(--blue);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}
.wp-block-button.button.secondary > .wp-block-button__link {
    background: #fff;
    border-color: var(--line);
    color: var(--ink);
}
.wp-block-button.button > .wp-block-button__link::after {
    content: "↗";
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    border-radius: 50%;
    background: #ffffff20;
    font-size: 20px;
    line-height: 1;
}
.wp-block-button.button.secondary > .wp-block-button__link::after {
    background: var(--blue-light);
    color: var(--blue);
}
.wp-block-paragraph { margin-top: 0; }
.entry-content > .wp-block-group { width: 100%; }

/* Project covers are native Image blocks inside their clickable visual group. */
.project-visual { display: block; }
.project-visual .wp-block-image { position: absolute; inset: 0; width: 100%; height: 100%; }
.project-visual .wp-block-image a,
.project-visual .wp-block-image img { display: block; width: 100%; height: 100%; }
.project-visual .wp-block-image img { object-fit: cover; }
.project-visual .image-label { z-index: 2; }

/* The original CSS targets images directly. Gutenberg adds a figure wrapper,
 * so make that wrapper transparent and pass the sizing through to the image. */
.hero-art .wp-block-image,
.about-visual .wp-block-image,
.detail-image .wp-block-image,
.case-hero-image .wp-block-image { width: 100%; height: 100%; margin: 0; }
.hero-art .wp-block-image img,
.about-visual .wp-block-image img,
.detail-image .wp-block-image img,
.case-hero-image .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.hero-art .wp-block-image img { border-radius: 130px 32px 32px 32px; object-position: 47% center; }
.about-visual .wp-block-image img { border-radius: inherit; }
.detail-image .wp-block-image img { border-radius: 70px 28px 28px 28px; }
.case-hero-image { margin: 0; }
.case-hero-image .wp-block-image img { border-radius: 30px; }
.case-hero-image.source-visual .wp-block-image img { object-fit: contain; height: auto; min-height: 300px; background: #f2f5fa; }
.wp-block-image.product-logo { width: auto; max-width: 225px; height: 68px; }
.wp-block-image.product-logo img { width: auto; max-width: 225px; height: 68px; object-fit: contain; object-position: left center; margin: 0 0 23px; }

/* Keep the editor canvas close to the front-end composition. */
.editor-styles-wrapper .wp-block-group { max-width: none; }

/* Keep the editor preview faithful to the public composition. Gutenberg's
 * default canvas is narrow and its flow layout can otherwise stack the
 * custom visual sections even though the front-end uses explicit grids. */
.editor-styles-wrapper {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow-x: hidden;
}
.editor-styles-wrapper .wrap {
  width: min(1280px, calc(100% - 96px));
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}
.editor-styles-wrapper .wp-block-group {
  margin-block-start: 0;
}
.editor-styles-wrapper .hero-layout,
.editor-styles-wrapper .about-grid,
.editor-styles-wrapper .expertise-grid,
.editor-styles-wrapper .project-grid,
.editor-styles-wrapper .detail-grid,
.editor-styles-wrapper .case-hero-grid,
.editor-styles-wrapper .case-story,
.editor-styles-wrapper .channels,
.editor-styles-wrapper .gallery-grid,
.editor-styles-wrapper .value-grid,
.editor-styles-wrapper .audience-grid {
  display: grid !important;
}
.editor-styles-wrapper .hero-layout { grid-template-columns: 1.07fr 1fr; }
.editor-styles-wrapper .about-grid { grid-template-columns: 1fr 1fr; }
.editor-styles-wrapper .expertise-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editor-styles-wrapper .project-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.editor-styles-wrapper .detail-grid,
.editor-styles-wrapper .case-hero-grid,
.editor-styles-wrapper .case-story { grid-template-columns: 1.08fr 1fr; }
.editor-styles-wrapper .channels { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.editor-styles-wrapper .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editor-styles-wrapper .value-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.editor-styles-wrapper .audience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editor-styles-wrapper .wp-block-image { max-width: 100%; }

@media (max-width: 960px) {
  .editor-styles-wrapper .hero-layout,
  .editor-styles-wrapper .about-grid,
  .editor-styles-wrapper .detail-grid,
  .editor-styles-wrapper .case-hero-grid,
  .editor-styles-wrapper .case-story { grid-template-columns: 1fr; }
  .editor-styles-wrapper .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editor-styles-wrapper .channels { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .editor-styles-wrapper .wrap { width: calc(100% - 40px); }
  .editor-styles-wrapper .expertise-grid,
  .editor-styles-wrapper .project-grid,
  .editor-styles-wrapper .gallery-grid,
  .editor-styles-wrapper .value-grid,
  .editor-styles-wrapper .audience-grid { grid-template-columns: 1fr; }
}

/* Edited Group blocks can carry a vertical flex layout class. Preserve the
 * validated two-column composition for the visual containers. */
.editor-styles-wrapper .hero-layout,.editor-styles-wrapper .about-grid,.editor-styles-wrapper .expertise-grid,.editor-styles-wrapper .project-grid,.editor-styles-wrapper .detail-grid,.editor-styles-wrapper .case-hero-grid,.editor-styles-wrapper .case-story,.editor-styles-wrapper .channels,.editor-styles-wrapper .gallery-grid,.editor-styles-wrapper .value-grid,.editor-styles-wrapper .audience-grid,.editor-styles-wrapper .offer-grid,.editor-styles-wrapper .steps,.editor-styles-wrapper .contact-grid{display:grid!important}