.page-hero{position:relative;overflow:hidden;padding:150px 0 30px}
.page-hero .wrap{position:relative;z-index:2}
#bg{position:absolute;inset:0;width:100%;height:100%}
.hero-fade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 80%,transparent) 40%,transparent 100%),linear-gradient(0deg,var(--bg) 0%,transparent 40%)}
.page-hero h1{font-size:clamp(44px,6.2vw,88px);line-height:.98;letter-spacing:-.045em;font-weight:600;margin-top:16px}
.page-hero h1 .s{color:var(--accent);display:block}
.stats{display:flex;gap:10px 34px;flex-wrap:wrap;margin-top:34px}
.stats div{border-left:2px solid var(--accent);padding-left:14px}
.stats b{display:block;font-size:28px;font-weight:600;letter-spacing:-.03em;line-height:1.1}
.stats span{font-size:14px;color:var(--muted)}
/* featured project */
.feat{display:block;margin-top:44px;border-radius:28px;overflow:hidden;background:var(--s1);border:1px solid var(--line);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.feat:hover{transform:translateY(-6px);box-shadow:0 50px 90px -60px color-mix(in srgb,var(--accent) 70%,#000)}
.stage{position:relative;aspect-ratio:16/8.2;overflow:hidden;background:radial-gradient(110% 90% at 85% 0%,color-mix(in srgb,var(--accent) 40%,var(--bg)) 0%,color-mix(in srgb,var(--accent) 10%,var(--bg)) 70%);display:flex;align-items:flex-end;justify-content:center}
.stage .shot{position:relative;width:72%;margin-bottom:-4%;border-radius:14px 14px 0 0;overflow:hidden;box-shadow:0 40px 80px -30px #000a;transform:translateY(6%);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.feat:hover .stage .shot{transform:translateY(0) scale(1.02)}
.stage .bar{height:28px;background:#eef1f6;display:flex;gap:6px;align-items:center;padding:0 12px}.stage .bar i{width:9px;height:9px;border-radius:50%;background:#cfd6e2}
.stage .shot img{width:100%;display:block}
.stage .chip{position:absolute;top:22px;left:22px;z-index:4;background:var(--s1);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;display:flex;gap:8px;align-items:center;box-shadow:0 10px 30px -14px #0006}
.stage .chip i{width:8px;height:8px;border-radius:50%;background:#1FA463}
.tint{isolation:isolate}.tint::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 26%,transparent),color-mix(in srgb,var(--accent) 10%,transparent));mix-blend-mode:multiply}
[data-theme="dark"] .tint::after{mix-blend-mode:soft-light;background:color-mix(in srgb,var(--accent) 40%,transparent)}
.fbody{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;padding:34px 36px 36px;align-items:end}
.fbody .k{font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.fbody h2{font-size:clamp(32px,3.6vw,50px);margin-top:8px;max-width:none}
.fbody p{color:var(--muted);margin-top:10px;max-width:52ch}
.meta{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;font-size:14.5px}
.meta dt{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.meta dd{margin:2px 0 0}
.go{grid-column:1/-1;margin-top:6px;font-weight:500;color:var(--accent)}.go b{display:inline-block;transition:transform .25s}.feat:hover .go b{transform:translateX(5px)}
/* next */
.next{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.nx{border:1px dashed color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:24px;padding:30px;display:flex;flex-direction:column;gap:10px;min-height:220px;background:color-mix(in srgb,var(--s1) 60%,transparent)}
.nx .k{font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.nx h3{font-size:24px;font-weight:600;letter-spacing:-.02em}
.nx p{color:var(--muted);font-size:15.5px;max-width:44ch}
.nx .btn{margin-top:auto;align-self:flex-start}
.nx.solid{border-style:solid;background:var(--ink);color:var(--bg);border-color:var(--ink)}.nx.solid p,.nx.solid .k{color:color-mix(in srgb,var(--bg) 70%,transparent)}
.nx.solid .btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
@media (max-width:860px){.fbody,.next{grid-template-columns:1fr}.stage{aspect-ratio:4/3}.stage .shot{width:90%}}
