/* Leaven Motion Edition: authored motion layer for the original homepage. */

body.lv-motion-edition {
  --experience-blue: #00509e;
  --experience-yellow: #ffde00;
  --experience-paper: #f8f5ed;
  --experience-ink: #1a1a1a;
  --experience-line: rgba(26, 26, 26, 0.32);
  --experience-ease: cubic-bezier(0.16, 1, 0.3, 1);
  overflow-x: clip;
}

body.lv-motion-edition .lvx-home {
  font-size: 16px;
}

body.lv-motion-edition .experience-progress {
  background: var(--experience-yellow);
  height: 3px;
  inset: 0 0 auto;
  pointer-events: none;
  position: fixed;
  transform: scaleX(var(--experience-page-progress, 0));
  transform-origin: left center;
  z-index: 90;
}

body.lv-motion-edition .experience-chapter {
  align-items: center;
  background: rgba(248, 245, 237, 0.9);
  border: 1px solid rgba(26, 26, 26, 0.24);
  bottom: 22px;
  color: var(--experience-ink);
  display: flex;
  font-family: "Courier Prime", monospace;
  font-size: 11px;
  gap: 9px;
  letter-spacing: 0.08em;
  padding: 8px 11px;
  pointer-events: none;
  position: fixed;
  right: 22px;
  z-index: 40;
  transition: opacity 240ms ease, transform 360ms var(--experience-ease), visibility 240ms;
}

body.lv-motion-edition .experience-chapter.is-hidden {
  opacity: 0;
  transform: translateY(10px);
  visibility: hidden;
}

body.lv-motion-edition .experience-chapter [data-chapter-number] {
  color: var(--experience-blue);
  font-weight: 700;
}

body.lv-motion-edition .experience-line {
  display: block;
}

/* The original film remains the scene. Motion adds depth without changing cast. */
body.lv-motion-edition .lvx-hero {
  isolation: isolate;
  perspective: 1000px;
}

body.lv-motion-edition .lvx-hero__film {
  overflow: hidden;
}

body.lv-motion-edition .lvx-hero__film video {
  object-position: 50% 44%;
  transform: translate3d(var(--experience-hero-x, 0), var(--experience-hero-y, 0), 0) scale(1.05);
  transition: transform 650ms var(--experience-ease);
  will-change: transform;
}

body.lv-motion-edition .lvx-hero__welcome {
  transform: translate3d(var(--experience-copy-x, 0), var(--experience-copy-y, 0), 0);
  transition: transform 700ms var(--experience-ease);
}

body.lv-motion-edition .lvx-hero__welcome strong {
  color: var(--experience-blue) !important;
  display: block;
  text-wrap: balance;
}

body.lv-motion-edition .lvx-hero__welcome .experience-word:first-child {
  display: block;
  font-family: "Courier Prime", monospace;
  font-size: clamp(11px, 1vw, 15px);
  font-weight: 700;
  letter-spacing: 0.25em;
  line-height: 1.2;
  margin: 0 0 8px 5px;
}

body.lv-motion-edition .lvx-hero__welcome .experience-word:last-child {
  display: block;
  font: 900 clamp(64px, 7vw, 108px) / 0.82 "Playfair Display", Georgia, serif;
  letter-spacing: -0.065em;
}

body.lv-motion-edition .experience-hero-kicker {
  color: var(--experience-yellow);
  font-family: "Courier Prime", monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  margin: 0 0 10px;
  position: absolute;
  left: clamp(20px, 4.5vw, 84px);
  top: clamp(20px, 3vw, 46px);
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.64);
  z-index: 4;
}

body.lv-motion-edition .experience-film-toggle {
  align-items: center;
  background: rgba(10, 15, 12, 0.58);
  border: 1px solid rgba(248, 245, 237, 0.72);
  border-radius: 0;
  color: var(--experience-paper);
  display: inline-flex;
  font-family: "Noto Sans TC", sans-serif;
  font-size: 12px;
  gap: 8px;
  justify-content: center;
  min-height: 44px;
  padding: 8px 12px;
  position: absolute;
  right: clamp(18px, 3.2vw, 52px);
  top: clamp(18px, 3.2vw, 48px);
  z-index: 5;
}

