/* ============================================================
   rey_ — knowledge / toolset
   ============================================================ */
.dotgrid{
  position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(circle,rgba(244,244,242,.12) 1px,transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 20%,#000 25%,transparent 80%);
          mask-image:radial-gradient(120% 90% at 50% 20%,#000 25%,transparent 80%);
}
.kn{position:relative;z-index:2;}

/* hero */
.kn-hero{padding-top:clamp(120px,17vh,200px);padding-bottom:clamp(34px,6vh,70px);}
.kn-hero__title{margin:.18em 0 .5em;}
.kn-hero__title .u{color:var(--fg-dim);}
.kn-hero__lead{max-width:34ch;font-size:clamp(1.1rem,2.3vw,1.55rem);font-weight:300;line-height:1.45;color:var(--fg-dim);}
.kn-hero__lead b{color:var(--fg);font-weight:600;}
.kn-hero__count{margin-top:1.6em;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-mute);}

/* groups */
.kn-groups{padding-bottom:clamp(50px,10vh,120px);}
.kgroup{padding-block:clamp(34px,5vw,64px);border-top:1px solid var(--hair);}
.kgroup__head{display:flex;align-items:baseline;gap:18px;margin-bottom:clamp(22px,3vw,40px);}
.kgroup__idx{font-size:.78rem;color:var(--fg-mute);letter-spacing:.1em;}
.kgroup__label{font-size:clamp(1.1rem,2.4vw,1.7rem);font-weight:400;letter-spacing:-.01em;color:var(--fg);text-transform:lowercase;}
.kgroup__count{font-size:.78rem;color:var(--fg-mute);margin-left:auto;}

.kgroup__grid{
  display:grid;gap:clamp(10px,1.4vw,18px);
  grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));
}
.skill{
  display:flex;align-items:center;gap:18px;padding:clamp(16px,1.6vw,22px);
  border:1px solid var(--hair);background:rgba(255,255,255,.012);
  position:relative;overflow:hidden;isolation:isolate;
  transition:border-color .4s var(--ease),transform .4s var(--ease),background .4s var(--ease);
}
.skill::after{ /* scan sweep */
  content:"";position:absolute;left:0;top:0;height:100%;width:38%;z-index:-1;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);
  transform:translateX(-160%);transition:transform .7s var(--ease);
}
.skill:hover,.skill:focus-visible{border-color:var(--line);background:rgba(255,255,255,.04);transform:translateY(-3px);outline:none;}
.skill:hover::after,.skill:focus-visible::after{transform:translateX(360%);}
.skill__ic{flex:0 0 auto;width:clamp(44px,4vw,56px);height:clamp(44px,4vw,56px);display:grid;place-items:center;}
.skill__ic img{
  width:100%;height:100%;object-fit:contain;
  opacity:.92;transition:transform .45s var(--ease),opacity .4s;
  filter:saturate(1);
}
.skill:hover .skill__ic img,.skill:focus-visible .skill__ic img{transform:scale(1.08);opacity:1;}
.skill__meta{min-width:0;}
.skill__name{font-size:clamp(1rem,1.5vw,1.2rem);font-weight:400;letter-spacing:-.01em;line-height:1.15;color:var(--fg);}
.skill__tag{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-mute);margin-top:.5em;}

@media (max-width:560px){
  .skill{gap:14px;}
}