/* ============================================================
   HOME — hero canvas layout, active projects board, hero strip
   ============================================================ */

#heroBg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
.hero{padding:clamp(52px,8vw,108px) 0 clamp(48px,7vw,92px);border-bottom:1px solid var(--line);overflow:hidden;position:relative;}
.hero-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:clamp(36px,5vw,72px);position:relative;z-index:1;flex-wrap:wrap;gap:8px;}
.hero-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:start;position:relative;z-index:1;}
.hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(48px,8.5vw,144px);line-height:.93;letter-spacing:-0.034em;margin:0;font-variation-settings:"opsz" 144;}
.hero h1 .it{font-style:italic;font-weight:400;}
.hero h1 .dim{color:var(--muted);}
.hero h1 .acc{color:var(--accent);font-style:italic;}
.hero-desc{margin-top:clamp(28px,3vw,44px);}
.hero-desc p{font-size:clamp(14px,1.1vw,17px);line-height:1.62;color:var(--ink-2);max-width:48ch;margin:0 0 24px;}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;}
.hero-right{display:flex;flex-direction:column;gap:28px;min-height:1px;}

.active-projects{border:1px solid var(--line);background:var(--bg-soft);margin-top:clamp(40px,6vw,72px);position:relative;z-index:1;}
.active-projects .ap-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);}
.ap-grid{display:grid;grid-template-columns:repeat(4,1fr);}
.ap-item{padding:16px 18px;border-right:1px solid var(--line);}
.ap-item:nth-child(4){border-right:0;}
.ap-item .apname{font-family:var(--serif);font-size:18px;letter-spacing:-0.01em;line-height:1.1;}
.ap-item .apdetail{font-family:var(--mono);font-size:9.5px;color:var(--muted);margin-top:5px;}
.ap-item .apstatus{display:inline-block;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);border:1px solid color-mix(in oklab,var(--accent) 40%,transparent);padding:2px 7px;margin-top:6px;}

.hero-strip{margin-top:clamp(40px,6vw,80px);display:grid;grid-template-columns:2.4fr 1fr 1fr;gap:10px;height:clamp(240px,36vw,460px);position:relative;z-index:1;}

@media(max-width:860px){
  .hero-layout{grid-template-columns:1fr;}
  .hero-right{display:none;}
  .hero-strip{grid-template-columns:1fr 1fr;height:auto;}
  .hero-strip .frame{aspect-ratio:4/3;}
}
@media(max-width:560px){
  .ap-grid{grid-template-columns:1fr;}
  .ap-item{border-right:0;border-bottom:1px solid var(--line);}
  .ap-item:last-child{border-bottom:0;}
  .hero-strip{grid-template-columns:1fr;}
}