:root{--navy:#08090d;--ink:#071226;--cyan:#10c8ee;--purple:#7137f2;--white:#f7f8fb;--muted:#b8c4d7;--line:rgba(255,255,255,.16);--max:900px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--white);font:16px/1.7 Manrope,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--cyan)}
.shell{width:min(var(--max),calc(100% - 44px));margin:auto}
.top{padding:28px 0;border-bottom:1px solid var(--line)}
.back{font:800 .75rem/1.2 "DM Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.content{padding:80px 0 100px}
.kicker,.updated{font:500 .72rem/1.4 "DM Mono",ui-monospace,monospace;color:var(--cyan);letter-spacing:.12em;text-transform:uppercase}
h1{font-size:clamp(3rem,6.6vw,6rem);line-height:.98;letter-spacing:-.065em;margin:20px 0 22px;max-width:850px}
h2{margin:48px 0 10px;font-size:clamp(1.5rem,3vw,2.25rem);line-height:1.05;letter-spacing:-.04em}
p{color:var(--muted);max-width:760px}
.lede{font-size:clamp(1.08rem,2vw,1.35rem);line-height:1.65}
.byline{font:500 .76rem/1.5 "DM Mono",ui-monospace,monospace;color:var(--cyan);letter-spacing:.04em}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:32px}
.card{padding:26px;background:#11131a;border:1px solid var(--line)}
.card h2{margin:0 0 12px;font-size:1.45rem}
.card p{margin:0}
.contact-list{display:grid;gap:12px;margin:30px 0;padding:0;list-style:none}
.contact-list a{display:inline-block;padding-bottom:5px;border-bottom:1px solid rgba(16,200,238,.45);font:700 .82rem/1.4 "DM Mono",ui-monospace,monospace;letter-spacing:.05em;text-decoration:none}
a.button,.button{display:inline-block;margin-top:20px;padding:16px 20px;background:var(--cyan);color:var(--ink)!important;font:800 .76rem/1.2 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none!important}
a.button:hover,.button:hover{background:var(--purple);color:var(--white)!important;text-decoration:none!important}
.provider{border-top:1px solid var(--line);padding:22px 0}
.provider h2{margin:0 0 8px;font-size:1.35rem}
.provider p{margin:0}
.answer-list{margin:0;padding-left:1.2rem;color:var(--muted);max-width:760px}
.answer-list li{margin:.6rem 0}
.card h3{margin:0 0 12px;font-size:1.35rem;line-height:1.1}
.card a:not(.button){color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
.answer-index{margin-top:28px}
.answer-entry{border-top:1px solid var(--line);padding:28px 0 30px;max-width:800px}
.answer-entry:last-child{border-bottom:1px solid var(--line)}
.answer-entry h2{margin:8px 0 12px;font-size:clamp(1.65rem,3.4vw,2.65rem);line-height:1.02}
.answer-entry p{margin:0 0 16px}
.answer-number{font:500 .7rem/1.3 "DM Mono",ui-monospace,monospace;color:var(--cyan);letter-spacing:.12em;text-transform:uppercase}
.read-link{font:800 .74rem/1.3 Manrope,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px}
.answer-lead{font-size:clamp(1.12rem,2.1vw,1.45rem);line-height:1.6;color:var(--white);max-width:780px}
.article-body{max-width:780px}
.article-body h2{margin-top:58px}
.article-body h3{margin:30px 0 8px;font-size:1.2rem;line-height:1.15}
.article-body ul,.article-body ol{max-width:760px;padding-left:1.35rem;color:var(--muted)}
.article-body li{margin:.65rem 0}
.source-list{border-top:1px solid var(--line);margin:48px 0 0;padding:24px 0 0;list-style:none}
.source-list li{margin:.65rem 0}
.source-list a:not(.button){color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
.related-answers{border-top:1px solid var(--line);margin-top:58px;padding-top:28px}
.related-answers h2{margin-top:0}
.related-answers ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.related-answers a:not(.button){color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
.answer-faq{border-top:1px solid var(--line);margin-top:28px}
.answer-faq details{border-bottom:1px solid var(--line);padding:18px 0}
.answer-faq summary{cursor:pointer;font-weight:800;color:var(--white)}
.answer-faq summary::marker{color:var(--cyan)}
.answer-faq details p{margin:12px 0 0}
.work-index{margin-top:34px}
.work-entry{display:grid;grid-template-columns:minmax(220px,.85fr) 1.15fr;gap:28px;border-top:1px solid var(--line);padding:28px 0 34px}
.work-entry:last-child{border-bottom:1px solid var(--line)}
.work-entry-visual{display:block;background:#11131a;align-self:start;overflow:hidden}
.work-entry-visual img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.work-entry h2{margin:8px 0 12px;font-size:clamp(1.65rem,3.4vw,2.65rem);line-height:1.02}
.work-entry p{margin:0 0 18px}
.work-proof-actions{display:flex;flex-wrap:wrap;gap:14px 22px}
.work-meta{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 20px;padding:0}
.work-meta li{border:1px solid var(--line);padding:7px 9px;color:var(--muted);font:500 .64rem/1.2 "DM Mono",ui-monospace,monospace;letter-spacing:.05em;text-transform:uppercase}
.work-detail{max-width:780px}
.work-detail h2{margin-top:54px}
.work-detail ul{max-width:760px;padding-left:1.35rem;color:var(--muted)}
.work-detail li{margin:.65rem 0}
.work-figure{margin:42px 0 0;background:#11131a;border:1px solid var(--line)}
.work-figure img{display:block;width:100%;height:auto}
.work-figure figcaption{padding:13px 16px;color:var(--muted);font-size:.78rem}
.work-figure-devices{margin:42px 0 0;background:radial-gradient(circle at 50% 25%,#182844 0%,#0c1729 65%,#060c17 100%);border:1px solid var(--line);border-radius:8px;overflow:visible;padding:clamp(28px,4.5vw,52px) clamp(18px,3.5vw,44px) 18px}
.case-study-device-stage{position:relative;width:100%;max-width:980px;margin:0 auto;aspect-ratio:1200/745;isolation:isolate}
.case-study-device-stage .project-device-showcase{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;isolation:isolate;filter:drop-shadow(0 20px 30px rgba(0,0,0,.45))}
.case-study-device-stage .hero-laptop{position:absolute;top:6%;right:2%;width:88%;aspect-ratio:16/10;display:block;padding:6px;border:1px solid #dce2eb;border-radius:13px 13px 6px 6px;background:linear-gradient(145deg,#f8fafc,#aab5c5 45%,#57657a);box-shadow:0 24px 42px rgba(0,0,0,.5),inset 0 0 0 2px #7f8b9b;transform:rotate(-1deg)}
.case-study-device-stage .hero-laptop-screen{position:relative;display:block;width:100%;height:100%;overflow:hidden;border:5px solid #111722;border-radius:8px 8px 3px 3px;box-shadow:inset 0 0 0 1px #717b88;background:#05080e}
.case-study-device-stage .hero-laptop-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.case-study-device-stage .hero-laptop-base{position:absolute;left:-8%;right:-8%;bottom:-25px;height:28px;background:linear-gradient(180deg,#e7ebf1 0%,#a8b2c1 38%,#687486 70%,#263144 100%);border:1px solid #727e8e;border-radius:2px 2px 15px 15px;box-shadow:0 14px 19px rgba(0,0,0,.4);clip-path:polygon(4% 0,96% 0,100% 42%,93% 100%,7% 100%,0 42%)}
.case-study-device-stage .hero-phone{position:absolute;z-index:2;left:2%;bottom:2%;display:block;width:clamp(120px,17vw,195px);aspect-ratio:390/844;padding:5px;border:2px solid #c8ced8;border-radius:36px;background:linear-gradient(140deg,#f4f5f8 0%,#8f98a7 18%,#242d3b 31%,#d1d6df 53%,#687386 75%,#e6e9ee);box-shadow:0 25px 45px rgba(0,0,0,.56),inset 0 0 0 2px #343d4b;transform:translateY(12%) rotate(-3deg)}
.case-study-device-stage .hero-phone-screen{display:block;width:100%;height:100%;overflow:hidden;border:3px solid #080b12;border-radius:27px;background:#05080e}
.case-study-device-stage .hero-phone-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.work-figure-devices figcaption{margin-top:26px;padding:14px 16px 4px;color:var(--muted);font-size:.82rem;text-align:center;border-top:1px solid rgba(255,255,255,.08)}
@media(max-width:640px){
.work-figure-devices{padding:22px 14px 14px}
.case-study-device-stage .hero-laptop{width:90%;top:6%;right:0;padding:4px;border-width:1px}
.case-study-device-stage .hero-laptop-screen{border-width:3px}
.case-study-device-stage .hero-laptop-base{bottom:-16px;height:17px}
.case-study-device-stage .hero-phone{width:clamp(88px,26vw,126px);padding:3px;border-radius:22px;transform:translateY(8%) rotate(-2deg)}
.case-study-device-stage .hero-phone-screen{border-radius:17px;border-width:2px}
}

.work-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:24px}
.work-links a:not(.button){color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
.work-related{border-top:1px solid var(--line);margin-top:58px;padding-top:28px}
.work-related h2{margin-top:0}
.work-related ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.work-related a:not(.button){color:var(--cyan);text-decoration:underline;text-underline-offset:4px}
@media(max-width:640px){.work-entry{grid-template-columns:1fr;gap:20px}.work-entry-visual{max-width:520px}}
@media(max-width:620px){h1{font-size:clamp(2.8rem,13vw,4.5rem)}}
footer{border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font-size:.8rem}
footer a{margin-left:12px}
@media(max-width:640px){.grid{grid-template-columns:1fr}.content{padding:62px 0 80px}.shell{width:min(var(--max),calc(100% - 32px))}footer a{display:inline-block;margin:8px 12px 0 0}}

.footer-payment-banner{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 12px;border:1px solid rgba(255,255,255,.16);border-radius:8px;color:var(--cyan);background:rgba(255,255,255,.035)}
.footer-payment-banner svg{width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;flex:0 0 22px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.7}
.footer-payment-banner span{display:grid;gap:2px;min-width:0}
footer .footer-payment-banner strong{color:inherit;font:800 .64rem/1 "DM Mono",monospace;letter-spacing:.09em;text-transform:uppercase}
footer .footer-payment-banner small{color:var(--muted);font:500 .62rem/1.2 "DM Mono",monospace;letter-spacing:.04em}