body.lv-motion-edition .experience-film-toggle:hover {
  background: var(--experience-paper);
  border-color: var(--experience-ink);
  color: var(--experience-ink);
}

body.lv-motion-edition .experience-film-toggle [data-film-icon] {
  color: var(--experience-yellow);
  font-size: 15px;
  line-height: 1;
}

body.lv-motion-edition .experience-film-toggle:hover [data-film-icon] {
  color: var(--experience-blue);
}

body.lv-motion-edition .experience-orbit {
  align-items: center;
  bottom: clamp(20px, 3vw, 48px);
  color: var(--experience-blue);
  display: flex;
  height: 92px;
  justify-content: center;
  position: absolute;
  right: clamp(24px, 5vw, 82px);
  width: 92px;
  z-index: 4;
}

body.lv-motion-edition .experience-orbit svg,
body.lv-motion-edition .experience-gift-orbit svg {
  display: block;
  height: 100%;
  overflow: visible;
  width: 100%;
}

body.lv-motion-edition .experience-orbit__ring {
  animation: experience-orbit 22s linear infinite;
  transform-box: fill-box;
  transform-origin: center;
}

body.lv-motion-edition .experience-orbit:hover .experience-orbit__ring {
  animation-duration: 9s;
}

body.lv-motion-edition .experience-orbit text {
  fill: currentColor;
  font: 700 9px "Courier Prime", monospace;
  letter-spacing: 0.13em;
}

@keyframes experience-orbit { to { transform: rotate(360deg); } }

/* Section openings use one print-rule wipe rather than extra containers. */
body.lv-motion-edition .lvx-home > section:not(.lvx-hero):not(.lvx-g2-sequence) {
  position: relative;
}

body.lv-motion-edition .lvx-home > section:not(.lvx-hero):not(.lvx-g2-sequence)::before {
  background: currentColor;
  content: "";
  height: 1px;
  left: max(20px, calc((100vw - 1320px) / 2));
  opacity: 0.28;
  position: absolute;
  right: max(20px, calc((100vw - 1320px) / 2));
  top: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 900ms var(--experience-ease);
}

body.lv-motion-edition .lvx-home > section.experience-entered::before {
  transform: scaleX(1);
}

body.lv-motion-edition .lvx-section-heading {
  letter-spacing: -0.055em !important;
  line-height: 1.02 !important;
  text-wrap: balance;
}

body.lv-motion-edition .lvx-kicker {
  letter-spacing: 0.15em !important;
}

/* Route board: warm paper response, exact icons, decisive labels. */
body.lv-motion-edition .lvx-route {
  overflow: hidden;
  position: relative;
  transition: background-color 320ms var(--experience-ease), color 320ms var(--experience-ease), transform 320ms var(--experience-ease) !important;
}

