.hero { background-image: none; background-color: #d6cfc6; }
.hero__poster { position: absolute; z-index: 0; inset: 0; }
.hero__poster img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero__video { opacity: 0; transition: opacity .6s ease; }
.hero__video.is-ready { opacity: 1; }
.hero__motion-toggle { position: absolute; right: 114px; bottom: 30px; z-index: 3; display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 10px 16px; border: 1px solid #ffffff70; border-radius: 30px; background: #332c2866; color: white; font: 400 .75rem var(--sans); cursor: pointer; }
.hero__motion-toggle[hidden] { display: none; }
.hero__motion-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero__motion-play { display: none; }
.hero__motion-toggle[data-state="paused"] .hero__motion-pause { display: none; }
.hero__motion-toggle[data-state="paused"] .hero__motion-play { display: block; }
.hero__motion-toggle:hover { background: #332c28b3; }
.hero__motion-toggle:focus-visible { outline: 2px solid white; outline-offset: 4px; }
@media (max-width: 760px) {
  .hero { min-height: var(--hero-mobile-height, 100svh); }
  .site-header,
  .site-header.is-fixed {
    height: 72px;
    transition: background-color .35s ease, color .35s ease, border-color .35s ease;
  }
  .hero__motion-toggle { display: none; }
  .hero__video,
  .hero__video.is-ready { display: none; }
  .hero__video::-webkit-media-controls,
  .hero__video::-webkit-media-controls-start-playback-button { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { .hero__video { display: none; transition: none; } }