/* Copperclad Gutenberg compatibility layer.
   Keeps the approved static-site front-end geometry while allowing native WP blocks in the editor. */

/* Remove Gutenberg's generic block spacing from the bespoke Copperclad layout. */
main .wp-block-group,
main .wp-block-image,
main .wp-block-heading,
main .wp-block-paragraph,
main .wp-block-list,
main .wp-block-quote {
  margin-block-start: 0;
  margin-block-end: 0;
}
main .wp-block-image { margin: 0; }
main .wp-block-image img { display: block; max-width: 100%; }

/* Hero: preserve original two-column composition. */
.hero { display: grid !important; }
.hero > .hero-copy,
.hero > .hero-art,
.hero > .hero-proof { min-width: 0; }
.hero-copy { display: flex !important; }
.hero-actions { display: flex !important; flex-direction: row !important; align-items: center !important; }
.hero-actions > .wp-block-paragraph { margin: 0 !important; }
.wp-block-paragraph.button { padding: 0 !important; background: transparent; }
.wp-block-paragraph.button > a {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  background: inherit;
  color: inherit;
  text-decoration: none;
}
.wp-block-paragraph.button--dark > a { background: var(--ink); color: var(--paper); }
.wp-block-paragraph.button--dark > a:hover { background: var(--copper); }
.wp-block-paragraph.button--outline > a { border: 1px solid var(--ink); }
.wp-block-paragraph.button--outline > a:hover { background: var(--ink); color: var(--paper); }
.wp-block-paragraph.text-link > a { color: inherit; text-decoration: none; }

.hero-art > figure.hero-photo,
.hero-art > .wp-block-image.hero-photo {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}
.hero-art > figure.hero-photo img,
.hero-art > .wp-block-image.hero-photo img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
}
.hero-proof > .wp-block-group { display: grid; }
.hero-proof > .wp-block-group > p { margin: 0; }

/* Audience cards: retain full-card interaction without letting the invisible overlay affect layout. */
.audience-card > .cc-block-overlay-link {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.audience-card > .cc-block-overlay-link::after { display: none !important; }
.audience-card > .card-topline,
.audience-card > h3,
.audience-card > p { position: relative; z-index: 1; }
.audience-card > .audience-card-link { margin-top: auto !important; }

/* Selected work: the current static site uses contained photographs in black cards. */
#work .project-grid { display: grid !important; }
#work figure.project-card,
#work .wp-block-image.project-card {
  position: relative !important;
  display: block !important;
  min-height: 560px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #17120f !important;
  color: white;
}
#work figure.project-card::before,
#work figure.project-card::after,
#work .wp-block-image.project-card::before,
#work .wp-block-image.project-card::after { display: none !important; content: none !important; }
#work figure.project-card > a,
#work .wp-block-image.project-card > a {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
}
#work figure.project-card img,
#work .wp-block-image.project-card img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #17120f !important;
}
/* Cancel the old class-based background fallbacks now that the card image is a real editable Image block. */
#work .project-card--ft,
#work .project-card--pier,
#work .project-card--residential { background-image: none !important; }

/* Image-block wrappers should behave like the original image elements/figures. */
.help-role-photo.wp-block-image,
.expertise-team-photo.wp-block-image,
.manufacturer-photo-brief.wp-block-image,
.material-brand-logo.wp-block-image,
.manufacturer-logo-image.wp-block-image,
.award-row__badge.wp-block-image,
.manufacturer-recognition__logo.wp-block-image { margin: 0; }
.help-role-photo.wp-block-image img,
.expertise-team-photo.wp-block-image img,
.manufacturer-photo-brief.wp-block-image img { width: 100%; height: auto; }

/* Nested figure blocks used on proof/award cards should not add browser margins. */
figure.wp-block-group,
figure .wp-block-image { margin: 0; }

/* Core quote/list wrappers: preserve bespoke typography/spacing from site.css. */
blockquote.wp-block-quote { margin: 0; padding: 0; border: 0; }
ol.wp-block-list,
ul.wp-block-list { margin-top: 0; margin-bottom: 0; }

/* Contact/direct links: Gutenberg wraps links in paragraphs; remove those extra box-model effects. */
.direct-contact > p { margin: 0; }
.direct-contact > p > a { display: inline-block; }

/* Tablet/mobile must follow the approved static breakpoints. */
@media (max-width: 980px) {
  .hero-actions { flex-wrap: wrap; }
  #work figure.project-card,
  #work .wp-block-image.project-card { min-height: 480px !important; }
}
@media (max-width: 700px) {
  .hero-actions { flex-direction: column !important; align-items: flex-start !important; }
  .hero-art > figure.hero-photo,
  .hero-art > .wp-block-image.hero-photo { position: absolute !important; }
}
