.hero--brand {
  min-height: 600px;
  color: #4d2e28;
  background: #fcf0d3;
  isolation: isolate;
  align-items: center;
}
.hero--brand::before, .hero--brand::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 440px;
  height: 220px;
  border-radius: 50%;
  pointer-events: none;
}
.hero--brand::before {
  top: -160px; right: -70px;
  background: #edcc19;
  box-shadow: -170px 55px 0 #aa64b1;
  transform: rotate(16deg);
}
.hero--brand::after {
  bottom: -190px; left: -110px;
  background: #33883b;
  box-shadow: 220px -30px 0 #55aaae, 420px 65px 0 #edcc19;
  transform: rotate(12deg);
}
.hero--brand .hero__content {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 76px;
  align-items: center;
  padding-block: 76px;
}
.hero__logo-frame {
  display: flex;
  justify-content: center;
  align-items: center;
  background: white;
  border: 7px solid #4d2e28;
  border-radius: 82px;
  padding: 30px 24px;
}
.hero__logo { display: block; width: 100%; height: auto; }
.hero--brand .eyebrow {
  margin: 0 0 18px;
  color: #4d2e28;
  font-size: .875rem;
  letter-spacing: .13em;
}
.hero--brand h1 {
  font-family: "Yu Gothic", "YuGothic", Meiryo, sans-serif;
  font-weight: 800;
  font-size: clamp(2rem, 4.1vw, 3.7rem);
  letter-spacing: .015em;
  line-height: 1.55;
}
.hero__caption {
  margin: 24px 0 0;
  font-size: 1rem;
  font-weight: 700;
  color: #33883b;
}
@media (max-width: 760px) {
  .hero--brand { min-height: 560px; }
  .hero--brand .hero__content {
    grid-template-columns: 1fr;
    gap: 26px;
    padding-block: 48px 52px;
    text-align: center;
  }
  .hero__logo-frame {
    width: 166px;
    margin-inline: auto;
    padding: 20px 18px;
    border-width: 5px;
    border-radius: 55px;
  }
  .hero--brand .eyebrow { margin-bottom: 10px; font-size: .8rem; }
  .hero--brand h1 { font-size: clamp(1.8rem, 7.7vw, 2.5rem); line-height: 1.45; }
  .hero__caption { margin-top: 14px; font-size: .9375rem; }
  .hero--brand::before { right: -260px; top: -180px; }
  .hero--brand::after { left: -290px; bottom: -220px; }
}
