.screen-showcase{padding:128px 5vw;background:#f4f7f8;overflow:hidden}.showcase-heading{max-width:1180px;margin:0 auto 72px;display:flex;justify-content:space-between;align-items:end;gap:48px}.showcase-heading h2{margin:12px 0 0;color:#082b49;font-size:clamp(2.5rem,5vw,5rem);line-height:.98;letter-spacing:-.055em}.showcase-heading h2 em{color:#ec5d48;font-style:normal}.showcase-heading>p{max-width:430px;margin:0;color:#567590;font-size:1.08rem;line-height:1.7}.screen-feature{position:relative;max-width:1180px;min-height:700px;margin:0 auto 70px;padding:72px;display:grid;grid-template-columns:minmax(0,.86fr) minmax(360px,1.14fr);gap:72px;align-items:center;border-radius:48px;background:#fff;box-shadow:0 22px 70px rgba(8,43,73,.08);overflow:hidden}.screen-feature:last-child{margin-bottom:0}.screen-feature:before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;filter:blur(4px);opacity:.62}.outlook-feature:before{right:-130px;top:-160px;background:#d4f2ef}.guide-feature:before{left:-160px;bottom:-170px;background:#ffebcf}.insight-feature:before{right:-130px;bottom:-170px;background:#d9eef8}.screen-story{position:relative;z-index:2}.feature-index{display:inline-grid;width:54px;height:54px;place-items:center;margin-bottom:34px;border:1px solid #d8e4e9;border-radius:50%;color:#57758f;font-size:.8rem;letter-spacing:.14em}.screen-story h3{max-width:500px;margin:10px 0 22px;color:#082b49;font-size:clamp(2.25rem,4vw,4.1rem);line-height:1.02;letter-spacing:-.05em}.screen-story>p:not(.eyebrow){max-width:520px;color:#57758f;font-size:1.05rem;line-height:1.7}.screen-story ul{margin:30px 0 0;padding:0;list-style:none}.screen-story li{position:relative;margin:14px 0;padding-left:27px;color:#173b59;font-weight:700}.screen-story li:before{content:"✓";position:absolute;left:0;color:#1e9a7a}.screen-device{position:relative;z-index:2;display:flex;justify-content:center;align-self:end;height:680px;overflow:hidden}.guide-feature{grid-template-columns:minmax(360px,1.14fr) minmax(0,.86fr);background:linear-gradient(145deg,#fff 65%,#fff8ed)}.guide-feature .screen-device{align-self:center}.insight-feature{background:linear-gradient(145deg,#fff 62%,#edf9f8)}
.mock-phone{position:relative;width:min(100%,410px);height:790px;padding:10px;border-radius:52px;background:#082b49;box-shadow:0 28px 50px rgba(8,43,73,.23);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.mock-island{position:absolute;z-index:5;top:20px;left:50%;width:104px;height:25px;transform:translateX(-50%);border-radius:20px;background:#082b49}.mock-screen{height:100%;padding:54px 23px 28px;border-radius:42px;background:#f7f9fa;color:#082b49;overflow:hidden}.mock-screen small{letter-spacing:.11em}.mock-app-header{display:flex;align-items:center;justify-content:space-between}.mock-app-header>div{display:flex;flex-direction:column;gap:5px}.mock-app-header small{color:#57758f;font-size:.57rem}.mock-app-header strong{font-size:1.7rem;line-height:1}.mock-app-header button,.guide-header button,.insight-header button{border:0;background:#fff;color:#082b49}.mock-app-header button{width:39px;height:39px;border-radius:50%;font-size:1rem}.mock-tabs{margin-top:25px;padding:5px;display:grid;grid-template-columns:1fr 1fr;border-radius:16px;background:#e4ecef;color:#57758f;text-align:center}.mock-tabs>*{padding:10px;border-radius:12px;font-size:.82rem}.mock-tabs b{background:#fff;color:#082b49}.best-window{margin-top:20px;padding:24px 20px;border-radius:22px;background:linear-gradient(120deg,#c5edf6,#fff0d1)}.best-window small{font-size:.56rem}.best-window strong{display:block;margin:9px 0;font-size:2rem;font-weight:500}.best-window p{margin:0;color:#57758f;font-size:.7rem;line-height:1.45}.best-window p b{color:#082b49}.hour-strip{margin:18px -5px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.hour-strip>div{padding:14px 4px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;border:1px solid #dce6ea;border-radius:17px;background:#fff}.hour-strip .selected{border-color:#082b49;background:#082b49;color:#fff}.hour-strip small{font-size:.52rem;font-weight:800}.hour-strip b{font-size:1.35rem}.hour-strip em{color:#ec5d48;font-size:.7rem;font-style:normal}.hour-strip span{color:#57758f;font-size:.52rem}.selected-hour-card{margin-top:18px;padding:19px;border-radius:22px;background:#fff;box-shadow:0 9px 25px rgba(8,43,73,.06)}.selected-hour-title{display:flex;justify-content:space-between;padding-bottom:13px;border-bottom:1px solid #e3ebee}.selected-hour-title span{display:flex;flex-direction:column;gap:4px}.selected-hour-title small{font-size:.52rem;color:#57758f}.selected-hour-title span b{font-size:1rem}.selected-hour-title>strong{color:#ec5d48;font-size:1.5rem}.selected-hour-title>strong small{font-size:.47rem}.metric-grid{margin-top:13px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.metric-grid>div{padding:11px;border-radius:12px;background:#f0f5f6}.metric-grid small,.metric-grid b{display:block}.metric-grid small{margin-bottom:4px;color:#57758f;font-size:.47rem;letter-spacing:0}.metric-grid b{font-size:.7rem}.mock-tip{margin-top:14px;padding:12px 14px;display:flex;gap:10px;border-radius:16px;background:#e3f3f9}.mock-tip span{font-size:1rem}.mock-tip p{margin:0;color:#57758f;font-size:.6rem;line-height:1.45}.mock-tip b{color:#082b49}
.guide-header,.insight-header{display:flex;align-items:center;justify-content:center;position:relative}.guide-header button,.insight-header button{position:absolute;left:0;width:38px;height:38px;border-radius:50%;font-size:2rem;line-height:.8}.guide-header>b,.insight-header>b{font-size:1rem}.condition-line{margin:25px auto 0;display:flex;align-items:center;justify-content:center;gap:10px;font-size:.7rem}.condition-line b{padding:8px 12px;border-radius:30px;background:#ffeddc;color:#dd5b40}.guide-intro{margin:30px 0 17px;text-align:center}.guide-intro>small{color:#57758f;font-size:.57rem}.guide-intro h4{margin:13px 0 5px;font-size:2rem;font-weight:500;letter-spacing:-.04em}.guide-intro p{margin:0;color:#57758f;font-size:.67rem}.pace-guide-list{border-radius:21px;background:#fff;overflow:hidden}.pace-row{min-height:82px;padding:13px 11px;display:grid;grid-template-columns:28px 1.2fr .95fr auto;gap:8px;align-items:center;border-bottom:1px solid #e1eaed}.pace-row:last-child{border-bottom:0}.pace-num{display:grid;width:27px;height:27px;place-items:center;border-radius:50%;background:#e1f2f8;font-size:.66rem}.pace-name,.pace-values{display:flex;flex-direction:column}.pace-name b{font-size:.73rem}.pace-name small{margin-top:4px;color:#57758f;font-size:.52rem;letter-spacing:0}.pace-values small{color:#57758f;font-size:.43rem}.pace-values b,.pace-values em{font-size:.78rem;font-style:normal}.pace-values em{color:#ec5d48;font-weight:800}.pace-row>i{padding:7px 8px;border-radius:30px;background:#fff0dc;font-size:.56rem;font-style:normal;white-space:nowrap}
.screen-detail-stack{margin-top:30px;display:grid;gap:15px}.mini-effort-panel,.mini-pace-panel{padding:19px;border:1px solid #e2eaed;border-radius:22px;background:#fff;box-shadow:0 12px 30px rgba(8,43,73,.07)}.mini-effort-panel>small,.mini-pace-panel>small{color:#57758f;font-size:.53rem}.mini-effort-panel header{margin:5px 0 13px;display:flex;justify-content:space-between;align-items:center}.mini-effort-panel header b{font-size:1.05rem}.mini-effort-panel header span{color:#168fe4;font-size:.65rem;font-weight:800}.mini-effort-panel>div{display:flex;gap:5px}.mini-effort-panel>div>*{padding:7px 9px;border:1px solid #dbe5e9;border-radius:20px;color:#57758f;font-size:.55rem;font-weight:500}.mini-effort-panel>div b{border-color:#082b49;background:#082b49;color:#fff}.mini-pace-panel header{margin:7px 0 12px;display:flex;justify-content:space-between;gap:10px;align-items:center}.mini-pace-panel header b{font-size:1.1rem;line-height:1.05}.mini-pace-panel header span{display:grid;min-width:36px;height:36px;place-items:center;border-radius:50%;background:#ffe7c7;font-size:.65rem}.mini-pace-compare{padding:11px 0;display:grid;grid-template-columns:1fr auto 1fr;gap:9px;align-items:center;border-top:1px solid #e2eaed}.mini-pace-compare>span{display:flex;flex-direction:column}.mini-pace-compare small{color:#57758f;font-size:.49rem;letter-spacing:0}.mini-pace-compare b{font-size:.88rem}.mini-pace-compare span:last-child b,.mini-pace-compare>i{color:#ec5d48}.mini-pace-compare em{font-size:.55rem;font-style:normal}.mini-pace-panel footer{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-pace-panel footer span{padding:9px;border-radius:11px;background:#f0f5f6;color:#57758f;font-size:.5rem}.mini-pace-panel footer b{display:block;margin-top:3px;color:#082b49;font-size:.66rem}
.insight-screen{background:linear-gradient(#d8f3f8 0%,#fff3de 61%,#f7f9fa 100%)}.sync-mark{display:grid;width:54px;height:54px;margin:22px auto 15px;place-items:center;border-radius:50%;background:#d8f5e9;color:#1e9275;font-size:1.8rem}.insight-summary{text-align:center}.insight-summary>small{color:#57758f;font-size:.54rem}.insight-summary h4{margin:10px 0 5px;font-size:1.65rem;font-weight:500;line-height:1.15;letter-spacing:-.035em}.insight-summary h4 em{color:#ec5d48;font-style:normal}.insight-summary p{margin:0;color:#57758f;font-size:.65rem}.pace-result{margin-top:17px;padding:17px;display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;border-radius:19px;background:#fff;text-align:center}.pace-result>span{display:flex;flex-direction:column;gap:5px}.pace-result small{color:#57758f;font-size:.45rem}.pace-result b{font-size:1.25rem}.pace-result em{font-size:.55rem;font-style:normal}.pace-result>i{color:#ec5d48;font-size:1.25rem;font-style:normal}.run-conditions,.comparison-controls{margin-top:16px;padding:17px;border-radius:20px;background:#fff}.run-conditions>header,.comparison-controls>header{padding-bottom:11px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e1eaed}.run-conditions header span,.comparison-controls header span{display:flex;flex-direction:column;gap:4px}.run-conditions header small,.comparison-controls header small{color:#57758f;font-size:.45rem}.run-conditions header b,.comparison-controls header b{font-size:.72rem}.run-conditions header em,.comparison-controls header em{padding:7px 9px;border-radius:20px;background:#fff0c8;color:#9b6f0b;font-size:.52rem;font-style:normal}.condition-table>div{padding:8px 2px;display:grid;grid-template-columns:1.5fr repeat(3,.55fr);gap:4px;border-bottom:1px solid #e6ecef;font-size:.61rem}.condition-table>div:last-child{border-bottom:0}.condition-table .table-head{padding:9px 2px 4px}.condition-table .table-head small{color:#57758f;font-size:.4rem;text-align:right}.condition-table div span{color:#57758f}.condition-table div b{text-align:right}.comparison-controls label{margin-top:12px;display:block}.comparison-controls label>span{display:flex;justify-content:space-between;color:#57758f;font-size:.58rem}.comparison-controls label>span b{color:#082b49}.comparison-controls label>i{position:relative;display:block;height:3px;margin-top:9px;border-radius:4px;background:#b6c4ca}.comparison-controls label>i:before{content:"";position:absolute;left:0;top:0;width:var(--value);height:3px;background:#ec5d48}.comparison-controls label>i:after{content:"";position:absolute;left:var(--value);top:50%;width:13px;height:13px;transform:translate(-50%,-50%);border-radius:50%;background:#ec5d48}
@media(max-width:900px){.screen-showcase{padding:90px 20px}.showcase-heading{display:block;margin-bottom:48px}.showcase-heading>p{margin-top:25px}.screen-feature,.guide-feature{min-height:auto;padding:44px 28px;grid-template-columns:1fr;gap:42px;border-radius:34px}.guide-feature .screen-device{order:2}.screen-device{height:650px}.screen-story h3{font-size:2.6rem}.mock-phone{width:390px}.screen-detail-stack{max-width:500px}.screen-feature:before{display:none}}@media(max-width:480px){.screen-showcase{padding-left:14px;padding-right:14px}.screen-feature{padding:36px 14px}.screen-story{padding:0 8px}.screen-device{height:610px}.mock-phone{width:330px;height:720px;border-radius:44px}.mock-screen{padding:49px 17px 24px;border-radius:35px}.hour-strip>div:nth-child(4){display:none}.hour-strip{grid-template-columns:repeat(3,1fr)}.pace-row{grid-template-columns:25px 1.15fr .9fr}.pace-row>i{display:none}.pace-name b{font-size:.67rem}.pace-values b,.pace-values em{font-size:.7rem}.mini-effort-panel>div span:last-child{display:none}.mini-pace-panel header b{font-size:.95rem}}
