/* Hero is the first use of Newton's scroll-responsive mesh motion. */
.hero .hero-mesh { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; visibility:hidden; }
.hero-physics-ready .hero-bough-art { animation:none; transform:none; }
.hero-physics-ready .hero-bough-art > img { visibility:hidden; }
.hero-physics-ready .hero-bough-art > canvas { visibility:visible; }
.hero-physics-ready .hero-apple { animation:none !important; transform-origin:50% 15%; }
.hero-physics-ready .hero-fruit-one, .hero-physics-ready .hero-fruit-two { transform-origin:50% 0; }
.hero .hero-apple > svg { display:block; width:100%; height:auto; }
.hero .hero-apple .avatar-emotion-body { animation:none !important; transform:none !important; }
.hero .hero-motion-toggle { display:inline-flex; background:none; border:0; padding:10px 0; color:#a7aaa7; font:inherit; font-size:.8125rem; cursor:pointer; text-underline-offset:5px; }
.hero .hero-motion-toggle:hover { text-decoration:underline; }
@media (min-width:1600px) { .hero .hero-mesh { mask-image:linear-gradient(to right,transparent,#000 4%); } }
@media (prefers-reduced-motion:reduce) { .hero .hero-mesh { display:none; } .hero .hero-motion-toggle { display:none; } }

.hero[data-branch-visible="false"] .avatar * { animation-play-state:paused !important; }

/* The supplied hero artwork includes Newton and the complete attached stem. */
.hero[data-composite-apple] .hero-art { display:none; }
.hero[data-composite-apple] .hero-bough-art { animation:none; }
.hero[data-composite-apple] .hero-bough-art::before { display:none; }
.hero[data-composite-apple] .hero-bough img, .hero[data-composite-apple] .hero-mesh { mask-image:none; }
@media (max-width:720px) { .tree-site .hero[data-composite-apple] { padding-top:265px; } }
/* Fruit stems share the mesh anchors in source-image coordinates. */
.hero[data-composite-apple] .hero-fruit-one { top:calc(var(--hero-scene-width) * .121 + var(--bough-top)); }
.hero[data-composite-apple] .hero-fruit-two { top:calc(var(--hero-scene-width) * .1165 + var(--bough-top)); }
/* Keep the hanging leaf clear of the opening headline. */
@media (min-width:721px) {
  .hero[data-composite-apple] .hero-bough { top:var(--bough-top); }
}

.hero .hero-apple-drag{position:absolute;z-index:4;transform:translate(-50%,-50%);border:0;border-radius:50%;padding:0;background:transparent;cursor:grab;touch-action:none;user-select:none;pointer-events:auto}
.hero .hero-apple-drag.is-dragging{cursor:grabbing}
.hero .hero-apple-drag:focus-visible{outline:2px solid #f4e7ca;outline-offset:6px}
.hero .hero-apple-drag[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.hero .hero-apple-drag{display:none}}