/* The animated clip-path masks the frame and its contents together.
   It does not change the image proportions or GSAP scroll transforms. */
@keyframes amoeba-shape{
  0%,100%{border-radius:42% 58% 63% 37% / 44% 39% 61% 56%;clip-path:inset(0 round 42% 58% 63% 37% / 44% 39% 61% 56%)}
  25%{border-radius:61% 39% 43% 57% / 55% 63% 37% 45%;clip-path:inset(0 round 61% 39% 43% 57% / 55% 63% 37% 45%)}
  50%{border-radius:38% 62% 57% 43% / 64% 43% 57% 36%;clip-path:inset(0 round 38% 62% 57% 43% / 64% 43% 57% 36%)}
  75%{border-radius:55% 45% 36% 64% / 38% 56% 44% 62%;clip-path:inset(0 round 55% 45% 36% 64% / 38% 56% 44% 62%)}
}
.experience-world .menu-preview,
.experience-world .craft-hero-art,
.experience-world #smart .story-hero-art,
.experience-world #moves .story-hero-art,
.experience-world #failed .story-hero-art{
  border-radius:42% 58% 63% 37% / 44% 39% 61% 56%;
  animation:amoeba-shape 16s ease-in-out infinite;
}
.experience-world #moves .story-hero-art{animation-delay:-6s}
.experience-world #failed .story-hero-art{animation-delay:-11s}
/* The artwork is clipped to the moving silhouette, without being stretched. */
 .experience-world #beautiful .craft-row:not(.batman-row) .craft-visual,
.experience-world #smart .craft-row .craft-visual,
.experience-world #moves .craft-row .craft-visual,
.experience-world #failed .craft-row .craft-visual{
  isolation:isolate;background:var(--organic-color,#f2f0e7);
  border-radius:0!important;
  overflow:hidden;clip-path:inset(0 round 42% 58% 63% 37% / 44% 39% 61% 56%);
  animation:amoeba-shape 18s ease-in-out infinite;box-shadow:none;
}
.experience-world #beautiful .craft-visual::after,
.experience-world #smart .craft-visual::after,
.experience-world #moves .craft-visual::after,
.experience-world #failed .craft-visual::after{content:none}
.experience-world #beautiful .craft-row:nth-of-type(even) .craft-visual,
.experience-world #smart .craft-row:nth-of-type(even) .craft-visual,
.experience-world #moves .craft-row:nth-of-type(even) .craft-visual,
.experience-world #failed .craft-row:nth-of-type(even) .craft-visual{animation-delay:-7s;animation-duration:21s}
.experience-world #beautiful .craft-visual{--organic-color:#ffff00}
.experience-world #beautiful .craft-details,
.experience-world #beautiful .craft-studies{--organic-color:#f2f0e7}
.experience-world #smart .craft-visual{--organic-color:#273a4c}
.experience-world #smart .craft-row:first-of-type .story-art{--organic-color:#065bb7;background:var(--organic-color)}
.experience-world #smart .story-phone{--organic-color:#273a4c}
.experience-world #moves .craft-visual{--organic-color:#23322a}
.experience-world #moves .sequence-art{--organic-color:#141b27}
.experience-world #moves .b3-art{--organic-color:#071351}
.experience-world #failed .craft-visual{--organic-color:#5eaab0}
.experience-world #failed .reflection-note{--organic-color:#70c5c8}
.experience-world #smart .craft-visual,
.experience-world #moves .craft-visual,
.experience-world #failed .craft-visual{padding:clamp(25px,4vw,65px)}
.experience-world #failed .reflection-note{padding:70px 55px 85px}
.experience-world #failed .tomigo-art video{border-radius:0}
.experience-world #smart .video-finale video{border-radius:0}
.experience-world #beautiful .craft-visual img,
.experience-world #smart .craft-visual img,
.experience-world #moves .craft-visual img{object-fit:contain}
@media(max-width:750px){
  .experience-world #failed .reflection-note{padding:55px 35px 70px}
  .experience-world #smart .craft-visual,
  .experience-world #moves .craft-visual,
  .experience-world #failed .craft-visual{padding:28px}
}
@media(prefers-reduced-motion:reduce){
  .experience-world .menu-preview,.experience-world .craft-hero-art,
  .experience-world .story-hero-art,
  .experience-world .craft-visual,
  .experience-world .reflection-note::after{animation:none!important}
}