/* Interactive fruit window. */
.hero-art{isolation:isolate;align-items:center}
.fruit-window{width:100%;height:650px;padding:14px;background:var(--ink);border-radius:50% 50% 32px 32px / 36% 36% 32px 32px;display:flex;flex-direction:column;isolation:isolate}
.fruit-portal{width:100%;flex:1;min-height:0;position:relative;overflow:hidden;background:#e3dcc8;border-radius:50% 50% 18px 18px / 40% 40% 18px 18px;isolation:isolate;touch-action:pan-y}
.fruit-layer{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.fruit-piece{position:absolute;left:0;top:0;will-change:transform;transform-origin:0 0;pointer-events:none;filter:drop-shadow(1px 2px 0 rgba(23,62,53,.10))}
.fruit-piece svg{width:100%;height:100%;overflow:visible}
.story-link{position:absolute;left:15%;right:15%;top:42%;transform:translateY(-20%);z-index:1;text-align:center;display:flex;align-items:center;flex-direction:column;color:var(--ink);line-height:1.02;transition:opacity .45s}
.story-link small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-family:var(--body);font-weight:600;margin-bottom:15px}
.story-link strong{font-family:var(--display);font-size:clamp(33px,3.6vw,53px);font-weight:700;letter-spacing:-.045em}
.story-link>span{display:grid;place-items:center;background:var(--ink);color:var(--yellow);border-radius:50%;width:49px;height:49px;margin-top:20px;font-size:26px}
.physics-ready:not(.is-revealed) .story-link{opacity:0;pointer-events:none;transition:none}
.story-link:focus-visible{opacity:1!important;pointer-events:auto!important;z-index:4;background:var(--cream);border-radius:15px;outline:3px solid var(--ink);outline-offset:12px}
.story-link:hover>span{background:var(--ink);color:var(--yellow)}
.fruit-cursor{position:absolute;z-index:5;width:4px;height:4px;border:1px solid rgba(23,62,53,.45);border-radius:50%;background:var(--ink);pointer-events:none;left:0;top:0;opacity:0;transition:opacity .2s}
.fruit-portal.has-pointer .fruit-cursor{opacity:1}







.hero-art .hero-sticker{pointer-events:none;z-index:7;right:-6px;top:35px}
.hero-art .hand-arrow,.hero-art .photo-note{display:none}
.fruit-portal.is-static .fruit-layer{opacity:.18}
.fruit-portal.is-static .story-link{opacity:1;pointer-events:auto;z-index:3}
.fruit-portal.is-static .fruit-cursor{display:none}














@media(min-width:1600px){.fruit-window{height:700px}}
@media(max-width:1100px){.fruit-window{height:610px}}
@media(max-width:820px){.fruit-window{height:510px}.story-link{left:12%;right:12%}.story-link strong{font-size:35px}.story-link small{font-size:8px}.story-link>span{width:40px;height:40px;font-size:24px}}
@media(max-width:600px){.fruit-window{height:405px}.hero-art{height:405px;margin-top:26px}.hero-art .hero-sticker{top:12px;right:-1px}.story-link{top:37%;left:17%;right:17%}.story-link strong{font-size:38px}.story-link small{margin-bottom:12px}.story-link>span{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.fruit-piece{will-change:auto}.fruit-cursor{display:none}}
/* Preserve the user-adjusted story position; fruit remains in front. */
.story-link{top:25%;transform:translateY(-20%)}
@media(max-width:600px){.story-link{top:53%;left:10%;right:10%}.story-link strong{font-size:32px}.story-link small,.story-link>span{display:none}.hero-art .hero-sticker{width:84px;height:84px;top:10px}.hero-art .hero-sticker strong{font-size:18px;white-space:nowrap;margin:3px 0}.hero-art .hero-sticker span{font-size:7px}.hero-art .hero-sticker .tiny{font-size:6px}}

@media(max-width:600px){.fruit-window{padding:10px;border-radius:50% 50% 26px 26px / 34% 34% 26px 26px}}

/* The supplied brand image stays intact behind the story and interactive fruit. */
.brand-background{position:absolute;inset:0;z-index:0;pointer-events:none;background:var(--cream)}
.brand-picture{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}
@media(max-width:600px){.fruit-portal .story-link{top:25%}}

@media(max-width:600px){.fruit-portal{border-bottom-left-radius:16px;border-bottom-right-radius:16px}}