@font-face{font-family:"WallmalliProjectCyrillic";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/project-cyrillic/project-cyrillic-700.ttf") format("truetype");unicode-range:U+0412,U+041A}
/* The project index shares the selected-work typography, imagery and controls. */
:root{--bg:#050505;--fg:#f4f4f7;--muted:#bfc0cf;--line:#9286ff;--accent:#6f79ff;--project-title-size:clamp(30px,2.64vw,44px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:"Manrope",Arial,sans-serif}
a{color:inherit;text-decoration:none}
.projects-page{max-width:1672px;margin:0 auto;padding:28px 5.25vw 56px;min-height:100svh}
.projects-top{display:flex;align-items:center;justify-content:space-between;gap:24px}
.projects-brand{font:700 21px/1.2 "Manrope",sans-serif;letter-spacing:-.05em}
.projects-brand sup{font-size:9px;margin-left:3px;vertical-align:top}
.projects-back{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 22px;border:1px solid #ffffff80;border-radius:999px;font:400 12px/1.4 "IBM Plex Mono",monospace}
.projects-back:hover{background:#7c72ff12;border-color:#b1a8ff}
.projects-hero{padding:36px 0 26px;border-bottom:1px solid #ffffff30}
.projects-kicker{margin:0 0 22px;font:400 13px/1.5 "IBM Plex Mono",monospace;color:var(--muted);letter-spacing:.06em}
.projects-page .projects-hero h1,html:lang(ru) .projects-page .projects-hero h1{margin:0;font:700 clamp(42px,5.2vw,82px)/1.04 "WallmalliProjectCyrillic","Unbounded",sans-serif;letter-spacing:-.035em}
.projects-hero h1 span{color:transparent;background:linear-gradient(155deg,#8584ff,#6967ff 40%,#5653df 70%,#7f7bff);background-clip:text;-webkit-background-clip:text}
.projects-sub{display:flex;justify-content:space-between;gap:24px;margin-top:28px;color:var(--muted);font:400 12px/1.6 "IBM Plex Mono",monospace;letter-spacing:.03em}
.projects-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding-top:24px}
.projects-page .projects-card{position:relative;display:block;isolation:isolate;min-width:0;height:clamp(440px,32vw,532px);padding:0;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#08080e;box-shadow:inset 0 0 1px #dedaff80;text-decoration:none;transform:none;transition:border-color .2s ease}
.projects-page .projects-card::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,transparent 38%,#00000018 54%,#000000a8 75%,#000000e6 100%)}
.projects-page .projects-card .project-cover{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:none!important;opacity:1;filter:none;border-radius:inherit}
.projects-page .projects-card .projects-card-caption{position:absolute;inset:auto 26px 26px;z-index:2;pointer-events:none}
.projects-card-caption small{display:block;margin:0 0 12px;color:#e1e1e8;font:400 15px/1.4 "IBM Plex Mono",monospace;letter-spacing:0}
.projects-page .projects-card h2{margin:0 0 16px;color:#fff;font:700 var(--project-title-size)/1.15 "Unbounded",sans-serif;letter-spacing:-.025em;text-transform:uppercase;overflow-wrap:anywhere;text-wrap:pretty}
.projects-card-description{display:block;max-width:calc(100% - 72px);margin:0;color:#eeeef4;font:400 20px/1.45 "Manrope",sans-serif;overflow-wrap:anywhere}
.projects-page .work-card-open{position:absolute;right:24px;bottom:24px;z-index:3;display:grid;place-items:center;width:50px;height:50px;border:1px solid currentColor;border-radius:50%;color:#fff;background:#0003;opacity:.65;pointer-events:none;transition:opacity .2s ease,background .2s ease}
.work-card-open svg{display:block;width:54%;height:54%;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.projects-card:is(:hover,:focus-visible) .work-card-open{opacity:1;background:#0006}
.projects-card:hover{border-color:#c9c2ff}
.projects-page a:focus-visible{outline:2px solid #b2aaff;outline-offset:4px}
.projects-card:focus-visible{outline-offset:-5px!important}
.projects-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:40px;padding-top:26px;border-top:1px solid #ffffff30;color:var(--muted);font:400 12px/1.6 "IBM Plex Mono",monospace}
@media(min-width:1672px){.projects-page{padding-inline:88px}}
@media(max-width:980px){:root{--project-title-size:32px}.projects-grid{grid-template-columns:1fr}.projects-page .projects-card{height:520px}.projects-card-description{font-size:18px}.projects-sub{flex-direction:column;gap:10px}}
@media(max-width:600px){:root{--project-title-size:26px}.projects-page{padding:22px 6vw 36px}.projects-top{flex-wrap:wrap;gap:18px}.projects-brand{font-size:19px}.projects-back{font-size:10px;min-height:44px;padding:10px 14px}.projects-hero{padding-top:30px}.projects-page .projects-hero h1,html:lang(ru) .projects-page .projects-hero h1{font-size:clamp(29px,7.6vw,44px);line-height:1.08}.projects-kicker{font-size:11px}.projects-sub{font-size:10px}.projects-grid{gap:18px;padding-top:24px}.projects-page .projects-card{height:520px;border-radius:20px}.projects-page .projects-card .projects-card-caption{inset:auto 20px 20px}.projects-card-caption small{font-size:11px}.projects-card-description{font-size:16px;max-width:calc(100% - 66px)}.projects-page .work-card-open{right:18px;bottom:18px;width:44px;height:44px}.projects-footer{flex-wrap:wrap;font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.projects-page .projects-card,.projects-page .work-card-open{transition:none}}
/* Keep title, description and opening control together without empty title slots. */
.projects-page .project-card-footer{display:grid;grid-template-columns:minmax(0,1fr) var(--project-icon-size,50px);align-items:center;gap:22px;min-height:var(--project-icon-size,50px)}
.projects-page .project-card-footer .projects-card-description{max-width:none}
.projects-page .project-card-footer .work-card-open{position:static;inset:auto}
@media(max-width:600px){.projects-page{--project-icon-size:44px}}