/* Mobile hero refinement. Keep desktop composition and original photo intact. */
@media (max-width: 700px) {
  .hero {
    --hero-photo-height: clamp(225px, 58vw, 360px);
    display: flex;
    flex-direction: column;
  }
  .hero-inner { order: 0; }
  .hero-copy { padding: 30px 0 22px; }
  .hero .btn {
    width: auto;
    max-width: 100%;
    min-width: 0;
    min-height: 44px;
    margin-bottom: 0;
    padding: 11px 18px;
    gap: 18px;
    justify-content: center;
    font-size: 13px;
  }
  .hero .btn .icon { width: 20px; height: 20px; }
  .hero-image {
    position: relative;
    order: 1;
    inset: auto;
    width: 100%;
    height: var(--hero-photo-height);
    object-position: center 61%;
  }
  .hero::after {
    z-index: 1;
    inset: auto 0 0;
    height: var(--hero-photo-height);
    background: linear-gradient(180deg, #fff3e9 0, #fff3e9b8 20px, #fff3e940 46px, #fff3e900 76px);
  }
}