/* =========================================================================
   Resources — downloadable collateral grid. Reuses :root tokens from styles.css.
   ========================================================================= */

.res-hero__lead{ max-width:54ch; }

.res-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:var(--space-xl);
  max-width:1080px;
  margin-inline:auto;
}

.res-card{
  display:flex;
  flex-direction:column;
  background:var(--c-eclipse-2);
  border:1px solid var(--c-line);
  border-radius:var(--r-lg);
  padding:var(--space-2xl);
}
.res-card__title{ font-size:var(--fs-h3); color:var(--c-pale); margin:0 0 var(--space-sm); }
.res-card__desc{ font-size:var(--fs-sm); color:var(--t-on-dark-muted); margin:0 0 var(--space-lg); max-width:46ch; flex:1 1 auto; }
/* Download buttons behave like the Solutions P2S5 button: chevron-wipe (pale -> blue) with the
   icon dropping away on hover; pale focus ring (not blue-on-blue). */
.res-card__btn{ align-self:flex-start; position:relative; overflow:hidden; isolation:isolate; }
.res-card__btn::before{
  content:""; position:absolute; top:0; bottom:0; left:0; right:-22px; z-index:-1;
  background:var(--c-blue); transform:translateX(-102%);
  -webkit-clip-path:polygon(0 0, calc(100% - 15px) 0, 100% 50%, calc(100% - 15px) 100%, 0 100%);
  clip-path:polygon(0 0, calc(100% - 15px) 0, 100% 50%, calc(100% - 15px) 100%, 0 100%);
  transition:transform .42s var(--ease);
}
.res-card__btn:hover{ background:var(--c-pale); color:var(--c-white); }
.res-card__btn:hover::before{ transform:translateX(0); }
.res-card__btn:focus-visible{ outline-color:var(--c-pale); outline-offset:2px; }
.res-card__ico{ width:18px; height:18px; transition:transform .38s var(--ease), opacity .28s var(--ease); }
.res-card__btn:hover .res-card__ico{ transform:translateY(1.4rem); opacity:0; }
.res-card__btn .btn__label{ transition:transform .38s var(--ease); }
.res-card__btn:hover .btn__label{ transform:translateX(-0.6rem); }

@media (max-width:767.98px){
  .res-grid{ grid-template-columns:minmax(0,1fr); gap:var(--space-lg); }
  .res-card{ padding:var(--space-xl); }
}