/* Studio introduction and a collection of animated website concepts. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.offering-home{padding-top:38px}
.studio-intro{display:grid;grid-template-columns:.83fr 1.17fr;gap:42px;align-items:center;min-height:550px;padding:12px 0 38px}
.intro-eyebrow{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:.14em;margin-bottom:23px}
.intro-eyebrow>span{width:6px;height:6px;background:#72955b;border-radius:50%;box-shadow:0 0 0 4px #7e9d6514}
.intro-copy h1{font-size:clamp(56px,6.3vw,81px);line-height:.99;letter-spacing:-.065em;outline:none}
.intro-copy h1 em{color:#758463}
.intro-description{font-size:13px;line-height:1.85;color:#66705e;max-width:370px;margin:25px 0 24px}
.intro-description strong{font-weight:600;color:#334733}
.intro-continue{min-width:230px;box-shadow:0 4px 12px #2445300a}
.intro-services{font-size:11px;line-height:1.9;color:#68765e;margin-top:16px}
.intro-services b{font-weight:500;color:#4e6048}
.intro-showcase{--inner-play-state:paused;--scene-accent:#829d53;--scene-tint:#e9ece2;position:relative;min-width:0;padding:0 18px 17px;border:1px solid #d9ded1;border-radius:19px;background:var(--scene-tint);box-shadow:0 25px 50px -36px #22382750;transition:background .6s;container-type:inline-size}
.intro-showcase[data-scene=services]{--scene-accent:#608674;--scene-tint:#e5ece5}.intro-showcase[data-scene=store]{--scene-accent:#9e8533;--scene-tint:#eee9d9}.intro-showcase[data-scene=creator]{--scene-accent:#647d87;--scene-tint:#e3e9e8}.intro-showcase[data-scene=restaurant]{--scene-accent:#91634e;--scene-tint:#ece5df}.intro-showcase[data-scene=startup]{--scene-accent:#8877b0;--scene-tint:#e8e5ed}
.showcase-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0}
.showcase-top>span{font-size:8px;letter-spacing:.12em;color:#64715c;display:flex;align-items:center;gap:7px}
.showcase-top i{width:4px;height:4px;background:var(--scene-accent);border-radius:50%}
#toggleShowcase{background:transparent;font-size:10px;padding:6px 0 6px 10px;display:flex;align-items:center;gap:9px;color:#506149;min-height:30px}
#toggleShowcase>span{font-size:13px;line-height:1}
.showcase-browser{height:27px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 13px;border:1px solid #fff;border-bottom:0;border-radius:10px 10px 0 0;background:#fafbf7;color:#808b77;font-size:7px}
.showcase-browser>span:first-child{letter-spacing:2px;font-size:6px;color:#b3bbaa}.showcase-demo{font-size:6px;letter-spacing:.11em}
.showcase-screen{position:relative;aspect-ratio:1.63;overflow:hidden;border-radius:0 0 8px 8px;background:#192219;isolation:isolate;touch-action:pan-y;box-shadow:0 9px 20px -14px #1f302b70}
.showcase-screen:focus-visible{outline-offset:4px}
.showcase-slide{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(8%) scale(1.025);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.7,.2,1),visibility .6s;color:var(--scene-ink);background:var(--scene-bg);pointer-events:none;font-size:clamp(7px,1.5cqw,11px)}
.showcase-slide.is-active{opacity:1;visibility:visible;transform:none;z-index:2}
.showcase-slide.is-leaving{opacity:0;visibility:visible;transform:translateY(-5%) scale(.985);z-index:1}
.scene-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.scene-nav{position:absolute;z-index:2;left:6%;right:6%;top:6%;display:flex;align-items:center;justify-content:space-between;gap:12px}
.scene-wordmark{font-size:2.8cqw;letter-spacing:-.06em;line-height:1.1;font-weight:700;position:relative}
.scene-wordmark>span{display:block;font-size:.75cqw;letter-spacing:.15em;margin-top:4px;font-weight:400}
.scene-nav>span{font-size:1.1cqw;letter-spacing:.025em;opacity:.8;margin-left:auto}.scene-nav>i{font-style:normal;font-size:2.4cqw;margin-left:8px}
.scene-body{position:absolute;z-index:1;left:6%;right:6%;top:27%}
.scene-kicker{font-size:.9cqw;letter-spacing:.13em;display:block;margin-bottom:2.1cqw}
.scene-body h2{font-size:6.8cqw;line-height:1.01;letter-spacing:-.055em}
.scene-body h2 em{color:inherit}
.scene-body p{font-size:1.15cqw;line-height:1.7;margin-top:1.8cqw}
.scene-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:2cqw;min-width:22cqw;padding:1.6cqw 2.2cqw;background:var(--scene-pop);color:var(--scene-button-ink);font-size:1.1cqw;font-weight:500;margin-top:2.5cqw;border-radius:2px}
.scene-cta i{font-style:normal;font-size:1.7cqw;line-height:1}
.scene-bottom{position:absolute;z-index:1;bottom:5%;left:6%;right:6%;display:flex;align-items:center;justify-content:space-between;font-size:.85cqw;letter-spacing:.1em}
.scene-line{display:block;overflow:hidden;padding-bottom:.10em;margin-bottom:-.10em;--line:0}.scene-line>span{display:block}.scene-line em{display:inline-block}
.scene-services{--scene-bg:#edf1eb;--scene-ink:#233d35;--scene-pop:#274a3f;--scene-button-ink:#fff}
.scene-services .scene-photo{inset:20% 5% auto auto;width:43%;height:66%;object-position:53% center;border-radius:3px}
.scene-services .scene-nav{padding-bottom:3%;border-bottom:1px solid #b7c6b9}.scene-services .scene-wordmark{font:500 3.4cqw var(--display)}.scene-services .scene-wordmark>span{font:500 .65cqw var(--body);letter-spacing:.17em}
.scene-services .scene-body{top:30%}.scene-services .scene-kicker{font-size:.7cqw;color:#5b7867}.scene-services .scene-body h2{font-size:6.4cqw;line-height:1.04}.scene-services .scene-body h2 em{color:#6b876d}.scene-services .scene-cta{margin-top:2.1cqw}
.service-note{position:absolute;z-index:3;right:8%;bottom:16%;width:34%;padding:2cqw;background:#fbfcf5;box-shadow:0 10px 25px #223c3326;color:#28473b}.service-note>span{font-size:.6cqw;letter-spacing:.14em}.service-note>b{font:400 2.5cqw var(--display);display:flex;justify-content:space-between;margin:1cqw 0 1.5cqw}.service-note>b>i{font-style:normal;font-size:2cqw}.service-note>div{display:flex;align-items:center;gap:.7cqw;font-size:.8cqw;color:#72846f}.service-note>div>i{width:.6cqw;height:.6cqw;border-radius:50%;background:#89a56b}.scene-services .scene-bottom{font-size:.65cqw;color:#66816c}
.scene-store{--scene-bg:#f0c840;--scene-ink:#28271a;--scene-pop:#20251b;--scene-button-ink:#fff7da}
.scene-store .scene-photo{object-position:54% center}.scene-store .scene-wordmark{font:600 4.1cqw/1 var(--display);letter-spacing:-.09em}.scene-store .scene-wordmark>span{font:500 .65cqw var(--body);letter-spacing:.16em}.scene-store .scene-body{top:30%}.scene-store .scene-kicker{font-size:.7cqw}.scene-store .scene-body h2{font-size:6.8cqw;line-height:1.06}.scene-store .scene-body p{font-size:1.1cqw}.scene-store .scene-cta{border-radius:30px;margin-top:2.5cqw;padding-inline:2.4cqw}
.scene-nav .store-bag{display:flex;align-items:center;gap:.8cqw;font-size:1.1cqw;margin-left:2cqw;opacity:1}.store-bag>i{font-style:normal;display:block;width:2.3cqw;height:2.3cqw;overflow:hidden;border:1px solid #554a2580;border-radius:50%}.store-bag>i>b{height:2.3cqw;display:grid;place-items:center;font-weight:500}
.store-confirm{position:absolute;right:6%;bottom:17%;z-index:3;display:flex;align-items:center;gap:1.4cqw;background:#fdfbef;color:#34452a;padding:1.8cqw 2cqw;border-radius:7px;box-shadow:0 10px 30px #53401824}.store-confirm>span:nth-child(2){font-size:.85cqw}.store-confirm b{display:block;font-size:1.1cqw;margin-bottom:.3cqw}.store-confirm>i{font-style:normal;font-size:1.3cqw;align-self:start;margin-left:2cqw;color:#7b845c}.store-check{width:3cqw;height:3cqw;background:#e6edcd;border-radius:50%;display:grid;place-items:center;font-size:1.5cqw}.scene-store .scene-bottom{font-size:.65cqw}
.scene-creator{--scene-bg:#142020;--scene-ink:#f6f2e7;--scene-pop:#e8e8dc;--scene-button-ink:#1e342e}
.scene-creator .scene-photo{object-position:50% center;filter:brightness(.78)}.scene-creator::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#102527bf,transparent 75%),linear-gradient(0deg,#102427bd,transparent 30%)}
.scene-creator .scene-wordmark{font-size:2cqw;letter-spacing:.07em}.scene-creator .scene-wordmark>span{font-size:.55cqw;letter-spacing:.12em}.scene-creator .scene-body{top:34%}.scene-creator .scene-kicker{font-size:.7cqw;color:#d9ded4}.scene-creator .scene-body h2{font-size:7.5cqw}.scene-creator .scene-body em{color:#e7dcbb}.scene-creator .scene-cta{background:transparent;color:#fff9e6;border-bottom:1px solid #e9e6d67a;padding-inline:0;min-width:25cqw}.scene-creator .scene-bottom{font-size:.65cqw}
.creator-frame{position:absolute;right:9%;top:25%;width:29%;height:36%;z-index:1}.creator-frame i{position:absolute;width:3cqw;height:3cqw;border-color:#ede8d2b3;border-style:solid;border-width:0}.creator-frame i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px}.creator-frame i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px}.creator-frame i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px}.creator-frame i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px}
.creator-film{position:absolute;right:6%;bottom:14%;width:31%;height:18%;z-index:2;display:flex;gap:1cqw;transform:rotate(-4deg)}.creator-film img{width:calc((100% - 2cqw)/3);height:100%;object-fit:cover;border:3px solid #f4efe0}.creator-film img:nth-child(1){object-position:20%}.creator-film img:nth-child(2){object-position:48%;transform:translateY(-1.7cqw)}.creator-film img:nth-child(3){object-position:85%}
.scene-restaurant{--scene-bg:#281b15;--scene-ink:#fff0d6;--scene-pop:#e7cfac;--scene-button-ink:#3a2119}
.scene-restaurant .scene-photo{object-position:50% 55%;filter:brightness(.52)}.scene-restaurant::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#21130fbd,transparent 60%,#1c130b80)}
.scene-restaurant .scene-nav>span{margin-left:0;font-size:.95cqw}.scene-restaurant .scene-wordmark{position:absolute;left:50%;transform:translateX(-50%);font-family:var(--display);font-size:2.8cqw;font-weight:400;letter-spacing:.11em;text-align:center}.scene-restaurant .scene-wordmark>span{font:400 .65cqw var(--body);letter-spacing:.2em}.scene-restaurant .scene-body{top:31%;text-align:center}.scene-restaurant .scene-body h2{font-size:7.8cqw;line-height:1.04}.scene-restaurant h2 em{color:#e5c4a0}.scene-restaurant .scene-kicker{font-size:.8cqw}.scene-restaurant .scene-cta{margin-top:3cqw;background:#e8d4b9;color:#322219;border-radius:0;min-width:25cqw}.scene-restaurant .scene-bottom{border-top:1px solid #e8d7be50;padding-top:3%;font-size:.7cqw;color:#e1d0ba}
.restaurant-light{position:absolute;inset:-30%;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#f9d09e14 45%,transparent 65%);mix-blend-mode:screen}
.scene-startup{--scene-bg:#1b2032;--scene-ink:#f5f3ff;--scene-pop:#c9c0ff;--scene-button-ink:#26253b}
.startup-glow{position:absolute;right:-8%;top:3%;width:64%;height:95%;border-radius:50%;background:radial-gradient(ellipse,#9b88e54a,transparent 68%)}
.scene-startup .scene-wordmark{font:600 3.6cqw/1 var(--body);letter-spacing:-.07em}.scene-startup .scene-wordmark>i{color:#c7baff;font-style:normal;font-size:4cqw;display:inline-block;vertical-align:middle;margin-right:.6cqw}.scene-startup .scene-wordmark>span{font-size:.6cqw;letter-spacing:.14em;font-weight:400;margin-top:.7cqw;color:#b4b3c8}.scene-startup .scene-nav>span{font-size:1cqw;color:#d6d0eb}
.scene-startup .scene-body{top:30%}.scene-startup .scene-kicker{font-size:.65cqw;letter-spacing:.09em;color:#afa4d7}.scene-startup .scene-body h2{font-family:var(--body);font-size:5.6cqw;line-height:1.08;font-weight:500;letter-spacing:-.065em}.scene-startup h2 em{font-style:normal;color:#c8b9ff;font-weight:500}.scene-startup .scene-body p{font-size:1.05cqw;color:#bdbacf}.scene-startup .scene-cta{margin-top:2.6cqw;border-radius:4px;min-width:29cqw}.scene-startup .scene-bottom{font-size:.65cqw;color:#a9a8c5}
.startup-dashboard{position:absolute;z-index:2;right:4%;top:24%;width:43%;height:60%;border:1px solid #fff3;border-radius:7px;background:#f5f4fb;color:#3d3b50;box-shadow:0 15px 35px #08092066;transform:perspective(700px) rotateY(-9deg) rotateZ(3deg);padding:1.8cqw}
.dashboard-nav{display:flex;align-items:center;gap:2cqw;border-bottom:1px solid #dedbe9;padding-bottom:1.2cqw}.dashboard-nav b{font-size:1.6cqw;letter-spacing:-.06em}.dashboard-nav>span{font-size:.55cqw;color:#888399;letter-spacing:.09em;margin-left:auto}.dashboard-nav>i{font-size:1.3cqw;font-style:normal}
.dashboard-title{margin-top:1.7cqw}.dashboard-title span{display:block;font-size:.55cqw;color:#9b91b3;letter-spacing:.1em;margin-bottom:.5cqw}.dashboard-title b{font-size:2cqw;font-weight:500;letter-spacing:-.05em}
.dashboard-tabs{display:flex;gap:2cqw;font-size:.65cqw;margin:1.6cqw 0;color:#938aa6}.dashboard-tabs span:first-child{color:#665283}
.dashboard-task{display:flex;align-items:center;gap:1.1cqw;border:1px solid #e2ddec;background:white;margin-top:.7cqw;padding:1cqw;border-radius:4px;transform-origin:left center}.dashboard-task>i{font-size:.6cqw;font-style:normal;color:#8e7ba3;background:#eee8f6;width:2.2cqw;height:2.2cqw;display:grid;place-items:center;border-radius:4px}.dashboard-task>span{font-size:.8cqw;font-weight:500}.dashboard-task small{display:block;font-size:.55cqw;color:#978aa5;margin-top:.25cqw}.dashboard-task>b{margin-left:auto;width:1.8cqw;height:1.8cqw;display:grid;place-items:center;border-radius:50%;background:#e1eddf;color:#65875e;font-size:1cqw}
.dashboard-progress{margin-top:1.4cqw;display:flex;align-items:center;gap:1.2cqw}.dashboard-progress span{font-size:.5cqw;letter-spacing:.06em;color:#9b90a7}.dashboard-progress>i{display:block;flex:1;height:.45cqw;background:#e6dfee;border-radius:3px;overflow:hidden}.dashboard-progress>i::after{content:'';display:block;height:100%;width:100%;background:#9a83bc;border-radius:3px;transform-origin:left}
.startup-toast{position:absolute;z-index:3;right:5%;bottom:12%;display:flex;align-items:center;gap:1cqw;background:#d8d0f7;color:#403257;box-shadow:0 9px 20px #10102650;border:1px solid #fff5;border-radius:5px;padding:1.1cqw 1.5cqw;font-size:.8cqw}.startup-toast>i{width:1.8cqw;height:1.8cqw;border-radius:50%;background:#b2a2d7;color:white;font-style:normal;display:grid;place-items:center}
/* Fitness: strong typography, a diagonal photo and an animated training rhythm. */
.intro-showcase[data-scene=fitness]{--scene-accent:#70843c;--scene-tint:#e6e8df}.intro-showcase[data-scene=yoga]{--scene-accent:#aa8170;--scene-tint:#eee5e0}.intro-showcase[data-scene=travel]{--scene-accent:#477f7c;--scene-tint:#e2eae6}
.scene-fitness{--scene-bg:#171d1a;--scene-ink:#f5f5eb;--scene-pop:#d5f271;--scene-button-ink:#20281c}
.scene-fitness .scene-photo{left:39%;width:61%;object-position:30% center;filter:brightness(.65);clip-path:polygon(22% 0,100% 0,100% 100%,0 100%)}
.scene-fitness::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#171d1a 20%,#171d1a55 60%,transparent),linear-gradient(0deg,#171d1ae6,transparent 45%)}
.scene-fitness .scene-wordmark{font:700 italic 3.8cqw/1 var(--body);letter-spacing:-.08em}.scene-fitness .scene-wordmark>span{font:400 .6cqw var(--body);letter-spacing:.16em;margin-top:.7cqw;color:#c9d4c6}
.scene-fitness .scene-body{top:30%}.scene-fitness .scene-kicker{color:#d5f271;font-size:.7cqw}.scene-fitness .scene-body h2{font:700 7.8cqw/.98 var(--body);letter-spacing:-.075em}.scene-fitness .scene-body em{font-style:normal;color:#d5f271}.scene-fitness .scene-body p{color:#c3cbbf;font-size:1cqw;line-height:1.6}.scene-fitness .scene-cta{border-radius:0;margin-top:2.3cqw}.scene-fitness .scene-bottom{font-size:.65cqw;color:#b9c6b7}
.fitness-session{position:absolute;right:6%;bottom:17%;z-index:2;width:29%;padding:1.8cqw;background:#1c271ee8;border:1px solid #a7c38155;backdrop-filter:blur(6px)}.fitness-session>span{font-size:.55cqw;letter-spacing:.17em;color:#bdd98a}.fitness-session>b{display:block;font:500 1.8cqw var(--body);letter-spacing:-.04em;margin-top:.7cqw}.fitness-bars{display:flex;align-items:end;gap:.75cqw;height:5.7cqw;padding:1cqw 0}.fitness-bars i{flex:1;height:45%;background:#d5f271;transform-origin:bottom}.fitness-bars i:nth-child(2n){height:72%}.fitness-bars i:nth-child(3n){height:95%}.fitness-bars i:last-child{height:100%}.fitness-session-foot{display:flex;justify-content:space-between;gap:1cqw;font-size:.5cqw;color:#bbc9ad}.fitness-session-foot>b{font-weight:500;color:#e5efce}
/* Yoga: a warm, quiet composition with a soft photographic arch. */
.scene-yoga{--scene-bg:#f2e9de;--scene-ink:#594b42;--scene-pop:#826757;--scene-button-ink:#fff8ee}
.scene-yoga .scene-photo{inset:20% 6% auto auto;width:40%;height:67%;object-position:58% center;border-radius:45% 45% 5px 5px;filter:saturate(.68)}
.yoga-orbit{position:absolute;right:3%;top:16%;width:46%;height:74%;border:1px solid #b99b824a;border-radius:50% 50% 9px 9px;transform-origin:center}
.scene-yoga .scene-wordmark{font:400 4.2cqw/.8 var(--display);letter-spacing:-.08em}.scene-yoga .scene-wordmark>span{font:400 .6cqw var(--body);letter-spacing:.17em;margin-top:1cqw}.scene-yoga .scene-nav>span{font-size:1cqw}.scene-yoga .scene-body{top:32%}.scene-yoga .scene-kicker{font-size:.7cqw;color:#967e68}.scene-yoga .scene-body h2{font-size:6.1cqw;line-height:1.08;letter-spacing:-.055em}.scene-yoga .scene-body em{color:#a3856f}.scene-yoga .scene-body p{font-size:1cqw;color:#927b68}.scene-yoga .scene-cta{border-radius:30px;margin-top:2.2cqw;min-width:24cqw}.scene-yoga .scene-bottom{font-size:.65cqw;color:#a08771}
.yoga-class{position:absolute;z-index:3;right:10%;bottom:16%;width:34%;display:flex;gap:1.5cqw;align-items:center;padding:1.6cqw;background:#fcf8eeed;box-shadow:0 10px 25px #56423922;border-radius:3px}.breath-circle{display:block;flex-shrink:0;width:3.8cqw;height:3.8cqw;border:1px solid #b5957a;border-radius:50%;background:#dfccb04d;box-shadow:0 0 0 .6cqw #dfccb028}.yoga-class>span{font-size:.7cqw;line-height:1.8;color:#9b8067}.yoga-class b{display:block;font:400 1.7cqw var(--display);color:#705947}.yoga-class-arrow{font-size:1.7cqw;font-style:normal;margin-left:auto;color:#9b8067}
/* Travel: an expansive landscape and an itinerary arriving over the water. */
.scene-travel{--scene-bg:#1d4745;--scene-ink:#fff8e8;--scene-pop:#e8e1ca;--scene-button-ink:#26443d}
.scene-travel .scene-photo{object-position:center 48%;filter:brightness(.78)}.scene-travel::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#092b2bc4,transparent 85%),linear-gradient(0deg,#082626d9,transparent 60%)}
.scene-travel .scene-wordmark{font:500 4cqw/.8 var(--display);letter-spacing:-.07em}.scene-travel .scene-wordmark>span{font:400 .6cqw var(--body);letter-spacing:.16em;margin-top:1cqw}.scene-travel .scene-body{top:29%}.scene-travel .scene-kicker{font-size:.75cqw;color:#e5e6d0}.scene-travel .scene-body h2{font-size:7.7cqw;line-height:1.04}.scene-travel .scene-body em{color:#eee6cd}.scene-travel .scene-body p{font-size:1cqw;color:#e3e6d3}.scene-travel .scene-bottom{font-size:.6cqw;color:#d1decf}
.travel-booking{position:absolute;z-index:3;bottom:14%;left:6%;right:6%;display:flex;align-items:center;gap:3cqw;padding:1.8cqw 2cqw;background:#faf8e9;color:#27483f;box-shadow:0 6px 25px #102d3740;border-radius:3px}.travel-booking>div{min-width:0}.travel-booking>div:nth-child(2){border-left:1px solid #bdc6b6;padding-left:3cqw}.travel-booking>div>span{font-size:.55cqw;letter-spacing:.1em;color:#89917b;display:block;margin-bottom:.7cqw}.travel-booking b{font:400 1.6cqw var(--display)}.travel-explore{margin-left:auto;display:flex;align-items:center;gap:2cqw;background:#2d5146;color:#f3f1d9;padding:1.5cqw 2cqw;font-size:.9cqw;border-radius:2px;white-space:nowrap}.travel-explore>i{font-style:normal;font-size:1.4cqw}
.travel-compass{position:absolute;z-index:2;right:9%;top:33%;width:8cqw;height:8cqw;border:1px solid #e9efd580;border-radius:50%;display:grid;place-items:center;color:#f3f0d7}.travel-compass>span{position:absolute;top:-1.8cqw;left:50%;translate:-50% 0;font-size:.65cqw}.travel-compass>i{height:5.2cqw;width:1.4cqw;background:linear-gradient(#f7efd3 50%,#f7efd344 50%);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);transform:rotate(32deg)}

/* Each preview has its own short entrance sequence. The carousel preserves the
   current frame when paused, and hidden slides cannot keep animating. */
.scene-animated .scene-nav{animation:scene-fade-up .55s .1s both}
.scene-animated .scene-kicker{animation:scene-fade-up .5s .18s both}
.scene-animated .scene-line>span{animation:scene-line-in .68s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.23s + var(--line)*.13s)}
.scene-animated .scene-body>p{animation:scene-fade-up .55s .62s both}
.scene-animated .scene-cta{animation:scene-fade-up .55s .73s both}
.scene-animated .scene-bottom{animation:scene-fade-up .5s .85s both}
.scene-services.scene-animated .scene-photo{animation:service-image-in 1.2s cubic-bezier(.2,.7,.2,1) both}
.scene-services.scene-animated .service-note{animation:service-card-in .8s .9s cubic-bezier(.16,1,.3,1) both}
.scene-store.scene-animated .scene-photo{animation:product-drift 2.2s cubic-bezier(.2,.65,.2,1) both;transform-origin:70% 45%}
.scene-store.scene-animated .store-confirm{animation:cart-confirm .6s 1.22s cubic-bezier(.2,1.25,.4,1) both}
.scene-store.scene-animated .store-bag b{animation:cart-count .3s 1.3s both}
.scene-store.scene-animated .store-check{animation:check-pop .4s 1.4s both}
.scene-creator.scene-animated .scene-photo{animation:creator-pan 2.2s ease-out both}
.scene-creator.scene-animated .creator-frame{animation:focus-frame .9s .35s both}
.scene-creator.scene-animated .creator-film img{animation:film-arrive .8s .6s cubic-bezier(.16,1,.3,1) both}
.scene-creator.scene-animated .creator-film img:nth-child(2){animation-delay:.75s}.scene-creator.scene-animated .creator-film img:nth-child(3){animation-delay:.9s}
.scene-restaurant.scene-animated .scene-photo{animation:restaurant-push 2.2s ease-out both;transform-origin:55% 55%}
.scene-restaurant.scene-animated .restaurant-light{animation:restaurant-light 2.2s ease-in-out both}
.scene-restaurant.scene-animated .scene-line>span{animation-name:restaurant-type;animation-duration:1s}
.scene-startup.scene-animated .startup-glow{animation:software-glow 2.2s ease-out both}
.scene-startup.scene-animated .startup-dashboard{animation:dashboard-arrive .85s .15s cubic-bezier(.16,1,.3,1) both}
.scene-startup.scene-animated .dashboard-task{animation:task-arrive .6s .55s cubic-bezier(.2,.9,.2,1) both}
.scene-startup.scene-animated .dashboard-task:nth-of-type(5){animation-delay:.7s}.scene-startup.scene-animated .dashboard-task:nth-of-type(6){animation-delay:.85s}
.scene-startup.scene-animated .dashboard-task>b{animation:check-pop .4s 1.1s both}
.scene-startup.scene-animated .dashboard-progress>i::after{animation:task-progress 1s .75s both}
.scene-startup.scene-animated .startup-toast{animation:cart-confirm .55s 1.45s both}
.scene-fitness.scene-animated .scene-photo{animation:fitness-photo 2.2s ease-out both;transform-origin:65% center}
.scene-fitness.scene-animated .scene-line>span{animation-duration:.5s;animation-timing-function:cubic-bezier(.1,.8,.2,1)}
.scene-fitness.scene-animated .fitness-session{animation:service-card-in .65s .7s both}
.scene-fitness.scene-animated .fitness-bars i{animation:fitness-bar .8s .9s cubic-bezier(.2,.8,.2,1) both}
.scene-fitness.scene-animated .fitness-bars i:nth-child(2n){animation-delay:1.05s}.scene-fitness.scene-animated .fitness-bars i:nth-child(3n){animation-delay:1.2s}
.scene-yoga.scene-animated .scene-photo{animation:yoga-photo 1.5s cubic-bezier(.2,.7,.2,1) both}
.scene-yoga.scene-animated .yoga-orbit{animation:yoga-breathe 2.2s ease-in-out both}
.scene-yoga.scene-animated .scene-line>span{animation-name:restaurant-type;animation-duration:1.05s}
.scene-yoga.scene-animated .yoga-class{animation:service-card-in .85s .85s both}
.scene-yoga.scene-animated .breath-circle{animation:yoga-breathe 1.1s 1.05s ease-in-out both}
.scene-travel.scene-animated .scene-photo{animation:travel-journey 2.2s ease-out both;transform-origin:center 65%}
.scene-travel.scene-animated .travel-compass{animation:scene-fade-up .7s .5s both}
.scene-travel.scene-animated .travel-compass>i{animation:compass-settle 1.6s .3s cubic-bezier(.16,1,.3,1) both}
.scene-travel.scene-animated .travel-booking{animation:service-card-in .8s .95s both}
@keyframes fitness-photo{from{transform:scale(1.12) translateX(3%)}to{transform:scale(1.02)}}
@keyframes fitness-bar{from{opacity:.2;transform:scaleY(.05)}to{opacity:1;transform:scaleY(1)}}
@keyframes yoga-photo{from{opacity:0;transform:translateY(3cqw) scale(.97);clip-path:inset(15% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes yoga-breathe{from{opacity:.3;scale:.8}to{opacity:1;scale:1}}
@keyframes travel-journey{from{transform:scale(1.14) translateY(1%)}to{transform:scale(1.025)}}
@keyframes compass-settle{from{transform:rotate(-160deg)}to{transform:rotate(32deg)}}
.scene-animated:not(.is-active){--inner-play-state:paused}
.scene-animated *,.scene-animated *::before,.scene-animated *::after{animation-play-state:var(--inner-play-state,paused)!important}
@keyframes scene-fade-up{from{opacity:0;transform:translateY(1.4cqw)}to{opacity:1;transform:none}}
@keyframes scene-line-in{from{transform:translateY(112%) rotate(2deg)}to{transform:none}}
@keyframes service-image-in{from{clip-path:inset(0 0 100% 0);transform:translateY(3cqw) scale(1.06)}to{clip-path:inset(0);transform:none}}
@keyframes service-card-in{from{opacity:0;transform:translateY(4cqw) rotate(-3deg)}to{opacity:1;transform:none}}
@keyframes product-drift{from{transform:scale(1.13) rotate(-2deg)}to{transform:scale(1.015)}}
@keyframes cart-confirm{from{opacity:0;transform:translateY(2.5cqw) scale(.92)}to{opacity:1;transform:none}}
@keyframes cart-count{to{transform:translateY(-2.3cqw)}}
@keyframes check-pop{from{opacity:0;transform:scale(.3)}75%{opacity:1;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}
@keyframes creator-pan{from{transform:scale(1.13) translateX(1%)}to{transform:scale(1.025) translateX(0)}}
@keyframes focus-frame{from{opacity:0;transform:scale(1.3)}60%{opacity:.7;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes film-arrive{from{opacity:0;translate:5cqw 2cqw;rotate:8deg}to{opacity:1;translate:0 0;rotate:0deg}}
@keyframes restaurant-push{from{transform:scale(1.13)}to{transform:scale(1.025)}}
@keyframes restaurant-light{from{opacity:0;transform:translateX(-45%) rotate(-10deg)}40%{opacity:1}to{opacity:.2;transform:translateX(40%) rotate(-10deg)}}
@keyframes restaurant-type{from{opacity:0;transform:translateY(70%);letter-spacing:-.025em}to{opacity:1;transform:none;letter-spacing:inherit}}
@keyframes software-glow{from{opacity:.4;transform:scale(.8)}to{opacity:1;transform:scale(1.1)}}
@keyframes dashboard-arrive{from{opacity:0;transform:perspective(700px) translateY(6cqw) rotateY(-25deg) rotateZ(8deg) scale(.94)}to{opacity:1;transform:perspective(700px) rotateY(-9deg) rotateZ(3deg)}}
@keyframes task-arrive{from{opacity:0;transform:translateX(5cqw)}to{opacity:1;transform:none}}
@keyframes task-progress{from{transform:scaleX(.05)}to{transform:scaleX(1)}}
.showcase-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:65px;padding:14px 0 12px}
.showcase-caption>div{display:flex;align-items:center;gap:11px;flex-shrink:0}.showcase-counter{font-size:8px;font-variant-numeric:tabular-nums;color:#819077;white-space:nowrap}
.showcase-caption h2{font:500 15px/1.2 var(--body);letter-spacing:-.04em;color:#364b32}.showcase-caption p{font-size:9px;text-align:right;color:#63745a;max-width:230px;line-height:1.5}
.showcase-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px 12px}
.showcase-options button{background:transparent;text-align:left;padding:7px 0 3px;position:relative;min-width:0;font-size:9px;color:#7a8671;white-space:nowrap;font-weight:500;border-radius:2px}
.showcase-options button[aria-pressed=true]{color:#2e472b}.showcase-options i{display:block;height:2px;background:#cbd2c4;margin-top:10px;position:relative;overflow:hidden;border-radius:2px}
.showcase-options i::after{content:'';position:absolute;inset:0;background:var(--scene-accent);transform:scaleX(0);transform-origin:left center}
.showcase-options button[aria-pressed=true] i::after{transform:scaleX(1)}
.intro-showcase.is-playing .showcase-options button[aria-pressed=true] i::after{animation:showcase-time 2.2s linear both}
@keyframes showcase-time{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.intro-capabilities{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;color:#65725d}.intro-capabilities>span{font-size:8px;letter-spacing:.13em}.intro-capabilities p{font-size:10px}.intro-capabilities i{margin:0 13px;font-style:normal;color:#a0aa94}
.service-choices{padding-top:70px;scroll-margin-top:32px}.service-choices .offering-heading h2{font-size:54px;outline:none}.service-choices .offering-heading>p:last-child{font-size:13px;max-width:400px}
@media(min-width:1400px){.studio-intro{min-height:620px}}
@media(min-width:901px) and (max-height:800px){.offering-home{padding-top:18px}.showcase-screen{aspect-ratio:1.72}.studio-intro{min-height:510px;padding-top:10px;padding-bottom:30px}.intro-copy h1{font-size:70px}.intro-description{margin-top:20px;margin-bottom:21px}.intro-eyebrow{margin-bottom:20px}.intro-capabilities{padding:18px 0}}
@media(max-width:1100px) and (min-width:901px){.studio-intro{gap:25px;grid-template-columns:.85fr 1.15fr}.intro-copy h1{font-size:64px}.showcase-caption{display:block;padding-block:12px}.showcase-caption p{margin-top:6px;text-align:left;max-width:none}.intro-showcase{padding-inline:14px}.showcase-options button{font-size:8px}}
@media(max-width:900px){.studio-intro{grid-template-columns:1fr 1.1fr;gap:24px;min-height:500px}.intro-copy h1{font-size:57px}.intro-description{font-size:12px}.intro-showcase{padding:0 12px 13px;border-radius:14px}.showcase-top>span{font-size:6px;letter-spacing:.07em}.showcase-top{gap:5px;padding:9px 0}.showcase-caption{display:block;min-height:70px}.showcase-caption p{margin-top:7px;text-align:left;max-width:none;font-size:8px}.showcase-caption h2{font-size:14px}.showcase-options{gap:5px}.showcase-options button{font-size:7px}.showcase-demo{font-size:5px}.intro-capabilities>span{max-width:180px;line-height:1.8}.intro-capabilities p{font-size:9px}.intro-capabilities i{margin:0 8px}.service-choices .offering-heading h2{font-size:48px}.service-choices{padding-top:52px}}
@media(max-width:700px){.offering-home{padding-top:25px}.studio-intro{grid-template-columns:1fr;gap:14px;min-height:0;padding:0 0 28px}.intro-copy{display:contents}.intro-eyebrow{order:1;font-size:8px;margin:0 0 4px}.intro-copy h1{order:2;font-size:clamp(47px,10vw,62px);line-height:1;max-width:430px}.intro-description{order:3;font-size:12px;line-height:1.7;max-width:440px;margin:0}.intro-description strong{white-space:nowrap}.intro-services{order:4;margin:0;font-size:10px;line-height:1.7}.intro-showcase{order:5;width:100%;max-width:560px;margin:3px auto 0;padding:0 12px 12px}.intro-continue{order:6;justify-self:start;min-width:230px;margin-top:4px}.showcase-top{padding:7px 0}.showcase-top>span{font-size:7px}.showcase-browser{height:23px;font-size:6px}.showcase-screen{aspect-ratio:1.58}.showcase-caption{display:flex;min-height:58px;padding:10px 0;gap:8px}.showcase-caption>div{gap:8px}.showcase-caption h2{font-size:13px}.showcase-caption p{margin:0;text-align:right;font-size:8px;max-width:180px}.showcase-counter{font-size:7px}.showcase-options button{font-size:8px;padding-top:4px}.showcase-options i{margin-top:7px}.intro-capabilities{align-items:flex-start;flex-direction:column;gap:10px;padding:20px 0}.intro-capabilities>span{max-width:none;font-size:7px}.intro-capabilities p{font-size:9px}.intro-capabilities i{margin-inline:9px}.service-choices{padding-top:40px}.service-choices .offering-heading h2{font-size:46px}.service-choices .offering-heading>p:last-child{font-size:12px}}
@media(max-width:390px){.studio-intro{gap:12px}.intro-copy h1{font-size:47px}.intro-description{font-size:11px}.intro-services{font-size:9px}.showcase-caption{display:block;min-height:63px}.showcase-caption p{text-align:left;margin-top:5px;max-width:none}.showcase-top>span{font-size:6px}.showcase-options button{font-size:7px}.showcase-browser{padding-inline:9px}.showcase-demo{font-size:4px}.intro-capabilities i{margin-inline:5px}.intro-capabilities p{font-size:8px}.service-choices .offering-heading h2{font-size:42px}}
@media(prefers-reduced-motion:reduce){.intro-showcase,.showcase-slide{transition:none!important}.showcase-options i::after{animation:none!important}}

.showcase-tools{display:flex;gap:14px;align-items:center;flex-shrink:0}#replayScene{display:flex;align-items:center;gap:6px;background:transparent;color:#66735f;font-size:9px;padding:6px 0;min-height:30px}#replayScene span{font-size:15px}#toggleShowcase{padding-left:0;white-space:nowrap}
@media(max-width:900px){.showcase-tools{gap:10px}#toggleShowcase,#replayScene{font-size:8px}.showcase-top>span{max-width:140px;font-size:6px}}
@media(max-width:390px){.showcase-tools{gap:8px}.showcase-top>span{max-width:106px;font-size:5px;line-height:1.5}#toggleShowcase,#replayScene{font-size:7px}.showcase-caption h2{font-size:12px}}
@media(prefers-reduced-motion:reduce){.scene-animated *,.scene-animated *::before,.scene-animated *::after{animation:none!important;transition:none!important}.store-bag>i>b:first-child{display:none}}
