/* The app and plan sections share the established Klari tokens and Inter type. */
.app-showcase{display:grid;grid-template-columns:1.06fr 1fr;grid-template-rows:1fr 1fr;column-gap:76px;border-top:1px solid var(--line);align-items:center}
.app-intro{grid-column:2;grid-row:1;align-self:end;padding-bottom:30px}.app-intro h2,.plans-heading h2{font-size:clamp(36px,4.2vw,56px);line-height:1.08;letter-spacing:-2.1px;font-weight:600;margin:22px 0}.app-intro p{font-size:18px;line-height:1.8;color:var(--muted);max-width:480px}
.app-figure{grid-column:1;grid-row:1/3;position:relative;margin:0;min-width:0}.app-stage{position:relative;height:650px;isolation:isolate}.app-orbit{position:absolute;width:94%;aspect-ratio:1;border-radius:50%;background:#e8f5f8;left:3%;top:12%;border:1px solid #d8edf1}.app-orbit:after{content:'';position:absolute;inset:23px;border:1px solid #b6dfea66;border-radius:50%}.app-orbit-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#a5def0;top:19%;left:22%}
.app-phone{position:absolute;top:25px;left:50%;width:272px;aspect-ratio:460/980;transform:translateX(-50%) rotate(-3deg);border-radius:32px;box-shadow:13px 28px 35px -15px #183b4b55,0 2px 6px #10182812;overflow:hidden;background:#f4f6fa;isolation:isolate;will-change:transform}
.app-screen{position:absolute;inset:0;opacity:0;pointer-events:none;will-change:opacity}.app-screen:first-child{opacity:1}.app-screen>img,.app-screen>video{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.app-screen>video{opacity:0}.app-screen>video.ready{opacity:1}.app-library-count{position:absolute;top:24.85%;left:4%;right:3%;height:2.8%;display:flex;align-items:center;gap:4px;background:#f6f7fb;font-size:7.6px;font-weight:600;white-space:nowrap}.app-library-count span{font-weight:400;color:#818793}
.app-selected-tile{position:absolute;inset:auto 5% 7%;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #299ad866;border-radius:12px;padding:13px 11px;box-shadow:0 10px 30px #10182824;opacity:0;transform:translateY(10px)}.app-selected-tile>img{width:43px;border-radius:2px;box-shadow:3px 4px 7px #10182820}.app-selected-tile>span{font-size:7px;color:#287caa;letter-spacing:.6px}.app-selected-tile strong{display:block;font-size:13px;line-height:1.3;letter-spacing:-.2px;color:#101828;margin:5px 0}.app-selected-tile small{font-size:9px;letter-spacing:0;color:#667085}.app-selected-tile>.icon{width:14px;color:#299ad8}
.app-analysis-insights{position:absolute;left:5%;right:4.5%;bottom:7.7%;height:15.8%;border-radius:7px;background:#f9fcfd;border:1px solid #a5def0;padding:9px;font-size:9px;line-height:1.5}.app-analysis-insights strong{font-size:7px;letter-spacing:1px;color:#267aa5}.app-analysis-insights span{display:block;margin:4px 0}.app-analysis-insights span:before{content:'•';color:#299ad8;margin-right:6px}.app-analysis-insights small{font-size:6.8px;color:#667085}
.app-screen-content{position:absolute;inset:1.6% 2.6% 1.3%;border-radius:24px;background:#f7f9fc;overflow:hidden;padding:13px 14px;color:#101828}.app-ui-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;padding:4px 0 18px}.app-ui-header>span{font-size:22px;line-height:1}.app-ui-header>.icon{width:15px;height:15px}.app-ui-book{display:flex;align-items:center;gap:12px;padding:14px 0 16px;border-top:1px solid #1018280d}.app-ui-book>img{width:45px;border-radius:3px;box-shadow:3px 5px 9px #10182819}.app-ui-book strong{display:block;font-size:12px;line-height:1.4}.app-ui-book span{display:block;font-size:9px;color:#667085;margin-top:6px}.app-ui-sample{font-size:6.8px;letter-spacing:1px;color:#3b7c9d;font-weight:600;padding:8px 0}.app-ui-question{font-size:12px;line-height:1.5;border-radius:12px 12px 3px 12px;padding:11px 12px;margin:5px 0 18px 17px;background:#e2f2fa}.app-ui-answer{position:relative;padding-left:22px}.app-ui-answer>.icon{position:absolute;left:0;top:0;color:#299ad8;width:15px;height:15px}.app-ui-answer>strong{font-size:10px}.app-ui-answer>p{font-size:11px;line-height:1.7;margin-top:8px;color:#445469}.app-ui-answer>span{display:block;font-size:10px;line-height:1.65;border-left:2px solid #a5def0;padding-left:8px;margin-top:14px}.app-ui-input{position:absolute;left:14px;right:14px;bottom:21px;padding:12px;background:white;border:1px solid #10182818;border-radius:30px;font-size:9px;color:#6e7b8b;display:flex;justify-content:space-between}.app-ui-input span{color:#299ad8}
.app-audio-content{text-align:center}.app-audio-content .app-ui-sample{margin-top:3px}.app-audio-cover{width:101px;height:151px;object-fit:cover;margin:14px auto 19px;border-radius:4px;box-shadow:7px 12px 19px #193a502d;transform:rotate(-3deg)}.app-audio-content h3{font-size:17px;line-height:1.3;letter-spacing:-.45px}.app-audio-content>p{font-size:10px;color:#667085;margin-top:6px}.app-wave{display:flex;justify-content:center;align-items:center;gap:3px;height:35px;margin:18px 0 9px}.app-wave i{display:block;width:3px;height:24px;border-radius:4px;background:#299ad8;transform:scaleY(.3)}.app-mini-progress{height:3px;background:#dbeaf2;border-radius:5px;overflow:hidden}.app-mini-progress span{display:block;height:100%;width:100%;background:#299ad8;transform:scaleX(0);transform-origin:left}.app-audio-times{display:flex;justify-content:space-between;font-size:7px;color:#67788b;margin-top:7px}.app-audio-controls{display:flex;align-items:center;justify-content:center;gap:27px;margin:18px 0;font-size:11px;color:#536476}.app-audio-controls b{width:41px;height:41px;display:grid;place-items:center;background:#101828;color:white;border-radius:50%;font-size:15px}.app-audio-content>small{font-size:9px;color:#68788a}
.app-floating-cover,.app-incoming-cover{position:absolute;width:87px;box-shadow:9px 14px 18px #153b5027;border-radius:3px;will-change:transform,opacity}.app-float-one{left:1%;top:21%;transform:rotate(-12deg)}.app-float-two{right:0;top:63%;width:78px;transform:rotate(11deg)}.app-incoming-cover{left:3%;top:52%;width:98px;transform:rotate(-9deg);z-index:3;opacity:0}.app-idea-card{position:absolute;right:-10px;top:42%;width:191px;padding:18px;background:#ffffffef;border:1px solid #d2eaf3;border-radius:15px;box-shadow:0 14px 34px #28577518;opacity:0;transform:translateY(10px);z-index:5}.app-idea-card>span{font-size:7px;letter-spacing:1px;display:flex;align-items:center;gap:5px;color:#3c7999}.app-idea-card .icon{width:12px;height:12px}.app-idea-card strong{display:block;font-size:16px;font-weight:600;line-height:1.3;margin:10px 0 15px;letter-spacing:-.3px}.app-idea-card i{display:block;height:4px;width:90%;background:#d7edf6;border-radius:3px;margin-top:7px}.app-idea-card i:nth-last-child(2){width:72%}.app-idea-card i:last-child{width:58%;background:#a5def0}
.app-film-controls{display:flex;align-items:center;justify-content:center;gap:17px;color:#536779;font-size:11px;min-height:34px}.app-film-controls>span:first-child{min-width:120px}.app-film-dots{display:flex;gap:5px}.app-film-dots i{width:4px;height:4px;border-radius:50%;background:#c4dbe4}.app-film-dots i.active{background:#299ad8}.app-film-controls button{display:flex;align-items:center;gap:6px;padding:8px 7px;background:none;font-size:11px;color:#536779;min-height:34px}.app-motion-icon{font-size:12px;min-width:12px}.app-downloads{grid-column:2;grid-row:2;align-self:start}.app-store-row{display:flex;align-items:flex-start;gap:22px;padding:10px 0}.app-store-option{display:flex;align-items:center;flex-direction:column;gap:14px}.app-store-badge{display:block;margin:10px 0;cursor:default}.app-store-badge img{height:44px;width:auto;max-width:none}.app-store-badge[href]{cursor:pointer}.app-availability{font-size:11px;letter-spacing:.3px;color:#627385}.app-tagline{font-size:13px;line-height:1.6;color:#667587;margin-top:20px}
.subscriptions{border-top:1px solid var(--line)}.plans-heading{text-align:center;max-width:740px;margin:0 auto 44px}.plans-heading h2{margin:20px 0}.plans-heading>p{color:#596779;font-size:17px;max-width:540px;margin:auto;line-height:1.75}.sample-pricing-label{font-size:10px;letter-spacing:1.3px;color:#64758a;display:inline-block;margin-top:26px;background:#edf6f8;padding:8px 11px;border-radius:6px}.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:21px;align-items:stretch}.plan-card{display:flex;flex-direction:column;min-width:0;background:#fffdf5;border:1px solid #10182822;border-radius:21px;padding:28px;transition:box-shadow .25s,translate .25s}.plan-card:hover{translate:0 -5px;box-shadow:0 12px 26px #10182808}.plan-card-label{min-height:28px;font-size:9px;letter-spacing:.8px;line-height:1.5;color:#718194;font-weight:500}.plan-featured{border:1.5px solid #299ad8;background:#f4fbfe;box-shadow:0 6px 22px #299ad80a}.plan-featured .plan-card-label{color:#1b759f;font-size:11px;letter-spacing:0;font-weight:600}.plan-card h3{font-size:25px;font-weight:600;letter-spacing:-.6px;margin-top:8px}.plan-description{font-size:13px;color:#667487;line-height:1.6;margin-top:9px;min-height:42px;max-width:240px}.plan-price{display:flex;align-items:baseline;gap:8px;margin:29px 0 23px}.plan-price strong{font-size:51px;letter-spacing:-2.5px;font-weight:600;font-variant-numeric:tabular-nums}.plan-price>span{font-size:12px;color:#667587}.plan-allowance{padding:0 0 23px;border-bottom:1px solid #10182812;line-height:1.6}.plan-allowance strong{display:block;font-size:17px;font-weight:600}.plan-allowance>span{font-size:12px;color:#667487}.plan-features{list-style:none;padding:24px 0 25px;margin:0;display:flex;flex-direction:column;gap:13px;flex:1}.plan-features li{display:flex;align-items:flex-start;gap:9px;font-size:12px;line-height:1.6;color:#46586c}.plan-features .icon{width:14px;height:14px;margin-top:2px;color:#388caf}.plan-choose{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:46px;border-radius:30px;border:1px solid #10182828;background:transparent;color:#101828;padding:13px 17px;font-size:13px;font-weight:600;transition:background .2s,color .2s,scale .2s}.plan-choose>.icon{width:17px;height:17px}.plan-choose:hover{background:#e4f3f8}.plan-choose[aria-pressed=true]{background:#101828;border-color:#101828;color:#fffbec}.plan-choose:active{scale:.98}.plan-featured .plan-choose[aria-pressed=false]{border-color:#299ad870}
.plan-notes{text-align:center;margin:23px auto 36px;max-width:780px}.plan-notes p{font-size:11px;line-height:1.8;color:#697689}.plan-notes p:first-child{color:#536477;margin-bottom:3px}.plan-usage{max-width:850px;margin:0 auto;padding:28px 32px;background:#eaf5f9;border:1px solid #d3e8ee;border-radius:20px}.plan-usage-top{display:flex;justify-content:space-between;align-items:center;gap:20px}.plan-preview-label{font-size:8px;letter-spacing:1.3px;color:#317aa1;font-weight:600}.plan-usage h3{font-size:20px;font-weight:600;letter-spacing:-.5px;margin-top:7px}.plan-usage-top>span{padding:7px 13px;background:white;border:1px solid #cde6ef;border-radius:20px;font-size:11px;color:#367c9f}.plan-usage-details{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:24px}.plan-usage-details>p{font-size:12px;color:#5d6b7d;line-height:1.6}.plan-usage-details strong{font-size:18px;letter-spacing:-.5px;font-weight:600;color:#101828;font-variant-numeric:tabular-nums}.plan-usage-details>span{font-size:11px;color:#4d809b}.plan-progress{margin:13px 0 19px;height:7px;background:#d3e6ee;border-radius:10px;overflow:hidden}.plan-progress>span{display:block;background:#299ad8;width:100%;height:100%;border-radius:10px;transform-origin:left;transform:scaleX(.8)}.plan-usage-bottom p{font-size:12px;color:#465f72}.plan-usage-bottom>span{display:block;margin-top:8px;font-size:10px;line-height:1.65;color:#667d8d}
@media(max-width:1050px){.app-showcase{column-gap:37px;grid-template-columns:1fr 1fr}.app-phone{width:250px}.app-stage{height:600px}.app-floating-cover{width:65px}.app-float-one{left:-2%}.app-float-two{width:63px;right:-1%}.app-idea-card{right:-15px;width:164px;padding:15px}.app-idea-card strong{font-size:14px}.app-intro p{font-size:16px}.app-intro h2{font-size:43px;letter-spacing:-1.6px}.app-store-row{gap:15px}.app-store-badge img{height:40px}.plan-card{padding:23px}.plan-card-label{min-height:33px;font-size:8px}.plan-featured .plan-card-label{font-size:10px}.plan-features li{font-size:11px}}
@media(max-width:760px){.app-showcase{display:flex;flex-direction:column;gap:0}.app-intro{order:0;text-align:center;padding-bottom:27px}.app-intro .eyebrow{font-size:10px;letter-spacing:1.2px}.app-intro h2{font-size:40px;letter-spacing:-1.7px;max-width:480px;margin:18px auto}.app-intro p{font-size:16px;line-height:1.8;max-width:450px}.app-figure{order:1;width:100%;max-width:470px;margin:0 auto}.app-stage{height:610px}.app-phone{width:260px;top:19px}.app-orbit{top:18%}.app-float-one{left:1%;top:22%;width:65px}.app-float-two{right:1%;width:59px;top:69%}.app-incoming-cover{width:83px;left:0}.app-idea-card{right:0;top:47%;width:161px}.app-film-controls{gap:12px;font-size:10px}.app-film-controls button{font-size:10px}.app-downloads{order:2;margin:30px auto 0;text-align:center}.app-store-row{justify-content:center;gap:22px}.app-store-badge img{height:42px}.app-tagline{font-size:12px;margin-top:14px}.plans-heading{margin-bottom:31px}.plans-heading h2{font-size:40px;letter-spacing:-1.6px}.plans-heading>p{font-size:15px;line-height:1.8}.plan-grid{grid-template-columns:1fr;gap:19px;max-width:470px;margin:auto}.plan-card{padding:27px}.plan-card-label{min-height:20px;font-size:9px}.plan-featured .plan-card-label{font-size:11px}.plan-description{min-height:0;max-width:none}.plan-price{margin:23px 0 19px}.plan-features{gap:12px;padding:22px 0}.plan-features li{font-size:13px}.plan-choose{min-height:49px}.plan-notes{margin:23px auto 28px}.plan-notes p{font-size:10px}.plan-usage{padding:23px 20px}.plan-usage h3{font-size:18px}.plan-usage-details{align-items:flex-start;flex-direction:column;gap:5px;margin-top:22px}.plan-usage-details strong{font-size:18px}.plan-usage-details>p{font-size:12px}.plan-usage-bottom p{font-size:12px}.plan-usage-bottom>span{font-size:10px}}
@media(max-width:380px){.app-phone{width:242px}.app-stage{height:569px}.app-idea-card{right:-4px;width:143px;padding:12px}.app-float-one{left:-4px;width:57px}.app-float-two{right:-4px;width:54px}.app-store-row{gap:19px}.app-store-badge img{height:40px}.app-intro h2,.plans-heading h2{font-size:36px}.app-film-dots{gap:4px}.app-film-controls{gap:9px}}
@media(prefers-reduced-motion:reduce){.app-showcase *,.subscriptions *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.plan-card:hover{translate:none}.app-floating-cover,.app-orbit-dot{will-change:auto}.app-phone,.app-screen{will-change:auto}}

.app-library-scroll{position:absolute;left:3.1%;right:3.1%;top:27.1%;bottom:7.5%;overflow:hidden;mask-image:linear-gradient(#000 88%,transparent 100%)}.app-library-scroll img{position:absolute;left:-3.31%;top:-41.44%;width:106.62%;max-width:none;height:152.91%;object-fit:fill;will-change:transform}
