body.sooye-motion-v4 {
  --m4-ink: #0c0e0d;
  --m4-paper: #f4f2ed;
  --m4-white: #fff;
  --m4-gold: #b58b4b;
  --m4-green: #174e3d;
  --m4-rust: #9b3d26;
  --m4-line: rgba(181, 139, 75, .34);
  --m4-ease: cubic-bezier(.2, .78, .2, 1);
}

.sooye-m4-transition,
.sooye-m4-transition *,
.sooye-m4-launch,
.sooye-m4-launch *,
.sooye-motion-v4 .sooye-bj-quick,
.sooye-motion-v4 .sooye-bj-quick * {
  box-sizing: border-box;
  letter-spacing: 0;
}

.sooye-m4-transition {
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  visibility: hidden;
  z-index: 12040;
}

.sooye-m4-transition__panels {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  inset: 0;
  position: absolute;
}

.sooye-m4-transition__panels i {
  background: var(--m4-ink);
  display: block;
  transform: scaleY(0);
  transform-origin: bottom;
}

.sooye-m4-transition__label {
  color: var(--m4-white);
  display: grid;
  gap: 10px;
  left: 50%;
  opacity: 0;
  position: absolute;
  text-align: center;
  top: 50%;
  transform: translate3d(-50%, 18px, 0);
  z-index: 1;
}

.sooye-m4-transition__label span {
  color: var(--m4-gold);
  font: 700 10px/1 Arial, Helvetica, sans-serif;
}

