/* ============================================
   FEworks — WORKS FOR BUSINESS (sub pages)
   ============================================ */
:root{
  --bg:#080a10; --bg-2:#0d1018; --bg-3:#11141d;
  --fg:#e8eef0; --fg-2:#a0a8b0; --mute:#5a6068;
  --line:#1c2028; --line-2:#262a34;
  --r:#ff0044; --g:#00ffd0; --y:#ffd14a;
  --pad-x: clamp(20px, 4vw, 64px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--fg);
  font-family:"JetBrains Mono","Noto Sans JP",monospace;
  font-weight:300; font-size:14px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:200;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0px,rgba(255,255,255,.018) 1px,transparent 1px,transparent 4px);
}
a{color:inherit;text-decoration:none}

/* header */
.wk-header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px var(--pad-x);
  border-bottom:1px solid var(--line);
  background:rgba(8,10,16,.85); backdrop-filter:blur(10px);
  position:sticky; top:0; z-index:100;
}
.wk-brand{ font-family:Anton; font-size:20px; letter-spacing:.02em; transition:color .2s }
.wk-brand:hover{ color:var(--g) }
.wk-tag{ font-size:10px; letter-spacing:.25em; color:var(--g); text-transform:uppercase }
.wk-back{
  border:1px solid var(--g); color:var(--g);
  padding:8px 14px; font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  white-space:nowrap; transition:background .2s, color .2s;
}
.wk-back:hover{ background:var(--g); color:#000 }

/* category nav — sticky in-page anchors */
.wk-nav{
  display:flex; flex-wrap:wrap; gap:6px 24px; align-items:center;
  padding:14px var(--pad-x);
  border-bottom:1px solid var(--line);
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  position:sticky; top:0; z-index:99;
  background:rgba(8,10,16,.92); backdrop-filter:blur(10px);
}
.wk-nav a{ color:var(--mute); padding:4px 0; transition:color .2s }
.wk-nav a:hover{ color:var(--fg) }
.wk-nav a.on{ color:var(--g); border-bottom:1px solid var(--g) }
.wk-nav .wk-nav-top{
  margin-left:auto; color:var(--g);
  border:1px solid var(--g); padding:5px 12px;
  transition:background .2s, color .2s;
}
.wk-nav .wk-nav-top:hover{ background:var(--g); color:#000 }

/* stacked category sections */
.wk-sec{
  margin-top:64px; padding-top:56px;
  border-top:1px solid var(--line);
  scroll-margin-top:64px;
}
.wk-h2{
  font-family:Anton; font-size:clamp(34px,5.5vw,68px);
  line-height:.95; letter-spacing:.02em; text-transform:uppercase;
  margin-bottom:8px;
}
.wk-h2 i{ font-style:normal; color:var(--g) }

/* main */
.wk-main{ padding:48px var(--pad-x) 80px; max-width:1400px; margin:0 auto; }
.wk-kicker{ font-size:10px; letter-spacing:.3em; color:var(--r); text-transform:uppercase; margin-bottom:10px }
h1{
  font-family:Anton; font-size:clamp(40px,7vw,84px);
  line-height:.95; letter-spacing:.02em; text-transform:uppercase;
  margin-bottom:8px;
}
h1 i{ font-style:normal; color:var(--g) }
.wk-sub{ font-size:12px; letter-spacing:.2em; color:var(--fg-2); text-transform:uppercase; margin-bottom:42px }
.wk-sub b{ color:var(--g); font-weight:500 }

/* embed grid */
.wk-grid{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
}
.wk-grid.docs{ grid-template-columns:repeat(auto-fill, minmax(min(480px,100%), 1fr)); }
.wk-card{
  border:1px solid var(--line); background:var(--bg-2);
  padding:16px; display:flex; flex-direction:column; gap:12px;
}
.wk-card figcaption{ display:flex; justify-content:space-between; gap:10px; align-items:baseline }
.wk-card .t{ font-family:"Noto Sans JP"; font-size:13px; font-weight:500; color:var(--fg); letter-spacing:.02em }
.wk-card .no{ font-size:10px; color:var(--g); letter-spacing:.2em; white-space:nowrap }
.instagram-media{
  margin:0 !important; width:100% !important; min-width:0 !important; max-width:100% !important;
  background:#0d1018; border:1px solid var(--line-2) !important; border-radius:4px;
  min-height:560px;
}
.instagram-media a{ color:var(--g); font-size:11px; letter-spacing:.1em; display:inline-block; padding:14px }
.yt{ width:100%; aspect-ratio:16/9; border:0; background:#000; display:block }

.wk-note{ margin-top:36px; font-size:11px; color:var(--mute); letter-spacing:.05em; font-family:"Noto Sans JP" }

/* footer */
.wk-foot{
  padding:32px var(--pad-x); border-top:1px solid var(--line);
}
.wk-foot-cta{
  display:flex; align-items:center; justify-content:center; gap:10px;
  border:1px solid var(--g); color:var(--g);
  padding:16px; font-size:12px; letter-spacing:.25em; text-transform:uppercase;
  margin-bottom:20px; transition:background .2s, color .2s;
}
.wk-foot-cta:hover{ background:var(--g); color:#000 }
.wk-foot-row{
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  font-size:10px; letter-spacing:.2em; color:var(--mute); text-transform:uppercase;
}

@media(max-width:640px){
  .wk-grid{ grid-template-columns:1fr }
  .wk-header{ flex-wrap:wrap }
  .wk-tag{ display:none }
  .wk-main{ padding-top:32px }
  .wk-foot-cta{ font-size:11px; letter-spacing:.18em }
}