.cats-sec{background:var(--green);overflow:hidden}
.cats-sec__head{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap}
.cats-sec__head .display{font-size:clamp(2rem,5vw,3.4rem);font-weight:200}
.cats-sec__aside{display:flex;flex-direction:column}
.cats-sec__aside .btn{margin-top:1.6rem}
@media(min-width:768px){
  .cats-sec__aside{align-items:flex-end;text-align:right}
  .cats-sec__aside .btn{order:-1;margin:0 0 1.6rem}
}
.cats-row{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.cat{
  text-decoration:none;color:inherit;
  border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;position:relative;overflow:hidden;
  aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:space-between;
  transition:.55s var(--ease);background:linear-gradient(180deg,rgba(197,197,197,.05),rgba(197,197,197,0));
}
.cat:hover,.cat:focus-visible{transform:translateY(-6px);border-color:rgba(197,197,197,.45);outline:none}
.cat:hover .cat__glow{opacity:1}
.cat__glow{position:absolute;inset:auto -30% -40% -30%;height:70%;
  background:radial-gradient(50% 100% at 50% 100%,rgba(197,197,197,.22),transparent 70%);opacity:0;transition:.55s var(--ease)}
.cat .no{font-family:var(--t-display);font-size:.72rem;letter-spacing:.24em;color:var(--gray-2)}
.cat h3{font-family:var(--t-display);font-weight:300;font-size:clamp(1.3rem,2vw,1.7rem);position:relative;z-index:1}
.cat__icon{width:96px;height:auto;position:relative;z-index:1;opacity:.92;
  transition:transform .55s var(--ease),opacity .55s var(--ease)}
.cat:hover .cat__icon{transform:translateX(4px);opacity:1}
@media(max-width:1024px){.cats-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.cats-row{grid-template-columns:repeat(2,1fr)}}