/* Base hero */
.shb-hero,
.wp-block-shb-hero {
  position: relative;
  display: block;
  min-height: 40vh;
  padding: 64px 16px;
  color: #fff;
  background-repeat: no-repeat;
}

.shb-hero-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.shb-hero-inner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

/* Typography */
.shb-hero-heading {
  margin: 0 0 12px 0;
  font-size: 2.5rem;
  line-height: 1.1;
}

.shb-hero-subheading {
  margin: 0;
  font-size: 1.125rem;
  opacity: 0.9;
}

/* Alignment modifiers */
.shb-hero.is-left .shb-hero-inner { text-align: left; }
.shb-hero.is-center .shb-hero-inner { text-align: center; }
.shb-hero.is-right .shb-hero-inner { text-align: right; }

/* Animation (matches your working pattern) */
.animated-hero-block {
  text-align: center;
  overflow: hidden;
  position: relative;
  margin-top: 0;
}

.animated-hero-content {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 600ms ease, transform 600ms ease;
}

.animated-hero-block.is-inview .animated-hero-content {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger children for nicer effect */
.animated-hero-block.is-inview .animated-hero-content > * {
  transition: opacity 600ms ease, transform 600ms ease;
}
.animated-hero-block.is-inview .animated-hero-content > *:nth-child(1) { transition-delay: 60ms; }
.animated-hero-block.is-inview .animated-hero-content > *:nth-child(2) { transition-delay: 120ms; }
.animated-hero-block.is-inview .animated-hero-content > *:nth-child(3) { transition-delay: 180ms; }

@media (prefers-reduced-motion: reduce) {
  .animated-hero-content,
  .animated-hero-block.is-inview .animated-hero-content,
  .animated-hero-block.is-inview .animated-hero-content > * {
    transition: none;
    opacity: 1;
    transform: none;
  }
}

@media (min-width: 768px) {
  .shb-hero { padding: 96px 24px; }
  .shb-hero-heading { font-size: 3rem; }
  .shb-hero-subheading { font-size: 1.25rem; }
}