/* Taskly UK — product showcase inspired by the supplied mobile reference, using Taskly branding/content. */
.taskly-product-showcase{background:#f6f4ee;border-top:1px solid #ece8dc;border-bottom:1px solid #ece8dc;padding:82px max(20px,calc((100% - 1220px)/2)) 88px;overflow:hidden}
.ts-intro{max-width:760px;margin:0 auto 44px;text-align:center}
.ts-intro h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(42px,5vw,68px);font-weight:500;line-height:.98;letter-spacing:-2.8px;margin:12px 0 18px;color:#1a2136}
.ts-intro h2 em{font-style:normal;color:#6573c7;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.ts-intro p{max-width:670px;margin:auto;color:#6c7280;font-size:16px;line-height:1.65}
.ts-feature-stage{display:grid;grid-template-columns:minmax(360px,.92fr) minmax(420px,1.08fr);align-items:center;gap:72px;max-width:1080px;margin:auto}
.ts-feature-visual{position:relative;min-height:590px;display:flex;align-items:center;justify-content:center}
.ts-phone{width:min(370px,78vw);min-height:565px;border-radius:34px;background:#fff;border:8px solid #202536;box-shadow:0 30px 80px rgba(22,28,48,.18);overflow:hidden;position:relative;transform:rotate(-1deg)}
.ts-phone-bar{height:28px;background:#202536;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 14px;font-size:9px}
.ts-appbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid #eceef2;background:#fff}
.ts-brand-mini{display:flex;align-items:center;gap:7px;color:#18213b;font-size:14px}
.ts-brand-mini img{width:26px;height:26px;border-radius:8px}
.ts-brand-mini i{font-style:normal;color:#a47a2e}
.ts-appbar>span{font-size:16px;color:#687083}
.ts-visual-copy{margin:14px 14px 0;padding:14px 15px;border-radius:14px;background:#f5f2e8;display:grid;gap:4px}
.ts-visual-copy b{font-size:10px;letter-spacing:1.1px;color:#ae8a4c}
.ts-visual-copy span{font-size:12px;color:#596273}
.ts-screen{margin:12px 14px 18px;border:1px solid #e4e6ec;border-radius:17px;padding:15px;background:#fff;min-height:370px;box-shadow:0 10px 28px rgba(20,29,53,.07)}
.ts-screen-in{animation:tsScreenIn .45s ease both}
@keyframes tsScreenIn{from{opacity:.2;transform:translateY(13px) scale(.98)}to{opacity:1;transform:none}}
.ts-window-head{display:flex;align-items:center;gap:8px;padding-bottom:13px;border-bottom:1px solid #eef0f4;font-size:12px;color:#1b233a}
.ts-dot{width:8px;height:8px;border-radius:50%;background:#d9b45e}.ts-menu{margin-left:auto;color:#7a8291}.ts-count,.ts-verified{margin-left:auto;background:#edf1ff;color:#5665b8;border-radius:99px;padding:4px 8px;font-size:10px}.ts-job-hero{background:#f3ead7;border-radius:14px;padding:17px;margin:15px 0}.ts-mini-label{display:block;color:#9a731f;font-size:9px;font-weight:800;letter-spacing:1px}.ts-job-hero h4{font-size:22px;margin:8px 0 4px}.ts-job-hero p{margin:0;color:#6c7280;font-size:11px}.ts-job-hero strong{display:block;font-size:22px;margin-top:14px}
.ts-row,.ts-pay-line{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #eef0f4;color:#687083;font-size:11px}.ts-row b,.ts-pay-line b{color:#20283d}
.ts-primary{width:100%;border:0;border-radius:12px;padding:12px;background:#20263a;color:#fff;font-weight:800;margin-top:16px;font-size:12px}
.ts-offer{display:grid;grid-template-columns:35px 1fr auto;gap:9px;align-items:center;border:1px solid #eceef3;border-radius:13px;padding:10px;margin-top:9px}.ts-offer.selected{border-color:#d9b45e;background:#fffaf0}.ts-avatar,.ts-big-avatar{display:grid;place-items:center;border-radius:50%;background:#e9edf5;color:#293452;font-weight:800}.ts-avatar{width:35px;height:35px}.ts-offer small{display:block;color:#7c8493;font-size:9px;margin-top:3px}.ts-offer>strong{font-size:15px}.ts-profile{display:flex;gap:11px;align-items:center;margin:16px 0}.ts-big-avatar{width:52px;height:52px;font-size:18px}.ts-profile h4{margin:0;font-size:15px}.ts-profile p{margin:3px 0;color:#727a89;font-size:10px}.ts-profile span{color:#d19b22;font-size:10px}.ts-pills{display:flex;gap:6px;flex-wrap:wrap}.ts-pills span{background:#eef7f1;color:#23805a;border-radius:99px;padding:6px 8px;font-size:9px;font-weight:800}.ts-review{background:#f6f7f9;border-radius:12px;padding:12px;margin-top:15px;color:#5f6777;font-size:10px;line-height:1.5}.ts-payment-card{background:linear-gradient(135deg,#20263a,#35405e);color:#fff;border-radius:15px;padding:20px;margin:16px 0}.ts-payment-card span{font-size:9px;opacity:.75}.ts-payment-card strong{display:block;font-size:29px;margin:12px 0 4px}.ts-payment-card small{font-size:10px;opacity:.8}.ts-green{color:#21845d!important}.ts-lock{margin-left:auto;color:#2b9b70}.ts-progress{display:flex;align-items:center;margin:28px 4px 20px}.ts-progress span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#eef0f5;color:#7a8290;font-size:10px;font-weight:800}.ts-progress span.done,.ts-progress span.active{background:#d9b45e;color:#20263a}.ts-progress i{height:2px;background:#d9dce4;flex:1}.ts-status{padding:15px;background:#f5f2e8;border-radius:14px}.ts-status strong,.ts-status small{display:block}.ts-status small{color:#71798a;font-size:10px;margin-top:5px}.ts-chat{display:grid;gap:6px;margin-top:13px}.ts-chat span{font-size:10px;padding:9px 11px;border-radius:10px;background:#f6f7f9;color:#5f6777}.ts-chat span:last-child{background:#edf1ff;color:#5362b5;text-align:right}
.ts-demo{position:absolute;bottom:15px;right:calc(50% - 182px);border:1px solid #292d3b;background:#1f2536;color:#fff;border-radius:99px;padding:10px 15px;font-size:10px;font-weight:800;box-shadow:0 8px 22px rgba(18,24,42,.2)}
.ts-feature-copy{max-width:520px}
.ts-slide-count{font-size:12px;color:#858b98;margin-bottom:22px}.ts-slide-count span{color:#1e2740;font-weight:800}
.ts-feature-copy h3{font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,4.2vw,58px);font-weight:500;line-height:1.02;letter-spacing:-2px;margin:10px 0 17px;color:#1a2136}
.ts-feature-copy p{color:#687083;line-height:1.65;font-size:16px;max-width:490px}
.ts-feature-actions{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}.ts-feature-actions .goldbtn,.ts-feature-actions .ghostbtn{border-radius:13px}
.ts-dots{display:flex;gap:7px;margin-top:30px}.ts-dots button{width:28px;height:4px;border:0;border-radius:99px;background:#d5d7de;padding:0}.ts-dots button.active{background:#20263a;width:46px}
.ts-demo-list{display:grid;gap:9px;margin:22px 0}.ts-demo-list>div{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:13px;border:1px solid #e7e9ef;border-radius:13px}.ts-demo-list>div>span{font-weight:800;color:#ae8a4c}.ts-demo-list b,.ts-demo-list strong,.ts-demo-list small{display:block}.ts-demo-list b{font-size:10px;color:#ae8a4c;letter-spacing:1px}.ts-demo-list strong{margin:3px 0}.ts-demo-list small{color:#707887;line-height:1.4;font-size:11px}
.ts-feature-list{display:grid;gap:9px;margin:22px 0}.ts-feature-list article{display:grid;grid-template-columns:35px 1fr;gap:12px;padding:14px;border:1px solid #e7e9ef;border-radius:13px}.ts-feature-list article>span{font-weight:800;color:#ae8a4c}.ts-feature-list b{display:block}.ts-feature-list p{margin:4px 0 0;color:#707887;font-size:12px;line-height:1.45}
.growth-modal{position:fixed;inset:0;background:rgba(10,13,24,.55);z-index:9999;display:grid;place-items:center;padding:20px}.growth-modal[hidden]{display:none}.growth-modal-card{position:relative;width:min(780px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:26px;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.growth-modal-close{position:absolute;right:18px;top:14px;border:0;background:transparent;font-size:30px;cursor:pointer}.growth-modal-head{padding-right:30px}.growth-modal-head h2{font-size:30px;margin:8px 0}.growth-modal-head p{color:#697181;line-height:1.5}.growth-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:24px}.growth-plan{border:1px solid #e2e5eb;border-radius:20px;padding:22px}.growth-plan.active{border-color:#c6a344;background:#fffdf5}.growth-plan-badge{font-size:11px;font-weight:800;letter-spacing:.08em;color:#9a7319}.growth-plan h3{font-size:22px;margin:8px 0}.growth-price{font-size:30px;font-weight:800}.growth-price small{font-size:13px;color:#777;font-weight:500}.growth-plan p{color:#687083;min-height:40px}.growth-plan ul{list-style:none;padding:0;margin:16px 0 22px;color:#4f5665;line-height:2}.growth-sub-status{margin-top:18px;padding:14px;border-radius:14px;background:#f6f7f9;color:#5f6675;font-size:13px}.taskly-growth-account-card{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:0 0 20px;padding:22px;border:1px solid #e3e5eb;border-radius:20px;background:linear-gradient(135deg,#fffdf5,#fff)}.taskly-growth-account-card h3{margin:5px 0}.taskly-growth-account-card p{margin:5px 0 0;color:#697181}.taskly-growth-account-actions{flex:0 0 auto}
@media(max-width:900px){.taskly-product-showcase{padding:65px 20px 70px}.ts-intro{text-align:left;margin-bottom:34px}.ts-feature-stage{grid-template-columns:1fr;gap:38px}.ts-feature-visual{min-height:610px}.ts-feature-copy{max-width:620px}.ts-feature-copy h3{font-size:44px}.ts-phone{width:min(360px,82vw)}.ts-demo{right:calc(50% - 175px)}}
@media(max-width:600px){.taskly-product-showcase{padding:54px 16px 60px}.ts-intro h2{font-size:42px;letter-spacing:-1.8px}.ts-intro p{font-size:14px}.ts-feature-visual{min-height:575px}.ts-phone{width:300px;min-height:525px;border-width:6px;border-radius:28px}.ts-phone-bar{height:24px}.ts-appbar{height:52px}.ts-screen{min-height:335px;padding:12px}.ts-job-hero h4{font-size:19px}.ts-demo{bottom:8px;right:calc(50% - 142px);padding:9px 12px;font-size:9px}.ts-feature-copy h3{font-size:39px}.ts-feature-copy p{font-size:14px}.ts-feature-actions{display:grid}.ts-feature-actions button{width:100%}.growth-plan-grid{grid-template-columns:1fr}.growth-modal-card{padding:24px 18px}.taskly-growth-account-card{display:block}.taskly-growth-account-actions{margin-top:14px}}