.hero-slideshow{position:relative;overflow:hidden;touch-action:pan-y}.hero-slides{display:flex;width:100%;transition:transform .65s cubic-bezier(.22,.7,.25,1);will-change:transform;align-items:stretch}.hero-panel{flex:0 0 100%;min-width:0;background:var(--slide-blue);overflow:hidden}.hero-slideshow .hero-inner{min-height:745px;padding-bottom:100px;padding-top:55px;box-sizing:border-box}.hero-slideshow .slide-heading{font-size:clamp(60px,6.9vw,98px);letter-spacing:-3.5px;line-height:1.04;margin-bottom:28px}.hero-slideshow .hero-inner>div:first-child>p{max-width:430px;font-size:18px;line-height:1.65}.hero-controls{position:absolute;bottom:27px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:17px;padding:10px 16px;background:#fffdf5e8;border:1px solid #061d5030;border-radius:40px;z-index:8}.hero-arrow{display:grid;place-items:center;border:0;border-radius:50%;width:33px;height:33px;background:#061d50;color:white;font-size:20px}.hero-dots{display:flex;align-items:center;gap:9px}.hero-dot{border:1px solid #061d50;width:9px;height:9px;border-radius:50%;padding:0;background:transparent}.hero-dot[aria-current=true]{background:#061d50}.hero-pause{font-size:11px;background:transparent;border:0;border-left:1px solid #061d5030;padding-left:15px;color:#061d50;font-weight:700;min-width:49px}.slide-art{height:510px;position:relative;display:flex;align-items:center;justify-content:center;max-width:100%;min-width:0}.slide-art>img{max-width:90%;max-height:410px;width:auto;height:auto;object-fit:contain}.slide-starter>img{border-radius:22px;transform:rotate(5deg);box-shadow:10px 12px 0 #061d5025;border:1px solid #061d5040}.slide-art-tag{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:11px;font-weight:700;letter-spacing:1px;background:#fffdf5;border:1px solid #061d5030;border-radius:30px;padding:11px 18px}.slide-disc{position:absolute;inset:35px 0 45px;border-radius:50%;background:#fffdf5a0}.slide-breath>img{height:350px;border-radius:35px;transform:rotate(10deg);filter:drop-shadow(12px 15px 0 #061d5020);position:relative}.slide-strawberry .strawberry-pouch{height:370px;position:relative;transform:rotate(-7deg);filter:drop-shadow(10px 12px 0 #061d5020)}.slide-strawberry .strawberry-pal{position:absolute;right:0;bottom:55px;width:150px;height:210px;transform:rotate(10deg)}.slide-friends>img{width:100%;max-width:100%;max-height:none}.phone-scene{display:flex;gap:16px;align-items:center;justify-content:center;padding-bottom:25px}.phone-frame{flex:0 1 150px;width:150px;height:315px;border:6px solid #061d50;border-radius:28px;position:relative;overflow:hidden;box-shadow:6px 12px 0 #061d5020;background:#fffdf5}.phone-left{transform:rotate(-8deg)}.phone-center{transform:translateY(-26px);z-index:2}.phone-right{transform:rotate(8deg)}.phone-notch{position:absolute;top:0;left:50%;transform:translateX(-50%);width:55px;height:12px;background:#061d50;border-radius:0 0 10px 10px;z-index:2}.phone-placeholder{height:100%;background:var(--phone-color);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:32px 8px 15px;gap:12px}.phone-placeholder img{width:100%;height:140px;object-fit:contain}.phone-type{font-size:8px;letter-spacing:1px;text-align:center;font-weight:700;line-height:1.5}.phone-play{display:grid;place-items:center;border:1px solid #061d50;border-radius:50%;width:35px;height:35px;background:#fffdf5;font-size:13px;padding-left:2px}.phone-coming{font-size:9px;font-weight:700;text-align:center}.phones-caption{position:absolute;bottom:30px;width:100%;text-align:center;left:0;font-size:12px;font-weight:700}@media(max-width:1000px){.hero-slideshow .hero-inner{gap:30px;min-height:675px}.slide-art{height:430px}.slide-art>img{max-height:350px}.phone-frame{width:110px;height:260px;border-width:5px;border-radius:24px}.phone-scene{gap:10px}.phone-placeholder img{height:115px}.phone-type{font-size:7px}.hero-slideshow .slide-heading{font-size:clamp(52px,7vw,80px)}}@media(max-width:620px){.hero-slideshow .hero-inner{grid-template-columns:1fr;padding:45px 6% 110px;gap:15px;min-height:0;align-content:start}.hero-slideshow .slide-heading{font-size:58px;line-height:1.04;letter-spacing:-2.5px;margin-bottom:22px}.hero-slideshow .hero-inner>div:first-child>p{font-size:16px;max-width:100%}.hero-slideshow .hero .hero-kicker{font-size:10px}.slide-art{height:360px;margin-top:10px}.slide-art>img{max-height:290px;max-width:85%}.slide-breath>img{height:280px}.slide-strawberry .strawberry-pouch{height:285px}.slide-strawberry .strawberry-pal{width:115px;height:150px;bottom:40px}.slide-disc{inset:25px 0 30px}.slide-friends>img{max-width:100%;max-height:none}.slide-art-tag{font-size:9px;padding:9px 13px;bottom:0}.phone-frame{width:105px;height:240px;border-width:5px;border-radius:22px;flex-basis:105px}.phone-scene{gap:10px;max-width:100%}.phone-placeholder img{height:104px}.phone-coming{font-size:8px}.phones-caption{bottom:5px}.hero-controls{gap:12px;padding:8px 12px;bottom:24px}.hero-dots{gap:7px}.hero-pause{padding-left:10px}.hero-arrow{width:30px;height:30px}.hero-slideshow .hero-scene{height:360px;margin-top:10px}.hero-slideshow .scene-caption{bottom:0}.hero-slideshow .scene-crew{bottom:35px}.hero-slideshow .scene-mint{top:75px}.hero-slideshow .scene-strawberry{top:60px}.hero-slideshow .scene-strips{top:155px}}@media(prefers-reduced-motion:reduce){.hero-slides{transition:none}}

.hero h1 .hero-fresher{color:#061d50}

/* A shared presentation frame gives every homepage slide the same visual rhythm. */
.hero-slideshow .hero-panel{background:#8ddafa}
.hero-slideshow .hero-panel .hero-inner{grid-template-columns:.95fr 1.15fr;gap:40px}
.hero-slideshow .hero-intro-heading,.hero-slideshow .slide-heading{font-size:clamp(52px,5.6vw,80px);line-height:1.06;letter-spacing:-3px;margin:24px 0}
.hero-intro-heading>span{display:block;white-space:nowrap}
.hero-slideshow .hero-panel .hero-scene,.hero-slideshow .slide-art{position:relative;box-sizing:border-box;width:100%;max-width:none;height:490px;margin:0;padding:55px 26px 65px;background:#fffdf5;border:1px solid #061d5018;border-radius:28px;transform:none;box-shadow:none;display:flex;align-items:center;justify-content:center}
.hero-slideshow .scene-label,.hero-slideshow .slide-art-tag,.hero-slideshow .scene-caption,.hero-slideshow .phones-caption{position:absolute;left:24px;right:24px;width:auto;transform:none;background:none;border:0;border-radius:0;padding:0;text-align:center;color:#061d50;white-space:normal;letter-spacing:1.1px;font-size:10px;line-height:1.5;font-weight:800}
.hero-slideshow .scene-label{top:27px}
.hero-slideshow .scene-caption,.hero-slideshow .slide-art-tag,.hero-slideshow .phones-caption{top:auto;bottom:25px;letter-spacing:.7px}
.hero-product-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:14px;width:100%}
.hero-slideshow .hero-scene .scene-pack{display:block;position:static;width:100%;height:285px;max-width:100%;border-radius:8px;border:0;overflow:hidden;transform:none;filter:none;box-shadow:none}
.hero-slideshow .slide-art>.feature-product{display:block;max-width:90%;width:auto;height:345px;overflow:hidden;border-radius:8px;transform:none;filter:none;box-shadow:none}
.hero-slideshow .slide-starter>img{display:block;max-width:100%;max-height:350px;width:auto;height:auto;object-fit:contain;border:0;border-radius:12px;transform:none;filter:none;box-shadow:none}
.hero-slideshow .slide-friends>img{width:100%;height:auto;max-width:100%;max-height:none;border:0;border-radius:0;box-shadow:none;transform:none}
.hero-slideshow .phone-scene{gap:14px}
.hero-slideshow .phone-frame{transform:none;width:135px;flex:0 1 135px;height:290px;box-shadow:none;border-width:4px;border-radius:24px}
.hero-slideshow .phone-placeholder{padding-top:28px}
@media(min-width:621px) and (max-width:1000px){
 .hero-slideshow .hero-panel .hero-inner{grid-template-columns:.95fr 1.05fr;gap:25px}
 .hero-slideshow .hero-intro-heading,.hero-slideshow .slide-heading{font-size:clamp(40px,5.4vw,54px);letter-spacing:-2px}
 .hero-slideshow .hero-panel .hero-scene,.hero-slideshow .slide-art{height:420px;padding:50px 20px 60px}
 .hero-product-row{gap:8px}
 .hero-slideshow .hero-scene .scene-pack{height:240px}
 .hero-slideshow .slide-art>.feature-product{height:290px}
 .hero-slideshow .slide-starter>img{max-height:290px}
 .hero-slideshow .phone-scene{gap:8px}
 .hero-slideshow .phone-frame{height:230px;border-radius:18px}
 .hero-slideshow .phone-placeholder img{height:100px}
}
@media(max-width:620px){
 .hero-slideshow .hero-panel .hero-inner{grid-template-columns:1fr;gap:25px;padding-top:35px}
 .hero-slideshow .hero-intro-heading,.hero-slideshow .slide-heading{font-size:clamp(40px,10.8vw,64px);letter-spacing:-2px;margin:20px 0}
 .hero-slideshow .hero-panel .hero-scene,.hero-slideshow .slide-art{height:350px;max-width:440px;margin:0 auto;padding:48px 18px 53px;border-radius:22px}
 .hero-product-row{gap:9px}
 .hero-slideshow .hero-scene .scene-pack{height:220px}
 .hero-slideshow .scene-label{top:22px;font-size:9px}
 .hero-slideshow .scene-caption,.hero-slideshow .slide-art-tag,.hero-slideshow .phones-caption{bottom:20px;font-size:9px}
 .hero-slideshow .slide-art>.feature-product{height:245px}
 .hero-slideshow .slide-starter>img{max-height:245px}
 .hero-slideshow .phone-scene{gap:9px}
 .hero-slideshow .phone-frame{height:225px;border-radius:18px;flex-basis:100px;min-width:0}
 .hero-slideshow .phone-placeholder{padding:25px 5px 12px;gap:9px}
 .hero-slideshow .phone-placeholder img{height:90px}
 .hero-slideshow .phone-type{font-size:6px}
 .hero-slideshow .phone-coming{font-size:7px}
}

/* Size columns by the artwork proportions so all three packs share one height. */
.hero-slideshow .hero-product-row{grid-template-columns:.6379928315fr .6145833333fr .6379928315fr;align-items:end;gap:18px}
.hero-slideshow .hero-scene .scene-pack{width:100%;height:auto;max-width:none;border-radius:7px;align-self:end}
@media(max-width:1000px){.hero-slideshow .hero-product-row{gap:10px}}

/* A playful opening scene; the product row moves as one to preserve alignment. */
.hero-slideshow .hero-panel .hero-scene-lively{isolation:isolate;background:#dff5fd;border-color:#061d5020;overflow:hidden}
.hero-scene-lively::before{content:'';position:absolute;width:320px;height:320px;border-radius:50%;background:#fffdf5;left:50%;top:50%;transform:translate(-50%,-50%);z-index:-1}
.hero-scene-lively::after{content:'';position:absolute;width:125px;height:125px;border-radius:50%;background:#d9f94a;right:-28px;bottom:-32px;z-index:-1}
.hero-slideshow .hero-scene-lively .scene-label{top:25px;left:50%;right:auto;width:max-content;max-width:85%;padding:10px 18px;background:#d9f94a;border:1px solid #061d50;border-radius:30px;transform:translateX(-50%) rotate(-3deg);animation:hero-label-sway 6s ease-in-out infinite}
.hero-scene-lively .hero-product-row{position:relative;z-index:2;animation:hero-row-float 4.6s ease-in-out infinite;will-change:transform}
.hero-slideshow .hero-scene-lively .scene-pack{filter:drop-shadow(0 10px 6px #061d5018)}
.hero-orbit{position:absolute;width:420px;height:340px;border:1px dashed #061d5030;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-20deg);z-index:-1}
.hero-spark{position:absolute;color:#061d50;font-size:36px;line-height:1;z-index:3;animation:hero-spark-pulse 3.8s ease-in-out infinite;pointer-events:none}
.hero-spark-one{left:24px;top:84px;transform:rotate(-12deg)}
.hero-spark-two{right:26px;bottom:69px;font-size:28px;color:#061d50;animation-delay:-1.9s}
.hero-doodle{position:absolute;width:24px;height:24px;border:3px solid #061d50;border-bottom:0;border-left:0;border-radius:0 90% 0 0;opacity:.75;pointer-events:none}
.hero-doodle-one{right:30px;top:86px;transform:rotate(-18deg)}
.hero-doodle-two{left:33px;bottom:67px;transform:rotate(160deg);width:17px;height:17px}
.hero-slideshow .hero-scene-lively .scene-caption{bottom:21px;font-size:11px}
@keyframes hero-row-float{0%,100%{transform:translateY(3px)}50%{transform:translateY(-7px)}}
@keyframes hero-label-sway{0%,100%{transform:translateX(-50%) rotate(-3deg)}50%{transform:translateX(-50%) rotate(1deg)}}
@keyframes hero-spark-pulse{0%,100%{opacity:.65;scale:.8}50%{opacity:1;scale:1.15}}
.hero-slideshow:has(.hero-pause[aria-pressed="true"]) .hero-scene-lively *{animation-play-state:paused}
.hero-panel[aria-hidden="true"] .hero-scene-lively *{animation-play-state:paused}
@media(max-width:1000px){.hero-scene-lively::before{width:260px;height:260px}.hero-orbit{width:290px;height:280px}.hero-spark-one{top:65px;left:17px;font-size:26px}.hero-doodle-one{top:64px;right:19px}}
@media(max-width:620px){.hero-slideshow .hero-scene-lively .scene-label{top:18px;font-size:8px;padding:8px 13px}.hero-scene-lively::before{width:230px;height:230px}.hero-orbit{width:270px;height:245px}.hero-spark-one{top:60px;font-size:23px}.hero-spark-two{bottom:48px;right:18px;font-size:22px}.hero-doodle-two{bottom:44px;left:20px}.hero-slideshow .hero-scene-lively .scene-caption{font-size:9px;bottom:17px}}
@media(prefers-reduced-motion:reduce){.hero-scene-lively *{animation:none!important;will-change:auto!important}}