:root{color-scheme:light;--bg:#f6f8fb;--surface:rgba(255,255,255,.82);--surface-solid:#fff;--surface-2:#eef2f7;--text:#16191d;--muted:#626970;--faint:#9aa0a6;--line:rgba(28,39,49,.12);--line-strong:rgba(28,39,49,.22);--blue:#0b57d0;--blue-soft:#d6e5ff;--green:#188038;--violet:#6d5bd0;--on-accent:#fff;--header:rgba(246,248,251,.76);--grid:rgba(11,87,208,.09);--hero-glow-a:rgba(55,126,255,.28);--hero-glow-b:rgba(57,205,156,.17);--shadow:0 24px 80px rgba(24,39,56,.09);--hero-progress:0;--hero-title-y:0px;--hero-title-scale:1;--hero-title-opacity:1;--hero-orbit:0deg;--hero-beam:0vw;--hero-copy-y:0px}
html[data-theme=dark]{color-scheme:dark;--bg:#0b0d10;--surface:rgba(21,25,30,.82);--surface-solid:#15191e;--surface-2:#101419;--text:#eef2f6;--muted:#9ba3ad;--faint:#68717d;--line:rgba(231,237,243,.11);--line-strong:rgba(231,237,243,.22);--blue:#8ab4f8;--blue-soft:#1c3352;--green:#63cf8b;--violet:#b5a7ff;--on-accent:#0a1726;--header:rgba(11,13,16,.72);--grid:rgba(138,180,248,.10);--hero-glow-a:rgba(60,126,255,.34);--hero-glow-b:rgba(56,208,158,.18);--shadow:0 30px 90px rgba(0,0,0,.28)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;min-width:320px;overflow-x:clip;background:var(--bg);color:var(--text);font-family:Inter,"Noto Sans SC","Microsoft YaHei",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.6;text-rendering:optimizeLegibility;transition:background-color .2s ease,color .2s ease}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}::selection{background:var(--blue);color:var(--on-accent)}
.skip-link{position:fixed;top:8px;left:8px;z-index:1000;transform:translateY(-160%);padding:10px 14px;border-radius:8px;background:var(--surface-solid);border:1px solid var(--line)}.skip-link:focus{transform:none}.shell{width:min(1240px,calc(100% - 48px));margin-inline:auto}
.site-header{position:fixed;z-index:100;top:14px;left:50%;width:min(1180px,calc(100% - 32px));min-height:62px;transform:translateX(-50%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:8px 10px 8px 14px;border:1px solid transparent;border-radius:16px;transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease,top .25s ease}.site-header.is-scrolled{top:10px;background:var(--header);border-color:var(--line);box-shadow:0 8px 30px rgba(0,0,0,.07);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3)}.brand{display:inline-flex;align-items:center;gap:10px;width:max-content;font-size:14px;font-weight:760;letter-spacing:.12em}.brand img{width:38px;height:38px;object-fit:contain}.top-nav{display:flex;align-items:center;gap:2px}.top-nav a,.header-account,.theme-toggle{min-height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;color:var(--muted);font-size:13px;font-weight:620}.top-nav a{padding:0 13px}.top-nav a:hover,.theme-toggle:hover,.header-account:hover{background:var(--surface);color:var(--text)}.header-actions{justify-self:end;display:flex;align-items:center;gap:6px}.theme-toggle{position:relative;width:40px;padding:0;border:0;background:transparent;cursor:pointer}.theme-glyph{width:18px;height:18px;display:block;border:1.7px solid currentColor;border-radius:50%;position:relative;overflow:hidden}.theme-glyph::after{content:"";position:absolute;inset:-2px 50% -2px -2px;background:currentColor}.theme-toggle[data-mode=light] .theme-glyph::after{inset:4px;border-radius:50%}.theme-toggle[data-mode=dark] .theme-glyph::after{inset:-2px -2px -2px 50%}.header-account{padding:0 13px;border:1px solid var(--line);background:transparent;color:var(--text)}
.hero{height:188svh;min-height:1100px;position:relative}.hero-sticky{position:sticky;top:0;height:100svh;min-height:680px;overflow:hidden;display:grid;align-items:center;isolation:isolate}.hero-atmosphere{position:absolute;inset:0;overflow:hidden;z-index:-2;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--blue) 5%,transparent),transparent 42%),var(--bg)}.hero-atmosphere::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent 72%,var(--bg) 100%);pointer-events:none}.grid-plane{position:absolute;width:150vw;height:90vh;left:50%;bottom:-47vh;transform:translateX(-50%) perspective(520px) rotateX(63deg) translateY(calc(var(--hero-progress) * -90px));transform-origin:center top;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,transparent,#000 26%,#000 72%,transparent)}.halo{position:absolute;border-radius:50%;filter:blur(4px)}.halo-a{width:min(68vw,920px);aspect-ratio:1;left:-16vw;top:-24vh;background:radial-gradient(circle,var(--hero-glow-a),transparent 66%);transform:translate3d(var(--hero-beam),calc(var(--hero-progress) * 80px),0)}.halo-b{width:min(54vw,720px);aspect-ratio:1;right:-12vw;bottom:-16vh;background:radial-gradient(circle,var(--hero-glow-b),transparent 68%);transform:translate3d(calc(var(--hero-beam) * -1),calc(var(--hero-progress) * -60px),0)}.orbit{position:absolute;left:50%;top:50%;border:1px solid var(--line-strong);border-radius:50%;transform-origin:center}.orbit-a{width:min(70vw,960px);height:min(34vw,470px);transform:translate(-50%,-50%) rotate(calc(-12deg + var(--hero-orbit)))}.orbit-b{width:min(56vw,760px);height:min(56vw,760px);transform:translate(-50%,-50%) rotate(calc(26deg - var(--hero-orbit)));border-color:color-mix(in srgb,var(--blue) 35%,transparent)}.beam{position:absolute;height:1px;background:linear-gradient(90deg,transparent,var(--blue),transparent);opacity:.45}.beam-a{width:74vw;left:-16vw;top:35%;transform:rotate(-14deg) translateX(var(--hero-beam))}.beam-b{width:68vw;right:-16vw;bottom:30%;transform:rotate(17deg) translateX(calc(var(--hero-beam) * -1))}
.hero-content{position:relative;z-index:2;padding-top:70px}.eyebrow,.section-index,.build-kicker,.system-type{margin:0;font-size:11px;font-weight:760;letter-spacing:.18em;text-transform:uppercase}.eyebrow{color:var(--muted);margin-bottom:20px}.hero-title{margin:0;width:100%;white-space:nowrap;font-size:clamp(76px,14.4vw,214px);line-height:.78;letter-spacing:-.085em;font-weight:840;transform:translateY(var(--hero-title-y)) scale(var(--hero-title-scale));transform-origin:left center;opacity:var(--hero-title-opacity);will-change:transform,opacity}.hero-word{display:inline}.hero-word-a{background:linear-gradient(110deg,var(--text) 20%,var(--blue) 92%);color:transparent;background-clip:text;-webkit-background-clip:text}.hero-word-b{margin-left:0;color:var(--text)}.hero-bottom{width:min(640px,58vw);margin-left:auto;margin-top:clamp(34px,7vh,80px);transform:translateY(var(--hero-copy-y));will-change:transform}.hero-copy{margin:0 0 22px;font-size:clamp(18px,2vw,25px);line-height:1.45;letter-spacing:-.02em;color:var(--muted)}.hero-actions{display:flex;flex-wrap:wrap;gap:10px}.button{min-height:46px;display:inline-flex;align-items:center;padding:0 18px;border-radius:9px;border:1px solid var(--line);font-size:14px;font-weight:700}.button-primary{background:var(--blue);border-color:var(--blue);color:var(--on-accent)}.button-primary:hover{filter:brightness(1.05)}.button-quiet:hover{background:var(--surface)}.scroll-cue{position:absolute;left:24px;bottom:26px;display:flex;align-items:center;gap:10px;color:var(--faint);font-size:9px;font-weight:760;letter-spacing:.2em;transform:rotate(-90deg) translateX(100%);transform-origin:left bottom}.scroll-cue i{width:54px;height:1px;background:var(--line-strong);position:relative}.scroll-cue i::after{content:"";position:absolute;width:14px;left:0;top:0;height:1px;background:var(--blue);animation:scroll-line 1.8s ease-in-out infinite}@keyframes scroll-line{0%,100%{transform:translateX(0);opacity:.3}50%{transform:translateX(40px);opacity:1}}
.build{position:relative;padding:120px 0 150px;display:grid;grid-template-columns:minmax(250px,.72fr) 1.4fr;gap:80px;align-items:start}.section-heading{position:sticky;top:130px}.section-index{color:var(--blue);margin-bottom:20px}.section-heading h2,.systems-head h2,.services-title h2,.closing h2{margin:0;font-size:clamp(44px,6vw,82px);line-height:.98;letter-spacing:-.055em}.build-list{display:grid;gap:18px}.build-card{min-height:52vh;position:relative;overflow:hidden;display:grid;grid-template-columns:90px 1fr;align-items:end;padding:clamp(28px,5vw,56px);border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow);backdrop-filter:blur(14px);transition:border-color .45s ease,transform .45s ease,background-color .45s ease}.build-card::before{content:"";position:absolute;inset:auto -20% -50% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--card-accent) 22%,transparent),transparent 70%);opacity:.35;transition:opacity .5s ease,transform .5s ease}.build-card[data-accent=blue]{--card-accent:var(--blue)}.build-card[data-accent=green]{--card-accent:var(--green)}.build-card[data-accent=violet]{--card-accent:var(--violet)}.build-card.is-active{border-color:color-mix(in srgb,var(--card-accent) 42%,var(--line));transform:translateX(-8px)}.build-card.is-active::before{opacity:.9;transform:scale(1.15)}.build-number{align-self:start;color:var(--faint);font-variant-numeric:tabular-nums;font-size:12px}.build-kicker{color:var(--card-accent);margin-bottom:10px}.build-card h3{margin:0 0 14px;font-size:clamp(30px,4vw,54px);line-height:1.06;letter-spacing:-.045em}.build-card p:last-child{margin:0;width:min(540px,100%);color:var(--muted);font-size:clamp(16px,1.5vw,20px)}
.transition-band{height:40vh;min-height:300px;overflow:hidden;display:grid;align-items:center;border-block:1px solid var(--line);background:var(--surface-2)}.transition-word{width:max-content;font-size:clamp(130px,24vw,360px);line-height:.7;font-weight:850;letter-spacing:-.09em;color:transparent;-webkit-text-stroke:1px var(--line-strong);opacity:.72;will-change:transform}.systems{padding:150px 0}.systems-head{display:grid;grid-template-columns:1fr minmax(280px,420px);gap:60px;align-items:end;margin-bottom:52px}.systems-intro{margin:0 0 6px;color:var(--muted);font-size:17px}.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.system-card{grid-column:span 4;min-height:290px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:28px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:0 1px 0 rgba(255,255,255,.04);transition:transform .28s ease,border-color .28s ease,background-color .28s ease}.system-card:hover{transform:translateY(-5px);border-color:var(--line-strong)}.system-card-featured{grid-column:span 8;min-height:420px;background:radial-gradient(circle at 80% 85%,color-mix(in srgb,var(--blue) 26%,transparent),transparent 45%),var(--surface)}.system-card-wide{grid-column:span 8}.system-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.system-arrow{font-size:18px;transition:transform .25s ease}.system-card:hover .system-arrow{transform:translate(3px,-3px)}.system-type{color:var(--muted)}.system-card h3{margin:0 0 10px;font-size:clamp(30px,3.7vw,54px);line-height:1;letter-spacing:-.05em}.system-card p{margin:0;max-width:520px;color:var(--muted);font-size:15px}.system-mark{position:absolute;right:38px;bottom:28px;width:180px;height:180px;opacity:.62}.system-mark span{position:absolute;inset:0;border:1px solid color-mix(in srgb,var(--blue) 50%,transparent);border-radius:50%}.system-mark span:nth-child(2){transform:scale(.66)}.system-mark span:nth-child(3){transform:scale(.32);background:color-mix(in srgb,var(--blue) 10%,transparent)}.cloud-lines{position:absolute;right:0;bottom:0;width:46%;height:100%;overflow:hidden;opacity:.7}.cloud-lines i{position:absolute;width:1px;height:140%;background:linear-gradient(transparent,color-mix(in srgb,var(--green) 55%,transparent),transparent);transform:rotate(36deg)}.cloud-lines i:nth-child(1){left:15%;top:-20%}.cloud-lines i:nth-child(2){left:38%;top:-10%}.cloud-lines i:nth-child(3){left:61%;top:-35%}.cloud-lines i:nth-child(4){left:84%;top:-5%}
.services{border-top:1px solid var(--line);background:var(--surface-2)}.services-inner{padding:120px 0 140px}.services-title{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:42px}.service-grid{border-top:1px solid var(--line)}.service-link{display:grid;grid-template-columns:1.1fr 1fr auto;gap:30px;align-items:center;min-height:76px;padding:0 8px;border-bottom:1px solid var(--line);transition:padding .25s ease,background-color .25s ease}.service-link:hover{padding-inline:18px;background:var(--surface)}.service-link span{font-size:18px;font-weight:650;letter-spacing:-.02em}.service-link small{color:var(--muted);font-size:13px}.service-link b{font-weight:500;color:var(--muted)}
.closing{min-height:82vh;position:relative;overflow:hidden;display:grid;align-items:center;background:var(--text);color:var(--bg)}.closing::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,color-mix(in srgb,var(--blue) 22%,transparent),transparent 68%);pointer-events:none}.closing-inner{position:relative;z-index:2}.closing .section-index{color:color-mix(in srgb,var(--bg) 64%,transparent)}.closing h2{font-size:clamp(64px,10vw,150px);max-width:1000px}.closing-links{display:flex;gap:24px;margin-top:44px}.closing-links a{font-size:14px;font-weight:700;color:color-mix(in srgb,var(--bg) 74%,transparent)}.closing-links a:hover{color:var(--bg)}.closing-orbit{position:absolute;width:min(75vw,1000px);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--bg) 20%,transparent);border-radius:50%;right:-28vw;top:-20%}.closing-orbit::before,.closing-orbit::after{content:"";position:absolute;border:inherit;border-radius:inherit;inset:13%}.closing-orbit::after{inset:31%}.site-footer{background:var(--bg);border-top:1px solid var(--line)}.footer-inner{min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-brand{display:flex;align-items:center;gap:10px;font-weight:760;letter-spacing:.1em;font-size:12px}.footer-brand img{width:28px;height:28px;object-fit:contain}.footer-meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:12px}.footer-meta a:hover{color:var(--text)}
.has-js .reveal{opacity:0;transform:translateY(34px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}.has-js .reveal.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:920px){.site-header{grid-template-columns:1fr auto}.top-nav{display:none}.shell{width:min(100% - 32px,1240px)}.hero-title{font-size:clamp(72px,18vw,150px)}.hero-word-b{margin-left:0}.hero-bottom{width:min(620px,82vw)}.build{grid-template-columns:1fr;gap:44px;padding-top:90px}.section-heading{position:static}.build-card{min-height:420px}.systems-head{grid-template-columns:1fr;gap:20px}.system-card,.system-card-featured,.system-card-wide{grid-column:span 6}.system-card-featured{min-height:360px}}
@media(max-width:640px){.site-header{top:8px;width:calc(100% - 16px);min-height:56px;padding:6px 7px 6px 10px;border-radius:13px}.brand img{width:34px;height:34px}.brand span{display:none}.header-account{min-height:38px;padding-inline:11px}.theme-toggle{min-height:38px}.shell{width:calc(100% - 28px)}.hero{height:172svh;min-height:980px}.hero-sticky{min-height:620px}.hero-content{padding-top:56px}.eyebrow{max-width:260px;line-height:1.7;margin-bottom:16px}.hero-title{font-size:clamp(60px,19.5vw,112px);line-height:.84;letter-spacing:-.075em}.hero-word-b{margin-left:0}.hero-bottom{width:100%;margin-top:46px}.hero-copy{font-size:18px;max-width:340px}.scroll-cue{display:none}.orbit-a{width:125vw;height:60vw}.orbit-b{width:105vw;height:105vw}.grid-plane{width:220vw}.build{padding:80px 0 100px}.section-heading h2,.systems-head h2,.services-title h2{font-size:clamp(42px,14vw,68px)}.build-card{min-height:390px;grid-template-columns:1fr;align-content:space-between;padding:26px}.build-card.is-active{transform:none}.build-card h3{font-size:34px}.transition-band{height:28vh;min-height:220px}.transition-word{font-size:44vw}.systems{padding:96px 0}.systems-head{margin-bottom:34px}.bento{grid-template-columns:1fr}.system-card,.system-card-featured,.system-card-wide{grid-column:1;min-height:270px}.system-card-featured{min-height:350px}.system-mark{width:130px;height:130px;right:20px;bottom:18px}.services-inner{padding:90px 0 110px}.service-link{grid-template-columns:1fr auto;gap:8px 16px;padding-block:14px}.service-link small{grid-column:1}.service-link b{grid-column:2;grid-row:1/span 2}.closing{min-height:72vh}.closing h2{font-size:clamp(58px,17vw,92px)}.closing-links{flex-wrap:wrap;gap:16px 24px}.footer-inner{min-height:120px;align-items:flex-start;flex-direction:column;justify-content:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}.hero-title,.hero-bottom,.grid-plane,.halo,.orbit,.beam,.transition-word{transform:none!important}.hero-title{opacity:1!important}.has-js .reveal{opacity:1;transform:none}}

