/* ===== INVESTOR RESOURCES — card grid with rising-fill hover ===== */
.inv-res{
  position:relative;z-index:1;
  padding:72px 24px 84px;
  background:linear-gradient(180deg,#fff 0%,var(--paper) 100%);
}
.inv-res-wrap{max-width:1112px;margin:0 auto;text-align:center}
.inv-res-title{
  margin:0;font-family:var(--f-d);font-weight:800;color:var(--ink);
  font-size:clamp(32px,4.4vw,48px);letter-spacing:-.025em;line-height:1.1;
}
.inv-res-line{
  display:block;width:70px;height:4px;margin:20px auto 46px;border-radius:4px;
  background:linear-gradient(90deg,var(--saf),var(--blue));
  transform-origin:center;
}

.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left}

/* ---- card ---- */
.res-card{
  --c:#167ec4;--glow:22,126,196;--tile:#e0edf7;
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;align-items:center;gap:20px;
  min-height:112px;padding:26px 28px;
  background:#fff;border:1px solid var(--line);border-radius:28px;
  color:var(--ink);text-decoration:none;
  box-shadow:0 2px 8px rgba(14,23,48,.04);
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,color .3s .05s,border-color .4s;
  opacity:0;transform:translateY(26px);
}
/* the colour that rises from the bottom */
.res-card::before{
  content:"";position:absolute;inset:-1px;z-index:-1;
  background:var(--c);
  transform:scaleY(0);transform-origin:50% 100%;
  transition:transform .5s cubic-bezier(.65,0,.25,1);
}
.res-card.in{opacity:1;transform:none;transition:opacity .6s ease calc(var(--i)*90ms),transform .6s cubic-bezier(.2,.8,.2,1) calc(var(--i)*90ms),box-shadow .4s,color .3s .05s,border-color .4s}
.res-card.in.settled{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,color .3s .05s,border-color .4s}

.res-card:hover,.res-card:focus-visible{
  transform:translateY(-5px);border-color:var(--c);color:#fff;outline:0;
  box-shadow:0 18px 36px rgba(var(--glow),.34),0 4px 10px rgba(var(--glow),.18);
}
.res-card:hover::before,.res-card:focus-visible::before{transform:scaleY(1)}
.res-card:active{transform:translateY(-2px) scale(.985)}
.res-card:focus-visible{box-shadow:0 0 0 4px rgba(var(--glow),.28),0 18px 36px rgba(var(--glow),.34)}

/* ---- icon tile ---- */
.res-ico{
  display:grid;place-items:center;flex:none;width:58px;height:58px;
  border-radius:18px;background:var(--tile);font-size:28px;line-height:1;
  transition:transform .45s cubic-bezier(.3,1.6,.4,1),background .35s;
}
.res-card:hover .res-ico,.res-card:focus-visible .res-ico{
  background:rgba(255,255,255,.26);transform:rotate(-9deg) scale(1.1);
}

/* ---- label ---- */
.res-txt{
  flex:1;font-family:var(--f-d);font-weight:700;font-size:18px;line-height:1.25;
  letter-spacing:-.01em;
}

/* ---- arrow bubble: ↗ becomes → on hover ---- */
.res-arrow{
  position:relative;flex:none;width:34px;height:34px;border-radius:50%;
  background:#f3f4f8;color:var(--ink);
  display:grid;place-items:center;font-size:15px;font-weight:700;
  transition:background .3s,color .3s,transform .4s cubic-bezier(.3,1.6,.4,1);
}
.res-arrow::before{content:"\2197";display:block;transition:transform .35s cubic-bezier(.3,1.6,.4,1)}
.res-card:hover .res-arrow,.res-card:focus-visible .res-arrow{background:#fff;color:var(--c);transform:scale(1.08)}
.res-card:hover .res-arrow::before,.res-card:focus-visible .res-arrow::before{transform:rotate(45deg)}

/* ---- per-card colours (sampled from the reference) ---- */
.rc-blue  {--c:#167ec4;--glow:22,126,196;--tile:#dfedf8}
.rc-teal  {--c:#0e9b8a;--glow:14,155,138;--tile:#dcf1ed}
.rc-amber {--c:#dc8a00;--glow:220,138,0;--tile:#fbecd9}
.rc-purple{--c:#794ed5;--glow:121,78,213;--tile:#ebe6f8}
.rc-indigo{--c:#243f8f;--glow:36,63,143;--tile:#dfe4ef}
.rc-red   {--c:#e03a2e;--glow:224,58,46;--tile:#fbe1e0}

/* heading line draws in */
.inv-res-line[data-reveal]{transform:scaleX(0);opacity:1}
.inv-res-line[data-reveal].in{transform:scaleX(1);transition:transform .7s cubic-bezier(.2,.8,.2,1) .15s}

/* ---- responsive ---- */
@media(max-width:980px){
  .res-grid{grid-template-columns:repeat(2,1fr);gap:16px}
}
@media(max-width:600px){
  .inv-res{padding:52px 14px 60px}
  .inv-res-line{margin-bottom:32px}
  .res-grid{grid-template-columns:1fr;gap:12px}
  .res-card{min-height:92px;padding:18px 20px;gap:16px;border-radius:24px}
  .res-ico{width:50px;height:50px;font-size:24px;border-radius:15px}
  .res-txt{font-size:16px}
}

/* touch devices have no hover: keep it tappable but calm */
@media(hover:none){
  .res-card:hover{transform:none;color:var(--ink);box-shadow:0 2px 8px rgba(14,23,48,.04);border-color:var(--line)}
  .res-card:hover::before{transform:scaleY(0)}
  .res-card:active::before{transform:scaleY(1)}
  .res-card:active{color:#fff;border-color:var(--c)}
}
@media(prefers-reduced-motion:reduce){
  .res-card,.res-card::before,.res-ico,.res-arrow,.res-arrow::before{transition-duration:.01s!important;transition-delay:0s!important}
  .res-card{opacity:1;transform:none}
}
