/* /resources/ hub — sits on eddiegear.com's own look (style.css). Each card carries its
   resource's accent (--res) as a preview of the themed landing page behind it. */
.res-hub{padding:72px 0 96px;background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:22px 22px}
.res-head{max-width:760px;margin-bottom:48px}
.res-head h1{font-family:"Unbounded","Arial Black",sans-serif;font-weight:900;font-size:clamp(34px,5.4vw,58px);line-height:1.06;letter-spacing:-.02em}
.res-lede{margin-top:18px;max-width:60ch;font-size:17px;color:var(--ink-soft)}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.res-card{--res:var(--accent);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-strong);border-radius:var(--radius-md);overflow:hidden;text-decoration:none;color:var(--ink);transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.res-card:hover,.res-card:focus-visible{border-color:var(--res);transform:translateY(-6px);box-shadow:0 22px 44px -24px var(--res)}
.res-card:focus-visible{outline:2px solid var(--res);outline-offset:3px}
.res-cover{position:relative;display:block;height:210px;overflow:hidden;background:linear-gradient(160deg,color-mix(in srgb,var(--res) 34%,#0D0D0D),color-mix(in srgb,var(--res) 12%,#0D0D0D));border-bottom:3px solid var(--res)}
.res-cover img{position:absolute;left:50%;top:30px;width:58%;height:auto;transform:translateX(-50%) rotate(-2deg);border-radius:4px;box-shadow:0 18px 40px -12px rgba(0,0,0,.7);transition:transform .4s var(--ease)}
.res-card:hover .res-cover img{transform:translateX(-50%) rotate(0deg) translateY(-6px)}
.res-body{display:flex;flex-direction:column;gap:12px;flex:1;padding:24px 24px 26px}
.res-body .ptag{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb,var(--res) 65%,#fff);background:color-mix(in srgb,var(--res) 14%,transparent);border:1px solid color-mix(in srgb,var(--res) 45%,transparent);border-radius:20px;padding:4px 12px}
.res-title{font-family:"Crete Round",Georgia,serif;font-size:22px;line-height:1.25}
.res-desc{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.res-body .plink{margin-top:auto;align-self:flex-start;font-size:13.5px;font-weight:700;color:var(--ink-invert);background:var(--ink);padding:11px 18px;border-radius:100px;transition:background .25s var(--ease)}
.res-card:hover .plink{background:var(--accent)}
.res-fine{margin-top:44px;max-width:62ch;font-size:13.5px;color:var(--ink-softer)}
.res-fine a{color:var(--ink-soft)}
@media (max-width:980px){.res-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.res-hub{padding:44px 0 64px}.res-grid{grid-template-columns:1fr}.res-cover{height:180px}}
@media (prefers-reduced-motion:reduce){.res-card,.res-cover img{transition:none}.res-card:hover{transform:none}}