#sama-two-color-intro{font-family:Cairo,sans-serif;background:white;color:#101342;overflow:hidden;isolation:isolate}
#sama-two-color-intro .stage{height:420px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at center,#fff 45%,#f2fbfc 100%);overflow:hidden}
#sama-two-color-intro .logo-assembly{position:relative;width:360px;max-width:85%;aspect-ratio:431/173;transform:translateX(-25%)}
#sama-two-color-intro .part{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform-origin:85% 50%;clip-path:inset(0 0 0 72%);opacity:0}
#sama-two-color-intro .cyan{filter:url(#sama-cyan-isolate)}
#sama-two-color-intro .pink{filter:url(#sama-pink-isolate)}
#sama-two-color-intro .name{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;clip-path:inset(0 28% 0 0);opacity:0}
#sama-two-color-intro.play .cyan{animation:sama-cyan-orbit 1.65s cubic-bezier(.25,.65,.2,1) forwards}
#sama-two-color-intro.play .pink{animation:sama-pink-orbit 1.65s .18s cubic-bezier(.25,.65,.2,1) forwards}
#sama-two-color-intro.play .logo-assembly{animation:sama-center-logo .55s 1.85s ease forwards,sama-logo-bounce .85s 2.45s ease-in-out forwards}
#sama-two-color-intro.play .name{animation:sama-name-in .65s 2s ease forwards}
#sama-two-color-intro .controls{padding:16px;display:flex;justify-content:center}
#sama-two-color-intro button{font:inherit;font-size:13px;background:#101342;color:#fff;border:0;border-radius:25px;padding:10px 24px;cursor:pointer}
@keyframes sama-cyan-orbit{0%{opacity:0;transform:translate(-130px,-180px) rotate(-160deg) scale(.6)}20%{opacity:1}58%{transform:translate(30px,-30px) rotate(35deg) scale(1.05)}82%{transform:translate(-6px,6px) rotate(-8deg) scale(1)}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes sama-pink-orbit{0%{opacity:0;transform:translate(150px,-180px) rotate(160deg) scale(.6)}20%{opacity:1}58%{transform:translate(-25px,28px) rotate(-35deg) scale(1.05)}82%{transform:translate(5px,-5px) rotate(8deg) scale(1)}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes sama-logo-bounce{0%,100%{transform:translate(0,0) scale(1)}18%{transform:translate(0,-22px) scale(1.015,.985)}36%{transform:translate(0,0) scale(1.04,.96)}55%{transform:translate(0,-10px) scale(1)}72%{transform:translate(0,0) scale(1.02,.98)}87%{transform:translate(0,-3px) scale(1)}}
@keyframes sama-center-logo{to{transform:translateX(0)}}
@keyframes sama-name-in{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:430px){#sama-two-color-intro .stage{height:330px}.logo-assembly{width:280px}}
@media(prefers-reduced-motion:reduce){#sama-two-color-intro.play .part,#sama-two-color-intro.play .name,#sama-two-color-intro.play .logo-assembly{animation-duration:.01s;animation-delay:.1s}}


#sama-two-color-intro .logo-shadow{position:absolute;left:50%;top:calc(50% + 85px);width:175px;height:15px;border-radius:50%;background:radial-gradient(ellipse,rgba(16,19,66,.22),rgba(16,19,66,.08) 45%,transparent 72%);filter:blur(3px);opacity:0;transform:translateX(-50%) scale(.75)}
#sama-two-color-intro.play .logo-shadow{animation:sama-shadow-appear .55s 1.85s forwards,sama-shadow-bounce .85s 2.45s ease-in-out forwards}
@keyframes sama-shadow-appear{to{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes sama-shadow-bounce{0%,100%{opacity:1;transform:translateX(-50%) scale(1)}18%{opacity:.45;transform:translateX(-50%) scale(.7)}36%{opacity:1;transform:translateX(-50%) scale(1.05)}55%{opacity:.65;transform:translateX(-50%) scale(.85)}72%{opacity:1;transform:translateX(-50%) scale(1.02)}87%{opacity:.85;transform:translateX(-50%) scale(.95)}}
@media(prefers-reduced-motion:reduce){#sama-two-color-intro.play .logo-shadow{animation:sama-shadow-appear .01s .1s forwards}}