.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:52px;padding:0 22px;border:1px solid transparent;border-radius:999px;font-size:.92rem;font-weight:800;transition:transform .35s var(--ease),border-color .3s,background .3s,box-shadow .3s}
.button:hover{transform:translateY(-3px)}
.button--primary{background:var(--gradient);color:#fff;box-shadow:0 12px 32px rgba(73,82,255,.22)}
.button--primary:hover{box-shadow:0 18px 50px rgba(73,82,255,.32)}
.button--ghost{background:rgba(255,255,255,.025);border-color:var(--line-strong)}
.button--ghost:hover{background:rgba(255,255,255,.065);border-color:rgba(255,255,255,.32)}
.status{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:.67rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}
.status--ongoing{color:#a887ff;background:rgba(139,77,255,.1)}
.status--build{color:#68a2ff;background:rgba(47,114,255,.1)}
.brand{display:inline-flex;align-items:center;gap:11px;font-weight:800}
.brand__mark{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:linear-gradient(145deg,rgba(47,114,255,.2),rgba(139,77,255,.14));font-size:.78rem;letter-spacing:-.04em}
.brand__name{font-size:.92rem}
.tag-list,.skill-cloud{display:flex;flex-wrap:wrap;gap:8px}
.tag-list span,.skill-cloud span{padding:7px 10px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:999px;color:#c4c8d7;font-size:.72rem}
.text-link,.coming-soon{border:0;background:none;padding:0;color:var(--text);font-weight:800;font-size:.86rem}
.text-link{display:inline-flex;align-items:center;gap:9px}
.text-link span{transition:transform .3s var(--ease)}
.text-link:hover span{transform:translate(4px,-4px)}
.coming-soon{color:var(--muted-2);cursor:not-allowed}
.project-kicker{display:flex;align-items:center;justify-content:space-between;gap:14px;color:var(--muted-2);font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.feature-list{display:grid;gap:9px;margin-top:22px}
.feature-list li{position:relative;padding-left:20px;color:#b6bbcd;font-size:.88rem}
.feature-list li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--gradient)}
.section-heading{display:grid;grid-template-columns:1.35fr .65fr;gap:80px;align-items:end;margin-bottom:64px}
.section-heading h2{max-width:820px;margin-top:18px;font-family:var(--font-display);font-size:clamp(2.8rem,5.6vw,5.4rem);font-weight:700;line-height:.96;letter-spacing:-.065em}
.section-heading__copy{max-width:430px;color:var(--muted);font-size:.96rem}
.screenshot-frame{position:relative;padding:0;border:1px solid var(--line);border-radius:var(--radius-md);background:#0f1120;overflow:hidden;box-shadow:var(--shadow);text-align:left;transition:transform .6s var(--ease),border-color .3s}
.screenshot-frame:hover{transform:translateY(-7px) rotateX(1deg);border-color:rgba(116,124,255,.4)}
.screenshot-frame img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top center}
.browser-chrome{height:38px;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid var(--line);background:#111323;color:var(--muted-2);font-size:.7rem}
.browser-chrome span{width:7px;height:7px;border-radius:50%;background:#34384e}
.browser-chrome p{margin-left:7px}
.screen-glare{position:absolute;inset:38px 0 0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.07) 45%,transparent 58%);transform:translateX(-120%);transition:transform 1.1s var(--ease)}
.screenshot-frame:hover .screen-glare{transform:translateX(120%)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form label{display:grid;gap:7px;color:#c8ccda;font-size:.76rem;font-weight:700}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.035);padding:14px 15px;color:var(--text);outline:none;transition:border-color .25s,background .25s}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:rgba(87,112,255,.75);background:rgba(255,255,255,.055)}
.contact-form option{background:#121425}
.contact-form textarea{resize:vertical;min-height:136px}
.form-status{color:var(--muted-2);font-size:.75rem}
.form-status.is-success{color:var(--green)}
.form-status.is-error{color:#ff8b9a}
.toast{position:fixed;z-index:1200;left:50%;bottom:28px;transform:translate(-50%,140%);padding:12px 17px;border:1px solid var(--line-strong);border-radius:999px;background:rgba(13,15,28,.9);backdrop-filter:blur(16px);color:#fff;font-size:.8rem;box-shadow:var(--shadow-soft);transition:transform .45s var(--ease)}
.toast.show{transform:translate(-50%,0)}
.project-modal{width:min(870px,calc(100vw - 30px));max-height:min(86vh,850px);padding:0;border:1px solid var(--line-strong);border-radius:28px;background:#0d0f1e;color:var(--text);box-shadow:0 40px 120px rgba(0,0,0,.7);overflow:auto}
.project-modal::backdrop{background:rgba(1,2,9,.8);backdrop-filter:blur(12px)}
.modal-close{position:sticky;float:right;top:16px;right:16px;z-index:3;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#16192b;color:#fff;font-size:1.5rem}
.modal-case{padding:46px}
.modal-case__head{padding-right:44px}
.modal-case__head .status{margin-bottom:22px}
.modal-case h2{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,5rem);line-height:.95;letter-spacing:-.06em}
.modal-case__lead{max-width:700px;margin-top:22px;color:#c4c8d7;font-size:1.05rem}
.modal-case__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:34px 0}
.modal-case__grid div{padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025)}
.modal-case__grid small{display:block;color:var(--muted-2);font-size:.66rem;text-transform:uppercase;letter-spacing:.1em}
.modal-case__grid b{display:block;margin-top:8px;font-size:.9rem}
.modal-case__section{padding-top:28px;border-top:1px solid var(--line)}
.modal-case__section h3{font-size:1rem;margin-bottom:12px}
.modal-case__section p,.modal-case__section li{color:var(--muted);font-size:.9rem}
.modal-case__section ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.modal-case__section li{position:relative;padding-left:16px}
.modal-case__section li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--purple)}
.form-honeypot{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.contact-form .button:disabled{cursor:wait;opacity:.68;transform:none!important;filter:saturate(.7)}