/* Portfolio and case-study components share one responsive visual system. */
.ls-portfolio-page,.ls-case-page{background:#fff;--ls-paper:#fff}
.ls-portfolio-page #main,.ls-case-page #main{max-width:100%;overflow:clip}
.ls-portfolio-page .ls-section,.ls-case-page .ls-section{max-width:1600px;padding-inline:clamp(20px,4vw,64px)}
.ls-portfolio-page .ls-kicker,.ls-case-page .ls-kicker{font-size:12px!important}
.ls-portfolio-intro{padding-top:140px;padding-bottom:30px}
.ls-portfolio-intro>div{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end}
.ls-portfolio-intro h1{font-size:clamp(44px,5.1vw,78px);margin:0;line-height:1.05}
.ls-portfolio-intro>div>p{font-size:18px;max-width:40ch;margin-bottom:4px;line-height:1.75}
.ls-portfolio-work{padding-top:24px;padding-bottom:38px}
.ls-portfolio-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:26px}
.ls-portfolio-filters{display:flex;gap:8px;flex-wrap:wrap}
.ls-portfolio-filters button{border:1px solid #dce1ed;border-radius:99px;min-height:44px;padding:10px 22px;background:#fff;color:#464c5b;font-size:15px;font-weight:600;transition:background .2s,color .2s,border-color .2s,transform .2s}
.ls-portfolio-filters button[aria-pressed=true]{background:#315cff;color:#fff;border-color:#315cff}
.ls-portfolio-filters button:hover{border-color:#315cff;transform:translateY(-2px)}
.ls-portfolio-filters button:active{transform:scale(.97)}
.ls-portfolio-toolbar>[data-portfolio-count]{font:12px 'DM Mono',monospace;letter-spacing:.07em;color:#5c6271;margin:0;white-space:nowrap}
.ls-project-featured{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.25fr);gap:24px;align-items:center;padding:clamp(28px,4vw,56px);border:1px solid #233257;border-radius:28px;background:radial-gradient(ellipse at 82% 70%,#21377c 0,transparent 62%),#0d1427;color:#fff;isolation:isolate}
.ls-featured-copy .ls-kicker{color:#a6b9ff!important;font-size:11px!important;letter-spacing:.08em}
.ls-featured-copy :is(h2,h3){font-size:clamp(36px,4vw,58px);margin:0 0 20px}
.ls-featured-copy>p:not(.ls-kicker){font-size:17px;line-height:1.75;color:#d7dfef;max-width:42ch}
.ls-featured-copy ul{padding:0;list-style:none;margin:24px 0 30px;display:grid;gap:11px}
.ls-featured-copy li{font-size:14px;line-height:1.65;color:#d7dfef;padding-left:22px;position:relative}
.ls-featured-copy li::before{content:'✓';color:#89a6ff;position:absolute;left:0}
.ls-featured-copy .ls-action{background:#fff;color:#111a31!important;border-color:#fff}
.ls-featured-copy .ls-action:hover{background:#315cff;border-color:#315cff;color:#fff!important}
.ls-featured-visual{display:block;min-width:0;padding:10px 0}
.ls-mockup-caption{display:block;text-align:center;color:#adbbd9;font:10px/1.6 'DM Mono',monospace;letter-spacing:.08em;margin-top:20px}
.ls-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px;margin-top:36px}
.ls-project-card{display:flex;flex-direction:column;min-width:0;border:1px solid #e0e5ef;border-radius:20px;background:#fff;transition:border-color .25s;overflow:hidden}
.ls-project-card>.ls-project-main{display:flex;flex-direction:column;flex:1;color:#101112!important}
.ls-project-card:hover{border-color:#a2b4ff}
.ls-project-art{aspect-ratio:16/10;position:relative;display:block;background:#f5f7fc;overflow:hidden}
.ls-project-art>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .5s cubic-bezier(.2,.65,.3,1)}
@media(hover:hover) and (pointer:fine){.ls-project-card:hover .ls-project-art>img{transform:scale(1.035)}}
.ls-project-card>a:focus-visible .ls-project-art>img{transform:scale(1.035)}
.ls-project-copy{display:flex;flex-direction:column;flex:1;padding:25px 24px 24px}
.ls-project-tags{display:flex;align-items:center;flex-wrap:wrap;gap:7px 12px;margin-bottom:15px;color:#536078;font:10px/1.5 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.03em}
.ls-project-tags>span:first-child{color:#315cff;background:#edf1ff;border-radius:5px;padding:4px 7px}
.ls-project-copy h3{font-size:clamp(22px,2vw,29px);line-height:1.15;margin:0 0 12px;letter-spacing:-.04em}
.ls-project-copy>p{font-size:16px;line-height:1.65;margin:0;color:#515868}
.ls-project-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 14px;margin:0 24px;padding:10px 0 14px;border-top:1px solid #e8ebf2}
.ls-project-actions a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;font-weight:600;color:#315cff!important;transition:color .2s,transform .2s}
.ls-project-actions a:hover{text-decoration:underline;text-underline-offset:5px}
.ls-project-actions a:active{transform:translateY(1px)}
.ls-project-actions a:focus-visible,.ls-featured-actions .ls-project-external:focus-visible{outline:2px solid #315cff;outline-offset:4px;border-radius:4px}
.ls-featured-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px}
.ls-featured-actions .ls-project-external{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#d7dfef!important;font-size:15px;font-weight:600}
.ls-featured-actions .ls-project-external:hover{color:#fff!important;text-decoration:underline;text-underline-offset:5px}
.ls-project-cta{display:flex;justify-content:space-between;gap:40px;align-items:center;margin-top:25px;padding-block:55px 65px;border-top:1px solid #e3e8f1}
.ls-project-cta h2{font-size:clamp(34px,4vw,58px);margin-bottom:18px}
.ls-project-cta p:not(.ls-kicker){font-size:17px;max-width:47ch;margin:0}
.ls-project-cta>.ls-action{flex:none;background:#315cff;border-color:#315cff}
/* Device mockups: intentionally separate from the supplied screen captures. */
.ls-device-scene{position:relative;aspect-ratio:1.55;max-width:100%;isolation:isolate}
.ls-device-laptop{position:absolute;left:2%;top:12%;width:89%;filter:drop-shadow(0 24px 18px #0003)}
.ls-device-display{position:relative;padding:2.2% 1.4% 1.6%;background:linear-gradient(140deg,#373e4e,#0c0e13 45%,#252a36);border:1px solid #657088;border-radius:13px 13px 5px 5px;margin-inline:5%}
.ls-device-camera{position:absolute;top:1.25%;left:50%;height:3px;width:3px;border-radius:50%;background:#626a7f}
.ls-device-screen{aspect-ratio:1.74;background:#fff;overflow:hidden;border-radius:3px}
.ls-device-screen>img{width:100%;height:100%;display:block;object-fit:cover;object-position:top}
.ls-device-base{position:relative;height:10px;background:linear-gradient(#dae0ed,#9aa4b6 48%,#4d5567);border-radius:2px 2px 70% 70%;box-shadow:0 2px 1px #0005}
.ls-device-base::before{content:'';position:absolute;width:15%;height:4px;left:42.5%;top:0;background:#7e899d;border-radius:0 0 6px 6px}
.ls-device-phone{position:absolute;right:0;bottom:3%;width:24%;height:74%;border:3px solid #323946;border-radius:clamp(12px,2vw,26px);background:#11151d;box-shadow:6px 16px 24px #0003;padding:4px;overflow:hidden}
.ls-phone-page{background:#fff;width:100%;height:100%;border-radius:clamp(8px,1.5vw,20px);overflow:hidden}
.ls-phone-page>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
@media(min-width:1600px){.ls-project-cta{border-top:0}}
@media(max-width:1050px){.ls-portfolio-intro>div{gap:32px}.ls-project-featured{grid-template-columns:1fr 1.1fr;padding:32px;gap:15px}.ls-featured-copy li{font-size:13px}.ls-project-grid{gap:22px 18px}.ls-project-copy{padding:20px 18px}}
@media(max-width:850px){.ls-portfolio-intro{padding-top:112px}.ls-portfolio-intro>div{grid-template-columns:1fr;gap:22px}.ls-portfolio-intro>div>p{max-width:60ch}.ls-project-featured{grid-template-columns:1fr;padding:32px}.ls-featured-copy ul{display:none}.ls-featured-copy>p:not(.ls-kicker){max-width:60ch}.ls-featured-visual{max-width:680px;width:100%;margin:auto}.ls-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ls-device-scene{aspect-ratio:1.8}.ls-device-laptop{top:2%}.ls-device-phone{height:88%}.ls-project-cta{align-items:start;flex-direction:column;gap:25px}}
@media(max-width:560px){.ls-portfolio-intro{padding-top:103px;padding-bottom:22px}.ls-portfolio-intro h1{font-size:clamp(36px,9vw,49px)}.ls-portfolio-intro>div>p{font-size:16px}.ls-portfolio-work{padding-top:10px}.ls-portfolio-toolbar{align-items:start;flex-direction:column;gap:15px;margin-bottom:20px}.ls-portfolio-filters{gap:6px}.ls-portfolio-filters button{padding:9px 13px;font-size:13px}.ls-portfolio-toolbar>[data-portfolio-count]{font-size:11px}.ls-project-featured{padding:27px 22px 22px;border-radius:22px;gap:20px}.ls-featured-copy :is(h2,h3){font-size:38px;margin-bottom:14px}.ls-featured-copy>p:not(.ls-kicker){font-size:16px}.ls-featured-copy .ls-action{font-size:14px;min-height:48px}.ls-mockup-caption{font-size:8px;margin-top:12px}.ls-device-display{border-radius:7px 7px 3px 3px}.ls-device-base{height:6px}.ls-device-base::before{height:2px}.ls-device-phone{border-width:2px;padding:2px}.ls-project-grid{grid-template-columns:1fr;margin-top:24px;gap:22px}.ls-project-copy{padding:22px}.ls-project-copy h3{font-size:27px}.ls-project-copy>p{font-size:16px}.ls-project-cta{padding-block:35px 42px;margin-top:10px}}
@media(prefers-reduced-motion:reduce){.ls-project-card,.ls-featured-visual,.ls-project-art>img,.ls-portfolio-filters button{transform:none!important;transition:none!important}}