body.lv-motion-edition .lvx-route::after {
  background: linear-gradient(105deg, transparent 20%, rgba(255, 222, 0, 0.24), transparent 78%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  transform: translateX(-110%);
  transition: transform 720ms var(--experience-ease);
}

body.lv-motion-edition .lvx-route:hover,
body.lv-motion-edition .lvx-route:focus-visible {
  background: #fff4c4 !important;
  transform: translateY(-3px) !important;
}

body.lv-motion-edition .lvx-route:hover::after,
body.lv-motion-edition .lvx-route:focus-visible::after {
  transform: translateX(110%);
}

body.lv-motion-edition .lvx-route__stamp {
  transition: color 260ms ease, transform 420ms var(--experience-ease);
}

body.lv-motion-edition .lvx-route:hover .lvx-route__stamp,
body.lv-motion-edition .lvx-route:focus-visible .lvx-route__stamp {
  color: var(--experience-ink);
  transform: rotate(-5deg) scale(1.07);
}

body.lv-motion-edition .lvx-route__cta,
body.lv-motion-edition .lvx-text-link {
  display: inline-block;
  transition: color 220ms ease, transform 320ms var(--experience-ease);
}

body.lv-motion-edition .lvx-route:hover .lvx-route__cta,
body.lv-motion-edition a:hover > .lvx-text-link,
body.lv-motion-edition a:focus-visible > .lvx-text-link {
  transform: translateX(5px);
}

/* Product cards become physical print objects; the JS tilt never exceeds 3deg. */
body.lv-motion-edition .lvx-arrivals__grid {
  perspective: 1100px;
}

body.lv-motion-edition .lvx-arrival-card {
  isolation: isolate;
  position: relative;
  transform: perspective(900px) rotateX(var(--experience-card-rx, 0deg)) rotateY(var(--experience-card-ry, 0deg)) translateY(var(--experience-card-y, 0px)) !important;
  transform-style: preserve-3d;
  transition: box-shadow 360ms var(--experience-ease), transform 360ms var(--experience-ease) !important;
  will-change: transform;
}

body.lv-motion-edition .lvx-arrival-card::after {
  background: radial-gradient(circle at var(--experience-shine-x, 50%) var(--experience-shine-y, 50%), rgba(255,255,255,.34), transparent 34%);
  content: "";
  inset: 0;
  opacity: var(--experience-shine-opacity, 0);
  pointer-events: none;
  position: absolute;
  transition: opacity 240ms ease;
  z-index: 3;
}

body.lv-motion-edition .lvx-arrival-card:hover,
body.lv-motion-edition .lvx-arrival-card:focus-visible {
  box-shadow: 10px 12px 0 var(--experience-ink) !important;
}

body.lv-motion-edition .lvx-arrival-card__screen img {
  transform: translateZ(12px) scale(1.015);
  transition: transform 500ms var(--experience-ease);
}

body.lv-motion-edition .lvx-arrival-card:hover .lvx-arrival-card__screen img {
  transform: translateZ(20px) scale(1.045);
}

body.lv-motion-edition .lvx-arrival-card__body {
  position: relative;
  transform: translateZ(8px);
  z-index: 2;
}

body.lv-motion-edition .lvx-arrival-card__body h3 {
  color: var(--experience-ink) !important;
  font-weight: 750 !important;
}

body.lv-motion-edition .lvx-arrival-card__price {
  font-size: 14px !important;
}

/* G2 stays readable. The decorative aperture follows the existing controller. */
body.lv-motion-edition .lvx-g2-sequence__sticky {
  isolation: isolate;
}

body.lv-motion-edition .lvx-g2-sequence__canvas {
  clip-path: inset(calc(6% * (1 - var(--experience-g2-entry, 0))) round calc(48px * (1 - var(--experience-g2-entry, 0))));
  filter: saturate(1.03) contrast(1.02);
  position: relative;
  transform: scale(calc(0.96 + var(--experience-g2-entry, 0) * 0.04));
  transform-origin: center;
  z-index: 1;
}

body.lv-motion-edition .lvx-g2-sequence__sticky::after {
  display: none;
}

body.lv-motion-edition .lvx-g2-sequence__guide {
  z-index: 4;
}

body.lv-motion-edition .lvx-g2-sequence__guide > p:last-child {
  font-size: 14px !important;
  line-height: 1.65;
}

body.lv-motion-edition .experience-g2-orbit {
  color: rgba(248, 245, 237, 0.72);
  height: min(31vw, 420px);
  opacity: calc(0.08 + var(--experience-g2-entry, 0) * 0.24);
  pointer-events: none;
  position: absolute;
  right: 5vw;
  top: 11vh;
  transform: rotate(calc(var(--experience-g2-progress, 0) * 90deg));
  width: min(31vw, 420px);
  z-index: 3;
}

body.lv-motion-edition .experience-g2-orbit svg {
  height: 100%;
  overflow: visible;
  width: 100%;
}

body.lv-motion-edition .experience-g2-progress {
  bottom: clamp(22px, 3vw, 44px);
  height: 64px;
  position: absolute;
  right: clamp(22px, 3vw, 44px);
  transform: rotate(-90deg);
  width: 64px;
  z-index: 4;
}

body.lv-motion-edition .experience-g2-orbit circle,
body.lv-motion-edition .experience-g2-orbit path {
  fill: none;
  stroke: currentColor;
  stroke-width: 0.75;
}

body.lv-motion-edition .experience-g2-progress__track {
  fill: none;
  stroke: rgba(248, 245, 237, 0.35);
  stroke-width: 2;
}

body.lv-motion-edition .experience-g2-progress__value {
  fill: none;
  stroke: var(--experience-yellow);
  stroke-dasharray: 1;
  stroke-dashoffset: calc(1 - var(--experience-g2-progress, 0));
  stroke-linecap: round;
  stroke-width: 3;
}

/* Existing lower objects get slow depth and a stronger editorial baseline. */
body.lv-motion-edition [data-experience-parallax] {
  transform: translate3d(0, var(--experience-scroll-y, 0px), 0);
  transition: transform 180ms linear;
  will-change: transform;
}

body.lv-motion-edition .lvx-dripbox__inner,
body.lv-motion-edition .lvx-visit__photo,
body.lv-motion-edition .lvx-story-card,
body.lv-motion-edition .lvx-story-slip {
  border-width: 1px !important;
}

body.lv-motion-edition .lvx-dripbox__poster,
body.lv-motion-edition .lvx-visit__photo,
body.lv-motion-edition .lvx-story-card__image {
  overflow: hidden;
}

body.lv-motion-edition .lvx-dripbox__poster img,
body.lv-motion-edition .lvx-visit__photo img,
body.lv-motion-edition .lvx-story-card__image img {
  transition: transform 700ms var(--experience-ease), filter 500ms ease;
}

body.lv-motion-edition .lvx-dripbox__poster:hover img,
body.lv-motion-edition .lvx-visit__photo:hover img,
body.lv-motion-edition .lvx-story-card:hover .lvx-story-card__image img {
  filter: saturate(1.06);
  transform: scale(1.025);
}

body.lv-motion-edition .lvx-dripbox {
  isolation: isolate;
}

body.lv-motion-edition .experience-gift-orbit {
  color: rgba(255, 222, 0, 0.72);
  height: 150px;
  pointer-events: none;
  position: absolute;
  right: clamp(20px, 4vw, 60px);
  top: clamp(18px, 3vw, 42px);
  transform: rotate(-10deg);
  width: 150px;
  z-index: 1;
}

body.lv-motion-edition .experience-gift-orbit circle,
body.lv-motion-edition .experience-gift-orbit ellipse,
body.lv-motion-edition .experience-gift-orbit path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1;
}

