.grid-ministerios{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:18px;
  width:min(800px,100%);
  margin:20px auto 15px;
  opacity:0;
  animation:aparecer 1s ease 7.4s forwards
}

.ministerio-card{
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  padding:22px 18px;
  backdrop-filter:blur(4px);
  transform:translateY(20px);
  opacity:0;
  animation:aparecer 0.85s ease forwards;
  transition:border-color .3s ease
}

.ministerio-card:hover{
  border-color:rgba(57,211,83,.45);
  box-shadow:0 0 22px rgba(57,211,83,.18)
}

.ministerio-nombre{
  display:block;
  font-family:Arial,sans-serif;
  font-size:clamp(14px,1.6vw,17px);
  font-weight:400;
  letter-spacing:.22em;
  text-transform:uppercase;
  margin-bottom:10px;
  color:#fff;
  text-shadow:0 2px 12px #000
}

.ministerio-descripcion{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(13px,1.4vw,15px);
  line-height:1.4;
  opacity:.82;
  margin:0;
  text-shadow:0 1px 8px #000
}

.navegacion{
  margin-top:30px;
  text-align:center
}

.enlace-volver{
  display:inline-block;
  font-family:Arial,sans-serif;
  font-size:clamp(11px,1.3vw,13px);
  letter-spacing:.30em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  text-decoration:none;
  border:1px solid rgba(255,255,255,.28);
  padding:8px 24px;
  border-radius:30px;
  transition:all .3s ease
}

.enlace-volver:hover{
  color:#fff;
  border-color:rgba(57,211,83,.55);
  box-shadow:0 0 14px rgba(57,211,83,.3)
}

@media(max-width:600px){
  .grid-ministerios{
    margin-top:10px;
    gap:14px
  }
  .ministerio-card{
    padding:18px 14px
  }
  .ministerio-nombre{
    font-size:13px;
    letter-spacing:.18em
  }
  .ministerio-descripcion{
    font-size:12px
  }
  .navegacion{
    margin-top:20px
  }
}