/* Semantic card motifs */
.build-card > .build-number,
.build-card > .build-copy,
.system-card > .system-top,
.system-card > .system-copy {
  position: relative;
  z-index: 3;
}

.build-motif {
  position: absolute;
  z-index: 1;
  right: clamp(18px, 4vw, 54px);
  top: 34%;
  width: min(40%, 300px);
  aspect-ratio: 1.4;
  transform: translateY(-50%);
  color: var(--card-accent);
  opacity: .52;
  pointer-events: none;
  transition: opacity .45s ease, transform .55s cubic-bezier(.2,.7,.2,1);
}

.build-card.is-active .build-motif {
  opacity: .78;
  transform: translateY(-50%) scale(1.035);
}

.motif-software .window {
  position: absolute;
  width: 72%;
  height: 58%;
  border: 1px solid color-mix(in srgb, currentColor 52%, transparent);
  border-radius: 10px;
  background:
    linear-gradient(to bottom, color-mix(in srgb, currentColor 7%, transparent), transparent 22%),
    linear-gradient(90deg, color-mix(in srgb, currentColor 10%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, currentColor 10%, transparent) 1px, transparent 1px);
  background-size: auto, 24px 24px, 24px 24px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--surface-solid) 14%, transparent);
}
.motif-software .window::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 11px 0 0 color-mix(in srgb,currentColor 70%,transparent), 22px 0 0 color-mix(in srgb,currentColor 45%,transparent);
}
.motif-software .window-a { right: 2%; top: 6%; transform: rotate(4deg); }
.motif-software .window-b { right: 15%; top: 23%; transform: rotate(-3deg); opacity: .72; }
.motif-software .window-c { right: 30%; top: 41%; transform: rotate(2deg); opacity: .42; }

