@import url("https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,700;0,800;1,800&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400&display=swap");
:root{--ink:#15171A;--paper:#FDF5EC;--cobalt:#1515B8;--line:rgba(21,23,26,.15)}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,Arial,sans-serif;background:var(--paper);color:var(--ink);line-height:1.6}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
h1,h2,h3{font-family:Archivo,Arial,sans-serif;font-weight:800;line-height:1.1}
.mono{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--cobalt)}
header{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:22px 40px}
header img{height:46px;width:auto}
header nav{display:flex;gap:26px;flex-wrap:wrap;font-size:14px;font-weight:500}
header nav a:hover{color:var(--cobalt)}
.wrap{padding:40px 40px 100px;max-width:1280px;margin:0 auto}
h1{font-size:clamp(38px,6vw,72px);margin-bottom:18px}
.lead{max-width:560px;color:#555;font-size:17px;margin-bottom:48px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 28px}
.card .ph{aspect-ratio:4/3;overflow:hidden;border-radius:16px;margin-bottom:16px;background:#e9dfd2}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
a.card:hover img{transform:scale(1.04)}
.card h3{font-size:24px;margin-bottom:6px}.card p{font-size:14px;color:#666}
.card.soon{opacity:.6}.card .mono{display:block;margin-top:8px;color:#666}
.hero{aspect-ratio:21/9;overflow:hidden;border-radius:16px;margin:8px 0 36px}.hero img{width:100%;height:100%;object-fit:cover}
.meta{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:56px}
.meta .mono{display:block;margin-bottom:6px;color:#666}.meta p{font-size:15px}
.cols{display:grid;grid-template-columns:1fr 1.4fr;gap:40px 80px;margin-bottom:56px}
.cols h2{font-size:clamp(26px,3vw,38px)}.cols p{font-size:17px;color:#444;margin-bottom:18px}
ul.scope{list-style:none}ul.scope li{padding:14px 0;border-top:1px solid var(--line);font-size:17px}
ul.scope li:last-child{border-bottom:1px solid var(--line)}
.back{display:inline-block;margin-top:56px;font-weight:600;text-decoration:underline;text-underline-offset:5px}
footer{background:var(--ink);color:var(--paper);padding:70px 40px 36px}
footer h2{font-size:clamp(34px,6vw,64px);margin-bottom:28px}
footer .row{display:flex;gap:40px;flex-wrap:wrap;font-size:15px;opacity:.85}
@media(max-width:800px){header,.wrap,footer{padding-left:22px;padding-right:22px}.grid,.cols,.meta{grid-template-columns:1fr}.hero{aspect-ratio:4/3}header nav{gap:16px}}

.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:44px}
.chip{font:500 14px Inter,Arial,sans-serif;padding:10px 18px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--ink);cursor:pointer;transition:all .2s ease}
.chip:hover{border-color:var(--ink)}.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.tags span{font-size:12px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;color:#555}
.card[hidden]{display:none}.empty{padding:60px 0;color:#666;font-size:17px}
.vids{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:56px}.vids video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:16px;background:#e9dfd2}.wrap .mono a:hover{text-decoration:underline}a.card{display:block}@media(max-width:800px){.vids{grid-template-columns:repeat(2,1fr)}}
.vids video{cursor:pointer;transition:filter .5s ease}.vids video.dim{filter:brightness(.55)}

.bh{aspect-ratio:16/9;overflow:hidden;border-radius:16px;margin:10px 0 40px}.bh img{width:100%;height:100%;object-fit:cover}
.title-row{display:grid;grid-template-columns:1.1fr 1.6fr;gap:30px 60px;align-items:end;margin-bottom:40px}.title-row h1{margin:0}.lead2{font-size:clamp(18px,2vw,24px);color:#444;line-height:1.45}
.sl{margin:72px 0 24px}.big{font-size:clamp(28px,4.2vw,54px);line-height:1.1;margin-bottom:36px;max-width:980px}
.split{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:start;margin-bottom:24px}.split>img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px}
.step{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:20px 0;border-top:1px solid var(--line);font-size:19px}.step:last-child{border-bottom:1px solid var(--line)}.step b{font:400 13px "IBM Plex Mono",monospace;color:var(--cobalt);padding-top:5px}
.gal{columns:3;column-gap:16px}.gal img{width:100%;margin-bottom:16px;border-radius:16px;break-inside:avoid;display:block}
@media(max-width:800px){.title-row,.split{grid-template-columns:1fr}.bh{aspect-ratio:4/3}.gal{columns:2}.sl{margin-top:52px}}

.gal{display:flex;columns:auto;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.gal::-webkit-scrollbar{display:none}
.gal img{height:clamp(280px,42vw,520px);width:auto;max-width:none;flex:0 0 auto;scroll-snap-align:start;margin:0}
.arrows{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}.arrows button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:none;font-size:18px;cursor:pointer;color:var(--ink);transition:all .2s}.arrows button:hover{background:var(--ink);color:var(--paper)}
@media(max-width:800px){.gal{columns:auto}}

.oh{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;justify-content:space-between;align-items:center;padding:22px 40px}.oh img{height:46px;width:auto}
#mt{width:60px;height:44px;border-radius:22px;border:none;background:var(--paper);cursor:pointer;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center}#mt i{display:block;width:22px;height:2px;background:var(--ink)}
.mo{position:fixed;inset:0;background:var(--ink);z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;opacity:0;pointer-events:none;transition:opacity .4s}.mo.open{opacity:1;pointer-events:auto}.mo a{font:800 clamp(32px,6vw,56px) Archivo,Arial,sans-serif;color:var(--paper)}.mo a:hover{color:#6C7CFF}
.fh{position:relative;height:82vh;min-height:480px;overflow:hidden;display:flex;align-items:center;justify-content:center}.fh>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fb{position:relative;text-align:center;background:rgba(253,245,236,.64);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:8px;padding:20px 30px 18px;max-width:90%}.fb h1{font-size:clamp(28px,4vw,46px);margin:0 0 6px}.fb p{font-size:16px;color:#444}
@media(max-width:800px){.oh{padding:20px 22px}}

.fh::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60%;background:linear-gradient(to top,rgba(21,23,26,.7),rgba(21,23,26,0));pointer-events:none}
.fb{position:absolute;z-index:2;left:40px;bottom:44px;right:40px;max-width:none;text-align:left;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0;border-radius:0}
.fb h1{font-size:clamp(40px,7vw,88px);margin:0 0 10px;color:#f0e4cf}.fb p{font-size:clamp(16px,2vw,22px);color:#f0e4cf;margin:0}
@media(max-width:800px){.fb{left:22px;right:22px;bottom:30px}}
.step strong{display:block;font-size:20px;line-height:1.25}.step em{display:block;font-style:normal;color:#555;font-size:16px;margin-top:4px;line-height:1.5}
.gal.dev{gap:0}.gal.dev img{height:clamp(240px,34vw,420px);border-radius:0}
.cols.sep{margin-top:96px;padding-top:56px;border-top:1px solid var(--line)}