body.lv-motion-edition .experience-gift-orbit text {
  fill: currentColor;
  font: 700 8px "Courier Prime", monospace;
  letter-spacing: 0.12em;
}

body.lv-motion-edition .lvx-custom__steps li {
  transition: background-color 240ms ease, padding-inline 320ms var(--experience-ease);
}

body.lv-motion-edition .lvx-custom__steps li:hover {
  background: rgba(255,255,255,.06);
  padding-inline: 8px;
}

@media (max-width: 820px) {
  body.lv-motion-edition .experience-chapter { display: none; }
  body.lv-motion-edition .lvx-hero__film video {
    object-position: 50% 50%;
    transform: scale(1.005);
    will-change: auto;
  }
  body.lv-motion-edition .lvx-hero__welcome { transform: none; }
  body.lv-motion-edition .lvx-hero__welcome {
    bottom: 9px !important;
  }
  body.lv-motion-edition .lvx-hero__welcome .experience-word:first-child {
    font-size: 11px;
    letter-spacing: 0.16em;
    margin: 0 0 5px 2px;
  }
  body.lv-motion-edition .lvx-hero__welcome .experience-word:last-child {
    font-size: clamp(38px, 12vw, 48px);
  }
  body.lv-motion-edition .experience-hero-kicker {
    font-size: 11px;
    left: 16px;
    top: 14px;
  }
  body.lv-motion-edition .experience-film-toggle {
    right: 10px;
    top: 10px;
    width: 44px;
  }
  body.lv-motion-edition .experience-film-toggle [data-film-label] {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }
  body.lv-motion-edition .experience-orbit { display: none; }
  body.lv-motion-edition .lvx-home > section:not(.lvx-hero):not(.lvx-g2-sequence)::before {
    left: 16px;
    right: 16px;
  }
  body.lv-motion-edition .lvx-route:hover,
  body.lv-motion-edition .lvx-route:focus-visible { transform: none !important; }
  body.lv-motion-edition .lvx-arrival-card {
    transform: none !important;
    transform-style: flat;
    will-change: auto;
  }
  body.lv-motion-edition .lvx-arrival-card__screen img,
  body.lv-motion-edition .lvx-arrival-card:hover .lvx-arrival-card__screen img {
    transform: none;
  }
  body.lv-motion-edition .experience-g2-orbit {
    height: 190px;
    opacity: 0.14;
    right: -70px;
    top: 12vh;
    width: 190px;
  }
  body.lv-motion-edition .lvx-g2-sequence__canvas {
    clip-path: inset(calc(2% * (1 - var(--experience-g2-entry, 0))) round calc(18px * (1 - var(--experience-g2-entry, 0))));
    transform: scale(calc(0.99 + var(--experience-g2-entry, 0) * 0.01));
  }
  body.lv-motion-edition .lvx-g2-sequence__guide > p:last-child {
    font-size: 13px !important;
  }
  body.lv-motion-edition .experience-g2-progress {
    bottom: auto;
    top: 18px;
    height: 48px;
    right: 18px;
    width: 48px;
  }
  body.lv-motion-edition .lvx-g2-sequence__sticky::after {
    background: radial-gradient(circle at 50% 48%, transparent 62%, rgba(4, 24, 41, 0.24) 100%);
  }
  body.lv-motion-edition [data-experience-parallax] {
    transform: none;
    transition: none;
    will-change: auto;
  }
  body.lv-motion-edition .experience-gift-orbit {
    height: 92px;
    opacity: 0.55;
    right: 10px;
    top: 10px;
    width: 92px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.lv-motion-edition *,
  body.lv-motion-edition *::before,
  body.lv-motion-edition *::after {
    animation: none !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
  body.lv-motion-edition .lvx-hero__film video,
  body.lv-motion-edition .lvx-hero__welcome,
  body.lv-motion-edition .lvx-arrival-card,
  body.lv-motion-edition .lvx-g2-sequence__canvas,
  body.lv-motion-edition [data-experience-parallax] {
    clip-path: none !important;
    transform: none !important;
    will-change: auto !important;
  }
  body.lv-motion-edition .lvx-home > section:not(.lvx-hero):not(.lvx-g2-sequence)::before {
    transform: scaleX(1);
  }
  body.lv-motion-edition .experience-g2-orbit,
  body.lv-motion-edition .experience-gift-orbit { opacity: 0.14; }
  body.lv-motion-edition .lvx-route:hover,
  body.lv-motion-edition .lvx-route:focus-visible,
  body.lv-motion-edition .lvx-route:hover .lvx-route__stamp,
  body.lv-motion-edition .lvx-route:focus-visible .lvx-route__stamp,
  body.lv-motion-edition .lvx-route:hover .lvx-route__cta,
  body.lv-motion-edition a:hover > .lvx-text-link,
  body.lv-motion-edition a:focus-visible > .lvx-text-link,
  body.lv-motion-edition .lvx-arrival-card__screen img,
  body.lv-motion-edition .lvx-arrival-card:hover .lvx-arrival-card__screen img,
  body.lv-motion-edition .lvx-dripbox__poster:hover img,
  body.lv-motion-edition .lvx-visit__photo:hover img,
  body.lv-motion-edition .lvx-story-card:hover .lvx-story-card__image img {
    transform: none !important;
  }
}