:root{color-scheme:dark;--bg:#0d0f17;--text:#f5f7fc;--muted:#a0a9bc;--line:#ffffff15;--purple:#a347eb}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.7 Inter,system-ui,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #c18aff;outline-offset:6px}.skip{position:absolute;top:-100px}.skip:focus{top:12px;left:12px;z-index:20;background:#202334;padding:10px}header{height:86px;padding:0 max(28px,calc((100vw - 1280px)/2));display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line);background:#0d0f17e8;backdrop-filter:blur(18px)}.brand{font-size:23px;font-weight:800;letter-spacing:-1px;white-space:nowrap}.brand span{font-size:13px;font-weight:400;letter-spacing:0;color:var(--muted);margin-left:16px}nav{display:flex;gap:32px;align-items:center;font-size:14px}nav>a:first-child{color:var(--muted)}.contact{background:#8d35cb;padding:10px 18px;border-radius:9px;font-weight:600}.contact span{margin-left:14px}.hero{max-width:1280px;margin:auto;padding:98px 28px 0;text-align:center;background:radial-gradient(ellipse at 50% 35%,#62547e1c,transparent 67%)}.eyebrow{font-size:12px;letter-spacing:.17em;font-weight:600;color:#b1a1c9}.eyebrow>span{display:inline-block;width:6px;height:6px;background:#b47be4;border-radius:50%;margin:0 10px 2px 0}h1{font-size:clamp(40px,5.2vw,72px);line-height:1.13;letter-spacing:-.055em;margin:28px 0 25px;font-weight:700}h1 span,.closing h2 span{color:#9ba3b3}p{color:var(--muted)}.hero>p{font-size:18px;line-height:1.8;margin:0 0 32px}.button{display:inline-flex;gap:28px;align-items:center;border:1px solid #ffffff25;border-radius:99px;background:#ffffff05;padding:13px 24px;font-size:14px;font-weight:500;transition:background .2s,transform .2s}.button:hover{background:#ffffff10;transform:translateY(-2px)}.hero-bottom{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:74px 0 23px;margin-top:0;font-size:12px;letter-spacing:.03em;color:#8991a4}.projects{max-width:1280px;padding:75px 28px 0;margin:auto}.section-top{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:52px}h2{font-size:clamp(27px,3vw,40px);letter-spacing:-.04em;line-height:1.25;margin:17px 0 0}.section-top>p{font-size:14px;margin:0;flex-shrink:0}.project{display:grid;grid-template-columns:1.4fr 1fr;gap:65px;align-items:center;padding:0 0 72px;margin-bottom:72px;border-bottom:1px solid var(--line)}.project.reverse{grid-template-columns:1fr 1.4fr}.reverse .preview{order:2}.preview{display:block;border:1px solid #ffffff20;background:#171a25;border-radius:14px;overflow:hidden;box-shadow:0 25px 70px #0003;transition:transform .3s,border-color .3s}.preview:hover{transform:translateY(-5px);border-color:#a347eb88}.browser-bar{height:37px;display:flex;align-items:center;gap:5px;padding:0 14px}.browser-bar i{height:6px;width:6px;background:#ffffff25;border-radius:50%}.browser-bar span{font-size:11px;color:#a0a9bc;flex:1;text-align:center}.browser-bar b{font-size:14px;font-weight:400;color:#9aa2b4}.preview img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top;background:#e8e9ec}.number{font-size:14px;color:#ad82d1;letter-spacing:.06em}.number span{color:#8f98aa;margin-left:17px;font-size:12px}h3{font-size:clamp(26px,2.6vw,35px);font-weight:600;line-height:1.25;letter-spacing:-.035em;margin:19px 0}.project-copy p{font-size:15px;line-height:1.85;margin:0}.tags{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:22px 0 26px}.tags li{font-size:12px;padding:4px 10px;border:1px solid #ffffff16;border-radius:6px;color:#a9b1c1}.text-link{font-size:14px;font-weight:600;display:inline-flex;gap:34px;align-items:center}.text-link:hover{color:#c58ef1}.demo-note{font-size:13px;text-align:center;margin:-30px 0 0;color:#8c96aa}.closing{text-align:center;padding:100px 28px;background:radial-gradient(ellipse at 50% 100%,#69348216,transparent 65%)}.closing h2{font-size:clamp(32px,3.8vw,49px);line-height:1.22;margin:23px 0}.closing p{font-size:16px;margin-bottom:30px}.purple{background:#9238d0;border-color:#a753e6}.purple:hover{background:#a347eb}footer{border-top:1px solid var(--line);max-width:1280px;margin:auto;padding:30px 28px;display:flex;justify-content:space-between;gap:24px;align-items:center}footer p,footer>a:last-child{font-size:12px}footer p{margin:0}footer>a:last-child{color:var(--muted)}@media(max-width:1000px){.brand span{display:none}.project{gap:32px;grid-template-columns:1.2fr 1fr}.project.reverse{grid-template-columns:1fr 1.2fr}.section-top{display:block}.section-top>p{margin-top:18px}}@media(max-width:700px){header{height:75px;padding:0 20px}nav{gap:12px}nav>a:first-child{display:none}.brand{font-size:21px}.contact{font-size:12px;padding:9px 12px}.contact span{margin-left:5px}.hero{padding:66px 20px 0}h1{font-size:clamp(34px,8vw,52px);letter-spacing:-.05em}.hero>p{font-size:16px}.desktop{display:none}.hero-bottom{gap:20px;padding-top:55px;text-align:left;font-size:11px}.hero-bottom>span:last-child{text-align:right}.projects{padding:52px 20px 0}.section-top{margin-bottom:34px}.project,.project.reverse{grid-template-columns:1fr;gap:27px;padding-bottom:44px;margin-bottom:44px}.reverse .preview{order:0}.project-copy h3 br{display:none}.project-copy h3{font-size:29px;margin:13px 0}.project-copy p{font-size:16px}.tags{margin:18px 0}.demo-note{margin:0;text-align:left}.closing{padding:74px 20px}footer{padding:28px 20px;flex-wrap:wrap}footer p{order:3;flex-basis:100%}.eyebrow{font-size:11px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