.motif-research svg,
.motif-infra svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.motif-research path,
.motif-infra path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
.motif-research .ghost,
.motif-infra .ghost {
  opacity: .34;
  stroke-dasharray: 5 7;
}
.motif-research circle,
.motif-infra circle {
  fill: var(--surface-solid);
  stroke: currentColor;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
.motif-research circle { filter: drop-shadow(0 0 8px color-mix(in srgb,currentColor 45%,transparent)); }
.motif-infra .core {
  fill: color-mix(in srgb,currentColor 15%,var(--surface-solid));
  stroke-width: 2;
}

.projects-motif,
.git-motif {
  position: absolute;
  z-index: 1;
  right: 22px;
  bottom: 20px;
  width: 138px;
  height: 116px;
  color: var(--blue);
  opacity: .5;
  pointer-events: none;
  transition: transform .32s ease, opacity .32s ease;
}
.system-card-projects:hover .projects-motif,
.system-card-github:hover .git-motif {
  opacity: .78;
  transform: translateY(-3px);
}

.projects-motif .project-node {
  position: absolute;
  width: 48px;
  height: 34px;
  border: 1px solid color-mix(in srgb,currentColor 55%,transparent);
  border-radius: 7px;
  background:
    linear-gradient(90deg, color-mix(in srgb,currentColor 11%,transparent) 1px, transparent 1px),
    var(--surface-solid);
  background-size: 10px 100%;
}
.projects-motif .node-a { left: 2px; top: 8px; }
.projects-motif .node-b { right: 2px; top: 39px; }
.projects-motif .node-c { left: 12px; bottom: 3px; }
.projects-motif .project-link {
  position: absolute;
  height: 1px;
  transform-origin: left center;
  background: color-mix(in srgb,currentColor 54%,transparent);
}
.projects-motif .link-a { width: 64px; left: 42px; top: 34px; transform: rotate(19deg); }
.projects-motif .link-b { width: 58px; left: 48px; top: 83px; transform: rotate(-23deg); }

.git-motif .git-trunk,
.git-motif .git-branch {
  position: absolute;
  width: 1px;
  background: color-mix(in srgb,currentColor 58%,transparent);
}
.git-motif .git-trunk { left: 39px; top: 8px; height: 99px; }
.git-motif .git-branch {
  left: 63px;
  top: 24px;
  height: 66px;
  transform: rotate(34deg);
  transform-origin: top;
}
.git-motif .git-dot {
  position: absolute;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  border: 2px solid currentColor;
  background: var(--surface-solid);
  box-shadow: 0 0 0 4px color-mix(in srgb,currentColor 8%,transparent);
}
.git-motif .dot-a { left: 39px; top: 16px; }
.git-motif .dot-b { left: 39px; top: 55px; }
.git-motif .dot-c { left: 39px; top: 97px; }
.git-motif .dot-d { left: 101px; top: 77px; }

@media (max-width: 920px) {
  .build-motif {
    width: min(38%, 280px);
    right: 28px;
    top: 34%;
  }
}

@media (max-width: 640px) {
  .build-motif {
    width: 52%;
    right: 14px;
    top: 31%;
    opacity: .36;
  }
  .build-card.is-active .build-motif { opacity: .53; }

  .projects-motif,
  .git-motif {
    width: 116px;
    height: 98px;
    right: 14px;
    bottom: 14px;
    opacity: .38;
  }

  .system-card-projects .system-copy,
  .system-card-github .system-copy {
    max-width: calc(100% - 92px);
  }
}