/* Original For Business composition. Artwork, scroll depth and idle motion have separate layers. */
.business-showcase{background:var(--cream2);padding-block:132px 74px;overflow:clip}
.business-composition{display:grid;grid-template-columns:1.1fr 1fr;grid-template-areas:"heading artwork" "perks artwork" "action artwork";column-gap:60px;align-items:start}
.business-composition>*{min-width:0}
.business-heading{grid-area:heading}
.business-heading .display{font-size:clamp(68px,7vw,100px);margin-top:22px;max-width:none}
.business-heading .display em{color:var(--pink)}
.business-heading .intro-copy{font-size:clamp(16px,1.35vw,20px);line-height:1.65;margin-top:24px;max-width:52ch}
.business-perks{grid-area:perks;list-style:none;padding:0;margin:26px 0;display:grid;gap:12px;max-width:560px}
.business-perks li{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid transparent;border-radius:22px;padding:14px 20px;transition:transform .3s,box-shadow .3s,border-color .3s}
.business-icon{flex:none;width:62px;height:62px;display:grid;place-items:center;border-radius:18px;background:var(--blush);color:var(--pink);font:400 25px/1 var(--display);white-space:nowrap;transition:transform .3s,background .3s}
.business-icon .flag{width:30px;height:30px}
.business-perks h2{font:700 17px/1.45 var(--body);margin:0 0 5px}
.business-perks p{font-size:15px;line-height:1.65;color:var(--muted)}
.business-action{grid-area:action}
.business-action .btn{padding:17px 26px;box-shadow:0 8px 18px -12px #a01e3c80}
.business-artwork{grid-area:artwork;align-self:center;justify-self:center;position:relative;aspect-ratio:1;width:100%;max-width:520px;outline-offset:8px}
.business-art-reveal,.business-art-scroll,.business-art-depth{position:absolute;inset:0}
.business-four{position:absolute;inset:10%;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.business-disc{height:100%;border-radius:50%;background:#f36a86;color:#fff6e8;display:grid;place-content:center;text-align:center;box-shadow:0 40px 60px -30px #a01e3c8c;animation:business-disc-float 7s ease-in-out infinite paused}
.business-volume{font:400 clamp(120px,15vw,210px)/.88 var(--display)}
.business-disc-caption{font:700 12px/1.3 var(--body);letter-spacing:.2em;text-transform:uppercase;margin-top:14px}
.business-ingredient{position:absolute;z-index:2;width:23%;transition:translate .55s cubic-bezier(.2,.7,.2,1)}
.business-ingredient img{width:100%;height:auto;filter:drop-shadow(0 16px 18px #0003);animation:business-ingredient-float 6s ease-in-out infinite paused}
.business-strawberry{left:2%;top:7%}.business-chocolate{right:0;top:14%}.business-banana{left:6%;bottom:6%}.business-vanilla{right:6%;bottom:2%}
.business-chocolate img{animation-duration:7s;animation-delay:-2s}.business-banana img{animation-duration:5.5s;animation-delay:-1s}.business-vanilla img{animation-duration:8s;animation-delay:-3s}
[data-business-motion=running] .business-disc,[data-business-motion=running] .business-ingredient img{animation-play-state:running}
@keyframes business-disc-float{50%{transform:translateY(-4px)}}
@keyframes business-ingredient-float{50%{transform:translateY(-12px) rotate(4deg)}}
@media(hover:hover) and (pointer:fine){.business-perks li:hover{transform:translate(6px,-2px);border-color:#e8456830;box-shadow:0 14px 25px -18px #a01e3c66}.business-perks li:hover .business-icon{transform:rotate(-4deg);background:#ffd3df}.business-artwork:hover .business-four{transform:scale(1.025)}.business-artwork:hover .business-strawberry{translate:-6px -5px}.business-artwork:hover .business-chocolate{translate:6px -5px}.business-artwork:hover .business-banana{translate:-5px 5px}.business-artwork:hover .business-vanilla{translate:5px 5px}}
.business-perks li:focus-visible{transform:translate(6px,-2px);border-color:#e8456830;box-shadow:0 14px 25px -18px #a01e3c66}.business-perks li:focus-visible .business-icon{transform:rotate(-4deg);background:#ffd3df}.business-artwork:focus-visible .business-four{transform:scale(1.025)}
@media(max-width:1100px){.business-composition{column-gap:36px}.business-showcase{padding-top:132px}.business-perks li{gap:15px;padding:16px}.business-icon{width:54px;height:54px}.business-perks h2{font-size:16px}.business-perks p{font-size:14px}.business-volume{font-size:clamp(120px,15vw,180px)}.business-disc-caption{font-size:10px}}
@media(max-width:760px){.business-showcase{padding-block:112px 56px}.business-composition{grid-template-columns:1fr;grid-template-areas:"heading" "artwork" "perks" "action";gap:0}.business-heading .display{font-size:clamp(56px,12.5vw,86px);margin-top:20px}.business-heading .intro-copy{font-size:16px;margin-top:24px}.business-artwork{width:min(100%,360px);margin-block:24px 8px}.business-volume{font-size:clamp(120px,38vw,150px)}.business-disc-caption{font-size:10px}.business-perks{max-width:none;margin:22px 0 28px}.business-perks li{padding:18px;gap:16px}.business-icon{width:52px;height:52px;border-radius:15px}.business-perks h2{font-size:16px}.business-perks p{font-size:14px}.business-action .btn{font-size:13px}}
@media(max-width:360px){.business-heading .display{font-size:48px}.business-perks li{gap:12px;padding:16px}.business-icon{width:44px;height:48px;font-size:22px}.business-icon .flag{width:26px;height:26px}.business-perks h2{font-size:15px}.business-perks p{font-size:13px}.business-disc-caption{font-size:9px;letter-spacing:.16em}.business-ingredient img{filter:drop-shadow(0 10px 10px #0002)}}
@media(max-height:560px) and (min-width:761px){.business-showcase{padding-top:108px}.business-heading .display{font-size:68px}.business-composition{column-gap:30px}.business-artwork{align-self:start;margin-top:66px}.business-heading .intro-copy{font-size:16px}.business-perks{margin-block:24px}.business-perks li{padding:14px}.business-disc-caption{font-size:10px}}
@media(prefers-reduced-motion:reduce){.business-art-reveal,.business-art-scroll,.business-art-depth,.business-four,.business-perks li,.business-icon{transform:none!important;translate:none!important}.business-ingredient{translate:none!important}.business-disc,.business-ingredient img{animation:none!important}}