.hero__inner > picture,
.recruit-hero__inner > picture { display: contents; }

@media (max-width: 768px) {
  .site-header {
    margin-bottom: -61px;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }

  .site-header::after {
    top: 0;
    bottom: auto;
    height: 100px;
    background: linear-gradient(180deg, rgba(65, 49, 30, 0.55), rgba(65, 49, 30, 0.22) 61%, transparent);
    opacity: 0;
    transition: opacity 220ms ease;
  }

  .site-header .site-header__logo img { filter: brightness(0) invert(1); }
  .site-header:not(.is-menu-open) .site-header__toggle { color: #fff; }
  .site-header.site-header--scrolled { background: transparent; box-shadow: none; }
  .site-header.site-header--scrolled::after,
  .site-header.site-header--light-fv::after { opacity: 1; }
  .site-header.is-menu-open { background: var(--color-bg-light); }
  .site-header.is-menu-open .site-header__logo img { filter: none; }
  .site-header.is-menu-open::after { opacity: 0; }
  body.header-no-hero .site-header { margin-bottom: 0; }

  .hero {
    height: 761px;
    background: linear-gradient(88.41deg, #332616 1.35%, #554430 97.81%);
  }

  .hero::after {
    top: 544px;
    right: auto;
    bottom: auto;
    left: 50%;
    width: var(--sp-canvas-width);
    height: 217px;
    background: rgba(65, 49, 30, 0.82);
    transform: translateX(-50%);
  }

  .hero__media {
    inset: 0 auto 0 50%;
    width: var(--sp-canvas-width);
    height: 100%;
    transform: translateX(-50%);
  }

  .hero__media video { object-fit: cover; object-position: center; }
  .hero__shade { height: 546px; }
  .hero__inner { height: 493px; padding: 161px 20px 0; }
  .hero__logo { width: 56px; height: 56px; }
  .hero__copy { gap: 22px; padding-top: 30px; }
  .hero h1 { font-size: 29px; line-height: 39px; }
  .hero__lead { font-size: 15px; line-height: 31px; }
  .hero__actions { top: 487px; height: 58px; }
  .button--hero,
  .button--hero-secondary { height: 58px; }

  .hero-stats {
    top: 553px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, 90px);
    gap: 8px;
    height: 190px;
    max-width: 360px;
    padding: 0 16px;
  }

  .hero-stat,
  .hero-stat--wide { width: 100%; height: 90px; padding-top: 15px; }
  .hero-stat:first-child { grid-column: 1 / -1; justify-self: center; width: 200px; }
  .hero-stat__number { height: 30px; }
  .hero-stat__number span { font-size: 36px; }
  .hero-stat__number small,
  .hero-stat--wide .hero-stat__number small { font-size: 14px; }
  .hero-stat__label { margin-top: 5px; font-size: 15px; line-height: 20px; }
  .hero-stat__note { margin-top: 8px; font-size: 7px; line-height: 11px; }
  .hero-stat__laurel { top: 5px; width: 44px; height: 72px; opacity: 0.8; }
  .hero-stat__laurel--left { left: 0; transform: none; }
  .hero-stat__laurel--right { right: 0; transform: scaleX(-1); }

  .recruit-hero { height: auto; }
  .recruit-hero__media,
  .recruit-hero__shade { height: 100%; }
  .recruit-hero__media video { object-fit: cover; object-position: center; }
  .recruit-hero__inner { height: auto; padding: 161px 20px 0; }
  .recruit-hero__logo { width: 56px; height: 56px; }
  .recruit-hero__copy { margin-top: 30px; }
  .recruit-hero h1 { width: 100%; font-size: 29px; line-height: 39px; letter-spacing: 0.52px; }
  .recruit-hero__lead-row { margin-top: 22px; gap: 12px; align-items: center; }
  .recruit-hero__badge { width: 120px; }
  .recruit-hero__lead-row p { width: auto; flex: 1; font-size: 14px; line-height: 24px; letter-spacing: 0; }
  .recruit-hero__actions { position: static; min-height: 58px; margin: 39px -20px 0; }
  .recruit-hero__actions .recruit-button { height: 58px; padding-inline: 0; font-size: 14px; line-height: 21px; letter-spacing: 0; }
}