.sooye-m4-transition__label strong {
  font: 700 13px/1.2 Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

html.sooye-m4-pending .sooye-m4-transition,
body.sooye-m4-leaving .sooye-m4-transition,
body.sooye-m4-entering .sooye-m4-transition {
  opacity: 1;
  visibility: visible;
}

html.sooye-m4-pending .sooye-m4-transition__panels i,
body.sooye-m4-leaving .sooye-m4-transition__panels i {
  transform: scaleY(1);
}

body.sooye-m4-leaving .sooye-m4-transition {
  pointer-events: auto;
}

body.sooye-m4-leaving .sooye-m4-transition__panels i {
  transition: transform 500ms var(--m4-ease);
}

body.sooye-m4-leaving .sooye-m4-transition__panels i:nth-child(2) { transition-delay: 55ms; }
body.sooye-m4-leaving .sooye-m4-transition__panels i:nth-child(3) { transition-delay: 110ms; }
body.sooye-m4-leaving .sooye-m4-transition__panels i:nth-child(4) { transition-delay: 165ms; }

body.sooye-m4-leaving .sooye-m4-transition__label {
  opacity: 1;
  transform: translate3d(-50%, 0, 0);
  transition: opacity 260ms ease 170ms, transform 420ms var(--m4-ease) 170ms;
}

html.sooye-m4-pending body.sooye-m4-entering .sooye-m4-transition__panels i {
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 620ms var(--m4-ease);
}

html.sooye-m4-pending body.sooye-m4-entering .sooye-m4-transition__panels i:nth-child(2) { transition-delay: 45ms; }
html.sooye-m4-pending body.sooye-m4-entering .sooye-m4-transition__panels i:nth-child(3) { transition-delay: 90ms; }
html.sooye-m4-pending body.sooye-m4-entering .sooye-m4-transition__panels i:nth-child(4) { transition-delay: 135ms; }

html.sooye-m4-pending body.sooye-m4-entering .sooye-m4-transition__label {
  opacity: 0;
  transform: translate3d(-50%, -14px, 0);
  transition: opacity 220ms ease, transform 420ms var(--m4-ease);
}

body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-media {
  filter: blur(7px) grayscale(.2) brightness(.78);
  opacity: .76;
  scale: 1.018;
}

body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-media {
  filter: grayscale(.04) contrast(1.1) brightness(1.02);
  opacity: 1;
  scale: 1;
  transition: filter 720ms var(--m4-ease), opacity 560ms ease, scale 760ms var(--m4-ease);
}

body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-inner > .syv3-eyebrow,
body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-inner > h1,
body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-inner > .syv3-hero-copy,
body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-inner > .syv3-actions,
body.sooye-motion-v4.sooye-m4-arriving .syv3-hero-inner > .syv3-hero-facts {
  clip-path: inset(0 0 100% 0);
  opacity: 0;
  translate: 0 24px;
}

body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-inner > * {
  clip-path: inset(0 0 0 0);
  opacity: 1;
  translate: 0 0;
  transition: clip-path 720ms var(--m4-ease) var(--m4-delay, 0ms), opacity 420ms ease var(--m4-delay, 0ms), translate 720ms var(--m4-ease) var(--m4-delay, 0ms);
}

body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-inner > h1 { --m4-delay: 70ms; }
body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-inner > .syv3-hero-copy { --m4-delay: 140ms; }
body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-inner > .syv3-actions { --m4-delay: 210ms; }
body.sooye-motion-v4.sooye-m4-arriving.sooye-m4-arrived .syv3-hero-inner > .syv3-hero-facts { --m4-delay: 280ms; }

.sooye-m4-launch {
  align-items: center;
  background: var(--m4-ink);
  border: 1px solid rgba(255, 255, 255, .18);
  color: var(--m4-white);
  cursor: pointer;
  display: grid;
  gap: 7px;
  min-height: 118px;
  padding: 16px 11px;
  position: fixed;
  right: 0;
  text-transform: uppercase;
  top: 56%;
  translate: 0 -50%;
  width: 48px;
  z-index: 10015;
}

.sooye-m4-launch::before {
  background: var(--m4-gold);
  content: '';
  inset: 0 auto 0 0;
  position: absolute;
  scale: 1 0;
  transform-origin: bottom;
  transition: scale 360ms var(--m4-ease);
  width: 2px;
}

.sooye-m4-launch span,
.sooye-m4-launch strong {
  font: 700 9px/1 Arial, Helvetica, sans-serif;
  writing-mode: vertical-rl;
}

.sooye-m4-launch span { color: var(--m4-gold); }

.sooye-m4-launch:hover::before,
.sooye-m4-launch:focus-visible::before { scale: 1 1; }

.sooye-m4-launch:focus-visible {
  outline: 2px solid var(--m4-gold);
  outline-offset: -3px;
}

body.sooye-motion-v4.sooye-m4-motion-ready .sooye-m4-reveal {
  opacity: 0;
  translate: 0 28px;
  transition: opacity 680ms var(--m4-ease) var(--m4-reveal-delay, 0ms), translate 680ms var(--m4-ease) var(--m4-reveal-delay, 0ms), clip-path 760ms var(--m4-ease) var(--m4-reveal-delay, 0ms);
}

body.sooye-motion-v4.sooye-m4-motion-ready .sooye-m4-reveal.is-m4-visible {
  opacity: 1;
  translate: 0 0;
}

body.sooye-motion-v4 .sooye-m4-surface {
  --m4-tilt-x: 0deg;
  --m4-tilt-y: 0deg;
  isolation: isolate;
  transform: perspective(1000px) rotateX(var(--m4-tilt-x)) rotateY(var(--m4-tilt-y));
  transform-style: preserve-3d;
  transition: transform 180ms ease-out, opacity 240ms ease, filter 240ms ease;
  will-change: transform;
}

.sooye-m4-glow {
  background: radial-gradient(circle 220px at var(--m4-pointer-x, 50%) var(--m4-pointer-y, 50%), rgba(181, 139, 75, .19), rgba(181, 139, 75, 0) 72%);
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 240ms ease;
  z-index: 0;
}

body.sooye-motion-v4 .sooye-m4-surface > *:not(.sooye-m4-glow) { position: relative; z-index: 1; }
body.sooye-motion-v4 .sooye-m4-surface.is-m4-active .sooye-m4-glow { opacity: 1; }

body.sooye-motion-v4 .sooye-m4-focus-group.is-m4-engaged > .sooye-m4-surface:not(.is-m4-active) {
  filter: saturate(.72);
  opacity: .5;
}

body.sooye-motion-v4 .sooye-m4-magnetic {
  --m4-magnet-x: 0px;
  --m4-magnet-y: 0px;
  transform: translate3d(var(--m4-magnet-x), var(--m4-magnet-y), 0);
  transition: transform 170ms ease-out, background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

body.sooye-motion-v4 .sooye-m4-media {
  --m4-media-x: 0px;
  --m4-media-y: 0px;
  transform: scale(1.018) translate3d(var(--m4-media-x), var(--m4-media-y), 0);
  transition: transform 260ms ease-out;
  will-change: transform;
}

.sooye-motion-v4 .sooye-bj-quick {
  animation: none !important;
  background: transparent;
  border: 0;
  height: 100dvh;
  margin: 0 0 0 auto;
  max-height: none;
  max-width: 480px;
  opacity: 0;
  padding: 0;
  transform: translate3d(100%, 0, 0);
  transition: opacity 260ms ease, transform 480ms var(--m4-ease), display 480ms allow-discrete, overlay 480ms allow-discrete;
  width: min(480px, 100%);
}

.sooye-motion-v4 .sooye-bj-quick::backdrop {
  background: rgba(7, 8, 7, .74);
  backdrop-filter: blur(9px);
}

.sooye-motion-v4 .sooye-bj-quick[open].is-m4-open {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.sooye-motion-v4 .sooye-bj-quick.is-m4-closing {
  opacity: 0;
  transform: translate3d(100%, 0, 0);
}

.sooye-motion-v4 .sooye-bj-quick__shell {
  background: var(--m4-paper);
  min-height: 100%;
  padding: 34px 36px 28px;
}

.sooye-motion-v4 .sooye-bj-quick__head {
  position: relative;
}

.sooye-motion-v4 .sooye-bj-quick__head h2 {
  font-size: 31px;
}

.sooye-motion-v4 .sooye-bj-quick__submit {
  background: var(--m4-paper);
  border-top: 1px solid #d5d2c9;
  bottom: -28px;
  margin: 0 -36px;
  padding: 18px 36px calc(18px + env(safe-area-inset-bottom));
  position: sticky;
  z-index: 4;
}

.sooye-motion-v4 .sooye-bj-quick__submit button {
  overflow: hidden;
  position: relative;
}

.sooye-m4-success {
  align-content: center;
  flex: 1;
  min-height: 420px;
  padding: 42px 0;
}

.sooye-m4-success[hidden] { display: none; }

.sooye-m4-success h3 {
  color: var(--m4-ink);
  font: 700 38px/1.04 Arial, Helvetica, sans-serif;
  margin: 16px 0 20px;
}

.sooye-m4-success > p:not(.sooye-bj-kicker) {
  color: #5d625f;
  font: 400 15px/1.65 Arial, Helvetica, sans-serif;
  margin: 0;
}

.sooye-m4-success > button {
  background: var(--m4-ink);
  border: 1px solid var(--m4-ink);
  color: var(--m4-white);
  cursor: pointer;
  font: 700 12px/1 Arial, Helvetica, sans-serif;
  margin-top: 30px;
  min-height: 50px;
  padding: 14px 20px;
}

body.sooye-m4-quick-open { overflow: hidden; }

@media (max-width: 1100px) {
  .sooye-m4-launch { display: none; }
}

@media (max-width: 760px) {
  .sooye-m4-transition__panels { grid-template-columns: 1fr 1fr; }
  .sooye-m4-transition__panels i:nth-child(3),
  .sooye-m4-transition__panels i:nth-child(4) { display: none; }

  body.sooye-motion-v4 .sooye-m4-surface {
    transform: none;
    will-change: auto;
  }

  body.sooye-motion-v4 .sooye-m4-focus-group.is-m4-engaged > .sooye-m4-surface:not(.is-m4-active) {
    filter: none;
    opacity: 1;
  }

  .sooye-motion-v4 .sooye-bj-quick {
    border-radius: 8px 8px 0 0;
    height: min(88dvh, 860px);
    margin: auto 0 0;
    max-width: none;
    transform: translate3d(0, 100%, 0);
    width: 100%;
  }

  .sooye-motion-v4 .sooye-bj-quick[open].is-m4-open { transform: translate3d(0, 0, 0); }
  .sooye-motion-v4 .sooye-bj-quick.is-m4-closing { transform: translate3d(0, 100%, 0); }

  .sooye-motion-v4 .sooye-bj-quick__shell {
    border-radius: 8px 8px 0 0;
    padding: 34px 20px calc(20px + env(safe-area-inset-bottom));
    position: relative;
  }

  .sooye-motion-v4 .sooye-bj-quick__shell::before {
    background: #aaa79f;
    border-radius: 4px;
    content: '';
    height: 4px;
    left: 50%;
    position: absolute;
    top: 12px;
    translate: -50% 0;
    width: 42px;
  }

  .sooye-motion-v4 .sooye-bj-quick__submit {
    bottom: calc(-20px - env(safe-area-inset-bottom));
    grid-template-columns: 1fr;
    margin: 0 -20px;
    padding: 14px 20px calc(14px + env(safe-area-inset-bottom));
  }

  .sooye-motion-v4 .sooye-bj-quick__submit p { display: none; }
  .sooye-motion-v4 .sooye-bj-quick__submit button { min-height: 54px; width: 100%; }
  .sooye-motion-v4 .sooye-bj-quick__head h2 { font-size: 27px; }
  .sooye-m4-success { min-height: 330px; }
  .sooye-m4-success h3 { font-size: 32px; }
}

@media (hover: none), (pointer: coarse) {
  body.sooye-motion-v4 .sooye-m4-magnetic { transform: none; }
  body.sooye-motion-v4 .sooye-m4-media { transform: none; will-change: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html.sooye-m4-pending { overflow: auto; }

  .sooye-m4-transition { display: none !important; }

  .sooye-motion-v4 *,
  .sooye-motion-v4 *::before,
  .sooye-motion-v4 *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }

  body.sooye-motion-v4 .sooye-m4-reveal,
  body.sooye-motion-v4 .syv3-hero-inner > * {
    clip-path: none !important;
    opacity: 1 !important;
    transform: none !important;
    translate: none !important;
  }
}