/* Resource cards (homepage + /resources/), on eddiegear.com's light theme. Each card keeps its
   resource's colour (--res) on the cover, as a preview of the themed landing page behind it. */
.res-hub{padding:84px 0 104px}
.res-head{max-width:780px;margin-bottom:52px}
.res-head h1{font-family:var(--serif);font-weight:350;font-size:clamp(40px,5.6vw,68px);line-height:1.04;letter-spacing:-.025em}
.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);border-radius:6px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-sm);transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.res-card:hover,.res-card:focus-visible{border-color:color-mix(in srgb,var(--res) 50%,transparent);transform:translateY(-6px);box-shadow:0 24px 48px -26px color-mix(in srgb,var(--res) 75%,transparent)}
.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) 88%,#1D2B3F),color-mix(in srgb,var(--res) 62%,#1D2B3F))}
.res-cover img{position:absolute;left:50%;top:30px;width:58%;height:auto;transform:translateX(-50%) rotate(-2deg);border-radius:2px;box-shadow:0 18px 40px -12px rgba(15,25,40,.55);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:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--res) 50%,#000);background:color-mix(in srgb,var(--res) 8%,#fff);border:1px solid color-mix(in srgb,var(--res) 35%,#fff);border-radius:2px;padding:4px 10px}
.res-title{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.2;color:var(--ink)}
.res-desc{font-size:14.5px;line-height:1.65;color:var(--ink-soft)}
.res-body .plink{margin-top:auto;align-self:flex-start;font-size:13.5px;font-weight:600;color:var(--ink-invert);background:var(--ink);padding:11px 18px;border-radius:3px;transition:background .25s var(--ease)}
.res-card:hover .plink{background:color-mix(in srgb,var(--res) 70%,#1D2B3F)}
.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:52px 0 72px}.res-grid{grid-template-columns:1fr}.res-cover{height:180px}}
@media (prefers-reduced-motion:reduce){.res-card,.res-cover img{transition:none}}
