/* Approved hero refinement: photo first, with clearer background artwork. */
.hero {
  position: relative;
  isolation: isolate;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: url("assets/road-watercolor.png") center 48% / cover no-repeat;
  opacity: .32;
}
.hero > .hero-grid {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
}
.hero-signature {
  max-width: calc(100% - 124px);
  margin-top: 44px;
}
.hero-signature .son-portrait { width: 104px; height: 104px; }
@media (max-width: 760px) {
  .hero > .hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 26px;
    padding-bottom: 44px;
  }
  .hero-visual {
    grid-column: 1;
    grid-row: 1;
    width: min(100%, 320px);
    justify-self: center;
    padding: 0;
  }
  .hero .portrait-frame { height: clamp(280px, 85vw, 340px); }
  .hero .portrait-caption { max-width: none; margin-top: 10px; }
  .hero-copy {
    display: flex;
    grid-column: 1;
    grid-row: 2;
    padding: 0;
  }
  .hero-heading { margin-bottom: 22px; }
  .hero-copy > .hero-introduction { margin-bottom: 26px; }
  .hero-signature { max-width: calc(100% - 99.2px); margin-top: 36px; }
  .hero-signature .son-portrait { width: 83.2px; height: 83.2px; }
}
/* Existing source credit remains unchanged outside the hero. */
.road-credit{padding:0 0 24px;font-size:12.1px;line-height:1.6;color:#d9c6b3}
.road-credit a{color:inherit;text-underline-offset:3px}
@media(max-width:600px){.road-credit{font-size:11px}}

.hero-shop-note { max-width: 36rem; margin: 18px 0 0; font-size: 15px; line-height: 1.6; }