/**
 * Unified footer — matches design: "Stay Inspired." strip + black footer with social + logo (bottom-left).
 */
@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap');

#footer.bmf-unified-footer {
  margin: 0 !important;
  margin-top: 20px !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  flex: 0 0 auto !important;
  background: transparent !important;
  color: inherit !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* "Stay Inspired" strip — same width as case studies / content */
.bmf-footer-stay-inspired {
  background-color: #FDF5F2;
  color: #C9A227;
  font-family: 'Great Vibes', cursive;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1;
  text-align: center;
  padding: 1.75rem 5vw;
  padding-left: 5vw;
  padding-right: 5vw;
  letter-spacing: 0.02em;
  box-sizing: border-box;
  width: 100%;
}

/* Hide "Stay Inspired" on all service pages */
body[data-page-name="about"] .bmf-footer-stay-inspired,
body[data-page-name="experiential"] .bmf-footer-stay-inspired,
body[data-page-name="public-relations"] .bmf-footer-stay-inspired,
body[data-page-name="digital"] .bmf-footer-stay-inspired,
body[data-page-name="strategy-creative"] .bmf-footer-stay-inspired,
body[data-page-name="international"] .bmf-footer-stay-inspired,
body[data-page-name="virtual-events"] .bmf-footer-stay-inspired {
  display: none !important;
}

/* Digital case studies + landing: left-align footer (body has site-alignment-center which centers it otherwise) */
body[data-page-name="digital"] #footer.bmf-unified-footer {
  text-align: left !important;
}
body[data-page-name="digital"] #footer.bmf-unified-footer .bmf-footer-main {
  justify-content: flex-start !important;
}
body[data-page-name="digital"] #footer.bmf-unified-footer .bmf-footer-inner {
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
}

/* Black footer block — full width, compact height, content bottom-left */
.bmf-footer-main {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background-color: #000 !important;
  color: #fff !important;
  padding: 2rem 0 1.5rem !important;
  min-height: 120px;
  display: flex;
  align-items: flex-end;
  margin-top: 20px;
}

.bmf-footer-inner {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.bmf-footer-bottom-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}

/* Social: white circle background, black icon fill (everywhere) */
.bmf-footer-social {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.bmf-footer-social a,
.bmf-footer-social span.sqs-svg-icon--wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 50%;
  background-color: #fff;
  border: none;
  box-shadow: none;
  color: #000;
  transition: opacity 0.2s;
  flex-shrink: 0;
  box-sizing: border-box;
  cursor: default;
  pointer-events: none;
}

.bmf-footer-social a:hover,
.bmf-footer-social span.sqs-svg-icon--wrapper:hover {
  opacity: 1;
}

/* Enable footer social links (we render icons/images as <a> tags now) */
.bmf-footer-social a {
  pointer-events: auto;
  cursor: pointer;
  text-decoration: none;
}

/* Icon SVG: white fill, black stroke, black color */
.bmf-footer-social a .sqs-svg-icon--social,
.bmf-footer-social span .sqs-svg-icon--social {
  width: 100%;
  height: 100%;
  display: block;
  flex-shrink: 0;
  fill: #ffffff !important;
  stroke: #000000 !important;
  color: #000 !important;
  overflow: visible;
}

.bmf-footer-social a svg,
.bmf-footer-social span svg {
  display: block;
  width: 24px;
  height: 24px;
  fill: #ffffff !important;
  stroke: #000000 !important;
}

#footer.bmf-unified-footer .bmf-footer-social .sqs-use--icon,
#footer.bmf-unified-footer .bmf-footer-social .sqs-use--mask,
#footer.bmf-unified-footer .bmf-footer-social use {
  fill: #ffffff !important;
  stroke: #000000 !important;
  color: #000 !important;
}


/* Logo: teal/greenish-blue — larger size to match reference */
.bmf-footer-logo {
  display: block;
  flex-shrink: 0;
}

/* Same logo as header: same size (54px) and appearance */
.bmf-footer-logo img {
  display: block;
  height: 54px !important;
  max-height: 54px !important;
  width: auto !important;
  max-width: 300px;
  object-fit: contain !important;
}

@media (max-width: 767px) {
  .bmf-footer-stay-inspired {
    padding: 1.5rem 1rem;
  }
  .bmf-footer-main {
    min-height: 100px;
    padding: 1.5rem 0 1.25rem !important;
  }
  .bmf-footer-bottom-left {
    align-items: center;
    width: 100%;
  }
  /* Footer icons on mobile: white circle, black icon (same as desktop) */
  .bmf-footer-social {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
  }
  .bmf-footer-social a,
  .bmf-footer-social span.sqs-svg-icon--wrapper {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: none !important;
    background-color: #fff !important;
    overflow: visible !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  .bmf-footer-social a svg,
  .bmf-footer-social a .sqs-svg-icon--social,
  .bmf-footer-social span svg,
  .bmf-footer-social span .sqs-svg-icon--social {
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    display: block !important;
    fill: #ffffff !important;
    stroke: #000000 !important;
    color: #000 !important;
  }
  #footer.bmf-unified-footer .bmf-footer-social .sqs-use--icon,
  #footer.bmf-unified-footer .bmf-footer-social .sqs-use--mask,
  #footer.bmf-unified-footer .bmf-footer-social use {
    fill: #ffffff !important;
    stroke: #000000 !important;
    color: #000 !important;
  }
  .bmf-footer-logo img {
    height: 54px !important;
    max-height: 54px !important;
    max-width: 300px !important;
  }
}