:root{
  --vhc31-navy:#102b45;
  --vhc31-ink:#203b54;
  --vhc31-muted:#667f94;
  --vhc31-orange:#f47b20;
  --vhc31-blue:#2c7cc2;
  --vhc31-green:#3e9b5b;
}

.vhc31-section{
  position:relative;
  overflow:hidden;
  padding:84px 0 90px!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(244,123,32,.10),transparent 24%),
    radial-gradient(circle at 94% 5%,rgba(44,124,194,.10),transparent 22%),
    linear-gradient(180deg,#fffdfa 0%,#f4f9fc 100%)!important;
}

.vhc31-section:before,
.vhc31-section:after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  opacity:.55;
  filter:blur(1px);
}
.vhc31-section:before{width:360px;height:360px;left:-190px;bottom:-130px;background:radial-gradient(circle,rgba(62,155,91,.12),transparent 65%)}
.vhc31-section:after{width:420px;height:420px;right:-220px;top:100px;background:radial-gradient(circle,rgba(44,124,194,.12),transparent 65%)}

.vhc31-shell{position:relative;z-index:2}
.vhc31-head{max-width:900px;margin:0 auto 38px;text-align:center}
.vhc31-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  color:#ef6c1b;
  font-size:12px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.vhc31-kicker:before{content:"";width:34px;height:2px;background:linear-gradient(90deg,#f47b20,#86bd3a)}
.vhc31-head h2{margin:0 0 14px!important;color:#172d45!important;font-size:clamp(36px,4vw,56px)!important;line-height:1.05!important;letter-spacing:-.035em}
.vhc31-head p{max-width:820px;margin:0 auto!important;color:#6b8194!important;font-size:16px!important;line-height:1.7!important}

.vhc31-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.vhc31-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  border-radius:30px;
  background:#fff;
  border:1px solid rgba(23,55,85,.08);
  box-shadow:0 22px 50px rgba(15,43,68,.12);
  transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .38s ease;
  animation:vhc31Float 6s ease-in-out infinite;
}
.vhc31-card:nth-child(2){animation-delay:-1.8s}.vhc31-card:nth-child(3){animation-delay:-3.2s}
.vhc31-card:hover{transform:translateY(-10px) scale(1.012);box-shadow:0 34px 70px rgba(15,43,68,.18)}

.vhc31-media{position:relative;height:260px;overflow:hidden;background:#173755}
.vhc31-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.04);animation:vhc31Ken 13s ease-in-out infinite}
.vhc31-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,24,39,.03) 20%,rgba(7,24,39,.28) 72%,rgba(7,24,39,.62) 100%)}
.vhc31-fallback{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,#173755,#2d6a8d);color:rgba(255,255,255,.72);font-weight:900;letter-spacing:.15em;font-size:12px}

.vhc31-goal-badge{
  position:absolute;
  right:18px;
  top:18px;
  width:88px;
  height:88px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:24px;
  color:#fff;
  background:rgba(14,40,61,.70);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 12px 28px rgba(0,0,0,.20);
  backdrop-filter:blur(9px);
  animation:vhc31Badge 4.8s ease-in-out infinite;
}
.vhc31-goal-badge strong{font-size:28px;line-height:1}.vhc31-goal-badge span{margin-top:5px;font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.80;text-align:center}

.vhc31-body{position:relative;display:flex;flex-direction:column;flex:1;padding:26px 26px 28px}
.vhc31-body:before{content:"";position:absolute;left:0;top:0;width:100%;height:4px}
.vhc31-education .vhc31-body:before{background:linear-gradient(90deg,#f47b20,#ffb46d)}
.vhc31-health .vhc31-body:before{background:linear-gradient(90deg,#2c7cc2,#64bdf2)}
.vhc31-livelihood .vhc31-body:before{background:linear-gradient(90deg,#3e9b5b,#8bd366)}

.vhc31-eyebrow{display:block;margin-bottom:8px;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.vhc31-education .vhc31-eyebrow{color:#d96315}.vhc31-health .vhc31-eyebrow{color:#2474b1}.vhc31-livelihood .vhc31-eyebrow{color:#31804a}
.vhc31-card h3{margin:0 0 11px!important;color:#203b54!important;font-size:28px!important;line-height:1.12!important;letter-spacing:-.02em}
.vhc31-card p{margin:0 0 18px!important;color:#6b8194!important;font-size:14px!important;line-height:1.62!important}

.vhc31-goal-line{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:4px;color:#73899c;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.vhc31-goal-line strong{color:#203b54;font-size:18px;letter-spacing:0}
.vhc31-track{height:8px;margin:9px 0 8px;border-radius:999px;overflow:hidden;background:#edf2f5;box-shadow:inset 0 1px 2px rgba(0,0,0,.04)}
.vhc31-track span{display:block;width:100%;height:100%;transform:translateX(-88%);border-radius:inherit;animation:vhc31Sweep 5s ease-in-out infinite}
.vhc31-education .vhc31-track span{background:linear-gradient(90deg,#f47b20,#ffb46d)}
.vhc31-health .vhc31-track span{background:linear-gradient(90deg,#2c7cc2,#64bdf2)}
.vhc31-livelihood .vhc31-track span{background:linear-gradient(90deg,#3e9b5b,#8bd366)}
.vhc31-note{min-height:30px;margin-bottom:16px;color:#8a9baa;font-size:10px;line-height:1.4}

.vhc31-donate{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  min-height:52px!important;
  padding:14px 18px!important;
  border-radius:15px!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:900!important;
  text-decoration:none!important;
  box-shadow:0 13px 28px rgba(15,43,68,.15)!important;
  transition:transform .25s ease,box-shadow .25s ease,filter .25s ease!important;
}
.vhc31-education .vhc31-donate{background:linear-gradient(135deg,#ff9148,#f36a18)!important}
.vhc31-health .vhc31-donate{background:linear-gradient(135deg,#3e95d5,#1d6fb0)!important}
.vhc31-livelihood .vhc31-donate{background:linear-gradient(135deg,#55ac70,#31864d)!important}
.vhc31-donate:hover{transform:translateY(-3px);box-shadow:0 18px 34px rgba(15,43,68,.20)!important;filter:brightness(1.06)}

@keyframes vhc31Ken{0%,100%{transform:scale(1.04) translate3d(0,0,0)}50%{transform:scale(1.10) translate3d(-1.5%,-1%,0)}}
@keyframes vhc31Float{0%,100%{translate:0 0}50%{translate:0 -5px}}
@keyframes vhc31Badge{0%,100%{transform:rotate(0deg) translateY(0)}50%{transform:rotate(2deg) translateY(-3px)}}
@keyframes vhc31Sweep{0%,100%{transform:translateX(-88%)}50%{transform:translateX(-78%)}}

@media(max-width:1050px){.vhc31-grid{grid-template-columns:1fr 1fr}.vhc31-card:nth-child(3){grid-column:1/-1;max-width:650px;width:100%;justify-self:center}}
@media(max-width:720px){
  .vhc31-section{padding:60px 0 66px!important}
  .vhc31-grid{grid-template-columns:1fr;gap:18px}
  .vhc31-card:nth-child(3){grid-column:auto;max-width:none}
  .vhc31-card{animation:none}
  .vhc31-media{height:220px}
  .vhc31-card h3{font-size:25px!important}
  .vhc31-head h2{font-size:36px!important}
}
@media(prefers-reduced-motion:reduce){.vhc31-card,.vhc31-media img,.vhc31-goal-badge,.vhc31-track span{animation:none!important}.vhc31-card,.vhc31-donate{transition:none!important}}

/* V31.9 — bigger Vishwas branding on donation cards only */
.vhc31-card.vhc319-branded .vhc31-media{position:relative}
.vhc319-logo-plate{
  position:absolute;
  left:18px;
  top:18px;
  z-index:5;
  width:112px;
  height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border-radius:24px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 14px 34px rgba(0,0,0,.22);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  animation:vhc319LogoFloat 5s ease-in-out infinite;
}
.vhc319-logo-plate img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  border-radius:18px;
}
.vhc31-card.vhc319-branded .vhc31-goal-badge{right:18px;top:18px;z-index:5}
.vhc31-card.vhc319-branded .vhc31-body{overflow:hidden;isolation:isolate}
.vhc319-watermark{
  position:absolute;
  z-index:0;
  right:-7%;
  bottom:-7%;
  width:60%;
  max-height:82%;
  object-fit:contain;
  object-position:right bottom;
  opacity:.045;
  filter:grayscale(1);
  pointer-events:none;
  user-select:none;
  transform:rotate(-8deg);
}
.vhc31-card.vhc319-branded .vhc31-body > *:not(.vhc319-watermark){position:relative;z-index:1}
@keyframes vhc319LogoFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}
@media(max-width:720px){
  .vhc319-logo-plate{width:92px;height:92px;left:14px;top:14px;border-radius:21px;padding:7px}
  .vhc319-logo-plate img{border-radius:15px}
  .vhc319-watermark{width:68%;opacity:.04}
}
@media(prefers-reduced-motion:reduce){.vhc319-logo-plate{animation:none!important}}